@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');

/* Gestión Comercial — modern overlay. Scoped to body.gc-modern. CSS only. */

body.gc-modern {
  --background: 210 25% 97%;
  --foreground: 213 40% 14%;
  --border: 212 20% 88%;
  --card: 210 30% 99.5%;
  --card-foreground: 213 40% 14%;
  --popover: 210 30% 99.5%;
  --popover-foreground: 213 40% 14%;
  --primary: 197 74% 25%;
  --primary-foreground: 195 40% 98%;
  --secondary: 196 30% 93%;
  --secondary-foreground: 197 60% 22%;
  --muted: 210 22% 93%;
  --muted-foreground: 214 14% 40%;
  --accent: 24 78% 46%;
  --accent-foreground: 30 40% 98%;
  --destructive: 356 66% 45%;
  --input: 212 18% 80%;
  --ring: 197 74% 32%;
  --radius: 0.625rem;
  --app-font-sans: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  --app-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --gc-shadow: 0 1px 2px hsl(213 40% 14% / .05), 0 4px 16px -6px hsl(213 40% 14% / .08);
  font-family: var(--app-font-sans);
  font-feature-settings: 'tnum' 1;
  background: hsl(var(--background));
}
body.gc-modern .font-mono { font-family: var(--app-font-mono); }
body.gc-modern .paper-grain::before {
  opacity: 1;
  background-image:
    linear-gradient(hsl(var(--primary) / .035) 1px, transparent 1px),
    linear-gradient(90deg, hsl(var(--primary) / .035) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: linear-gradient(to bottom, #000 0, transparent 520px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0, transparent 520px);
}

/* Focus visibility everywhere */
body.gc-modern :is(a, button, input, select):focus-visible {
  outline: 2px solid hsl(var(--ring));
  outline-offset: 2px;
}
body.gc-modern .focus-within\:ring-4:focus-within { box-shadow: 0 0 0 4px hsl(var(--primary) / .14); }
/* El contenedor del campo ya ofrece borde y halo de foco visibles. */
body.gc-modern :is([data-testid="input-usuario"], [data-testid="input-password"]):focus-visible {
  outline: none;
}

/* ---------- Marca ---------- */
body.gc-modern .leading-tight > .block.text-\[11px\].text-muted-foreground { display: none !important; }
body.gc-modern .leading-tight > .block.uppercase { letter-spacing: .1em; font-weight: 700; font-size: 13px; }
body.gc-modern .h-9.w-9.rounded-xl.bg-primary {
  border-radius: 9px;
  background: linear-gradient(145deg, hsl(197 74% 31%), hsl(205 70% 19%));
  box-shadow: inset 0 1px 0 hsl(0 0% 100% / .18), 0 2px 6px -2px hsl(var(--primary) / .5);
}

/* ---------- Login ---------- */
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] {
  grid-template-columns: 1fr !important;
  background:
    radial-gradient(900px 420px at 50% -10%, hsl(var(--primary) / .10), transparent 70%),
    hsl(var(--background));
}
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] > aside { display: none !important; }
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] > section { padding: 2rem 1rem; }
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] > section > .max-w-sm {
  max-width: 400px;
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border));
  border-radius: 14px;
  padding: 2rem 1.75rem 1.75rem;
  box-shadow: var(--gc-shadow), 0 24px 48px -24px hsl(var(--primary) / .22);
  border-top: 3px solid hsl(var(--primary));
}
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] .max-w-sm > .lg\:hidden { display: block !important; }
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] .max-w-sm > h1,
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] .max-w-sm > h1 + p,
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] .max-w-sm > p.mt-8 { display: none !important; }
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] form { margin-top: 1.75rem; }
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] form label > span:first-child { font-size: 13px; font-weight: 600; color: hsl(var(--foreground) / .85); }
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] form label > span.flex {
  border-radius: 9px; background: hsl(var(--background));
}
body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] form label > span.flex:focus-within { background: hsl(var(--card)); }
body.gc-modern [data-testid="button-toggle-password"] {
  display: grid; place-items: center; min-width: 36px; min-height: 36px; margin-right: -6px; border-radius: 7px;
}
body.gc-modern [data-testid="button-toggle-password"]:hover { background: hsl(var(--muted)); }
body.gc-modern [data-testid="button-login"] {
  height: 46px; border-radius: 9px; margin-top: .5rem;
  background: linear-gradient(180deg, hsl(197 74% 29%), hsl(var(--primary)));
  box-shadow: inset 0 1px 0 hsl(0 0% 100% / .15), 0 6px 14px -8px hsl(var(--primary) / .7);
}

/* ---------- Shell header ---------- */
body.gc-modern header.sticky { background: hsl(var(--card) / .9); box-shadow: 0 1px 0 hsl(var(--border)); border-bottom: 0; }
body.gc-modern header.sticky > .mx-auto { padding-top: .6rem; padding-bottom: .6rem; }
body.gc-modern [data-testid="text-usuario"] {
  padding: .3rem .6rem; border-radius: 999px; background: hsl(var(--secondary)); color: hsl(var(--secondary-foreground));
}
body.gc-modern [data-testid="button-logout"] { border-radius: 8px; box-shadow: var(--gc-shadow); }
body.gc-modern header.sticky > .border-t.bg-primary {
  background: linear-gradient(90deg, hsl(205 70% 19%), hsl(var(--primary)));
  border-top: 0;
}
body.gc-modern [data-testid="link-cambiar-sucursal"] { border: 1px solid hsl(0 0% 100% / .22); border-radius: 6px; }
body.gc-modern main.relative { padding-top: 2rem; }

