/* ═══════════════════════════════════════════════════════════════════════════════════════ WAR ROOM — pupitrul (redesign 18-Sep-2026, Plan A2/A1b/A3). Se incarca DUPA style.css si NUMAI din war.html. Directia, motivele si maparea celor cinci grupe: docs/superpowers/specs/2026-09-18-war-room-design-directie.md (repo-ul „Claude Code Folder 1"). Aici e doar mecanica. REGULI CARE AU COSTAT DEJA (vezi „Gotchas" din design-audit): · Tot ce e nou are prefixul `wr-`: foaia comuna nu are scope de modul, deci fiecare nume e o revendicare globala. Verificat cu grep pe style.css inainte de scriere. · `[hidden]` e batut de orice `display:` al autorului. Fiecare element pe care JS il ascunde (`.wr-panza`) are aici perechea `[hidden]{display:none}` scrisa imediat dupa el. · `body.war button` (0,1,2) si `body.war button:hover` (0,2,2) bat orice clasa simpla, deci butoanele de aici se redefinesc cu `body.war .wr-x` si `body.war .wr-x:hover`. · Animatiile de intrare pornesc doar dintr-o stare deja vizibila: `animation-fill-mode: backwards`, deci un CSS care nu se aplica lasa elementul la vedere, nu invizibil. · Pragul mobil (900px) e aritmetica: sub el nav-ul iese din grila (248px), deci continutul castiga 248px. Vezi nota de la @media si masuratoarea din raportul de verificare. ═══════════════════════════════════════════════════════════════════════════════════════ */ body.war { --wr-nav-l: 248px; --wr-ease: cubic-bezier(.16, 1, .3, 1); /* iese repede, aterizeaza lin */ --wr-glow: rgba(240, 78, 35, .16); } /* Familiile: `--c` e culoarea pe display. Un singur mecanism pentru pictograme, blocuri de grafic, LED-uri si margini: `.wr-f-` seteaza `--c`, restul citesc `var(--c)`. */ .wr-f-ink { --c: var(--dispink); } .wr-f-ink0 { --c: var(--disprule); } .wr-f-ink3 { --c: var(--ink3); } /* al 3-lea neutru — statusuri istorice/arhivate, nu identitate/severitate */ .wr-f-or { --c: var(--ord); } .wr-f-cy { --c: var(--cyd); } .wr-f-bl { --c: var(--bld); } .wr-f-ye { --c: var(--yed); } .wr-f-mg { --c: var(--mgd); } .wr-f-ro { --c: var(--rod); } /* rosul Atragerii (lot17): #EF4444, 4,9:1 pe --disp2 */ .wr-f-gn { --c: var(--gnd); } .wr-f-rd { --c: var(--rdd); } /* ── pictograma: aceeasi grila de 12x12 pe 24, aceeasi lumina ca pe site ─────────────── */ .wr-ic { width: 18px; height: 18px; flex: none; color: var(--c, var(--dispink)); shape-rendering: crispEdges; filter: drop-shadow(0 0 5px color-mix(in srgb, var(--c, #fff) 45%, transparent)); } .wr-ic--mare { width: 44px; height: 44px; } /* seria BM—xx.x — eticheta mono gravata a site-ului */ .wr-serie { margin: 0; font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: var(--ink3); line-height: 1.3; white-space: nowrap; } .wr-serie b { font-weight: 500; color: var(--ord); } .wr-serie i { font-style: normal; color: var(--dispink); } .wr-grup .wr-serie i { color: var(--c); } .wr-g-acasa { --c: var(--ord); } .wr-g-vanzari { --c: var(--gnd); } .wr-g-trafic { --c: var(--cyd); } .wr-g-motor { --c: var(--bld); } .wr-g-continut { --c: var(--mgd); } /* ═══════ SCHELETUL: nav lateral + coloana ═══════ */ body.war .wr-app { display: grid; grid-template-columns: var(--wr-nav-l) minmax(0, 1fr); min-height: 100vh; } .wr-nav { position: sticky; top: 0; height: 100vh; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: var(--p6); padding: var(--p6) var(--p4) var(--p4); background: var(--disp); border-right: 1px solid var(--disprule); box-shadow: inset -1px 0 0 rgba(255, 255, 255, .03); scrollbar-width: thin; scrollbar-color: var(--disprule) transparent; } .wr-main { min-width: 0; } body.war .wr-main .wrap { padding-top: var(--p6); padding-bottom: 72px; } body.war .wr-main .wrap::after { content: none; } /* marca din nav — butonul care duce Acasa */ body.war .wr-marca { height: auto; padding: var(--p1) var(--p2) var(--p1) 0; gap: var(--p3); justify-content: flex-start; background: none; border: 0; box-shadow: none; color: var(--ink); text-align: left; border-radius: var(--r0); } body.war .wr-marca:hover, body.war .wr-marca:active { background: none; border: 0; } .wr-marca-glifa { width: 46px; height: auto; flex: none; color: var(--or); } .wr-marca-text { display: flex; flex-direction: column; gap: 5px; } .wr-marca-text b { font-family: var(--sans); font-weight: 600; font-size: 21px; letter-spacing: -.035em; line-height: 1; } .wr-marca-text i { font-family: var(--mono); font-style: normal; font-weight: 500; font-size: 10px; letter-spacing: .34em; color: var(--ord); } .wr-tabs { display: flex; flex-direction: column; gap: var(--p6); flex: 1 1 auto; } .wr-grup { display: flex; flex-direction: column; gap: var(--p1); } .wr-grup > .wr-serie { padding: 0 var(--p2) var(--p2); } .wr-grup > .wr-serie { border-bottom: 1px solid var(--disprule); margin-bottom: var(--p1); } /* butonul de fila: bate `body.war .tab-buton(.activ)` din style.css (0,3,1 / 0,2,1) */ body.war .wr-tabs .tab-buton { position: relative; width: 100%; height: 40px; justify-content: flex-start; gap: var(--p3); padding: 0 var(--p3); background: transparent; border: 1px solid transparent; box-shadow: none; color: var(--dispink2); font-size: 14.5px; font-weight: 600; border-radius: var(--r0); } body.war .wr-tabs .tab-buton:hover { background: var(--gr2); border-color: var(--disprule); color: var(--dispink); } body.war .wr-tabs .tab-buton.activ { background: var(--gr2); border-color: var(--disprule); color: var(--dispink); box-shadow: var(--mat-adancit); } /* lampa: pe muchia din stanga (nav vertical), nu sub buton ca in tab-urile vechi */ body.war .wr-tabs .tab-buton.activ::after { left: -1px; right: auto; top: 8px; bottom: 8px; width: 3px; height: auto; border-radius: 0 3px 3px 0; background: var(--c, var(--or)); box-shadow: 0 0 12px -1px var(--c, var(--or)); } .wr-g-acasa .tab-buton.activ { --c: var(--ord); } .wr-g-vanzari .tab-buton.activ { --c: var(--gnd); } .wr-g-trafic .tab-buton.activ { --c: var(--cyd); } .wr-g-motor .tab-buton.activ { --c: var(--bld); } .wr-g-continut .tab-buton.activ { --c: var(--mgd); } .wr-nav-jos { margin: 0; padding-top: var(--p3); border-top: 1px solid var(--disprule); } /* bara de sus a coloanei */ .wr-sus { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: var(--p4); padding: var(--p3) var(--p8); background: color-mix(in srgb, var(--gr) 92%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid var(--rule); } .wr-sus-titlu { display: flex; flex-direction: column; gap: var(--p1); flex: 1 1 auto; min-width: 0; } .wr-sus h1 { margin: 0; font-size: 22px; letter-spacing: -.03em; color: var(--ink); } /* Selectorul global de brand (T291): `.punte-form` (Canale/Biblioteca) e deja gandit pentru exact doua selectoare legate -- aici doar se scoate marginea de subsol, care n-are rost intr-un antet ingust, si se limiteaza latimea, ca sa nu impinga titlul filei pe telefon. */ .wr-sus .punte-form { margin: 0; flex: 0 0 auto; gap: var(--p2); } .wr-sus .punte-form select { flex: 0 1 150px; } /* T294: link catre App, in antetul War Room -- `.discret`/`.mic` din style.css sunt scrise pentru `button`, nu se aplica pe `` (verificat: niciun selector `.discret` fara prefixul `button` in style.css). Regula de mai jos oglindeste exact `button.discret.mic` + `button.discret`, ca linkul sa arate identic cu un buton mic discret, desi e navigare reala (href), nu JS. */ .wr-inapoi-app { display: inline-flex; align-items: center; height: var(--hs); padding: 0 10px; border-radius: var(--r0); font-family: var(--sans); font-size: 12.5px; font-weight: 600; color: var(--chink3); text-decoration: none; white-space: nowrap; flex: 0 0 auto; } .wr-inapoi-app:hover { color: var(--chink); background: var(--ch3); } @media (max-width: 720px) { .wr-sus .punte-form select { flex: 1 1 120px; } } body.war .wr-burger { display: none; width: var(--h); padding: 0; background: var(--gr2); border-color: var(--rule); } body.war .wr-burger:hover { background: var(--gr3); border-color: var(--ink3); } .wr-panza { position: fixed; inset: 0; z-index: 40; background: rgba(0, 0, 0, .66); } .wr-panza[hidden] { display: none; } /* ═══════ SCENA (ecranul de filmat) ═══════ */ .wr-scena { position: relative; isolation: isolate; overflow: hidden; container: wr-scena / inline-size; /* titlul se dimensioneaza pe caseta, nu pe viewport (cqw) */ min-height: clamp(520px, 82vh, 980px); display: flex; flex-direction: column; justify-content: space-between; gap: var(--p6); padding: var(--p6) var(--p8); background: radial-gradient(60% 55% at 50% 42%, var(--wr-glow), transparent 70%), radial-gradient(rgba(237, 238, 234, .085) 1px, transparent 1.3px) 0 0 / 18px 18px, linear-gradient(180deg, var(--disp), var(--disp2)); border: 1px solid var(--disprule); border-radius: var(--r2); box-shadow: var(--mat-adancit); } /* colturi de „raft": patru tăieturi pe muchii, cum are un display scobit */ .wr-scena::before, .wr-scena::after { content: ""; position: absolute; z-index: -1; width: 28px; height: 28px; pointer-events: none; border: 2px solid var(--or); opacity: .8; } .wr-scena::before { top: 14px; left: 14px; border-right: 0; border-bottom: 0; } .wr-scena::after { right: 14px; bottom: 14px; border-left: 0; border-top: 0; } .wr-scena-sus, .wr-scena-jos { display: flex; align-items: center; justify-content: space-between; gap: var(--p4); flex-wrap: wrap; } .wr-scena-jos { align-items: flex-end; } .wr-leduri { display: flex; gap: var(--p4); flex-wrap: wrap; justify-content: flex-end; } .wr-led { display: inline-flex; align-items: center; gap: var(--p2); font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--dispink2); } .wr-led i { width: 10px; height: 10px; background: var(--c); box-shadow: 0 0 10px var(--c); border-radius: 1px; } .wr-lockup { display: flex; flex-direction: column; align-items: center; text-align: center; gap: clamp(10px, 2.4vh, 26px); margin: auto 0; color: var(--ink); } .wr-glifa { width: clamp(150px, 25vw, 360px); height: auto; color: var(--or); filter: drop-shadow(0 0 26px rgba(240, 78, 35, .5)); } /* Cuvantul: fiecare litera in propriul `inline-block` (capcana flex per-litera din animatii-panou-2026-08-24: un flex-container cu litere-copii pierde spatiile si kerning-ul). */ .wr-nume { font-family: var(--sans); font-weight: 500; line-height: .9; letter-spacing: .005em; font-size: clamp(24px, calc((100vw - 330px) * .058), 96px); white-space: nowrap; color: var(--ink); font-size: clamp(20px, 5.6cqw, 130px); /* „BOOSTED MODE” ~5,7em: 5,6cqw = ~32% din latimea utila */ } .wr-l { display: inline-block; } .wr-mod { display: flex; flex-direction: column; align-items: center; gap: .16em; } .wr-war { font-family: var(--sans); font-weight: 900; line-height: .84; letter-spacing: -.045em; font-size: clamp(48px, calc((100vw - 330px) * .148), 300px); white-space: nowrap; color: var(--ink); /* „WAR ROOM” la weight 900 = ~5,8em latime. 15,4cqw => ~89% din spatiul util al casetei, oricare ar fi viewport-ul, sidebar-ul sau modul scena (cu vw incapea doar cand caseta era cat viewport-ul minus sidebar) */ font-size: clamp(30px, 15.4cqw, 400px); } .wr-lampa { display: block; width: 100%; height: clamp(6px, .9vw, 14px); border-radius: 2px; background: var(--or); box-shadow: 0 0 16px 1px rgba(240, 78, 35, .75); transform-origin: left center; } .wr-ceas-bloc { display: flex; flex-direction: column; gap: var(--p1); } .wr-ceas { font-family: var(--mono); font-weight: 600; font-size: clamp(34px, 5vw, 64px); line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--ink); } .wr-data { font-family: var(--mono); font-size: 13px; letter-spacing: .08em; color: var(--dispink2); text-transform: capitalize; } body.war .wr-btn-scena { height: var(--h); gap: var(--p2); padding: 0 var(--p4); background: transparent; border-color: var(--disprule); color: var(--dispink2); font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; } body.war .wr-btn-scena:hover { background: var(--gr2); border-color: var(--ink3); color: var(--dispink); } body.war .wr-btn-scena[aria-pressed="true"] { border-color: var(--or); color: var(--dispink); } /* Tablou/Hunter (bara de vederi Leads Machine) — cele doua actiuni-cheie, diferentiate de "Lead-uri" (vedere de lista/observare) prin inaltime + greutate, nu culoare noua. 40px = aceeasi treapta ca .tab-buton din nav, nu o valoare inventata (T276 ierarhie #1/disciplina #3b). */ body.war .wr-vedere-btn--mare { height: 40px; font-weight: 600; } /* Modul scena (tasta F / butonul): nav-ul si bara de sus dispar, scena umple ecranul. */ body.wr-scena-mod .wr-nav, body.wr-scena-mod .wr-sus, body.wr-scena-mod .wr-panza { display: none; } body.wr-scena-mod.war .wr-app { grid-template-columns: minmax(0, 1fr); } body.wr-scena-mod .wr-scena { min-height: 100vh; border-radius: 0; margin: calc(-1 * var(--p6)) calc(-1 * var(--p8)) 0; border-width: 0 0 1px; } body.wr-scena-mod .wr-nume { font-size: clamp(30px, 5.6cqw, 130px); } body.wr-scena-mod .wr-war { font-size: clamp(30px, 15.4cqw, 400px); } body.wr-scena-mod .wr-glifa { width: clamp(150px, 30vh, 420px); } /* ═══════ INTRAREA: sobra, o singura data pe fila ═══════ Fiecare regula porneste dintr-o stare deja vizibila (`backwards`): daca animatia nu ruleaza, elementul sta la locul lui. In tabul ascuns animatiile nu ruleaza; la afisare (display none -> block) pornesc de la zero, deci intrarea se reface cand revii Acasa. */ @keyframes wr-glifa-in { from { clip-path: inset(0 100% 0 0); opacity: 0; } to { clip-path: inset(0 0 0 0); opacity: 1; } } @keyframes wr-litera-in { from { transform: translateY(.34em); opacity: 0; } to { transform: none; opacity: 1; } } @keyframes wr-lampa-in { from { transform: scaleX(0); } to { transform: scaleX(1); } } @keyframes wr-fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes wr-sus-in { from { transform: translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } } @keyframes wr-bara-in { from { transform: scaleX(0); } to { transform: scaleX(1); } } @keyframes wr-col-in { from { transform: scaleY(0); } to { transform: scaleY(1); } } @keyframes wr-puls { 0%, 100% { opacity: 1; } 50% { opacity: .45; } } @keyframes wr-salt { 0% { transform: translateY(0); } 50% { transform: translateY(-4px); } 100% { transform: translateY(0); } } .wr-glifa { animation: wr-glifa-in 900ms var(--wr-ease) 80ms backwards; } .wr-l { animation: wr-litera-in 700ms var(--wr-ease) calc(380ms + var(--i, 0) * 70ms) backwards; } .wr-w { display: inline-block; white-space: nowrap; } .wr-lampa { animation: wr-lampa-in 700ms var(--wr-ease) 1000ms backwards; } .wr-scena-sus, .wr-scena-jos { animation: wr-fade-in 700ms linear 1300ms backwards; } .wr-led i { animation: wr-puls 2.6s ease-in-out infinite; } .wr-kpi { animation: wr-sus-in 520ms var(--wr-ease) backwards; } .wr-kpi:nth-child(2) { animation-delay: 50ms; } .wr-kpi:nth-child(3) { animation-delay: 100ms; } .wr-kpi:nth-child(4) { animation-delay: 150ms; } .wr-kpi:nth-child(5) { animation-delay: 200ms; } .wr-kpi:nth-child(6) { animation-delay: 250ms; } .wr-bara i { transform-origin: left center; animation: wr-bara-in 800ms var(--wr-ease) calc(200ms + var(--i, 0) * 90ms) backwards; } .wr-col-b { transform-origin: bottom; animation: wr-col-in 700ms var(--wr-ease) 150ms backwards; } .wr-pers-card:hover .wr-av { animation: wr-salt 480ms steps(2, end); } @media (prefers-reduced-motion: reduce) { .wr-app *, .wr-app *::before, .wr-app *::after { animation: none !important; transition: none !important; } } /* ═══════ ANTETUL FILEI (toate filele in afara de Acasa) ═══════ Aceeasi mana ca scena de pe Acasa — pictograma, nume, lampa — dar la o treime din marime, fara panou. Culoarea vine din `.wr-f-` pus de WR.laTab. Intrarea: pictograma apare pe randuri (steps(12) = cele 12 randuri ale grilei), literele urca una cate una, lampa se intinde. Dupa intrare, fiecare pictograma are o miscare proprie, blanda, in bucla. */ .wr-titlu { display: flex; flex-direction: column; align-items: center; gap: var(--p3); text-align: center; margin: 0 0 var(--p2); padding: var(--p4) 0 var(--p2); background: radial-gradient(38% 80% at 50% 42%, color-mix(in srgb, var(--c, var(--or)) 13%, transparent), transparent 72%); } .wr-titlu[hidden] { display: none; } .wr-ti-ic { width: 64px; height: 64px; overflow: visible; filter: drop-shadow(0 0 14px color-mix(in srgb, var(--c) 55%, transparent)); animation: wr-ti-pix 620ms steps(12, end) 60ms backwards, wr-ti-idle 3.4s ease-in-out 1.1s infinite; transform-origin: 50% 60%; } .wr-ti-txt { display: flex; flex-direction: column; align-items: stretch; gap: .22em; max-width: 100%; font-size: clamp(26px, 7.4vw, 60px); } .wr-ti-nume { font-family: var(--sans); font-weight: 800; line-height: .95; letter-spacing: -.03em; text-transform: uppercase; color: var(--ink); text-wrap: balance; } .wr-ti-l { display: inline-block; animation: wr-litera-in 560ms var(--wr-ease) calc(200ms + var(--i, 0) * 38ms) backwards; } .wr-ti-lampa { display: block; height: clamp(4px, .5vw, 7px); border-radius: 2px; background: var(--c); box-shadow: 0 0 14px 1px color-mix(in srgb, var(--c) 70%, transparent); transform-origin: left center; animation: wr-lampa-in 620ms var(--wr-ease) 640ms backwards; } @keyframes wr-ti-pix { from { clip-path: inset(0 0 100% 0); } to { clip-path: inset(-20% -20% -20% -20%); } } /* miscarile pictogramelor: transform/filtru, nimic care sa mute pagina */ @keyframes wr-ti-tinta { 0%, 70%, 100% { transform: scale(1); } 82% { transform: scale(1.12); } } @keyframes wr-ti-clapa { 0%, 62%, 100% { transform: rotate(0); } 72% { transform: rotate(-9deg); } 82% { transform: rotate(0); } } @keyframes wr-ti-glob { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(.82); } } @keyframes wr-ti-tic { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(7deg); } } @keyframes wr-ti-mana { 0%, 60%, 100% { transform: rotate(0); } 70% { transform: rotate(14deg); } 80% { transform: rotate(-10deg); } 90% { transform: rotate(8deg); } } @keyframes wr-ti-scris { 0%, 100% { transform: translate(0, 0); } 50% { transform: translate(3px, -2px); } } @keyframes wr-ti-baza { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.93); } } @keyframes wr-ti-creier { 0%, 100% { filter: drop-shadow(0 0 8px color-mix(in srgb, var(--c) 35%, transparent)); } 50% { filter: drop-shadow(0 0 24px color-mix(in srgb, var(--c) 90%, transparent)); } } @keyframes wr-ti-plutire { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } } .wr-titlu[data-ic="p-tinta"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-tinta; animation-timing-function: steps(12, end), ease-in-out; } .wr-titlu[data-ic="p-clapeta"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-clapa; transform-origin: 8% 92%; } .wr-titlu[data-ic="p-glob"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-glob; } .wr-titlu[data-ic="p-ceas"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-tic; animation-timing-function: steps(12, end), steps(2, end); animation-duration: 620ms, 1s; } .wr-titlu[data-ic="p-mana"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-mana; transform-origin: 50% 95%; } .wr-titlu[data-ic="p-scris"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-scris; animation-timing-function: steps(12, end), steps(2, end); } .wr-titlu[data-ic="p-baza"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-baza; transform-origin: 50% 100%; } .wr-titlu[data-ic="p-creier"] .wr-ti-ic { animation-name: wr-ti-pix, wr-ti-creier; } @media (max-width: 600px) { .wr-ti-ic { width: 48px; height: 48px; } .wr-titlu { gap: var(--p2); padding-top: var(--p2); } } /* ═══════ Zona de sub scena ═══════ */ .wr-cap { display: flex; align-items: baseline; justify-content: space-between; gap: var(--p4); margin: var(--p8) 0 var(--p3); } .wr-cap .punte-nota { margin: 0; } .wr-kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--p3); } .wr-kpi { display: flex; flex-direction: column; gap: var(--p1); min-width: 0; padding: var(--p4); background: linear-gradient(180deg, var(--disp), var(--disp2)); box-shadow: var(--mat-adancit), inset 0 2px 0 var(--c); border: 1px solid var(--disprule); border-radius: var(--r0); } .wr-kpi-cap { display: flex; align-items: center; justify-content: space-between; gap: var(--p2); margin-bottom: var(--p2); } .wr-kpi-val { font-family: var(--mono); font-weight: 600; font-size: clamp(30px, 3.2vw, 46px); line-height: 1; letter-spacing: -.03em; font-variant-numeric: tabular-nums; color: var(--c); max-width: 100%; overflow-wrap: anywhere; } .wr-kpi-et { font-family: var(--mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--dispink); margin-top: var(--p1); } .wr-kpi-sub { font-size: 12px; color: var(--dispink2); overflow-wrap: anywhere; } .wr-diag { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--p4); margin-top: var(--p4); } .wr-diag > .wr-panou { grid-column: span 4; } .wr-diag > .wr-timp, .wr-diag > .wr-pers { grid-column: span 8; } .wr-panou { min-width: 0; padding: var(--p4) var(--p4) var(--p6); background: linear-gradient(180deg, var(--disp), var(--disp2)); box-shadow: var(--mat-adancit); border: 1px solid var(--disprule); border-radius: var(--r); } .wr-panou-cap { display: flex; align-items: center; gap: var(--p2); margin-bottom: var(--p4); padding-bottom: var(--p3); border-bottom: 1px solid var(--disprule); } body.war .wr-panou-cap h2 { margin: 0; flex: 1 1 auto; min-width: 0; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--dispink); text-shadow: none; } .wr-nota { margin: var(--p3) 0 0; font-size: 12px; color: var(--dispink2); } .wr-nota code { font-family: var(--mono); color: var(--dispink); } .wr-indisponibil { margin: 0; padding: var(--p4) 0; font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-kpis > .wr-indisponibil { grid-column: 1 / -1; } /* ── grafic cu blocuri de pixeli ── */ .wr-legenda { display: flex; flex-wrap: wrap; gap: var(--p4); margin-bottom: var(--p3); font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-legenda-nota { margin-left: auto; } .wr-punct { display: inline-block; width: 10px; height: 10px; margin-right: 7px; background: var(--c); box-shadow: 0 0 8px -1px var(--c); } .wr-chart { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--p2); } .wr-axa { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-end; height: var(--alt); font-family: var(--mono); font-size: 10px; color: var(--dispink2); } .wr-cols { display: grid; grid-template-columns: repeat(var(--nc), minmax(0, 1fr)); gap: var(--p1); height: var(--alt); align-items: end; border-bottom: 1px solid var(--ink3); background: repeating-linear-gradient(to top, transparent 0 calc(var(--alt) / 4 - 1px), rgba(237, 238, 234, .07) calc(var(--alt) / 4 - 1px) calc(var(--alt) / 4)); } .wr-col { display: flex; align-items: flex-end; height: 100%; min-width: 0; } .wr-col-b { display: flex; flex-direction: column-reverse; width: 100%; } .wr-bloc { display: block; height: calc(var(--alt) / var(--max)); background: var(--c); box-shadow: inset 0 0 0 1px var(--disp); } .wr-col:hover .wr-bloc { filter: brightness(1.25); } .wr-x { grid-column: 2; display: grid; grid-template-columns: repeat(var(--nc), minmax(0, 1fr)); gap: var(--p1); margin-top: 6px; font-family: var(--mono); font-size: 10px; color: var(--dispink2); } .wr-x span { white-space: nowrap; } /* Ultima eticheta a axei: in coloana ei ingusta, un text mai lat iese pe dreapta din panou. Se aliniaza la dreapta, deci creste spre stanga, in interiorul graficului. */ .wr-x span:last-child { justify-self: end; } /* ── pâlnia: personajul + bara pe blocuri ── */ .wr-palnie-rand { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: var(--p3); align-items: center; padding: var(--p2) 0; border-bottom: 1px solid var(--rule2); } .wr-palnie-rand:last-of-type { border-bottom: 0; } .wr-ramura { margin-left: var(--p4); padding-left: var(--p3); border-left: 2px dashed var(--c); } .wr-palnie-fata { display: grid; place-items: center; width: 44px; height: 44px; background: var(--disp); border: 1px solid var(--c); border-radius: var(--r0); } .wr-palnie-mij { display: flex; flex-direction: column; gap: var(--p2); min-width: 0; } .wr-palnie-et { font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink); } .wr-palnie-nr { display: flex; flex-direction: column; align-items: flex-end; font-family: var(--mono); } .wr-palnie-nr b { font-size: 22px; font-weight: 600; color: var(--c); line-height: 1; } .wr-palnie-nr small { font-size: 11px; color: var(--dispink2); } .wr-bara { display: block; height: 12px; overflow: hidden; background: repeating-linear-gradient(90deg, var(--disprule) 0 10px, transparent 10px 12px); } .wr-bara i { display: block; height: 100%; width: var(--w); background: repeating-linear-gradient(90deg, var(--c) 0 10px, transparent 10px 12px); } /* ── surse: bare orizontale ── */ .wr-hr { display: grid; grid-template-columns: minmax(64px, 30%) minmax(0, 1fr) auto; gap: var(--p3); align-items: center; padding: var(--p2) 0; } .wr-hr-et { font-family: var(--mono); font-size: 12px; color: var(--dispink); min-width: 0; white-space: normal; overflow-wrap: anywhere; line-height: 1.35; } .wr-hr-val { font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--c); min-width: 2ch; text-align: right; } /* ── inelul motoarelor ── */ #wr-motoare { display: flex; align-items: center; gap: var(--p6); flex-wrap: wrap; } .wr-inel { position: relative; width: 168px; flex: none; } .wr-inel svg { display: block; width: 100%; height: auto; } .wr-inel rect { fill: var(--c); } .wr-inel-mij { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; } .wr-inel-mij b { font-family: var(--mono); font-size: 34px; font-weight: 600; color: var(--dispink); line-height: 1; } .wr-inel-mij small { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--dispink2); } .wr-inel-legenda { list-style: none; margin: 0; padding: 0; flex: 1 1 130px; display: flex; flex-direction: column; gap: 8px; } .wr-inel-legenda li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; gap: var(--p2); align-items: center; font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-inel-legenda .wr-punct { margin: 0; } .wr-inel-legenda b { color: var(--dispink); font-weight: 600; } /* ── personajele ── */ .wr-pers-grila { display: grid; grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)); gap: var(--p3); } .wr-pers-card { display: flex; flex-direction: column; align-items: center; gap: var(--p1); padding: var(--p4) var(--p3) var(--p3); background: var(--disp); border: 1px solid var(--disprule); box-shadow: inset 0 -2px 0 var(--c); border-radius: var(--r0); text-align: center; } .wr-pers-nume { font-family: var(--mono); font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--c); margin-top: var(--p2); } .wr-pers-nr { font-family: var(--mono); font-size: 28px; font-weight: 600; color: var(--dispink); line-height: 1.1; } .wr-pers-desc { font-size: 12px; line-height: 1.35; color: var(--dispink2); } .wr-av { display: block; flex: none; shape-rendering: crispEdges; } /* celula de status din tabelul de lead-uri (pusa de war-acasa.js) */ body.war td.wr-status { white-space: nowrap; } .wr-status .wr-av { display: inline-block; vertical-align: middle; margin-right: var(--p2); } .wr-status-et { vertical-align: middle; font-weight: 600; color: var(--c); } /* ── sistemul ── */ .wr-sist-disc { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--p3); align-items: center; font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-sist-et { text-transform: uppercase; letter-spacing: .08em; } .wr-sist-disc b { color: var(--c); font-weight: 600; } .wr-celule { display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 2px; } .wr-celule i { display: block; height: 14px; background: var(--disprule); } .wr-celule i.on { background: var(--c); } .wr-sist-cifre { display: grid; grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); gap: var(--p3); margin: var(--p4) 0 0; } .wr-sist-cifre div { padding-top: var(--p2); border-top: 1px solid var(--disprule); } .wr-sist-cifre dt { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink2); } .wr-sist-cifre dd { margin: var(--p1) 0 0; font-family: var(--mono); font-size: 20px; font-weight: 600; color: var(--dispink); } .wr-alerte { list-style: none; margin: var(--p4) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--p2); } .wr-alerta { display: flex; gap: var(--p3); align-items: baseline; font-size: 12px; color: var(--dispink2); } .wr-alerta-nivel { flex: none; font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--c); } /* ── Trafic: loc rezervat, gol intentionat ── */ .wr-gol { display: flex; flex-direction: column; align-items: center; gap: var(--p3); text-align: center; padding: 88px var(--p6); background: var(--disp); border: 1px dashed var(--disprule); border-radius: var(--r2); } body.war .wr-gol h2 { margin: 0; font-size: 22px; letter-spacing: -.02em; color: var(--ink); text-transform: none; font-family: var(--sans); } .wr-gol .punte-nota { max-width: 44ch; margin: 0; } /* focus: portocaliul din foaia mare (5,39:1 pe negru) e deja regula pe War Room */ .wr-nav :focus-visible, .wr-scena :focus-visible { outline: 2px solid var(--or); outline-offset: 2px; } /* „Sari la continut": ascuns pana primeste focus de la tastatura */ .wr-salt { position: fixed; z-index: 100; left: var(--p3); top: var(--p3); padding: var(--p2) 14px; border-radius: var(--r0); background: var(--or); color: var(--gr); font-weight: 700; font-size: 13px; text-decoration: none; transform: translateY(-160%); } .wr-salt:focus { transform: none; } .wr-main:focus { outline: none; } /* ═══════ RESPONSIV ═══════ Praguri pe aritmetica, nu pe ochi: · 1280px: coloana pierde nav-ul (248px), deci ramane 1280-248 = 1032px; 6 KPI la ~150px fiecare (padding 16+16, valoarea de 36px pe 5 cifre) nu mai incap → 3 pe rand. · 1100px: 12 coloane cu panouri de 4 (~300px) → grafice ingramadite; trece pe 2 coloane. · 900px: sub acest prag nav-ul devine sertar (fixed), coloana ia toata latimea. · 600px: KPI pe 2 coloane, panourile pe 1. */ @media (max-width: 1280px) { .wr-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 1100px) { .wr-diag { grid-template-columns: repeat(2, minmax(0, 1fr)); } .wr-diag > .wr-panou, .wr-diag > .wr-timp, .wr-diag > .wr-pers { grid-column: span 1; } .wr-diag > .wr-timp, .wr-diag > .wr-pers { grid-column: 1 / -1; } } @media (max-width: 900px) { body.war .wr-app { grid-template-columns: minmax(0, 1fr); } .wr-nav { position: fixed; z-index: 50; left: 0; top: 0; bottom: 0; width: min(86vw, 300px); height: auto; transform: translateX(-100%); visibility: hidden; transition: transform .26s var(--wr-ease), visibility 0s linear .26s; } body.wr-nav-deschis .wr-nav { transform: none; visibility: visible; transition-delay: 0s; } body.war .wr-burger { display: inline-flex; flex: none; } .wr-sus { padding: var(--p3) var(--p4); gap: var(--p3); } .wr-sus h1 { font-size: 19px; } body.war .wr-main .wrap { padding-left: var(--p4); padding-right: var(--p4); } .wr-scena { padding: var(--p4); min-height: clamp(460px, 74vh, 760px); } body.wr-scena-mod .wr-scena { margin: calc(-1 * var(--p6)) calc(-1 * var(--p4)) 0; } .wr-leduri { justify-content: flex-start; gap: var(--p3) var(--p4); } } @media (max-width: 600px) { .wr-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .wr-diag { grid-template-columns: minmax(0, 1fr); } .wr-diag > .wr-panou, .wr-diag > .wr-timp, .wr-diag > .wr-pers { grid-column: 1 / -1; } .wr-cap { flex-wrap: wrap; } .wr-panou { padding: var(--p3) var(--p3) var(--p4); } .wr-nume { font-size: clamp(22px, 8.4cqw, 40px); } /* nume/war raman pe cqw (regulile de baza): 375px cu padding 16+16 lasa 311px => war ~48px */ .wr-pers-grila { grid-template-columns: repeat(2, minmax(0, 1fr)); } #wr-motoare { justify-content: center; } } /* selectul de tinte e latit de cea mai lunga optiune (50 car.) si iese din ecran pe telefon */ body.war .punte-form select { min-width: 0; max-width: 100%; } body.war .pagina-nav { flex-wrap: wrap; } /* ── fila Trafic: cinci carduri, butoane de perioada ── */ /* auto-fit, nu 5 fix: o valoare-text (pornita, eroare) nu incape in a cincea parte a ecranului la 1024–1280px si iesea din caseta. Sub ~840px de zona utila trec pe doua randuri. */ .wr-kpis--5 { grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); } @media (max-width: 900px) { .wr-kpis--5 { grid-template-columns: repeat(2, minmax(0, 1fr)); } } #tab-trafic-site .wr-legenda, #tab-trafic-social .wr-legenda { margin: var(--p3) 0; } /* ── fila Leads Machine (fosta „Lead-uri” + HUNTER) ── Trei vederi in aceeasi fila; fiecare are `display` propriu, deci `[hidden]` cere pereche. */ #tab-leaduri [hidden] { display: none !important; } #tab-leaduri .wr-legenda { margin: var(--p3) 0; } /* Comportament (5-Oct-2026): filtrul de canal sta in aceeasi bara cu 7/30 zile. */ #trafic-comportament { margin-top: var(--p5, 24px); } .wr-comp-canal { display: inline-flex; align-items: center; gap: 6px; } .wr-comp-canal select { font: inherit; padding: 4px 8px; border-radius: 6px; border: 1px solid currentColor; background: transparent; color: inherit; } #tab-leaduri .wr-ld-bara { align-items: center; } #tab-leaduri .wr-ld-bara select { margin-left: auto; flex: 0 1 300px; } #tab-leaduri .wr-kpis { margin-bottom: var(--p4); } .wr-panou--plin { padding-bottom: var(--p4); } #tab-leaduri .wr-panou .punte-form { margin-bottom: var(--p3); } #tab-leaduri .wr-panou .punte-nota { color: var(--dispink2); } #tab-leaduri .wr-panou .punte-nota.rau { color: var(--rd, #ff6b5e); } #tab-leaduri .wr-indisponibil.punte-nota { padding: var(--p3) 0; } /* butonul din interiorul unui mesaj „gol” nu trebuie sa tina inaltimea unui rand intreg */ #tab-leaduri .wr-indisponibil .wr-btn-scena { margin-left: var(--p2); } body.war textarea.wr-lat { flex: 1 1 100%; min-width: 0; } body.war .wr-cum { white-space: pre-wrap; overflow-x: auto; margin: 0 0 var(--p3); font-size: 12px; } #tab-leaduri .wr-fir { align-items: center; margin-bottom: var(--p2); } #tab-leaduri .wr-fir > span { font-family: var(--mono); font-size: 12px; color: var(--dispink); flex: 1 1 140px; min-width: 0; overflow-wrap: anywhere; } /* Sugestiile de fire: handle + motiv pe doua randuri, cele doua butoane impreuna dedesubt. */ #tab-leaduri .wr-sugestii { margin: var(--p4) 0 var(--p3); } #tab-leaduri .wr-sugestie { display: grid; gap: var(--p1); margin-bottom: var(--p4); } #tab-leaduri .wr-sugestie a { font-family: var(--mono); font-size: 12px; color: var(--dispink); overflow-wrap: anywhere; } #tab-leaduri .wr-sugestie > span { min-width: 0; } #tab-leaduri .wr-sugestie-btn { display: flex; gap: var(--p2); margin-top: var(--p1); } /* Badge-ul verdictului de verificare (T298): font mic, ca punte-nota vecina -- nu e o insigna cu fundal, doar text colorat, ca sa nu concureze vizual cu Aprobă/Respinge. */ #tab-leaduri .wr-verificare { font-size: 11px; font-weight: 600; } #tab-leaduri .wr-sugestii[hidden] { display: none; } #tab-leaduri .wr-ld-tabel td.lat, #tab-leaduri .wr-ld-tabel td.num { white-space: nowrap; } #tab-leaduri .wr-sub { display: block; font-family: var(--mono); font-size: 11px; color: var(--dispink2); } #tab-leaduri .wr-bulk { align-items: center; margin: var(--p3) 0; } #tab-leaduri .wr-bulk[hidden] { display: none; } #tab-leaduri .wr-bifa { width: 32px; text-align: center; } #tab-leaduri .wr-ld-tabel td.em { overflow-wrap: anywhere; min-width: 110px; font-family: var(--mono); font-size: 12px; } #tab-leaduri td.wr-act { min-width: 150px; } #tab-leaduri td.wr-act > * { margin: 0 var(--p2) var(--p1) 0; } #tab-leaduri td.wr-act button, #tab-leaduri td.wr-act .buton-link { height: var(--hs); padding: 0 10px; font-size: 12px; } #tab-leaduri td.wr-act .buton-link { background: transparent; color: var(--dispink); border: 1px solid var(--disprule); } #tab-leaduri .wr-porti { display: flex; flex-direction: column; gap: var(--p2); } .wr-poarta { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-poarta b { color: var(--c); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; } .wr-tinta { padding: var(--p3) 0; border-bottom: 1px solid var(--disprule); } .wr-tinta:last-of-type { border-bottom: 0; } .wr-tinta-cap { display: flex; flex-wrap: wrap; gap: var(--p2) var(--p3); align-items: baseline; font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-tinta-cap b { color: var(--dispink); font-size: 13px; } .wr-tinta-sub { font-family: var(--mono); font-size: 11px; color: var(--dispink2); } /* panoul de detaliu al unui om: acelasi „display” negru ca panourile din tablou */ body.war .panou.wr-detaliu { background: linear-gradient(180deg, var(--disp), var(--disp2)); border: 1px solid var(--disprule); color: var(--dispink); max-width: 640px; padding: var(--p6) var(--p4) var(--p6); } .wr-detaliu-cap { display: flex; align-items: center; gap: var(--p3); margin-bottom: var(--p4); padding-right: var(--p8); } .wr-detaliu-cap .panou-titlu { margin: 0; padding: 0; color: var(--dispink); font-family: var(--mono); overflow-wrap: anywhere; } .wr-detaliu-cap .punte-nota { margin: 2px 0 0; } .wr-detaliu-fata { display: grid; place-items: center; flex: none; width: 44px; height: 44px; background: var(--disp); border: 1px solid var(--disprule); border-radius: var(--r0); } body.war .wr-detaliu .panou-inchide { color: var(--dispink2); } body.war .wr-detaliu .panou-inchide:hover { color: var(--dispink); background: var(--gr3); } body.war .wr-detaliu .copy-eticheta { color: var(--dispink2); margin-top: var(--p4); } .wr-detaliu .lat-scroll { margin-bottom: var(--p2); } /* casetele de mesaje din panou (erau doar sub `body.hunter`) */ .wr-mesaj { border: 1px solid var(--disprule); border-radius: var(--r0); padding: var(--p3); margin-bottom: var(--p3); background: var(--gr2); } body.war .wr-mesaj textarea, body.war .wr-mesaj .wr-mesaj-subiect { font-family: var(--sans); font-size: 13px; margin-top: 6px; width: 100%; box-sizing: border-box; background: var(--gr); color: var(--ink); border: 1px solid var(--rule); } body.war .wr-mesaj textarea:disabled, body.war .wr-mesaj .wr-mesaj-subiect:disabled { color: var(--ink3); opacity: 1; } /* subiectul emailului: acelasi tipar ca textarea, dar mai putin inalt -- e un singur rand */ .wr-mesaj-subiect { padding: var(--p2) var(--p4); font-weight: 600; } /* panourile din fila poarta `span N` inline: sub 1100px grila are 2 coloane, deci suprascriem cu !important */ @media (max-width: 1100px) { #tab-leaduri .wr-diag > .wr-panou { grid-column: span 1 !important; } #tab-leaduri .wr-diag > .wr-panou[style*="span 8"], #tab-leaduri .wr-diag > .wr-panou[style*="span 12"], #tab-leaduri .wr-diag > .wr-panou[style*="1 / -1"] { grid-column: 1 / -1 !important; } } @media (max-width: 900px) { #tab-leaduri .wr-diag > .wr-panou { grid-column: 1 / -1 !important; } } @media (max-width: 600px) { #tab-leaduri .wr-ld-bara select { margin-left: 0; flex: 1 1 100%; } #tab-leaduri .wr-ld-bara .wr-btn-scena { padding: 0 var(--p3); } .wr-panou--plin { padding: var(--p3); } .wr-hr { grid-template-columns: minmax(56px, 34%) minmax(0, 1fr) auto; } body.war .panou.wr-detaliu { padding: var(--p6) var(--p3) var(--p4); } .panou-fundal { padding-left: var(--p2); padding-right: var(--p2); } /* dovezile: pe ecran ingust coloana „de ce" ajungea o litera pe rand; fiecare poarta devine un bloc */ #ld-dovezi thead { display: none; } #ld-dovezi, #ld-dovezi tbody, #ld-dovezi tr, #ld-dovezi td { display: block; width: 100%; box-sizing: border-box; } #ld-dovezi tr { padding: var(--p2) 0; border-bottom: 1px solid var(--disprule); } #ld-dovezi td { padding: var(--p1) 0; border: 0; text-align: left; } #ld-dovezi td.num { display: inline-block; width: auto; } } #ld-praguri-tabel input { width: 96px; min-width: 0; } /* ═══ SISTEM ═══ Procese (30), Macheta sistem (31), Operare (32), Index (40) — 19-Sep-2026. Aceleasi piese ca Acasa/Trafic (panou, KPI, bare, blocuri); aici doar ce e nou: randul de motor, LED-urile de servicii, tabelul din panou, harta liniilor, bara stivuita, lista de prioritati. Tot ce e nou are prefixul `wr-`; `[hidden]` e reafirmat unde clasa pune `display`. */ .wr-panou[hidden], #mp-sectiune[hidden] { display: none; } .wr-panou--plin { margin-top: var(--p3); } .wr-nota--sus { margin-top: 0; margin-bottom: var(--p3); } /* Un `style="grid-column: span N"` pe panou bate regulile @media de mai sus (specificitate) — pe telefon un span 8 intr-o grila de 1 coloana ar face coloane implicite si scroll lateral. Reafirmat aici, doar pentru filele acestea, cu !important. */ @media (max-width: 1100px) { #tab-procese .wr-diag > .wr-panou[style], #tab-capabilitati .wr-diag > .wr-panou[style], #tab-operare .wr-diag > .wr-panou[style], #tab-index .wr-diag > .wr-panou[style] { grid-column: span 1 !important; } #tab-procese .wr-diag > .wr-larg, #tab-capabilitati .wr-diag > .wr-larg, #tab-operare .wr-diag > .wr-larg, #tab-index .wr-diag > .wr-larg { grid-column: 1 / -1 !important; } /* (n3, 6-Oct) un panou de rând întreg (span 12) nu se mai înjumătățește: stătea la jumătate cu golul alături (INDEX.md BM-40.8), exact ca Trafic/Baza de date, care fac deja asta mai jos */ #tab-procese .wr-diag > .wr-panou[style*="span 12"], #tab-capabilitati .wr-diag > .wr-panou[style*="span 12"], #tab-operare .wr-diag > .wr-panou[style*="span 12"], #tab-index .wr-diag > .wr-panou[style*="span 12"] { grid-column: 1 / -1 !important; } } @media (max-width: 600px) { #tab-procese .wr-diag > .wr-panou[style], #tab-capabilitati .wr-diag > .wr-panou[style], #tab-operare .wr-diag > .wr-panou[style], #tab-index .wr-diag > .wr-panou[style] { grid-column: 1 / -1 !important; } } #tab-procese .wr-kpis, #tab-capabilitati .wr-kpis { margin-top: var(--p3); } #tab-operare .wr-kpis, #tab-index .wr-kpis { margin-top: var(--p3); } #tab-procese .wr-cap:first-child, #tab-capabilitati .wr-cap:first-child, #tab-operare .wr-cap:first-child, #tab-index .wr-cap:first-child { margin-top: 0; } #tab-capabilitati .wr-cap, #tab-index .wr-cap { margin-top: var(--p8); } /* ── lista de randuri (agenti, rulari, prioritati) ── */ .wr-lista { display: flex; flex-direction: column; } .wr-rand { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto auto; gap: var(--p3); align-items: center; padding: var(--p2) 0; border-top: 1px solid var(--disprule); font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-rand:first-child { border-top: 0; } .wr-rand-t { color: var(--dispink); font-weight: 600; min-width: 0; white-space: normal; overflow-wrap: anywhere; } .wr-rand-d { white-space: nowrap; font-variant-numeric: tabular-nums; } .wr-rand-n .wr-led { font-size: 10px; letter-spacing: .08em; } /* ── motoare / timere: un rand = o stare citita ── */ .wr-procese { display: flex; flex-direction: column; } .wr-proc { display: grid; grid-template-columns: minmax(180px, 26%) minmax(90px, auto) minmax(0, 1fr); gap: var(--p4); align-items: center; padding: var(--p2) 0 var(--p2) var(--p3); border-top: 1px solid var(--disprule); border-left: 3px solid var(--c); margin-left: 0; font-size: 12px; color: var(--dispink2); min-width: 0; } .wr-proc:first-child { border-top: 0; } .wr-proc--mort { background: linear-gradient(90deg, color-mix(in srgb, var(--c) 9%, transparent), transparent 55%); } .wr-proc-nume { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--p2); align-items: center; min-width: 0; } .wr-proc-nume b { font-family: var(--mono); font-size: 13px; color: var(--dispink); min-width: 0; white-space: normal; overflow-wrap: anywhere; } .wr-proc-nume small { grid-column: 2; font-family: var(--mono); font-size: 11px; color: var(--dispink2); min-width: 0; white-space: normal; overflow-wrap: anywhere; } .wr-lamp { grid-row: 1 / span 2; width: 10px; height: 10px; background: var(--c); box-shadow: 0 0 10px var(--c); border-radius: 1px; } .wr-proc--mort .wr-lamp { animation: wr-puls 2.6s ease-in-out infinite; } .wr-strip { display: flex; gap: 3px; flex-wrap: wrap; } .wr-pat { display: block; width: 12px; height: 18px; background: var(--c); box-shadow: inset 0 0 0 1px var(--disp); } .wr-proc-et { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; color: var(--c); text-transform: uppercase; } .wr-proc-ultima { min-width: 0; overflow-wrap: anywhere; font-family: var(--mono); font-size: 11px; line-height: 1.45; color: var(--dispink2); } .wr-proc .wr-proc-et + .wr-proc-ultima { grid-column: auto; } /* ── servicii cu LED ── */ .wr-servicii { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--p2) var(--p4); } .wr-serv { display: flex; flex-direction: column; gap: var(--p1); padding: var(--p3); min-width: 0; background: var(--disp); border: 1px solid var(--disprule); border-radius: var(--r0); box-shadow: inset 0 -2px 0 var(--c); } .wr-serv b { font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--c); overflow-wrap: anywhere; } .wr-serv .wr-led { font-size: 10px; } /* ── tabel in panou negru ── */ .wr-scroll { overflow-x: auto; } .wr-tab { width: 100%; border-collapse: collapse; font-size: 12px; color: var(--dispink2); } .wr-tab th { text-align: left; padding: 0 var(--p3) var(--p2) 0; font-family: var(--mono); font-size: 10px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink2); border-bottom: 1px solid var(--disprule); white-space: nowrap; } .wr-tab td { padding: var(--p2) var(--p3) var(--p2) 0; vertical-align: top; border-bottom: 1px solid color-mix(in srgb, var(--disprule) 60%, transparent); overflow-wrap: anywhere; } .wr-tab tbody tr:last-child td { border-bottom: 0; } .wr-tab tbody tr:hover td { background: rgba(255,255,255,.03); } .wr-tab td.lat { white-space: normal; } .wr-tab td.num { font-family: var(--mono); white-space: nowrap; font-variant-numeric: tabular-nums; } .wr-tab td.rau { color: var(--rdd); font-weight: 600; } .wr-tab-nume { font-family: var(--mono); color: var(--dispink); font-weight: 600; } .wr-tab-slab { color: var(--dispink2); } .wr-pila { display: inline-block; padding: 1px 7px; font-family: var(--mono); font-size: 11px; color: var(--dispink); border: 1px solid var(--disprule); border-radius: 2px; white-space: nowrap; } .wr-flag { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink2); opacity: .6; } .wr-flag--gn, .wr-flag--bl, .wr-flag--ye { opacity: 1; font-weight: 600; } .wr-flag--gn { color: var(--gnd); } .wr-flag--bl { color: var(--bld); } .wr-flag--ye { color: var(--yed); } .wr-tab code, .wr-nota code { font-family: var(--mono); } /* Fila Trafic social: titlul postarii are nevoie de latime, linkul nu ia albastrul implicit. */ #tab-trafic-social .wr-tab td.lat { min-width: 220px; } #tab-trafic-social .wr-tab a { color: var(--dispink); text-decoration: underline; text-decoration-color: var(--disprule); text-underline-offset: 3px; } #tab-trafic-social .wr-tab a:hover { text-decoration-color: currentColor; } /* Telefon: un rand de tabel devine un card, cu eticheta fiecarei cifre in fata ei — altfel cifrele raman dincolo de marginea ecranului. */ @media (max-width: 600px) { #tab-trafic-social .wr-soc-tab thead { display: none; } #tab-trafic-social .wr-soc-tab, #tab-trafic-social .wr-soc-tab tbody { display: block; } #tab-trafic-social .wr-soc-tab tr { display: grid; grid-template-columns: 1fr 1fr; gap: 2px var(--p4); padding: var(--p2) 0; border-bottom: 1px solid var(--disprule); } #tab-trafic-social .wr-soc-tab tbody tr:last-child { border-bottom: 0; } #tab-trafic-social .wr-soc-tab td { display: block; padding: 0; border: 0; min-width: 0; } #tab-trafic-social .wr-soc-tab td.lat { grid-column: 1 / -1; min-width: 0; } #tab-trafic-social .wr-soc-tab td.wr-soc-reper { grid-column: 1 / -1; margin: var(--p1) 0 6px; } #tab-trafic-social .wr-soc-tab td.num { display: flex; justify-content: space-between; gap: var(--p2); } #tab-trafic-social .wr-soc-tab td.num::before { content: attr(data-et); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink2); } } #tab-trafic-social .wr-soc-tile { grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); } /* ── harta liniilor (Macheta sistem) ── */ .wr-harta { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: var(--p3); align-items: start; } .wr-linie { min-width: 0; background: var(--disp); border: 1px solid var(--disprule); border-radius: var(--r0); box-shadow: inset 0 2px 0 var(--c); } .wr-linie header { display: flex; justify-content: space-between; align-items: baseline; gap: var(--p2); padding: var(--p3); border-bottom: 1px solid var(--disprule); } .wr-linie header b { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--c); overflow-wrap: anywhere; } .wr-linie header span { font-family: var(--mono); font-size: 11px; color: var(--dispink2); } .wr-linie--dest { border-style: dashed; } .wr-nod { display: flex; justify-content: space-between; align-items: center; gap: var(--p2); padding: 7px var(--p3); border-top: 1px solid color-mix(in srgb, var(--disprule) 55%, transparent); } .wr-nod:first-of-type { border-top: 0; } .wr-nod-nume { font-family: var(--mono); font-size: 12px; color: var(--dispink); overflow-wrap: anywhere; min-width: 0; } .wr-nod-flags { display: inline-flex; gap: 3px; flex: none; } .wr-mini { font-style: normal; font-family: var(--mono); font-size: 10px; font-weight: 700; min-width: 16px; height: 16px; display: inline-grid; place-items: center; color: var(--disp); background: var(--c); border-radius: 2px; padding: 0 3px; } .wr-rute { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 0 var(--p6); } /* ── bara stivuita (Index: gata + deschise) ── */ .wr-stiv { display: flex; gap: var(--p1); width: var(--tot); min-width: 6px; height: 12px; } .wr-stiv i { display: block; flex: var(--n) 1 0; min-width: 3px; background: var(--c); } .wr-hr:has(> .wr-stiv) { grid-template-columns: minmax(64px, 30%) minmax(0, 1fr) auto; } /* ── prioritati [ACUM] ── */ .wr-prio { display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: var(--p3); align-items: baseline; padding: 8px 0 8px var(--p3); border-top: 1px solid var(--disprule); border-left: 3px solid var(--c); font-size: 12px; } .wr-prio:first-child { border-top: 0; } .wr-prio-id { font-family: var(--mono); font-size: 11px; font-weight: 600; color: var(--c); } .wr-prio-cap { color: var(--dispink); min-width: 0; overflow-wrap: anywhere; } .wr-prio-cap strong { font-weight: 600; } .wr-prio-cat { font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink2); text-align: right; } /* ── alerte (fila Procese) ── */ .wr-alerte-panou { margin-bottom: var(--p3); border-color: var(--rdd); } /* T281 (19-Sep-2026): panoul se "calmeaza" (marginea rosie de urgenta dispare) cand nu mai e nicio alerta NEVAZUTA — ce a ramas e doar istoric vazut, nu ceva de alarmat pe cineva care da screenshare cu War Room. Vezi war-sistem.js::deseneazaAlerte. */ .wr-alerte-panou--calm { border-color: var(--disprule); } .wr-alerte--panou { margin: 0; } .wr-alerta { flex-wrap: wrap; } .wr-alerta-sursa { font-family: var(--mono); color: var(--dispink); } .wr-alerta-mesaj { flex: 1 1 260px; min-width: 0; overflow-wrap: anywhere; } .wr-alerta-cand { font-family: var(--mono); font-size: 11px; color: var(--dispink2); } .wr-alerta--vazuta { opacity: .55; } .wr-alerta-viz { flex: none; height: var(--hs); padding: 0 var(--p2); background: transparent; border: 1px solid var(--disprule); color: var(--dispink2); font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; border-radius: 3px; } .wr-alerta-viz:hover { background: var(--gr2); border-color: var(--ink3); color: var(--dispink); } .wr-alerta-viz:disabled { opacity: .4; cursor: default; } .wr-alerte-nota-comuta { margin-top: var(--p2); } .wr-alerte-comuta { background: transparent; border: none; padding: 0; color: var(--dispink); font: inherit; text-decoration: underline; cursor: pointer; } .wr-alerte-comuta:hover { color: var(--or); } /* ── Operare: formularele si comutatorul, mutate din corpul gri in panoul negru ── */ #tab-operare .wr-panou .comutator { background: var(--disp); border: 1px solid var(--disprule); box-shadow: none; } #tab-operare .wr-panou .com-nota { color: var(--dispink2); } #tab-operare .wr-panou .punte-nota { color: var(--dispink2); } #tab-operare .wr-panou .canale-bif { color: var(--dispink2); } #tab-operare .wr-panou .punte-form { margin-top: 0; } #tab-operare .wr-panou .punte-form input:not([type="checkbox"]), #tab-operare .wr-panou .punte-form select { background: var(--disp); color: var(--dispink); border: 1px solid var(--disprule); } #tab-operare .wr-panou .punte-form input::placeholder { color: var(--dispink2); } #tab-operare .wr-tab button, #tab-operare .wr-tab select, #tab-operare .wr-tab input { background: var(--disp); color: var(--dispink); border: 1px solid var(--disprule); } #tab-operare .wr-tab input[type="number"] { width: 6em; } #tab-operare .wr-tab select { max-width: 100%; } /* ── Index: lista completa ramane pe corpul gri (vederile Acum / Tabla / Sectiuni) ── */ #tab-index .idx-vederi { margin: 0 0 var(--p3); } body.war #tab-index .idx-vedere { background: transparent; } body.war #tab-index .idx-vedere.activ { border-color: var(--or); color: var(--dispink); } /* ── Operare: coloanele scurte ale tabelului de sarcini nu se rup in mijlocul cuvantului ── */ #punte-tabel td:nth-child(-n+2), #punte-tabel td:nth-child(4) { white-space: nowrap; overflow-wrap: normal; } #punte-tabel td { padding-right: var(--p3); } /* ═══ CONTINUT ═══ fila Content Machine (BM—15): war-continut.js. Doar `wr-cm-*` + cateva clase de grafic. */ .wr-kpis--auto { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); } .wr-cm-panou { overflow: hidden; } @media (min-width: 1101px) { .wr-diag > .wr-cm-panou { grid-column: span var(--span, 4); } } @media (max-width: 1100px) { .wr-diag > .wr-cm-lat { grid-column: 1 / -1; } } #continut-diag .wr-cols { position: relative; } #continut-diag .wr-col.wr-azi { background: rgba(237, 238, 234, .07); box-shadow: inset 1px 0 0 var(--ink3), inset -1px 0 0 var(--ink3); } #continut-diag .wr-bloc.wr-plan { opacity: .45; } /* linia-tinta de pe grafic (Content Machine). NU se mai numeste `.wr-tinta`: clasa asta e a containerului unei tinte din Leads Machine (mai sus), iar regula absoluta de aici il transforma intr-o linie punctata rosie peste toata pagina (19-Sep-2026). */ .wr-linie-tinta { position: absolute; left: 0; right: 0; height: 0; border-top: 1px dashed var(--ord); pointer-events: none; } .wr-linie-tinta em { position: absolute; right: 0; bottom: 2px; padding: 0 4px; background: var(--disp); font: normal 10px var(--mono); color: var(--ord); } #continut-stari.wr-legenda { margin: var(--p3) 0; } .wr-cm-h3 { margin: var(--p4) 0 var(--p2); font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--dispink2); } .wr-cm-h3:first-child, .wr-cm-bloc h3:first-child { margin-top: 0; } .wr-cm-bloc { margin-top: var(--p4); } .wr-cm-bloc h3 { margin: 0 0 var(--p2); font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--dispink2); } .wr-nota--atentie { color: var(--yed); } /* bara de sus a unui panou: cautare + numar + buton */ .wr-cm-bara { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p3); margin: var(--p3) 0; } .wr-cm-nr { font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .wr-cm-cauta { flex: 1 1 200px; min-width: 0; } .wr-cm-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } body.war .wr-cm-cauta input { width: 100%; min-width: 0; height: var(--h); padding: 0 var(--p3); background: var(--disp2); color: var(--dispink); border: 1px solid var(--disprule); border-radius: var(--r0); font-family: var(--mono); font-size: 13px; } body.war .wr-cm-cauta input:focus-visible { outline: 2px solid var(--mgd); outline-offset: 1px; } body.war .wr-cm-deschide { height: var(--hs); padding: 0 var(--p3); background: transparent; color: var(--dispink2); cursor: pointer; border: 1px solid var(--disprule); border-radius: var(--r0); font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; } body.war .wr-cm-deschide:hover { border-color: var(--ink3); color: var(--dispink); background: var(--gr2); } /* chip-uri, semne */ .wr-cm-chips { display: flex; flex-wrap: wrap; gap: var(--p2); margin: var(--p2) 0; align-items: center; } body.war .wr-cm-chip { height: var(--hs); padding: 0 var(--p2); background: transparent; color: var(--dispink2); cursor: pointer; border: 1px solid var(--disprule); border-radius: var(--r0); font-family: var(--mono); font-size: 11px; } body.war .wr-cm-chip b { color: var(--mgd); font-weight: 600; margin-left: 4px; } body.war .wr-cm-chip:hover { border-color: var(--ink3); color: var(--dispink); } body.war .wr-cm-chip[aria-pressed="true"] { border-color: var(--mgd); color: var(--dispink); background: var(--gr2); } .wr-cm-semn { padding: 1px 7px; border: 1px solid var(--c); color: var(--c); font: 500 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; border-radius: 2px; } .wr-cm-mec { padding: 1px 6px; background: var(--gr2, rgba(255,255,255,.04)); color: var(--dispink2); font: 11px var(--mono); overflow-wrap: anywhere; } .wr-cm-et { font: 11px var(--mono); color: var(--dispink2); letter-spacing: .08em; text-transform: uppercase; } .wr-cm-fara { font-family: var(--mono); font-size: 12px; color: var(--dispink2); } /* hook-uri */ .wr-cm-hooks { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: var(--p3); margin-top: var(--p3); max-height: 640px; overflow-y: auto; padding-right: 2px; } .wr-cm-hook, .wr-cm-serie { min-width: 0; padding: var(--p3); border: 1px solid var(--disprule); border-radius: var(--r0); background: var(--disp2); } .wr-cm-hook.wr-retras { opacity: .55; } .wr-cm-hook-cap { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--p2); } .wr-cm-hook-cap b { font-family: var(--mono); font-size: 12px; color: var(--mgd); } .wr-cm-hook-cap > span:not(.wr-cm-semn) { font-size: 13px; color: var(--dispink); min-width: 0; overflow-wrap: anywhere; } .wr-cm-hook-cap em { margin-left: auto; font: normal 11px var(--mono); color: var(--dispink2); } .wr-cm-tipar { margin: var(--p2) 0 0; font-family: var(--mono); font-size: 12px; color: var(--dispink); overflow-wrap: anywhere; } .wr-cm-exemplu { margin: 6px 0 0; font-size: 13px; color: var(--dispink2); font-style: italic; overflow-wrap: anywhere; } .wr-cm-hook-jos { display: flex; flex-wrap: wrap; gap: var(--p2); margin-top: var(--p2); } .wr-cm-fmt { font: 11px var(--mono); color: var(--dispink2); } /* liste (interzise, registru, timere) */ .wr-cm-det { margin-top: var(--p3); border-top: 1px solid var(--disprule); padding-top: var(--p2); } .wr-cm-det > summary { cursor: pointer; font-family: var(--mono); font-size: 12px; color: var(--dispink); display: flex; gap: var(--p2); align-items: baseline; list-style-position: inside; } .wr-cm-det > summary:focus-visible { outline: 2px solid var(--mgd); outline-offset: 2px; } .wr-cm-suma { margin-left: auto; color: var(--dispink2); font-size: 11px; } .wr-cm-lista { list-style: none; margin: var(--p2) 0 0; padding: 0; display: flex; flex-direction: column; } .wr-cm-lista li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--p3); padding: 6px 0; border-bottom: 1px solid var(--rule2); font-size: 13px; color: var(--dispink2); align-items: baseline; } .wr-cm-lista li:last-child { border-bottom: 0; } .wr-cm-lista li > b { font: 600 12px var(--mono); color: var(--dispink); } .wr-cm-lista li > span { min-width: 0; overflow-wrap: anywhere; } .wr-cm-lista li > em { font: normal 11px var(--mono); color: var(--c); text-align: right; max-width: 22ch; overflow-wrap: anywhere; } .wr-cm-timere li { grid-template-columns: minmax(0, 1fr); gap: 2px; } .wr-cm-timere li > .wr-cm-live { display: flex; flex-direction: column; gap: 2px; font: 12px var(--mono); } .wr-cm-live small { color: var(--dispink2); } /* serii */ .wr-cm-serii { display: grid; gap: var(--p3); } .wr-cm-dl { margin: var(--p2) 0 0; display: grid; gap: var(--p1); } .wr-cm-dl > div { display: grid; grid-template-columns: 11ch minmax(0, 1fr); gap: var(--p2); font-size: 12px; } .wr-cm-dl dt { font: 11px var(--mono); color: var(--dispink2); text-transform: uppercase; letter-spacing: .08em; } .wr-cm-dl dd { margin: 0; color: var(--dispink); overflow-wrap: anywhere; } /* calendar */ .wr-cm-cal { list-style: none; margin: 0; padding: 0; } .wr-cm-cal li { display: grid; grid-template-columns: 12ch minmax(0, 1fr); gap: 2px var(--p2); align-items: baseline; padding: var(--p2) 0; border-bottom: 1px solid var(--rule2); font-size: 13px; } .wr-cm-cal time { font: 600 12px var(--mono); color: var(--dispink); } .wr-cm-cal-p { font: 12px var(--mono); color: var(--c); min-width: 0; white-space: normal; overflow-wrap: anywhere; } .wr-cm-cal-t { grid-column: 1 / -1; color: var(--dispink2); overflow-wrap: anywhere; } /* stiluri + documente: carduri-buton */ .wr-cm-stiluri { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: var(--p2); } body.war .wr-cm-stil, body.war .wr-cm-doc { display: flex; flex-direction: column; align-items: flex-start; gap: var(--p1); width: 100%; min-width: 0; height: auto; padding: var(--p2) var(--p3); background: var(--disp2); color: var(--dispink); border: 1px solid var(--disprule); border-radius: var(--r0); text-align: left; cursor: pointer; text-transform: none; letter-spacing: 0; white-space: normal; } body.war .wr-cm-stil:hover, body.war .wr-cm-doc:hover { border-color: var(--mgd); background: var(--gr2); } .wr-cm-stil b { font: 600 12px var(--mono); letter-spacing: .08em; } .wr-cm-desc { font-size: 12px; color: var(--dispink2); overflow-wrap: anywhere; font-family: var(--sans); } .wr-cm-docs { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--p2); grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); } body.war .wr-cm-doc { flex-direction: row; align-items: center; font-size: 13px; font-family: var(--sans); } .wr-cm-doc-et { font: 600 11px var(--mono); color: var(--mgd); min-width: 3ch; } /* motoare */ .wr-cm-scroll { overflow-x: auto; } .wr-cm-tab { width: 100%; border-collapse: collapse; font-size: 13px; } body.war .wr-cm-tab th { text-align: left; padding: 6px var(--p2) 6px 0; font: 500 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: var(--dispink2); border-bottom: 1px solid var(--disprule); } body.war .wr-cm-tab td { padding: var(--p2) var(--p2) var(--p2) 0; border-bottom: 1px solid var(--rule2); vertical-align: top; color: var(--dispink2); overflow-wrap: anywhere; } .wr-cm-tab td b { color: var(--dispink); font-weight: 500; display: block; } .wr-cm-tab small { display: block; font: 11px var(--mono); color: var(--dispink2); } .wr-cm-n { font-family: var(--mono); font-size: 12px; white-space: nowrap; } /* panoul de citire (read-only) */ .wr-cm-panza { position: fixed; inset: 0; z-index: 70; background: rgba(0, 0, 0, .55); } .wr-cm-citire { position: fixed; top: 0; right: 0; bottom: 0; z-index: 71; width: min(720px, 100vw); display: flex; flex-direction: column; background: var(--disp); border-left: 1px solid var(--disprule); box-shadow: -24px 0 60px -20px rgba(0, 0, 0, .7); animation: wr-cm-intra 260ms var(--wr-ease, ease-out) backwards; } .wr-cm-panza[hidden], .wr-cm-citire[hidden] { display: none; } @keyframes wr-cm-intra { from { transform: translateX(24px); opacity: 0; } } .wr-cm-citire-cap { display: flex; align-items: center; gap: var(--p2); padding: var(--p3) var(--p4); border-bottom: 1px solid var(--disprule); flex-wrap: wrap; } .wr-cm-citire-cale { flex: 1 1 200px; min-width: 0; font: 12px var(--mono); color: var(--dispink); overflow-wrap: anywhere; } .wr-cm-citire-corp { flex: 1 1 auto; min-height: 0; margin: 0; padding: var(--p4); overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.6 var(--mono); color: var(--dispink); background: transparent; border: 0; } .wr-cm-md-h { color: var(--mgd); font-weight: 600; } .wr-cm-md-t { color: var(--dispink2); } body.wr-cm-citire-deschisa { overflow: hidden; } @media (prefers-reduced-motion: reduce) { .wr-cm-citire { animation: none; } } @media (max-width: 600px) { .wr-cm-hooks { max-height: 520px; } .wr-cm-hook-cap em { margin-left: 0; } .wr-cm-lista li { grid-template-columns: auto minmax(0, 1fr); } .wr-cm-lista li > em { grid-column: 2; text-align: left; max-width: none; } } /* ═══ BAZA DE DATE ═══ */ /* fila Baza de date (fostul Registru): KPI-uri, sinteza pe familii, lista de fisiere clickabile, sertarul cu vizualizare / editare / istoric. Selectorii au prefixul `body.war` acolo unde `body.war button` (style.css) ar bate o clasa simpla. */ #tab-registru [hidden], #baza-panou-fundal [hidden] { display: none !important; } #tab-registru .wr-kpis { margin-bottom: var(--p4); } #tab-registru .baza-sub { margin: var(--p3) 0; } .baza-unelte { margin: var(--p6) 0 var(--p3); align-items: center; } .baza-unelte input[type="search"] { flex: 1 1 220px; min-width: 0; max-width: 100%; } .baza-bifa { display: inline-flex; align-items: center; gap: var(--p2); font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .baza-bifa input { width: auto; } .baza-nota-sus { margin-top: 0; } .baza-tabele { margin-top: var(--p4); } /* familii: un panou pe familie, categoriile pliabile inauntru */ #baza-familii { display: flex; flex-direction: column; gap: var(--p4); } .baza-fam { box-shadow: var(--mat-adancit), inset 0 2px 0 var(--c); } .baza-fam .wr-panou-cap { margin-bottom: var(--p3); } .baza-link { font-family: var(--mono); font-size: 12px; letter-spacing: .08em; color: var(--c); text-decoration: none; border-bottom: 1px dashed var(--c); white-space: nowrap; } .baza-link:hover { color: var(--dispink); } .baza-fam-stat { margin: 0 0 var(--p3); font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .baza-fam-stat b { color: var(--dispink); font-weight: 600; } .baza-fam-nota { display: block; margin-top: 3px; font-family: inherit; font-size: 12px; color: var(--dispink2); } .baza-cat { border-top: 1px solid var(--disprule); } .baza-cat > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--p3); padding: var(--p3) 0; cursor: pointer; list-style: none; font-family: var(--mono); font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink); } .baza-cat > summary::-webkit-details-marker { display: none; } .baza-cat > summary::before { content: "▸"; color: var(--c); margin-right: var(--p2); } .baza-cat[open] > summary::before { content: "▾"; } .baza-cat > summary span { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; } .baza-cat > summary b { color: var(--c); font-weight: 600; } .baza-lista { display: flex; flex-direction: column; padding-bottom: var(--p3); } body.war .baza-rand { display: flex; flex-direction: column; align-items: stretch; gap: var(--p1); height: auto; width: 100%; padding: var(--p2) var(--p3); margin: 0; text-align: left; white-space: normal; cursor: pointer; background: transparent; border: 0; border-left: 3px solid transparent; border-bottom: 1px solid var(--rule2); /* 3px: aliniat la familia "banda de categorie pe stanga" (.wr-proc/.wr-prio/.baza-mesaj/ .baza-md blockquote), nu o scapare — T276 disciplina §5. */ border-radius: 0; color: var(--ink); } body.war .baza-rand:hover, body.war .baza-rand:focus-visible { background: var(--gr3); border-left-color: var(--c, var(--or)); } body.war .baza-rand:focus-visible { outline: 2px solid var(--or); outline-offset: -2px; } .baza-rand-cap { display: flex; align-items: center; flex-wrap: wrap; gap: var(--p2); min-width: 0; } .baza-rand-t { font-weight: 600; font-size: 14px; overflow-wrap: anywhere; min-width: 0; } .baza-rand-c { font-family: var(--mono); font-size: 11px; color: var(--dispink2); overflow-wrap: anywhere; } .baza-rand-d { font-style: normal; margin-left: var(--p2); color: var(--ink3); } .baza-rand-desc { font-size: 12px; color: var(--dispink2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } body.war .baza-rand--mic { padding: var(--p2) 0; } body.war .baza-mai { align-self: flex-start; margin: var(--p3) var(--p3) 0; } .baza-badge { display: inline-block; padding: 1px 7px; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; border: 1px solid currentColor; border-radius: 2px; white-space: nowrap; line-height: 1.6; } .baza-badge--ed { color: var(--gnd); } .baza-badge--cit { color: var(--yed); } .baza-badge--mac { color: var(--ink3); } .baza-badge--edt { color: var(--cyd); } .baza-badge--mic { color: var(--dispink2); } /* sertarul unui fisier */ .baza-panou { max-width: 900px; padding: var(--p6) var(--p6) var(--p4); } .baza-cale { margin: 0 0 var(--p2); font-family: var(--mono); font-size: 12px; color: var(--ink3); overflow-wrap: anywhere; } .baza-badges { display: flex; flex-wrap: wrap; gap: var(--p2); margin-bottom: var(--p3); } .baza-bara-unelte { display: flex; align-items: center; flex-wrap: wrap; gap: var(--p2); margin-bottom: var(--p3); } .baza-modificat { font-family: var(--mono); font-size: 12px; color: var(--yed); } .baza-mesaj { display: flex; align-items: center; flex-wrap: wrap; gap: var(--p2) var(--p3); margin: 0 0 var(--p3); padding: var(--p2) var(--p3); font-size: 13px; line-height: 1.4; color: var(--ink); background: var(--gr); border: 1px solid var(--rule); border-left: 3px solid var(--ink3); border-radius: var(--r0); } .baza-mesaj > span { flex: 1 1 220px; min-width: 0; overflow-wrap: anywhere; } .baza-mesaj--bun { border-left-color: var(--gnd); } .baza-mesaj--rau { border-left-color: var(--rdd); } .baza-mesaj--atentie { border-left-color: var(--yed); } .baza-mesaj--info { border-left-color: var(--cyd); } body.war .baza-mesaj-btn { height: var(--hs); padding: 0 var(--p3); } .baza-vedere { min-width: 0; max-height: 58vh; overflow: auto; padding: var(--p3) var(--p4); background: var(--gr); border: 1px solid var(--rule); border-radius: var(--r0); font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; } .baza-pre { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-family: var(--mono); font-size: 12px; line-height: 1.5; } .baza-md h1, .baza-md h2, .baza-md h3, .baza-md h4 { margin: var(--p4) 0 var(--p2); color: var(--ink); text-shadow: none; letter-spacing: 0; text-transform: none; font-size: 1.1em; } .baza-md h1 { font-size: 1.35em; } .baza-md > :first-child { margin-top: 0; } .baza-md p, .baza-md ul, .baza-md ol { margin: 0 0 var(--p3); } .baza-md code { font-family: var(--mono); font-size: .92em; background: var(--gr3); padding: 0 4px; border-radius: 3px; } .baza-md pre { overflow: auto; background: var(--gr3); padding: var(--p3); border-radius: var(--r0); } .baza-md table { border-collapse: collapse; font-size: 13px; display: block; overflow-x: auto; max-width: 100%; } .baza-md th, .baza-md td { border: 1px solid var(--rule); padding: var(--p1) var(--p2); text-align: left; vertical-align: top; } .baza-md blockquote { margin: 0 0 var(--p3); padding-left: var(--p3); border-left: 3px solid var(--rule); color: var(--dispink2); } .baza-nota-needit { margin: 0 0 var(--p3); } .baza-editare { display: flex; flex-direction: column; gap: var(--p3); } .baza-editare textarea { width: 100%; min-height: 46vh; resize: vertical; padding: var(--p3) var(--p4); font-family: var(--mono); font-size: 13px; line-height: 1.5; tab-size: 2; white-space: pre; overflow: auto; border-radius: var(--r0); } .baza-editare input[type="text"] { width: 100%; } .baza-actiuni { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--p2); } .baza-scurtatura { margin-right: auto; font-family: var(--mono); font-size: 11px; color: var(--ink3); } body.war .baza-salveaza { border-color: var(--or); color: var(--dispink); } .baza-istoric { display: flex; flex-direction: column; gap: var(--p2); margin-bottom: var(--p3); } .baza-vers { padding: var(--p2) var(--p3); background: var(--gr); border: 1px solid var(--rule); border-radius: var(--r0); } .baza-vers-cap { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p2) var(--p3); font-family: var(--mono); font-size: 12px; color: var(--dispink2); } .baza-vers-cap b { color: var(--dispink); } .baza-vers-nota { margin: var(--p1) 0 0; font-size: 13px; color: var(--ink2); overflow-wrap: anywhere; } .baza-vers-act { display: flex; flex-wrap: wrap; gap: var(--p2); margin-top: var(--p2); } /* T276 disciplina §4a: .wr-btn-scena nu se mai suprascrie per-context (avea 26px aici, 34px in rest) — fara suprascriere ramane la inaltimea implicita var(--h). */ @media (max-width: 700px) { .baza-panou { padding: var(--p4) var(--p3) var(--p3); } .baza-editare textarea { min-height: 40vh; font-size: 12px; } .baza-fam-stat { line-height: 1.6; } } @media (max-width: 1100px) { /* spanurile inline (4/6/8) ar crea coloane implicite intr-o grila de 2 coloane */ #tab-registru .wr-diag > .wr-panou { grid-column: 1 / -1 !important; } } body.war .baza-vedere:empty { display: none; } /* ═══ MOBIL: panouri cu `grid-column` inline (Trafic, Baza de date) ═══ Un `style="grid-column: span 8"` bate orice @media fara !important: pe telefon panourile ramaneau pe 12 coloane si se strangeau in benzi ingroape (titlu si grafic rupte litera cu litera). */ @media (max-width: 1100px) { #tab-trafic-site .wr-diag > .wr-panou[style], #tab-trafic-social .wr-diag > .wr-panou[style], #tab-registru .wr-diag > .wr-panou[style] { grid-column: span 1 !important; } #tab-trafic-site .wr-diag > .wr-panou[style*="span 8"], #tab-trafic-site .wr-diag > .wr-panou[style*="span 12"], #tab-trafic-social .wr-diag > .wr-panou[style*="span 8"], #tab-trafic-social .wr-diag > .wr-panou[style*="span 12"], #tab-registru .wr-diag > .wr-panou[style*="span 8"], #tab-registru .wr-diag > .wr-panou[style*="span 12"] { grid-column: 1 / -1 !important; } } @media (max-width: 600px) { #tab-trafic-site .wr-diag > .wr-panou[style], #tab-trafic-social .wr-diag > .wr-panou[style], #tab-registru .wr-diag > .wr-panou[style] { grid-column: 1 / -1 !important; } #tab-trafic-site .wr-diag, #tab-trafic-social .wr-diag { grid-template-columns: minmax(0, 1fr); } } /* Fila Lead-uri: randul intreg deschide fisa; notele din fisa. */ #tab-leaduri tr.wr-rand-click { cursor: pointer; } #tab-leaduri tr.wr-rand-click:hover td { background: color-mix(in srgb, var(--c, var(--accent, #c8501e)) 6%, transparent); } #tab-leaduri tr.wr-rand-click:focus-visible { outline: 2px solid currentColor; outline-offset: -2px; } .wr-note td:first-child { white-space: nowrap; opacity: .7; vertical-align: top; } body.war table.wr-note td.lat { white-space: pre-line; } #ld-analiza .wr-an-probleme, #ld-oglinda .wr-an-probleme { margin: var(--p2) 0 var(--p4); padding-left: 0; list-style: inside disc; } #ld-analiza .wr-an-axa, #ld-oglinda .wr-an-axa { padding: var(--p2) 0; border-bottom: 1px solid var(--disprule); } #ld-analiza .wr-an-cap, #ld-oglinda .wr-an-cap { display: flex; justify-content: space-between; gap: var(--p3); opacity: .85; } /* Fila Campanii email (T307) — chip-uri de tag-uri pe formular + afisare pe randul campaniei. Nu e o suprascriere a .wr-cm-chip (acela e toggle-filtru, scoped la fila Comentarii) — aici fiecare chip poarta si un buton de stergere, deci markup si stare diferite; de-aia clasa noua .eml-tag*, prefixata la fel ca restul filei (eml-), nu o extindere peste wr-cm-chip. */ .eml-tags { display: flex; flex-wrap: wrap; gap: var(--p2); align-items: center; margin: var(--p2) 0; } .eml-tag { display: inline-flex; align-items: center; gap: 6px; height: var(--hs); padding: 0 var(--p1) 0 var(--p2); background: var(--gr2); color: var(--dispink); border: 1px solid var(--disprule); border-radius: var(--r0); font-family: var(--mono); font-size: 11px; letter-spacing: .04em; white-space: nowrap; } .eml-tag button { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; background: transparent; border: 0; border-radius: 50%; color: var(--dispink2); cursor: pointer; font-size: 12px; line-height: 1; } .eml-tag button:hover { color: var(--rdd, #ff6b5e); background: var(--gr2); } .eml-tags--goale { font-family: var(--mono); font-size: 11px; color: var(--dispink2); } .eml-tag-add { display: flex; gap: var(--p2); align-items: center; } .eml-tag-add input { flex: 1 1 auto; min-width: 0; } /* Chip mic, needitabil, afisat pe randul unei campanii din lista (fara buton de stergere). */ .eml-tag-mic { display: inline-block; padding: 1px 7px; margin: 0 4px 4px 0; border: 1px solid var(--disprule); border-radius: 2px; font-family: var(--mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--dispink2); } /* T309, 26-Sep-2026: erorile din tab-ul de email erau invizibile -- `.punte-nota` fara clasa `.rau` foloseste culoarea neutra de mai jos (`--dispink2`, vezi #tab-leaduri mai sus), care se pierde in fundal. `seteazaStare()` din war-email.js pune clasa asta explicit cand mesajul e o eroare. */ #tab-email .punte-nota.rau { color: var(--rd, #ff6b5e); font-weight: 600; } #ld-analiza .wr-an-axa p, #ld-analiza .wr-an-probleme li, #ld-oglinda .wr-an-axa p, #ld-oglinda .wr-an-probleme li { margin: var(--p1) 0 0; text-align: left; } /* ═══ T322 — fila Task-uri ca baza de date (tsk-*) ═══════════════════════════════════════ Prefix `tsk-`: revendicare globala, verificat cu grep. Layout: cifre fixe | baza | grafice. Butoane: `body.war button` bate clasele simple, deci toate regulile sunt `body.war .x`. */ .tsk-db { display: grid; grid-template-columns: 168px minmax(0, 1fr) 232px; gap: var(--p4); align-items: start; } .tsk-lat { position: sticky; top: var(--p4); display: flex; flex-direction: column; gap: var(--p2); } .tsk-lat-cap { margin: 0; font: 600 11px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--dispink2); } .tsk-cifra { display: grid; grid-template-columns: auto 1fr; column-gap: var(--p3); align-items: baseline; padding: var(--p2) var(--p3); border: 1px solid var(--disprule); border-left: 3px solid var(--c); background: var(--gr2); } .tsk-cifra b { grid-row: span 2; font: 600 26px/1 var(--mono); color: var(--c); font-variant-numeric: tabular-nums; min-width: 2ch; } .tsk-cifra span { font: 12px var(--mono); color: var(--dispink); text-transform: uppercase; letter-spacing: .04em; } .tsk-cifra i { font: 11px var(--mono); font-style: normal; color: var(--dispink2); } .tsk-graf { border: 1px solid var(--disprule); background: var(--gr2); padding: var(--p3); display: flex; flex-direction: column; gap: var(--p1); } .tsk-graf h4 { margin: 0 0 var(--p2); font: 600 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--dispink2); } body.war .tsk-bar { display: grid; grid-template-columns: 86px 1fr 3ch; gap: var(--p2); align-items: center; width: 100%; min-height: 24px; padding: 2px var(--p1); background: transparent; border: 1px solid transparent; color: var(--dispink); font: 12px var(--mono); text-align: left; cursor: pointer; } body.war .tsk-bar:hover { background: var(--gr3); border-color: var(--disprule); } body.war .tsk-bar:focus-visible, body.war .tsk-sort:focus-visible, body.war .tsk-card:focus-visible { outline: 2px solid var(--or); outline-offset: 1px; } .tsk-bar-et { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .tsk-bar-pista { height: 8px; background: var(--gr3); } .tsk-bar-pista i { display: block; height: 100%; background: var(--c); } .tsk-bar b { text-align: right; font-variant-numeric: tabular-nums; } .tsk-ritm { width: 100%; height: 64px; } .tsk-ritm .on { fill: var(--c); } .tsk-ritm .off { fill: var(--disprule); } .tsk-ritm-leg { display: flex; justify-content: space-between; margin: 0; font: 10px var(--mono); color: var(--dispink2); } .tsk-mij { min-width: 0; display: flex; flex-direction: column; gap: var(--p3); } .tsk-bara { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p3); } .tsk-views { display: flex; flex-wrap: wrap; gap: var(--p1); } body.war .tsk-view { min-height: 40px; padding: 0 var(--p4); color: var(--dispink); border-color: var(--ink3); } body.war .tsk-view:hover { background: var(--gr3); border-color: var(--dispink2); } body.war .tsk-view[aria-pressed="true"] { background: var(--or); border-color: var(--or); color: #0C0D0F; font-weight: 700; } body.war .tsk-view:focus-visible, body.war .tsk-act button:focus-visible, body.war .tsk-sinc:focus-visible { outline: 2px solid var(--or); outline-offset: 2px; } .tsk-nr { margin-left: auto; } .tsk-sincron { display: flex; align-items: center; gap: var(--p2); } .tsk-filtre { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p2); } .tsk-filtre input[type="search"] { flex: 1 1 220px; min-width: 0; min-height: 36px; } .tsk-filtre select { width: auto; min-height: 36px; max-width: 200px; } .tsk-check { display: inline-flex; align-items: center; gap: var(--p2); font: 12px var(--mono); color: var(--dispink); } .tsk-context { margin: 0; } .tsk-lista { display: flex; flex-direction: column; gap: var(--p2); } .tsk-rand, .tsk-card { border: 1px solid var(--disprule); border-left: 3px solid var(--c, var(--disprule)); background: var(--gr2); padding: var(--p3); display: flex; flex-direction: column; gap: var(--p2); min-width: 0; } .tsk-rand.arhivat, .tsk-card.arhivat, .tsk-tabel tr.arhivat { opacity: .6; } .tsk-rand-cap { display: flex; align-items: center; gap: var(--p3); min-width: 0; } .tsk-titlu { flex: 1; min-width: 0; font-weight: 600; color: var(--dispink); overflow-wrap: anywhere; } .tsk-titlu--card { margin: 0; font-size: 13px; line-height: 1.35; } .tsk-cheie { font: 11px var(--mono); color: var(--dispink2); white-space: nowrap; } .tsk-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p2); } .tsk-chip { font: 11px var(--mono); padding: 2px var(--p2); border: 1px solid var(--disprule); color: var(--dispink); background: var(--gr3); } .tsk-chip--client { border-color: var(--cyd); } .tsk-date { display: flex; flex-wrap: wrap; gap: var(--p1) var(--p4); font: 11px var(--mono); color: var(--dispink2); } .tsk-date b { color: var(--dispink); font-weight: 500; } .tsk-txt { font-size: 13px; line-height: 1.45; color: var(--dispink2); overflow-wrap: anywhere; white-space: pre-wrap; } .tsk-raspuns { color: var(--dispink); border-left: 2px solid var(--gnd); padding-left: var(--p2); } .tsk-act { display: flex; flex-wrap: wrap; gap: var(--p2); align-items: center; } body.war .tsk-act button { min-height: 34px; min-width: 64px; padding: 0 var(--p3); font-weight: 600; } body.war .tsk-act button.primar { background: var(--or); border-color: var(--or); color: #0C0D0F; } body.war .tsk-act button.primar:hover { background: color-mix(in srgb, var(--or) 82%, #fff); border-color: #fff; } body.war .tsk-act button.marcheaza { background: transparent; border: 1px solid var(--gnd); color: var(--gnd); } body.war .tsk-act button.marcheaza:hover { background: var(--gnd); color: #0C0D0F; } body.war .tsk-act button.discret { border: 1px solid var(--disprule); color: var(--dispink); } body.war .tsk-act button.discret:hover { border-color: var(--dispink2); background: var(--gr3); } body.war .tsk-sinc { min-height: 34px; padding: 0 var(--p3); border: 1px solid var(--ink3); color: var(--dispink); } body.war .tsk-sinc:hover { background: var(--gr3); border-color: var(--dispink2); } body.war .tsk-prioritate-select { width: auto; min-width: 84px; flex: none; min-height: 28px; font: 600 12px var(--mono); padding: 0 var(--p2); background: var(--gr3); color: var(--dispink); border: 1px solid var(--ink3); cursor: pointer; } body.war .tsk-prioritate-select:hover { border-color: var(--dispink); } body.war .tsk-p-1 { border-color: var(--rdd); } body.war .tsk-p-2 { border-color: var(--ord); } body.war .tsk-p-3 { border-color: var(--yed); } body.war .tsk-p-4 { border-color: var(--gnd); } .tsk-tabla { display: grid; grid-template-columns: repeat(5, minmax(210px, 1fr)); gap: var(--p3); overflow-x: auto; padding-bottom: var(--p2); } .tsk-col { border: 1px solid var(--disprule); border-top: 3px solid var(--c); background: var(--gr); min-height: 160px; display: flex; flex-direction: column; } .tsk-col.peste { background: var(--gr3); outline: 2px dashed var(--c); } .tsk-col-cap { display: flex; justify-content: space-between; padding: var(--p2) var(--p3); font: 600 12px var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--c); } .tsk-col-corp { display: flex; flex-direction: column; gap: var(--p2); padding: var(--p2); } .tsk-card { cursor: grab; border-left-width: 4px; } .tsk-card.tras { opacity: .4; } .tsk-cp-1 { border-left-color: var(--rdd); } .tsk-cp-2 { border-left-color: var(--ord); } .tsk-cp-3 { border-left-color: var(--yed); } .tsk-cp-4 { border-left-color: var(--gnd); } .tsk-cp-5 { border-left-color: var(--ink3); } .tsk-card-sus { display: flex; justify-content: space-between; align-items: center; gap: var(--p2); } .tsk-gol-col { margin: 0; font: 11px var(--mono); color: var(--dispink2); text-align: center; } .tsk-sfat { margin: 0; } .tsk-tabel-scroll { overflow-x: auto; border: 1px solid var(--disprule); } .tsk-tabel { width: 100%; min-width: 1040px; border-collapse: collapse; font-size: 13px; } body.war .tsk-tabel th, body.war .tsk-tabel td { font-family: inherit; padding: var(--p2) var(--p3); border-bottom: 1px solid var(--disprule); text-align: left; vertical-align: top; color: var(--dispink); } body.war .tsk-tabel thead th { background: var(--gr3); position: sticky; top: 0; white-space: nowrap; } body.war .tsk-sort { background: transparent; border: 0; padding: var(--p1) 0; min-height: 28px; font: 600 11px var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--dispink2); cursor: pointer; } body.war .tsk-sort:hover, body.war .tsk-sort.activ { color: var(--or); } .tsk-th-act { font: 600 11px var(--mono); color: var(--dispink2); text-transform: uppercase; } body.war .tsk-tabel .tsk-c-cheie, body.war .tsk-tabel .tsk-c-data { font: 11px var(--mono); white-space: nowrap; color: var(--dispink2); } .tsk-c-titlu { min-width: 220px; overflow-wrap: anywhere; } .tsk-tabel tbody tr:hover { background: var(--gr2); } .tsk-grup { border-left: 3px solid var(--c); padding-left: var(--p3); margin-bottom: var(--p4); } .tsk-grup-cap { display: flex; align-items: baseline; gap: var(--p3); } .tsk-grup-cap h4 { margin: 0 0 var(--p2); font: 600 13px var(--mono); color: var(--c); text-transform: uppercase; letter-spacing: .06em; } .tsk-grup-cap b { font: 12px var(--mono); color: var(--dispink2); } @media (max-width: 1280px) { .tsk-db { grid-template-columns: 1fr; } .tsk-lat { position: static; } .tsk-metrici { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } .tsk-metrici .tsk-lat-cap { grid-column: 1 / -1; } .tsk-grafice { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } .tsk-grafice .tsk-lat-cap { grid-column: 1 / -1; } .tsk-mij { order: -1; } } /* ═══ T323 — Leads Machine · vederea „Baza” (ldb-*) ══════════════════════════════════════ Prefix `ldb-`: verificat cu grep, liber. Acelasi model ca tsk-* (T322): cifre | vedere | grafice. Culorile de familie `wr-f-*` seteaza `--c` (vezi T322); butoanele: `body.war .x` bate clasele simple. */ .ldb-db { display: grid; grid-template-columns: 168px minmax(0, 1fr) 232px; gap: var(--p4); align-items: start; } .ldb-lat { position: sticky; top: var(--p4); display: flex; flex-direction: column; gap: var(--p2); } .ldb-lat-cap { margin: 0; font: 600 11px var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--dispink2); } .ldb-cifra { display: grid; grid-template-columns: auto 1fr; column-gap: var(--p3); align-items: baseline; padding: var(--p2) var(--p3); border: 1px solid var(--disprule); border-left: 3px solid var(--c); background: var(--gr2); } .ldb-cifra b { grid-row: span 2; font: 600 26px/1 var(--mono); color: var(--c); font-variant-numeric: tabular-nums; min-width: 2ch; } .ldb-cifra span { font: 12px var(--mono); color: var(--dispink); text-transform: uppercase; letter-spacing: .04em; } .ldb-cifra i { font: 11px var(--mono); font-style: normal; color: var(--dispink2); } .ldb-graf { border: 1px solid var(--disprule); background: var(--gr2); padding: var(--p3); display: flex; flex-direction: column; gap: var(--p1); } .ldb-graf h4 { margin: 0 0 var(--p2); font: 600 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--dispink2); } body.war .ldb-bar { display: grid; grid-template-columns: 92px 1fr 3ch; gap: var(--p2); align-items: center; width: 100%; min-height: 24px; padding: 2px var(--p1); background: transparent; border: 1px solid transparent; color: var(--dispink); font: 12px var(--mono); text-align: left; cursor: pointer; } body.war .ldb-bar:hover { background: var(--gr3); border-color: var(--disprule); } body.war .ldb-bar:focus-visible, body.war .ldb-sort:focus-visible, body.war .ldb-card:focus-visible, body.war .ldb-tag-add:focus-visible, body.war .ldb-tag-x:focus-visible, body.war .ldb-tag-f:focus-visible, body.war .ldb-stadiu:focus-visible, body.war .ldb-fisa:focus-visible, body.war .ldb-view:focus-visible { outline: 2px solid var(--or); outline-offset: 1px; } .ldb-bar-et { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ldb-bar-pista { height: 8px; background: var(--gr3); } .ldb-bar-pista i { display: block; height: 100%; background: var(--c); } .ldb-bar b { text-align: right; font-variant-numeric: tabular-nums; } .ldb-ritm { width: 100%; height: 64px; } .ldb-ritm .on { fill: var(--c); } .ldb-ritm .off { fill: var(--disprule); } .ldb-ritm-leg { display: flex; justify-content: space-between; margin: 0; font: 10px var(--mono); color: var(--dispink2); } .ldb-mij { min-width: 0; display: flex; flex-direction: column; gap: var(--p3); } .ldb-bara { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p3); } .ldb-views { display: flex; flex-wrap: wrap; gap: var(--p1); } body.war .ldb-view { min-height: 40px; padding: 0 var(--p4); color: var(--dispink); border-color: var(--ink3); } body.war .ldb-view:hover { background: var(--gr3); border-color: var(--dispink2); } body.war .ldb-view[aria-pressed="true"] { background: var(--or); border-color: var(--or); color: #0C0D0F; font-weight: 700; } .ldb-nr { margin-left: auto; } .ldb-filtre { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p2); } .ldb-filtre input[type="search"] { flex: 1 1 260px; min-width: 0; min-height: 36px; } .ldb-filtre select { width: auto; min-height: 36px; max-width: 190px; } .ldb-filtre input[type="number"] { width: 92px; min-height: 36px; } .ldb-filtre input[type="date"] { width: auto; min-height: 36px; } .ldb-data { display: inline-flex; align-items: center; gap: var(--p1); font: 12px var(--mono); color: var(--dispink2); } .ldb-eroare { margin: 0; min-height: 0; color: var(--rdd); } .ldb-eroare:empty { display: none; } /* chip stadiu (punct + eticheta), tag-uri, scor */ body.war .ldb-stadiu { display: inline-flex; align-items: center; gap: var(--p1); min-height: 26px; padding: 0 var(--p2); background: var(--gr3); border: 1px solid var(--c); color: var(--c); font: 600 11px var(--mono); text-transform: uppercase; letter-spacing: .04em; cursor: pointer; white-space: nowrap; } body.war .ldb-stadiu:hover { background: var(--c); color: #0C0D0F; } body.war .ldb-stadiu:hover .wr-punct { background: #0C0D0F; } .ldb-taguri { display: flex; flex-wrap: wrap; gap: var(--p1); align-items: center; } .ldb-tag { display: inline-flex; align-items: stretch; border: 1px solid var(--mgd); background: var(--gr3); } body.war .ldb-tag button { background: transparent; border: 0; color: var(--dispink); font: 11px var(--mono); min-height: 24px; padding: 0 var(--p2); cursor: pointer; } body.war .ldb-tag .ldb-tag-f:hover { background: var(--mgd); } body.war .ldb-tag .ldb-tag-x { padding: 0 var(--p1); color: var(--dispink2); border-left: 1px solid var(--disprule); } body.war .ldb-tag .ldb-tag-x:hover { color: var(--rdd); } body.war .ldb-tag-add { background: transparent; border: 1px dashed var(--ink3); color: var(--dispink2); font: 11px var(--mono); min-height: 24px; padding: 0 var(--p2); cursor: pointer; } body.war .ldb-tag-add:hover { color: var(--dispink); border-color: var(--dispink2); } .ldb-tag-in { width: 130px; min-height: 26px; font: 12px var(--mono); } .ldb-scor { position: relative; display: inline-flex; align-items: center; gap: var(--p2); min-width: 54px; } .ldb-scor b { font: 600 14px var(--mono); color: var(--dispink); font-variant-numeric: tabular-nums; } .ldb-scor i { display: block; height: 6px; background: var(--yed); min-width: 2px; max-width: 44px; } .ldb-scor-nul, .ldb-nul { color: var(--dispink2); font: 12px var(--mono); } .ldb-bio { font-size: 12px; line-height: 1.4; color: var(--dispink); overflow-wrap: anywhere; } .ldb-sub { font: 11px var(--mono); color: var(--dispink2); overflow-wrap: anywhere; } .ldb-motiv { font-size: 12px; line-height: 1.4; color: var(--rdd); overflow-wrap: anywhere; } a.ldb-handle { font: 600 13px var(--mono); color: var(--dispink); text-decoration: none; white-space: nowrap; } a.ldb-handle:hover { color: var(--or); text-decoration: underline; } body.war .ldb-fisa { min-height: 30px; padding: 0 var(--p3); border: 1px solid var(--ink3); background: transparent; color: var(--dispink); font-weight: 600; cursor: pointer; } body.war .ldb-fisa:hover { background: var(--gr3); border-color: var(--dispink2); } /* tabel */ .ldb-tabel-scroll { overflow-x: auto; border: 1px solid var(--disprule); } .ldb-tabel { width: 100%; min-width: 1240px; border-collapse: collapse; font-size: 13px; } body.war .ldb-tabel th, body.war .ldb-tabel td { font-family: inherit; padding: var(--p2) var(--p3); border-bottom: 1px solid var(--disprule); text-align: left; vertical-align: top; color: var(--dispink); } body.war .ldb-tabel thead th { background: var(--gr3); position: sticky; top: 0; white-space: nowrap; } body.war .ldb-tabel .ldb-c-handle, body.war .ldb-tabel .ldb-c-mic { white-space: nowrap; } body.war .ldb-tabel .ldb-c-mic { font: 11px var(--mono); color: var(--dispink2); } .ldb-c-despre { min-width: 230px; max-width: 320px; } .ldb-c-motiv { min-width: 170px; max-width: 260px; } .ldb-c-taguri { min-width: 150px; } .ldb-rand { border-left: 3px solid var(--c); } .ldb-rand.respins { background: color-mix(in srgb, var(--rdd) 6%, transparent); } .ldb-rand:hover { background: var(--gr2); } body.war .ldb-sort { background: transparent; border: 0; padding: var(--p1) 0; min-height: 28px; font: 600 11px var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--dispink2); cursor: pointer; } body.war .ldb-sort:hover, body.war .ldb-sort.activ { color: var(--or); } .ldb-th { font: 600 11px var(--mono); color: var(--dispink2); text-transform: uppercase; letter-spacing: .06em; } /* table Kanban */ .ldb-tabla { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(225px, 1fr); gap: var(--p3); overflow-x: auto; padding-bottom: var(--p2); } .ldb-col { border: 1px solid var(--disprule); border-top: 3px solid var(--c); background: var(--gr); min-height: 160px; display: flex; flex-direction: column; } .ldb-col.peste { background: var(--gr3); outline: 2px dashed var(--c); } .ldb-col-cap { display: flex; justify-content: space-between; padding: var(--p2) var(--p3); font: 600 12px var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--c); } .ldb-col-corp { display: flex; flex-direction: column; gap: var(--p2); padding: var(--p2); } .ldb-card { border: 1px solid var(--disprule); border-left: 4px solid var(--c); background: var(--gr2); padding: var(--p3); display: flex; flex-direction: column; gap: var(--p2); min-width: 0; cursor: pointer; } .ldb-card[draggable="true"] { cursor: grab; } .ldb-card.tras { opacity: .4; } .ldb-card:hover { background: var(--gr3); } .ldb-card-sus, .ldb-card-jos { display: flex; justify-content: space-between; align-items: center; gap: var(--p2); flex-wrap: wrap; } .ldb-gol-col, .ldb-gol { margin: 0; font: 11px var(--mono); color: var(--dispink2); text-align: center; } @media (max-width: 1280px) { .ldb-db { grid-template-columns: 1fr; } .ldb-lat { position: static; } #ldb-metrici { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); } #ldb-grafice { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); } .ldb-lat .ldb-lat-cap { grid-column: 1 / -1; } .ldb-mij { order: -1; } } /* ═══════ T324 — ACASA pe ecran ultralat: widget-uri pe laturile scenei ═══════ >=1800px: [calendare | scena | task-uri + cifre]. Sub prag: scena sus, cele doua coloane dedesubt (doua una langa alta, apoi una sub alta pe ecran ingust) — restul Acasa nu se atinge. Prefix `wax-`. Culorile vin din `.wr-f-` (--c), ca peste tot in War Room. */ .wax-hero { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--p4); align-items: start; margin-bottom: var(--p6); } .wax-hero > .wr-scena { grid-column: 1 / -1; order: -1; } .wax-col { display: flex; flex-direction: column; gap: var(--p4); min-width: 0; } .wax-col .wr-panou { margin: 0; } body.wr-scena-mod .wax-col { display: none; } body.wr-scena-mod .wax-hero { display: block; margin-bottom: 0; } @media (max-width: 900px) { .wax-hero { grid-template-columns: minmax(0, 1fr); } } @media (min-width: 1800px) { .wax-hero { grid-template-columns: minmax(340px, 1fr) minmax(0, 1.7fr) minmax(340px, 1fr); align-items: stretch; } .wax-hero > .wr-scena { grid-column: auto; order: 0; } /* coloanele nu cresc scena: inaltimea lor e plafonata la a scenei, restul deruleaza in ele */ .wax-col { max-height: clamp(520px, 82vh, 980px); min-height: 0; } .wax-panou { display: flex; flex-direction: column; min-height: 0; flex: 1 1 0; } .wax-lista, #wax-trafic, #wax-leaduri { overflow-y: auto; min-height: 0; } .wax-ceas-panou { flex: none; } } .wax-panou { padding-bottom: var(--p4); } .wax-nr { margin-left: auto; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; color: var(--dispink2); text-transform: uppercase; } .wax-ceas-panou { display: flex; flex-direction: column; gap: var(--p1); } .wax-ceas { font-family: var(--mono); font-weight: 600; font-size: clamp(34px, 3.2vw, 60px); line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--dispink); } .wax-data { font-family: var(--mono); font-size: 13px; letter-spacing: .08em; color: var(--dispink2); text-transform: capitalize; } .wax-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--p2); } .wax-lista ul { list-style: none; margin: 0; padding: 0; } .wax-gol { margin: 0; padding: var(--p3) 0; font-size: 13px; line-height: 1.45; color: var(--dispink2); list-style: none; } .wax-mai, .wax-film-sep { list-style: none; padding: var(--p2) 0; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink2); } .wax-sub { margin: var(--p3) 0 var(--p2); font-family: var(--mono); font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--dispink2); } .wax-sub:first-child { margin-top: 0; } /* task-uri */ .wax-task { padding: var(--p2) var(--p3); background: var(--gr2); border: 1px solid var(--disprule); border-left: 3px solid var(--ink3); display: flex; flex-direction: column; gap: var(--p2); } .wax-task-sus { display: flex; align-items: baseline; gap: var(--p2); min-width: 0; } .wax-task-titlu { flex: 1; min-width: 0; font-size: 13px; line-height: 1.35; color: var(--dispink); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .wax-task-jos { display: flex; align-items: center; justify-content: space-between; gap: var(--p2); flex-wrap: wrap; } .wax-task-act { display: inline-flex; align-items: center; gap: var(--p1); } .wax-p { flex: none; font-family: var(--mono); font-size: 11px; font-weight: 600; padding: 1px 6px; border: 1px solid var(--c); color: var(--c); } .wax-p-1 { --c: var(--rdd); } .wax-p-2 { --c: var(--ord); } .wax-p-3 { --c: var(--yed); } .wax-p-4 { --c: var(--gnd); } .wax-p-5 { --c: var(--ink3); } .wax-task:has(.wax-p-1) { border-left-color: var(--rdd); } .wax-task:has(.wax-p-2) { border-left-color: var(--ord); } .wax-task:has(.wax-p-3) { border-left-color: var(--yed); } .wax-task:has(.wax-p-4) { border-left-color: var(--gnd); } body.war .wax-sel { width: auto; min-width: 56px; flex: none; min-height: 28px; font: 600 12px var(--mono); padding: 0 var(--p2); background: var(--gr3); color: var(--dispink); border: 1px solid var(--ink3); cursor: pointer; } body.war .wax-btn { min-height: 28px; padding: 0 var(--p3); font: 600 12px var(--mono); background: transparent; color: var(--dispink); border: 1px solid var(--ink3); cursor: pointer; } body.war .wax-btn:hover { border-color: var(--dispink); } body.war .wax-btn--primar { background: var(--or); border-color: var(--or); color: #0C0D0F; } body.war .wax-btn--gata { border-color: var(--gnd); color: var(--gnd); } body.war .wax-btn--gata:hover { background: var(--gnd); color: #0C0D0F; } body.war .wax-btn:disabled, body.war .wax-sel:disabled { opacity: .5; cursor: progress; } /* cifre (site / social / lead-uri) */ .wax-cifre { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: var(--p2); } .wax-cifra { display: flex; flex-direction: column; gap: 2px; padding: var(--p2) var(--p3); background: var(--gr2); border: 1px solid var(--disprule); border-top: 2px solid var(--c); } .wax-cifra b { font-family: var(--mono); font-size: 22px; font-weight: 600; line-height: 1.1; color: var(--dispink); font-variant-numeric: tabular-nums; } .wax-cifra span { font-size: 12px; color: var(--dispink2); } .wax-cifra i { font-style: normal; font-size: 11px; color: var(--dispink2); opacity: .8; } /* calendar social + de filmat */ .wax-zi { list-style: none; border-top: 1px solid var(--disprule); padding-top: var(--p2); } .wax-zi:first-child { border-top: 0; padding-top: 0; } .wax-zi-cap { display: flex; justify-content: space-between; gap: var(--p2); font-family: var(--mono); font-size: 12px; letter-spacing: .06em; color: var(--dispink2); text-transform: uppercase; margin-bottom: var(--p1); } .wax-zi-cap b { color: var(--dispink); font-weight: 600; } .wax-zi--azi .wax-zi-cap span { color: var(--or); } .wax-post, .wax-film { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: var(--p2); align-items: baseline; padding: var(--p1) 0; list-style: none; } .wax-film { grid-template-columns: 116px minmax(0, 1fr) auto; } .wax-ora, .wax-film-d { font-family: var(--mono); font-size: 13px; font-weight: 600; color: var(--dispink); font-variant-numeric: tabular-nums; } .wax-film-d { font-size: 11px; font-weight: 500; letter-spacing: .04em; color: var(--dispink2); text-transform: uppercase; } .wax-post-t, .wax-film-t { min-width: 0; font-size: 13px; color: var(--dispink); } .wax-film-t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .wax-post-t em { display: block; font-style: normal; font-size: 12px; color: var(--dispink2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .wax-plat { font-family: var(--mono); font-size: 11px; padding: 0 5px; border: 1px solid var(--ink3); color: var(--dispink2); margin-right: 4px; } /* T324: `.wrap` din War Room are plafon 1800px (style.css) — pe 3440px scena + coloanele ar sta intr-o banda ingusta la mijloc. Doar cand Acasa e fila vizibila, plafonul se ridica. */ @media (min-width: 1800px) { body.war .wrap:has(> #tab-acasa:not([hidden])) { max-width: 3400px; } } @media (min-width: 1800px) { .wax-col--dr .wax-panou:first-child { flex: 2.2 1 0; } /* task-urile sunt lista principala a coloanei */ } @media (min-width: 1800px) { .wax-col--dr .wax-panou:first-child { flex: 2 1 0; } .wax-col--dr .wax-panou:nth-child(2) { flex: 1.7 1 0; } .wax-col--dr .wax-panou:nth-child(3) { flex: none; } /* lead-uri: 4 cifre, nu deruleaza */ .wax-col--dr .wax-cifra { flex: none; } } @media (max-width: 1799px) { .wax-lista--taskuri { max-height: 520px; overflow-y: auto; } /* sub scena, lista de task-uri deruleaza, nu lungeste pagina */ } /* ── fila „Ce e nou" (2-Oct-2026, war-noutati.js) ── */ #tab-noutati .wr-rand.nou-rand { grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--p2) var(--p4); padding: var(--p3) 0 var(--p3) var(--p3); border-left: 3px solid var(--c); } #tab-noutati .nou-rand .wr-rand-t { font-family: var(--sans); font-size: 15px; line-height: 1.45; } #tab-noutati .nou-rand .wr-rand-d { text-align: right; line-height: 1.6; } #tab-noutati .nou-ce { font-weight: 400; color: var(--dispink2); font-size: 14px; } #tab-noutati .nou-rand .punte-nota { font-family: var(--mono); font-size: 12px; font-weight: 400; } #tab-noutati .nou-rand a { color: var(--dispink); text-decoration: underline; text-underline-offset: 3px; } #tab-noutati .nou-stare { color: var(--c); border-color: var(--c); margin-left: var(--p1); vertical-align: 2px; } #tab-noutati .nou-form { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: var(--p2) var(--p3); margin: 0; } #tab-noutati .nou-bifa { display: inline-flex; align-items: center; gap: var(--p1); cursor: pointer; color: var(--dispink); white-space: nowrap; } #tab-noutati .nou-bifa input { width: 18px; height: 18px; accent-color: var(--gnd); } #tab-noutati .nou-nota { flex: 1 1 260px; min-width: 0; } #tab-noutati .nou-pas { font-weight: 400; color: var(--dispink); font-size: 14px; } #tab-noutati .nou-interne { margin-top: var(--p6); border-top: 1px solid var(--disprule); padding-top: var(--p3); } #tab-noutati .nou-interne summary { cursor: pointer; color: var(--dispink2); font-size: 13px; letter-spacing: .08em; text-transform: uppercase; padding: var(--p2) 0; } #tab-noutati .nou-intern { padding: var(--p2) 0 var(--p2) var(--p3); border-left: 3px solid var(--disprule); font-size: 14px; line-height: 1.45; color: var(--dispink2); overflow-wrap: anywhere; } #tab-noutati .nou-intern .wr-pila { white-space: normal; max-width: 100%; display: inline-block; margin: 2px 0 2px var(--p1); } #tab-noutati .nou-intern b { color: var(--dispink); font-weight: 600; } #tab-noutati .nou-zi { margin: var(--p6) 0 var(--p2); } #tab-noutati .nou-filtru[aria-pressed="true"] { color: var(--dispink); border-color: var(--dispink); } @media (max-width: 700px) { #tab-noutati .wr-rand.nou-rand { grid-template-columns: minmax(0, 1fr); } #tab-noutati .nou-rand .wr-rand-d { text-align: left; } } /* ── „Dă acces clientului" (2-Oct-2026), pe Acasa, sub panoul clientului ales ── Aceleasi piese ca Leads Machine (punte-form, punte-nota, punte-lista); aici doar culorile pe fundalul de display si campul cu linkul, care trebuie sa se poata citi pana la capat. */ #wr-acces-client .punte-nota { color: var(--dispink2); margin: 0 0 var(--p3); min-height: 1em; } #wr-acces-client .punte-nota.rau { color: var(--rd, #ff6b5e); } #wr-acces-client .wr-acces-link { margin: 0 0 var(--p4); } #wr-acces-client #wr-acces-link { font-family: var(--mono); font-size: 12px; flex: 1 1 320px; } #wr-acces-client table.punte-lista td { padding-right: var(--p3); overflow-wrap: anywhere; } /* ── fila „Pâlnii" (2-Oct-2026, war-palnii.js) ── Desktop: pașii pe un rând, fiecare cu bară proporțională (--lat). Sub 900px: vertical, un pas pe rând. Pasul cu cea mai mare pierdere: chenar portocaliu + etichetă (nu doar culoare). */ #tab-palnii .pal-panou { margin-top: var(--p4); } #tab-palnii .pal-scop { margin: 0 0 var(--p4); font-size: 12px; color: var(--dispink2); } #tab-palnii .pal-pasi { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--p3); grid-template-columns: repeat(var(--n), minmax(0, 1fr)); } #tab-palnii .pal-pas { display: flex; flex-direction: column; gap: var(--p2); min-width: 0; padding: var(--p3); border: 1px solid var(--disprule); border-radius: var(--r0); position: relative; } #tab-palnii .pal-pas + .pal-pas::before { content: "›"; position: absolute; left: calc(var(--p3) * -1.1); top: var(--p3); color: var(--dispink2); font-family: var(--mono); } #tab-palnii .pal-pas--pierdere { border-color: var(--or); box-shadow: inset 0 -3px 0 var(--or); } #tab-palnii .pal-et { font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--dispink); overflow-wrap: anywhere; } #tab-palnii .pal-cifra { font-family: var(--mono); font-size: 26px; font-weight: 600; line-height: 1.1; color: var(--c); } #tab-palnii .pal-cifra--nu { font-size: 15px; font-weight: 500; color: var(--dispink2); } #tab-palnii .pal-bara { display: block; height: 12px; background: repeating-linear-gradient(90deg, var(--disprule) 0 10px, transparent 10px 12px); } #tab-palnii .pal-bara i { display: block; height: 100%; width: var(--lat); background: repeating-linear-gradient(90deg, var(--c) 0 10px, transparent 10px 12px); } #tab-palnii .pal-pas--gol .pal-bara { opacity: .4; } #tab-palnii .pal-conv { font-size: 12px; color: var(--dispink2); line-height: 1.35; } #tab-palnii .pal-conv b { color: var(--dispink); font-family: var(--mono); font-size: 13px; } #tab-palnii .pal-sub, #tab-palnii .pal-motiv { font-size: 11px; color: var(--dispink2); line-height: 1.35; overflow-wrap: anywhere; } #tab-palnii .pal-pierdere { align-self: flex-start; font-family: var(--mono); font-size: 11px; color: var(--dispink); border: 1px solid var(--or); padding: 1px var(--p2); border-radius: var(--r0); } #tab-palnii .pal-nota { margin-top: var(--p4); } @media (max-width: 900px) { #tab-palnii .pal-pasi { grid-template-columns: minmax(0, 1fr); } #tab-palnii .pal-pas + .pal-pas::before { content: "↓"; left: auto; right: var(--p3); top: var(--p2); } } /* ── fila „Decizii client" (3-Oct-2026, war-decizii.js) ── Randul are doua piese (text lung + data), nu patru: fara asta grila de 84px ingusta textul. */ #tab-decizii .wr-rand { grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: var(--p2) var(--p4); padding: var(--p3) 0; } #tab-decizii .wr-rand-t { font-family: var(--sans); font-size: 15px; line-height: 1.45; } #tab-decizii .wr-rand-d { text-align: right; line-height: 1.6; } #tab-decizii .punte-nota { font-family: var(--mono); font-size: 12px; font-weight: 400; } #tab-decizii .wr-pila { margin-right: var(--p1); } #tab-decizii a { color: var(--dispink); text-decoration: underline; text-underline-offset: 3px; } #tab-decizii .nou-filtru[aria-pressed="true"] { color: var(--dispink); border-color: var(--dispink); } @media (max-width: 700px) { #tab-decizii .wr-rand { grid-template-columns: minmax(0, 1fr); } #tab-decizii .wr-rand-d { text-align: left; } #tab-decizii .punte-form input[type="text"] { flex: 1 1 100%; width: 100%; min-height: 44px; } } /* ── fila „Sales" (3-Oct-2026, war-sales.js) ── Propuneri + Contracte, pe panou negru. Formularul de contract: grila de campuri se strange pe o coloana sub 900px; previzualizarea e un iframe alb (contractul e o foaie de tiparit). */ #tab-sales .sal-panou { margin-top: var(--p4); } #tab-sales .punte-nota { color: var(--dispink2); } #tab-sales .punte-nota.rau { color: var(--rd, #ff6b5e); font-weight: 600; } #tab-sales a { color: var(--dispink); text-decoration: underline; text-underline-offset: 3px; } #tab-sales .sal-loc-gol { border: 1px dashed var(--or); padding: var(--p3) var(--p4); margin: 0 0 var(--p4); color: var(--dispink); } #tab-sales .sal-loc-gol p { margin: var(--p1) 0 0; font-size: 13px; color: var(--dispink2); } #tab-sales .sal-stare { display: inline-block; font-family: var(--mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; padding: 1px var(--p2); border: 1px solid var(--disprule); color: var(--dispink2); } #tab-sales .sal-stare--publicata { color: var(--gn); border-color: var(--gn); } #tab-sales .sal-stare--gol { color: var(--or); border-color: var(--or); } #tab-sales .sal-link { white-space: nowrap; } #tab-sales .sal-form { display: block; } #tab-sales .sal-alege { display: flex; flex-wrap: wrap; gap: var(--p3); } #tab-sales .sal-alege label, #tab-sales .sal-camp { display: flex; flex-direction: column; gap: var(--p1); font-family: var(--mono); font-size: 11px; letter-spacing: .04em; color: var(--dispink2); } #tab-sales .sal-alege select, #tab-sales .sal-camp input { flex: none; } #tab-sales .sal-alege select { min-width: 200px; } #tab-sales .sal-campuri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--p3); margin: var(--p3) 0; } #tab-sales .sal-form input, #tab-sales .sal-form select, #tab-sales .sal-sel-stare { background: var(--disp); color: var(--dispink); border: 1px solid var(--disprule); padding: var(--p2); font: inherit; font-size: 14px; min-height: 36px; } #tab-sales .sal-form input::placeholder { color: var(--dispink2); } #tab-sales .sal-act { display: flex; gap: var(--p3); flex-wrap: wrap; } #tab-sales .sal-sub { margin: var(--p6) 0 var(--p2); font-size: 14px; color: var(--dispink); } #tab-sales .sal-iframe { width: 100%; height: 640px; border: 1px solid var(--disprule); background: #fff; margin-top: var(--p3); } @media (max-width: 900px) { #tab-sales .sal-campuri { grid-template-columns: minmax(0, 1fr); } #tab-sales .sal-alege { flex-direction: column; } #tab-sales .sal-alege select, #tab-sales .sal-form input { width: 100%; min-height: 44px; } #tab-sales .sal-act button { flex: 1 1 100%; min-height: 44px; } #tab-sales .sal-iframe { height: 480px; } } #ld-oglinda .wr-an-probleme { list-style: none; } /* semnul ✗/✓/? tine locul bulinei */ /* ── Secțiuni adresabile (war-sectiuni.js, 5-Oct-2026) ───────────────────────────────────── Fără `#fila/sectiune` în adresă nu apare nicio clasă de aici: fila arată ca până acum. */ .wr-sect-ascuns { display: none !important; } /* (n3 Univers, 6-Oct, Ali: „ecranul cu motoare e îngustat”) Sub 1100px grila .wr-diag are 2 coloane și fiecare panou stă pe una (@media de sus + `span 1 !important` de la Sistem). Iframe-ul din panoul Univers are ~1040px chiar pe un ecran de 1440, deci e mereu sub prag. Cu o secțiune activă frații ascunși lasă panoul pe jumătate de rând, cu golul în dreapta (BM-30.9 la 479 din 974px). O grilă cu frați ascunși = ce a rămas e secțiunea: panourile rămase iau rândul întreg. Regula e scrisă o dată, pentru orice filă; a doua linie are un #tab- ca să bată `span 1 !important` din blocurile pe file (Sistem, Trafic/Baza de date, Leads). */ @media (max-width: 1100px) { .wr-sect-activ .wr-diag:has(> .wr-sect-ascuns) > :not(.wr-sect-ascuns), .wr-sect-activ:is(#tab-procese, #tab-capabilitati, #tab-operare, #tab-index, #tab-trafic-site, #tab-trafic-social, #tab-registru, #tab-leaduri) .wr-diag:has(> .wr-sect-ascuns) > :not(.wr-sect-ascuns) { grid-column: 1 / -1 !important; } } .wr-sect-file { display: flex; flex-wrap: wrap; gap: var(--p2); margin: var(--p3) 0 var(--p4); border-bottom: 1px solid var(--linie, rgba(0,0,0,.18)); } .wr-sect-file a { padding: var(--p2) var(--p4); text-decoration: none; color: inherit; font-weight: 600; border-bottom: 3px solid transparent; margin-bottom: -1px; } .wr-sect-file a[aria-selected="true"] { border-bottom-color: currentColor; } .wr-sect-file a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; } .wr-sect-gol { margin: var(--p4) 0; } /* (lot 3) bara de secțiuni, War Room deschis normal: o secțiune deodată */ .wr-sect-bara { align-items: center; gap: var(--p2); padding-bottom: 0; margin-bottom: var(--p3); } .wr-sect-bara::before { content: "Secțiuni"; font: 500 11px/1 var(--mono, ui-monospace, monospace); letter-spacing: .14em; text-transform: uppercase; opacity: .6; margin-right: var(--p2); } .wr-sect-bara a { border-bottom-width: 3px; } .wr-sect-bara a[aria-current="true"] { border-bottom-color: currentColor; } .wr-sect-bara a[data-sectiune="toata"] { margin-left: auto; font-weight: 500; opacity: .75; } @media (max-width: 700px) { .wr-sect-bara { flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; gap: 0; } .wr-sect-bara::-webkit-scrollbar { display: none; } .wr-sect-bara a { flex: none; white-space: nowrap; padding: var(--p2) var(--p3); } .wr-sect-bara a[data-sectiune="toata"] { margin-left: 0; } } /* Campanii email, 5-Oct-2026: etichete Automat/Unică + limbă, filtre deasupra listei și detaliul campaniei în panoul lateral comun (WR.peek). */ .eml-filtre { display: flex; flex-wrap: wrap; gap: var(--p2); align-items: center; margin: 0 0 var(--p3); } .eml-filtre select { width: auto; min-width: 0; } .eml-tip { display: inline-block; padding: 1px 7px; margin: 0 4px 4px 0; border: 1px solid var(--c, var(--disprule)); border-radius: 2px; font-family: var(--mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--c, var(--dispink2)); } .eml-limba { display: inline-block; padding: 1px 5px; margin: 0 4px 4px 0; border-radius: 2px; background: var(--gr2); font-family: var(--mono); font-size: 10px; letter-spacing: .08em; color: var(--dispink); } /* brandul campaniei (migrația 0337): „Vivid Alex · RO” / „Boosted Mode · EN”, înainte de clic */ .eml-brand { display: inline-block; padding: 1px 7px; margin: 0 4px 4px 0; border-radius: 2px; background: var(--dispink); font-family: var(--mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--gr2); } .eml-rand.deschis { outline: 1px solid var(--or, #F04E23); outline-offset: -1px; } .eml-automat { margin: var(--p2) 0 var(--p3); padding: var(--p2) var(--p3); border-left: 2px solid var(--cyd); background: var(--gr2); } .eml-automat p { margin: 6px 0 0; line-height: 1.5; } .eml-standard { margin: var(--p2) 0; } .eml-d-subiect { display: flex; flex-direction: column; gap: 2px; margin-bottom: var(--p2); } .wr-peek .eml-d-preview { color-scheme: light; width: 100%; height: 640px; border: 1px solid var(--disprule); background: #E7E5E0; display: block; } @media (max-width: 720px) { .wr-peek .eml-d-preview { height: 520px; } } /* ── Inbox pe două coloane + compunere (lotul 12, 5-Oct-2026) ────────────────────────────── Lista în stânga rămâne pe loc; mesajul se deschide în dreapta (sticky), iar ↑/↓ schimbă mesajul fără să piardă lista. Pe telefon: întâi lista, apoi ecranul de citire cu „← Înapoi”. */ #eml-inbox-panou .wr-panou-cap button.primar { padding: 6px 14px; } .eml-ibx-vederi { display: inline-flex; margin: var(--p3) 0; border: 1px solid var(--disprule); border-radius: 6px; overflow: hidden; } .eml-ibx-vederi button { border: 0; border-radius: 0; background: transparent; color: var(--dispink2); padding: 6px 14px; font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; box-shadow: none; } .eml-ibx-vederi button + button { border-left: 1px solid var(--disprule); } .eml-ibx-vederi button[aria-pressed="true"] { background: var(--gr3); color: var(--dispink); } .eml-ibx-nr:not(:empty) { margin-left: 4px; color: var(--or); } .eml-ibx { display: grid; grid-template-columns: minmax(300px, 2fr) minmax(0, 3fr); gap: var(--p4); align-items: start; } .eml-ibx[hidden], .eml-ibx-vederi[hidden], .eml-compune[hidden] { display: none; } .eml-ibx-lista { min-width: 0; max-height: calc(100vh - 200px); overflow-y: auto; border: 1px solid var(--disprule); border-radius: 6px; } .eml-ibx-lista > .wr-indisponibil { padding: var(--p4); margin: 0; } .eml-ibx-rand { grid-template-columns: 56px minmax(0, 1fr) auto; gap: var(--p2); padding: var(--p2) var(--p3); cursor: pointer; border-left: 2px solid transparent; } .eml-ibx-rand:hover { background: var(--gr2); } .eml-ibx-rand:focus-visible { outline: 1px solid var(--or); outline-offset: -1px; } .eml-ibx-rand.deschis { background: var(--gr3); border-left-color: var(--or); } .eml-ibx-rand .wr-rand-t { display: flex; flex-direction: column; gap: 2px; font-weight: 400; } .eml-ibx-de { color: var(--dispink2); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .eml-ibx-sub { color: var(--dispink); font-weight: 600; } .wr-f-gn .eml-ibx-sub::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: var(--or); vertical-align: middle; } .eml-ibx-extras { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .eml-ibx-citire { position: sticky; top: var(--p4); min-width: 0; min-height: 420px; padding: var(--p4); border: 1px solid var(--disprule); border-radius: 6px; background: var(--gr2); } .eml-ibx-nimic { margin: 0; padding: var(--p12) var(--p4); text-align: center; color: var(--dispink2); font-size: 13px; } .eml-ibx-inapoi { display: none; margin-bottom: var(--p3); } .eml-ibx-titlu { margin: 0 0 var(--p1); font-size: 18px; line-height: 1.3; color: var(--dispink); overflow-wrap: anywhere; } .eml-ibx-act { margin: var(--p3) 0; } .eml-ibx-raspunsuri { list-style: none; margin: 0 0 var(--p3); padding: var(--p2) var(--p3); border-left: 2px solid var(--or); background: var(--gr3); display: flex; flex-direction: column; gap: var(--p1); } .eml-ibx-ciorna { display: flex; flex-wrap: wrap; align-items: center; gap: var(--p2); } .eml-ibx-corp { color-scheme: light; display: block; width: 100%; height: calc(100vh - 320px); min-height: 420px; border: 1px solid var(--disprule); border-radius: 4px; background: #fff; } .eml-ibx-text { white-space: pre-wrap; overflow-wrap: anywhere; max-width: 68ch; padding: var(--p4); border: 1px solid var(--disprule); border-radius: 4px; background: var(--gr); color: var(--dispink); font-size: 15px; line-height: 1.6; max-height: calc(100vh - 320px); overflow-y: auto; } .eml-compune { margin-top: var(--p3); } .eml-cmp-cap { display: flex; align-items: center; gap: var(--p3); margin-bottom: var(--p3); } .eml-cmp-cap h3 { margin: 0; font-size: 16px; color: var(--dispink); } .eml-cmp-campuri { display: grid; grid-template-columns: 1fr 1fr; gap: var(--p3); margin-bottom: var(--p3); } .eml-cmp-camp { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .eml-cmp-camp--lat { grid-column: 1 / -1; } .eml-cmp-camp input[readonly] { opacity: .75; } .eml-cmp-vizual { display: inline-flex; flex-wrap: wrap; gap: var(--p2); } .eml-cmp-vizual button { padding: 6px 14px; } .eml-cmp-vizual button[aria-checked="true"] { background: var(--or); border-color: var(--or); color: var(--gr); } .eml-cmp-grila { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--p4); align-items: start; } .eml-cmp-editor { display: flex; flex-direction: column; gap: var(--p2); min-width: 0; } .eml-cmp-unelte { display: flex; flex-wrap: wrap; gap: var(--p1); } .eml-cmp-unelte button { padding: 4px 10px; font-size: 12px; } .eml-cmp-editor textarea { width: 100%; min-height: 420px; font-family: var(--mono); font-size: 13px; line-height: 1.55; resize: vertical; } .eml-cmp-ajutor summary { cursor: pointer; font-size: 12px; color: var(--dispink2); } .eml-cmp-ajutor pre { margin: var(--p2) 0 0; padding: var(--p3); background: var(--gr3); border-radius: 4px; font-size: 12px; color: var(--dispink2); white-space: pre-wrap; } .eml-cmp-prev { display: flex; flex-direction: column; gap: var(--p2); min-width: 0; position: sticky; top: var(--p4); } .eml-cmp-prev iframe { color-scheme: light; display: block; width: 100%; height: 640px; border: 1px solid var(--disprule); border-radius: 4px; background: #E7E5E0; } .eml-cmp-actiuni { margin-top: var(--p4); } .eml-modal[hidden] { display: none; } .eml-modal { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: var(--p4); } .eml-modal-fond { position: absolute; inset: 0; background: rgba(0, 0, 0, .62); } .eml-modal-cutie { position: relative; width: min(480px, 100%); padding: var(--p6); border: 1px solid var(--disprule); border-radius: 8px; background: var(--gr2); box-shadow: 0 24px 64px rgba(0, 0, 0, .5); } .eml-modal-cutie h3 { margin: 0 0 var(--p4); font-size: 17px; color: var(--dispink); } .eml-confirma-dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--p2) var(--p4); margin: 0 0 var(--p4); font-size: 13px; } .eml-confirma-dl dt { color: var(--dispink2); font-family: var(--mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; padding-top: 2px; } .eml-confirma-dl dd { margin: 0; color: var(--dispink); overflow-wrap: anywhere; } .eml-modal-cutie .punte-form { justify-content: flex-end; margin-top: var(--p4); } @media (max-width: 900px) { .eml-cmp-grila { grid-template-columns: minmax(0, 1fr); } .eml-cmp-prev { position: static; } .eml-cmp-prev iframe { height: 560px; } } @media (max-width: 720px) { .eml-ibx { grid-template-columns: minmax(0, 1fr); } .eml-ibx-lista { max-height: none; } .eml-ibx-citire { display: none; position: static; min-height: 0; padding: var(--p3); } .eml-ibx--citire .eml-ibx-lista { display: none; } .eml-ibx--citire .eml-ibx-citire { display: block; } .eml-ibx-inapoi { display: inline-flex; } .eml-ibx-corp { height: 70vh; min-height: 360px; } .eml-ibx-text { max-height: none; } .eml-cmp-campuri { grid-template-columns: minmax(0, 1fr); } .eml-cmp-editor textarea { min-height: 260px; } #eml-inbox-panou .wr-panou-cap { flex-wrap: wrap; } } /* ── Module sistem (ecrane-lot16, 6-Oct): war-module.js ─────────────────────────────── */ .md-cuprins { display: flex; flex-wrap: wrap; gap: var(--p2); align-items: baseline; margin: 0 0 var(--p4); } .md-cuprins .wr-serie { flex-basis: 100%; margin: var(--p2) 0 0; } .md-panou .wr-panou-cap .punte-nota { margin-left: auto; } .md-cifre { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--p2); margin: var(--p3) 0; } .md-cifra { border: 1px solid var(--rule); padding: var(--p2) var(--p3); display: flex; flex-direction: column; gap: 2px; min-width: 0; } .md-cifra b { font-size: 22px; font-variant-numeric: tabular-nums; color: var(--ink); overflow-wrap: anywhere; } .md-cifra span { font-family: var(--mono); font-size: 11px; color: var(--ink2); } .md-sub { margin: var(--p4) 0 var(--p2); font-size: 13px; color: var(--ink); } .md-decizie { margin: var(--p3) 0; padding: var(--p3); border-left: 3px solid var(--ye); background: color-mix(in srgb, var(--ye) 8%, transparent); font-size: 13px; color: var(--ink); } .md-eroare { border-left-color: var(--rd); background: color-mix(in srgb, var(--rd) 8%, transparent); } .md-fete { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: var(--p3); margin: var(--p3) 0; } .md-fata { margin: 0; border: 1px solid var(--rule); padding: var(--p3); text-align: center; } .md-fata svg.wr-ic { width: 72px; height: 72px; } .md-fata figcaption { font-family: var(--mono); font-size: 11px; color: var(--ink2); margin-top: var(--p2); } .md-leg { display: flex; flex-wrap: wrap; gap: var(--p2); margin: var(--p4) 0 0; } .md-leg code { font-size: 10px; } .md-panou .wr-rand-d { white-space: normal; overflow-wrap: anywhere; min-width: 0; } /* deschisă normal pe o secțiune (#module/), cuprinsul rămâne: e singura cale spre celelalte 23. În Univers (embed) se ascunde ca orice altceva din afara secțiunii. */ html:not(.wr-embed) #tab-module > .md-cuprins.wr-sect-ascuns { display: flex !important; } /* (ecrane-lot16) legăturile din cuprins și din panouri: pilule, nu linkuri albastre implicite */ .md-a { text-decoration: none; cursor: pointer; } .md-a:hover, .md-a:focus-visible { color: var(--ye); border-color: var(--ye); } /* ── Module › Reclame plătite (Meta Ads), panoul per cont (6-Oct-2026, war-meta-ads.js) ── Doar piese existente: .wr-legenda + .wr-btn-scena (selector de cont, perioadă), .wr-kpis--5, WR.tabel (derulează în .wr-tbl-scroll pe ecran îngust), .wr-lista, .md-decizie.md-eroare. */ #md-meta-ads .ma-conturi, #md-meta-ads .ma-per, #md-meta-ads .ma-camp-filtru { margin: var(--p3) 0; } .ma-cont-et { font-style: normal; text-transform: none; letter-spacing: 0; color: var(--dispink2); } .ma-meta { margin: 0 0 var(--p3); } .ma-kpis { margin: var(--p3) 0 var(--p4); } .ma-camp-nume { display: block; overflow-wrap: anywhere; } .ma-camp-nota, .ma-rez-et { display: block; font-size: 11px; margin-top: 2px; } .ma-limitari ul { margin: var(--p2) 0 0; padding-left: 1.2em; } .ma-limitari li { margin: 2px 0; overflow-wrap: anywhere; } /* pixeli si semnale: numele ocupa o coloana lata (84px rupea „Pixel Climb Again DC” pe 5 randuri), iar descrierea se rupe pe randuri in loc sa iasa din panou */ .ma-pixeli .wr-rand, .ma-semnale .wr-rand { grid-template-columns: minmax(150px, 26%) minmax(0, 1fr); align-items: start; } .ma-pixeli .wr-rand-d, .ma-semnale .wr-rand-d { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; } @media (max-width: 720px) { .ma-pixeli .wr-rand, .ma-semnale .wr-rand { grid-template-columns: minmax(0, 1fr); gap: var(--p1, 4px); } }