/* ===========================================================
   Code4you UI · tokens v1
   Universal. No contiene decisiones de ningún producto.
   El bloque "shell / grafito" es idéntico al del login aprobado.
   =========================================================== */

:root{

  /* ---------- brand ---------- */
  --c4y-accent:#f6b72e;              /* ámbar Code4you · fondo oscuro */
  --c4y-accent-hover:#e9a91c;
  --c4y-accent-border:#e6a91f;
  --c4y-accent-ink:#17160f;          /* tinta sobre ámbar */
  --c4y-accent-soft:rgba(246,183,46,.12);
  --c4y-accent-line:rgba(246,183,46,.55);
  --c4y-accent-ink-light:#a9750a;    /* ámbar legible sobre superficie clara (4.5:1) */
  --c4y-accent-ink-light-2:#7a5a08;  /* texto ámbar pequeño sobre claro */

  /* ---------- surfaces · shell grafito (heredado del login) ---------- */
  --c4y-bg:#0a0a0a;
  --c4y-shell:#111110;               /* sidebar / barras de producto */
  --c4y-shell-raised:#131210;        /* cabeceras de drawer y sheet */
  --c4y-panel-from:#151514;
  --c4y-panel-to:#0f0f0e;
  --c4y-surface:rgba(236,233,228,.022);
  --c4y-surface-2:rgba(236,233,228,.05);
  --c4y-nav-active:rgba(246,183,46,.09);

  /* ---------- surfaces · área operativa clara ---------- */
  --c4y-app-bg:#f4f3f1;              /* lienzo de la aplicación */
  --c4y-app-panel:#ffffff;           /* tablas, tarjetas, drawer */
  --c4y-app-sunken:#faf9f7;           /* cabeceras de tabla, pie, barras */
  --c4y-app-raised:#fdfcfb;           /* barra de contexto */
  --c4y-app-hover:#f7f6f3;
  --c4y-app-selected:#fdf8ec;
  --c4y-app-accent-soft:#fdf6e6;      /* control con filtro activo */

  /* ---------- text ---------- */
  --c4y-ink:#ece9e4;                 /* tinta sobre grafito */
  --c4y-ink-2:#cfccc6;
  --c4y-ink-3:#9b9893;
  --c4y-ink-4:#77746f;
  --c4y-ink-5:#5e5b57;
  --c4y-app-ink:#131210;             /* tinta sobre claro */
  --c4y-app-ink-2:#6a6660;
  --c4y-app-ink-3:#807c76;
  --c4y-app-ink-4:#918d87;
  --c4y-app-ink-muted:#a19d96;
  --c4y-app-ink-disabled:#b3afa8;

  /* ---------- borders ---------- */
  --c4y-line:rgba(236,233,228,.20);
  --c4y-line-faint:rgba(236,233,228,.10);
  --c4y-border:rgba(236,233,228,.09);
  --c4y-app-line:#e4e0da;            /* separador estructural */
  --c4y-app-line-faint:#efebe4;      /* separador entre filas */
  --c4y-app-line-strong:#d6d2cb;     /* borde de control */
  --c4y-app-line-contrast:#cfcac2;   /* borde de elemento destacado */
  --c4y-app-frame:#ded9d3;           /* marco de panel */

  /* ---------- controles sobre grafito ---------- */
  --c4y-field-bg:rgba(236,233,228,.035);
  --c4y-field-bg-focus:rgba(236,233,228,.06);
  --c4y-field-border:rgba(236,233,228,.14);
  --c4y-control-bg:rgba(236,233,228,.06);
  --c4y-control-border:rgba(236,233,228,.12);

  /* ---------- feedback ---------- */
  --c4y-danger:#d16a54;
  --c4y-danger-ink:#9c4b33;          /* sobre claro */
  --c4y-danger-bg:#f8efec;
  --c4y-danger-border:#dcc0b8;
  --c4y-ok:#4f7d5f;
  --c4y-ok-ink:#3d6149;
  --c4y-ok-bg:#eef4f0;
  --c4y-ok-border:#b7ccbe;
  --c4y-info:#5f7286;
  --c4y-info-ink:#46566a;
  --c4y-neutral:#8a8681;

  /* ---------- typography ---------- */
  --c4y-font:'Manrope',system-ui,-apple-system,"Segoe UI",sans-serif;
  --c4y-mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,monospace;
  --c4y-fs-page:26px;                /* título de pantalla */
  --c4y-fs-section:17px;
  --c4y-fs-body:13px;
  --c4y-fs-row:13.5px;               /* texto primario de fila */
  --c4y-fs-meta:11.5px;              /* información secundaria */
  --c4y-fs-control:12.5px;
  --c4y-fs-mono:11.5px;              /* folio / identificador */
  --c4y-fs-micro:10px;               /* microtipografía técnica */
  --c4y-fs-micro-2:9.5px;            /* etiqueta de sección */
  --c4y-fs-micro-3:9px;              /* rótulo de campo */
  --c4y-ls-micro:.12em;
  --c4y-ls-label:.16em;
  --c4y-ls-title:-.025em;

  /* ---------- spacing ---------- */
  --c4y-space-1:7px;
  --c4y-space-2:11px;
  --c4y-space-3:18px;
  --c4y-space-4:26px;
  --c4y-space-5:44px;
  --c4y-gutter:28px;                 /* margen del área operativa · desktop */
  --c4y-gutter-tablet:18px;
  --c4y-gutter-mobile:16px;

  /* ---------- radius ---------- */
  --c4y-r-xs:3px;
  --c4y-r-sm:4px;
  --c4y-r-md:5px;
  --c4y-r-lg:6px;
  --c4y-r-sheet:12px;

  /* ---------- alturas de control ---------- */
  --c4y-h-control:38px;              /* input, filtro, botón de toolbar */
  --c4y-h-button:36px;
  --c4y-h-nav:40px;
  --c4y-h-bar:60px;                  /* barra de contexto */
  --c4y-h-thead:38px;
  --c4y-h-row:62px;
  --c4y-h-row-compact:48px;
  --c4y-h-pager:48px;
  --c4y-h-field:46px;                /* formularios de página / login */
  --c4y-touch:44px;

  /* ---------- estructura ---------- */
  --c4y-sidebar:248px;
  --c4y-rail:64px;
  --c4y-drawer:480px;

  /* ---------- iconografía ---------- */
  --c4y-icon-sm:13px;
  --c4y-icon-md:16px;
  --c4y-icon-lg:18px;
  --c4y-icon-stroke:1.25;
  --c4y-icon-stroke-strong:1.35;

  /* ---------- focus ---------- */
  --c4y-focus:var(--c4y-accent-ink-light);
  --c4y-focus-dark:var(--c4y-accent);
  --c4y-focus-w:2px;
  --c4y-focus-offset:2px;

  /* ---------- motion ---------- */
  --c4y-ease:cubic-bezier(.4,0,.2,1);
  --c4y-t-fast:.16s;
  --c4y-t-base:.22s;
  --c4y-t-drawer:.26s;

  /* ---------- elevación y z-index ---------- */
  --c4y-shadow-panel:0 1px 2px rgba(20,19,17,.04);
  --c4y-shadow-pop:0 12px 28px rgba(20,19,17,.14);
  --c4y-shadow-drawer:-24px 0 48px rgba(20,19,17,.10);
  --c4y-z-sticky:10;
  --c4y-z-dropdown:40;
  --c4y-z-overlay:60;
  --c4y-z-drawer:70;
  --c4y-z-toast:90;
}