/* Camada visual consolidada do ambiente interno — carregada após o CSS histórico. */
:root {
  --ui-navy: #0b1e3d;
  --ui-navy-2: #102a55;
  --ui-blue: #2559d6;
  --ui-blue-dark: #1744ad;
  --ui-sky: #8fdbea;
  --ui-bg: #f4f7fb;
  --ui-surface: #ffffff;
  --ui-ink: #10234d;
  --ui-muted: #687793;
  --ui-line: #dce4f0;
  --ui-success: #1f956a;
  --ui-warning: #bf7a16;
  --ui-radius: 12px;
  --ui-shadow: 0 8px 24px rgba(17, 39, 78, .08);
}

body:has(.app-shell) {
  background: var(--ui-bg);
  color: var(--ui-ink);
}

body:has(.app-shell) .app-shell,
body:has(.app-shell) .main {
  background: var(--ui-bg);
}

body:has(.app-shell) .sidebar {
  background: linear-gradient(180deg, var(--ui-navy), #08182f) !important;
  border-right: 0 !important;
  box-shadow: 10px 0 28px rgba(8, 24, 47, .08);
}

body:has(.app-shell) .brand,
body:has(.app-shell) .sidebar .brand {
  color: #fff !important;
}

body:has(.app-shell) .brand small,
body:has(.app-shell) .nav-group-title {
  color: rgba(220, 233, 255, .58) !important;
}

body:has(.app-shell) .sidebar nav,
body:has(.app-shell) .nav-group {
  gap: 4px;
}

body:has(.app-shell) .nav-group {
  padding: 10px 0;
  border-bottom: 1px solid rgba(210, 228, 255, .1);
}

body:has(.app-shell) .nav-group:last-child { border-bottom: 0; }

body:has(.app-shell) .nav-button {
  min-height: 38px !important;
  padding: 8px 10px !important;
  border-radius: 8px !important;
  color: rgba(237, 245, 255, .78) !important;
  font-size: .86rem;
  font-weight: 600;
}

body:has(.app-shell) .nav-button:hover {
  background: rgba(143, 219, 234, .11) !important;
  color: #fff !important;
}

body:has(.app-shell) .nav-button.active {
  background: rgba(143, 219, 234, .18) !important;
  color: #fff !important;
  box-shadow: inset 3px 0 0 var(--ui-sky);
}

body:has(.app-shell) .topbar {
  min-height: 64px !important;
  padding: 10px 28px !important;
  background: rgba(255,255,255,.9) !important;
  border-bottom: 1px solid var(--ui-line) !important;
  box-shadow: none !important;
}

body:has(.app-shell) .view {
  padding: 26px 28px 36px !important;
}

body:has(.app-shell) h1,
body:has(.app-shell) h2,
body:has(.app-shell) h3 {
  color: var(--ui-ink);
  letter-spacing: -.025em;
}

body:has(.app-shell) .view-header,
body:has(.app-shell) .section-heading {
  margin-bottom: 16px !important;
}

body:has(.app-shell) .view-header p,
body:has(.app-shell) .section-heading p,
body:has(.app-shell) .muted,
body:has(.app-shell) .empty-state p {
  color: var(--ui-muted) !important;
}

body:has(.app-shell) .content-panel,
body:has(.app-shell) .course-card,
body:has(.app-shell) .ebook-card,
body:has(.app-shell) .purchase-card,
body:has(.app-shell) .favorite-card,
body:has(.app-shell) .annotation-card,
body:has(.app-shell) .certificate-card,
body:has(.app-shell) .library-group,
body:has(.app-shell) .agenda-card,
body:has(.app-shell) .admin-section,
body:has(.app-shell) .admin-dashboard-card {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius) !important;
  box-shadow: var(--ui-shadow) !important;
}

body:has(.app-shell) .content-panel { padding: 20px !important; }

body:has(.app-shell) .primary-button,
body:has(.app-shell) .button-primary,
body:has(.app-shell) button[type="submit"] {
  min-height: 40px !important;
  padding: 9px 14px !important;
  border: 1px solid var(--ui-blue) !important;
  border-radius: 8px !important;
  background: var(--ui-blue) !important;
  color: #fff !important;
  box-shadow: 0 4px 10px rgba(37, 89, 214, .18) !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
}

