/* ==========================================================================
   Cromatica Finisaje — MODAL PALETAR (Faza D.3)
   Chrome-ul reutilizează componenta generică D.2 (.modal/.modal__voal/
   .modal__caseta/.modal__antet/.modal__corp/.modal__actiuni — components.css
   §12, neatinsă). Design-ul cere aproape tot ecranul (screenshots/produse/
   03-paletar-modal.png), mult peste --w-modal-larg (560px) — de-aici
   modificatorul .modal--paletar, un singur strat de override, nu o rescriere.
   ========================================================================== */

.modal--paletar .modal__caseta{
  width:min(1180px, 100%);
  height:min(860px, 92vh);
  display:flex;
  flex-direction:column;
  padding:0;
  overflow:hidden; /* corpul scroleaza intern, nu caseta intreaga */
}

.paletar-modal-antet{
  padding:var(--sp-11) var(--sp-14) var(--sp-9);
  border-bottom:var(--bd-rand);
  flex:0 0 auto;
}
.paletar-modal-eyebrow{
  margin:0 0 4px; font-family:var(--f-corp); font-size:var(--fs-10-5); font-weight:var(--fw-semi);
  letter-spacing:var(--ls-eticheta); text-transform:uppercase; color:var(--c-amber);
}
.paletar-modal-antet .modal__titlu{ font-size:var(--fs-h2-compact); }

.paletar-modal-corp{
  flex:1 1 auto;
  overflow-y:auto;
  padding:var(--sp-9) var(--sp-14);
}

/* Subsolul „Selectat … / Alege nuanța” — ascuns până la prima selecție. */
.paletar-modal-footer{
  flex:0 0 auto;
  justify-content:space-between;
  align-items:center;
  padding:var(--sp-9) var(--sp-14);
  border-top:var(--bd-rand);
  background:var(--c-surface-warm);
}
.paletar-modal-footer[hidden]{ display:none; }
.paletar-modal-selected{ display:flex; align-items:center; gap:var(--sp-6); }
.paletar-modal-selected-sw{
  width:44px; height:44px; flex:0 0 auto; border:1px solid var(--c-line-swatch); background:var(--c-surface-sand);
}
.paletar-modal-selected-txt{ display:flex; flex-direction:column; gap:2px; }
.paletar-modal-selected-label{
  font-size:var(--fs-10-5); letter-spacing:var(--ls-eticheta); text-transform:uppercase; color:var(--c-ink-40);
}
.paletar-modal-selected-name{ font-family:var(--f-corp); font-size:var(--fs-14); font-weight:var(--fw-semi); color:var(--c-ink); }

@media (max-width:767px){
  .modal--paletar .modal__caseta{ height:100vh; height:100svh; width:100%; }
  .paletar-modal-antet, .paletar-modal-corp, .paletar-modal-footer{ padding-left:var(--sp-9); padding-right:var(--sp-9); }
  .paletar-modal-footer{ flex-wrap:wrap; gap:var(--sp-6); }
}

/* Butonul "Vezi tot paletarul" din coloana de cumpărare (compact, sub grila de nuanță PDP). */
.pf-paletar-open{
  all:unset; box-sizing:border-box; display:inline-flex; align-items:center; gap:var(--sp-3);
  margin-top:var(--sp-5); cursor:pointer;
  font-family:var(--f-corp); font-size:var(--fs-11-5); font-weight:var(--fw-semi); color:var(--c-plum);
  border-bottom:1px solid var(--c-amber-rule); padding-bottom:2px;
}
.pf-paletar-open:hover{ color:var(--c-crimson); }
.pf-paletar-open:focus-visible{ outline:var(--focus-latime) solid var(--focus-culoare); outline-offset:var(--focus-decalaj); }
.pf-paletar-open .ic{ width:14px; height:14px; }