/* ============================================================ DANGOFE OS · PORTAL DEL TÉCNICO DEL TALLER: «CAJA ROJA» (prefijo pid-) · v1.0.1 · 2026-11-02 · chat de Diseño · CSS Karla: «hagamos lo mismo con el portal técnico del taller, solo del taller». De las mismas cinco del Taller (1 Cristal claro · 2 Vidrio ahumado · 3 Caja roja · 4 Esmerilado · 5 Borde prisma) dijo «me gusta para el taller caja roja» → 3, igual que el Taller (taller-caja-roja.css): Mendoza ve sus dos pantallas con la misma cara. · En vidrio rojo (#EC3237 al 82 %) con letra blanca: el nombre del portal y su línea, «Ver cómo funciona», la barra de pestañas (la de ahora en blanco con letra roja) y los botones grandes (Recibir equipo, Pedir piezas), con su ícono en un cuadrito blanco. · En vidrio blanco (58 %, un brillo arriba): Mis avisos, el saludo con la comisión, «Sigue para reparar», cada equipo, «Tu día». Lo de adentro (los tipos de aviso, cada aviso, las cifras, los mensajes) en una capa blanca; cada aviso nuevo con su raya roja. · La comisión, los tickets y «N avisos nuevos» en rojo. · «Noche azul»: el vidrio blanco pasa a azul noche y el rojo a uno más hondo. v1.0.1 (orden de Karla, medido por Dangofe): en Noche azul, para que se lea con foto clara: vidrio al 86 %, lo de adentro en azul noche, el rojo de los tickets, la capacidad y «Sigue para reparar» más claros y la pestaña de ahora en rojo hondo. Se queda: todo en su sitio, los colores de cada estado, sin sombras (el brillo es un degradado), nada se mueve. SOLO el técnico del Taller: va con html[data-pw], que taller-rojo.js pone únicamente cuando tecnico.taller === true (Mendoza). Gerald y los técnicos de la calle NUNCA lo ven. Solo .pt-wrap.ptx y su cabecera (.mcab[data-mcab-modulo='portal_tecnico']). Va DESPUÉS de los CSS del portal y de taller-rojo.css. la apaga (la misma llave que la del Taller). ============================================================ */ /* ---------- los valores (claro) ---------- */ html[data-pw]:not([data-tid='no']) .pt-wrap.ptx, html[data-pw]:not([data-tid='no']) .mcab[data-mcab-modulo='portal_tecnico'] { --pid-rojo: #ec3237; --pid-rojo-txt: #c8191f; --pid-txt: #0b1020; --pid-txt2: #3d4458; --pid-bg: rgba(255, 255, 255, .58); --pid-brillo: linear-gradient(180deg, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0) 50%); --pid-bd: rgba(255, 255, 255, .85); --pid-filtro: blur(20px) saturate(1.6); --pid-dentro: rgba(255, 255, 255, .55); --pid-dentro-bd: rgba(11, 16, 32, .08); --pid-caja: rgba(236, 50, 55, .82); --pid-caja-bd: rgba(255, 140, 143, .9); --pid-caja-filtro: blur(18px) saturate(1.5); --pid-caja-brillo: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0) 55%); } /* ---------- Noche azul ---------- */ html[data-pw]:not([data-tid='no'])[data-theme='dark'] .pt-wrap.ptx, html[data-pw]:not([data-tid='no'])[data-theme='dark'] .mcab[data-mcab-modulo='portal_tecnico'] { --pid-rojo-txt: #ff8f93; --pid-txt: #eef1ff; --pid-txt2: #b6bfdf; --pid-bg: rgba(10, 18, 46, .86); --pid-brillo: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, 0) 50%); --pid-bd: rgba(255, 255, 255, .14); --pid-dentro: rgba(14, 24, 66, .58); --pid-dentro-bd: rgba(255, 255, 255, .12); --pid-caja: rgba(200, 25, 31, .72); --pid-caja-bd: rgba(255, 120, 124, .55); } /* ---------- las tarjetas: vidrio blanco con su brillo ---------- */ html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-avisos, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-hero, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .tt, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-eq, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .pm-faro__cuerpo, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-kpi { background-color: var(--pid-bg) !important; background-image: var(--pid-brillo) !important; border: 1px solid var(--pid-bd) !important; -webkit-backdrop-filter: var(--pid-filtro) !important; backdrop-filter: var(--pid-filtro) !important; box-shadow: none !important; color: var(--pid-txt) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-avisos, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-hero, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .tt, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-eq { border-radius: 22px !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-kpi { border-radius: 16px !important; } /* ---------- la caja roja: el nombre, «Ver cómo funciona», las pestañas y los botones grandes ---------- */ html[data-pw]:not([data-tid='no']) .mcab[data-mcab-modulo='portal_tecnico'] .mcab__t { padding: 10px 16px; border-radius: 18px; background: var(--pid-caja); border: 1px solid var(--pid-caja-bd); -webkit-backdrop-filter: var(--pid-caja-filtro); backdrop-filter: var(--pid-caja-filtro); } html[data-pw]:not([data-tid='no']) .mcab[data-mcab-modulo='portal_tecnico'] .mcab__nom { color: #fff; } html[data-pw]:not([data-tid='no']) .mcab[data-mcab-modulo='portal_tecnico'] .mcab__linea { color: rgba(255, 255, 255, .9); } html[data-pw]:not([data-tid='no']) .mcab[data-mcab-modulo='portal_tecnico'] .mcab__tile { background: #fff !important; color: var(--pid-rojo) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-acc, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-ayuda .rec-btn, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .pt-tabs { background-color: var(--pid-caja) !important; background-image: var(--pid-caja-brillo) !important; border: 1px solid var(--pid-caja-bd) !important; -webkit-backdrop-filter: var(--pid-caja-filtro) !important; backdrop-filter: var(--pid-caja-filtro) !important; box-shadow: none !important; color: #fff !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-acc { border-radius: 16px !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-acc *, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-ayuda .rec-btn * { color: #fff !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-acc__ic { background: rgba(255, 255, 255, .95) !important; color: var(--pid-rojo) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-acc__ic * { color: var(--pid-rojo) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .pt-tab:not(.is-on) { background: transparent !important; border-color: transparent !important; color: #fff !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .pt-tab:not(.is-on) * { color: #fff !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .pt-tab.is-on { background: #fff !important; background-image: none !important; border-color: #fff !important; color: var(--pid-rojo) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .pt-tab.is-on * { color: var(--pid-rojo) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .av-gran { background: var(--pid-caja) !important; background-image: none !important; border: 1px solid var(--pid-caja-bd) !important; color: #fff !important; } /* ---------- lo de adentro: una capa blanca ---------- */ html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .av-tipo, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .av-fila, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-money__main, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-money__mini, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .tt-c__b, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-link, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .pho-btn, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-eq__diag { background-color: var(--pid-dentro) !important; background-image: none !important; border-color: var(--pid-dentro-bd) !important; box-shadow: none !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .av-fila.nuevo { border-left: 3px solid var(--pid-rojo) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-eq__num, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-money__val { color: var(--pid-rojo-txt) !important; } html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-hola, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .av-cab__t b, html[data-pw]:not([data-tid='no']) .pt-wrap.ptx .ptx-eq__equipo { color: var(--pid-txt) !important; } /* v1.0.1 · Noche azul: lo rojo que quedaba oscuro sobre el vidrio, y la pestaña de ahora */ html[data-pw]:not([data-tid='no'])[data-theme='dark'] .pt-wrap.ptx .pm-faro__rot { color: var(--pid-rojo-txt) !important; } html[data-pw]:not([data-tid='no'])[data-theme='dark'] .pt-wrap.ptx .ptx-eq__cap { color: #ffc2c4 !important; } html[data-pw]:not([data-tid='no'])[data-theme='dark'] .pt-wrap.ptx .pt-tab.is-on, html[data-pw]:not([data-tid='no'])[data-theme='dark'] .pt-wrap.ptx .pt-tab.is-on * { color: #c8191f !important; }