/*
 * Nest English — Phase 9 / Dashboards, Practice Hub & Classroom Elevation
 * Warm editorial interior system for practice, learner/teacher workspaces,
 * account settings and AI surfaces. Visual-only: no runtime/business logic.
 */

/* ---------- Interior page frame ---------- */
body.nest-editorial .page-section:not(#landing-section) {
  animation-duration: 420ms;
}

body.nest-editorial .page-section:not(#landing-section) > :first-child {
  letter-spacing: -.012em;
}

body.nest-editorial .page-section:not(#landing-section) .glass-panel,
body.nest-editorial .page-section:not(#landing-section) [class*="rounded-2xl"].glass-panel,
body.nest-editorial .page-section:not(#landing-section) [class*="rounded-3xl"].glass-panel {
  background: linear-gradient(145deg, rgba(255,255,255,.78), rgba(250,247,241,.64));
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-sm);
  backdrop-filter: blur(12px) saturate(125%);
  -webkit-backdrop-filter: blur(12px) saturate(125%);
}

html.dark body.nest-editorial .page-section:not(#landing-section) .glass-panel,
html.dark body.nest-editorial .page-section:not(#landing-section) [class*="rounded-2xl"].glass-panel,
html.dark body.nest-editorial .page-section:not(#landing-section) [class*="rounded-3xl"].glass-panel {
  background: linear-gradient(145deg, rgba(24,34,28,.78), rgba(17,25,21,.72));
  border-color: var(--nest-dark-line) !important;
  box-shadow: var(--nest-shadow-dark);
}

/* ---------- Shared interior controls ---------- */
body.nest-editorial .page-section button.bg-indigo-600,
body.nest-editorial .page-section button.bg-emerald-600,
body.nest-editorial .page-section button.bg-cyan-600,
body.nest-editorial .page-section button.bg-rose-600 {
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 12px 24px rgba(31,95,74,.14);
}

body.nest-editorial .page-section button.bg-indigo-600 {
  background: linear-gradient(135deg, var(--nest-forest), #2f765d) !important;
}
body.nest-editorial .page-section button.bg-emerald-600 {
  background: linear-gradient(135deg, #2d7259, #4f8a71) !important;
}
body.nest-editorial .page-section button.bg-cyan-600 {
  background: linear-gradient(135deg, #2f6b63, #4f8b80) !important;
}
body.nest-editorial .page-section button.bg-rose-600 {
  background: linear-gradient(135deg, #9f6258, #c47d6e) !important;
}

body.nest-editorial .page-section button.bg-indigo-600:hover,
body.nest-editorial .page-section button.bg-emerald-600:hover,
body.nest-editorial .page-section button.bg-cyan-600:hover,
body.nest-editorial .page-section button.bg-rose-600:hover {
  transform: translateY(-2px);
  filter: saturate(1.04);
}

body.nest-editorial .page-section button,
body.nest-editorial .page-section a {
  transition: transform var(--nest-fast) var(--nest-ease-soft),
              box-shadow var(--nest-fast) var(--nest-ease-soft),
              background-color var(--nest-fast) ease,
              border-color var(--nest-fast) ease,
              color var(--nest-fast) ease;
}

/* ---------- Practice Hub ---------- */
body.nest-editorial #practice-section {
  max-width: 1120px;
}

body.nest-editorial #practice-section > div:first-child {
  padding-bottom: .25rem;
}

body.nest-editorial #practice-section > div:first-child h2 {
  font-size: clamp(2rem, 4vw, 3.05rem);
  line-height: 1.04;
}

body.nest-editorial #practice-section > div:first-child p {
  max-width: 52rem;
  font-size: .9rem;
  line-height: 1.8;
}

body.nest-editorial #practice-section .interactive-card {
  position: relative;
  overflow: hidden;
  min-height: 188px;
  background: linear-gradient(150deg, rgba(255,255,255,.82), rgba(248,244,237,.70));
  border-color: var(--nest-line-strong) !important;
  box-shadow: var(--nest-shadow-sm);
  transition: transform var(--nest-mid) var(--nest-ease),
              box-shadow var(--nest-mid) var(--nest-ease),
              border-color var(--nest-mid) ease;
}

body.nest-editorial #practice-section .interactive-card::before {
  content: "";
  position: absolute;
  inset: -30% auto auto -10%;
  width: 8rem;
  height: 8rem;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(181,138,86,.12), transparent 68%);
  pointer-events: none;
}

