@import url("/DESIGN_SYSTEMS/jolie-maison/runtime-adapter/fonts.css");

:root {
  --jmos-context-primary: #12100d;
  --jmos-context-primary-dark: #050403;
  --jmos-context-accent: #c99a2e;
  --jmos-context-accent-dark: #9b6d1d;
  --jmos-context-accent-soft: #f6eddb;
  --jmos-context-background: #f8f5ef;
  --jmos-context-surface: #ffffff;
  --jmos-context-surface-soft: #f2eadc;
  --jmos-context-text: #1d1812;
  --jmos-context-muted: #66594c;
  --jmos-context-border: rgba(45, 35, 22, .18);
  --jmos-context-heading-font: Georgia, "Times New Roman", serif;
  --jmos-context-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --jmos-context-radius: 6px;
  --jmos-context-shadow: 0 16px 36px rgba(18, 16, 13, .14);
}

:root[data-jmos-surface-theme="jolie-maison"] {
  --jmos-context-primary: #283477;
  --jmos-context-primary-dark: #2a327a;
  --jmos-context-accent: #edd947;
  --jmos-context-accent-dark: #d5be20;
  --jmos-context-accent-soft: #f0f1f6;
  --jmos-context-background: #f0f1f6;
  --jmos-context-surface: #ffffff;
  --jmos-context-surface-soft: #f0f1f6;
  --jmos-context-text: #545861;
  --jmos-context-muted: #6c7078;
  --jmos-context-border: #eaebef;
  --jmos-context-heading-font: "Asap Condensed", "Arial Narrow", Arial, sans-serif;
  --jmos-context-font: Montserrat, Arial, sans-serif;
  --jmos-context-radius: 0;
  --jmos-context-shadow: 0 14px 34px rgba(40, 52, 119, .12);
}

body.jmos-context-surface {
  --bg: var(--jmos-context-background);
  --surface: var(--jmos-context-surface);
  --surface-soft: var(--jmos-context-surface-soft);
  --text: var(--jmos-context-text);
  --ink: var(--jmos-context-text);
  --muted: var(--jmos-context-muted);
  --border: var(--jmos-context-border);
  --line: var(--jmos-context-border);
  --paper: var(--jmos-context-surface);
  --soft: var(--jmos-context-surface-soft);
  --accent: var(--jmos-context-primary);
  --accent-dark: var(--jmos-context-primary-dark);
  --brand: var(--jmos-context-primary);
  --brand-dark: var(--jmos-context-primary-dark);
  --panel-bg: var(--jmos-context-surface);
  --field-border: var(--jmos-context-border);
  --shadow: var(--jmos-context-shadow);
  color: var(--jmos-context-text);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--jmos-context-accent) 16%, transparent), transparent 34%),
    var(--jmos-context-background);
  font-family: var(--jmos-context-font);
}

body.jmos-context-surface h1,
body.jmos-context-surface h2,
body.jmos-context-surface h3,
body.jmos-context-surface h4,
body.jmos-context-surface .brand {
  font-family: var(--jmos-context-heading-font);
}

body.jmos-context-surface a {
  color: var(--jmos-context-primary-dark);
}

body.jmos-context-surface .eyebrow,
body.jmos-context-surface .label,
body.jmos-context-surface .section-kicker {
  color: var(--jmos-context-accent-dark);
}

body.jmos-context-surface button,
body.jmos-context-surface .button {
  border-color: var(--jmos-context-primary);
  border-radius: var(--jmos-context-radius);
  color: #fff;
  background: var(--jmos-context-primary);
}

body.jmos-context-surface button:hover,
body.jmos-context-surface button:focus-visible,
body.jmos-context-surface button:active,
body.jmos-context-surface .button:hover,
body.jmos-context-surface .button:focus-visible,
body.jmos-context-surface .button:active {
  border-color: var(--jmos-context-accent);
  background: var(--jmos-context-primary-dark);
}

body.jmos-context-surface button.secondary,
body.jmos-context-surface .button.secondary {
  border-color: var(--jmos-context-border);
  color: var(--jmos-context-primary-dark);
  background: var(--jmos-context-surface);
}

body.jmos-context-surface button.secondary:hover,
body.jmos-context-surface button.secondary:focus-visible,
body.jmos-context-surface button.secondary:active,
body.jmos-context-surface .button.secondary:hover,
body.jmos-context-surface .button.secondary:focus-visible,
body.jmos-context-surface .button.secondary:active {
  border-color: var(--jmos-context-accent);
  background: var(--jmos-context-accent-soft);
}

