/* =============================================================================
   ATLAS · hoja de estilos
   -----------------------------------------------------------------------------
   ESTA HOJA ES `PROTOTIPO-ATLAS/maqueta-powerbi.html`. Se copia literal, entera
   y sin retocar: la maqueta es la especificación del diseño, y el criterio de
   aceptación es que el prototipo y ella se vean iguales pantalla por pantalla.

   Por qué no manda el design system de OPFAR aquí dentro (Sora, Space Grotesk,
   Space Mono, turquesa #0FA3B4): Atlas sustituye a Power BI, y para quien mira
   esos informes todos los días pesa más reconocer la pantalla que la coherencia
   de marca entre las cuatro aplicaciones del ecosistema. Decisión del
   09-10/09/2026; está explicada en `CLAUDE.md`, apartado «Interfaz».

   LA EXCEPCIÓN ES EL LOGIN, que se queda con la marca OPFAR y el mismo aspecto
   que On Time: es la puerta del ecosistema, no una pantalla de informe. Por eso
   siguen aquí los tokens de OPFAR y por eso su bloque declara las tipografías a
   mano, para que no le llegue la del sistema.

   Orden de la hoja:

     1. TOKENS DE OPFAR   los usa el login (y Comparar farmacias)
     2. LA MAQUETA        copiada literal de maqueta-powerbi.html
     3. AVISOS            las franjas que la maqueta no tiene, en su lenguaje
     4. LOGIN             intacto
     5. COMPARAR FARMACIAS  lo justo para la única pantalla que no está en la
                            maqueta y que el encargo pide dejar como estaba

   Si hay que cambiar el aspecto de algo, se cambia en la maqueta y se vuelve a
   copiar. Retocar el apartado 2 «de memoria» es como se pierde una maqueta.
   ============================================================================= */

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

/* =============================================================================
   1. TOKENS DE OPFAR
   ============================================================================= */

/* ===== TOKENS · COLOR (tokens/colors.css) ================================== */
:root {
  --opfar-turquesa:        #0FA3B4;
  --opfar-verde-profundo:  #123B44;
  --opfar-acero:           #9AA7AA;
  --opfar-turquesa-claro:  #5BD0D6;
  --opfar-turquesa-suave:  #BFE6EA;
  --opfar-papel:           #F1F8F8;
  --opfar-blanco:          #FFFFFF;

  --opfar-ink-900:         #0C2A31;
  --opfar-ink-700:         #123B44;
  --opfar-ink-500:         #3C5A62;
  --opfar-slate-400:       #6B838A;
  --opfar-slate-300:       #9AA7AA;
  --opfar-line-200:        #D6E4E6;
  --opfar-line-100:        #E6F0F1;
  --opfar-surface-50:      #F1F8F8;
  --opfar-surface-0:       #FFFFFF;

  --opfar-success:         #1F9D6B;
  --opfar-success-soft:    #E3F4EC;
  --opfar-warning:         #D98A1F;
  --opfar-warning-soft:    #FBEEDA;
  --opfar-danger:          #D0453B;
  --opfar-danger-soft:     #FBE5E3;
  --opfar-info:            #0FA3B4;
  --opfar-info-soft:       #DFF2F4;

  --color-primary:        var(--opfar-turquesa);
  --color-primary-hover:  #0C8B9A;
  --color-primary-active: #0A7581;
  --color-primary-soft:   var(--opfar-turquesa-suave);
  --color-primary-tint:   var(--opfar-info-soft);
  --color-on-primary:     #FFFFFF;

  --text-strong:  var(--opfar-ink-900);
  --text-body:    var(--opfar-ink-700);
  --text-muted:   var(--opfar-slate-400);
  --text-subtle:  var(--opfar-slate-300);
  --text-on-dark: #EAF6F7;
  --text-link:    var(--opfar-turquesa);

  --surface-page:   var(--opfar-surface-50);
  --surface-card:   var(--opfar-surface-0);
  --surface-sunken: #E9F3F4;
  --surface-dark:   var(--opfar-verde-profundo);
  --surface-dark-2: #0C2A31;

  --border-default: var(--opfar-line-200);
  --border-subtle:  var(--opfar-line-100);
  --border-strong:  var(--opfar-slate-300);
  --border-focus:   var(--opfar-turquesa);
}

/* ===== TOKENS · TIPOGRAFÍA (tokens/typography.css) ========================= */
:root {
  --font-display: 'Sora', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'Space Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;

  --fs-display-xl: 56px;
  --fs-display-l: 44px;
  --fs-display-m: 34px;
  --fs-h1: 28px;
  --fs-h2: 22px;
  --fs-h3: 18px;
  --fs-body-lg: 17px;
  --fs-body: 15px;
  --fs-body-sm: 13px;
  --fs-caption: 12px;
  --fs-mono: 13px;

  --lh-tight: 1.1;
  --lh-heading: 1.2;
  --lh-snug: 1.4;
  --lh-body: 1.55;

  /* ESCALA DE CIFRAS · tres niveles, y con clamp() para que escalen solas.
     Antes casi todos los tamaños de esta hoja estaban entre 9 y 15 px, así que
     en una pantalla llena de números no destacaba ninguno; y sin clamp() todo
     se apretaba al estrechar la ventana. Es lo que hace que hola.opfar.es
     respire igual a cualquier ancho: allí hay 16 clamp() y aquí no había casi
     ninguno.

     Los `vw` son más bajos que los de hola.opfar.es a propósito: allí un titular
     ocupa el ancho de la página y aquí la cifra vive dentro de una columna que
     es un tercio del contenido. Con 3.4vw, «1.043.068 €» se sale de su columna
     a 1440. Están ajustados a lo que de verdad cabe, comprobado a los cinco
     anchos. */
  --fs-cifra-1: clamp(34px, 3.4vw, 52px);      /* la que manda en la pantalla */
  --fs-cifra-2: clamp(15px, 1.3vw, 20px);      /* los KPI de apoyo */
  --fs-cifra-3: clamp(12.5px, 0.95vw, 14px);   /* cifras de contexto */
  --fs-rotulo:  12.5px;                        /* la etiqueta de una cifra */

  /* POR QUÉ EL NIVEL 2 ESTÁ POR DEBAJO DE LO QUE PROPONÍA EL ENCARGO (22-28 px).
     El encargo pedía dos cosas a la vez: nivel 1 en `clamp(34px, 3.4vw, 52px)` y
     que el salto entre niveles se note. Con el nivel 2 en 22-28 px el salto sale
     de 1,9 a 1 a 1440, y 1,9 no se lee como jerarquía: se lee como dos cifras
     grandes. Manda el salto, que es el objetivo; el número del nivel 2 era
     orientativo. Así queda en 2,6 a 1 de 1280 a 1920, medido en pantalla.

     El nivel 3 baja a 12,5-14 px, que es justo lo que decía la tabla del
     encargo para las cifras de contexto. */

  --ls-display: -0.02em;
  --ls-heading: -0.01em;
  --ls-body: 0;
  --ls-eyebrow: 0.14em;
  --ls-mono: 0.02em;
}

/* ===== TOKENS · ESPACIADO, RADIOS, SOMBRAS (tokens/spacing.css) ============ */
:root {
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px;
  --space-12: 48px; --space-16: 64px; --space-20: 80px;

  --radius-xs: 4px; --radius-sm: 8px; --radius-md: 12px;
  --radius-lg: 16px; --radius-xl: 22px; --radius-pill: 999px; --radius-circle: 50%;

  --shadow-xs: 0 1px 2px rgba(18, 59, 68, 0.06);
  --shadow-sm: 0 1px 3px rgba(18, 59, 68, 0.08), 0 1px 2px rgba(18, 59, 68, 0.04);
  --shadow-md: 0 4px 12px rgba(18, 59, 68, 0.08), 0 2px 4px rgba(18, 59, 68, 0.04);
  --shadow-lg: 0 12px 28px rgba(18, 59, 68, 0.12), 0 4px 8px rgba(18, 59, 68, 0.05);
  --shadow-focus: 0 0 0 3px rgba(15, 163, 180, 0.28);

  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 120ms; --dur-base: 200ms; --dur-slow: 320ms;

  --sidebar-width: 244px;
  --header-height: 62px;
}


/* =============================================================================
   2. LA MAQUETA · copiada literal
   ============================================================================= */

