/* ============================================================
   TOMS Pro — Main Stylesheet
   Teacher Owner Management System Pro
   ============================================================ */

/* ── Variables ───────────────────────────────────────────── */
:root {
  --toms-primary:       #4361ee;
  --toms-primary-dark:  #3a56d4;
  --toms-secondary:     #7209b7;
  --toms-success:       #2dc653;
  --toms-warning:       #f4a261;
  --toms-danger:        #e63946;
  --toms-info:          #4cc9f0;
  --toms-dark:          #1a1a2e;
  --toms-dark-2:        #16213e;
  --toms-dark-3:        #0f3460;
  --toms-surface:       #ffffff;
  --toms-surface-2:     #f8f9fc;
  --toms-border:        #e8ecf3;
  --toms-text:          #1a1a2e;
  --toms-text-muted:    #6b7280;
  --toms-radius:        14px;
  --toms-radius-sm:     8px;
  --toms-shadow:        0 4px 24px rgba(67,97,238,.08);
  --toms-shadow-lg:     0 8px 40px rgba(67,97,238,.14);
  --toms-transition:    all .22s cubic-bezier(.4,0,.2,1);
  --toms-font:          'Segoe UI', system-ui, -apple-system, sans-serif;
}

/* Dark Mode */
.toms-dark-mode {
  --toms-surface:   #1e2235;
  --toms-surface-2: #252b40;
  --toms-border:    #2d3554;
  --toms-text:      #e2e8f0;
  --toms-text-muted:#94a3b8;
}

/* ── Base Reset ──────────────────────────────────────────── */
.toms-wrapper, .toms-wrapper * { box-sizing: border-box; font-family: var(--toms-font); }
.toms-wrapper { color: var(--toms-text); }
.toms-wrapper a { color: var(--toms-primary); text-decoration: none; }
.toms-wrapper a:hover { color: var(--toms-primary-dark); }

/* ── Layout ──────────────────────────────────────────────── */
.toms-wrapper  { padding: 0 0 40px; max-width: 100%; }
.toms-row      { display: flex; gap: 20px; margin-bottom: 20px; flex-wrap: wrap; }
.toms-col-4    { flex: 0 0 calc(33.333% - 14px); min-width: 260px; }
.toms-col-6    { flex: 0 0 calc(50% - 10px); min-width: 280px; }
.toms-col-8    { flex: 0 0 calc(66.666% - 10px); min-width: 300px; }
.toms-col-span-2 { grid-column: span 2; }

/* ── Header ──────────────────────────────────────────────── */
.toms-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 24px 0 20px;
  flex-wrap: wrap; gap: 14px;
}
.toms-header-left  { display: flex; align-items: center; gap: 16px; }
.toms-header-right { display: flex; align-items: center; gap: 12px; }
.toms-title        { font-size: 1.65rem; font-weight: 700; color: var(--toms-text); margin: 0; line-height: 1.2; }
.toms-title i      { color: var(--toms-primary); margin-right: 8px; }
.toms-subtitle     { color: var(--toms-text-muted); margin: 4px 0 0; font-size: .9rem; }

/* ── Cards ───────────────────────────────────────────────── */
.toms-card {
  background: var(--toms-surface);
  border: 1px solid var(--toms-border);
  border-radius: var(--toms-radius);
  box-shadow: var(--toms-shadow);
  overflow: hidden;
  margin-bottom: 20px;
  transition: var(--toms-transition);
}
.toms-card:hover { box-shadow: var(--toms-shadow-lg); }
.toms-card-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--toms-border);
  background: linear-gradient(135deg, var(--toms-surface) 0%, var(--toms-surface-2) 100%);
}
.toms-card-header h3 { margin: 0; font-size: 1rem; font-weight: 600; color: var(--toms-text); }
.toms-card-header h3 i { color: var(--toms-primary); margin-right: 8px; }
.toms-card-body { padding: 20px; }
.toms-scrollable { max-height: 350px; overflow-y: auto; }
.toms-text-center { text-align: center; }

