/* Shared public-site colour system. Product pages can keep their layout while
 * inheriting the same stored clear/dark choice and a single, quiet toggle. */
.alefos-global-theme-toggle {
  position: fixed;
  top: 19px;
  left: var(--alefos-public-header-left, 24px);
  z-index: 400;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgb(17 24 39 / .11);
  border-radius: 999px;
  background: rgb(255 255 255 / .72);
  color: #27272a;
  box-shadow: 0 4px 14px rgb(15 23 42 / .06);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.alefos-global-theme-toggle:hover {
  border-color: rgb(17 24 39 / .28);
  background: #fff;
  box-shadow: 0 6px 18px rgb(15 23 42 / .1);
  transform: translateY(-.5px);
}

.alefos-global-theme-toggle:focus-visible { outline: 3px solid rgb(17 24 39 / .22); outline-offset: 3px; }
.alefos-global-theme-toggle__icon { position: absolute; width: 16px; height: 16px; transition: opacity 180ms ease, transform 220ms ease; }
.alefos-global-theme-toggle__icon--sun { opacity: 0; transform: rotate(-35deg) scale(.7); }

html[data-alefos-theme="dark"] {
  color-scheme: dark;
  --ink: #f6f6f2;
  --black: #f6f6f2;
  --text: #f6f6f2;
  --muted: #b8bcc2;
  --line: #292d31;
  --paper: #080808;
  --canvas: #000;
  --soft: #101010;
  --dark: #f6f6f2;
}

html[data-alefos-theme="dark"] body {
  background: #000 !important;
  color: #f6f6f2 !important;
}

html[data-alefos-theme="dark"] :is(.topbar, .header, .site-header, .public-header, .navbar, .nav-header, .commercial-header) {
  border-color: #292d31 !important;
  background: rgb(0 0 0 / .88) !important;
  color: #f6f6f2 !important;
}

html[data-alefos-theme="dark"] :is(.card, .panel, .boost, .faq details, .quota-details details, .comparison-wrap, .solo-compare article, .mcp-info-card, .mcp-endpoint, .mcp-question, .mcp-reference details, .product-card, .product-question, .product-reference details, .doc-index, .doc-related-link, .product-kicker-card) {
  border-color: #292d31 !important;
  background: #080808 !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .035), 0 20px 54px rgb(0 0 0 / .36) !important;
}

html[data-alefos-theme="dark"] :is(h1, h2, h3, h4, strong, summary, .brand, .header-brand, .commercial-brand, .toplinks a, .header-links a, .commercial-nav a, .card h3, .seat-name, .comparison-label, .comparison-head > div, .doc-link, .mcp-question, .product-question) {
  color: #f6f6f2 !important;
}

html[data-alefos-theme="dark"] :is(p, li, small, .subtitle, .eyebrow, .card-label, .card-intro, .feature-list, .team-meta, .team-features, .section-heading p, .breadcrumbs, .side-copy, article p, article li, .doc-link, .mcp-info-card p, .mcp-info-card li, .product-card p, .product-card li) {
  color: #b8bcc2 !important;
}

html[data-alefos-theme="dark"] :is(.button, .hero-nav a, .mcp-pill, .doc-related-link, .stepper, .shared-capacity, .comparison-head, .mission-action.secondary) {
  border-color: #30343a !important;
  background: #0b0b0b !important;
  color: #f6f6f2 !important;
}

/* Pricing: make the Team seat picker an obvious, touch-friendly quantity
 * control instead of a low-contrast row of symbols on a black card. */
html[data-alefos-theme="dark"] .seat-builder .stepper:has(> [data-team-minus]) {
  display: grid !important;
  grid-template-columns: 2.35rem 2.55rem 2.35rem;
  align-items: center;
  gap: 0 !important;
  padding: .2rem !important;
  border: 1px solid #353535 !important;
  border-radius: 999px !important;
  background: #0c0c0c !important;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.035), 0 4px 12px rgb(0 0 0 / 0.18);
}

html[data-alefos-theme="dark"] .seat-builder .stepper :is(
  [data-team-minus],
  [data-team-plus]
) {
  width: 2.35rem !important;
  height: 2.35rem !important;
  border: 0 !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  font-size: 1.35rem !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

html[data-alefos-theme="dark"] .seat-builder .stepper [data-team-minus] {
  background: transparent !important;
  color: #f1f1f1 !important;
}

html[data-alefos-theme="dark"] .seat-builder .stepper [data-team-minus]:disabled {
  color: #676767 !important;
  opacity: 1 !important;
}

html[data-alefos-theme="dark"] .seat-builder .stepper [data-team-plus] {
  background: #f1be20 !important;
  color: #0a0a0a !important;
}

html[data-alefos-theme="dark"] .seat-builder .stepper [data-team-count] {
  width: 2.55rem !important;
  color: #fff !important;
  font-size: .95rem !important;
  font-weight: 700 !important;
}

html[data-alefos-theme="dark"] :is(.button.primary, .mcp-pill.primary, .mission-action.primary) {
  border-color: #f6f6f2 !important;
  background: #f6f6f2 !important;
  color: #090909 !important;
}

/* Pricing comparison: the surface is black in dark mode, so every table value
 * needs to carry the same deliberate contrast as the rest of the page. */
html[data-alefos-theme="dark"] .comparison-wrap { background: #080808 !important; }
html[data-alefos-theme="dark"] .comparison-head { background: #101010 !important; }
html[data-alefos-theme="dark"] .comparison-row > div { color: #d9dce1 !important; }
html[data-alefos-theme="dark"] .comparison-row :is(.comparison-label, .yes, .comparison-head > div) { color: #f6f6f2 !important; }
html[data-alefos-theme="dark"] .comparison-row .no { color: #b7bbc2 !important; }
html[data-alefos-theme="dark"] .comparison-row .team-value { color: #f1be20 !important; }
html[data-alefos-theme="dark"] .comparison-note { color: #b8bcc2 !important; }

/* Industries deliberately keeps a light editorial panel next to its dark
 * work-preview. Restore ink colours inside that panel: the generic dark-mode
 * text rules otherwise turn the headline and introduction nearly white. */
html[data-alefos-theme="dark"] .industries-hub-hero .industries-hub-copy .eyebrow {
  color: #747b87 !important;
}

html[data-alefos-theme="dark"] .industries-hub-hero .industries-hub-copy h1 {
  color: #090a0c !important;
}

html[data-alefos-theme="dark"] .industries-hub-hero .industries-hub-copy .subtitle {
  color: #525966 !important;
}

/* A light chip must read like a light button: strong black type, never the
 * muted copy colour it used on a dark surface in the clear design. */
html[data-alefos-theme="dark"] :is(.ibox-benefit-row span, .ibox-card-status, .doc-panel-status, .mcp-visual-status, .mission-badge) {
  border-color: #fff !important;
  background: #fff !important;
  color: #090909 !important;
}

html[data-alefos-theme="dark"] body .alefos-theme-ink-on-light { color: #090909 !important; }

html[data-alefos-theme="dark"] :is(.mcp-visual, .contact-visual, .mission-visual, .doc-visual) {
  border-color: #292d31 !important;
  background: #050505 !important;
  box-shadow: 0 30px 80px rgb(0 0 0 / .5) !important;
}

html[data-alefos-theme="dark"] :is(.mcp-message, .contact-card, .contact-signal, .mission-panel, .mission-step:not(.dark), .doc-panel, .doc-row:not(.dark)) {
  border-color: #2d3034 !important;
  background: #0a0a0a !important;
  color: #f6f6f2 !important;
}

html[data-alefos-theme="dark"] :is(.mcp-answer, .contact-ai, .mission-step.dark, .doc-row.dark) { background: #151515 !important; }
html[data-alefos-theme="dark"] :is(.footer, footer) { border-color: #292d31 !important; background: #050505 !important; }
html[data-alefos-theme="dark"] .alefos-llm-info :is(h1, h2, h3, strong, a) { color: #f6f6f2 !important; }
html[data-alefos-theme="dark"] .alefos-llm-info :is(.meta-info, footer) { color: #b8bcc2 !important; }
/* Legal pages remain public marketing pages: their dark version keeps the
 * same documents readable, without changing the separate sign-up consent UI. */
html[data-alefos-theme="dark"] .legal-public-page { background: #000 !important; color: #f6f6f2 !important; }
html[data-alefos-theme="dark"] .legal-public-page :is([class*="bg-white"], [class*="bg-gray-50"]) { background: #0b0b0b !important; }
html[data-alefos-theme="dark"] .legal-public-page :is([class*="border-gray"], [class*="border-black"]) { border-color: #292d31 !important; }
html[data-alefos-theme="dark"] .legal-public-page :is([class*="text-gray-950"], [class*="text-black"]) { color: #f6f6f2 !important; }
html[data-alefos-theme="dark"] .legal-public-page :is([class*="text-gray-400"], [class*="text-gray-500"], [class*="text-gray-600"], [class*="text-gray-700"], [class*="text-gray-800"]) { color: #b8bcc2 !important; }
html[data-alefos-theme="dark"] :is(.legal-section, .legal-link) { border-color: #292d31 !important; }
html[data-alefos-theme="dark"] :is(.legal-link, .legal-link-title, .legal-section h2) { color: #f6f6f2 !important; }
html[data-alefos-theme="dark"] :is(.meta, .section-description, .legal-link small) { color: #b8bcc2 !important; }
html[data-alefos-theme="dark"] .legal-link:hover { background: #101010 !important; color: #f6f6f2 !important; }
html[data-alefos-theme="dark"] img[src*="alefos-logo"] { filter: invert(1); }
html[data-alefos-theme="dark"] ::-webkit-scrollbar-track { background: #050505; }
html[data-alefos-theme="dark"] ::-webkit-scrollbar-thumb { background: #45484d; }

html[data-alefos-theme="dark"] .alefos-global-theme-toggle {
  border-color: rgb(255 255 255 / .18);
  background: rgb(5 5 5 / .82);
  color: #f4f4f5;
  box-shadow: 0 5px 18px rgb(0 0 0 / .3);
}

html[data-alefos-theme="dark"] .alefos-global-theme-toggle:hover { border-color: rgb(255 255 255 / .36); background: #0b0b0b; }
html[data-alefos-theme="dark"] .alefos-global-theme-toggle:focus-visible { outline-color: #f6f6f2; }
html[data-alefos-theme="dark"] .alefos-global-theme-toggle__icon--moon { opacity: 0; transform: rotate(35deg) scale(.7); }
html[data-alefos-theme="dark"] .alefos-global-theme-toggle__icon--sun { opacity: 1; transform: rotate(0) scale(1); }

/* One quiet public header, everywhere: the theme control sits on the left,
 * the identity is truly centered, and login stays the only action on the right. */
:is(.header, .topbar, .commercial-header) > :is(.header-inner, .topbar-inner, .commercial-header__inner) {
  display: grid !important;
  grid-template-columns: minmax(36px, 1fr) auto minmax(36px, 1fr) !important;
  align-items: center !important;
  gap: 0 !important;
}

:is(.header, .topbar, .commercial-header) :is(.header-brand, .brand, .commercial-brand) {
  grid-column: 2;
  justify-self: center;
  margin: 0 !important;
}

/* The mark is identified by the accessible link label and by the domain.
 * Keep this public header intentionally icon-only. */
:is(.header, .topbar, .commercial-header) :is(.header-brand, .brand, .commercial-brand) > span {
  display: none !important;
}

:is(.header, .topbar, .commercial-header) :is(.header-links, .toplinks, .commercial-nav) {
  grid-column: 3;
  justify-self: end;
  margin: 0 !important;
}

:is(.header, .topbar, .commercial-header) :is(.header-links, .toplinks, .commercial-nav) > a:not([href^="/login"]) { display: none !important; }

@media (max-width: 720px) {
  .alefos-global-theme-toggle { top: 18px; left: var(--alefos-public-header-left, 16px); width: 34px; height: 34px; }
  :is(.header, .topbar, .commercial-header) :is(.header-brand, .brand, .commercial-brand) { gap: 10px !important; font-size: 1rem !important; }
  :is(.header, .topbar, .commercial-header) :is(.header-brand, .brand, .commercial-brand) span {
    position: static !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: nowrap !important;
  }
}