/* ---------- Sucursales ---------- */
body.gc-modern main > div.rise:first-child:has(> p.text-accent) { display: none !important; }
body.gc-modern [data-testid="text-conteo"] { display: none !important; }
body.gc-modern main > div.rise:first-child:has(> p.text-accent) + .mt-8 { margin-top: 0; max-width: 32rem; border-radius: 9px; box-shadow: var(--gc-shadow); }
body.gc-modern main .space-y-8 > section > h2 {
  font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: hsl(var(--foreground) / .7);
  padding-bottom: .5rem; border-bottom: 1px solid hsl(var(--border));
}
body.gc-modern [data-testid^="button-sucursal-"] {
  border-radius: 10px; box-shadow: var(--gc-shadow);
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
body.gc-modern [data-testid^="button-sucursal-"]:hover:not(:disabled) {
  border-color: hsl(var(--primary) / .55); box-shadow: 0 10px 24px -14px hsl(var(--primary) / .45);
}
body.gc-modern [data-testid^="button-sucursal-"] > span:first-child { border-radius: 8px; }
body.gc-modern [data-testid="status-sin-sucursales"] { border-radius: 12px; }

/* ---------- Resumen ventas ---------- */
body.gc-modern [data-testid="text-resumen-titulo"] + p { display: none !important; }
body.gc-modern [data-testid="text-resumen-titulo"] { font-weight: 600; letter-spacing: -.02em; }
body.gc-modern [data-testid="button-refresh"],
body.gc-modern [data-testid="button-imprimir"] { border-radius: 8px; box-shadow: var(--gc-shadow); }
body.gc-modern [data-testid="form-filtros"] { border-radius: 12px; box-shadow: var(--gc-shadow); }
body.gc-modern [data-testid="form-filtros"] :is(input, select) {
  border-width: 1px; border-radius: 8px; background: hsl(var(--background));
}
body.gc-modern [data-testid="form-filtros"] :is(input, select):focus {
  background: hsl(var(--card)); box-shadow: 0 0 0 4px hsl(var(--primary) / .14);
}
body.gc-modern [data-testid="button-buscar"] { border-radius: 8px; background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); }
body.gc-modern [data-testid="report-resumen"] > .print-plain { border-radius: 12px; box-shadow: var(--gc-shadow); }
body.gc-modern [data-testid="report-resumen"] .grid > .rounded-xl.border { border-radius: 10px; }
body.gc-modern [data-testid="report-resumen"] .grid > .rounded-xl.border.bg-primary\/5 {
  border-color: hsl(var(--primary) / .35); background: hsl(var(--primary) / .06); box-shadow: inset 3px 0 0 hsl(var(--primary));
}
body.gc-modern [data-testid="table-resumen"] thead tr { border-bottom: 1px solid hsl(var(--foreground) / .25); }
body.gc-modern [data-testid="table-resumen"] thead th {
  font-size: 11px; letter-spacing: .07em; background: hsl(var(--muted)); padding-top: .6rem; padding-bottom: .6rem;
}
body.gc-modern [data-testid="table-resumen"] thead th:first-child { padding-left: .75rem; border-radius: 6px 0 0 0; }
body.gc-modern [data-testid="table-resumen"] thead th:last-child { padding-right: .75rem; border-radius: 0 6px 0 0; }
body.gc-modern [data-testid="table-resumen"] :is(tbody, tfoot) td:first-child { padding-left: .75rem; }
body.gc-modern [data-testid="table-resumen"] :is(tbody, tfoot) td:last-child { padding-right: .75rem; }
body.gc-modern [data-testid="table-resumen"] tbody tr:nth-child(even) { background: hsl(var(--muted) / .35); }
body.gc-modern [data-testid="table-resumen"] tbody tr:hover { background: hsl(var(--secondary)); }
body.gc-modern [data-testid="row-totales"] { background: hsl(var(--primary) / .07); border-top: 2px solid hsl(var(--primary) / .6); }
body.gc-modern [data-testid="status-costos-incompletos"] { border-radius: 10px; background: hsl(var(--accent) / .08); }

/* ---------- Mobile ---------- */
@media (max-width: 640px) {
  body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] > section { align-items: flex-start; padding-top: 2.5rem; }
  body.gc-modern .paper-grain.lg\:grid-cols-\[1\.05fr_1fr\] > section > .max-w-sm { padding: 1.5rem 1.25rem; }
  body.gc-modern [data-testid="form-filtros"] [data-testid="button-buscar"] { width: 100%; }
  body.gc-modern main.relative { padding-top: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  body.gc-modern .rise { animation: none !important; }
  body.gc-modern *, body.gc-modern *::before, body.gc-modern *::after { transition-duration: 0s !important; }
}

@media print {
  body.gc-modern { background: #fff !important; }
  body.gc-modern [data-testid="report-resumen"] > .print-plain,
  body.gc-modern [data-testid="report-resumen"] .grid > .rounded-xl.border { box-shadow: none !important; }
  body.gc-modern [data-testid="table-resumen"] thead th,
  body.gc-modern [data-testid="table-resumen"] tbody tr,
  body.gc-modern [data-testid="row-totales"] { background: transparent !important; }
}