body.jmos-context-surface :focus-visible {
  outline-color: color-mix(in srgb, var(--jmos-context-accent) 72%, #fff);
}

body.jmos-context-surface .context,
body.jmos-context-surface > header {
  color: #fff;
  background:
    linear-gradient(135deg, var(--jmos-context-primary), var(--jmos-context-primary-dark));
}

body.jmos-context-surface .context {
  border-radius: calc(var(--jmos-context-radius) + 10px);
  box-shadow: var(--jmos-context-shadow);
}

body.jmos-context-surface .context .eyebrow,
body.jmos-context-surface > header .eyebrow {
  color: var(--jmos-context-accent);
  opacity: 1;
}

body.jmos-context-surface .context p,
body.jmos-context-surface > header p {
  color: color-mix(in srgb, #fff 82%, var(--jmos-context-accent));
}

body.jmos-context-surface .context .button {
  border-color: var(--jmos-context-accent);
  color: var(--jmos-context-primary);
  background: var(--jmos-context-accent);
}

body.jmos-context-surface .context .button:hover,
body.jmos-context-surface .context .button:focus-visible,
body.jmos-context-surface .context .button:active {
  border-color: var(--jmos-context-accent);
  color: var(--jmos-context-accent);
  background: var(--jmos-context-primary-dark);
}

body.jmos-context-surface .context .button:disabled {
  border-color: var(--jmos-context-border);
  color: color-mix(in srgb, var(--jmos-context-primary) 48%, #fff);
  background: color-mix(in srgb, var(--jmos-context-accent) 50%, var(--jmos-context-surface));
  cursor: not-allowed;
  opacity: .72;
}

body.jmos-context-surface .metric,
body.jmos-context-surface .card,
body.jmos-context-surface .panel,
body.jmos-context-surface .notice,
body.jmos-context-surface .empty,
body.jmos-context-surface .event-card,
body.jmos-context-surface .inquiry-card,
body.jmos-context-surface .list-item,
body.jmos-context-surface .links a,
body.jmos-context-surface input,
body.jmos-context-surface select,
body.jmos-context-surface textarea {
  border-color: var(--jmos-context-border);
  border-radius: var(--jmos-context-radius);
  color: var(--jmos-context-text);
  background: var(--jmos-context-surface);
}

body.jmos-context-surface .metric,
body.jmos-context-surface .card,
body.jmos-context-surface .panel {
  box-shadow: 0 8px 24px color-mix(in srgb, var(--jmos-context-primary) 7%, transparent);
}

body.jmos-context-surface .event-card,
body.jmos-context-surface .inquiry-card {
  border-left-color: var(--jmos-context-accent);
}

body.jmos-context-surface .status {
  color: var(--jmos-context-primary-dark);
  background: var(--jmos-context-accent-soft);
}

body.jmos-context-surface .status:before {
  background: var(--jmos-context-accent-dark);
}

body.jmos-context-surface .standards {
  background: var(--jmos-context-surface-soft);
}

body.jmos-context-surface .dialog {
  background: color-mix(in srgb, var(--jmos-context-primary) 68%, transparent);
}

body.jmos-context-surface > .jmos-global-nav {
  border-bottom-color: var(--jmos-context-border);
  color: var(--jmos-context-text);
  background: var(--jmos-context-surface);
}

body.jmos-context-surface > .jmos-global-nav a,
body.jmos-context-surface > .jmos-global-nav button {
  border-color: var(--jmos-context-border);
  color: var(--jmos-context-text);
  background: var(--jmos-context-surface);
}

body.jmos-context-surface > .jmos-global-nav a:hover,
body.jmos-context-surface > .jmos-global-nav button:hover {
  border-color: var(--jmos-context-accent);
}

body.jmos-context-surface > .jmos-global-nav .jmos-global-nav__primary {
  border-color: var(--jmos-context-primary) !important;
  color: #fff !important;
  background: var(--jmos-context-primary) !important;
}

body.jmos-context-surface > .jmos-global-nav .jmos-global-nav__context small,
body.jmos-context-surface > .jmos-global-nav .jmos-global-nav__user small {
  color: var(--jmos-context-muted);
}

@media (max-width: 520px) {
  body.jmos-context-surface .context {
    border-radius: calc(var(--jmos-context-radius) + 6px);
  }
}

/* Existing Jolie Maison website tokens, only on the server-selected platform surface. */
:root[data-jmos-platform-presentation="jolie-maison"] {
  --jmos-context-primary: var(--jm-primary);
  --jmos-context-primary-dark: var(--jm-primary-dark);
  --jmos-context-accent: var(--jm-accent);
  --jmos-context-accent-dark: var(--jm-accent-dark);
  --jmos-context-accent-soft: var(--jm-accent-soft);
  --jmos-context-background: var(--jm-bg);
  --jmos-context-surface: var(--jm-surface);
  --jmos-context-surface-soft: var(--jm-surface-soft);
  --jmos-context-text: var(--jm-text);
  --jmos-context-muted: var(--jm-muted);
  --jmos-context-border: var(--jm-border);
  --jmos-context-heading-font: var(--jm-heading-font-family);
  --jmos-context-font: var(--jm-font-family);
  --jmos-context-radius: var(--jm-radius-md);
  --jmos-platform-background: var(--jm-bg);
  --jmos-platform-surface: var(--jm-surface);
  --jmos-platform-soft: var(--jm-surface-soft);
  --jmos-platform-text: var(--jm-text);
  --jmos-platform-muted: var(--jm-muted);
  --jmos-platform-border: var(--jm-border);
  --jmos-platform-primary: var(--jm-primary);
}
html[data-jmos-platform-presentation="jolie-maison"] body.jmos-context-surface {
  background: var(--jm-bg);
  font-family: var(--jm-font-family);
}
html[data-jmos-platform-presentation="jolie-maison"] .jmos-global-nav {
  font-family: var(--jm-nav-font-family);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.region,.subpanel,.status,.result-box,.external-source-form,.external-source-card,.choice-card,.badge,.wizard-steps li,.asset-preview,.privacy-card) {
  color: var(--jm-text);
  border-color: var(--jm-border);
  border-radius: var(--jm-radius-md);
  background: var(--jm-surface);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(label,.hint,.meta,.is-muted,.region-data dt,.step-title p,.card p,.choice-card span,.summary-list dt) {
  color: var(--jm-muted);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.wizard-steps .is-active,.choice-card.is-selected) {
  border-color: var(--jm-primary);
  background: var(--jm-accent-soft);
  box-shadow: none;
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.table th,.table td,.summary-list div,.external-source-card form) {
  border-color: var(--jm-border);
}
html[data-jmos-platform-presentation="jolie-maison"] .status.is-error {
  color: var(--jm-danger);
  border-color: var(--jm-danger);
}
html[data-jmos-platform-presentation="jolie-maison"] body.jmos-context-surface {
  --gold: var(--jm-accent);
}
html[data-jmos-platform-presentation="jolie-maison"] button.secondary {
  background: var(--jm-surface) !important;
  color: var(--jm-primary-dark) !important;
}
html[data-jmos-platform-presentation="jolie-maison"] :is(button,input,select,textarea) {
  font-family: var(--jm-font-family);
}
html[data-jmos-platform-presentation="jolie-maison"] .eyebrow {
  color: var(--jm-primary-dark);
}

/* Existing Jolie Maison tokens, scoped to the server-confirmed platform only. */
html[data-jmos-platform-presentation="jolie-maison"] {
  --bg: var(--jm-bg); --surface: var(--jm-surface);
  --surface-soft: var(--jm-accent-soft); --text: var(--jm-text);
  --muted: var(--jm-muted); --accent: var(--jm-primary);
  --accent-dark: var(--jm-primary-dark); --border: var(--jm-border);
  --danger: var(--jm-danger);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.login-card,.jmos-consent-banner,.jmos-consent-modal,.jmos-privacy-footer,.jmos-map-consent-gate) {
  background: var(--jm-surface); color: var(--jm-text);
  border-color: var(--jm-border); font-family: var(--jm-font-family);
}
html[data-jmos-platform-presentation="jolie-maison"] .jmos-consent-button {
  background: var(--jm-primary); color: var(--jm-surface); border-color: var(--jm-primary);
}

/* Complete central administration chrome using the existing platform selection.
   Brand-editor preview values remain the selected brand's data. */
html[data-jmos-platform-presentation="jolie-maison"] :is(.location-review,.service,.inventory-item,.domain-card,.legal-form,.external-binding,.banner-preview) {
  border-color: var(--jm-border);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.legal-list dt,.map-preview-help,.map-preview-caption) {
  color: var(--jm-muted);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.location-review,.service,.banner-preview,.map-preview-caption) {
  background: var(--jm-surface);
  border-radius: var(--jm-radius-md);
}
html[data-jmos-platform-presentation="jolie-maison"] .legal-form input {
  border-color: var(--jm-border);
  background: var(--jm-surface);
  color: var(--jm-text);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.field-error,.wizard-errors) {
  color: var(--jm-danger);
}
html[data-jmos-platform-presentation="jolie-maison"] pre {
  background: var(--jm-surface-soft);
  color: var(--jm-text);
  border-radius: var(--jm-radius-md);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.map-preview,.region-map-preview,.leaflet-container) {
  background: var(--jm-surface-soft);
  border-color: var(--jm-border);
}
html[data-jmos-platform-presentation="jolie-maison"] .map-preview-pin,
html[data-jmos-platform-presentation="jolie-maison"] .region-map-preview::after {
  border-color: var(--jm-primary);
  background: var(--jm-surface);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--jm-primary) 20%, transparent);
}
html[data-jmos-platform-presentation="jolie-maison"] .privacy-topbar a {
  border-color: var(--jm-border);
  color: var(--jm-primary);
  background: var(--jm-surface);
}
html[data-jmos-platform-presentation="jolie-maison"] #open-live-preview {
  background: var(--jm-primary);
  color: var(--jm-surface);
}
html[data-jmos-platform-presentation="jolie-maison"] {
  background: var(--jm-bg);
  color: var(--jm-text);
}
html[data-jmos-platform-presentation="jolie-maison"] :is(.hero,.invitation) {
  background: var(--jm-surface);
  border-color: var(--jm-border);
  border-radius: var(--jm-radius-md);
  box-shadow: var(--jmos-context-shadow);
}

/* Shared status semantics; no onboarding-specific palette. */
html[data-jmos-platform-presentation="jolie-maison"] [role="status"].error {
  color: var(--jm-danger) !important;
}

/* Shared visibility contract must win over layout rules such as form { display:grid }. */
html[data-jmos-platform-presentation="jolie-maison"] [hidden] { display: none !important; }

@media (max-width: 560px) {
  html[data-jmos-platform-presentation="jolie-maison"] .region-map-height-control {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* Existing shared security/status components use the same platform surface tokens. */
html[data-jmos-platform-presentation="jolie-maison"] :is(.session-entry,.security-card) {
  background: var(--jm-surface);
  border-color: var(--jm-border);
}
html[data-jmos-platform-presentation="jolie-maison"] .session-time-grid > div,
html[data-jmos-platform-presentation="jolie-maison"] .status-message:not(.ok):not(.error) {
  background: var(--jm-surface-soft);
}
html[data-jmos-platform-presentation="jolie-maison"] .status-message.error {
  color: var(--jm-danger);
  background: color-mix(in srgb, var(--jm-danger) 10%, var(--jm-surface));
}

/* Shared administration chrome uses the selected domain tokens on every page. */
html[data-jmos-surface-theme="jolie-maison"] body.jmos-context-surface {
  background: var(--jmos-context-background);
  font-weight: 300;
}
html[data-jmos-surface-theme="jolie-maison"] body.jmos-context-surface :is(h1, h2, h3, h4, h5) {
  font-weight: 400;
}
html[data-jmos-surface-theme="jolie-maison"] .jmos-global-nav {
  font-family: "Encode Sans Semi Condensed", sans-serif;
}
body.jmos-context-surface > .jmos-global-nav :is(a, button) {
  border-radius: var(--jmos-context-radius);
  font: inherit;
}
body.jmos-context-surface :is(input, select, textarea) {
  font-family: var(--jmos-context-font);
}

body.jmos-context-surface :is(.security-card, .session-entry, .status-grid > div, .session-time-grid > div) {
  border-color: var(--jmos-context-border);
  border-radius: var(--jmos-context-radius);
  background: var(--jmos-context-surface);
}

/* Existing shared navigation owns the global return/logout controls. */
body.jmos-has-global-navigation .identity-shell .topbar nav,
body.jmos-has-global-navigation .identity-shell .topbar [data-action="logout"] { display:none; }
html[data-jmos-surface-theme="jolie-maison"] body.jmos-context-surface :is(.hero,.workspace-hero,.panel,.card,.invitation,.stat-card) {
  border-radius:var(--jmos-context-radius);
}
html[data-jmos-surface-theme="jolie-maison"] body.jmos-context-surface .hero { padding:clamp(1.25rem,3vw,2.5rem); }
body.jmos-context-surface > .jmos-global-nav button.jmos-global-nav__toggle {
  color:var(--jmos-context-text);
  background:var(--jmos-context-surface);
  border-color:var(--jmos-context-border);
}

/* Shared error surface: retain denial semantics, use host theme typography. */
body.jmos-context-surface .jmos-error-page {
  font-family: inherit;
  color: var(--jmos-context-text);
  border-radius: var(--jmos-context-radius, 12px);
}
body.jmos-context-surface .jmos-error-actions a { font-family: inherit; }