html.dark body.nest-editorial #practice-section .interactive-card {
  background: linear-gradient(150deg, rgba(24,34,29,.80), rgba(14,22,18,.74));
  border-color: var(--nest-dark-line) !important;
}

body.nest-editorial #practice-section .interactive-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--nest-shadow-md);
  border-color: rgba(181,138,86,.25) !important;
}

body.nest-editorial #practice-section .interactive-card > div:first-child {
  box-shadow: 0 8px 18px rgba(31,95,74,.08);
}

body.nest-editorial #practice-section .interactive-card h3 {
  font-size: .98rem;
  line-height: 1.35;
}

body.nest-editorial #practice-section .interactive-card p {
  line-height: 1.7;
}

/* Warmly unify legacy indigo/emerald utility color blocks inside practice cards */
body.nest-editorial #practice-section .interactive-card .bg-indigo-50,
body.nest-editorial #practice-section .interactive-card .bg-emerald-50,
body.nest-editorial #practice-section .interactive-card .bg-rose-50 {
  background: var(--nest-gold-soft) !important;
  color: var(--nest-forest) !important;
}
html.dark body.nest-editorial #practice-section .interactive-card .bg-indigo-950,
html.dark body.nest-editorial #practice-section .interactive-card .bg-emerald-950,
html.dark body.nest-editorial #practice-section .interactive-card .bg-rose-950 {
  background: rgba(181,138,86,.12) !important;
  color: #b9d5c8 !important;
}

/* ---------- Practice / skills workspaces ---------- */
body.nest-editorial #grammar-section,
body.nest-editorial #reading-section,
body.nest-editorial #writing-practice-section,
body.nest-editorial #speaking-practice-section,
body.nest-editorial #speaking-ai-section,
body.nest-editorial #listening-practice-section,
body.nest-editorial #type-practice-section,
body.nest-editorial #mistakes-section,
body.nest-editorial #stories-section,
body.nest-editorial #shadowing-section,
body.nest-editorial #micro-section,
body.nest-editorial #simulator-section,
body.nest-editorial #playground-section {
  width: min(100%, 1080px);
}

body.nest-editorial #grammar-section > div,
body.nest-editorial #reading-section > div,
body.nest-editorial #writing-practice-section > div,
body.nest-editorial #speaking-practice-section > div,
body.nest-editorial #speaking-ai-section > div,
body.nest-editorial #listening-practice-section > div,
body.nest-editorial #type-practice-section > div,
body.nest-editorial #mistakes-section > div {
  border-radius: var(--nest-radius-lg);
}

