/* ==========================================================================
   OLIVOTRONIC · Tokens compartidos con el software
   --------------------------------------------------------------------------
   La paleta canónica vive en --oli-*. Los nombres legacy --ot-* se mantienen
   como capa de compatibilidad para que los CSS existentes sigan funcionando,
   pero apuntan ya a los valores reales de la imagen corporativa.
   ========================================================================== */

:root {
    /* ----------------------------------------------------------------------
       PALETA CRUDA (no usar directamente en componentes — usa los semánticos)
       ---------------------------------------------------------------------- */

    /* Canvas — verde botella profundo */
    --oli-ink-950: #060B09;
    --oli-ink-900: #0A1410;
    --oli-ink-850: #0E1B16;
    --oli-ink-800: #132520;
    --oli-ink-750: #1A2F28;
    --oli-ink-700: #223B33;
    --oli-ink-600: #2E5046;

    /* Olivo — cuerpo de marca */
    --oli-olive-900: #1F2E1C;
    --oli-olive-800: #2D4327;
    --oli-olive-700: #3E5C36;
    --oli-olive-600: #587A48;
    --oli-olive-500: #7A9656;
    --oli-olive-400: #9BB571;
    --oli-olive-300: #BFD198;

    /* Oro — aceite premium, metálico */
    --oli-gold-900: #4A3311;
    --oli-gold-800: #6E4E1C;
    --oli-gold-700: #957029;
    --oli-gold-600: #B8903A;
    --oli-gold-500: #D4AF5A;
    --oli-gold-400: #E5C77A;
    --oli-gold-300: #F0DDA4;
    --oli-gold-200: #F8ECC6;

    /* Neutros — gris frío afinado al verde */
    --oli-neutral-100: #F2EFE6;
    --oli-neutral-200: #D9D4C4;
    --oli-neutral-300: #A8AFA6;
    --oli-neutral-400: #7B847E;
    --oli-neutral-500: #5A6560;
    --oli-neutral-600: #3F4945;
    --oli-neutral-700: #2A3330;

    /* Señales semánticas */
    --oli-signal-success: #6FBF7F;
    --oli-signal-warning: #E8B13A;
    --oli-signal-danger:  #D66A5A;
    --oli-signal-info:    #6FA8BF;

    /* ----------------------------------------------------------------------
       TOKENS SEMÁNTICOS (usa estos en componentes nuevos)
       ---------------------------------------------------------------------- */

    --bg-app:        var(--oli-ink-900);
    --bg-app-grad:   radial-gradient(ellipse 120% 80% at 50% -10%, #0F201A 0%, var(--oli-ink-900) 55%, var(--oli-ink-950) 100%);
    --bg-panel:      var(--oli-ink-850);
    --bg-card:       linear-gradient(180deg, #142720 0%, #0E1B16 100%);
    --bg-card-flat:  var(--oli-ink-800);
    --bg-raised:     var(--oli-ink-750);
    --bg-sunken:     var(--oli-ink-950);
    --bg-input:      #0B1612;
    --bg-hover:      rgba(212, 175, 90, 0.06);
    --bg-active:     rgba(212, 175, 90, 0.12);
    --bg-scrim:      rgba(6, 11, 9, 0.72);

    --fg-primary:    #E8E6DC;
    --fg-secondary:  var(--oli-neutral-300);
    --fg-muted:      var(--oli-neutral-400);
    --fg-disabled:   var(--oli-neutral-500);
    --fg-inverse:    var(--oli-ink-900);
    --fg-on-gold:    #1A1205;

    --accent-gold:         var(--oli-gold-500);
    --accent-gold-hover:   var(--oli-gold-400);
    --accent-gold-muted:   var(--oli-gold-700);
    --accent-olive:        var(--oli-olive-600);
    --accent-olive-hover:  var(--oli-olive-500);

    --border-subtle:    rgba(212, 175, 90, 0.08);
    --border-default:   rgba(212, 175, 90, 0.14);
    --border-strong:    rgba(212, 175, 90, 0.28);
    --border-olive:     rgba(122, 150, 86, 0.25);
    --border-focus:     var(--oli-gold-500);
    --border-danger:    var(--oli-signal-danger);

    --gold-metallic: linear-gradient(
        180deg,
        #F0DDA4 0%,
        #E5C77A 18%,
        #D4AF5A 45%,
        #B8903A 72%,
        #957029 100%
    );
    --gold-metallic-sheen: linear-gradient(
        135deg,
        #957029 0%,
        #D4AF5A 30%,
        #F8ECC6 50%,
        #D4AF5A 70%,
        #957029 100%
    );
    --olive-metallic: linear-gradient(
        180deg,
        #7A9656 0%,
        #587A48 45%,
        #3E5C36 80%,
        #2D4327 100%
    );

    --glow-gold-xs:  0 0 0 1px rgba(212, 175, 90, 0.22);
    --glow-gold-sm:  0 0 12px rgba(212, 175, 90, 0.22);
    --glow-gold-md:  0 0 24px rgba(212, 175, 90, 0.28), 0 0 1px rgba(240, 221, 164, 0.55);
    --glow-gold-lg:  0 0 48px rgba(212, 175, 90, 0.32), 0 0 2px rgba(240, 221, 164, 0.7);
    --glow-olive-sm: 0 0 12px rgba(122, 150, 86, 0.24);
    --glow-danger:   0 0 12px rgba(214, 106, 90, 0.35);

    --shadow-xs:  0 1px 0 rgba(240, 221, 164, 0.04) inset, 0 1px 2px rgba(0,0,0,0.4);
    --shadow-sm:  0 1px 0 rgba(240, 221, 164, 0.05) inset, 0 2px 6px rgba(0,0,0,0.5);
    --shadow-md:  0 1px 0 rgba(240, 221, 164, 0.06) inset, 0 8px 20px rgba(0,0,0,0.55);
    --shadow-lg:  0 1px 0 rgba(240, 221, 164, 0.08) inset, 0 18px 40px rgba(0,0,0,0.6);
    --shadow-xl:  0 1px 0 rgba(240, 221, 164, 0.10) inset, 0 30px 70px rgba(0,0,0,0.7);

    /* ----------------------------------------------------------------------
       CAPA LEGACY · --ot-* mapeados a la paleta canónica
       (mantiene el CSS existente funcionando con los colores nuevos)
       ---------------------------------------------------------------------- */

    --ot-black:       var(--oli-ink-950);   /* #060B09 */
    --ot-night:       var(--oli-ink-900);   /* #0A1410 */
    --ot-deep-green:  var(--oli-ink-850);   /* #0E1B16 */
    --ot-green:       var(--oli-olive-900); /* #1F2E1C */
    --ot-green-soft:  var(--oli-olive-700); /* #3E5C36 */
    --ot-olive:       var(--oli-olive-600); /* #587A48 */
    --ot-lime:        var(--oli-olive-400); /* #9BB571 — sustituye al lima anterior */
    --ot-gold:        var(--oli-gold-600);  /* #B8903A */
    --ot-gold-soft:   var(--oli-gold-500);  /* #D4AF5A — acento marca */
    --ot-white:       var(--fg-primary);    /* #E8E6DC */
    --ot-muted:       var(--oli-neutral-300); /* #A8AFA6 */

    /* ----------------------------------------------------------------------
       TIPOGRAFÍA Y LAYOUT (sin cambios — solo color)
       ---------------------------------------------------------------------- */

    --font-main: "Sora", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    --container: 1180px;
    --radius-xl: 32px;
    --radius-lg: 22px;
    --radius-md: 14px;

    --shadow-gold:  0 0 50px rgba(212, 175, 90, 0.35);
    --shadow-green: 0 0 60px rgba(155, 181, 113, 0.18);
}