/* ── Stat Cards ──────────────────────────────────────────── */
.toms-stats-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.toms-stat-card {
  border-radius: var(--toms-radius);
  padding: 20px;
  display: flex; align-items: center; gap: 16px;
  color: #fff;
  box-shadow: 0 4px 20px rgba(0,0,0,.12);
  transition: var(--toms-transition);
  cursor: default;
}
.toms-stat-card:hover { transform: translateY(-3px); box-shadow: 0 8px 32px rgba(0,0,0,.18); }
.toms-stat-blue   { background: linear-gradient(135deg,#4361ee,#3a56d4); }
.toms-stat-green  { background: linear-gradient(135deg,#2dc653,#22a049); }
.toms-stat-orange { background: linear-gradient(135deg,#f4a261,#e08030); }
.toms-stat-purple { background: linear-gradient(135deg,#7209b7,#5d0799); }
.toms-stat-red    { background: linear-gradient(135deg,#e63946,#c02832); }
.toms-stat-teal   { background: linear-gradient(135deg,#4cc9f0,#28a8d8); }
.toms-stat-icon   { font-size: 1.8rem; opacity: .9; }
.toms-stat-number { font-size: 2rem; font-weight: 800; display: block; line-height: 1; }
.toms-stat-label  { font-size: .78rem; opacity: .85; display: block; margin-top: 3px; text-transform: uppercase; letter-spacing: .4px; }

/* ── Buttons ─────────────────────────────────────────────── */
.toms-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 9px 18px; border-radius: var(--toms-radius-sm);
  font-size: .875rem; font-weight: 600; border: none; cursor: pointer;
  transition: var(--toms-transition); text-decoration: none; line-height: 1;
  white-space: nowrap;
}
.toms-btn:disabled { opacity: .55; cursor: not-allowed; }
.toms-btn-primary  { background: var(--toms-primary); color:#fff; }
.toms-btn-primary:hover  { background: var(--toms-primary-dark); color:#fff; transform:translateY(-1px); }
.toms-btn-success  { background: var(--toms-success); color:#fff; }
.toms-btn-success:hover  { background: #22a049; color:#fff; transform:translateY(-1px); }
.toms-btn-warning  { background: var(--toms-warning); color:#fff; }
.toms-btn-warning:hover  { background: #e08030; color:#fff; }
.toms-btn-danger   { background: var(--toms-danger); color:#fff; }
.toms-btn-danger:hover   { background: #c02832; color:#fff; }
.toms-btn-secondary{ background: #e5e7eb; color: var(--toms-text); }
.toms-btn-secondary:hover{ background:#d1d5db; color:var(--toms-text); }
.toms-btn-sm       { padding: 6px 12px; font-size: .8rem; }
.toms-btn-lg       { padding: 13px 28px; font-size: 1rem; }

/* ── Forms ───────────────────────────────────────────────── */
.toms-form-grid    { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.toms-form-group   { display: flex; flex-direction: column; gap: 6px; }
.toms-form-group label { font-size: .85rem; font-weight: 600; color: var(--toms-text-muted); }
.toms-form-row     { display: flex; gap: 12px; flex-wrap: wrap; }
.toms-form-check   { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.toms-form-check input[type="checkbox"] { width: 18px; height: 18px; cursor: pointer; }

.toms-input, .toms-select, .toms-textarea {
  width: 100%; padding: 10px 14px;
  border: 2px solid var(--toms-border);
  border-radius: var(--toms-radius-sm);
  font-size: .9rem; color: var(--toms-text);
  background: var(--toms-surface);
  transition: var(--toms-transition);
  outline: none;
  font-family: var(--toms-font);
}
.toms-input:focus, .toms-select:focus, .toms-textarea:focus {
  border-color: var(--toms-primary);
  box-shadow: 0 0 0 3px rgba(67,97,238,.12);
}
.toms-textarea  { resize: vertical; min-height: 100px; }
.toms-input-sm  { padding: 7px 12px; font-size: .82rem; max-width: 260px; }
.toms-shortcodes-ref { background: var(--toms-surface-2); padding: 16px; border-radius: var(--toms-radius-sm); line-height: 2.2; }
.toms-shortcodes-ref code { background: rgba(67,97,238,.1); color: var(--toms-primary); padding: 2px 8px; border-radius: 4px; font-size:.85rem; }

/* ── Tables ──────────────────────────────────────────────── */
.toms-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.toms-table th, .toms-table td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--toms-border); }
.toms-table th { font-weight: 600; color: var(--toms-text-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .5px; background: var(--toms-surface-2); }
.toms-table tr:last-child td { border-bottom: none; }
.toms-table tr:hover td { background: rgba(67,97,238,.04); }
.toms-user-cell { display: flex; align-items: center; gap: 10px; }
.toms-user-cell div { display: flex; flex-direction: column; }
.toms-user-cell small { color: var(--toms-text-muted); font-size:.78rem; }

/* ── Badges ──────────────────────────────────────────────── */
.toms-badge {
  display: inline-flex; align-items: center;
  padding: 3px 10px; border-radius: 50px;
  font-size: .72rem; font-weight: 700;
  background: var(--toms-primary); color: #fff;
}
.toms-badge-success    { background: var(--toms-success); color:#fff; }
.toms-badge-danger     { background: var(--toms-danger); color:#fff; }
.toms-badge-warning    { background: var(--toms-warning); color:#fff; }
.toms-badge-info       { background: var(--toms-info); color:#fff; }
.toms-badge-secondary  { background: #9ca3af; color:#fff; }
.toms-badge-submitted  { background: var(--toms-primary); color:#fff; }
.toms-badge-reviewed   { background: var(--toms-success); color:#fff; }
.toms-badge-draft      { background: #9ca3af; color:#fff; }
.toms-badge-master-admin { background:linear-gradient(135deg,#e63946,#7209b7); color:#fff; }
.toms-badge-owner        { background:linear-gradient(135deg,#7209b7,#4361ee); color:#fff; }
.toms-badge-teacher      { background:linear-gradient(135deg,#4361ee,#4cc9f0); color:#fff; }
.toms-role-badge { padding: 4px 12px; border-radius: 50px; font-size: .75rem; font-weight: 700; }

/* ── Alerts ──────────────────────────────────────────────── */
.toms-alert {
  padding: 12px 18px; border-radius: var(--toms-radius-sm);
  display: flex; align-items: center; gap: 10px; font-size: .875rem; font-weight: 500;
}
.toms-alert-success { background: rgba(45,198,83,.12); color:#1a7d36; border-left: 4px solid var(--toms-success); }
.toms-alert-danger  { background: rgba(230,57,70,.1);  color:#b02030; border-left: 4px solid var(--toms-danger); }
.toms-alert-warning { background: rgba(244,162,97,.12);color:#9a5b18; border-left: 4px solid var(--toms-warning); }
.toms-alert-info    { background: rgba(76,201,240,.1); color:#1a7090; border-left: 4px solid var(--toms-info); }

/* ── Avatars ─────────────────────────────────────────────── */
.toms-avatar, .toms-avatar img      { width:40px; height:40px; border-radius:50%; object-fit:cover; display:inline-block; }
.toms-avatar-sm, .toms-avatar-sm img{ width:32px; height:32px; border-radius:50%; object-fit:cover; display:inline-block; }
.toms-avatar-lg, .toms-avatar-lg img{ width:64px; height:64px; border-radius:50%; object-fit:cover; display:inline-block; border:3px solid var(--toms-primary); }

/* ── Notification Bell ───────────────────────────────────── */
.toms-notification-bell { position:relative; cursor:pointer; padding:8px; }
.toms-notification-bell i { font-size:1.4rem; color:var(--toms-text-muted); }
.toms-notification-bell .toms-badge { position:absolute; top:0; right:0; min-width:18px; height:18px; font-size:.65rem; }

/* ── Timeline ────────────────────────────────────────────── */
.toms-timeline { position:relative; padding-left: 28px; }
.toms-timeline::before { content:''; position:absolute; left:9px; top:0; bottom:0; width:2px; background: var(--toms-border); }
.toms-timeline-item { position:relative; margin-bottom:20px; }
.toms-timeline-dot { position:absolute; left:-24px; top:6px; width:14px; height:14px; border-radius:50%; background:var(--toms-primary); border:3px solid #fff; box-shadow:0 0 0 2px var(--toms-primary); }
.toms-dot-submitted { background:var(--toms-primary); box-shadow:0 0 0 2px var(--toms-primary); }
.toms-dot-reviewed  { background:var(--toms-success);  box-shadow:0 0 0 2px var(--toms-success); }
.toms-dot-draft     { background:#9ca3af; box-shadow:0 0 0 2px #9ca3af; }
.toms-timeline-content { background:var(--toms-surface-2); border-radius:var(--toms-radius-sm); padding:14px 16px; border:1px solid var(--toms-border); }
.toms-timeline-header { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:6px; }
.toms-timeline-header h4 { margin:0; font-size:.9rem; font-weight:600; }
.toms-timeline-date { color:var(--toms-text-muted); font-size:.78rem; margin-left:auto; }
.toms-timeline-content p { color:var(--toms-text-muted); font-size:.85rem; margin:4px 0 0; }

/* ── Activity Items ──────────────────────────────────────── */
.toms-activity-item { display:flex; align-items:flex-start; gap:12px; padding:10px 0; border-bottom:1px solid var(--toms-border); }
.toms-activity-item:last-child { border-bottom:none; }
.toms-activity-icon { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.85rem; flex-shrink:0; }
.toms-icon-report { background:rgba(67,97,238,.1); color:var(--toms-primary); }
.toms-icon-file   { background:rgba(45,198,83,.1);  color:var(--toms-success); }
.toms-icon-msg    { background:rgba(114,9,183,.1);  color:var(--toms-secondary); }
.toms-activity-content { flex:1; }
.toms-activity-content strong { display:block; font-size:.85rem; font-weight:600; }
.toms-activity-content span   { color:var(--toms-text-muted); font-size:.82rem; display:block; }
.toms-activity-content small  { color:var(--toms-text-muted); font-size:.75rem; }

/* ── Notifications ───────────────────────────────────────── */
.toms-notif-list  { display:flex; flex-direction:column; gap:2px; }
.toms-notif-item  { display:flex; gap:12px; padding:12px; border-radius:var(--toms-radius-sm); transition:var(--toms-transition); }
.toms-notif-item:hover { background:var(--toms-surface-2); }
.toms-notif-unread { background:rgba(67,97,238,.06); border-left:3px solid var(--toms-primary); }
.toms-notif-icon  { width:36px; height:36px; border-radius:50%; background:rgba(67,97,238,.1); color:var(--toms-primary); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.toms-notif-content strong { display:block; font-size:.85rem; font-weight:600; }
.toms-notif-content p { color:var(--toms-text-muted); font-size:.82rem; margin:2px 0; }
.toms-notif-content small { color:var(--toms-text-muted); font-size:.75rem; }

/* ── Teacher Cards ───────────────────────────────────────── */
.toms-teacher-card { display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid var(--toms-border); }
.toms-teacher-card:last-child { border-bottom:none; }
.toms-teacher-info { flex:1; }
.toms-teacher-info strong { display:block; font-size:.9rem; font-weight:600; }
.toms-teacher-info span   { color:var(--toms-text-muted); font-size:.78rem; display:block; }
.toms-teacher-meta { display:flex; gap:6px; margin-top:4px; flex-wrap:wrap; }

.toms-teacher-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 18px;
}
.toms-teacher-profile-card {
  background: var(--toms-surface);
  border: 1px solid var(--toms-border);
  border-radius: var(--toms-radius);
  padding: 20px;
  box-shadow: var(--toms-shadow);
  transition: var(--toms-transition);
}
.toms-teacher-profile-card:hover { transform: translateY(-4px); box-shadow: var(--toms-shadow-lg); }
.toms-teacher-profile-top { display:flex; gap:14px; margin-bottom:14px; }
.toms-teacher-photo { width:56px; height:56px; border-radius:50%; object-fit:cover; border:3px solid var(--toms-primary); flex-shrink:0; }
.toms-teacher-profile-info h3 { margin:0; font-size:1rem; font-weight:700; }
.toms-teacher-profile-info p  { margin:2px 0; font-size:.8rem; color:var(--toms-text-muted); }
.toms-teacher-profile-stats { display:flex; gap:8px; margin:12px 0; }
.toms-mini-stat { flex:1; text-align:center; background:var(--toms-surface-2); border-radius:var(--toms-radius-sm); padding:8px 4px; }
.toms-mini-stat span { display:block; font-size:1.1rem; font-weight:700; color:var(--toms-primary); }
.toms-mini-stat label{ display:block; font-size:.7rem; color:var(--toms-text-muted); margin-top:2px; }
.toms-teacher-last-report { font-size:.78rem; color:var(--toms-text-muted); padding:8px 0; border-top:1px solid var(--toms-border); }
.toms-teacher-owner-tag { font-size:.78rem; color:var(--toms-secondary); padding:4px 0; }
.toms-teacher-card-actions { display:flex; gap:8px; margin-top:10px; padding-top:10px; border-top:1px solid var(--toms-border); }

/* ── Files ───────────────────────────────────────────────── */
.toms-file-grid { display:flex; flex-direction:column; gap:10px; }
.toms-file-card, .toms-file-item {
  display:flex; align-items:center; gap:12px;
  padding:12px; background:var(--toms-surface-2);
  border-radius:var(--toms-radius-sm); border:1px solid var(--toms-border);
  transition:var(--toms-transition);
}
.toms-file-card:hover, .toms-file-item:hover { border-color:var(--toms-primary); }
.toms-file-icon, .toms-file-thumb {
  width:44px; height:44px; border-radius:var(--toms-radius-sm);
  display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex-shrink:0;
  background:rgba(67,97,238,.1); color:var(--toms-primary);
}
.toms-file-image { background:rgba(76,201,240,.12); color:#1a7090; }
.toms-file-video { background:rgba(114,9,183,.1);  color:var(--toms-secondary); }
.toms-file-pdf   { background:rgba(230,57,70,.1);  color:var(--toms-danger); }
.toms-file-doc   { background:rgba(67,97,238,.1);  color:var(--toms-primary); }
.toms-file-info, .toms-file-meta { flex:1; display:flex; flex-direction:column; }
.toms-file-info strong, .toms-file-meta strong { font-size:.85rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.toms-file-info span, .toms-file-meta small { color:var(--toms-text-muted); font-size:.75rem; }

/* ── Upload Zone ─────────────────────────────────────────── */
.toms-upload-zone {
  border: 3px dashed var(--toms-border);
  border-radius: var(--toms-radius);
  padding: 40px 20px;
  text-align: center;
  cursor: pointer;
  transition: var(--toms-transition);
  background: var(--toms-surface-2);
}
.toms-upload-zone:hover, .toms-drag-over {
  border-color: var(--toms-primary);
  background: rgba(67,97,238,.04);
}
.toms-upload-icon { font-size: 2.5rem; color: var(--toms-primary); margin-bottom: 12px; display: block; }
.toms-upload-zone p { color: var(--toms-text-muted); margin: 8px 0 4px; font-size:.9rem; }
.toms-upload-zone small { color:var(--toms-text-muted); font-size:.78rem; }
.toms-upload-progress { height: 6px; background: var(--toms-border); border-radius: 10px; overflow: hidden; }
.toms-progress-fill { height: 100%; background: linear-gradient(90deg,var(--toms-primary),var(--toms-secondary)); border-radius:10px; transition: width .3s ease; }
.toms-file-preview-item { display:flex; align-items:center; gap:10px; padding:10px 14px; background:var(--toms-surface-2); border-radius:var(--toms-radius-sm); border:1px solid var(--toms-border); font-size:.875rem; }

/* ── Location ────────────────────────────────────────────── */
.toms-location-info { text-align:center; padding:24px; }
.toms-loc-icon { font-size:3rem; color:var(--toms-primary); display:block; margin-bottom:12px; }
.toms-location-hero { padding:40px 20px; text-align:center; }
.toms-loc-pin-icon { font-size:4rem; color:var(--toms-danger); display:block; margin-bottom:14px; }
.toms-location-success { display:flex; align-items:center; gap:16px; padding:16px; background:rgba(45,198,83,.1); border-radius:var(--toms-radius-sm); border:1px solid rgba(45,198,83,.3); }
.toms-location-success i { font-size:2rem; color:var(--toms-success); }

/* ── Chat ────────────────────────────────────────────────── */
.toms-chat-full-wrapper {
  display: flex;
  height: 600px;
  border-radius: var(--toms-radius);
  border: 1px solid var(--toms-border);
  overflow: hidden;
  box-shadow: var(--toms-shadow-lg);
}
.toms-chat-contacts {
  width: 280px;
  flex-shrink: 0;
  border-right: 1px solid var(--toms-border);
  display: flex;
  flex-direction: column;
  background: var(--toms-surface);
}
.toms-chat-contacts-header {
  padding: 16px 18px;
  border-bottom: 1px solid var(--toms-border);
  background: linear-gradient(135deg,var(--toms-dark),var(--toms-dark-3));
  color: #fff;
  display: flex; align-items: center; justify-content: space-between;
}
.toms-chat-contacts-header h3 { margin:0; font-size:.95rem; color:#fff; }
.toms-contact-list { flex:1; overflow-y:auto; }
.toms-contact-item {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px; cursor: pointer;
  border-bottom: 1px solid var(--toms-border);
  transition: var(--toms-transition);
}
.toms-contact-item:hover, .toms-contact-item.active { background: rgba(67,97,238,.08); }
.toms-contact-avatar { position: relative; }
.toms-online-indicator { width:10px; height:10px; border-radius:50%; background:var(--toms-success); border:2px solid #fff; position:absolute; bottom:0; right:0; }
.toms-contact-info { flex:1; overflow:hidden; }
.toms-contact-info strong { display:block; font-size:.85rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.toms-role-label { color:var(--toms-text-muted); font-size:.72rem; }
.toms-chat-area {
  flex: 1;
  display: flex;
  flex-direction: column;
  background: var(--toms-surface-2);
  overflow: hidden;
}
.toms-chat-top-bar {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px;
  background: var(--toms-surface);
  border-bottom: 1px solid var(--toms-border);
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}
.toms-chat-top-bar strong { display:block; font-size:.9rem; font-weight:700; }
.toms-chat-top-bar small  { color:var(--toms-text-muted); font-size:.75rem; }

/* Chat Main (inside dashboards) */
.toms-chat-wrapper { display:flex; height:520px; border:1px solid var(--toms-border); border-radius:var(--toms-radius); overflow:hidden; }
.toms-chat-sidebar { width:220px; border-right:1px solid var(--toms-border); background:var(--toms-surface); padding:12px; }
.toms-chat-partner { display:flex; align-items:center; gap:10px; padding:10px; background:rgba(67,97,238,.06); border-radius:var(--toms-radius-sm); }
.toms-chat-main    { flex:1; display:flex; flex-direction:column; }
.toms-chat-header  { display:flex; align-items:center; gap:10px; padding:12px 16px; border-bottom:1px solid var(--toms-border); background:var(--toms-surface); }
.toms-chat-header strong { display:block; font-size:.9rem; }
.toms-chat-header small  { color:var(--toms-text-muted); font-size:.75rem; }

.toms-chat-messages, .toms-chat-messages-full {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  scroll-behavior: smooth;
}
.toms-chat-messages-full { height: 100%; }
.toms-loading-msgs { text-align:center; padding:30px; color:var(--toms-text-muted); }
.toms-chat-empty   { text-align:center; padding:40px 20px; color:var(--toms-text-muted); }
.toms-chat-empty-state { display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; color:var(--toms-text-muted); gap:12px; padding:20px; }
.toms-date-sep { text-align:center; margin:10px 0; }
.toms-date-sep span { background:var(--toms-border); color:var(--toms-text-muted); padding:3px 12px; border-radius:20px; font-size:.72rem; }

.toms-msg { display:flex; margin-bottom:6px; }
.toms-msg-out { justify-content: flex-end; }
.toms-msg-in  { justify-content: flex-start; }
.toms-msg-bubble {
  max-width: 70%;
  padding: 10px 14px;
  border-radius: 18px;
  font-size: .875rem;
  line-height: 1.5;
  position: relative;
  word-break: break-word;
}
.toms-msg-out .toms-msg-bubble { background: linear-gradient(135deg,var(--toms-primary),var(--toms-secondary)); color:#fff; border-bottom-right-radius:4px; }
.toms-msg-in  .toms-msg-bubble { background: var(--toms-surface); border:1px solid var(--toms-border); color:var(--toms-text); border-bottom-left-radius:4px; box-shadow:0 1px 4px rgba(0,0,0,.06); }
.toms-msg-meta { display:flex; align-items:center; justify-content:flex-end; gap:4px; margin-top:4px; }
.toms-msg-time { font-size:.68rem; opacity:.75; }
.toms-tick { font-size:.7rem; opacity:.75; }
.toms-tick-read { color:#34d058; opacity:1; }
.toms-msg-status { margin-left:4px; }

/* Chat file/location messages */
.toms-chat-img   { max-width:200px; border-radius:10px; cursor:zoom-in; display:block; margin:4px 0; }
.toms-chat-video { max-width:220px; border-radius:10px; display:block; }
.toms-pdf-msg    { display:flex; align-items:center; gap:8px; padding:8px 12px; background:rgba(230,57,70,.1); border-radius:8px; color:var(--toms-danger); text-decoration:none; font-size:.82rem; font-weight:600; }
.toms-file-msg   { display:flex; align-items:center; gap:8px; color:var(--toms-primary); text-decoration:none; font-size:.82rem; }
.toms-location-msg { display:flex; align-items:center; gap:8px; padding:8px 12px; background:rgba(45,198,83,.1); border-radius:8px; color:#1a7d36; font-weight:600; font-size:.82rem; }

.toms-chat-toolbar {
  display: flex; gap: 4px; padding: 8px 12px;
  border-top: 1px solid var(--toms-border);
  background: var(--toms-surface);
  position: relative;
}
.toms-chat-tool-btn {
  width: 36px; height: 36px; border-radius: 50%;
  border: none; background: transparent; cursor: pointer;
  color: var(--toms-text-muted); font-size: .9rem;
  display: flex; align-items: center; justify-content: center;
  transition: var(--toms-transition);
}
.toms-chat-tool-btn:hover { background: rgba(67,97,238,.1); color: var(--toms-primary); }
.toms-emoji-picker {
  position: absolute; bottom: 56px; left: 8px;
  background: var(--toms-surface); border: 1px solid var(--toms-border);
  border-radius: var(--toms-radius); padding: 10px;
  display: flex; flex-wrap: wrap; gap: 4px;
  width: 240px; box-shadow: var(--toms-shadow-lg); z-index: 100;
}
.toms-emoji { font-size: 1.2rem; cursor: pointer; padding: 4px; border-radius: 6px; transition:var(--toms-transition); }
.toms-emoji:hover { background: var(--toms-surface-2); transform: scale(1.3); }
.toms-chat-input-bar {
  display: flex; gap: 8px;
  padding: 10px 14px;
  background: var(--toms-surface);
  border-top: 1px solid var(--toms-border);
}
.toms-chat-input {
  flex: 1; padding: 10px 16px;
  border: 2px solid var(--toms-border);
  border-radius: 50px; font-size: .875rem;
  outline: none; transition: var(--toms-transition);
  background: var(--toms-surface-2);
  font-family: var(--toms-font);
}
.toms-chat-input:focus { border-color: var(--toms-primary); background: var(--toms-surface); }
.toms-chat-send-btn {
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--toms-primary); color: #fff;
  border: none; cursor: pointer; font-size: .9rem;
  display: flex; align-items: center; justify-content: center;
  transition: var(--toms-transition); flex-shrink:0;
}
.toms-chat-send-btn:hover { background: var(--toms-primary-dark); transform:scale(1.05); }
.toms-online-dot { display:inline-block; width:8px; height:8px; background:var(--toms-success); border-radius:50%; margin-left:4px; }

/* ── Tabs ────────────────────────────────────────────────── */
.toms-tab-bar {
  display: flex; gap: 4px;
  background: var(--toms-surface);
  border: 1px solid var(--toms-border);
  border-radius: var(--toms-radius);
  padding: 6px;
  margin-bottom: 18px;
  overflow-x: auto;
}
.toms-tab-btn {
  padding: 9px 18px;
  border-radius: var(--toms-radius-sm);
  border: none; background: transparent;
  cursor: pointer; font-size: .875rem; font-weight: 600;
  color: var(--toms-text-muted);
  transition: var(--toms-transition); white-space: nowrap;
  display: flex; align-items: center; gap: 7px;
}
.toms-tab-btn:hover { background: var(--toms-surface-2); color: var(--toms-text); }
.toms-tab-btn.active { background: var(--toms-primary); color: #fff; }
.toms-tab-panel { display: none; }
.toms-tab-panel.active { display: block; }

/* ── Modals ──────────────────────────────────────────────── */
.toms-modal-content  { border: none; border-radius: var(--toms-radius); overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.2); }
.toms-modal-header   { background: linear-gradient(135deg,var(--toms-dark),var(--toms-dark-3)); color: #fff; padding: 16px 20px; }
.toms-modal-header h5{ margin:0; color:#fff; font-size:1rem; font-weight:700; }
.toms-modal-footer   { background: var(--toms-surface-2); padding: 14px 20px; }

/* ── Toast ───────────────────────────────────────────────── */
.toms-toast-container { position:fixed; bottom:20px; right:20px; z-index:9999; display:flex; flex-direction:column; gap:8px; }
.toms-toast {
  padding: 12px 20px; border-radius: var(--toms-radius-sm);
  color: #fff; font-size: .875rem; font-weight: 600;
  box-shadow: 0 4px 20px rgba(0,0,0,.2);
  animation: tomsSlideIn .3s ease;
  display: flex; align-items: center; gap: 10px;
  max-width: 320px;
}
.toms-toast-success { background: var(--toms-success); }
.toms-toast-danger  { background: var(--toms-danger); }
.toms-toast-warning { background: var(--toms-warning); }
.toms-toast-info    { background: var(--toms-info); color: var(--toms-dark); }
@keyframes tomsSlideIn {
  from { transform:translateX(120%); opacity:0; }
  to   { transform:translateX(0); opacity:1; }
}

/* ── Chart Legend ────────────────────────────────────────── */
.toms-chart-legend { display:flex; align-items:center; gap:12px; justify-content:center; margin-top:12px; font-size:.8rem; }
.toms-legend-dot   { width:12px; height:12px; border-radius:50%; display:inline-block; }

/* ── Empty / Misc ────────────────────────────────────────── */
.toms-empty { color:var(--toms-text-muted); text-align:center; padding:30px 20px; font-size:.875rem; }
.toms-empty-full { grid-column:1/-1; text-align:center; padding:60px 20px; color:var(--toms-text-muted); }
.toms-empty-full i { display:block; margin-bottom:16px; }
.toms-map-placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center; height:350px; background:var(--toms-surface-2); border-radius:var(--toms-radius); color:var(--toms-text-muted); gap:10px; }
.toms-map-placeholder i { font-size:3rem; }

/* ── Admin bar ───────────────────────────────────────────── */
#wpadminbar #wp-admin-bar-toms-notifications .ab-label { background:var(--toms-danger); color:#fff; border-radius:50px; padding:1px 7px; font-size:.68rem; font-weight:700; margin-left:4px; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .toms-row        { flex-direction:column; }
  .toms-col-4, .toms-col-6, .toms-col-8 { flex:1 1 100%; }
  .toms-form-grid  { grid-template-columns:1fr; }
  .toms-col-span-2 { grid-column:span 1; }
  .toms-chat-full-wrapper { flex-direction:column; height:auto; }
  .toms-chat-contacts { width:100%; height:180px; border-right:none; border-bottom:1px solid var(--toms-border); }
  .toms-chat-wrapper  { flex-direction:column; height:auto; }
  .toms-chat-sidebar  { width:100%; height:auto; border-right:none; border-bottom:1px solid var(--toms-border); }
  .toms-stats-grid { grid-template-columns: repeat(2,1fr); }
  .toms-tab-bar    { flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px; }
  .toms-title      { font-size:1.3rem; }
  .toms-header     { flex-direction:column; align-items:flex-start; }
}
@media (max-width: 480px) {
  .toms-stats-grid { grid-template-columns: 1fr; }
  .toms-teacher-grid { grid-template-columns: 1fr; }
}

/* ── Scrollbar ───────────────────────────────────────────── */
.toms-chat-messages::-webkit-scrollbar, .toms-chat-messages-full::-webkit-scrollbar, .toms-scrollable::-webkit-scrollbar, .toms-contact-list::-webkit-scrollbar { width:4px; }
.toms-chat-messages::-webkit-scrollbar-thumb, .toms-chat-messages-full::-webkit-scrollbar-thumb, .toms-scrollable::-webkit-scrollbar-thumb, .toms-contact-list::-webkit-scrollbar-thumb { background:var(--toms-border); border-radius:4px; }

/* ── WP Admin overrides ──────────────────────────────────── */
.toms-admin-wrap { padding-right: 20px; }