body:has(.app-shell) .primary-button:hover,
body:has(.app-shell) .button-primary:hover,
body:has(.app-shell) button[type="submit"]:hover {
  background: var(--ui-blue-dark) !important;
  border-color: var(--ui-blue-dark) !important;
  transform: translateY(-1px);
}

body:has(.app-shell) .secondary-button,
body:has(.app-shell) .ghost-button,
body:has(.app-shell) .outline-button {
  min-height: 40px !important;
  padding: 9px 13px !important;
  border: 1px solid #c8d5e9 !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #244477 !important;
  box-shadow: none !important;
  font-size: .86rem !important;
  font-weight: 700 !important;
}

body:has(.app-shell) .secondary-button:hover,
body:has(.app-shell) .ghost-button:hover,
body:has(.app-shell) .outline-button:hover {
  border-color: var(--ui-blue) !important;
  background: #f4f7ff !important;
  color: var(--ui-blue) !important;
}

body:has(.app-shell) input,
body:has(.app-shell) select,
body:has(.app-shell) textarea {
  border: 1px solid #cbd7e8 !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--ui-ink) !important;
  box-shadow: none !important;
}

body:has(.app-shell) input:focus,
body:has(.app-shell) select:focus,
body:has(.app-shell) textarea:focus {
  border-color: var(--ui-blue) !important;
  box-shadow: 0 0 0 3px rgba(37,89,214,.12) !important;
}

body:has(.app-shell) .student-dashboard-layout {
  gap: 20px !important;
}

body:has(.app-shell) .dashboard-metrics,
body:has(.app-shell) .metrics-grid {
  gap: 12px !important;
}

body:has(.app-shell) .metric-card,
body:has(.app-shell) .dashboard-stat {
  min-height: 112px !important;
  padding: 16px !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
  box-shadow: none !important;
}

body:has(.app-shell) .metric-card strong,
body:has(.app-shell) .dashboard-stat strong {
  color: var(--ui-blue) !important;
  font-size: 1.55rem !important;
}

body:has(.app-shell) .last-course-box,
body:has(.app-shell) .continue-learning-card {
  overflow: hidden;
  border: 0 !important;
  border-radius: var(--ui-radius) !important;
  background: var(--ui-navy) !important;
  box-shadow: 0 14px 28px rgba(11,30,61,.2) !important;
}

body:has(.app-shell) .last-course-box::before,
body:has(.app-shell) .continue-learning-card::before {
  opacity: .62 !important;
}

body:has(.app-shell) .last-course-content,
body:has(.app-shell) .continue-learning-content {
  padding: 24px !important;
}

body:has(.app-shell) .last-course-box h2,
body:has(.app-shell) .last-course-box h3,
body:has(.app-shell) .continue-learning-card h2,
body:has(.app-shell) .continue-learning-card h3 {
  color: #fff !important;
}

body:has(.app-shell) .last-course-box p,
body:has(.app-shell) .continue-learning-card p { color: rgba(255,255,255,.8) !important; }

