/* Panoul patronului (panou-client.js). Incarcat si in aplicatie (index.html), si in War Room
   (war.html), peste war.css: displayurile (wr-panou, wr-kpi, wr-hr) vin de acolo, aici sta
   doar asezarea si cele cateva piese noi (kanbanul, cronologia). Regula casei: corpul ia
   culoarea paginii (crem in aplicatie, gri in War Room); tot ce e cifra sta pe display negru. */
.pc { margin: var(--p8) 0; }
.pc[hidden] { display: none; }
.pc-cap { display: flex; align-items: baseline; flex-wrap: wrap; gap: var(--p2) var(--p4);
          margin-bottom: var(--p4); }
.pc-cap h2 { margin: 0; flex: 1 1 auto; font-weight: 800; letter-spacing: -.03em;
             font-size: clamp(22px, 2.4vw, 30px); text-wrap: balance; }
.pc-luna { font-family: var(--mono); font-size: 12px; letter-spacing: .14em; text-transform: uppercase; }

.pc-grila { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--p4);
            margin-top: var(--p4); }
.pc-grila > .pc-lat { grid-column: 1 / -1; }
.pc-panou .wr-panou-cap .pc-titlu { margin: 0; flex: 1 1 auto; min-width: 0; font-size: 12px;
  font-family: var(--mono); font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
  color: var(--dispink); }
.pc-panou { color: var(--dispink); }
.pc-panou a { color: var(--dispink); text-decoration: underline; text-decoration-color: var(--disprule);
              text-underline-offset: 3px; }
.pc-sub { margin: var(--p4) 0 var(--p2); font-family: var(--mono); font-size: 11px;
          letter-spacing: .14em; text-transform: uppercase; color: var(--dispink2); }
.pc-rand { margin: 0; font-family: var(--mono); font-size: 13px; color: var(--dispink2); }
.pc-rand b { color: var(--dispink); font-size: 18px; }

.pc-lista { margin: 0; padding: 0; list-style: none; counter-reset: pc; }
.pc-lista li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--p3);
               padding: var(--p2) 0; border-top: 1px solid var(--disprule); font-size: 13px; }
.pc-lista li::before { counter-increment: pc; content: counter(pc, decimal-leading-zero);
                       font-family: var(--mono); color: var(--dispink2); }
