/* ============================================================
   Floow Typography Foundation 1.0 · Satoshi
   Canonical brand typography for Sistema RH / Floow.
   ============================================================ */

@font-face{
  font-family:"Satoshi";
  src:url("../fonts/satoshi/Satoshi-Regular.otf") format("opentype");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"Satoshi";
  src:url("../fonts/satoshi/Satoshi-Italic.otf") format("opentype");
  font-style:italic;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"Satoshi";
  src:url("../fonts/satoshi/Satoshi-Medium.otf") format("opentype");
  font-style:normal;
  font-weight:500;
  font-display:swap;
}
@font-face{
  font-family:"Satoshi";
  src:url("../fonts/satoshi/Satoshi-MediumItalic.otf") format("opentype");
  font-style:italic;
  font-weight:500;
  font-display:swap;
}
@font-face{
  font-family:"Satoshi";
  src:url("../fonts/satoshi/Satoshi-Bold.otf") format("opentype");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}
@font-face{
  font-family:"Satoshi";
  src:url("../fonts/satoshi/Satoshi-BoldItalic.otf") format("opentype");
  font-style:italic;
  font-weight:700;
  font-display:swap;
}

:root{
  --font-brand:"Satoshi",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-ui:var(--font-brand);
  --font-display:var(--font-brand);
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;

  --font-weight-regular:400;
  --font-weight-medium:500;
  --font-weight-bold:700;

  --weight-page:var(--font-weight-bold);
  --weight-section:var(--font-weight-bold);
  --weight-component:var(--font-weight-medium);

  --tracking-display:-.045em;
  --tracking-title:-.025em;
  --tracking-section:-.012em;
  --tracking-body:0;
  --tracking-meta:.02em;
  --tracking-overline:.06em;
}

html,
body,
button,
input,
select,
textarea{
  font-family:var(--font-ui);
}

body{
  font-kerning:normal;
  text-rendering:optimizeLegibility;
}

:is(.page-header,.dashboard-section-heading,.employee-section-heading,.settings-section-heading,.help-section-heading,.section-title-row) :is(h1,h2),
.auth-brand-copy h1,
.auth-access-heading h2{
  font-family:var(--font-display);
  font-feature-settings:"kern" 1;
}

.auth-brand-copy h1,
.page-header h1{
  font-weight:var(--font-weight-bold);
}

:where(code,kbd,samp,pre){
  font-family:var(--font-mono);
}


/* ============================================================
   Floow Type Scale 1.0 · v2.7.23
   Semantic roles for Calm Enterprise UX.
   ============================================================ */
:root{
  --type-display-xl:clamp(2.75rem,5vw,5.5rem);
  --type-display:clamp(2rem,3vw,3.25rem);
  --type-page-title:1.5rem;
  --type-section-title:1rem;
  --type-component-title:.875rem;
  --type-body:.875rem;
  --type-body-small:.8125rem;
  --type-label:.8125rem;
  --type-button:.8125rem;
  --type-caption:.75rem;
  --type-meta:.75rem;
  --type-overline:.6875rem;
  --type-kpi:1.625rem;
  --type-table:.8125rem;
  --type-table-head:.6875rem;

  --line-display:.96;
  --line-page:1.15;
  --line-section:1.25;
  --line-body:1.5;
  --line-compact:1.3;
  --line-meta:1.35;

  --tracking-display:-.045em;
  --tracking-title:-.028em;
  --tracking-section:-.015em;
  --tracking-body:0;
  --tracking-meta:.01em;
  --tracking-overline:.055em;

  --weight-page:var(--font-weight-bold);
  --weight-section:var(--font-weight-bold);
  --weight-component:var(--font-weight-medium);
  --weight-label:var(--font-weight-medium);
  --weight-button:var(--font-weight-medium);
  --weight-meta:var(--font-weight-medium);
  --weight-kpi:var(--font-weight-bold);

  /* Existing component contracts now consume the Floow scale. */
  --table-head-size:var(--type-table-head);
  --table-body-size:var(--type-table);
  --metric-value-size:var(--type-kpi);
}

/* Core semantic roles. */
:where(.topbar,.page-heading) h1,
.page-header h1{
  font-size:var(--type-page-title);
  font-weight:var(--weight-page);
  line-height:var(--line-page);
  letter-spacing:var(--tracking-title);
}

.card-header h2,
.section-title-row h2,
:is(.dashboard-section-heading,.employee-section-heading,.settings-section-heading,.help-section-heading) h2{
  font-size:var(--type-section-title);
  font-weight:var(--weight-section);
  line-height:var(--line-section);
  letter-spacing:var(--tracking-section);
}

:where(.card-header h3,.component-title,.panel-title){
  font-size:var(--type-component-title);
  font-weight:var(--weight-component);
  line-height:var(--line-compact);
  letter-spacing:var(--tracking-section);
}

:where(.content,.card,.surface-panel,.modal-contenido,.drawer-content){
  --rh-content-font-size:var(--type-body);
}

:where(.form-grupo label,.field > label,.form-field > label){
  font-size:var(--type-label);
  font-weight:var(--weight-label);
  line-height:var(--line-compact);
  letter-spacing:var(--tracking-body);
}

:where(.btn,.tab,.nav-link){
  font-weight:var(--weight-button);
}
.btn{
  font-size:var(--type-button);
}
.tab{
  font-size:var(--type-label);
}
.nav-link{
  font-size:var(--type-body);
}

:where(.module-eyebrow,.spotlight-eyebrow,.section-kicker,.document-hub-kicker,.organization-kicker,.activity-group-label,.global-create-header .eyebrow){
  font-size:var(--type-overline);
  font-weight:var(--font-weight-bold);
  line-height:1.2;
  letter-spacing:var(--tracking-overline);
}