/* Skill control surfaces: calm rather than exam-like */
body.nest-editorial #grammar-section input,
body.nest-editorial #grammar-section textarea,
body.nest-editorial #reading-section input,
body.nest-editorial #reading-section textarea,
body.nest-editorial #writing-practice-section input,
body.nest-editorial #writing-practice-section textarea,
body.nest-editorial #speaking-practice-section input,
body.nest-editorial #speaking-practice-section textarea,
body.nest-editorial #speaking-ai-section input,
body.nest-editorial #speaking-ai-section textarea,
body.nest-editorial #listening-practice-section input,
body.nest-editorial #listening-practice-section textarea,
body.nest-editorial #type-practice-section input,
body.nest-editorial #type-practice-section textarea,
body.nest-editorial #mistakes-section input,
body.nest-editorial #mistakes-section textarea {
  background: rgba(255,255,255,.72) !important;
  border-color: var(--nest-line-strong) !important;
  color: var(--nest-ink) !important;
  border-radius: var(--nest-radius-md) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6);
}
html.dark body.nest-editorial #grammar-section input,
html.dark body.nest-editorial #grammar-section textarea,
html.dark body.nest-editorial #reading-section input,
html.dark body.nest-editorial #reading-section textarea,
html.dark body.nest-editorial #writing-practice-section input,
html.dark body.nest-editorial #writing-practice-section textarea,
html.dark body.nest-editorial #speaking-practice-section input,
html.dark body.nest-editorial #speaking-practice-section textarea,
html.dark body.nest-editorial #speaking-ai-section input,
html.dark body.nest-editorial #speaking-ai-section textarea,
html.dark body.nest-editorial #listening-practice-section input,
html.dark body.nest-editorial #listening-practice-section textarea,
html.dark body.nest-editorial #type-practice-section input,
html.dark body.nest-editorial #type-practice-section textarea,
html.dark body.nest-editorial #mistakes-section input,
html.dark body.nest-editorial #mistakes-section textarea {
  background: rgba(15,24,20,.72) !important;
  border-color: var(--nest-dark-line) !important;
  color: #eef4f0 !important;
}

/* Listening player */
body.nest-editorial .nest-lp-card {
  background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(248,244,237,.68));
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-md);
  border-radius: var(--nest-radius-xl);
}
html.dark body.nest-editorial .nest-lp-card {
  background: linear-gradient(145deg, rgba(23,32,27,.82), rgba(13,21,17,.75));
  border-color: var(--nest-dark-line) !important;
  box-shadow: var(--nest-shadow-dark);
}
body.nest-editorial .nest-lp-btn.primary {
  background: linear-gradient(135deg, var(--nest-forest), #37765e) !important;
  box-shadow: 0 10px 24px rgba(31,95,74,.18);
}
body.nest-editorial .nest-lp-btn.secondary {
  background: var(--nest-gold-soft) !important;
  color: var(--nest-forest) !important;
}
html.dark body.nest-editorial .nest-lp-btn.secondary {
  background: rgba(181,138,86,.12) !important;
  color: #cfe3d8 !important;
}

/* Mistakes loop */
body.nest-editorial #mistakes-section {
  max-width: 920px;
}
body.nest-editorial #mistakes-list > *,
body.nest-editorial #mistakes-section .glass-panel {
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-sm);
  border-radius: var(--nest-radius-md) !important;
}
body.nest-editorial #mistakes-section [class*="bg-rose-50"] {
  background: var(--nest-rose-soft) !important;
}
html.dark body.nest-editorial #mistakes-section [class*="bg-rose-950"] {
  background: rgba(185,111,98,.12) !important;
}

/* ---------- Learner profile / dashboard ---------- */
body.nest-editorial #profile-section {
  max-width: 1120px;
}
body.nest-editorial #profile-section > .flex.items-center.gap-4:first-child {
  padding: 1.4rem 1.25rem;
  border: 1px solid var(--nest-line);
  border-radius: var(--nest-radius-xl);
  background: linear-gradient(145deg, rgba(255,255,255,.76), rgba(247,243,235,.62));
  box-shadow: var(--nest-shadow-md);
}
html.dark body.nest-editorial #profile-section > .flex.items-center.gap-4:first-child {
  background: linear-gradient(145deg, rgba(23,32,27,.82), rgba(13,21,17,.72));
  border-color: var(--nest-dark-line);
}
body.nest-editorial #profile-section > .flex.items-center.gap-4:first-child > div:first-child {
  background: linear-gradient(135deg, var(--nest-forest), #6a9b84) !important;
  box-shadow: 0 12px 26px rgba(31,95,74,.18);
}
body.nest-editorial #profile-section > .grid.grid-cols-2.sm\:grid-cols-4 > div,
body.nest-editorial #profile-section #profile-learning-snapshot {
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-sm);
}
body.nest-editorial #profile-section #profile-learning-snapshot {
  background: linear-gradient(145deg, rgba(255,255,255,.78), rgba(248,244,237,.64));
}
html.dark body.nest-editorial #profile-section #profile-learning-snapshot {
  background: linear-gradient(145deg, rgba(22,32,27,.78), rgba(14,22,18,.72));
}
body.nest-editorial #profile-section #profile-badges-grid > * {
  border: 1px solid var(--nest-line) !important;
  border-radius: var(--nest-radius-md);
  background: rgba(255,255,255,.62);
  box-shadow: var(--nest-shadow-sm);
  padding: .75rem;
}
html.dark body.nest-editorial #profile-section #profile-badges-grid > * {
  background: rgba(21,31,26,.72);
  border-color: var(--nest-dark-line) !important;
}

