/* Linguataal v99 P0 Stabilization
   Deliberately narrow final overrides. Loaded after full-canvas.
   Owns only: Modern shell continuity, Grammar level chooser, Stories/Dialogues/KNM
   heading contrast, Sentence Practice route/card clarity, responsive safety. */

/* 1) Modern shell must be continuous — no white sidebar/gutter islands. */
html[data-lai-theme="dark"] body:has(.linguaai-sidebar),
html[data-lai-theme="dark"] body:has(.linguaai-sidebar) #page,
html[data-lai-theme="dark"] body:has(.linguaai-sidebar) #content,
html[data-lai-theme="dark"] body:has(.linguaai-sidebar) #primary,
html[data-lai-theme="dark"] body:has(.linguaai-sidebar) :is(.site,.site-content,.entry-content,.page-content,.wp-block-post-content,.wp-site-blocks) {
  background:#293149 !important;
}
html[data-lai-theme="dark"] body .linguaai-sidebar {
  background:linear-gradient(180deg,#242b41 0%,#293149 100%) !important;
  color:#f4f6fb !important;
  border-color:#3b455f !important;
  box-shadow:8px 0 28px rgba(11,16,32,.10) !important;
}
html[data-lai-theme="dark"] body .linguaai-sidebar :is(a,button,.sidebar-item,.menu-label,span) { color:#dce2ef !important; }
html[data-lai-theme="dark"] body .linguaai-sidebar :is(a.active,.sidebar-item.active,.active>a) {
  color:#fff !important;
  background:linear-gradient(135deg,#6650e6,#7a4ff1) !important;
}
html[data-lai-theme="dark"] body .linguaai-sidebar :is(.logo img,.linguaai-logo img,img[alt*="linguataal" i]) { filter:none !important; opacity:.96 !important; }
html[data-lai-theme="dark"] body .linguaai-topbar {
  background:#313a54 !important;
  border-color:#46506b !important;
  color:#f5f7fb !important;
}
html[data-lai-theme="dark"] body .linguaai-topbar .topbar-page-title { color:#f7f8fc !important; }

/* 2) Grammar — turn the long single strip into a deliberate chooser. */
#linguaai-grammar .grammar-level-selector {
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  padding:0 !important;
  margin:0 0 14px !important;
  background:transparent !important;
  border:0 !important;
}
#linguaai-grammar .grammar-level-selector .level-tab-btn {
  min-height:64px !important;
  border:1px solid #dfe4ed !important;
  border-radius:16px !important;
  background:#fff !important;
  color:#495267 !important;
  font-weight:800 !important;
  box-shadow:0 6px 18px rgba(15,23,42,.045) !important;
  transition:.16s ease !important;
}
#linguaai-grammar .grammar-level-selector .level-tab-btn:hover { transform:translateY(-1px); border-color:#c9c4f2 !important; }
#linguaai-grammar .grammar-level-selector .level-tab-btn.active {
  background:linear-gradient(135deg,#eeebff,#f5f3ff) !important;
  border-color:#bdb2ff !important;
  color:#5140b8 !important;
  box-shadow:0 8px 20px rgba(98,80,218,.10) !important;
}
#linguaai-grammar .grammar-context-contract,
#linguaai-grammar .grammar-cefr-guide {
  background:#fff !important;
  border:1px solid #e1e5ed !important;
  color:#566074 !important;
  box-shadow:0 6px 18px rgba(15,23,42,.035) !important;
}
html[data-lai-theme="dark"] #linguaai-grammar .grammar-context-contract,
html[data-lai-theme="dark"] #linguaai-grammar .grammar-cefr-guide,
html[data-lai-theme="dark"] #linguaai-grammar .linguaai-header {
  color:#202534 !important;
}
html[data-lai-theme="dark"] #linguaai-grammar .grammar-cefr-guide :is(strong,#grammar-cefr-title),
html[data-lai-theme="dark"] #linguaai-grammar .linguaai-header h1 { color:#202534 !important; }
html[data-lai-theme="dark"] #linguaai-grammar .grammar-cefr-guide :is(span,#grammar-cefr-copy),
html[data-lai-theme="dark"] #linguaai-grammar .linguaai-header p { color:#667085 !important; }

/* 3 + 4) Stories and Dialogues: section headings must never inherit dark-on-dark. */
html[data-lai-theme="dark"] :is(#linguaai-stories,#linguaai-dialogues) .grammar-topic-section > h3 {
  color:#f7f8fc !important;
  opacity:1 !important;
  font-weight:850 !important;
  letter-spacing:-.015em !important;
  text-shadow:0 1px 1px rgba(0,0,0,.08) !important;
  margin:22px 0 14px !important;
}
html[data-lai-theme="dark"] :is(#linguaai-stories,#linguaai-dialogues) .grammar-topic-section > h3::after {
  content:''; display:block; width:46px; height:3px; margin-top:9px; border-radius:999px; background:#8c77ff;
}