:where(.form-grupo .ayuda,.field-guidance,.helper-text,.table-sub,.texto-muted small){
  font-size:var(--type-caption);
  line-height:var(--line-meta);
}

.data-table,
.table-enterprise{
  font-size:var(--type-table);
  line-height:var(--line-compact);
}
.data-table th,
.table-enterprise th{
  font-size:var(--type-table-head);
  font-weight:var(--font-weight-bold);
  letter-spacing:.035em;
}

.metric-value,
.metric-card .stat-value,
.dashboard-stats-row > .stat-card .stat-value{
  font-size:var(--type-kpi);
  font-weight:var(--weight-kpi);
  letter-spacing:-.025em;
}

/* Satoshi ships only 400/500/700 in the product runtime.
   These high-value semantic roles must never request synthetic weights. */
:where(
  .btn,.btn-sm,.tab,
  .form-grupo label,.field > label,.form-field > label,
  .nav-group-label,
  .acceso-rapido,
  .metric-label,.metric-card .stat-label,.dashboard-stats-row > .stat-card .stat-label,
  .metric-value,.metric-card .stat-value,.dashboard-stats-row > .stat-card .stat-value,
  .data-table th,.table-enterprise th,
  .empty-state h2,.empty-state h3,.empty-state-modern h2,.empty-state-modern h3
){
  font-synthesis:none;
}

@media(max-width:700px){
  :root{
    --type-page-title:1.3125rem;
    --type-section-title:.9375rem;
    --type-kpi:1.375rem;
  }
  .metric-value,
  .metric-card .stat-value,
  .dashboard-stats-row > .stat-card .stat-value{
    font-size:var(--type-kpi) !important;
    line-height:1.05 !important;
  }
}


/* ============================================================
   Floow Typography Visual Polish 1.0 · v2.7.25
   Critical-surface refinement after semantic scale migration.
   ============================================================ */
:root{
  --type-support:.8125rem;
  --type-caption-strong:.75rem;
  --type-micro:.6875rem;
  --type-mobile-nav:.7rem;
  --type-file-name:.8125rem;
  --type-file-meta:.75rem;
  --type-file-submeta:.6875rem;
  --type-doc-summary-label:.75rem;
  --type-doc-action:.75rem;
}

/* Dashboard: preserve compactness without micro-text collapse. */
.metric-label,
.metric-card .stat-label,
.dashboard-stats-row > .stat-card .stat-label{
  font-size:var(--type-caption-strong);
  line-height:1.3;
  letter-spacing:var(--tracking-meta);
}
.metric-meta,
.dashboard-stats-row > .stat-card .subtitulo{
  font-size:var(--type-micro);
  line-height:1.3;
}

/* Dense data surfaces. */
.data-table td,
.table-enterprise td{
  line-height:1.35;
}
.table-sub{
  font-size:var(--type-caption);
  line-height:1.35;
}
.personas-table td:first-child,
.supervision-person-name,
.supervision-table td:nth-child(2),
.supervision-history-table td:nth-child(2){
  font-weight:var(--font-weight-medium);
}

/* Form hierarchy: calm labels, readable help. */
:where(.form-grupo .ayuda,.field-guidance,.helper-text,.form-help,.input-help){
  font-size:var(--type-caption);
  line-height:1.4;
}
:where(.field-error,.form-error,.input-error,[data-field-error]){
  font-size:var(--type-caption);
  line-height:1.35;
}

/* Expediente hierarchy. */
.expediente-hero-copy h1{
  font-size:var(--type-page-title);
  font-weight:var(--weight-page);
  line-height:var(--line-page);
  letter-spacing:var(--tracking-title);
}
.expediente-number{
  font-size:var(--type-meta);
  line-height:1.35;
  letter-spacing:var(--tracking-meta);
}

/* Document hub: eliminate unreadable 9–10px metadata from the legacy layer. */
.document-hub-kicker{
  font-size:var(--type-overline);
  line-height:1.2;
  letter-spacing:var(--tracking-overline);
}
.document-hub-title h2{
  font-size:1.25rem;
  font-weight:var(--font-weight-bold);
  line-height:1.2;
  letter-spacing:var(--tracking-section);
}
.document-hub-title p{
  font-size:var(--type-body-small);
  line-height:1.5;
}
.document-summary-grid-audit .document-summary-item > div > span,
.document-summary-item span:last-child{
  font-size:var(--type-doc-summary-label);
  line-height:1.3;
}
.document-file-meta strong{
  font-size:var(--type-file-name);
  line-height:1.3;
}
.document-file-meta span{
  font-size:var(--type-file-meta);
  line-height:1.3;
}
.document-file-meta small{
  font-size:var(--type-file-submeta);
  line-height:1.3;
}
.document-view-btn{
  font-size:var(--type-doc-action);
  font-weight:var(--font-weight-medium);
}

/* Mobile shell label density. */
.bottom-nav-movil a,
.bottom-nav-movil button{
  font-size:var(--type-mobile-nav);
  line-height:1.15;
  letter-spacing:.005em;
}

@media(max-width:700px){
  .metric-label,
  .metric-card .stat-label,
  .dashboard-stats-row > .stat-card .stat-label{
    font-size:var(--type-micro) !important;
    line-height:1.22 !important;
    letter-spacing:.015em !important;
  }
  .metric-meta,
  .dashboard-stats-row > .stat-card .subtitulo{
    font-size:var(--type-micro) !important;
    line-height:1.22 !important;
  }
  .expediente-hero-copy h1{
    font-size:1.1875rem !important;
    line-height:1.16 !important;
  }
  .document-file-meta strong{
    font-size:var(--type-body-small);
  }
  .document-file-meta span{
    font-size:var(--type-caption);
  }
  .document-file-meta small{
    font-size:var(--type-micro);
  }
}