/* Autor: Mariano Sánchez Sigüenza.
   Identidad de la landing sobre las variables públicas de Frappe 16.31.
   Los colores de estado, radios y sombras conservan sus valores nativos.
   html:root prevalece sobre el :root del login.bundle.css que Frappe carga
   después de web_include_css, sin !important ni cambios de plantilla. */
@font-face {
  font-family: "Archivo";
  src: url("/assets/saas_control_plane/fonts/Archivo-normal-100_900-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-style: normal;
  font-display: swap;
}

html:root, [data-theme] {
  --ac-paper: #FFFFFF;
  --ac-paper-2: #F3F4F4;
  --ac-plate: #F0F1F1;
  --ac-ink: #15161A;
  --ac-ink-2: #4A4D54;
  --ac-ink-3: #5C5F66;
  --ac-line: rgba(21, 22, 26, .16);
  --ac-line-soft: rgba(21, 22, 26, .12);
  --ac-teal: #087270;
  --ac-teal-night: #5CC6C4;
  --ac-night: #101521;
  --ac-sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-stack: var(--ac-sans);
}

html:root, [data-theme="light"] {
  --ac-accent: var(--ac-teal);
  --ac-action-text: var(--ac-paper);
  --ac-accent-text: var(--ac-paper);
  --primary: var(--ac-accent);
  --brand-color: var(--ac-accent);
  --primary-color: var(--ac-accent);
  --btn-primary: var(--ac-ink);
  --heading-color: var(--ac-ink);
  --text-color: var(--ac-ink);
  --text-neutral: var(--ac-ink);
  --text-muted: var(--ac-ink-2);
  --text-light: var(--ac-ink-3);
  --bg-color: var(--ac-paper);
  --fg-color: var(--ac-paper);
  --card-bg: var(--ac-paper);
  --modal-bg: var(--ac-paper);
  --popover-bg: var(--ac-paper);
  --navbar-bg: var(--ac-paper);
  --subtle-accent: var(--ac-paper-2);
  --subtle-fg: var(--ac-plate);
  --control-bg: var(--ac-paper-2);
  --fg-hover-color: var(--ac-plate);
  --surface-white: var(--ac-paper);
  --surface-menu-bar: var(--ac-paper-2);
  --surface-modal: var(--ac-paper);
  --surface-gray-1: var(--ac-paper-2);
  --surface-gray-2: var(--ac-plate);
  --ink-gray-6: var(--ac-ink-2);
  --ink-gray-7: var(--ac-ink-2);
  --ink-gray-8: var(--ac-ink);
  --ink-gray-9: var(--ac-ink);
  --focus-default: 0 0 0 2px var(--ac-accent);
}

/* Valores de Desk/Espresso oscuros de la versión instalada; también sirven
   a las superficies web que no incluyen desk/dark.scss. */
html[data-theme="dark"], [data-theme="dark"] {
  --neutral: var(--neutral-black);
  --invert-neutral: var(--neutral-white);
  --text-dark: var(--gray-900);
  --btn-default-bg: #232323;
  --btn-default-hover-bg: #383838;
  --btn-ghost-hover-bg: #232323;
  --border-color: #232323;
  --table-border-color: var(--border-color);
  --disabled-text-color: var(--gray-400);
  --disabled-control-bg: #232323;
  --icon-stroke: var(--gray-300);
  --ac-accent: var(--ac-teal-night);
  --ac-action-text: var(--ac-ink);
  --ac-accent-text: var(--ac-ink);
  --primary: var(--ac-accent);
  --brand-color: var(--ac-accent);
  --primary-color: var(--ac-accent);
  --btn-primary: var(--ac-accent);
  --heading-color: var(--gray-50);
  --text-color: var(--gray-50);
  --text-neutral: var(--gray-50);
  --text-muted: var(--gray-400);
  --text-light: var(--gray-300);
  --bg-color: var(--gray-900);
  --fg-color: var(--gray-900);
  --card-bg: var(--gray-900);
  --modal-bg: var(--gray-900);
  --popover-bg: var(--gray-900);
  --navbar-bg: var(--surface-menu-bar);
  --subtle-accent: #232323;
  --subtle-fg: #383838;
  --control-bg: #232323;
  --fg-hover-color: #232323;
  --surface-white: #0f0f0f;
  --surface-menu-bar: #0f0f0f;
  --surface-modal: #232323;
  --surface-gray-1: #232323;
  --surface-gray-2: #2b2b2b;
  --ink-gray-6: #999999;
  --ink-gray-7: #afafaf;
  --ink-gray-8: #d4d4d4;
  --ink-gray-9: #f8f8f8;
  --focus-default: 0 0 0 2px var(--ac-accent);
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("/assets/saas_control_plane/fonts/IBMPlexMono-normal-400-latin.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("/assets/saas_control_plane/fonts/IBMPlexMono-normal-500-latin.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

html:root, [data-theme] {
  --ac-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
