/* v31: readable public pages and task-oriented administration.
   No page-level overflow hiding, third-party fonts or disabled focus outlines. */
:root {
  --surface-radius: 18px;
  --focus-ring: #0878ad;
}
:where(html) { scroll-padding-block: 96px 24px; }
:where(img, video, svg) { max-width: 100%; }
:where(button, .button, input, select, textarea, summary) { -webkit-tap-highlight-color: transparent; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--focus-ring); outline-offset: 4px;
}
:where(.button, button) { touch-action: manipulation; }
:where(.button, button):disabled { transform: none; }
:where(input, textarea)::placeholder { color: #617587; opacity: 1; }
:where(.alert, .flash-stack, .html-content) { overflow-wrap: anywhere; }
:where(.button, button, label, summary) { overflow-wrap: break-word; }

/* Public website: consistent rhythm, aligned cards and generous touch targets. */
body:not(.portal-body) { line-height: 1.6; }
body:not(.portal-body) .section-heading { margin-bottom: clamp(24px, 4vw, 44px); }
body:not(.portal-body) .section-heading p { color: #4c6475; line-height: 1.75; }
body:not(.portal-body) :is(.program-grid, .teacher-grid, .price-grid, .review-grid) {
  gap: clamp(18px, 2vw, 28px);
}
body:not(.portal-body) .program-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
body:not(.portal-body) .teacher-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
body:not(.portal-body) :is(.program-card, .teacher-card) { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
body:not(.portal-body) :is(.program-card-body, .teacher-body) { display: flex; flex-direction: column; flex: 1; gap: 10px; }
body:not(.portal-body) :is(.program-card-body, .teacher-body) :is(h3, p) { margin-block: 0; }
body:not(.portal-body) .program-card-body .button { margin-top: auto; align-self: flex-start; }
body:not(.portal-body) .price-card { padding: clamp(22px, 3vw, 34px); }
body:not(.portal-body) .hero-dots button { min-width: 44px; min-height: 44px; border-width: 15px; }
body:not(.portal-body) .hero-dots button.is-active { min-width: 52px; }
body:not(.portal-body) .form-grid > label { min-width: 0; }
body:not(.portal-body) :is(.booking-card, .feedback-card, .enroll-form) { border-radius: var(--surface-radius); }
body:not(.portal-body) .site-footer { padding-bottom: max(36px, env(safe-area-inset-bottom, 0px)); }

/* Consent must be discoverable on arrival, not hidden below the entire footer.
   Both choices remain visible. The banner is non-modal and does not trap focus. */
body:not(.portal-body) .cookie-panel {
  position: fixed; inset: auto auto max(16px, env(safe-area-inset-bottom, 0px)) 20px;
  z-index: 1000; width: min(840px, calc(100% - 40px)); max-width: none;
  margin: 0; padding: 22px 24px; display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 240px); gap: 24px;
  max-height: 55dvh; overflow-y: auto; overscroll-behavior: contain;
  border: 1px solid #bacdd9; border-radius: 18px;
  background: #fff; box-shadow: 0 12px 50px #163b4f29;
}
body:not(.portal-body) .cookie-panel[hidden] { display: none; }
body:not(.portal-body) .cookie-panel strong { font-size: .96rem; }
body:not(.portal-body) .cookie-panel p { font-size: .85rem; line-height: 1.6; margin: 6px 0; }
body:not(.portal-body) .cookie-panel__actions { display: flex; flex-direction: column; gap: 8px; margin: 0; }
body:not(.portal-body) .cookie-panel__actions > .button { flex: 0 0 auto; min-height: 44px; width: 100%; font-size: .81rem; }
body:not(.portal-body):has(.cookie-panel:not([hidden])) .ai-chat:not(.is-open) .ai-chat__launcher { visibility: hidden; }
body:not(.portal-body):has(.cookie-panel:not([hidden])) .contact-dock:not(.is-open) { visibility: hidden; }
.captcha-feedback { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.captcha-feedback small { line-height: 1.5; color: #4c6374; }
.captcha-retry { min-height: 44px; border-radius: 10px; white-space: normal; }

/* Administrative layout: less density, no viewport-sized form columns. */
.portal-main { min-width: 0; }
.portal-main > :is(header, section, .panel, .dashboard-grid, .promotion-workspace, .ai-hub) { max-width: 1600px; }
.portal-body .portal-page-head h1 { font-size: clamp(1.6rem, 2.6vw, 2.4rem); line-height: 1.2; }
.portal-body .portal-page-head > div { min-width: 0; }
.portal-body .panel { border-color: #dce6ed; }
.portal-body .portal-sidebar a { border-radius: 10px; }
.portal-body .portal-sidebar a[aria-current="page"] { box-shadow: inset 3px 0 #84ccdf; }
.portal-body .workspace-search { max-width: 860px; }
.portal-main :is(.settings-form, .promotion-workspace, .ai-settings-layout, .hub-form-grid) > * { min-width: 0; }
.portal-main :is(.table-wrap, .table-responsive) { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.portal-main .table-wrap:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 3px; }
.portal-main .page-head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.portal-main :is(.promotion-kpis, .ai-admin-kpis) article { min-width: 0; }
.portal-main .promotion-command-bar > * { min-width: 0; }
.portal-main .promotion-command-bar p { overflow-wrap: anywhere; }
.portal-main .promotion-topic-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.portal-main .promotion-topic-presets button { white-space: normal; min-height: 42px; text-align: left; }
.portal-main .promotion-generate-button { min-height: 60px; }
.portal-main .promotion-generate-status { padding: 12px 16px; border-radius: 12px; background: #edf6fa; color: #184b65; }
.portal-main .promotion-tab-buttons { overflow-x: auto; max-width: 100%; overscroll-behavior-inline: contain; }
.portal-main .promotion-tab-buttons button { flex: 0 0 auto; min-height: 44px; }
.portal-main .promotion-tab-panel[hidden] { display: none; }
.portal-main .promotion-social-preview textarea { width: 100%; min-height: 180px; line-height: 1.7; resize: vertical; }

/* Distinguish a stored secret from a tested task; status is never colour-only. */
.hub-task-statuses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 16px 0 18px; }
.hub-task-status { min-width: 0; padding: 12px 13px; background: #f3f6f9; border: 1px solid #dbe5ed; border-left: 3px solid #7891a5; border-radius: 10px; }
.hub-task-status strong { display: block; font-size: .78rem; margin-bottom: 4px; }
.hub-task-status span { display: block; font-size: .81rem; line-height: 1.5; font-weight: 650; }
.hub-task-status small { display: block; font-size: .72rem; margin-top: 6px; }
.hub-task-status.is-ok { background: #edf8f1; border-color: #bfdcc9; border-left-color: #288350; color: #175332; }
.hub-task-status.is-warning { background: #fff8eb; border-color: #e8d2ad; border-left-color: #a66a17; }
.hub-check span > small { display: block; margin-top: 5px; }
.hub-provider .hub-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.hub-provider .hub-actions > form { min-width: 0; }
.hub-provider .hub-actions button { width: 100%; height: 100%; font-size: .8rem; padding-inline: 10px; }
.hub-provider .hub-connection > summary { min-height: 48px; }
.hub-provider .hub-diagnostics { border-radius: 12px; }
.hub-notice strong { line-height: 1.5; }

@media (min-width: 901px) and (max-width: 1180px) {
  .portal-body .portal-layout { grid-template-columns: 232px minmax(0, 1fr); }
  .portal-body .portal-main { padding-inline: 24px; }
  .portal-main .promotion-workspace { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  :where(html) { scroll-padding-top: 24px; }
  body:not(.portal-body) .cookie-panel {
    inset-inline: 12px; bottom: max(12px, env(safe-area-inset-bottom, 0px));
    width: auto; padding: 18px; grid-template-columns: minmax(0, 1fr); gap: 12px;
  }
  body:not(.portal-body) .cookie-panel__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  body:not(.portal-body) .cookie-panel p { font-size: .8rem; }
  body:not(.portal-body) .cookie-panel strong { font-size: .88rem; }
  body:not(.portal-body) .program-card-body .button { align-self: stretch; text-align: center; }
  .portal-main .promotion-workspace { grid-template-columns: minmax(0, 1fr); }
  .portal-main .promotion-publish-row { display: flex; flex-direction: column; align-items: stretch; gap: 16px; }
  .portal-main .promotion-publish-row > * { width: 100%; min-width: 0; }
  .portal-main .promotion-brief-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .portal-main .page-head-actions { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
  .portal-main .page-head-actions > .button { width: 100%; }
  .portal-main .promotion-command-bar { display: flex; flex-wrap: wrap; gap: 12px; padding: 18px; }
  .portal-main .promotion-command-bar > :nth-child(2) { flex: 1 1 calc(100% - 40px); }
  .portal-main .promotion-command-bar__meta { flex: 1 1 110px; }
  .hub-task-statuses { grid-template-columns: minmax(0, 1fr); }
  .hub-task-status { display: grid; grid-template-columns: 62px minmax(0, 1fr); column-gap: 8px; align-items: start; }
  .hub-task-status small { grid-column: 2; }
  .hub-provider .hub-actions { grid-template-columns: minmax(0, 1fr); }
  .portal-main .promotion-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .portal-main .promotion-kpis article { padding: 14px 10px; gap: 8px; }
  .portal-main .promotion-kpi-icon { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
@media print {
  .cookie-panel, .ai-chat, .contact-dock, .portal-sidebar, .portal-topbar, .workspace-search { display: none !important; }
  .portal-layout { display: block; }
  .portal-main { padding: 0; }
}
