/* =========================================================
   CAMTECH ERP · Tokens de marca canónicos
   Identidad tipográfica y cromática institucional.

   Objetivo:
   - Una sola identidad visual para CAMTECH ERP.
   - Tipografía Manrope con fallback nativo robusto.
   - Azul institucional + teal tecnológico como marca.
   - Colores de alerta/éxito conservados como semántica.
   - Compatibilidad con aliases históricos sin reglas por cliente.

   Esta capa NO modifica layout, permisos, navegación ni lógica.
========================================================= */

:root{
    /* Tipografía institucional */
    --camtech-font-family: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    --camtech-font-display: var(--camtech-font-family);
    --camtech-font-body: var(--camtech-font-family);

    /* Escala de pesos realmente disponible en Manrope.
       No usar 850/900/950: el máximo publicado/cargado es 800. */
    --camtech-font-weight-regular: 400;
    --camtech-font-weight-medium: 500;
    --camtech-font-weight-semibold: 600;
    --camtech-font-weight-bold: 700;
    --camtech-font-weight-extrabold: 800;

    /* =====================================================
       Sistema tipográfico semántico canónico
       Una sola gramática para acceso, shell y superficies operativas.
       Los consumidores deben usar roles, no recrear escalas locales.
       ===================================================== */
    --camtech-type-display-size: clamp(32px, 2.65vw, 42px);
    --camtech-type-display-line: 1.12;
    --camtech-type-display-weight: var(--camtech-font-weight-extrabold);
    --camtech-type-display-tracking: -.032em;

    --camtech-type-page-title-size: 24px;
    --camtech-type-page-title-line: 1.15;
    --camtech-type-page-title-weight: var(--camtech-font-weight-bold);
    --camtech-type-page-title-tracking: 0;

    --camtech-type-section-title-size: 16px;
    --camtech-type-section-title-line: 1.10;
    --camtech-type-section-title-weight: var(--camtech-font-weight-bold);
    --camtech-type-section-title-tracking: 0;

    --camtech-type-kicker-size: 10px;
    --camtech-type-kicker-line: 1.05;
    --camtech-type-kicker-weight: var(--camtech-font-weight-extrabold);
    --camtech-type-kicker-tracking: .08em;

    --camtech-type-micro-kicker-size: 8.5px;
    --camtech-type-micro-kicker-line: 1;
    --camtech-type-micro-kicker-weight: var(--camtech-font-weight-extrabold);
    --camtech-type-micro-kicker-tracking: .08em;

    --camtech-type-label-size: 13px;
    --camtech-type-label-line: 1.20;
    --camtech-type-label-weight: var(--camtech-font-weight-bold);
    --camtech-type-label-tracking: 0;

    --camtech-type-control-size: 14px;
    --camtech-type-control-line: 1.20;
    --camtech-type-control-weight: var(--camtech-font-weight-medium);
    --camtech-type-control-tracking: 0;

    --camtech-type-body-size: 14px;
    --camtech-type-body-line: 1.50;
    --camtech-type-body-weight: var(--camtech-font-weight-medium);
    --camtech-type-body-tracking: 0;

    --camtech-type-body-compact-size: 13px;
    --camtech-type-body-compact-line: 1.45;
    --camtech-type-body-compact-weight: var(--camtech-font-weight-medium);
    --camtech-type-body-compact-tracking: 0;

    --camtech-type-helper-size: 12px;
    --camtech-type-helper-line: 1.35;
    --camtech-type-helper-weight: var(--camtech-font-weight-medium);
    --camtech-type-helper-tracking: 0;

    --camtech-type-helper-compact-size: 11px;
    --camtech-type-helper-compact-line: 1.35;
    --camtech-type-helper-compact-weight: var(--camtech-font-weight-medium);

    --camtech-type-cta-size: 15px;
    --camtech-type-cta-line: 1;
    --camtech-type-cta-weight: var(--camtech-font-weight-bold);
    --camtech-type-cta-tracking: 0;

    --camtech-type-nav-size: 14px;
    --camtech-type-nav-line: 1.20;
    --camtech-type-nav-weight: var(--camtech-font-weight-bold);
    --camtech-type-nav-sub-weight: var(--camtech-font-weight-medium);

    --camtech-type-context-label-size: 12px;
    --camtech-type-context-label-line: 1.15;
    --camtech-type-context-label-weight: var(--camtech-font-weight-extrabold);
    --camtech-type-context-primary-size: 13.5px;
    --camtech-type-context-primary-line: 1.08;
    --camtech-type-context-primary-weight: var(--camtech-font-weight-extrabold);
    --camtech-type-context-value-size: 10.5px;
    --camtech-type-context-value-line: 1.10;
    --camtech-type-context-value-weight: var(--camtech-font-weight-semibold);

    --camtech-type-metric-lg-size: 20px;
    --camtech-type-metric-lg-line: 1.02;
    --camtech-type-metric-lg-weight: var(--camtech-font-weight-extrabold);
    --camtech-type-metric-lg-tracking: -.025em;

    /* Marca CAMTECH ERP */
    --camtech-brand-primary: #0B355D;
    --camtech-brand-primary-dark: #072742;
    --camtech-brand-primary-hover: #092F53;
    --camtech-brand-accent: #07828E;
    --camtech-brand-accent-dark: #066E78;
    --camtech-brand-accent-bright: #0797A5;

    /* Superficies y texto */
    --camtech-brand-bg: #F3F7FA;
    --camtech-brand-surface: #FFFFFF;
    --camtech-brand-surface-soft: #F7FAFC;
    --camtech-brand-border: #D8E4EE;
    --camtech-brand-text: #17324D;
    --camtech-brand-heading: #0B355D;
    --camtech-brand-muted: #60758A;
    --camtech-brand-muted-2: #7C8B9C;

    /* Estados semánticos: no forman parte de la marca, conservan significado operativo. */
    --camtech-danger: #C23B4B !important;
    --camtech-danger-dark: #9F2F3D !important;
    --camtech-danger-soft: #FEF2F2 !important;
    --camtech-danger-border: #FECACA !important;
    --camtech-success: #16A34A !important;
    --camtech-success-dark: #118847 !important;
    --camtech-success-soft: #E8F8EF !important;
    --camtech-success-border: #CBEAD5 !important;
    --camtech-warning: #D97706 !important;
    --camtech-warning-soft: #FFF7ED !important;

    /* Tokens operativos canónicos: prevalecen sobre branding legado por instancia. */
    --camtech-primary: var(--camtech-brand-primary) !important;
    --camtech-primary-dark: var(--camtech-brand-primary-dark) !important;
    --camtech-primary-navy: var(--camtech-brand-primary) !important;
    --camtech-primary-hover: var(--camtech-brand-primary-hover) !important;
    --camtech-primary-soft: #EAF1F7 !important;
    --camtech-primary-soft-2: #F5F8FB !important;
    --camtech-secondary: var(--camtech-brand-accent) !important;
    --camtech-primary-rgb: 11, 53, 93 !important;
    --camtech-secondary-rgb: 7, 130, 142 !important;

    --camtech-teal: var(--camtech-brand-accent) !important;
    --camtech-teal-dark: var(--camtech-brand-accent-dark) !important;
    --camtech-teal-soft: #EAF7F8 !important;
    --camtech-teal-border: #CDE7EA !important;

    --camtech-bg: var(--camtech-brand-bg) !important;
    --camtech-surface: var(--camtech-brand-surface) !important;
    --camtech-surface-soft: var(--camtech-brand-surface-soft) !important;
    --camtech-soft: var(--camtech-brand-surface-soft) !important;
    --camtech-soft-2: #EDF3F8 !important;
    --camtech-border: var(--camtech-brand-border) !important;
    --camtech-text: var(--camtech-brand-text) !important;
    --camtech-heading: var(--camtech-brand-heading) !important;
    --camtech-text-soft: var(--camtech-brand-muted) !important;
    --camtech-text-muted: var(--camtech-brand-muted-2) !important;
    --camtech-muted: var(--camtech-brand-muted) !important;

    --camtech-shadow-sm: 0 8px 22px rgba(11, 53, 93, .07) !important;
    --camtech-shadow-md: 0 18px 36px rgba(11, 53, 93, .10) !important;
    --camtech-shadow-lg: 0 22px 46px rgba(11, 53, 93, .14) !important;

    /* Aliases históricos del panel */
    --primary: var(--camtech-primary) !important;
    --primary-dark: var(--camtech-primary-dark) !important;
    --accent: var(--camtech-teal) !important;
    --bg: var(--camtech-bg) !important;
    --white: var(--camtech-surface) !important;
    --text: var(--camtech-text) !important;
    --muted: var(--camtech-text-soft) !important;
    --border: var(--camtech-border) !important;
    --danger: var(--camtech-danger) !important;
    --shadow: var(--camtech-shadow-sm) !important;

    /* Bridge canónico del Login: misma marca, sin duplicar otra paleta/familia. */
    --lg-primary: var(--camtech-brand-primary) !important;
    --lg-primary-dark: var(--camtech-brand-primary-dark) !important;
    --lg-navy: var(--camtech-brand-primary) !important;
    --lg-navy-deep: #052039 !important;
    --lg-teal: var(--camtech-brand-accent) !important;
    --lg-teal-soft: #78DDE2 !important;
    --lg-bg: #EEF4F8 !important;
    --lg-bg-soft: #F7FAFC !important;
    --lg-ink: var(--camtech-brand-text) !important;
    --lg-heading: var(--camtech-brand-heading) !important;
    --lg-muted: var(--camtech-brand-muted) !important;
    --lg-muted-2: var(--camtech-brand-muted-2) !important;
    --lg-line: var(--camtech-brand-border) !important;
    --lg-font-display: var(--camtech-font-display) !important;
    --lg-font-body: var(--camtech-font-body) !important;
    --lg-font-weight-regular: var(--camtech-font-weight-regular) !important;
    --lg-font-weight-medium: var(--camtech-font-weight-medium) !important;
    --lg-font-weight-semibold: var(--camtech-font-weight-semibold) !important;
    --lg-font-weight-bold: var(--camtech-font-weight-bold) !important;
    --lg-font-weight-extrabold: var(--camtech-font-weight-extrabold) !important;
}