body:has(.app-shell) .progress-track,
body:has(.app-shell) .progress-bar { background: #dfe7f3 !important; }
body:has(.app-shell) .progress-fill,
body:has(.app-shell) .progress-bar > span { background: linear-gradient(90deg, var(--ui-blue), #4a84f0) !important; }
body:has(.app-shell) .last-course-box .progress-track,
body:has(.app-shell) .continue-learning-card .progress-track { background: rgba(255,255,255,.22) !important; }
body:has(.app-shell) .last-course-box .progress-fill,
body:has(.app-shell) .continue-learning-card .progress-fill { background: var(--ui-sky) !important; }

body:has(.app-shell) .course-card,
body:has(.app-shell) .ebook-card {
  overflow: hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body:has(.app-shell) .course-card:hover,
body:has(.app-shell) .ebook-card:hover {
  border-color: #b8c9ea !important;
  box-shadow: 0 12px 26px rgba(17,39,78,.12) !important;
  transform: translateY(-2px);
}

body:has(.app-shell) .course-card img,
body:has(.app-shell) .ebook-card img { border-radius: 0 !important; }

body:has(.app-shell) .course-card-body,
body:has(.app-shell) .ebook-card-body { padding: 15px !important; }

body:has(.app-shell) .tag,
body:has(.app-shell) .pill,
body:has(.app-shell) .status-pill {
  border-radius: 999px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
}

body:has(.app-shell) .course-overview-hero,
body:has(.app-shell) .course-header {
  border-radius: var(--ui-radius) !important;
  box-shadow: 0 12px 28px rgba(11,30,61,.14) !important;
}

body:has(.app-shell) .course-overview-grid,
body:has(.app-shell) .course-detail-grid { gap: 18px !important; }

body:has(.app-shell) .module-item,
body:has(.app-shell) .lesson-item,
body:has(.app-shell) .lesson-row {
  border-color: var(--ui-line) !important;
}

body:has(.app-shell) .lesson-item.active,
body:has(.app-shell) .lesson-row.active {
  background: #edf3ff !important;
  color: var(--ui-blue) !important;
  border-color: #bcd0f7 !important;
}

body:has(.app-shell) .classroom-layout {
  gap: 18px !important;
}

body:has(.app-shell) .classroom-sidebar,
body:has(.app-shell) .lesson-navigation,
body:has(.app-shell) .lesson-notes-panel,
body:has(.app-shell) .classroom-content-panel {
  border: 1px solid var(--ui-line) !important;
  border-radius: var(--ui-radius) !important;
  background: #fff !important;
  box-shadow: var(--ui-shadow) !important;
}

body:has(.app-shell) .video-player,
body:has(.app-shell) .lesson-video-wrap { border-radius: var(--ui-radius) !important; overflow: hidden; }

body:has(.app-shell) .admin-tabs,
body:has(.app-shell) .admin-dashboard-tabs {
  gap: 6px !important;
  padding: 5px !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: 10px !important;
  background: #fff !important;
}

body:has(.app-shell) .admin-tab {
  min-height: 34px !important;
  padding: 7px 10px !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--ui-muted) !important;
  font-size: .82rem !important;
}

body:has(.app-shell) .admin-tab.active {
  background: #eaf1ff !important;
  color: var(--ui-blue) !important;
  box-shadow: none !important;
}

body:has(.app-shell) .empty-state {
  border: 1px dashed #c4d2e8 !important;
  border-radius: var(--ui-radius) !important;
  background: #fbfcfe !important;
}

@media (max-width: 900px) {
  body:has(.app-shell) .topbar { padding: 10px 18px !important; }
  body:has(.app-shell) .view { padding: 20px 18px 30px !important; }
  body:has(.app-shell) .student-dashboard-layout,
  body:has(.app-shell) .classroom-layout,
  body:has(.app-shell) .course-overview-grid { gap: 14px !important; }
}

@media (max-width: 760px) {
  body:has(.app-shell) .sidebar { box-shadow: 12px 0 30px rgba(8,24,47,.24) !important; }
  body:has(.app-shell) .topbar { min-height: 58px !important; padding: 8px 12px !important; }
  body:has(.app-shell) .view { padding: 16px 12px 26px !important; }
  body:has(.app-shell) .view-header { align-items: flex-start !important; gap: 10px !important; }
  body:has(.app-shell) .dashboard-metrics,
  body:has(.app-shell) .metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 9px !important; }
  body:has(.app-shell) .metric-card,
  body:has(.app-shell) .dashboard-stat { min-height: 96px !important; padding: 12px !important; }
  body:has(.app-shell) .metric-card strong,
  body:has(.app-shell) .dashboard-stat strong { font-size: 1.3rem !important; }
  body:has(.app-shell) .last-course-content,
  body:has(.app-shell) .continue-learning-content { padding: 18px !important; }
  body:has(.app-shell) .last-course-box h2,
  body:has(.app-shell) .continue-learning-card h2 { font-size: 1.3rem !important; }
  body:has(.app-shell) .primary-button,
  body:has(.app-shell) .secondary-button,
  body:has(.app-shell) .ghost-button,
  body:has(.app-shell) .outline-button { min-height: 38px !important; padding: 8px 11px !important; font-size: .82rem !important; }
  body:has(.app-shell) .course-grid,
  body:has(.app-shell) .ebook-grid { grid-template-columns: 1fr !important; }
  body:has(.app-shell) .admin-tabs,
  body:has(.app-shell) .admin-dashboard-tabs { overflow-x: auto; flex-wrap: nowrap !important; }
  body:has(.app-shell) .admin-tab { white-space: nowrap; }
}

/* Navegação administrativa: compacta e sóbria, sem botões em bloco. */
body:has(#adminDashboardView:not(.hidden)) #platformSidebar nav {
  gap: 3px !important;
}

body:has(#adminDashboardView:not(.hidden)) #platformSidebar .nav-item {
  min-height: 34px !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: rgba(237, 244, 255, .75) !important;
  font-size: .84rem !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}

body:has(#adminDashboardView:not(.hidden)) #platformSidebar .nav-item:hover {
  background: rgba(147, 191, 234, .11) !important;
  border-color: rgba(147, 191, 234, .12) !important;
  color: #fff !important;
}

body:has(#adminDashboardView:not(.hidden)) #platformSidebar .nav-item.active {
  background: rgba(100, 158, 219, .18) !important;
  border-color: rgba(128, 183, 238, .2) !important;
  box-shadow: inset 2px 0 0 #8fdbea !important;
  color: #fff !important;
}

body:not(.public-layout) #platformSidebar .admin-student-preview-access {
  display: grid;
  gap: 4px;
  margin: 10px 0 12px;
  padding: 10px;
  border-top: 1px solid rgba(190, 215, 245, .14);
  border-bottom: 1px solid rgba(190, 215, 245, .14);
}

body:not(.public-layout) #platformSidebar .admin-student-preview-link {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 8px;
  border: 1px solid rgba(143, 219, 234, .32);
  border-radius: 7px;
  background: rgba(143, 219, 234, .09);
  color: #dff7fb;
  font-size: .82rem;
  font-weight: 700;
  text-align: left;
}