/* ---------- Teacher workspace / classroom ---------- */
body.nest-editorial #teacher-section {
  max-width: 1160px;
}
body.nest-editorial #teacher-section > .space-y-3:first-child {
  padding: clamp(1.2rem, 3vw, 1.8rem);
  border-radius: var(--nest-radius-xl);
  border: 1px solid var(--nest-line);
  background: linear-gradient(145deg, rgba(255,255,255,.80), rgba(247,243,235,.64));
  box-shadow: var(--nest-shadow-md);
}
html.dark body.nest-editorial #teacher-section > .space-y-3:first-child {
  background: linear-gradient(145deg, rgba(23,32,27,.80), rgba(13,21,17,.72));
  border-color: var(--nest-dark-line);
}
body.nest-editorial .nest-teacher-mode-tab[aria-selected="true"] {
  background: linear-gradient(135deg, var(--nest-forest), #3e7e66) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(31,95,74,.18) !important;
}
body.nest-editorial .nest-teacher-mode-tab {
  border: 1px solid transparent;
}
body.nest-editorial .nest-teacher-advanced-hero,
body.nest-editorial .nest-teacher-tools-intro,
body.nest-editorial .nest-teacher-how-modal,
body.nest-editorial .nest-teacher-quick-note {
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-md);
}

/* Lazy teacher dashboard */
body.nest-editorial #nest-teacher-dashboard,
body.nest-editorial #nest-teacher-intelligence,
body.nest-editorial #nest-org-dashboard,
body.nest-editorial #nest-organization-panel,
body.nest-editorial #nest-teacher-account {
  background: linear-gradient(145deg, rgba(255,255,255,.80), rgba(247,243,235,.66)) !important;
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-md);
  border-radius: var(--nest-radius-xl) !important;
}
html.dark body.nest-editorial #nest-teacher-dashboard,
html.dark body.nest-editorial #nest-teacher-intelligence,
html.dark body.nest-editorial #nest-org-dashboard,
html.dark body.nest-editorial #nest-organization-panel,
html.dark body.nest-editorial #nest-teacher-account {
  background: linear-gradient(145deg, rgba(23,32,27,.84), rgba(13,21,17,.76)) !important;
  border-color: var(--nest-dark-line) !important;
}

body.nest-editorial #nest-teacher-dashboard [data-td-summary] > *,
body.nest-editorial #nest-teacher-dashboard [data-td-grid] article,
body.nest-editorial #nest-org-dashboard-metrics > *,
body.nest-editorial #nest-org-branch-summary > * {
  border-color: var(--nest-line) !important;
  background: rgba(255,255,255,.60) !important;
  border-radius: var(--nest-radius-md) !important;
}
html.dark body.nest-editorial #nest-teacher-dashboard [data-td-summary] > *,
html.dark body.nest-editorial #nest-teacher-dashboard [data-td-grid] article,
html.dark body.nest-editorial #nest-org-dashboard-metrics > *,
html.dark body.nest-editorial #nest-org-branch-summary > * {
  background: rgba(15,24,20,.62) !important;
  border-color: var(--nest-dark-line) !important;
}