.pc-lista li span { overflow-wrap: anywhere; }
.pc-lista li b { font-family: var(--mono); color: var(--cyd, #43C7D6); }

/* Kanban: cinci etape. Doar de citit — niciun buton, nimic de tras. */
.pc-kanban { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--p3); }
.pc-col { min-width: 0; border-top: 2px solid var(--c); padding-top: var(--p2); }
.pc-col header { display: flex; justify-content: space-between; gap: var(--p2); align-items: baseline;
                 font-family: var(--mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
                 color: var(--dispink); margin-bottom: var(--p2); }
.pc-col header b { font-size: 20px; color: var(--c); letter-spacing: 0; font-variant-numeric: tabular-nums; }
.pc-col ul { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--p2); }
.pc-card { display: grid; gap: 2px; padding: var(--p2); border: 1px solid var(--disprule);
           border-radius: var(--r0); background: rgba(255, 255, 255, .02); }
.pc-motor { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; text-transform: uppercase;
            color: var(--c); }
.pc-card-t { font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.pc-card-d { font-family: var(--mono); font-size: 11px; color: var(--dispink2); }
.pc-col-gol { margin: var(--p2) 0 0; font-family: var(--mono); font-size: 12px; color: var(--dispink2); }

/* Cronologia: ce urmeaza in stanga, ce s-a livrat in dreapta, pe date. */
.pc-doua { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--p6); }
.pc-doua > div > .pc-sub:first-child { margin-top: 0; }
.pc-cron { margin: 0; padding: 0; list-style: none; }
.pc-cron li { display: grid; grid-template-columns: 96px 120px minmax(0, 1fr); gap: var(--p3);
              align-items: baseline; padding: var(--p2) 0; border-top: 1px solid var(--disprule); }
.pc-cron time { font-family: var(--mono); font-size: 12px; color: var(--dispink); white-space: nowrap; }
.pc-cron time i { font-style: normal; color: var(--dispink2); }
.pc-fel { font-family: var(--mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
          color: var(--c); }
.pc-fel::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px;
                  background: var(--c); box-shadow: 0 0 6px var(--c); vertical-align: 1px; }

@media (max-width: 1100px) {
  .pc-grila { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-kanban { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .pc-grila, .pc-doua { grid-template-columns: minmax(0, 1fr); }
  .pc-kanban { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-cron li { grid-template-columns: 96px minmax(0, 1fr); }
  .pc-cron .pc-card-t { grid-column: 1 / -1; }
}

/* Contorul „X de verificat" din capul panoului: ancora spre zona de jos. */
.pc-contor { display: inline-flex; align-items: baseline; gap: 6px; padding: 4px 12px; min-height: 32px;
             align-self: center; border: 1px solid currentColor; border-radius: var(--r0);
             font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase;
             text-decoration: none; color: inherit; }
.pc-contor b { font-size: 18px; letter-spacing: 0; font-variant-numeric: tabular-nums; }
.pc-contor--are { background: var(--disp); color: var(--ord, #F26B21); border-color: var(--ord, #F26B21); }
.pc-grila--sus, .pc-grila--grafice { margin-top: var(--p4); }
.pc-grila--grafice { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pc-grafic { min-width: 0; --gr-c: var(--c); }

/* De verificat: o carte pe postare, cu textul complet si toata media. */
.pc-ver .pc-verif { padding: var(--p4) 0; border-top: 1px solid var(--disprule); }
.pc-ver .pc-verif:first-of-type { border-top: 0; padding-top: 0; }
.pc-verif header { display: flex; align-items: baseline; gap: var(--p3); flex-wrap: wrap; }
.pc-verif h4 { margin: 0; font-size: 15px; line-height: 1.3; color: var(--dispink); overflow-wrap: anywhere; min-width: 0; }
.pc-meta { display: flex; flex-wrap: wrap; gap: var(--p2) var(--p4); margin: var(--p2) 0 var(--p3);
           font-family: var(--mono); font-size: 12px; color: var(--dispink2); }
.pc-meta .pc-cand b { color: var(--dispink); font-weight: 600; }
.pc-corp { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--p5, 20px); align-items: start; }
.pc-media { display: grid; gap: var(--p3); min-width: 0; }
.pc-video { width: 100%; max-height: 420px; background: #000; border-radius: var(--r0); }
.pc-poze { display: flex; gap: var(--p2); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--p2);
           scrollbar-width: thin; scrollbar-color: var(--disprule) transparent; -webkit-overflow-scrolling: touch; }
.pc-poza { margin: 0; flex: 0 0 min(78%, 320px); scroll-snap-align: start; display: grid; gap: 4px; }
.pc-poza img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: contain; background: var(--disp2);
               border: 1px solid var(--disprule); border-radius: var(--r0); }
.pc-poza figcaption { font-family: var(--mono); font-size: 11px; color: var(--dispink2); }
.pc-text .pc-sub { margin-top: 0; }
.pc-copy { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.55; color: var(--dispink);
           max-height: 420px; overflow-y: auto; padding-right: var(--p2); }
.pc-act { display: flex; flex-wrap: wrap; gap: var(--p2); margin-top: var(--p3); }
.pc-act[hidden], .pc-formular[hidden], .pc-eroare[hidden] { display: none; }
.pc-act button { min-height: 44px; padding: 0 var(--p4); }
.pc-formular { margin-top: var(--p3); display: grid; gap: var(--p2); }
.pc-formular label { display: grid; gap: var(--p2); font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
                     text-transform: uppercase; color: var(--dispink2); }
.pc-comentariu { width: 100%; box-sizing: border-box; resize: vertical; min-height: 84px; font: 14px/1.5 var(--sans);
                 padding: var(--p3); color: var(--ink); background: var(--cream, #F4EFE6); border-radius: var(--r0); }
.pc-eroare { margin: var(--p2) 0 0; font-size: 13px; color: var(--rdd, #E85842); }
.pc-nota-blocat { margin: var(--p2) 0 0; font-size: 12px; color: var(--dispink2); }
.pc-cereri { margin: 0; padding: 0; list-style: none; }
.pc-cereri li { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: var(--p1) var(--p3);
                padding: var(--p2) 0; border-top: 1px solid var(--disprule); }
.pc-cereri time { font-family: var(--mono); font-size: 12px; color: var(--dispink2); }
.pc-cereri q { grid-column: 2; font-size: 13px; color: var(--dispink); quotes: "„" "”"; overflow-wrap: anywhere; }

@media (max-width: 1100px) { .pc-grila--grafice { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) {
  .pc-grila--grafice { grid-template-columns: minmax(0, 1fr); }
  .pc-corp { grid-template-columns: minmax(0, 1fr); }
  .pc-act button { flex: 1 1 140px; }
  .pc-cap { align-items: center; }
}

/* De verificat: filtre, stare, previzualizarea textului (5-Oct-2026) */
.pc-filtre { display: flex; flex-wrap: wrap; gap: var(--p3); margin-bottom: var(--p3); }
.pc-filtre label { display: flex; flex-direction: column; gap: 4px; font: 12px/1.2 var(--mono); color: var(--dispink2); }
.pc-filtre select { min-height: 36px; padding: 0 var(--p2); background: var(--disp2, transparent); color: var(--dispink);
  border: 1px solid var(--disprule); border-radius: 6px; font: 14px var(--sans, inherit); }
.pc-stare { font: 12px/1 var(--mono); padding: 3px 8px; border: 1px solid var(--disprule); border-radius: 999px; }
.pc-stare--aprobat { border-color: var(--gn, currentColor); }
.pc-stare--respins, .pc-stare--modificari { border-color: var(--rd, currentColor); }
.pc-previz { margin-top: var(--p2); font-size: 13px; color: var(--dispink); }
.pc-previz summary { cursor: pointer; font: 12px var(--mono); color: var(--dispink2); }
.pc-previz ol { margin: var(--p2) 0 0; padding-left: 1.4em; }
.pc-previz li { margin-bottom: 4px; overflow-wrap: anywhere; }
.pc-previz i { color: var(--dispink2); font-style: normal; font: 11px var(--mono); margin-right: 6px; }
/* Paginarea „De verificat" (6-Oct-2026): 9 piese pe pagină, bara sus și jos. Înlocuiește
   „Încarcă mai multe". Pe mobil butoanele se întind, informația trece pe rândul ei. */
.pc-pagini { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--p2) var(--p3);
             margin: var(--p3) 0; padding: var(--p2) 0; border-top: 1px solid var(--disprule); border-bottom: 1px solid var(--disprule); }
.pc-pagini--sus { margin-top: 0; }
.pc-pag { min-height: 44px; padding: 0 var(--p4); }
.pc-pag[disabled] { opacity: .45; cursor: default; }
.pc-pag-info { font: 12px/1.3 var(--mono); color: var(--dispink2); text-align: center; }
.pc-pag-info b { color: var(--dispink); }
@media (max-width: 720px) {
  .pc-pag { flex: 1 1 0; padding: 0 var(--p2); }
  .pc-pag-info { order: -1; flex-basis: 100%; }
}

/* Aprobarea arată momentul (lotul 8, 5-Oct-2026): „Pleacă: marți 6-Oct, 19:00 · @cont" înainte
   de clic, câmpul opțional de alt moment (validat pe server) și confirmarea de după. Stare =
   culoare + cuvânt: motivul e scris, nu doar colorat. */
.pc-pleaca { margin-top: var(--p3); padding: var(--p3); border: 1px solid var(--disprule); border-radius: var(--r0);
             background: var(--disp2); }
.pc-pleaca-rand { margin: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--p2) var(--p3); }
.pc-pleaca-t { font-family: var(--mono); font-size: 13px; color: var(--dispink2); }
.pc-pleaca-cand { color: var(--dispink); font-size: 15px; font-weight: 600; font-family: var(--sans); }
.pc-pleaca-cont { color: var(--dispink); }
.pc-pleaca-motiv { font-family: var(--mono); font-size: 11px; letter-spacing: .06em; padding: 2px 6px;
                   border: 1px solid var(--disprule); border-radius: 999px; color: var(--dispink2); }
.pc-pleaca-motiv--plan { color: var(--gnd, #3FB37F); border-color: currentColor; }
.pc-pleaca-motiv--plan_trecut, .pc-pleaca-motiv--plan_ocupat { color: var(--yed, #E8B53A); border-color: currentColor; }
.pc-pleaca-motiv--manual { color: var(--ord, #F26B21); border-color: currentColor; }
.pc-alt-moment { margin-left: auto; min-height: 36px; padding: 0 var(--p3); font-size: 13px; }
.pc-moment { display: flex; flex-wrap: wrap; align-items: end; gap: var(--p2) var(--p3); margin-top: var(--p3); }
.pc-moment[hidden] { display: none; }
.pc-moment label { display: grid; gap: 4px; font-family: var(--mono); font-size: 11px; letter-spacing: .12em;
                   text-transform: uppercase; color: var(--dispink2); }
.pc-moment input { min-height: 40px; padding: 0 var(--p2); font: 14px var(--sans); color: var(--ink);
                   background: var(--cream, #F4EFE6); border: 0; border-radius: var(--r0); }
.pc-m-inapoi { min-height: 40px; padding: 0 var(--p3); font-size: 13px; }
.pc-m-msg { flex: 1 1 100%; margin: 0; font-size: 13px; color: var(--dispink2); min-height: 1em; }
.pc-m-msg--bun { color: var(--gnd, #3FB37F); }
.pc-m-msg--rau { color: var(--rdd, #E85842); }
.pc-confirmare { margin: 0 0 var(--p4); padding: var(--p3) var(--p4); border: 1px solid var(--gnd, #3FB37F);
                 border-left-width: 4px; border-radius: var(--r0); background: var(--disp2); color: var(--dispink); }
.pc-confirmare p { margin: 0; font-size: 14px; }
.pc-confirmare .pc-conf-sub { display: block; margin-top: 4px; font-size: 12px; color: var(--dispink2); }
.pc-conf-act { display: flex; align-items: center; gap: var(--p3); margin-top: var(--p2) !important; }
.pc-conf-link { color: var(--ord, #F26B21); font-family: var(--mono); font-size: 13px; text-decoration: none;
                background: none; border: 0; padding: 0; cursor: pointer; }
.pc-conf-link:hover { text-decoration: underline; }
.pc-conf-x { margin-left: auto; min-width: 32px; min-height: 32px; padding: 0; font-size: 18px; line-height: 1; }
@media (max-width: 720px) {
  .pc-alt-moment { margin-left: 0; }
  .pc-moment label { flex: 1 1 130px; }
  .pc-moment input { width: 100%; box-sizing: border-box; }
}

/* (7-Oct) piesa găsită din calendar: se vede 4 secunde care e */
.pc-verif--tinta { outline: 2px solid var(--ye); outline-offset: 6px; animation: pc-tinta 1.2s ease-out 2; }
@keyframes pc-tinta { 0% { background: color-mix(in srgb, var(--ye) 22%, transparent); } 100% { background: transparent; } }
@media (prefers-reduced-motion: reduce) { .pc-verif--tinta { animation: none; } }