/* 5) Sentence Practice: remove dashed roadmap plumbing; make cards/states alive. */
#linguaai-sentence-practice .sp-tree-path::before,
#linguaai-sentence-practice .sp-checkpoint-card::after { display:none !important; content:none !important; }
#linguaai-sentence-practice .sp-tree-path {
  gap:18px !important;
  padding-top:20px !important;
}
#linguaai-sentence-practice .sp-checkpoint-card {
  width:min(86%,760px) !important;
  border:1px solid #dfe5ed !important;
  box-shadow:0 10px 26px rgba(18,27,49,.075) !important;
}
#linguaai-sentence-practice .sp-checkpoint-card:not(.is-locked):hover {
  border-color:#c6bdf5 !important;
  box-shadow:0 14px 32px rgba(63,53,135,.10) !important;
}
#linguaai-sentence-practice .sp-checkpoint-badge {
  background:#eef0ff !important;
  border:1px solid #d8d9f7 !important;
  color:#4c42a8 !important;
  opacity:1 !important;
}
#linguaai-sentence-practice .sp-checkpoint-badge small,
#linguaai-sentence-practice .sp-checkpoint-badge strong {
  color:#4c42a8 !important;
  opacity:1 !important;
}
#linguaai-sentence-practice .sp-checkpoint-title h3 { color:#202534 !important; font-weight:850 !important; }
#linguaai-sentence-practice .sp-checkpoint-title :is(p,small,span) { color:#667085 !important; opacity:1 !important; }
#linguaai-sentence-practice .sp-checkpoint-activities {
  border-top:1px solid #e4e8ef !important;
  gap:9px !important;
}
#linguaai-sentence-practice .sp-activity-card {
  background:#fbfcfe !important;
  border:1px solid #dfe5ed !important;
  color:#344054 !important;
  box-shadow:0 3px 10px rgba(15,23,42,.035) !important;
}
#linguaai-sentence-practice .sp-activity-card :is(strong,.sp-activity-copy strong) { color:#344054 !important; opacity:1 !important; }
#linguaai-sentence-practice .sp-activity-card :is(small,.sp-activity-copy small) { color:#667085 !important; opacity:1 !important; }
#linguaai-sentence-practice .sp-activity-card.status-completed {
  background:#f3fbf7 !important; border-color:#bfe3d4 !important;
}
#linguaai-sentence-practice .sp-checkpoint-card.is-current {
  background:linear-gradient(135deg,#fff 0%,#f9f8ff 100%) !important;
  border-color:#7664dd !important;
}
#linguaai-sentence-practice .sp-checkpoint-card.is-locked { opacity:.72 !important; }

/* 6) KNM title/intro contrast. Inline legacy colors cannot win in Modern shell. */
html[data-lai-theme="dark"] #linguaai-knm-wrap .knm-welcome > h2,
html[data-lai-theme="dark"] #linguaai-knm-wrap .knm-topic-heading > h3 {
  color:#f7f8fc !important;
  opacity:1 !important;
  text-shadow:0 1px 1px rgba(0,0,0,.08) !important;
}
html[data-lai-theme="dark"] #linguaai-knm-wrap .knm-welcome > p { color:#cbd2e3 !important; opacity:1 !important; }
html[data-lai-theme="dark"] #linguaai-knm-wrap .knm-topic-count {
  background:#343d57 !important; border-color:#4a5570 !important; color:#e4e8f2 !important;
}

/* Responsive stabilization — one contract for the corrected components. */
@media (max-width:1024px) {
  #linguaai-grammar .grammar-level-selector { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  #linguaai-sentence-practice .sp-checkpoint-card { width:100% !important; align-self:stretch !important; }
}
@media (max-width:860px) {
  html[data-lai-theme="dark"] body .linguaai-sidebar { background:#252c40 !important; }
  #linguaai-sentence-practice .sp-tree-path { padding-inline:10px !important; }
}
@media (max-width:560px) {
  #linguaai-grammar .grammar-level-selector { grid-template-columns:1fr 1fr !important; gap:8px !important; }
  #linguaai-grammar .grammar-level-selector .level-tab-btn { min-height:52px !important; border-radius:13px !important; font-size:.86rem !important; }
  :is(#linguaai-stories,#linguaai-dialogues) .grammar-topic-section > h3 { font-size:1.08rem !important; }
  #linguaai-sentence-practice .sp-checkpoint-card { padding:12px !important; border-radius:18px !important; }
  #linguaai-sentence-practice .sp-checkpoint-title h3 { font-size:.98rem !important; }
  #linguaai-knm-wrap .knm-welcome > h2 { font-size:1.45rem !important; line-height:1.2 !important; }
}