body.nest-editorial #nest-teacher-dashboard [data-td-open],
body.nest-editorial #nest-org-dashboard button,
body.nest-editorial #nest-teacher-intelligence button {
  background: linear-gradient(135deg, var(--nest-forest), #3f7c64) !important;
}

/* Teacher auth/account panels */
body.nest-editorial #nest-teacher-login,
body.nest-editorial #nest-teacher-account,
body.nest-editorial #nest-org-dashboard,
body.nest-editorial #nest-organization-panel {
  padding: clamp(1rem, 2vw, 1.35rem);
}
body.nest-editorial #nest-teacher-login input,
body.nest-editorial #nest-teacher-account input,
body.nest-editorial #nest-organization-panel input,
body.nest-editorial #nest-organization-panel select,
body.nest-editorial #nest-teacher-intelligence input,
body.nest-editorial #nest-teacher-intelligence select,
body.nest-editorial #nest-teacher-intelligence textarea {
  border-radius: var(--nest-radius-md) !important;
  border-color: var(--nest-line-strong) !important;
  background: rgba(255,255,255,.72) !important;
  min-height: 44px;
}
html.dark body.nest-editorial #nest-teacher-login input,
html.dark body.nest-editorial #nest-teacher-account input,
html.dark body.nest-editorial #nest-organization-panel input,
html.dark body.nest-editorial #nest-organization-panel select,
html.dark body.nest-editorial #nest-teacher-intelligence input,
html.dark body.nest-editorial #nest-teacher-intelligence select,
html.dark body.nest-editorial #nest-teacher-intelligence textarea {
  background: rgba(10,17,14,.62) !important;
  border-color: var(--nest-dark-line) !important;
  color: #eef4f0 !important;
}

/* ---------- AI Copilot / Coach ---------- */
body.nest-editorial #nest-ai-coach,
body.nest-editorial [data-nest-ai-provider],
body.nest-editorial .nest-ai-products,
body.nest-editorial #ai-consent-modal {
  border-radius: var(--nest-radius-xl) !important;
}
body.nest-editorial #nest-ai-coach {
  background:
    radial-gradient(420px 180px at 90% 0%, rgba(181,138,86,.12), transparent 70%),
    linear-gradient(145deg, rgba(255,255,255,.82), rgba(247,243,235,.68)) !important;
  border: 1px solid var(--nest-line) !important;
  box-shadow: var(--nest-shadow-md);
}
html.dark body.nest-editorial #nest-ai-coach {
  background:
    radial-gradient(420px 180px at 90% 0%, rgba(181,138,86,.09), transparent 70%),
    linear-gradient(145deg, rgba(23,32,27,.84), rgba(13,21,17,.74)) !important;
  border-color: var(--nest-dark-line) !important;
}
body.nest-editorial #nest-ai-coach .rounded-2xl,
body.nest-editorial #nest-ai-coach .rounded-xl {
  border-color: var(--nest-line) !important;
  background: rgba(255,255,255,.55) !important;
}
html.dark body.nest-editorial #nest-ai-coach .rounded-2xl,
html.dark body.nest-editorial #nest-ai-coach .rounded-xl {
  border-color: var(--nest-dark-line) !important;
  background: rgba(12,20,16,.50) !important;
}
body.nest-editorial #nest-ai-coach button,
body.nest-editorial #ai-consent-modal button {
  border-radius: var(--nest-radius-md);
}
body.nest-editorial #nest-ai-coach #nai-hoot,
body.nest-editorial #nest-ai-coach #nai-build,
body.nest-editorial #nest-ai-coach #nai-refresh,
body.nest-editorial #nest-ai-coach #nai-retry {
  background: linear-gradient(135deg, var(--nest-forest), #3e7c64) !important;
  box-shadow: 0 10px 24px rgba(31,95,74,.16);
}
body.nest-editorial #nest-ai-coach [class*="bg-indigo-50"] {
  background: var(--nest-gold-soft) !important;
  color: var(--nest-forest) !important;
}
html.dark body.nest-editorial #nest-ai-coach [class*="bg-indigo-950"] {
  background: rgba(181,138,86,.10) !important;
  color: #c4d9cf !important;
}

