/* Approved Fluent direction, applied to existing workspaces rather than replacement
   business components. No content hiding, reordered forms, clipped amounts or new IO.
   Kill switch: NANORED_FLUENT_UI=0. Documents/print keep their own content rendering. */
@font-face {
  font-family: 'Nano Fluent'; src: url('fonts/office/manrope-variable.ttf') format('truetype');
  font-weight: 200 800; font-display: swap;
}
@media screen {
  body.fluent-app {
    --fl-root: var(--dp-root, #eaf6f5); --fl-surface: var(--dp-surface, #f6fcfb);
    --fl-panel: var(--dp-panel, #fff); --fl-ink: var(--dp-ink, #12303a);
    --fl-muted: var(--dp-muted, #536c71); --fl-line: var(--dp-line, #d1e3e0);
    --fl-accent: var(--dp-accent, #007c72); --fl-on: var(--dp-on, #fff);
    --fl-soft: var(--dp-soft, #ddf4f0); --fl-control: #7b9592; --fl-radius: 10px;
    --font-sans: 'Nano Fluent', system-ui, sans-serif;
    --text-main: var(--fl-ink); --text-muted: var(--fl-muted); --muted: var(--fl-muted);
    --text: var(--fl-ink); --tx-normal: var(--fl-ink); --tx-titulo: var(--fl-ink); --tx-suave: var(--fl-muted);
    --bg-main: var(--fl-surface); --bg-card: var(--fl-panel); --bg-card-subtle: var(--fl-surface);
    --card: var(--fl-panel); --line: var(--fl-line); --border-main: var(--fl-line); --border-subtle: var(--fl-line);
    --accent: var(--fl-accent); --accent-contrast: var(--fl-on);
    --sov-bg-root: var(--fl-surface); --sov-bg-surface: var(--fl-panel); --sov-stage-bg: var(--fl-surface);
    --sov-text-primary: var(--fl-ink); --sov-text-secondary: var(--fl-muted); --sov-text-muted: var(--fl-muted);
    --sov-border-subtle: var(--fl-line); --sov-btn-primary-bg: var(--fl-accent); --sov-btn-primary-text: var(--fl-on);
    font-family: var(--font-sans); color: var(--fl-ink); background: var(--fl-root);
  }
  html[data-tema="oscuro"] body.fluent-app:not(.dp-shell) {
    --fl-root: #091f25; --fl-surface: #0d2930; --fl-panel: #14363e;
    --fl-ink: #effafa; --fl-muted: #aec5c7; --fl-line: #3b6267;
    --fl-accent: #78e2ca; --fl-on: #103037; --fl-soft: #1a484d; --fl-control: #739b9b;
  }
  body.fluent-app #contenido-principal { min-width: 0; color: var(--fl-ink); }
  body.fluent-app.fluent-login .card { border-color: var(--fl-line); border-radius: 12px; box-shadow: 0 8px 30px #12303a08; }
  body.fluent-app.fluent-login :is(input,button) { border-radius: 7px; font-family: var(--font-sans); min-height: 48px; }
  body.fluent-app.fluent-login input { border-color: var(--fl-control); }
  body.fluent-app.fluent-login button { background: var(--fl-accent); color: var(--fl-on); }
  body.fluent-app.fluent-login .foot { color: var(--fl-muted); }
  body.fluent-app #contenido-principal :is(h1,h2,h3,h4,label,button,input,select,textarea) { font-family: var(--font-sans); }
  body.fluent-app #contenido-principal :is(h1,h2,h3,h4) { letter-spacing: -.025em; }
  body.fluent-app #contenido-principal h1 { font-size: clamp(23px, 2vw, 29px); line-height: 1.3; }
  body.fluent-app #contenido-principal :is(.card,.p-card,.panel,.card-panel,.office-library,.office-panel) {
    border-color: var(--fl-line); border-radius: var(--fl-radius); box-shadow: 0 2px 8px #12303a04;
    background-color: var(--fl-panel); color: var(--fl-ink);
  }
  body.fluent-app #contenido-principal :is(.hero,.p-hero,.semana-hero-info,.home-partners-header) {
    padding: 16px 0; margin-block: 0 16px; background: transparent; box-shadow: none;
    border-radius: 0; color: var(--fl-ink);
  }
  body.fluent-app #contenido-principal :is(.hero h1,.p-hero h1,.semana-hero-heading) {
    font-size: 24px; line-height: 1.3; letter-spacing: -.5px;
  }
  body.fluent-app #contenido-principal :is(.btn,.p-btn,.p-btn-primary,.p-btn-secondary,button) {
    border-radius: 7px; font-family: var(--font-sans); touch-action: manipulation;
    transition: background-color 120ms ease, border-color 120ms ease, box-shadow 120ms ease;
  }
  body.fluent-app #contenido-principal :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=range]):not([type=color]) {
    border-radius: 7px; border-color: var(--fl-control); font-family: var(--font-sans);
  }
  body.fluent-app #contenido-principal :is(.p-table,table:not(.fo-grid):not(.fo-sheet)) { font-variant-numeric: tabular-nums; }
  body.fluent-app #contenido-principal :is(.p-table,table:not(.fo-grid):not(.fo-sheet)) th {
    background-color: var(--fl-surface); color: var(--fl-muted); font-weight: 700; line-height: 1.5;
  }
  body.fluent-app #contenido-principal :is(.p-table,table:not(.fo-grid):not(.fo-sheet)) td { border-color: var(--fl-line); }
  body.fluent-app #contenido-principal :is(.cap-viewport,.cap-stage) { box-shadow: none; border-color: var(--fl-line); }
  body.fluent-app #contenido-principal :is(.cap-spine,.cap-tab) { font-family: var(--font-sans); }
  body.fluent-app #contenido-principal .cap-tab.active { background: var(--fl-soft); color: var(--fl-accent); }
  /* Directory/list surfaces also need structure on phones: their old styling
     was desktop-only, leaving names, state and fiscal IDs as one text stream. */
  body.fluent-app #contenido-principal .cap-docket-pane { background: var(--fl-panel); border: 1px solid var(--fl-line); border-radius: 10px; }
  body.fluent-app #contenido-principal .cap-docket-header { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 16px; border-bottom: 1px solid var(--fl-line); }
  body.fluent-app #contenido-principal .cap-docket-list { padding: 0; gap: 0; }
  body.fluent-app #contenido-principal .cap-docket-item {
    box-sizing: border-box; min-height: 76px; padding: 16px; margin: 0; cursor: pointer;
    border: 0; border-bottom: 1px solid var(--fl-line); border-radius: 0;
    background: var(--fl-panel); color: var(--fl-ink); box-shadow: none;
  }
  body.fluent-app #contenido-principal .cap-docket-item.active {
    background: var(--fl-soft) !important; border: 0 !important;
    border-inline-start: 3px solid var(--fl-accent) !important;
    border-bottom: 1px solid var(--fl-line) !important; box-shadow: none !important;
  }
  body.fluent-app #contenido-principal .cap-docket-item:hover { background: var(--fl-surface); transform: none; }
  body.fluent-app #contenido-principal :is(.cap-docket-row,.cap-docket-meta) { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 6px 12px; }
  body.fluent-app #contenido-principal .cap-docket-name { font-size: 14px; font-weight: 700; white-space: normal; overflow-wrap: anywhere; }
  body.fluent-app #contenido-principal .cap-docket-meta { margin-top: 6px; font-size: 12px; color: var(--fl-muted); }
  body.fluent-app #contenido-principal .cap-docket-item .badge { font-size: 11px !important; line-height: 1.5; white-space: normal; }
  /* Facts remain facts, in quiet records rather than oversized KPI tiles. Retain
     every value, provenance button and existing click/keyboard handler. */
  body.fluent-app #contenido-principal :is(.kpi,.kpi-golden-card,.eql-kpi,.flight-deck-kpi) {
    border-radius: 7px; box-shadow: none; padding: 12px 14px;
  }
  body.fluent-app #contenido-principal :is(.kpi .n,.kpi-golden-val,.kpi-num-24,.kpi-num-20) {
    font-size: 17px; line-height: 1.5; letter-spacing: 0; font-variant-numeric: tabular-nums;
  }
  body.fluent-app #contenido-principal :is(.kpi-golden-label,.kpi .l) { font-size: 12px; letter-spacing: 0; text-transform: none; }
  body.fluent-app #contenido-principal .kpi-fila { flex-wrap: wrap; }
  body.fluent-app:not(.kpi-off) #contenido-principal .kpi-tira { display: grid; grid-template-columns: 1fr; gap: 0; flex-basis: 100%; }
  body.fluent-app #contenido-principal .kpi-tira .kpi {
    display: grid; grid-template-columns: minmax(100px,auto) minmax(0,1fr); gap: 12px;
    align-items: baseline; border: 0; border-bottom: 1px solid var(--fl-line);
    border-radius: 0; padding: 10px 12px; background: var(--fl-panel);
  }
  body.fluent-app #contenido-principal .kpi-tira .kpi .n { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
  body.fluent-app #contenido-principal .kpi-tira .kpi .l { margin-top: 0; }
  body.fluent-app :focus-visible { outline: 3px solid var(--fl-accent); outline-offset: 3px; }
  body.fluent-app #contenido-principal :is(button,a.btn,a.p-btn):active { filter: brightness(.96); }
  /* Home: retain tasks, amounts and activity, but remove the promotional scale. */
  body.fluent-app.dp-shell .dp-home h2#dp-hoy { font-size: 25px; line-height: 1.3; margin: 0 0 8px; letter-spacing: -.5px; }
  body.fluent-app.dp-shell .dp-overview { margin-top: 18px; gap: 18px; grid-template-columns: minmax(0,1.5fr) minmax(260px,1fr); }
  body.fluent-app.dp-shell .dp-priority { padding: 20px; border-top: 1px solid var(--fl-line); border-radius: 10px; box-shadow: none; }
  body.fluent-app.dp-shell .dp-priority h2 { font-size: 19px; margin-top: 12px; }
  body.fluent-app.dp-shell .dp-priority-bottom { padding-top: 14px; align-items: center; }
  body.fluent-app.dp-shell .dp-money { font-size: 18px; letter-spacing: 0; }
  body.fluent-app.dp-shell .dp-activity { padding: 20px; border-radius: 10px; background: var(--fl-panel); border: 1px solid var(--fl-line); }
  body.fluent-app.dp-shell .dp-activity b { font-size: 14px; }
  body.fluent-app.dp-shell .dp-provenance { padding-top: 12px; margin-top: 16px; }
  body.fluent-app.dp-shell .dp-tasks { margin-top: 12px; }
  body.fluent-app.dp-shell .dp-action { box-shadow: none; border-radius: 7px; }
  /* Document launcher is a compact toolbar/work surface, not a second hero.
     Reader canvases, page geometry and source-document formatting stay owned by Office. */
  body.fluent-app.dp-shell.screen-office .office-launcher { padding: 22px; gap: 20px; border-radius: 10px; }
  body.fluent-app.dp-shell.screen-office .office-launcher h2 { font-size: 25px; line-height: 1.3; letter-spacing: -.5px; }
  body.fluent-app.dp-shell.screen-office .office-open-actions button { min-height: 48px; border-radius: 7px; }
  body.fluent-app.dp-shell.screen-office .office-library { padding: 22px; }
  /* The existing large data workspaces retain their bounded rows and controllers. */
  body.fluent-app:is(.screen-socios,.screen-inventario,.screen-inventario_equipos,.screen-equipos_catalogo) .cap-viewport { min-width: 0; }
  body.fluent-app:is(.screen-semana,.screen-equipos,.screen-pagos_socios,.screen-equipos_pagos,.screen-comprobantes) #contenido-principal > :is(.card,.p-card,.panel) { margin-block: 16px; }
}
@media screen and (min-width: 1024px) {
  body.fluent-app.dp-shell { padding: 18px; }
  body.fluent-app.dp-shell .site-header { border-radius: 12px 12px 0 0; backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--fl-panel) !important; }
  body.fluent-app.dp-shell .header-top-row { min-height: 64px; padding: 12px 22px; }
  body.fluent-app.dp-shell .header-sub-row { padding: 10px 22px; }
  body.fluent-app.dp-shell #contenido-principal { padding: 26px 28px 100px; border-radius: 0 0 12px 12px; }
  body.fluent-app.dp-shell :is(.nav-hub-btn,.nav-office-direct,.dp-primary) { border-radius: 7px; }
  body.fluent-app.dp-shell :is(.nav-dropdown,.dp-finishes) { border-radius: 10px; box-shadow: 0 10px 30px #12303a18; }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
  body.fluent-app #contenido-principal { padding-inline: 22px; }
}
@media screen and (min-width: 1381px) {
  body.fluent-app.dp-shell .site-header .htr-left { flex-wrap: nowrap; gap: 8px; }
  body.fluent-app.dp-shell .site-header .nav-grouped { min-width: 0; gap: 0; flex: 1 1 auto; }
  body.fluent-app.dp-shell .site-header :is(.nav-hub-btn,.nav-office-direct,.dp-primary) { padding-inline: 7px; font-size: 11.5px; }
  body.fluent-app.dp-shell .site-header .dp-appearance { margin-left: 0; }
  /* Supersede the earlier premium shell's !important 310px title reservation. */
  body.fluent-app.dp-shell .site-header .htr-left .pagetitle { flex: 0 1 90px !important; max-width: 90px !important; }
}
@media screen and (max-width: 767px) {
  body.fluent-app {
    --fl-root: #eaf6f5; --fl-surface: #f6fcfb; --fl-panel: #fff; --fl-ink: #12303a;
    --fl-muted: #536c71; --fl-line: #d1e3e0; --fl-accent: #007c72; --fl-on: #fff; --fl-soft: #ddf4f0;
    --t2-papel: var(--fl-panel); --t2-mesa: var(--fl-surface); --t2-tinta: var(--fl-ink);
    --t2-lapiz: var(--fl-muted); --t2-verde: var(--fl-accent); --t2-verde-tinta: var(--fl-on);
    --t2-linea: var(--fl-line); --t2-linea-2: var(--fl-line); --t2-verde-suave: var(--fl-soft);
    --t2-sans: var(--font-sans); --t2-serif: var(--font-sans);
    background: var(--fl-root);
  }
  html[data-tema="oscuro"] body.fluent-app {
    --fl-root: #091f25; --fl-surface: #0d2930; --fl-panel: #14363e; --fl-ink: #effafa;
    --fl-muted: #aec5c7; --fl-line: #3b6267; --fl-accent: #78e2ca; --fl-on: #103037; --fl-soft: #1a484d; --fl-control: #739b9b;
  }
  html[data-tema] body.fluent-app.t2 {
    --t2-papel: var(--fl-panel); --t2-mesa: var(--fl-surface); --t2-tinta: var(--fl-ink);
    --t2-lapiz: var(--fl-muted); --t2-verde: var(--fl-accent); --t2-verde-tinta: var(--fl-on);
    --t2-linea: var(--fl-line); --t2-linea-2: var(--fl-line); --t2-verde-suave: var(--fl-soft);
    --t2-borde-control: var(--fl-control);
    --t2-sans: var(--font-sans); --t2-serif: var(--font-sans);
  }
  body.fluent-app #contenido-principal { padding-inline: 16px; background: var(--fl-surface); }
  body.fluent-app.t2 .site-header :is(h1,.htr-title,.page-title) { font-family: var(--font-sans); }
  body.fluent-app #contenido-principal :is(input,select,textarea):not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),
  body.fluent-app #contenido-principal :is(button,.btn,.p-btn,.p-btn-primary,.p-btn-secondary) { min-height: 48px; }
  body.fluent-app #contenido-principal :is(input,select,textarea):not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]) {
    font-size: 16px; max-width: 100%; box-sizing: border-box;
  }
  body.fluent-app #contenido-principal :is(.hero,.p-hero) { flex-wrap: wrap; gap: 12px; padding-top: 8px; }
  body.fluent-app #contenido-principal :is(.hero h1,.p-hero h1,.semana-hero-heading) { font-size: 23px; }
  body.fluent-app #contenido-principal :is(.office-launcher,.office-open-actions) { gap: 12px; }
  body.fluent-app #contenido-principal :is(.office-launcher h2,.office-library h2) { font-size: 23px; }
  body.fluent-app #contenido-principal .cap-docket-list { max-height: min(48dvh, 480px); overflow-y: auto; overscroll-behavior-y: contain; }
  body.fluent-app.screen-socio .t2-socio-status { font-size: 20px !important; }
  body.fluent-app.screen-socio .t2-socio-amount { font-size: 22px !important; font-weight: 700 !important; letter-spacing: 0 !important; }
  body.fluent-app.screen-socio .cap-spine { display: grid !important; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; max-width: 100%; }
  body.fluent-app.screen-socio .cap-spine .cap-tab { display: grid !important; grid-template-columns: 16px minmax(0,1fr); gap: 2px 5px; align-content: center; min-width: 0 !important; padding: 6px; }
  body.fluent-app.screen-socio .cap-tab-icon { grid-row: 1 / 3; align-self: center; }
  body.fluent-app.screen-socio .cap-tab-label { white-space: normal; font-size: 12px; }
  body.fluent-app.screen-socio .cap-tab-badge { grid-column: 2; white-space: normal; font-size: 10px; }
  body.fluent-app :is(.mc-bottom-nav,.mnd-panel) { background-color: var(--fl-panel); border-color: var(--fl-line); }
}
@media screen and (prefers-reduced-motion: reduce) {
  body.fluent-app *,body.fluent-app *::before,body.fluent-app *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
}
@media print {
  /* Screen-only rules above deliberately leave reports and source documents alone. */
}