html,
body{
    font-family: var(--camtech-font-body);
    color: var(--camtech-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

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

h1,
h2,
h3,
h4,
h5,
h6{
    font-family: var(--camtech-font-display);
}

/* Componente físico único para encabezados de página.
   Login y Shell comparten el mismo markup, clases y tipografía. */
.camtech-page-heading{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    min-width:0;
}

html body .camtech-page-heading > .camtech-page-heading__title{
    margin:0 !important;
    padding:0 !important;
    font-family:var(--camtech-font-display) !important;
    font-size:var(--camtech-type-page-title-size) !important;
    line-height:var(--camtech-type-page-title-line) !important;
    font-weight:var(--camtech-type-page-title-weight) !important;
    letter-spacing:var(--camtech-type-page-title-tracking) !important;
    color:var(--camtech-brand-heading) !important;
    text-align:left !important;
    text-rendering:optimizeLegibility;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}

html body .camtech-page-heading > .camtech-page-heading__subtitle{
    margin:0 !important;
    padding:0 !important;
    font-family:var(--camtech-font-body) !important;
    font-size:var(--camtech-type-body-compact-size) !important;
    line-height:var(--camtech-type-body-compact-line) !important;
    font-weight:var(--camtech-type-body-compact-weight) !important;
    letter-spacing:var(--camtech-type-body-compact-tracking) !important;
    color:var(--camtech-brand-muted) !important;
    text-align:left !important;
}

@media (max-width:620px){
    html body .camtech-page-heading > .camtech-page-heading__title{
        font-size:22px !important;
    }
}

/* Dashboard: puente de tokens para su namespace local consolidado. */
#camtechDashboardPI{
    --dpi-teal: var(--camtech-brand-accent) !important;
    --dpi-teal-dark: var(--camtech-brand-accent-dark) !important;
    --dpi-blue: #0A527A !important;
    --dpi-blue-dark: var(--camtech-brand-primary) !important;
    --dpi-ink: var(--camtech-brand-text) !important;
    --dpi-heading: var(--camtech-brand-heading) !important;
    --dpi-muted: var(--camtech-brand-muted) !important;
    --dpi-muted-2: var(--camtech-brand-muted-2) !important;
    --dpi-line: var(--camtech-brand-border) !important;
    --dpi-line-soft: #E8EFF4 !important;
    --dpi-soft: var(--camtech-brand-surface-soft) !important;
    --dpi-soft-blue: #F2F7FA !important;
    font-family: var(--camtech-font-body);
}