/* ====================================================================
   NYILVÁNOS IDŐPONTFOGLALÓ (webes időpontfoglaló F4): /idopontfoglalo
   Működő, dizájn nélküli alap: a `pf-` osztályok és a `data-*` horgonyok a
   dizájn-kör számára stabilak (a JS ezekre épít), a látvány itt cserélhető.
   A színek a weboldal tokenjeiből (oldal.css: --ink, --muted, --green).
   ==================================================================== */
.pf-box{ margin-top:1.5rem; }
.pf-box + .pf-box{ margin-top:2rem; }
.pf-step-title{ font-size:1.05rem; font-weight:600; margin:0 0 .75rem; color:var(--ink); }
.pf-muted{ color:var(--muted); font-size:.9rem; }

.pf-lengths{ display:flex; flex-wrap:wrap; gap:.5rem; }
.pf-length-item{ display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .9rem;
  border:1px solid rgba(0,0,0,.15); border-radius:999px; cursor:pointer; }

.pf-days, .pf-slots{ display:flex; flex-wrap:wrap; gap:.5rem; }
.pf-day, .pf-slot{
  border:1px solid rgba(0,0,0,.15); background:#fff; color:var(--ink);
  border-radius:.6rem; padding:.55rem .8rem; cursor:pointer; font:inherit;
  text-align:left; transition:border-color .15s ease, background .15s ease;
}
.pf-day{ display:flex; flex-direction:column; min-width:11rem; }
.pf-day-free{ font-size:.8rem; color:var(--muted); }
.pf-slot{ min-width:5.5rem; text-align:center; }
.pf-day:hover, .pf-slot:hover{ border-color:var(--green); }
.pf-day.is-selected, .pf-slot.is-selected{ border-color:var(--green); background:rgba(127,201,178,.18); }

.pf-empty, .pf-loading{ color:var(--muted); margin:0; }
.pf-error{ color:#b42318; margin:.75rem 0 0; }
.pf-summary{ font-weight:600; margin:0 0 .75rem; }
.pf-note{ width:100%; min-height:5rem; padding:.6rem .75rem; border:1px solid rgba(0,0,0,.15);
  border-radius:.6rem; font:inherit; resize:vertical; }
.pf-actions{ margin-top:1rem; display:flex; flex-wrap:wrap; gap:.75rem; align-items:center; }

.pf-existing{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.5rem; }
.pf-existing li{ display:flex; flex-wrap:wrap; gap:.5rem 1rem; align-items:center; }
.pf-badge{ font-size:.8rem; padding:.15rem .5rem; border-radius:999px; background:rgba(0,0,0,.06); }

.pf-result{ margin-top:1.5rem; }
.pf-policy{ margin-top:2rem; font-size:.85rem; color:var(--muted); }
[hidden]{ display:none !important; }