/* DANGOFE OS · Taller Power Wave · los rojos de la marca en el módulo Taller y en el panel del técnico del Taller (T138) · taller-rojo.css v1.0.1 · 2026-10-28
   Solo actúa con <html data-pw="A|B|C"> (lo pone taller-rojo.js en #taller y en el panel del técnico del Taller; nunca en el de Gerald ni en Servicios).
   No reescribe los archivos del Taller: cambia sus variables de color (el azul de cada pieza pasa al rojo Power Wave) y unos pocos botones con el azul escrito.
   Los colores de cada categoría y de cada estado se quedan como están. Los errores y el peligro pasan a NARANJA con su triángulo: el rojo es de la marca.
   Liquid glass, SIN sombras. «Noche azul» en oscuro (el rojo se aclara: #ff5a5f). Nada se anima sin fin. */

/* ---------------------------------------------------------------- la paleta */
html[data-pw] {
  --pw: 236, 50, 55;          /* #ec3237, el rojo de Power Wave */
  --pw-hondo: 200, 25, 31;    /* #c8191f, para texto y rellenos que necesitan contraste */
  --pw-txt: #c8191f;
  --pw-solido: #ec3237;
  --pw-suave: rgba(236, 50, 55, .09);
  --pw-linea: rgba(200, 25, 31, .16);
  --pw-linea2: rgba(200, 25, 31, .30);
  --pw-vidrio: rgba(236, 50, 55, .07);
  --pw-luz: rgba(236, 50, 55, .9);
  --pw-err: 194, 65, 12;      /* naranja de error (#c2410c): nunca el rojo de la marca */
  --pw-err-txt: #c2410c;
  --pw-b1: rgba(236, 50, 55, .17); --pw-b2: rgba(236, 50, 55, .07); --pw-b3: rgba(236, 50, 55, .03);
}
html[data-pw][data-theme='dark'] {
  --pw: 255, 90, 95;          /* #ff5a5f en Noche azul */
  --pw-hondo: 236, 50, 55;
  --pw-txt: #ff8a8d;
  --pw-solido: #ff5a5f;
  --pw-suave: rgba(255, 90, 95, .14);
  --pw-linea: rgba(255, 90, 95, .22);
  --pw-linea2: rgba(255, 90, 95, .38);
  --pw-vidrio: rgba(255, 90, 95, .10);
  --pw-luz: rgba(255, 120, 124, .95);
  --pw-err: 251, 146, 60;     /* #fb923c */
  --pw-err-txt: #fdba74;
  --pw-b1: rgba(255, 90, 95, .34); --pw-b2: rgba(255, 90, 95, .14); --pw-b3: rgba(255, 90, 95, .06);
}

/* ---------------------------------------------------------------- 1 · el azul de cada pieza pasa al rojo (las tres versiones)
   :not(#z):not(#z) sube la especificidad para ganarle a la variable que cada pieza pone en su raíz. */
