:root{
    --corp-red:#ab1010;
    --corp-red-deep:#b00707;
    --corp-red-darker:#7d0404;
    --corp-light:#fef3f2;
    --corp-dark:#b30707;   /* lo usa el borde del navbar */
    --ink:#2a1012;
    --muted:#9a7a77;
    --line:#f2d7d4;
    --surface:#fff;
    --page-bg:#fff;
    --table-hover:#fff7f6;
    --table-border:#f4e7e5;
    --alert-bg:#fff;
    --alert-border:#f4c7c3;
    --alert-text:#9a1414;
    --auth-grad-1:#c81b1b;
    --auth-grad-2:var(--corp-red);
    --auth-grad-3:var(--corp-red-deep);

    /* Chips/etiquetas (tags de origen, badges de estado, barra de estado). */
    --chip-blue-bg:#eef2fb;   --chip-blue-border:#c9d7f0;   --chip-blue-text:#2c4a86;
    --chip-amber-bg:#fff4e5;  --chip-amber-border:#f5d9ac;  --chip-amber-text:#a35a00;
    --chip-green-bg:#e7f6ec;  --chip-green-border:#b9e3c6;  --chip-green-text:#1a7f3c;
    --chip-purple-bg:#f3edfa; --chip-purple-border:#dbcaf0; --chip-purple-text:#5b3a86;
    --chip-grey-bg:#f2f4f7;   --chip-grey-border:#e0e4ea;   --chip-grey-text:#5c6470;
    --chip-red-bg:#fdeeee;    --chip-red-border:#f4c7c3;    --chip-red-text:#9a1414;
}

/* ---------- Modo oscuro ----------
   Las páginas usan estas variables para fondos de tarjeta/superficie en vez
   de #fff a pelo, así que redefinirlas aquí basta sin tocar cada CSS. */
:root[data-theme="dark"]{
    --corp-light:#2a1416;
    --ink:#f1e6e4;
    --muted:#c2a19d;
    --line:#4a2c2c;
    --surface:#231314;
    --page-bg:#160c0d;
    --table-hover:#2e1a1b;
    --table-border:#3a2223;
    --alert-bg:#3a1616;
    --alert-border:#5c2222;
    --alert-text:#ff9d95;
    --auth-grad-1:#7a1414;
    --auth-grad-2:#4a0c0c;
    --auth-grad-3:#220505;

    --chip-blue-bg:rgba(66,110,190,.22);   --chip-blue-border:rgba(120,150,220,.4);   --chip-blue-text:#a9c3f5;
    --chip-amber-bg:rgba(163,90,0,.22);    --chip-amber-border:rgba(220,150,60,.4);   --chip-amber-text:#f0b869;
    --chip-green-bg:rgba(26,127,60,.2);    --chip-green-border:rgba(90,180,120,.4);   --chip-green-text:#7fd99a;
    --chip-purple-bg:rgba(91,58,134,.25);  --chip-purple-border:rgba(150,110,200,.4); --chip-purple-text:#c7a9ef;
    --chip-grey-bg:rgba(92,100,112,.25);   --chip-grey-border:rgba(150,155,165,.4);   --chip-grey-text:#c3c8d1;
    --chip-red-bg:rgba(154,20,20,.22);     --chip-red-border:rgba(220,90,90,.4);      --chip-red-text:#ff9d95;
}

body{
    background:var(--page-bg);
    color:var(--ink);
    transition:background-color .15s ease, color .15s ease;
}

/* Bootstrap define .bg-light con !important (utilidad), así que hace falta
   igualarlo aquí; la especificidad sola no basta. */
.navbar.navbar-light.bg-light{
    background-color:var(--surface) !important;
    border-color:var(--line) !important;
}

.navbar-actions{ display:flex; align-items:center; gap:.6rem; }

/* Dos PNG (logo rojo / logo blanco), igual que el favicon del login: el
   tema activo decide cuál se ve. */
:root[data-theme="dark"] .navbar-logo-red{ display:none; }
:root[data-theme="light"] .navbar-logo-white{ display:none; }

.btn-theme-toggle{
    display:inline-flex; align-items:center; justify-content:center;
    width:2.3rem; height:2.3rem; border-radius:9px;
    border:1px solid var(--line); background:transparent; color:var(--ink);
    cursor:pointer; transition:background .15s ease, border-color .15s ease;
}
.btn-theme-toggle:hover{ background:var(--corp-light); }
.btn-theme-toggle .icon-moon{ display:none; }
:root[data-theme="dark"] .btn-theme-toggle .icon-sun{ display:none; }
:root[data-theme="dark"] .btn-theme-toggle .icon-moon{ display:inline-block; }

/* ---------- Barra superior ----------
   Bootstrap limita .container a ~1140-1320px. Las páginas de contenido
   (tabla de albaranes, excel) ya se ensanchan a 1700px por su cuenta, así
   que sin esto el logo y el botón de cerrar sesión quedan centrados en un
   ancho menor, dejando mucho blanco a los lados en comparación. */
.navbar .container{ max-width:1700px; }

/* ---------- Botón "Cerrar sesión" (navbar) ---------- */
.btn-logout{
    font-family:'Plus Jakarta Sans', system-ui, sans-serif;
    font-weight:600; font-size:.86rem;
    color:var(--corp-red); background:rgba(234,9,9,.07);
    border:1px solid rgba(234,9,9,.18); border-radius:9px;
    padding:.42rem .9rem; cursor:pointer;
    transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.btn-logout:hover{ background:var(--corp-red); color:#fff; border-color:var(--corp-red); }

/* ---------- Pestañas del navbar ----------
   El navbar usa .justify-content-between con dos hijos (logo y logout), así
   que las pestañas van en medio como tercer hijo y quedan centradas solas. */
.nav-tabs-corp{ display:flex; gap:.35rem; }

.nav-tab{
    font-family:'Plus Jakarta Sans', system-ui, sans-serif;
    font-weight:600; font-size:.88rem; text-decoration:none;
    color:var(--ink); opacity:.72;
    padding:.42rem .85rem; border-radius:9px;
    border:1px solid transparent;
    transition:background .15s ease, color .15s ease, opacity .15s ease;
}
.nav-tab:hover{ opacity:1; background:var(--corp-light); color:var(--corp-red-deep); }

.nav-tab.is-active{
    opacity:1;
    color:var(--corp-red-deep);
    background:rgba(234,9,9,.07);
    border-color:rgba(234,9,9,.18);
}

/* Las pestañas se apilarían mal en móvil junto al logo y el botón de salir;
   el logo ya lleva a la pantalla de albaranes, así que solo queda Prompts. */
@media (max-width:575px){
    .nav-tabs-corp .nav-tab{ padding:.35rem .55rem; font-size:.8rem; }
}