/* ---------- AI / teacher conversational states ---------- */
body.nest-editorial .nest-ai-products,
body.nest-editorial .nest-teacher-intelligence,
body.nest-editorial .nest-org-dashboard {
  transition: box-shadow var(--nest-mid) var(--nest-ease), transform var(--nest-mid) var(--nest-ease);
}
body.nest-editorial .nest-ai-products:hover,
body.nest-editorial .nest-teacher-intelligence:hover,
body.nest-editorial .nest-org-dashboard:hover {
  box-shadow: var(--nest-shadow-lg);
}

/* ---------- Account / organization forms ---------- */
body.nest-editorial #profile-account-panel > *,
body.nest-editorial #nest-organization-panel form,
body.nest-editorial #nest-organization-panel .space-y-3.rounded-2xl,
body.nest-editorial #nest-org-invite {
  border-radius: var(--nest-radius-lg) !important;
  border-color: var(--nest-line) !important;
  box-shadow: var(--nest-shadow-sm);
}
body.nest-editorial #nest-organization-panel .bg-slate-50,
body.nest-editorial #nest-organization-panel .bg-slate-900,
html.dark body.nest-editorial #nest-organization-panel .bg-slate-900 {
  background: rgba(255,255,255,.58) !important;
}
html.dark body.nest-editorial #nest-organization-panel .bg-slate-900 {
  background: rgba(12,20,16,.55) !important;
}
body.nest-editorial #nest-organization-panel .text-cyan-600,
body.nest-editorial #nest-org-dashboard .text-sky-600,
body.nest-editorial #nest-teacher-dashboard .text-sky-600 {
  color: var(--nest-forest) !important;
}

/* ---------- Editorial stat language ---------- */
body.nest-editorial [data-td-summary] .text-2xl,
body.nest-editorial #nest-org-dashboard-metrics .text-xl {
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
}

/* ---------- Mobile / RTL parity ---------- */
html[dir='rtl'] body.nest-editorial #practice-section .interactive-card,
html[dir='rtl'] body.nest-editorial #nest-teacher-dashboard,
html[dir='rtl'] body.nest-editorial #nest-ai-coach,
html[dir='rtl'] body.nest-editorial #profile-section,
html[dir='rtl'] body.nest-editorial #nest-organization-panel {
  text-align: right;
}

html[dir='rtl'] body.nest-editorial #practice-section .interactive-card .absolute.top-3.end-3 {
  left: .75rem;
  right: auto;
}

@media (max-width: 640px) {
  body.nest-editorial .page-section:not(#landing-section) {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  body.nest-editorial #practice-section > div:first-child h2 {
    font-size: 2rem;
  }
  body.nest-editorial #practice-section .interactive-card {
    min-height: 0;
  }
  body.nest-editorial #profile-section > .flex.items-center.gap-4:first-child {
    align-items: flex-start;
  }
  body.nest-editorial #nest-teacher-dashboard,
  body.nest-editorial #nest-teacher-intelligence,
  body.nest-editorial #nest-org-dashboard,
  body.nest-editorial #nest-organization-panel,
  body.nest-editorial #nest-ai-coach {
    padding: 1rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.nest-editorial #practice-section .interactive-card,
  body.nest-editorial .page-section button,
  body.nest-editorial .page-section a,
  body.nest-editorial .nest-ai-products,
  body.nest-editorial .nest-teacher-intelligence,
  body.nest-editorial .nest-org-dashboard {
    transition: none !important;
  }
}