html[data-pw]:not(#z):not(#z) * {
  --accent-rgb: 200, 25, 31; --tal-accent: 200, 25, 31; --ptx-acento: 200, 25, 31;
  --tp-az: 200, 25, 31; --mcab-az: 200, 25, 31; --crv-az: 200, 25, 31; --nvm-az: 200, 25, 31; --cb-az: 200, 25, 31; --atr-az: 200, 25, 31;
  --pcb-az: 200, 25, 31; --pen-az: 200, 25, 31; --pho-az: 200, 25, 31; --pim-az: 200, 25, 31; --pjx-az: 200, 25, 31; --pm-az: 200, 25, 31;
  --pmt-az: 200, 25, 31; --ppi-az: 200, 25, 31; --pra-az: 200, 25, 31; --tcz-az: 200, 25, 31; --tia-az: 200, 25, 31; --tnv-az: 200, 25, 31;
  --mcab-cel: 236, 50, 55; --crv-cel: 236, 50, 55; --nvm-cel: 236, 50, 55; --cb-cel: 236, 50, 55; --mt-cel: 236, 50, 55;
  --tp-azul: #c8191f; --mcab-azul: #c8191f; --crv-azul: #c8191f; --nvm-azul: #c8191f; --cb-azul: #c8191f; --pjx-azul: #c8191f; --tia-azul: #c8191f;
  --pm-azul: #c8191f; --prt-azul: #c8191f; --pv-azul: #c8191f; --av-azul: #c8191f; --tal-eq-azul: #c8191f; --pm-faro-rot: #c8191f;
  --mt-azul-txt: #c8191f; --pcb-azul-txt: #c8191f; --pen-azul-txt: #c8191f; --pho-azul-txt: #c8191f; --pim-azul-txt: #c8191f; --pm-azul-txt: #c8191f;
  --pmt-azul-txt: #c8191f; --ppi-azul-txt: #c8191f; --pra-azul-txt: #c8191f; --tau-azul-txt: #c8191f; --tcz-azul-txt: #c8191f; --tvt-azul-txt: #c8191f;
  --atr-pri: #c8191f; --pcb-pri: #c8191f; --pen-pri: #c8191f; --pho-pri: #c8191f; --pim-pri: #c8191f; --pmt-pri: #c8191f; --ppi-pri: #c8191f; --tcz-pri: #c8191f;
  --prt-azul2: #ec3237; --pv-azul2: #ec3237; --pfo-az: #c8191f; --pfo-cel: #ec3237; --tal-bar: #ec3237; --tal-bar-hi: #c8191f;
  --tp-borde: rgba(200, 25, 31, .12); --tp-borde2: rgba(200, 25, 31, .22); --cb-borde: rgba(200, 25, 31, .12); --cb-borde2: rgba(200, 25, 31, .22);
  --mt-borde: rgba(200, 25, 31, .12); --mt-borde2: rgba(200, 25, 31, .22); --crv-linea: rgba(200, 25, 31, .12); --crv-linea2: rgba(200, 25, 31, .22);
  --nvm-linea: rgba(200, 25, 31, .12); --nvm-linea2: rgba(200, 25, 31, .22); --pjx-linea: rgba(200, 25, 31, .12); --pjx-linea2: rgba(200, 25, 31, .22);
  --pfo-linea: rgba(200, 25, 31, .14); --prt-linea: rgba(200, 25, 31, .18); --pv-linea: rgba(200, 25, 31, .18);
  --prt-pill: rgba(236, 50, 55, .09); --pv-pill: rgba(236, 50, 55, .09); --mcab-tile: rgba(236, 50, 55, .13); --tp-tile: rgba(236, 50, 55, .10);
  --crv-campo: rgba(200, 25, 31, .04); --nvm-campo: rgba(200, 25, 31, .04); --pjx-campo: rgba(200, 25, 31, .04); --pfo-campo: rgba(200, 25, 31, .04);
  --mt-acc: #c8191f; --mt-acc-txt: #a3121a; --mt-accs: rgba(236, 50, 55, .10);
  --tal-out: var(--pw-err);
}
html[data-pw][data-theme='dark']:not(#z):not(#z) * {
  --accent-rgb: 255, 90, 95; --tal-accent: 255, 90, 95; --ptx-acento: 236, 50, 55;
  --mcab-cel: 255, 90, 95; --crv-cel: 255, 90, 95; --nvm-cel: 255, 90, 95; --cb-cel: 255, 90, 95; --mt-cel: 255, 90, 95;
  --tp-azul: #ff8a8d; --mcab-azul: #ff8a8d; --crv-azul: #ff8a8d; --nvm-azul: #ff8a8d; --cb-azul: #ff8a8d; --pjx-azul: #ff8a8d;
  --prt-azul: #ff8a8d; --pv-azul: #ff8a8d; --tal-eq-azul: #ff8a8d; --mt-azul-txt: #ff8a8d; --pm-azul-txt: #ff8a8d; --pra-azul-txt: #ff8a8d; --tau-azul-txt: #ff8a8d;
  --prt-azul2: #ff5a5f; --pv-azul2: #ff5a5f; --pfo-cel: #ff5a5f; --tal-bar: #ff5a5f; --tal-bar-hi: #ff8a8d;
  --tp-borde: rgba(255, 90, 95, .16); --tp-borde2: rgba(255, 90, 95, .30); --cb-borde: rgba(255, 90, 95, .16); --cb-borde2: rgba(255, 90, 95, .30);
  --mt-borde: rgba(255, 90, 95, .16); --crv-linea: rgba(255, 90, 95, .16); --crv-linea2: rgba(255, 90, 95, .28);
  --nvm-linea: rgba(255, 90, 95, .18); --nvm-linea2: rgba(255, 90, 95, .32); --pjx-linea: rgba(255, 90, 95, .18); --pjx-linea2: rgba(255, 90, 95, .32);
  --pfo-linea: rgba(255, 90, 95, .2); --prt-linea: rgba(255, 90, 95, .26); --pv-linea: rgba(255, 90, 95, .26);
  --prt-pill: rgba(255, 90, 95, .15); --pv-pill: rgba(255, 90, 95, .15); --mcab-tile: rgba(255, 90, 95, .22); --tp-tile: rgba(255, 90, 95, .16);
  --mt-acc: #ff8a8d; --mt-acc-txt: #ff8a8d; --mt-accs: rgba(255, 90, 95, .18);
}
/* los estados no cambian de color: el «en proceso» de la cola del técnico vuelve a su azul (.pt-estado usa las variables de la tarjeta) */
html[data-pw]:not(#z):not(#z) .pt-estado, html[data-pw]:not(#z):not(#z) .pt-estado * { --mt-acc: #0b63ce; --mt-acc-txt: #084a9e; --mt-accs: rgba(11, 99, 206, .12); }
html[data-pw][data-theme='dark']:not(#z):not(#z) .pt-estado, html[data-pw][data-theme='dark']:not(#z):not(#z) .pt-estado * { --mt-acc: #8ab8ff; --mt-acc-txt: #a9c9ff; --mt-accs: rgba(138, 184, 255, .18); }

/* ---------------------------------------------------------------- 2 · lo que tenía el azul escrito (botones, filtros, foco, paginación) */
html[data-pw] .tal-btn--primary, html[data-pw] .pt-btn--primary, html[data-pw] .pt-chip.is-on,
html[data-pw] .pt-sol-opt.is-on, html[data-pw] .pt-tab.is-on, html[data-pw] .tal-otros__op.is-on {
  background: rgba(var(--pw), .22) !important; border-color: rgba(var(--pw), .6) !important;
}
html[data-pw] .tal-chip--on, html[data-pw] .tal-wrap.tp .tal-btn--primary, html[data-pw] .tal-wrap.tp .tal-btn.tal-btn--primary, html[data-pw] .ptx-btn--pri, html[data-pw] .cb-btn--pri, html[data-pw] .cb-chip.is-on,
html[data-pw] .tal-wrap.tp .tal-role.is-on, html[data-pw] .tal-pag-btn.is-on, html[data-pw] .tal-pag-btn[aria-current='page'] {
  background: linear-gradient(135deg, #ec3237, #c8191f) !important; border-color: transparent !important; color: #fff !important; box-shadow: none !important;
}
html[data-pw] .tal-input:focus, html[data-pw] .tal-field input:focus, html[data-pw] .tal-field select:focus, html[data-pw] .tal-field textarea:focus,
html[data-pw] .tal-msgs__composer textarea:focus, html[data-pw] .tal-recep__form input:focus { border-color: rgba(var(--pw), .7) !important; }
html[data-pw] .tal-pag-btn:focus-visible, html[data-pw] .tal-otros__sel:focus-visible, html[data-pw] .tal-foot__sel:focus-visible { outline-color: rgba(var(--pw), .8) !important; }
html[data-pw] .tal-reloj__val--vivo, html[data-pw] .ptx-link, html[data-pw] .ptx-fotos__btn, html[data-pw] .ptx-rpar__hora { color: var(--pw-txt) !important; }
html[data-pw] .tal-detalle, html[data-pw] .tal-solcard--open { border-color: rgba(var(--pw), .4) !important; }
html[data-pw] .pt-dchip--pag, html[data-pw] .pt-stat--focus { background: rgba(var(--pw), .14) !important; border-color: rgba(var(--pw), .45) !important; }
html[data-pw] .tal-msg--mio, html[data-pw] .tal-msgs .is-mio { background: rgba(var(--pw), .16) !important; border-color: rgba(var(--pw), .4) !important; }
html[data-pw] .ptx-prog span { background: linear-gradient(90deg, #ec3237, #f59e0b) !important; }
html[data-pw] .rec-btn { color: var(--pw-txt) !important; background: rgba(var(--pw), .12) !important; border-color: rgba(var(--pw), .4) !important; }
/* «Sigue para reparar» (el faro de la cola): su borde de colores pasa a la gama roja (la animación es la de la pieza, no cambia) */
html[data-pw] .pm .pm-faro__cuerpo { background: linear-gradient(var(--pm-faro-bg), var(--pm-faro-bg)) padding-box, linear-gradient(120deg, #7f0d12, #ec3237, #ff8a8d, #f59e0b, #7f0d12) border-box !important; background-size: 100% 100%, 300% 100% !important; }
html[data-pw] .pm .pm-faro__chev { background: linear-gradient(135deg, #c8191f, #ec3237) !important; }
html[data-pw] .pm .pm-faro__rot i { background: #ff5a5f !important; }
/* Waze y Google Maps NO se tocan (regla 4/8/2): sus botones conservan sus colores. */

/* ---------------------------------------------------------------- 3 · errores y peligro: NARANJA con su triángulo (el rojo es de la marca) */
html[data-pw] .tal-kpi--rojo, html[data-pw] .tal-wrap.tp .tal-kpi--rojo { --kpi-rgb: var(--pw-err) !important; }
html[data-pw] .tal-wrap .tal-tag--danger { --tag-rgb: var(--pw-err) !important; }
html[data-pw] .tal-btn--danger, html[data-pw] .tal-wrap .tal-btn--danger { color: var(--pw-err-txt) !important; background: rgba(var(--pw-err), .1) !important; border-color: rgba(var(--pw-err), .4) !important; }
html[data-pw] .tal-menu__item--danger { color: var(--pw-err-txt) !important; }
html[data-pw] .tal-alert--error, html[data-pw] .alerta--bad, html[data-pw] .pt-error, html[data-pw] .tal-error {
  color: var(--pw-err-txt) !important; background: rgba(var(--pw-err), .1) !important; border-color: rgba(var(--pw-err), .45) !important;
}
/* el triángulo solo donde no hay ya un icono (taller.js pone su svg en .tal-alert--error); sin :has no se añade nada */
html[data-pw] .tal-alert--error:not(:has(svg))::before, html[data-pw] .pt-error:not(:has(svg))::before, html[data-pw] .tal-error:not(:has(svg))::before {
  content: '⚠'; display: inline-block; margin-right: 6px; font-weight: 800;
}

/* ---------------------------------------------------------------- A · Acento rojo: el vidrio se queda como hoy; el rojo, en lo que se toca y en lo que se lee primero */
html[data-pw='A'] .tal-srv__num { color: var(--pw-txt) !important; }

/* ---------------------------------------------------------------- B · Cristal Power Wave: el vidrio se tiñe de rojo de arriba hacia abajo y la cabecera es roja */
html[data-pw='B'] .tal-wrap .tal-card, html[data-pw='B'] .tal-wrap .glass-soft, html[data-pw='B'] .tal-wrap > .glass,
html[data-pw='B'] .pt-tabs, html[data-pw='B'] .ptx-eq, html[data-pw='B'] .ptx-avisos, html[data-pw='B'] .tt, html[data-pw='B'] .ih {
  background-image: linear-gradient(180deg, var(--pw-b1), var(--pw-b2) 48%, var(--pw-b3)) !important;
  border-color: var(--pw-linea2) !important;
}
html[data-pw='B'] .ptx-hero { background: radial-gradient(120% 140% at 100% 0%, rgba(255, 138, 141, .45), rgba(255, 138, 141, 0) 55%), linear-gradient(135deg, #7f0d12 0%, #c8191f 52%, #ec3237 100%) !important; border-color: transparent !important; box-shadow: none !important; }
html[data-pw='B'] .mcab__tile { background: linear-gradient(135deg, #ec3237, #c8191f) !important; color: #fff !important; border-color: transparent !important; }
html[data-pw='B'] .tal-srv__num { color: var(--pw-txt) !important; }

/* ---------------------------------------------------------------- C · La onda de Power Wave: vidrio neutro con una onda de luz roja arriba de cada tarjeta */
html[data-pw='C'] .tal-wrap .tal-card, html[data-pw='C'] .tal-wrap .glass-soft, html[data-pw='C'] .tal-wrap > .glass,
html[data-pw='C'] .pt-tabs, html[data-pw='C'] .ptx-eq, html[data-pw='C'] .ptx-avisos, html[data-pw='C'] .tt, html[data-pw='C'] .ih, html[data-pw='C'] .ptx-hero {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='8' viewBox='0 0 240 8'%3E%3Cpath d='M0 4 C 20 0, 40 0, 60 4 S 100 8, 120 4 S 160 0, 180 4 S 220 8, 240 4' fill='none' stroke='%23ff5a5f' stroke-width='2'/%3E%3C/svg%3E"),
    linear-gradient(180deg, rgba(var(--pw), .10), rgba(var(--pw), 0) 28%) !important;
  background-size: 240px 8px, 100% 100% !important; background-repeat: repeat-x, no-repeat !important; background-position: 0 0, 0 0 !important;
  border-color: var(--pw-linea) !important;
}
html[data-pw='C'] .mcab__tile { background: transparent !important; color: var(--pw-txt) !important; outline: 1.5px solid rgba(var(--pw), .75); outline-offset: 2px; }
html[data-pw='C'] .tal-chip--on, html[data-pw='C'] .pt-tab.is-on, html[data-pw='C'] .pt-chip.is-on { outline: 1.5px solid rgba(var(--pw), .8); outline-offset: 2px; }
html[data-pw='C'] .tal-srv__num { color: var(--pw-txt) !important; }