:root{color-scheme:light;--nav:#1c3b45;--nav-active:#2c5561;--brand:#429fae;--ink:#183b46;--body:#304a53;--muted:#62767e;--line:#e1e9ec;--blue:#246bd0;--old:#41858d;--green:#197b49;--red:#c2464a;--pale:#eaf5f6;--sidebar:236px;--number:clamp(1.9rem,2.5vw,2.65rem)}
*{box-sizing:border-box}body{margin:0;background:#fff;color:var(--ink);font-family:"Segoe UI",Arial,sans-serif;font-size:16px;line-height:1.4}button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #277de1;outline-offset:3px}button:disabled{cursor:default}button{color:inherit}a{color:var(--blue)}svg{display:block}button svg{pointer-events:none}button:focus:not(:focus-visible){outline:none}[hidden]{display:none!important}.icon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.number{font-variant-numeric:tabular-nums;letter-spacing:-.035em;font-weight:700}.positive{color:var(--green)!important}.negative{color:var(--red)!important}
.sidebar{width:var(--sidebar);position:fixed;inset:0 auto 0 0;background:var(--nav);color:#f3f9fa;padding:26px 14px 20px;display:flex;flex-direction:column;z-index:30}.brand{padding:4px 10px 25px;border-bottom:1px solid #ffffff15}.brand strong{font-size:22px;letter-spacing:1px}.brand span{display:block;color:#77c6d0;font-size:12px;font-weight:600;letter-spacing:2.6px;margin-top:6px}.nav-label{margin:23px 12px 10px;color:#aec6cc;font-size:12px;letter-spacing:1.6px;font-weight:600}.nav{display:grid;gap:5px}.nav button{position:relative;display:flex;align-items:center;gap:13px;text-align:left;width:100%;padding:12px 13px;border:0;background:transparent;color:#e2eef0;border-radius:7px;font-size:15px;font-weight:550}.nav button .icon{color:#a1bac1}.nav button:hover{background:#ffffff0b}.nav button.active{background:var(--nav-active);color:white}.nav button.active:before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:3px;border-radius:3px;background:#7ed6e2}.nav button.active .icon{color:#82d7df}.nav button[aria-disabled=true]{cursor:help}.side-footer{margin-top:auto;padding:30px 9px 0}.opfar-wordmark{display:flex;gap:6px;align-items:center;font-size:23px;letter-spacing:-1px;font-weight:800}.opfar-wordmark img{width:27px;height:27px}.side-footer small{display:block;color:#b4c9ce;margin-top:12px;font-size:13px;letter-spacing:.3px}.workspace{margin-left:var(--sidebar);min-width:0}.topbar{min-height:83px;padding:15px 32px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:22px;background:white}.breadcrumb{color:var(--muted);display:flex;align-items:center;gap:10px;font-size:14px;white-space:nowrap}.breadcrumb strong{color:var(--ink);font-size:16px}.top-controls{display:flex;gap:18px;align-items:center;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}.control{display:flex;align-items:center;gap:9px;font-size:14px}.control>span{color:var(--muted)}select{border:1px solid #d3e1e5;border-radius:7px;padding:8px 29px 8px 10px;color:var(--ink);background:#fff;min-height:38px;font-size:14px;cursor:pointer}.role-control{padding:5px 8px 5px 12px;border:1px dashed #8ec4ce;border-radius:9px;background:#f0f8f9;gap:8px}.role-control>span{font-size:11px;color:#326b76;font-weight:700;letter-spacing:1px}.role-control select{background:transparent;border:0;padding-top:4px;padding-bottom:4px;font-weight:600;min-height:30px}.pharmacy{padding:8px 11px;border:1px solid var(--line);border-radius:7px;font-weight:600}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--nav);color:#fff;font-size:12px;font-weight:700}.icon-button{display:grid;place-items:center;min-height:38px;min-width:38px;border:1px solid var(--line);background:#fff;border-radius:7px}.menu-toggle{display:none}.periodbar{padding:14px 32px;display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line);background:#fbfdfd}.period-label{font-size:13px;font-weight:600;color:var(--muted)}.months{display:flex;gap:5px;flex-wrap:wrap}.month{min-width:43px;padding:6px 9px;font-size:12px;font-weight:650;border:1px solid #dfe8eb;border-radius:6px;background:#fff;color:#556d75}.month:hover{border-color:#76b4c1}.month[aria-pressed=true]{background:var(--brand);border-color:var(--brand);color:#fff}.all-months{border:0;background:none;color:#307a88;font-size:13px;padding:7px 4px;white-space:nowrap}.reference-date{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap;display:flex;align-items:center;gap:7px}.reference-date:before{content:"";width:6px;height:6px;background:#74a7ae;border-radius:50%}
.content{padding:27px 34px 22px;max-width:1840px;margin:auto}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:27px}.page-heading h1{font-size:clamp(1.65rem,2vw,2rem);letter-spacing:-.6px;line-height:1.2;margin:0 0 6px;font-weight:700}.page-heading p{font-size:14px;color:var(--muted);margin:0}.report-tabs{display:flex;gap:4px;padding:4px;background:#f1f6f7;border:1px solid #e2ebed;border-radius:9px}.report-tab{padding:9px 16px;border:0;background:transparent;border-radius:6px;font-size:14px;color:#617780;white-space:nowrap}.report-tab[aria-pressed=true]{background:white;color:var(--ink);box-shadow:0 1px 4px #183b4615;font-weight:650}.role-badge{padding:7px 12px;background:#edf6f7;border-radius:6px;font-size:13px;color:#367582}.dashboard{display:grid;grid-template-columns:minmax(0,1fr) 276px;gap:28px;align-items:start}.main-column{min-width:0}.summary-metrics{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:30px;padding:2px 0 10px}.metric-column{min-width:0}.group-title{display:flex;align-items:center;gap:9px;margin:0 0 21px;font-size:16px;font-weight:650;color:#4d6974}.group-title:before{content:"";height:7px;width:7px;background:var(--blue);border-radius:2px}.metric{margin:0 0 18px;min-width:0}.metric-label{font-size:16px;font-weight:500;line-height:1.3;min-height:1.3em;color:var(--body);margin:0 0 6px}.metric-value{font-size:clamp(1.4rem,1.8vw,1.75rem);line-height:1.16;color:var(--ink);white-space:nowrap}.metric.primary{margin-bottom:24px}.primary .metric-label{min-height:2.6em;display:flex;align-items:flex-end;font-weight:600;color:#233f49}.primary .metric-value{font-size:var(--number);color:var(--blue)}.metric.previous .metric-value{color:var(--old);font-size:clamp(1.4rem,1.8vw,1.8rem)}.metric.change{margin-top:24px}.metric.change .metric-value,.metric.evolution .metric-value{font-size:clamp(1.3rem,1.75vw,1.6rem)}.delta{display:inline-flex;align-items:center;gap:5px}.delta-mark{font-size:.6em;font-weight:800;letter-spacing:0;line-height:1}.unit{font-size:.78em;letter-spacing:-.015em}.support-band{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;background:var(--pale);padding:23px 23px 21px;border-radius:10px;margin:10px 0 25px}.support-band .metric{margin:0}.support-band .metric-label{font-size:16px;margin-bottom:8px;white-space:nowrap}.support-band .metric-value{font-size:clamp(1.35rem,1.7vw,1.85rem);color:var(--blue)}.support-trend{margin-top:7px;font-size:16px;font-weight:650;letter-spacing:0}.support-trend small{font-size:12px;font-weight:400;color:var(--muted)}
.right-column{display:grid;gap:16px}.aside-card{padding:22px 23px;border:1px solid var(--line);border-radius:11px;background:white}.aside-card h2{font-size:16px;font-weight:600;line-height:1.35;margin:0 0 13px;color:#2b4c56}.aside-card .big{font-size:clamp(2rem,2.7vw,2.85rem);line-height:1.12;white-space:nowrap}.aside-card p{font-size:13px;color:#506e79;margin:8px 0 0;line-height:1.5}.projection{background:#e5f3f4;border-color:#cbe7eb;border-left:4px solid var(--brand)}.projection .big{color:#287889}.grade{background:#fcf5e9;border-color:#eee0c6;border-left:4px solid #c1954f}.grade .big{color:#946123}.grade .denominator{font-size:20px;font-weight:400;color:#927950;letter-spacing:0}.grade-track{height:4px;border-radius:4px;background:#e9ddc8;margin-top:17px;overflow:hidden}.grade-track span{display:block;width:77.3%;height:100%;background:#c69549}.preferences .big{color:var(--blue);font-size:clamp(2rem,2.6vw,2.7rem)}.preference-track{height:7px;border-radius:7px;background:#e0eeef;overflow:hidden;margin-top:17px}.preference-track span{display:block;width:32.2%;height:100%;background:#56a5b3}.profit-mini{padding-bottom:5px}.profit-mini .metric{margin-bottom:19px}.profit-mini .metric-label{font-size:14px}.profit-mini .metric-value{font-size:clamp(1.25rem,1.5vw,1.5rem)}
.chart-section{padding-top:4px;min-width:0}.chart-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.chart-heading h2{margin:0;font-size:20px;letter-spacing:-.25px;font-weight:650}.chart-heading p{margin:6px 0 12px;color:var(--muted);font-size:14px}.chart-caption{font-size:12px;color:#607780;white-space:nowrap;padding-top:6px}.legend{display:flex;align-items:center;flex-wrap:wrap;gap:8px 20px;padding:8px 0 8px;min-height:33px}.legend button{padding:0;border:0;background:none;display:flex;gap:7px;align-items:center;font-size:13px;color:#4b626c;white-space:nowrap}.legend button:before{content:"";width:9px;height:9px;border-radius:50%;background:var(--series-color)}.legend button[aria-pressed=false]{opacity:.45;text-decoration:line-through}.chart-scroll{width:100%;overflow-x:auto;overflow-y:hidden}.line-chart{width:100%;min-width:680px;height:285px;overflow:visible}.chart-divider{border-top:1px solid var(--line);margin-top:25px;padding-top:22px}.page-footer{display:flex;justify-content:space-between;gap:15px;padding:21px 0 0;margin-top:20px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}.prototype-label{display:flex;align-items:center;gap:7px}.prototype-label:before{content:"";height:6px;width:6px;border-radius:50%;background:#c9994b}.review-details{font-size:13px;color:var(--muted);margin:16px 0 0}.review-details summary{cursor:pointer;width:fit-content}.review-details p{max-width:850px;line-height:1.65;margin:10px 0}.review-details a{margin-right:15px}
.objectives{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;padding:0 0 5px}.objective{min-width:0}.objective-title{font-size:17px;font-weight:650;margin:0 0 18px;color:var(--ink);text-align:center;min-height:2.6em;display:grid;place-items:center}.ring{width:clamp(125px,10vw,170px);aspect-ratio:1;margin:0 auto 22px;position:relative;border-radius:50%;background:conic-gradient(var(--blue) 0deg var(--angle),#dcebee var(--angle) 360deg)}.ring:before{content:"";position:absolute;inset:19%;background:white;border-radius:50%}.ring>span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:1;color:var(--blue);font-size:clamp(1.2rem,1.65vw,1.8rem);letter-spacing:-.04em}.ring>span.under{color:#b84d47}.objective .metric{margin-bottom:19px}.objective .metric-label{font-size:15px;min-height:2.6em;display:flex;align-items:flex-end;line-height:1.3}.objective .metric-value{font-size:clamp(1.2rem,1.65vw,1.6rem)}.objective .primary{margin-bottom:19px}.objective .primary .metric-value{font-size:clamp(1.35rem,1.8vw,1.8rem)}.objective .metric.change{margin-top:0}.objective .evolution .metric-label{min-height:1.3em}.target-settings{display:flex;gap:18px;flex-wrap:wrap;padding:14px 18px;margin-bottom:27px;border:1px solid var(--line);border-radius:8px;background:#fafcfc}.target-settings .control{font-size:14px}.target-settings .control>span{color:var(--body)}.target-settings select{min-height:34px;padding-top:5px;padding-bottom:5px}.target-settings .settings-label{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:600;margin-right:auto}.cmd-support{display:grid;grid-template-columns:1fr 1fr;gap:22px 16px;background:#f1f7f8}.cmd-support .metric{margin:0}.cmd-support .metric-label{font-size:14px;white-space:nowrap}.cmd-support .metric-value{font-size:clamp(1.2rem,1.45vw,1.55rem);color:var(--blue)}.cmd-support .support-trend{font-size:14px}.cmd-preference .ring{width:160px;margin:9px auto 0;--angle:115.92deg;background:conic-gradient(var(--blue) 0deg var(--angle),#66b1b6 var(--angle) 360deg)}.cmd-preference .ring span{font-size:27px}.cmd-charts{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(240px,1fr);gap:30px}.cmd-charts .line-chart{height:245px}.bar-comparison{padding:26px 0 14px}.bar-label{display:flex;justify-content:space-between;gap:10px;font-size:14px;color:var(--body);margin:0 0 8px}.bar-label strong{color:var(--blue);font-size:18px}.bar-track{height:22px;border-radius:3px;background:#f0f4f6;overflow:hidden;margin-bottom:23px}.bar-track span{display:block;background:var(--blue);height:100%;width:95%}.bar-track.previous span{background:#66a9b0;width:91%}.bar-comparison .previous-label strong{color:var(--old)}
.toast{position:fixed;bottom:24px;left:calc(50% + var(--sidebar)/2);transform:translateX(-50%);padding:13px 20px;background:#163c48;color:white;border-radius:9px;box-shadow:0 5px 25px #14363e25;max-width:min(600px,90vw);font-size:14px;z-index:60}.backdrop{display:none}.content[data-report=cmd] .page-heading{margin-bottom:22px}
@media(min-width:1800px){:root{--sidebar:256px}.content{padding:35px 44px 25px}.dashboard{grid-template-columns:minmax(0,1fr) 318px;gap:38px}.summary-metrics{gap:44px}.metric-label{font-size:18px}.metric{margin-bottom:23px}.primary .metric-label{min-height:1.3em}.support-band{padding:26px}.line-chart{height:330px}.aside-card{padding:24px 26px}.objective .metric-label{font-size:17px}.objective .metric-value{font-size:27px}.objective .primary .metric-value{font-size:31px}.cmd-support .metric-value{font-size:26px}.cmd-support .metric-label{font-size:16px}}
@media(max-width:1390px){.topbar{gap:12px;padding:14px 24px}.top-controls{gap:11px}.breadcrumb{display:none}.content{padding:26px 26px 20px}.dashboard{grid-template-columns:minmax(0,1fr) 245px;gap:24px}.summary-metrics{gap:22px}.support-band{gap:15px;padding:20px 16px}.support-band .metric-label{font-size:14px}.support-band .metric-value{font-size:22px}.aside-card{padding:21px 19px}.dashboard.cmd-layout{grid-template-columns:1fr}.cmd-aside{grid-template-columns:1fr 1.4fr 1fr;align-items:stretch}.cmd-preference .ring{width:130px;margin-top:10px}.cmd-preference .ring span{font-size:24px}.cmd-aside .projection{align-content:center}.objectives{gap:28px}.ring{width:155px}.ring>span{font-size:26px}.objective .metric-value{font-size:25px}.objective .primary .metric-value{font-size:28px}.cmd-support{gap:19px}.cmd-support .metric-value{font-size:24px}}
@media(max-width:1180px){:root{--sidebar:210px}.sidebar{padding-left:10px;padding-right:10px}.brand strong{font-size:20px}.topbar{padding:13px 22px}.top-controls{justify-content:flex-start;width:100%}.control.pharmacy-control{display:none}.periodbar{padding:12px 23px;flex-wrap:wrap;gap:8px}.period-label{display:none}.reference-date{display:none}.month{min-width:39px;padding:6px}.dashboard{grid-template-columns:1fr}.right-column:not(.cmd-aside){grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.right-column .profit-mini{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.profit-mini>h2{grid-column:1/-1;margin:0}.profit-mini .metric{margin:0 0 15px}.summary-metrics{gap:35px}.support-band{gap:20px;padding:22px}.support-band .metric-label{font-size:16px}.support-band .metric-value{font-size:26px}.primary .metric-label{min-height:2.6em}.metric.primary .metric-value{font-size:36px}.cmd-layout .metric.primary .metric-value{font-size:25px}.objectives{gap:19px}.objective .metric-value{font-size:22px}.objective .metric-label{font-size:14px}.ring{width:140px}.ring>span{font-size:24px}.cmd-charts{grid-template-columns:1fr}.cmd-charts .bar-comparison{display:grid;grid-template-columns:1fr 1fr;gap:0 25px;padding-top:15px}.cmd-charts .bar-label{grid-row:1}.cmd-charts .bar-track{grid-row:2}.cmd-aside{grid-template-columns:1fr 1fr}.cmd-support{grid-column:2;grid-row:1/3}.cmd-preference .ring{width:135px}.cmd-preference{display:flex;align-items:center;gap:15px}.cmd-preference h2{font-size:15px}.cmd-preference .ring{flex-shrink:0}}
@media(max-width:850px){:root{--sidebar:0px}.sidebar{width:236px;transform:translateX(-100%);transition:transform .18s}.sidebar.is-open{transform:translateX(0)}.backdrop.is-open{display:block;position:fixed;inset:0;background:#183b4655;z-index:25}.menu-toggle{display:grid}.topbar{padding:12px 18px}.top-controls{gap:10px}.top-controls .avatar{display:none}.top-controls .control>span:not(.demo-label){display:none}.role-control{padding:4px 6px}.role-control select{font-size:13px;max-width:175px}.top-controls>.icon-button{margin-left:auto}.periodbar{padding:12px 18px}.content{padding:24px 22px 20px}.page-heading{gap:12px}.page-heading h1{font-size:26px}.report-tab{padding:8px 12px}.summary-metrics{gap:26px}.metric-label{font-size:16px}.metric.primary .metric-value{font-size:33px}.primary .metric-label{min-height:2.6em}.support-band .metric-value{font-size:23px}.support-band .metric-label{font-size:15px}.support-trend{font-size:15px}.aside-card{padding:20px 17px}.aside-card .big{font-size:33px}.toast{left:50%}.ring{width:145px}}
@media(max-width:620px){.topbar{gap:9px}.top-controls{gap:7px}.role-control>.demo-label{display:none}.role-control select{max-width:162px}.top-controls>.icon-button{display:none}.topbar .control select{padding-right:18px}.periodbar{gap:6px}.months{gap:5px;display:grid;grid-template-columns:repeat(6,1fr);flex:1}.month{min-width:0;padding:6px 8px}.all-months{align-self:center;font-size:12px;max-width:65px;white-space:normal}.content{padding:22px 18px}.page-heading{align-items:flex-start;flex-direction:column;margin-bottom:24px}.report-tabs{width:100%}.report-tab{flex:1}.summary-metrics{grid-template-columns:1fr;gap:24px}.metric-column{display:grid;grid-template-columns:1fr 1fr;gap:18px 16px;padding-bottom:22px;border-bottom:1px solid var(--line)}.group-title{grid-column:1/-1;margin:0;font-size:17px}.metric-column .metric{margin:0}.metric-column .primary .metric-label{min-height:1.3em}.metric-column .metric-label{font-size:14px}.metric-column .metric-value{font-size:24px}.metric-column .primary .metric-value{font-size:29px}.support-band{grid-template-columns:1fr 1fr;gap:24px 18px;padding:22px 18px;margin-top:1px}.support-band .metric-value{font-size:25px}.support-band .metric-label{font-size:15px}.right-column:not(.cmd-aside){grid-template-columns:1fr 1fr}.right-column .preferences{grid-column:1/-1}.right-column .profit-mini{grid-template-columns:1fr}.profit-mini>h2{grid-column:auto}.aside-card h2{font-size:15px}.aside-card .big{font-size:30px}.grade .denominator{font-size:17px}.aside-card{padding:19px 16px}.chart-heading h2{font-size:19px}.chart-heading{flex-direction:column;gap:0}.chart-caption{display:none}.legend{gap:10px 14px}.legend button{font-size:12px}.page-footer{flex-direction:column;gap:8px}.objectives{grid-template-columns:1fr 1fr;gap:27px 22px}.objective:nth-child(n+3){border-top:1px solid var(--line);padding-top:22px}.objective-title{font-size:16px;margin-bottom:15px}.ring{width:135px;margin-bottom:18px}.objective .metric-label{font-size:14px}.objective .metric-value{font-size:22px}.cmd-layout .metric.primary .metric-value{font-size:23px}.target-settings{gap:10px;padding:14px}.target-settings .settings-label{width:100%}.target-settings .control{width:100%;justify-content:space-between}.cmd-aside{grid-template-columns:1fr}.cmd-support{grid-column:auto;grid-row:auto;padding:23px}.cmd-preference{justify-content:space-between}.cmd-preference .ring{margin:0}.cmd-charts .bar-comparison{display:block}.review-details{font-size:12px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}@media print{.sidebar,.topbar,.periodbar,.report-tabs,.target-settings,.review-details,.toast,.page-footer,.role-badge{display:none!important}.workspace{margin:0}.content{padding:0}.dashboard{grid-template-columns:minmax(0,1fr) 245px}.right-column{display:grid!important;grid-template-columns:1fr!important}.chart-scroll{overflow:visible}.line-chart{min-width:0}.aside-card,.metric-column,.objective{break-inside:avoid}@page{size:A3 landscape;margin:12mm}}
/* Categorías: misma superficie de Atlas, gráficos con leyendas fuera del círculo. */
.categories-layout{display:grid;grid-template-columns:minmax(0,1fr) 324px;gap:30px;align-items:start}.category-main{min-width:0}.category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 26px}.category-chart{min-width:0;padding:0 0 22px;border-bottom:1px solid var(--line)}.category-chart h2,.growth-panel h2,.zone-heading h2{font-size:19px;line-height:1.3;letter-spacing:-.25px;margin:0 0 6px;font-weight:650}.category-chart .chart-subtitle{font-size:13px;color:var(--muted);margin:0 0 18px}.category-chart-body{display:flex;align-items:center;gap:18px}.category-pie{flex:0 0 42%;width:42%;max-width:188px;aspect-ratio:1;overflow:visible}.category-pie path{stroke:white;stroke-width:1.2;transition:opacity .12s;cursor:pointer}.category-pie path:focus-visible{outline:none;stroke:var(--ink);stroke-width:3}.category-legend{display:grid;gap:3px;flex:1;min-width:0}.category-key{display:grid;grid-template-columns:8px minmax(0,1fr);gap:8px;text-align:left;border:0;background:transparent;border-radius:5px;padding:5px 4px;font-size:14px;line-height:1.3;width:100%;color:var(--body)}.category-key:hover,.category-key[aria-pressed=true]{background:#edf5f8}.category-key .swatch{width:8px;height:8px;background:var(--slice-color);border-radius:2px;margin-top:5px}.category-key-name{display:block;overflow-wrap:anywhere}.category-key-value{display:block;font-size:14px;font-weight:650;color:var(--ink);margin-top:3px;font-variant-numeric:tabular-nums}.category-key-value small{font-size:12px;color:var(--muted);font-weight:400;margin-left:6px}.category-chart.has-selection .category-pie path:not(.is-selected){opacity:.22}.category-chart.has-selection .category-key:not([aria-pressed=true]){opacity:.65}.category-chart.wide{grid-column:1/-1}.category-chart.wide .category-chart-body{gap:35px;max-width:700px;margin:12px auto 0}.category-chart.wide .category-pie{width:230px;max-width:230px;flex-basis:230px}.category-chart.wide .category-legend{grid-template-columns:1fr 1fr;gap:12px 20px}.category-chart.wide .category-key{font-size:15px}.category-grid .category-chart{min-height:330px}.growth-column{display:grid;gap:20px}.growth-panel{background:var(--pale);border:1px solid #d9eaed;border-radius:11px;padding:22px 20px}.growth-panel>p{font-size:13px;color:var(--muted);margin:6px 0 17px}.growth-list{display:grid;gap:13px;margin:0;padding:0;list-style:none}.growth-row-label{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:14px;margin-bottom:5px}.growth-row-label span{color:#36545e;overflow-wrap:anywhere}.growth-row-label strong{color:var(--blue);font-size:15px;font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}.growth-track{height:6px;border-radius:3px;background:#dbecef;overflow:hidden}.growth-track span{display:block;width:var(--growth-width);height:100%;background:#3a86e7;border-radius:3px}.growth-list li:first-child .growth-row-label{font-weight:650}.growth-footnote{font-size:12px;color:#607a81;margin:17px 0 0!important}.category-table-section{margin-top:28px;min-width:0}.zone-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:15px}.zone-heading p{font-size:13px;color:var(--muted);margin:5px 0 0}.zone-count{font-size:12px;color:#3b7480;background:#edf6f7;border-radius:5px;padding:5px 8px;white-space:nowrap}.zone-table-scroll{overflow:auto;max-height:380px;border:1px solid var(--line);border-radius:9px}.zone-table{width:100%;border-collapse:separate;border-spacing:0;min-width:730px;text-align:right;font-size:14px;font-variant-numeric:tabular-nums}.zone-table th,.zone-table td{padding:12px 13px;white-space:nowrap;border-bottom:1px solid #e7edef}.zone-table th:first-child,.zone-table td:first-child{text-align:left}.zone-table th{position:sticky;top:0;background:#f3f8f9;z-index:1;color:#49616b;font-size:13px;font-weight:600}.zone-table th button{font:inherit;color:inherit;padding:0;border:0;background:none;display:inline-flex;gap:6px;align-items:center}.sort-indicator{color:#287588;font-size:12px}.zone-table td:first-child{font-weight:500;color:#2c4b56}.zone-table tbody tr:nth-child(even){background:#fafcfc}.zone-table tbody tr:hover{background:#eff6fa}.zone-table tfoot td{position:sticky;bottom:0;background:#e6f2f4;border-top:1px solid #c9e0e4;border-bottom:0;font-weight:700;color:var(--ink);z-index:1;padding-top:14px;padding-bottom:14px}.zone-note{font-size:12px;color:var(--muted);line-height:1.5;margin:10px 0 0}.category-totals{margin-top:28px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;background:var(--pale);border-radius:10px;padding:24px 20px}.category-totals .metric{margin:0}.category-totals .metric-label{font-size:14px;min-height:2.6em;display:flex;align-items:flex-end}.category-totals .metric-value{font-size:clamp(1.15rem,1.45vw,1.6rem)}.categories-settings{margin-top:-4px;margin-bottom:25px}.category-note{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px;margin:0 0 23px}.category-note:before{content:"";width:5px;height:5px;flex-shrink:0;border-radius:50%;background:#89a9b1}
@media(min-width:1800px){.categories-layout{grid-template-columns:minmax(0,1fr) 365px;gap:38px}.category-grid{gap:32px 38px}.category-chart-body{gap:25px}.category-pie{max-width:220px}.category-key{font-size:15px;padding:6px 5px}.category-key-value{font-size:15px}.category-grid .category-chart{min-height:342px}.growth-panel{padding:24px}.growth-row-label{font-size:15px}.growth-row-label strong{font-size:16px}.growth-list{gap:14px}.zone-table{font-size:15px}.zone-table th{font-size:14px}}
@media(max-width:1500px){.categories-layout{grid-template-columns:minmax(0,1fr) 282px;gap:24px}.category-chart-body{flex-direction:column;gap:15px}.category-pie{width:165px;flex-basis:auto;max-width:165px}.category-legend{width:100%;grid-template-columns:1fr 1fr;gap:6px 9px;align-items:start}.category-key{font-size:14px}.category-key-value{font-size:14px}.category-key-value small{display:block;margin-left:0;font-size:12px}.category-chart.wide .category-chart-body{flex-direction:row;gap:22px}.category-chart.wide .category-pie{width:180px;flex-basis:180px}.category-chart.wide .category-key{font-size:14px}.category-totals{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.growth-panel{padding:21px 17px}.growth-row-label{font-size:14px}}
@media(max-width:1180px){.categories-layout{grid-template-columns:1fr}.category-chart-body{flex-direction:row;gap:18px}.category-pie{width:145px;max-width:145px;flex-basis:145px}.category-legend{grid-template-columns:1fr}.category-key-value small{display:inline;margin-left:5px}.category-grid .category-chart{min-height:310px}.growth-column{grid-template-columns:1fr 1fr;margin-top:3px}.category-chart.wide .category-pie{width:200px;flex-basis:200px;max-width:200px}.category-totals{grid-template-columns:repeat(5,minmax(0,1fr))}.category-totals .metric-value{font-size:19px}}
@media(max-width:700px){.category-chart-body{flex-direction:column}.category-pie{width:165px;max-width:165px;flex-basis:auto}.category-legend{grid-template-columns:1fr}.category-key{font-size:14px}.category-key-value{font-size:14px}.category-chart.wide .category-chart-body{flex-direction:column}.category-chart.wide .category-pie{width:190px;flex-basis:auto}.category-chart.wide .category-legend{grid-template-columns:1fr 1fr;width:100%;gap:12px}.category-grid{gap:25px 22px}.category-chart h2{font-size:18px}.category-totals{grid-template-columns:repeat(2,minmax(0,1fr))}.category-totals .metric-label{font-size:14px;min-height:1.3em}.category-totals .metric-value{font-size:23px}.zone-heading{align-items:flex-start}.zone-count{white-space:normal;max-width:100px}.category-note{line-height:1.6;align-items:flex-start}.category-note:before{margin-top:7px}}
@media(max-width:500px){.category-grid{grid-template-columns:1fr}.category-chart-body{flex-direction:row;gap:18px}.category-pie{width:140px;max-width:140px;flex-basis:140px}.category-grid .category-chart{min-height:0;padding-bottom:24px}.category-legend{grid-template-columns:1fr}.category-key{font-size:14px}.category-key-value{font-size:14px}.category-key-value small{display:block;margin-left:0}.growth-column{grid-template-columns:1fr}.category-chart.wide .category-chart-body{flex-direction:column}.category-chart.wide .category-key{font-size:14px}.category-chart.wide .category-key-value small{display:inline;margin-left:5px}.category-chart .chart-subtitle{font-size:12px}.zone-heading{flex-direction:column;gap:7px}.zone-count{max-width:none}.category-totals{padding:21px 17px}.growth-row-label{font-size:15px}}
@media print{.category-chart,.growth-panel{break-inside:avoid}.categories-layout{grid-template-columns:minmax(0,1fr) 290px}.zone-table-scroll{max-height:none;overflow:visible}.zone-table{min-width:0}.category-key{font-size:12px}.category-pie{max-width:150px}.category-chart-body{flex-direction:row}.category-legend{grid-template-columns:1fr}}
/* Inventario: foto de existencias, con las tres distribuciones y sus valoraciones. */
.inventory-intro{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 24px}.inventory-intro p{margin:0;font-size:14px;color:var(--muted)}.inventory-snapshot{display:inline-flex;align-items:center;gap:8px;padding:7px 11px;border-radius:6px;background:#eef6f7;color:#3d7380;font-size:13px;white-space:nowrap}.inventory-snapshot .icon{width:16px;height:16px}.inventory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;align-items:stretch}.inventory-grid .category-chart{border-bottom:0;padding:23px 19px 25px;min-width:0}.inventory-grid .category-chart:nth-child(2){background:#e9f5f5;border:1px solid #d7e9eb;border-radius:12px}.inventory-grid .category-chart h2{font-size:19px}.inventory-grid .category-chart .chart-subtitle{margin-bottom:23px}.inventory-grid .category-chart-body{flex-direction:column;gap:25px}.inventory-grid .category-pie{flex-basis:auto;width:clamp(165px,15vw,240px);max-width:240px}.inventory-grid .category-legend{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:9px 12px;align-items:start}.inventory-grid .category-key{font-size:14px;padding:5px 3px}.inventory-grid .category-key-value{font-size:15px}.inventory-grid .category-key-value small{display:inline;margin-left:5px}.inventory-controls{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:25px;padding:26px 0;margin-top:16px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);align-items:start}.inventory-provider label{display:block;font-size:16px;font-weight:550;color:var(--body);margin:0 0 12px}.inventory-provider select{width:100%;min-height:45px;font-size:15px}.inventory-controls .metric{margin:0}.inventory-controls .metric-label{font-size:16px;min-height:2.6em;display:flex;align-items:flex-end;line-height:1.3;margin-bottom:9px}.inventory-controls .metric-value{font-size:clamp(1.8rem,2.4vw,2.3rem)}.inventory-controls .stock-positive .metric-value{color:var(--green)}.inventory-controls .stock-negative .metric-value{color:var(--red)}.inventory-value-section{margin-top:29px}.inventory-value-heading{font-size:19px;letter-spacing:-.2px;margin:0 0 16px;font-weight:650}.inventory-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:25px 27px;background:var(--pale);border-radius:11px}.inventory-values .metric{margin:0;padding-left:17px;border-left:4px solid #72b7af}.inventory-values .metric:last-child{border-color:var(--blue)}.inventory-values .metric-label{font-size:17px;margin-bottom:9px}.inventory-values .metric-value{font-size:clamp(1.7rem,2.4vw,2.5rem);color:#286d78}.inventory-values .metric:last-child .metric-value{color:var(--blue)}.inventory-method-note{font-size:12px;color:var(--muted);line-height:1.6;margin:16px 0 0}.inventory-grid .category-chart.has-selection .category-key:not([aria-pressed=true]){opacity:.7}
@media(min-width:1800px){.inventory-grid{gap:35px}.inventory-grid .category-chart{padding:27px 25px}.inventory-grid .category-key{font-size:16px}.inventory-grid .category-key-value{font-size:16px}.inventory-grid .category-legend{gap:12px 18px}.inventory-controls{padding:29px 0;gap:35px}.inventory-controls .metric-label{font-size:18px}.inventory-provider label{font-size:18px}}
@media(max-width:1390px){.inventory-grid{gap:15px}.inventory-grid .category-chart{padding:20px 13px}.inventory-grid .category-chart h2{font-size:18px}.inventory-grid .category-legend{grid-template-columns:1fr;gap:5px}.inventory-grid .category-key>span:last-child{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.inventory-grid .category-key-name{font-size:14px}.inventory-grid .category-key-value{white-space:nowrap;font-size:14px}.inventory-grid .category-key-value small{font-size:12px}.inventory-controls{gap:18px}.inventory-controls .metric-label{font-size:15px}.inventory-values{gap:20px;padding:23px}.inventory-values .metric-value{font-size:30px}}
@media(max-width:1180px){.inventory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.inventory-grid .category-chart:last-child{grid-column:1/-1;border-top:1px solid var(--line);padding-top:25px}.inventory-grid .category-chart:last-child .category-chart-body{flex-direction:row;max-width:740px;margin:0 auto}.inventory-grid .category-chart:last-child .category-pie{width:190px;max-width:190px;flex-basis:190px}.inventory-grid .category-chart:last-child .category-legend{grid-template-columns:1fr 1fr}.inventory-grid .category-chart:last-child .category-key>span:last-child{display:block}.inventory-controls{grid-template-columns:repeat(3,minmax(0,1fr))}.inventory-provider{grid-column:1/-1;max-width:360px}.inventory-controls .metric-label{font-size:16px}.inventory-values .metric-value{font-size:28px}}
@media(max-width:620px){.inventory-intro{align-items:flex-start;flex-direction:column;gap:12px}.inventory-intro p{font-size:13px}.inventory-grid{grid-template-columns:1fr}.inventory-grid .category-chart{padding:20px 13px}.inventory-grid .category-chart-body{flex-direction:row;align-items:center;gap:18px}.inventory-grid .category-pie{width:135px;max-width:135px;flex-basis:135px}.inventory-grid .category-legend{grid-template-columns:1fr}.inventory-grid .category-key>span:last-child{display:block}.inventory-grid .category-key{font-size:14px}.inventory-grid .category-key-value{font-size:14px}.inventory-grid .category-chart:last-child{grid-column:auto;border-top:0}.inventory-grid .category-chart:last-child .category-chart-body{flex-direction:row}.inventory-grid .category-chart:last-child .category-pie{width:135px;max-width:135px;flex-basis:135px}.inventory-grid .category-chart:last-child .category-legend{grid-template-columns:1fr}.inventory-controls{grid-template-columns:1fr 1fr;gap:24px 18px;padding:23px 0}.inventory-provider{max-width:none}.inventory-controls .metric-label{font-size:14px}.inventory-controls .metric-value{font-size:29px}.inventory-values{grid-template-columns:1fr;padding:24px;gap:24px}.inventory-values .metric-value{font-size:34px}.inventory-values .metric-label{font-size:16px}.inventory-method-note{font-size:12px}}
@media print{.inventory-intro{margin-bottom:12px}.inventory-controls,.inventory-values,.inventory-grid .category-chart{break-inside:avoid}.inventory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.inventory-grid .category-chart:last-child{grid-column:auto}.inventory-grid .category-chart-body,.inventory-grid .category-chart:last-child .category-chart-body{flex-direction:column}.inventory-grid .category-chart:last-child .category-legend{grid-template-columns:1fr}}
.inventory-filters{display:grid;gap:16px}.inventory-controls-cmd{align-items:center;margin-top:22px}.inventory-cmd>.inventory-value-section{margin-top:0}.inventory-cmd-objectives{margin-top:25px;margin-bottom:25px}.inventory-cmd-objectives .target-settings{margin-bottom:0}.inventory-cmd .inventory-grid{margin-top:8px}.inventory-cmd .inventory-controls .metric-label{min-height:2.6em}@media(max-width:1180px){.inventory-filters{grid-column:1/-1;grid-template-columns:1fr 1fr}.inventory-filters .inventory-provider{grid-column:auto;max-width:none}.inventory-summary .inventory-filters{grid-template-columns:1fr;max-width:360px}}@media(max-width:620px){.inventory-filters{grid-template-columns:1fr}.inventory-summary .inventory-filters{max-width:none}.inventory-controls-cmd{align-items:start}}
.warehouse-controls{display:flex;align-items:center;justify-content:space-between;gap:30px;padding-bottom:25px;margin-bottom:24px;border-bottom:1px solid var(--line)}.warehouse-family{display:grid;gap:10px;width:350px;max-width:43%;font-size:16px;font-weight:550}.warehouse-family select{width:100%;min-height:44px;font-size:15px}.warehouse-kpis{display:flex;gap:38px}.warehouse-kpis .metric{margin:0}.warehouse-kpis .metric-label{font-size:16px}.warehouse-kpis .metric-value{font-size:34px}.warehouse-top{display:grid;grid-template-columns:.95fr 1.1fr;gap:24px;align-items:start}.warehouse-bottom{display:grid;grid-template-columns:1.55fr .9fr;gap:24px;align-items:start;margin-top:25px}.warehouse-panel{min-width:0;background:#f4fafb;border:1px solid #dce8eb;border-radius:11px;padding:21px 18px 15px}.warehouse-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:17px}.warehouse-heading h2,.pref-chart h2,.pref-rank h2{margin:0;font-size:19px;font-weight:650;line-height:1.3;letter-spacing:-.2px}.warehouse-heading p{font-size:13px;line-height:1.45;color:var(--muted);margin:5px 0 0}.warehouse-negative h2{color:#a63f49}.warehouse-expiry h2{color:#916c24}.warehouse-count{font-size:12px;white-space:nowrap;background:#e6f1f3;border-radius:5px;padding:4px 7px;color:#567984}.warehouse-scroll{overflow:auto;max-height:348px;border:1px solid #dce7eb;border-radius:7px;scrollbar-width:thin;background:white}.warehouse-table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;color:#324d58;font-variant-numeric:tabular-nums;text-align:left}.warehouse-table th,.warehouse-table td{padding:10px;border-bottom:1px solid #e6edef;vertical-align:top;line-height:1.45}.warehouse-table thead th{background:#edf5f7;position:sticky;top:0;z-index:2;font-size:13px;font-weight:600;white-space:nowrap;border-bottom:1px solid #cadfe5}.warehouse-table th button{display:inline-flex;gap:5px;border:0;padding:0;background:none;font:inherit;color:inherit;white-space:nowrap}.warehouse-table tbody tr:nth-child(even){background:#f7fafb}.warehouse-table tbody tr:hover{background:#edf5fa}.warehouse-table .col-cn{width:72px;white-space:nowrap;font-size:13px}.warehouse-table .col-stock,.warehouse-table .col-cost,.warehouse-table .col-count{text-align:right;white-space:nowrap}.warehouse-table .col-date{white-space:nowrap;font-size:13px}.warehouse-table .col-description{min-width:205px;overflow-wrap:anywhere}.warehouse-table .col-supplier{min-width:115px;max-width:170px;overflow-wrap:anywhere;font-size:13px}.warehouse-table .col-family{min-width:165px}.warehouse-table tfoot td{position:sticky;bottom:0;z-index:1;background:#e3f0f3;border-top:1px solid #bfd9df;border-bottom:0;font-weight:700;color:var(--ink);white-space:nowrap;padding:13px 10px}.warehouse-negative .warehouse-table{min-width:420px}.warehouse-expiry .warehouse-table{min-width:525px}.warehouse-group .warehouse-table{min-width:650px}.warehouse-families .warehouse-table{min-width:300px}.warehouse-group .warehouse-scroll{max-height:368px}.warehouse-note{font-size:12px;color:var(--muted);line-height:1.5;margin:12px 0 0}.warehouse-objectives{margin-top:25px}.warehouse-objectives .target-settings{margin-bottom:0}
.preferences-layout{display:grid;grid-template-columns:minmax(0,1fr) 294px;gap:28px;align-items:start}.pref-main{min-width:0}.pref-top{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:22px;align-items:start}.pref-kpi-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.pref-kpi-columns .metric-label{font-size:16px;min-height:2.6em;display:flex;align-items:flex-end}.pref-kpi-columns .metric.primary{margin-bottom:25px}.pref-kpi-columns .metric-value{font-size:clamp(1.35rem,1.8vw,1.85rem)}.pref-kpi-columns .primary .metric-value{font-size:clamp(1.5rem,2vw,2.2rem)}.pref-evolution{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:10px}.pref-evolution .metric-label{font-size:15px;min-height:2.6em}.pref-evolution .metric-value{font-size:26px}.pref-share h2{font-size:17px;font-weight:650;line-height:1.3;margin:0 0 20px}.pref-share-ring{width:175px;aspect-ratio:1;border-radius:50%;background:conic-gradient(#66b1b3 0deg 115.92deg,#246bd0 115.92deg 360deg);display:grid;place-items:center;margin:0 auto 16px}.pref-share-ring>div{width:68%;height:68%;background:white;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column}.pref-share-ring strong{font-size:25px;color:var(--blue)}.pref-share-ring>div span{font-size:12px;color:var(--muted);margin-top:4px}.pref-share-key{font-size:12px;display:grid;gap:7px}.pref-share-key>span{display:flex;align-items:center;gap:5px}.pref-share-key i,.pref-rank-legend i{width:8px;height:8px;background:#66b1b3;display:inline-block;border-radius:50%;flex-shrink:0}.pref-share-key>span:nth-child(2) i{background:var(--blue)}.pref-share-key strong{margin-left:auto;font-variant-numeric:tabular-nums}.pref-filters{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;background:var(--pale);padding:18px 21px;border-radius:9px;margin:18px 0 13px}.pref-filters label{display:grid;gap:8px;font-size:15px;font-weight:500}.pref-filters select{font-size:15px;min-height:40px;width:100%}.pref-dates{display:flex;gap:17px;align-items:center;margin:0 0 25px;flex-wrap:wrap}.pref-dates>span{font-size:14px;font-weight:600;color:var(--muted)}.pref-dates label{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.pref-dates input{font:inherit;font-size:14px;padding:7px 9px;border:1px solid #d3e1e5;border-radius:6px;background:#fff;color:var(--ink);min-width:0}.pref-charts{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:12px}.pref-chart{min-width:0}.pref-chart h2{font-size:18px;min-height:2.6em}.pref-chart-subtitle{font-size:12px;color:var(--muted);margin:7px 0 3px}.pref-chart-scroll{overflow-x:auto}.pref-monthly{width:100%;min-width:510px;height:285px}.pref-rank{border:1px solid #d5e8ea;background:var(--pale);padding:22px 18px;border-radius:11px}.pref-rank>p{font-size:13px;color:var(--muted);margin:7px 0 15px}.pref-rank-legend{display:flex;flex-wrap:wrap;gap:13px;font-size:12px;color:#506d76;margin-bottom:18px}.pref-rank-legend span{display:flex;align-items:center;gap:6px}.pref-rank-legend span:first-child i{background:var(--blue)}.pref-rank-list{list-style:none;padding:0;margin:0;display:grid;gap:13px}.pref-rank-list li{padding:0;border-radius:5px}.pref-employee-label{font-size:14px;font-weight:550;margin-bottom:5px}.pref-pair{display:grid;gap:4px}.pref-rank-bar{display:grid;grid-template-columns:minmax(0,1fr) 36px;gap:8px;align-items:center}.pref-rank-track{height:8px;background:#dcebee;border-radius:2px;overflow:hidden}.pref-rank-track span{display:block;height:100%;background:var(--blue);border-radius:2px}.pref-rank-bar.previous .pref-rank-track span{background:#66b1b3}.pref-rank-value{font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums;color:#365660}.pref-rank-note{font-size:12px!important;line-height:1.5;margin:19px 0 0!important}
@media(min-width:1800px){.warehouse-top,.warehouse-bottom{gap:30px}.warehouse-table{font-size:15px}.warehouse-table thead th,.warehouse-table .col-cn,.warehouse-table .col-supplier,.warehouse-table .col-date{font-size:14px}.warehouse-scroll{max-height:380px}.warehouse-group .warehouse-scroll{max-height:390px}.preferences-layout{grid-template-columns:minmax(0,1fr) 335px;gap:35px}.pref-top{grid-template-columns:minmax(0,1fr) 215px;gap:30px}.pref-share-ring{width:200px}.pref-share-ring strong{font-size:29px}.pref-kpi-columns{gap:30px}.pref-kpi-columns .metric-label{font-size:17px}.pref-rank{padding:24px}.pref-rank-list{gap:15px}.pref-employee-label{font-size:15px}.pref-rank-track{height:10px}.pref-rank-value{font-size:13px}.pref-share-key{font-size:14px}}
@media(max-width:1550px){.pref-charts{grid-template-columns:1fr}.pref-chart h2{min-height:0}.pref-top{grid-template-columns:1fr}.pref-share{display:grid;grid-template-columns:1fr 160px;gap:5px 20px;align-items:center;margin-top:3px}.pref-share h2{margin:0}.pref-share-ring{grid-column:2;grid-row:1/3;width:150px;margin:0}.pref-share-key{font-size:14px;max-width:270px}.pref-share-ring strong{font-size:23px}.pref-share-ring>div span{font-size:11px}.pref-dates{gap:12px}}
@media(max-width:1280px){.warehouse-top,.warehouse-bottom{grid-template-columns:1fr}.warehouse-panel{padding:21px}.warehouse-scroll{max-height:330px}.warehouse-kpis{gap:25px}.warehouse-kpis .metric-label{font-size:14px}.warehouse-kpis .metric-value{font-size:30px}.preferences-layout{grid-template-columns:minmax(0,1fr) 250px;gap:23px}.pref-kpi-columns{gap:14px}.pref-kpi-columns .metric-label{font-size:14px}.pref-kpi-columns .metric-value{font-size:23px}.pref-kpi-columns .primary .metric-value{font-size:25px}.pref-evolution .metric-label{font-size:14px}.pref-evolution .metric-value{font-size:24px}.pref-rank{padding:20px 15px}.pref-filters{gap:15px;padding:18px}.pref-filters select{font-size:14px}}
@media(max-width:1000px){.preferences-layout{grid-template-columns:1fr}.pref-rank-list{grid-template-columns:1fr 1fr;gap:20px 30px}.pref-rank{margin-top:6px}.pref-kpi-columns .metric-label{font-size:16px}.pref-kpi-columns .primary .metric-value{font-size:29px}.pref-top{grid-template-columns:1fr}.pref-share{grid-template-columns:1fr 175px}.pref-share-ring{width:160px}.pref-monthly{height:300px}}
@media(max-width:620px){.warehouse-controls{flex-direction:column;align-items:stretch;gap:23px}.warehouse-family{width:100%;max-width:none}.warehouse-kpis{display:grid;grid-template-columns:1fr 1fr;gap:20px}.warehouse-panel{padding:18px 13px 13px}.warehouse-heading h2{font-size:18px}.warehouse-heading p{font-size:12px}.warehouse-count{font-size:11px;padding:4px 5px}.warehouse-top,.warehouse-bottom{gap:21px}.pref-kpi-columns{grid-template-columns:1fr;gap:20px}.pref-kpi-columns>section{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-bottom:18px;border-bottom:1px solid var(--line)}.pref-kpi-columns .metric-label{font-size:14px}.pref-kpi-columns .metric,.pref-kpi-columns .metric.primary{margin:0}.pref-kpi-columns .metric-value{font-size:24px}.pref-kpi-columns .primary .metric-value{font-size:27px}.pref-evolution{gap:20px}.pref-evolution .metric-label{font-size:14px}.pref-share{grid-template-columns:1fr 140px;gap:10px}.pref-share h2{font-size:16px}.pref-share-ring{width:140px}.pref-share-ring strong{font-size:21px}.pref-share-key{font-size:12px}.pref-share-key>span{flex-wrap:wrap}.pref-filters{grid-template-columns:1fr;gap:15px}.pref-dates{align-items:flex-start;gap:12px}.pref-dates>span{width:100%}.pref-dates label{width:100%;justify-content:space-between}.pref-dates input{width:75%}.pref-rank-list{grid-template-columns:1fr}.pref-monthly{height:255px}.pref-chart h2{font-size:18px}.pref-rank h2{font-size:19px}.pref-rank-value{font-size:13px}}
@media print{.warehouse-scroll,.warehouse-group .warehouse-scroll{max-height:none;overflow:visible}.warehouse-panel{break-inside:avoid}.warehouse-table{min-width:0!important;font-size:11px}.warehouse-table .col-description{min-width:0}.warehouse-table thead th,.warehouse-table tfoot td{position:static}.warehouse-objectives,.pref-filters,.pref-dates{display:none}.preferences-layout{grid-template-columns:1fr 260px}.pref-monthly{min-width:0}.pref-rank-list{grid-template-columns:1fr}.pref-chart{break-inside:avoid}}

.team-filters{display:flex;gap:22px;align-items:end;margin:0 0 25px;flex-wrap:wrap}.team-filters label{display:grid;gap:8px;min-width:235px;font-size:15px;font-weight:600}.team-filters select,.team-filters input{padding:10px 12px;border:1px solid #cfdee2;border-radius:7px;background:white;font:inherit;color:var(--ink);min-height:43px}.team-score-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;align-items:stretch}.team-score{padding:20px 16px;border:1px solid #dce8eb;border-radius:12px;background:#fff;border-top:4px solid var(--score-color)}.team-score:nth-child(1),.team-score:nth-child(2),.team-score:nth-child(5){background:#f0f8f9}.team-score h2{font-size:21px;margin:0 0 15px}.team-score svg{width:100%;max-height:150px;margin-bottom:17px}.team-score-values{display:grid;gap:17px}.team-score-value{display:flex;flex-direction:column;gap:5px;padding-left:10px;border-left:3px solid var(--score-color)}.team-score-value>span{font-size:14px;color:#506570;line-height:1.35;min-height:2.7em}.team-score-value>strong{font-size:22px;letter-spacing:-.3px;font-variant-numeric:tabular-nums}.team-score-value .primary-number{color:var(--blue)}.team-history{border-top:1px solid #d5e3e6;padding-top:17px;margin-top:3px}.team-panel{min-width:0;border:1px solid #dce8eb;border-radius:11px;background:#fff;padding:22px}.team-panel h2{font-size:20px;margin:0 0 14px}.team-summary-bottom{display:grid;grid-template-columns:1.45fr 1fr .5fr;gap:24px;margin-top:25px;align-items:start}.team-legend{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-bottom:17px}.team-legend span:before{content:'';display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--blue);margin-right:5px}.team-legend span+span:before{background:#64b3b4}.team-bar-scroll{max-height:415px;overflow:auto;padding-right:9px;scrollbar-width:thin}.team-bar-row{display:grid;grid-template-columns:100px minmax(0,1fr);gap:12px;margin-bottom:14px;align-items:center}.team-person{font-size:13px;color:#46606b;font-weight:550}.team-bar-line{display:grid;grid-template-columns:minmax(0,1fr) 89px;gap:8px;align-items:center;margin:4px 0}.team-bar-track{height:9px;background:#eef4f6;border-radius:2px}.team-bar-track i{display:block;height:100%;border-radius:2px;background:var(--blue)}.team-bar-line.before i{background:#64b3b4}.team-bar-line.goal i{background:#8bcfa1}.team-bar-line strong{font-size:12px;font-weight:500;font-variant-numeric:tabular-nums;white-space:nowrap}.team-clients{background:#edf7f8}.team-clients>div{display:grid;grid-template-columns:1fr 1fr;gap:15px}.team-clients .metric-value{font-size:28px}.team-clients .metric-label{font-size:14px}.team-average{padding:24px 15px;border:2px solid #b6d8dd;border-radius:15px;text-align:center}.team-average h2{font-size:19px;margin:0 0 12px}.team-average strong{font-size:54px;color:#d97945;display:block;letter-spacing:-2px}.team-average>span{font-size:13px;color:var(--muted)}.team-cmd-top,.team-cmd-bottom{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-bottom:26px}.team-sales-pie{padding:22px;border:1px solid #d4e9eb;border-radius:12px;background:#edf7f8;min-width:0}.team-sales-pie .category-legend{max-height:330px;overflow:auto}.team-sales-pie .category-chart-body{grid-template-columns:minmax(150px,1fr) 1fr}.team-sales-pie .category-key{font-size:13px}.supplier-top{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:26px;align-items:start;margin-bottom:27px}.supplier-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}.supplier-kpis.with-ebitda{grid-template-columns:repeat(5,minmax(0,1fr))}.supplier-kpis h2{font-size:17px;min-height:2.6em;margin:0 0 16px;line-height:1.3}.supplier-kpis .metric-label{font-size:14px}.supplier-kpis .metric-value{font-size:24px;white-space:nowrap}.supplier-kpis .metric{margin-bottom:20px}.supplier-pie{border:1px solid #d4e9eb;border-radius:12px;background:#edf7f8;padding:20px;min-width:0}.supplier-pie .category-chart-body{display:grid;grid-template-columns:1fr}.supplier-pie .category-pie{max-width:190px;max-height:190px;margin:auto}.supplier-pie .category-legend{display:grid;grid-template-columns:1fr 1fr;gap:7px}.supplier-pie .category-key{padding:5px;font-size:12px}.supplier-pie .category-key-value{font-size:13px}.supplier-pie h2{font-size:18px}.warehouse-supplier-products .warehouse-table{min-width:1380px}.warehouse-supplier-products .warehouse-scroll{max-height:365px}.warehouse-supplier-products .col-description{min-width:310px}.warehouse-table .col-pvp,.warehouse-table .col-puc,.warehouse-table .col-mc,.warehouse-table .col-current,.warehouse-table .col-previous,.warehouse-table .col-evolution,.warehouse-table .col-growth,.warehouse-table .col-units,.warehouse-table .col-unitsBefore{text-align:right;white-space:nowrap}.warehouse-supplier-group .warehouse-table{min-width:720px}.supplier-bottom{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:26px;align-items:start;margin:26px 0}.supplier-share{padding:30px 22px;border:1px solid #cbdfe5;border-left:4px solid var(--blue);border-radius:11px;background:#f2f8fc}.supplier-share h2{font-size:18px;margin:0 0 13px}.supplier-share strong{font-size:35px;color:var(--blue)}.supplier-share p{font-size:12px;color:var(--muted);margin-bottom:0}
@media(max-width:1650px){.team-score-grid{gap:12px}.team-score{padding:16px 12px}.team-score-value>strong{font-size:19px}.supplier-top{grid-template-columns:1fr}.supplier-pie .category-chart-body{grid-template-columns:190px 1fr;gap:25px}.supplier-pie .category-legend{grid-template-columns:repeat(3,1fr)}.team-summary-bottom{grid-template-columns:1.3fr 1fr}.team-average{grid-column:2}.team-cmd-top{grid-template-columns:1.1fr 1fr}.team-sales-pie .category-chart-body{grid-template-columns:1fr}.team-sales-pie .category-pie{max-height:210px}.team-sales-pie .category-legend{max-height:190px;display:grid;grid-template-columns:1fr 1fr}}
@media(max-width:1200px){.team-score-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.team-score-value>strong{font-size:23px}.team-cmd-top,.team-cmd-bottom{grid-template-columns:1fr}.team-sales-pie .category-chart-body{grid-template-columns:220px 1fr}.team-sales-pie .category-legend{max-height:300px}.team-summary-bottom{grid-template-columns:1fr 1fr}.team-summary-bottom>.team-panel:first-child{grid-column:1/-1}.team-average{grid-column:auto}.supplier-kpis,.supplier-kpis.with-ebitda{grid-template-columns:repeat(3,minmax(0,1fr))}.supplier-bottom{grid-template-columns:1fr}.supplier-share{max-width:340px}.supplier-pie .category-legend{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.team-score-grid{grid-template-columns:1fr 1fr}.team-score h2{font-size:19px}.team-score-value>strong{font-size:21px}.team-score-value>span{font-size:13px}.team-summary-bottom{grid-template-columns:1fr}.team-panel{padding:18px 13px}.team-bar-row{grid-template-columns:82px 1fr;gap:8px}.team-person{font-size:12px}.team-bar-line{grid-template-columns:1fr 80px}.team-sales-pie .category-chart-body{grid-template-columns:1fr}.supplier-kpis,.supplier-kpis.with-ebitda{grid-template-columns:1fr 1fr;gap:20px}.supplier-kpis .metric-value{font-size:23px}.supplier-pie .category-chart-body{grid-template-columns:1fr}.team-filters label{width:100%;min-width:0}.team-average strong{font-size:50px}}
@media(max-width:400px){.team-score-grid{grid-template-columns:1fr}.team-score svg{max-height:160px}.supplier-kpis .metric-value{font-size:20px}}
@media print{.team-filters{display:none}.team-score-grid{grid-template-columns:repeat(5,1fr)}.team-score-value>strong{font-size:14px}.team-score-value>span{font-size:10px}.team-bar-scroll{max-height:none}.team-panel,.team-score{break-inside:avoid}.warehouse-supplier-products .warehouse-table{min-width:1100px;font-size:10px}.warehouse-supplier-products .warehouse-scroll{max-height:none}}

.margins-layout{display:grid;grid-template-columns:minmax(0,1fr) 235px;gap:25px;align-items:start}.margins-main{min-width:0}.margins-header{display:flex;gap:25px;align-items:center;margin-bottom:25px}.margin-filter{display:grid;gap:9px;min-width:190px;font-size:15px;font-weight:600;flex:1}.margin-filter select{font:inherit;font-size:14px;padding:11px;border:1px solid #cfdee2;border-radius:7px;background:white;color:var(--ink);width:100%}.margin-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;flex:2}.margin-kpis .metric{margin:0}.margin-kpis .metric-label{font-size:14px;min-height:2.6em}.margin-kpis .metric-value{font-size:28px;white-space:nowrap}.margins-comparisons{display:grid;grid-template-columns:1fr 1fr;gap:22px}.margin-comparison{padding:21px 17px}.margin-comparison .team-bar-row{grid-template-columns:145px minmax(0,1fr);gap:10px;margin-bottom:16px}.margin-comparison .team-person{font-size:13px;overflow-wrap:anywhere}.margin-comparison .team-bar-line{grid-template-columns:1fr 76px}.margin-bars{max-height:430px;overflow:auto;scrollbar-width:thin;padding-right:8px}.margin-axis{display:flex;justify-content:space-between;margin:14px 84px 0 155px;color:var(--muted);font-size:12px}.margin-goal{background:#f1f8fc;border:1px solid #d8e5ef;border-radius:12px;padding:23px 15px;text-align:center}.margin-goal h2{font-size:18px;margin:0 0 23px;color:var(--blue)}.margin-goal-ring{width:190px;max-width:100%;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--blue) var(--goal-angle),#64b3b4 0);display:grid;place-items:center;margin:auto}.margin-goal-ring>div{width:72%;height:72%;border-radius:50%;background:#f1f8fc;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:6px}.margin-goal-ring strong{font-size:26px;color:var(--blue);font-variant-numeric:tabular-nums;white-space:nowrap}.margin-goal-ring span{font-size:12px;color:var(--muted)}.margin-goal p{font-size:12px;line-height:1.5;color:var(--muted);margin:20px 0 0}.margins-bottom{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(0,1.6fr);gap:25px;margin:26px 0;align-items:start}.margin-sales-pie{border:1px solid #d6e8eb;background:#edf7f8;border-radius:12px;padding:22px;min-width:0}.margin-sales-pie .category-chart-body{grid-template-columns:1fr}.margin-sales-pie .category-pie{max-height:220px}.margin-sales-pie .category-legend{display:grid;grid-template-columns:1fr 1fr;gap:9px}.margin-sales-pie .category-key{font-size:13px}.warehouse-margin-articles .warehouse-table{min-width:580px}.warehouse-margin-articles .warehouse-scroll{max-height:390px}.warehouse-table .col-marginPct{text-align:right;white-space:nowrap}
@media(max-width:1600px){.margins-layout{grid-template-columns:minmax(0,1fr) 200px;gap:20px}.margin-goal-ring strong{font-size:23px}.margins-header{flex-direction:column;align-items:stretch}.margin-filter{max-width:340px}.margin-kpis .metric-label{min-height:0}.margins-comparisons{grid-template-columns:1fr}.margin-bars{max-height:370px}.margin-comparison .team-bar-row{grid-template-columns:165px minmax(0,1fr)}.margin-axis{margin-left:175px}}
@media(max-width:1000px){.margins-layout{grid-template-columns:1fr}.margin-goal{display:grid;grid-template-columns:1fr 170px;align-items:center;text-align:left;gap:10px 25px}.margin-goal h2{margin:0}.margin-goal-ring{width:160px;grid-column:2;grid-row:1/3}.margin-goal p{margin:0}.margins-bottom{grid-template-columns:1fr}.margin-sales-pie .category-chart-body{grid-template-columns:220px 1fr}}
@media(max-width:620px){.margin-kpis{gap:15px;grid-template-columns:1fr 1fr}.margin-kpis .metric-value{font-size:25px}.margin-kpis .metric-label{font-size:13px}.margin-comparison .team-bar-row{grid-template-columns:115px minmax(0,1fr);gap:8px}.margin-comparison .team-person{font-size:12px}.margin-comparison .team-bar-line{grid-template-columns:1fr 69px;gap:5px}.margin-comparison .team-bar-line strong{font-size:11px}.margin-axis{margin-left:123px;margin-right:77px}.margin-sales-pie .category-chart-body{grid-template-columns:1fr}.margin-filter{max-width:none}.margin-goal{grid-template-columns:1fr 145px}.margin-goal-ring{width:145px}.margin-goal-ring strong{font-size:21px}}
@media print{.margin-bars{max-height:none;overflow:visible}.margin-filter{display:none}.margins-comparisons{grid-template-columns:1fr 1fr}.margins-layout{grid-template-columns:1fr}.margin-goal{max-width:220px}.warehouse-margin-articles .warehouse-scroll{max-height:none}}

.incentives-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:25px;align-items:start}.incentive-groups{display:grid;gap:18px}.incentive-group{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1fr);align-items:center;gap:25px;padding:22px;border:1px solid #dae8eb;border-left:4px solid var(--incentive-color);border-radius:11px;background:white}.incentive-group:nth-child(even){background:#eef8f9}.incentive-values h2{font-size:20px;color:var(--incentive-color);margin:0 0 18px}.incentive-values>div{display:grid;grid-template-columns:1fr 1fr;gap:20px}.incentive-values .metric{margin:0}.incentive-values .metric-label{font-size:14px}.incentive-values .metric-value{font-size:27px;white-space:nowrap}.incentive-plot{min-width:0}.incentive-plot h3{font-size:14px;color:#526d77;margin:0 0 6px;font-weight:500}.incentive-plot svg{width:100%;height:auto;display:block}.incentive-totals{display:grid;gap:22px;position:sticky;top:22px}.incentive-totals section{padding:26px 20px;border:1px solid #d1e4e8;border-radius:12px;background:#f1f8fa}.incentive-totals h2{font-size:16px;margin:0 0 14px;color:#486873}.incentive-totals strong{font-size:35px;letter-spacing:-1px;font-variant-numeric:tabular-nums;white-space:nowrap}.incentive-totals p{font-size:12px;color:var(--muted);margin:9px 0 0}.incentive-totals .incentive-grade{background:white;border:2px solid #bfdfe1;text-align:center}.incentive-grade strong{font-size:64px;color:#d47744}.incentive-corrected strong{color:#358d91}.incentive-employees{margin-top:25px}.incentive-employees .team-bar-row{grid-template-columns:115px 1fr;margin-bottom:20px}.incentive-employees .team-bar-line{grid-template-columns:1fr 105px}.incentive-legend{display:flex;gap:22px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:0 0 25px}.incentive-legend span:before{content:'';display:inline-block;width:9px;height:9px;background:var(--blue);border-radius:50%;margin-right:6px}.incentive-legend span:nth-child(2):before{background:#64b3b4}.incentive-legend span:nth-child(3):before{background:#8bcfa1}.agreement-top{display:grid;grid-template-columns:1fr 245px;gap:35px;align-items:center;margin-bottom:27px}.agreement-top .team-filters{margin-bottom:35px}.agreement-top .team-filters label{width:65%}.agreement-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.agreement-kpis .metric{border:1px solid #dce8eb;border-radius:10px;padding:20px;margin:0;background:#f7fbfc}.agreement-kpis .metric-value{font-size:30px;white-space:nowrap}.agreement-kpis .metric-label{font-size:16px;min-height:2.6em}.agreement-chart{background:#edf7f8;border:1px solid #d6e8ea;border-radius:12px;padding:25px;min-width:0}.agreement-chart h2{font-size:21px;margin:0 0 18px}.agreement-bars{padding:26px 65px 20px 0}.agreement-bar{height:31px;position:relative;display:flex;align-items:center}.agreement-bar>span{display:block;height:100%;background:var(--blue);flex-shrink:0}.agreement-bar.previous>span{background:#64b3b4}.agreement-bar strong{font-size:14px;white-space:nowrap;padding-left:10px;font-weight:500;color:#4c6872}.agreement-axis{display:flex;justify-content:space-between;padding-right:65px;font-size:13px;color:var(--muted);margin-top:10px}.agreement-bottom{display:grid;grid-template-columns:1fr 285px;gap:25px;margin:25px 0;align-items:center}.agreement-bottom .supplier-share strong{font-size:43px}.agreement-top .margin-goal-ring .negative{color:#c94d55}
@media(max-width:1500px){.incentive-group{grid-template-columns:1fr;gap:20px}.incentive-plot svg{max-height:160px}.incentive-values>div{max-width:430px}.agreement-kpis{gap:15px}.agreement-kpis .metric{padding:16px}.agreement-kpis .metric-value{font-size:25px}}
@media(max-width:1050px){.incentives-layout{grid-template-columns:1fr}.incentive-totals{position:static;grid-template-columns:repeat(3,1fr)}.incentive-totals strong{font-size:29px}.incentive-grade strong{font-size:40px}.incentive-totals section{padding:20px 16px}.agreement-top{grid-template-columns:1fr}.agreement-top .margin-goal{max-width:none}.agreement-bottom{grid-template-columns:1fr}.agreement-bottom .supplier-share{max-width:360px}}
@media(max-width:620px){.incentive-group{padding:19px 14px}.incentive-values .metric-value{font-size:24px}.incentive-values>div{gap:12px}.incentive-totals{grid-template-columns:1fr}.incentive-employees .team-bar-row{grid-template-columns:80px 1fr;gap:10px}.incentive-employees .team-bar-line{grid-template-columns:1fr 92px}.incentive-legend{gap:10px}.agreement-kpis{grid-template-columns:1fr}.agreement-kpis .metric-label{min-height:0}.agreement-kpis .metric-value{font-size:29px}.agreement-top .team-filters label{width:100%}.agreement-chart{padding:20px 15px}.agreement-chart h2{font-size:19px}.agreement-axis{font-size:11px}.agreement-bar strong{font-size:12px}.agreement-bars{padding-right:52px}.agreement-axis{padding-right:52px}}
@media print{.incentive-totals{position:static}.incentive-group,.agreement-chart{break-inside:avoid}.incentive-employees{break-inside:avoid}}

/* =============================================================================
   3. AVISOS · lo que la maqueta no tiene porque no tiene sesión
   -----------------------------------------------------------------------------
   Modo demostración, previsualización de rol, datos reales y datos de ejemplo.
   Van en el lenguaje de la maqueta —14 px, borde de un píxel, sin sombras— para
   que no canten al lado de lo demás.
   ============================================================================= */

.notice {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  padding: 12px 32px; font-size: 14px; line-height: 1.45;
  border-bottom: 1px solid var(--line); background: #fbfdfd; color: var(--body);
}
.notice b { font-weight: 650; color: var(--ink); }
.notice .tag {
  flex-shrink: 0; font-size: 11.5px; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; padding: 3px 9px; border-radius: 5px;
  background: var(--pale); color: #2b5b66;
}
.notice-demo .tag { background: #e4eefb; color: #1c4f9c; }
.notice-warn      { background: #fdf8ef; }
.notice-warn .tag { background: #f6e6c8; color: #85541a; }
.notice-real      { background: #f2faf5; }
.notice-real .tag { background: #d8efe1; color: #16653c; }
.notice .undo {
  margin-left: auto; border: 1px solid #cddbde; background: #fff;
  border-radius: 6px; padding: 5px 11px; font-size: 13px; color: var(--body);
}
.notice .undo:hover { border-color: #a8bdc2; }
@media (max-width: 700px) { .notice { padding: 11px 18px; } }

/* Mensaje a pantalla completa (elige una farmacia, sección sin pantalla…). */
.empty-state {
  border: 1px solid var(--line); border-radius: 11px; background: #fff;
  padding: 46px 30px; text-align: center;
}
.empty-state h2 { margin: 0 0 8px; font-size: 20px; font-weight: 650; }
.empty-state p { margin: 0 auto; max-width: 52ch; font-size: 15px; color: var(--muted); }


/* =============================================================================
   4. LOGIN · intacto, con la marca OPFAR
   ============================================================================= */

#loginScreen, #loginScreen input, #loginScreen button,
.lg-overlay, .lg-overlay input, .lg-overlay button { font-family: var(--font-body); }
.lg-title { font-family: var(--font-display); }

/* ===== LOGIN ===============================================================
   Mismas clases y mismo aspecto que el login de On Time (`.lg-*`): verde
   profundo a pantalla completa, tarjeta blanca centrada, emblema metálico
   arriba y el nombre partido en dos colores. Si hay que elegir entre
   parecerse y mejorarlo, parecerse.
   ========================================================================= */
#loginScreen {
  position: fixed; inset: 0; z-index: 1000;
  background: #123B44;
  display: flex; align-items: center; justify-content: center;
  padding: var(--space-6);
  overflow: auto;
  font-family: var(--font-body);
}
#loginScreen[hidden] { display: none; }

/* Ancho y relleno: los de On Time DESPLEGADO, que su capa ensancha respecto
   al HTML base (min(560px, 94vw) y 52/48/40). Copiados para que las dos
   tarjetas se vean del mismo tamaño puestas una al lado de la otra. */
.lg-card {
  background: var(--surface-card);
  border-radius: 22px;
  width: 100%; max-width: min(560px, 94vw);
  padding: 52px 48px 40px;
  box-shadow: 0 30px 80px rgba(18, 59, 68, 0.28);
  text-align: center;
}

.lg-logo { line-height: 0; margin-bottom: 14px; }
.lg-logo img { width: 64px; height: 64px; filter: drop-shadow(0 8px 22px rgba(14, 148, 167, 0.35)); }

.lg-title {
  font-family: var(--font-display);
  font-size: 26px; font-weight: 700;
  color: var(--opfar-verde-profundo);
  letter-spacing: var(--ls-display);
  margin: 0;
}
.lg-title span { color: var(--color-primary); }
.lg-sub { color: var(--text-muted); font-size: 13.5px; margin: 5px 0 24px; }

.lg-esperando {
  color: var(--text-subtle); font-size: 13px; margin: 0;
  padding: var(--space-4) 0 var(--space-2);
}
.lg-esperando[hidden] { display: none; }

.lg-field { position: relative; margin-bottom: 12px; }
.lg-field input {
  width: 100%; box-sizing: border-box;
  padding: 13px 15px;
  font: inherit; font-size: 14px;
  color: var(--text-strong);
  background: #FAFCFC;
  border: 1px solid #DDE7E9;
  border-radius: 11px;
  transition: border-color var(--dur-fast) var(--ease-standard),
              box-shadow var(--dur-fast) var(--ease-standard);
}
.lg-field input:focus {
  outline: none;
  background: var(--surface-card);
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(15, 163, 180, 0.15);
}
.lg-field input::placeholder { color: var(--text-subtle); }
#lgPass { padding-right: 44px; }

.lg-eye {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  display: flex; align-items: center; justify-content: center;
  background: none; border: none; padding: 4px;
  color: var(--text-muted); cursor: pointer;
}
.lg-eye:hover { color: var(--color-primary-hover); }
/* La raya del ojo solo se ve cuando la contraseña está a la vista */
.lg-eye .lg-eye-raya { opacity: 0; }
.lg-eye.tachado .lg-eye-raya { opacity: 1; }

/* Mientras no hay nada que decir no ocupa sitio: así el botón Entrar queda
   pegado a los campos, igual que en On Time */
.lg-msg { margin: 2px 0 4px; font-size: 12.5px; text-align: left; }
.lg-msg:empty { display: none; }
.lg-msg.error { color: var(--opfar-danger); }
.lg-msg.ok    { color: var(--opfar-success); }
.lg-msg.info  { color: var(--text-muted); }

.lg-enter {
  width: 100%;
  background: var(--color-primary); color: var(--color-on-primary);
  border: none; border-radius: 11px;
  padding: 14px;
  font-family: var(--font-display); font-size: 15px; font-weight: 700;
  cursor: pointer; margin-top: 6px;
  transition: background var(--dur-fast) var(--ease-standard);
}
.lg-enter:hover { background: var(--color-primary-hover); }
.lg-enter:disabled { background: var(--opfar-slate-300); cursor: default; }

.lg-forgot {
  width: 100%; margin-top: 10px; padding: 6px;
  background: none; border: none;
  color: var(--text-link); font-family: var(--font-body); font-size: 13px;
  text-decoration: underline; cursor: pointer;
}
.lg-forgot:hover { color: var(--color-primary-hover); }

.lg-secundario {
  background: none;
  border: 1px solid var(--border-default);
  border-radius: 11px;
  padding: 14px 18px;
  font-family: var(--font-display); font-size: 15px; font-weight: 700;
  color: var(--text-body); cursor: pointer;
}
.lg-secundario:hover { border-color: var(--border-strong); }

/* Ventanas de recuperar contraseña y de contraseña nueva */
.lg-overlay {
  position: fixed; inset: 0; z-index: 1100;
  background: rgba(8, 38, 44, 0.8);
  display: flex; align-items: center; justify-content: center;
  padding: var(--space-6); overflow: auto;
  font-family: var(--font-body);
}
.lg-modal {
  background: var(--surface-card);
  border-radius: 18px;
  width: 100%; max-width: 430px;
  padding: var(--space-8);
  box-shadow: 0 24px 60px rgba(18, 59, 68, 0.35);
}
.lg-modal h2 {
  font-family: var(--font-display); font-size: var(--fs-h3);
  color: var(--text-strong); margin: 0 0 6px;
}
.lg-modal-sub { color: var(--text-muted); font-size: 13px; margin: 0 0 var(--space-5); }
.lg-modal-pie { display: flex; gap: 10px; margin-top: var(--space-3); }
.lg-modal-pie .lg-enter { margin-top: 0; }


/* =============================================================================
   5. COMPARAR FARMACIAS · la única pantalla que no está en la maqueta
   -----------------------------------------------------------------------------
   El encargo dice dejarla como estaba hasta que se decida su referencia, así que
   estas son las piezas de antes, y solo las que ella usa. Cuando la maqueta traiga
   Comparar farmacias, este bloque se borra entero.
   ============================================================================= */

/* ===== PIEZAS DE TEXTO ===================================================== */
.eyebrow {
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--text-subtle);
  font-weight: 700;
  display: block; }
.dato {
  font-family: var(--font-mono);
  font-weight: 700;
  letter-spacing: var(--ls-mono);
  color: var(--text-strong);
  font-variant-numeric: tabular-nums; }
.tono-exito { color: var(--opfar-success); }
.tono-peligro { color: var(--opfar-danger); }
.tono-neutro { color: var(--text-muted); }
/* ===== BOTONES DEL PANEL =================================================== */
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  font-weight: 600;
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease-standard),
              color var(--dur-fast) var(--ease-standard),
              border-color var(--dur-fast) var(--ease-standard),
              transform var(--dur-fast) var(--ease-standard); }
.boton:active { transform: scale(0.985); }
.boton-primario { background: var(--color-primary); color: var(--color-on-primary); padding: 11px 22px; font-size: var(--fs-body); }
.boton-primario:hover { background: var(--color-primary-hover); }
.boton-bloque { width: 100%; margin-top: var(--space-6); }
.boton-secundario {
  background: var(--surface-card); color: var(--text-body);
  border-color: var(--border-default);
  padding: 8px 16px; font-size: var(--fs-body-sm); }
.boton-secundario:hover { border-color: var(--border-strong); color: var(--text-strong); }
/* ===== TARJETAS ============================================================ */
.tarjeta {
  background: var(--surface-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  padding: var(--space-5); }
.tarjeta-cabecera { display: flex; align-items: flex-start; gap: var(--space-3); margin-bottom: var(--space-4); }
.tarjeta-cabecera h3 { font-size: var(--fs-h3); font-weight: 700; }
.tarjeta-cabecera .sub { font-size: 12.5px; color: var(--text-muted); margin-top: 2px; }
.tarjeta-cabecera .der { margin-left: auto; }
.rejilla { display: grid; gap: var(--space-4); }
.r-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.r-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.r-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.r-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
/* ===== KPI ================================================================= */
.kpi { display: flex; flex-direction: column; gap: 2px; }
/* `.kpi-valor` es la pieza de las OTRAS diez secciones; Home ya no la usa. Se
   pasa a las variables para que no quede ninguna cifra con tamaño fijo: los 26
   px de antes no escalaban con la ventana, que es la causa técnica de que
   Atlas se apretara al estrechar y hola.opfar.es no. */
.kpi-valor {
  font-family: var(--font-mono); font-weight: 700;
  font-size: var(--fs-cifra-2); letter-spacing: -0.01em; color: var(--text-strong);
  font-variant-numeric: tabular-nums; line-height: 1.15; }
/* `.grande` marca la cifra que manda en su tarjeta, así que va al nivel 1. */
.kpi-valor.grande { font-size: var(--fs-cifra-1); line-height: 1.05; }
.kpi-etiqueta { font-size: 12.5px; color: var(--text-muted); font-weight: 500; }
.banda {
  background: var(--surface-sunken);
  border-radius: var(--radius-md);
  padding: var(--space-4) var(--space-5);
  display: grid; gap: var(--space-4); }
/* ===== GRÁFICAS ============================================================ */
.lienzo-grafica { position: relative; width: 100%; }
/* ===== TABLAS ============================================================== */
.tabla-envoltorio { overflow-x: auto; }
table.tabla { width: 100%; border-collapse: collapse; font-size: clamp(12px, 0.92vw, 13.5px); }
table.tabla th {
  text-align: right; padding: 8px 10px;
  font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.1em;
  text-transform: uppercase; color: var(--text-subtle); font-weight: 700;
  border-bottom: 1px solid var(--border-default); white-space: nowrap; }
table.tabla th:first-child, table.tabla td:first-child { text-align: left; }
table.tabla td {
  text-align: right; padding: 9px 10px;
  border-bottom: 1px solid var(--border-subtle);
  font-family: var(--font-mono); font-variant-numeric: tabular-nums;
  color: var(--text-body); white-space: nowrap; }
table.tabla td:first-child { font-family: var(--font-body); font-weight: 500; color: var(--text-strong); }
table.tabla tbody tr:hover td { background: var(--surface-sunken); }
table.tabla tfoot td {
  font-weight: 700; color: var(--text-strong);
  border-top: 2px solid var(--border-default); border-bottom: none;
  background: var(--surface-sunken); }
table.tabla tfoot td:first-child { font-family: var(--font-body); }
/* Columnas de texto que no son la primera (descripción, proveedor, familia).
   Van a la izquierda y con la tipografía de texto, no con la de números. */
table.tabla th.txt, table.tabla td.txt { text-align: left; }
table.tabla td.txt {
  font-family: var(--font-body); color: var(--text-body);
  max-width: 320px; overflow: hidden; text-overflow: ellipsis; }
/* El color del número bueno o malo tiene que ganarle al color general de la
   celda: `table.tabla td` es más específico que `.tono-peligro` a secas. */
table.tabla td.tono-exito { color: var(--opfar-success); }
table.tabla td.tono-peligro { color: var(--opfar-danger); }
table.tabla td.tono-neutro { color: var(--text-muted); }
/* ===== ATLAS NO DISPONIBLE PARA ESTE PERFIL ================================
   Pantalla entera, no una sección dentro del panel: el rol Empleado no llega
   a ver ni la barra lateral. Aquí no se pinta ningún dato.
   ========================================================================= */
.sin-acceso {
  min-height: 100%;
  display: flex; align-items: center; justify-content: center;
  padding: var(--space-6);
  background:
    radial-gradient(circle at 12% 8%, rgba(91, 208, 214, 0.16), transparent 42%),
    radial-gradient(circle at 88% 92%, rgba(15, 163, 180, 0.12), transparent 46%),
    var(--surface-page); }
.sin-acceso-caja {
  width: 100%; max-width: 460px;
  background: var(--surface-card);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-lg);
  padding: var(--space-10) var(--space-8) var(--space-8);
  text-align: center; }
.sin-acceso .emblema { width: 56px; height: 56px; margin-bottom: var(--space-5); }
.sin-acceso h2 { font-size: var(--fs-h3); margin: 0; }
.sin-acceso p { color: var(--text-muted); margin-top: var(--space-3); }
.sin-acceso .acciones {
  display: flex; flex-direction: column; align-items: center; gap: var(--space-3);
  margin-top: var(--space-7); }
.sin-acceso .acciones .boton { text-decoration: none; }
.sin-acceso .salir {
  background: none; border: none; padding: 4px;
  color: var(--text-muted); font-family: var(--font-body); font-size: var(--fs-body-sm);
  text-decoration: underline; cursor: pointer; }
.sin-acceso .salir:hover { color: var(--text-body); }
/* ===== LEYENDA ============================================================= */
.leyenda { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: var(--space-3); }
.leyenda span { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-muted); }
.leyenda i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