body:not(.public-layout) #platformSidebar .admin-student-preview-link:hover {
  background: rgba(143, 219, 234, .17);
  border-color: rgba(143, 219, 234, .56);
}

body:not(.public-layout) #platformSidebar .admin-student-preview-link span { color: #8fdbea; }
body:not(.public-layout) #platformSidebar .admin-student-preview-access small { color: rgba(222, 238, 255, .58); font-size: .69rem; }

/* Navegação interna única: não muda de fonte, ícone ou geometria entre telas. */
body:not(.public-layout) #platformSidebar .nav-list {
  display: grid !important;
  gap: 3px !important;
  margin: 0 !important;
  padding: 0 !important;
}

body:not(.public-layout) #platformSidebar .nav-group {
  display: grid !important;
  gap: 3px !important;
  margin: 0 0 9px !important;
  padding: 0 0 9px !important;
  border-bottom: 1px solid rgba(190, 215, 245, .1) !important;
}

body:not(.public-layout) #platformSidebar .nav-group:last-child { border-bottom: 0 !important; }

body:not(.public-layout) #platformSidebar .nav-group > p {
  margin: 4px 9px 5px !important;
  color: rgba(220, 234, 255, .52) !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: .61rem !important;
  font-weight: 800 !important;
  letter-spacing: .11em !important;
  line-height: 1.1 !important;
}

body:not(.public-layout) #platformSidebar .nav-item,
body:not(.public-layout) #platformSidebar .nav-item:disabled {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 35px !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: rgba(237, 244, 255, .78) !important;
  font-family: Montserrat, Arial, sans-serif !important;
  font-size: .83rem !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  text-align: left !important;
  box-shadow: none !important;
  transform: none !important;
}

body:not(.public-layout) #platformSidebar .nav-item::before {
  content: attr(data-nav-icon) !important;
  display: inline-grid !important;
  width: 16px !important;
  min-width: 16px !important;
  place-items: center !important;
  color: rgba(218, 238, 255, .82) !important;
  font-family: Arial, sans-serif !important;
  font-size: .92rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
}

body:not(.public-layout) #platformSidebar .nav-item:hover {
  background: rgba(147, 191, 234, .1) !important;
  border-color: rgba(147, 191, 234, .12) !important;
  color: #fff !important;
}

body:not(.public-layout) #platformSidebar .nav-item.active {
  background: rgba(100, 158, 219, .18) !important;
  border-color: rgba(128, 183, 238, .18) !important;
  box-shadow: inset 2px 0 0 #8fdbea !important;
  color: #fff !important;
}

body:not(.public-layout) #platformSidebar .nav-item.active::before { color: #8fdbea !important; }

/* Painel administrativo: leitura densa, limpa e sem blocos inflados. */
#adminDashboardView {
  max-width: 1380px;
}

#adminDashboardView .section-heading { margin-bottom: 12px !important; }
#adminDashboardView .section-heading h2 { font-family: Montserrat, Arial, sans-serif !important; font-size: 1.45rem !important; line-height: 1.15 !important; }
#adminDashboardView #adminContent { display: grid; gap: 14px; }

#adminDashboardView .admin-summary-primary {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

