/* Known Media · βήμα 4: κλείσε ώρα για κλήση WhatsApp (ίδιο στυλ με τη φόρμα) */
.bk{display:flex;flex-direction:column;gap:12px;min-width:0}
.bk-host{display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;border-radius:16px;background:linear-gradient(160deg,#fffdfa,#f7f0e8);border:1px solid #e6dbcf}
.bk-av{position:relative;flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:linear-gradient(160deg,#8a2427,#62151a);color:#fff;font:800 14px var(--f);letter-spacing:.02em}
.bk-av i{position:absolute;right:-2px;bottom:-2px;width:16px;height:16px;border-radius:50%;background:#25d366;border:2.5px solid #fbf7f2}
.bk-av i::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid #25d366;opacity:0;animation:bkPing 2.4s cubic-bezier(.2,.8,.2,1) infinite}
@keyframes bkPing{0%{transform:scale(.6);opacity:.7}80%,100%{transform:scale(1.5);opacity:0}}
.bk-host b{display:block;font-size:15px;font-weight:700;color:var(--ink)}
.bk-host small{display:block;font-size:13px;color:#857670;line-height:1.35}

.bk-strip{display:flex;align-items:center;gap:6px;min-width:0}
.bk-arr{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid #e6dbcf;background:#fffdfa;color:var(--ox);display:grid;place-items:center;cursor:pointer;transition:background .2s,opacity .2s,transform .2s}
.bk-arr svg{width:16px;height:16px}
.bk-arr:hover:not(:disabled){background:#fff;transform:scale(1.06)}
.bk-arr:disabled{opacity:.3;cursor:default}
.bk-days{flex:1;min-width:0;display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding:4px 2px 6px;-webkit-mask:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent);mask:linear-gradient(90deg,transparent,#000 14px,#000 calc(100% - 14px),transparent)}
.bk-days::-webkit-scrollbar{display:none}
.bk-day{flex:0 0 74px;scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;gap:1px;padding:9px 4px 8px;border-radius:16px;border:1px solid #e6dbcf;background:linear-gradient(160deg,#fffdfa,#f7f0e8);color:var(--ink);font:inherit;cursor:pointer;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s,border-color .2s}
.bk-day small{font-size:11.5px;font-weight:600;color:#857670;text-transform:capitalize;line-height:1.2}
.bk-day b{font-size:22px;font-weight:800;line-height:1.1;letter-spacing:-.02em}
.bk-day i{font-style:normal;margin-top:4px;font-size:10.5px;font-weight:700;color:#2f8a5a;white-space:nowrap}
.bk-day:hover:not(:disabled){transform:translateY(-3px);border-color:#cdbfb2;box-shadow:0 14px 22px -16px rgba(20,16,16,.35)}
.bk-day.on{background:linear-gradient(160deg,#8a2427,#62151a);border-color:#62151a;color:#fff;transform:translateY(-3px);box-shadow:0 18px 26px -16px rgba(98,21,26,.75)}
.bk-day.on small,.bk-day.on i{color:rgba(255,255,255,.82)}
.bk-day.no{opacity:.45;cursor:default}
.bk-day.no i{color:#a3948d}

.bk-dh{display:flex;align-items:baseline;justify-content:space-between;gap:10px;min-height:20px}
.bk-dh b{font-size:15px;font-weight:700;color:var(--ink);text-transform:capitalize}
.bk-tz{font-size:12px;font-weight:600;color:#a3948d;white-space:nowrap}
.bk-times{min-height:96px}
.bk-part{margin:0 0 6px!important;font-size:11.5px!important;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#a3948d!important}
.bk-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:10px}
.bk-t{height:42px;border-radius:12px;border:1px solid #e6dbcf;background:#fffdfa;color:var(--ink);font:700 14.5px var(--f);font-variant-numeric:tabular-nums;cursor:pointer;transition:transform .3s cubic-bezier(.2,.8,.2,1),background .2s,border-color .2s,box-shadow .3s,color .2s}
.bk-t:hover:not(:disabled):not(.on){transform:translateY(-2px);border-color:var(--ox);color:var(--ox)}
.bk-t.on{background:linear-gradient(160deg,#8a2427,#62151a);border-color:#62151a;color:#fff;box-shadow:0 12px 20px -12px rgba(98,21,26,.8);animation:pop .45s cubic-bezier(.2,.8,.2,1)}
.bk-t:disabled{background:transparent;border-style:dashed;color:#bfb2aa;text-decoration:line-through;cursor:not-allowed}
.bk-t:focus-visible,.bk-day:focus-visible,.bk-arr:focus-visible{outline:2.5px solid var(--ox);outline-offset:2px}
.bk-times.in .bk-t{animation:bkIn .5s cubic-bezier(.2,.8,.2,1) both}
.bk-times.in .bk-t:nth-child(2){animation-delay:.03s}.bk-times.in .bk-t:nth-child(3){animation-delay:.06s}.bk-times.in .bk-t:nth-child(4){animation-delay:.09s}
.bk-times.in .bk-t:nth-child(5){animation-delay:.12s}.bk-times.in .bk-t:nth-child(n+6){animation-delay:.15s}
.bk-times.in .bk-t.on{animation:none}
@keyframes bkIn{from{opacity:0;transform:translateY(8px) scale(.96)}}

.bk-sk{flex:0 0 74px;height:86px;border-radius:16px;background:linear-gradient(90deg,#f1e9e0 0%,#faf5ef 50%,#f1e9e0 100%);background-size:200% 100%;animation:bkSk 1.2s linear infinite}
.bk-times .bk-sk{display:inline-block;width:calc(20% - 7px);height:42px;margin:0 8px 8px 0;border-radius:12px}
@keyframes bkSk{to{background-position:-200% 0}}

.bk-pick{display:flex;flex-direction:column;gap:2px;padding:12px 14px 12px 44px;border-radius:14px;background:#eef7f1;border:1px solid #cfe7d8;position:relative;animation:bkIn .45s cubic-bezier(.2,.8,.2,1) both}
.bk-pick::before{content:"";position:absolute;left:14px;top:14px;width:20px;height:20px;border-radius:50%;background:#25d366 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/13px no-repeat}
.bk-pick b{font-size:15px;color:#14532d}
.bk-pick span{font-size:13px;color:#3f6b52}
.bk-msg{margin:0!important;min-height:0;font-size:14px;font-weight:600;color:#857670}
.bk-msg:empty{display:none}
.bk-msg.err{color:#b3261e!important}
.bk-msg.ok{color:#1f7a4a!important}

.bk-skip{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;font-weight:600;color:#6d5f59;user-select:none;padding:4px 0}
.bk-skip input{position:absolute;opacity:0;width:1px;height:1px}
.bk-box{flex:none;width:20px;height:20px;border-radius:6px;border:1.5px solid #cdbfb2;background:#fffdfa;display:grid;place-items:center;transition:background .2s,border-color .2s}
.bk-skip input:checked+.bk-box{background:var(--ox);border-color:var(--ox)}
.bk-skip input:checked+.bk-box::after{content:"";width:10px;height:5px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.bk-skip input:focus-visible+.bk-box{outline:2.5px solid var(--ox);outline-offset:2px}
.bk.skip .bk-strip,.bk.skip .bk-dh,.bk.skip .bk-times{opacity:.35;filter:saturate(.4);transition:opacity .3s}
.bk.off .bk-strip,.bk.off .bk-dh,.bk.off .bk-times{display:none}
.bk.locked .bk-strip,.bk.locked .bk-dh,.bk.locked .bk-times,.bk.locked .bk-skip{display:none}

/* κουμπί «Ολοκλήρωση» ενώ κλείνει η ώρα */
#q-next.busy{pointer-events:none;opacity:.8}
#q-next.busy svg{animation:bkSpin .8s linear infinite}
@keyframes bkSpin{to{transform:rotate(360deg)}}

/* οθόνη «Ευχαριστούμε» */
.sum dd.bk-dd{color:#1f7a4a}
.bk-ics{display:inline-flex;align-items:center;gap:8px;margin:6px 0 2px;padding:9px 14px;border-radius:999px;border:1px solid #e6dbcf;background:#fffdfa;color:var(--ox);font-weight:700;font-size:14px;text-decoration:none;transition:transform .25s,box-shadow .25s}
.bk-ics svg{width:18px;height:18px}
.bk-ics:hover{transform:translateY(-2px);box-shadow:0 12px 20px -14px rgba(98,21,26,.6)}
.bk-ics[hidden]{display:none}

/* 4 βήματα πάνω: να χωράνε — όνομα μόνο στο τρέχον βήμα, οι γραμμές γεμίζουν το πλάτος */
.stp{gap:8px}
.stp li+li{flex:1 1 0;min-width:0}
.stp li+li::before{flex:1 1 auto;width:auto;min-width:10px}
.stp li:not(.on) span{display:none}
.stp li span{white-space:nowrap}
@media (max-width:640px){
  .stp{gap:6px}
  .stp li{gap:6px;font-size:13px}
  .stp li b{width:34px;height:34px;font-size:12.5px}
  .bk-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .bk-times .bk-sk{width:calc(25% - 6px)}
  .bk-day{flex-basis:64px}.bk-day b{font-size:20px}
  .bk-arr{display:none}
}
@media (max-width:380px){.bk-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){
  .bk-av i::after,.bk-sk,.bk-times.in .bk-t,.bk-pick,.bk-t.on{animation:none}
  .bk-day,.bk-t{transition:none}
}
.bk-pick[hidden],.bk [hidden]{display:none!important}