#adminDashboardView .admin-metric {
  min-height: 88px !important;
  padding: 13px 14px !important;
  border-radius: 9px !important;
  box-shadow: none !important;
}

#adminDashboardView .admin-metric span {
  color: var(--ui-muted) !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

#adminDashboardView .admin-metric strong {
  margin-top: 7px;
  color: var(--ui-ink) !important;
  font-size: 1.35rem !important;
  line-height: 1 !important;
}

#adminDashboardView .admin-operation-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--ui-line);
  border-radius: 9px;
  background: #fff;
}

#adminDashboardView .admin-operation-strip span {
  display: grid;
  gap: 3px;
  min-height: 58px;
  padding: 10px 13px;
  border-right: 1px solid var(--ui-line);
}

#adminDashboardView .admin-operation-strip span:last-child { border-right: 0; }
#adminDashboardView .admin-operation-strip small { color: var(--ui-muted); font-size: .69rem; font-weight: 700; }
#adminDashboardView .admin-operation-strip strong { color: #294b7e; font-size: 1rem; }

#adminDashboardView .admin-quick-panel { padding: 16px !important; box-shadow: none !important; }
#adminDashboardView .admin-quick-heading { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
#adminDashboardView .admin-quick-heading .eyebrow { margin-bottom: 3px; }
#adminDashboardView .admin-quick-heading h2 { margin: 0; font-family: Montserrat, Arial, sans-serif !important; font-size: 1rem !important; }
#adminDashboardView .admin-quick-heading > p { margin: 0; color: var(--ui-muted); font-size: .78rem; }

#adminDashboardView .admin-quick-actions { gap: 7px !important; }
#adminDashboardView .admin-quick-actions .secondary-button { min-height: 34px !important; padding: 7px 10px !important; font-size: .78rem !important; }

@media (max-width: 1050px) {
  #adminDashboardView .admin-summary-primary { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #adminDashboardView .admin-operation-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #adminDashboardView .admin-operation-strip span:nth-child(3) { border-right: 0; }
  #adminDashboardView .admin-operation-strip span:nth-child(n+4) { border-top: 1px solid var(--ui-line); }
}

@media (max-width: 600px) {
  #adminDashboardView .admin-summary-primary { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #adminDashboardView .admin-operation-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #adminDashboardView .admin-operation-strip span:nth-child(2n) { border-right: 0; }
  #adminDashboardView .admin-operation-strip span:nth-child(3) { border-right: 1px solid var(--ui-line); }
  #adminDashboardView .admin-operation-strip span:nth-child(n+3) { border-top: 1px solid var(--ui-line); }
  #adminDashboardView .admin-operation-strip span:last-child { grid-column: 1 / -1; border-right: 0; }
  #adminDashboardView .admin-quick-heading { align-items: start; flex-direction: column; gap: 4px; }
}

#adminDashboardView .admin-whatsapp-form {
  display: grid;
  gap: 14px;
  max-width: 840px;
  padding: 20px !important;
  box-shadow: none !important;
}

#adminDashboardView .admin-whatsapp-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

#adminDashboardView .admin-whatsapp-heading h2 { margin: 0; font-family: Montserrat, Arial, sans-serif !important; font-size: 1.15rem !important; }
#adminDashboardView .admin-whatsapp-form > p { margin: -5px 0 0; color: var(--ui-muted); font-size: .84rem; line-height: 1.5; }
#adminDashboardView .admin-whatsapp-form textarea { min-height: 150px; resize: vertical; }
#adminDashboardView .admin-whatsapp-count { padding: 6px 9px; border-radius: 999px; background: #edf3ff; color: #2854a7; font-size: .74rem; font-weight: 700; white-space: nowrap; }
#adminDashboardView .admin-whatsapp-consent { padding: 10px 12px; border: 1px solid var(--ui-line); border-radius: 8px; background: #f9fbfe; font-size: .8rem; }
#adminDashboardView .admin-whatsapp-actions { display: flex; flex-wrap: wrap; gap: 8px; }
#adminDashboardView .admin-whatsapp-note { color: var(--ui-muted); font-size: .73rem; line-height: 1.45; }

@media (max-width: 600px) {
  #adminDashboardView .admin-whatsapp-heading { align-items: start; flex-direction: column; gap: 7px; }
  #adminDashboardView .admin-whatsapp-actions > * { flex: 1 1 100%; justify-content: center; }
}