/* Anka Life — takvimli randevu akışı (FAZ 5, madde 1)
   Sayfaya özel; global style.css'e DOKUNULMAZ ama marka token/bileşen dili
   (--green/--gold/--serif/--sans, .card/.chip kart dili — radius, gölge, boşluk)
   burada da uygulanır. HTML yapısı ve form alan adları değişmez, yalnız görünüm.
   Mobil öncelikli: 390px'de yatay taşma sıfır (tüm ızgaralar auto-fit + minmax(0,...)). */

.appt-flow{display:block;min-width:0}
.appt-flow *{min-width:0}

/* Adım göstergesi — pill rozetler */
.appt-steps{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.75rem;padding:0;list-style:none}
.appt-step{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .9rem .35rem .35rem;
  border-radius:999px;background:var(--paper);border:1px solid var(--line);
  font-size:.82rem;font-weight:500;color:var(--mute);white-space:nowrap;
  transition:background .18s ease,border-color .18s ease,color .18s ease}
.appt-step-no{display:grid;place-items:center;width:1.6rem;height:1.6rem;flex:none;
  border:1px solid var(--line);border-radius:50%;font-size:.75rem;font-weight:700;
  background:#fff;color:var(--mute);transition:background .18s ease,border-color .18s ease,color .18s ease}
.appt-step.is-current{color:var(--green-d);font-weight:700;background:var(--green-tint);
  border-color:rgba(26,86,50,.22)}
.appt-step.is-current .appt-step-no{background:var(--green);border-color:var(--green);color:#fff}
.appt-step.is-done{background:#fff;border-color:var(--line);color:var(--ink)}
.appt-step.is-done .appt-step-no{background:var(--green-tint);border-color:#BFD6C6;color:var(--green-d)}

.appt-h2{margin:0 0 1.1rem;font:400 clamp(1.25rem,3.6vw,1.7rem)/1.25 var(--serif);color:var(--green-d)}

/* Seçilenlerin özeti */
.appt-chosen{margin:0 0 1.5rem;padding:1rem 1.15rem;border:1px solid rgba(26,86,50,.14);
  border-radius:16px;background:var(--green-tint)}
.appt-chosen>div{display:flex;flex-wrap:wrap;gap:.25rem .6rem;padding:.32rem 0}
.appt-chosen>div+div{border-top:1px solid rgba(26,86,50,.1)}
.appt-chosen dt{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;font-weight:700;
  color:var(--mute);flex:0 0 100%}
.appt-chosen dd{margin:0;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.appt-change{margin-left:.4rem;font-size:.82rem;font-weight:700;color:var(--green);
  text-decoration:underline;text-underline-offset:2px}
.appt-change:hover{color:var(--green-d)}

/* Seçenek listeleri — kart görünümü (.card/.chip diliyle uyumlu) */
.appt-options{display:grid;gap:.75rem;margin:0;padding:0;list-style:none}
.appt-options--branch{grid-template-columns:1fr}
.appt-options--day{grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr))}
.appt-option{display:flex;flex-direction:column;gap:.3rem;padding:1.05rem 1.2rem;
  border:1px solid rgba(26,86,50,.08);border-radius:16px;background:#fff;color:var(--ink);
  text-decoration:none;box-shadow:0 6px 20px rgba(26,86,50,.04);
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease}
a.appt-option:hover,a.appt-option:focus-visible{border-color:var(--green);background:var(--green-tint);
  box-shadow:0 14px 32px rgba(26,86,50,.1);transform:translateY(-3px)}
.appt-option-title{font-weight:700;line-height:1.35;overflow-wrap:anywhere;color:var(--green-d)}
.appt-option-sub{font-size:.85rem;color:var(--mute);line-height:1.5;overflow-wrap:anywhere}
.appt-option.is-disabled{background:var(--paper);border-style:dashed;border-color:var(--line);
  color:var(--mute);cursor:default;box-shadow:none}
.appt-option.is-disabled .appt-option-title{color:var(--mute)}
.appt-option--compact{padding:.85rem 1rem}

/* Saat ızgarası */
.appt-times{display:grid;grid-template-columns:repeat(auto-fill,minmax(5.2rem,1fr));gap:.6rem;
  margin:0;padding:0;list-style:none}
.appt-time{display:flex;flex-direction:column;align-items:center;gap:.15rem;padding:.75rem .4rem;
  border:1px solid rgba(26,86,50,.08);border-radius:14px;background:#fff;color:var(--ink);
  text-decoration:none;text-align:center;box-shadow:0 6px 18px rgba(26,86,50,.04);
  transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease}
.appt-time strong{font-size:1.02rem;font-variant-numeric:tabular-nums;color:var(--green-d)}
.appt-time small{font-size:.72rem;color:var(--mute)}
.appt-time:hover,.appt-time:focus-visible{border-color:var(--green);background:var(--green-tint);
  box-shadow:0 12px 26px rgba(26,86,50,.1);transform:translateY(-3px)}

.appt-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:1rem}
.appt-form label{display:block;margin-bottom:1rem;font-size:.85rem;font-weight:700;color:var(--green-d)}
.appt-form input,.appt-form select,.appt-form textarea{display:block;width:100%;max-width:100%;
  margin-top:.4rem;padding:.75rem .9rem;border:1px solid var(--line);border-radius:12px;
  font:400 1rem/1.4 var(--sans);color:var(--ink);background:#fff;box-sizing:border-box;
  transition:border-color .18s ease,box-shadow .18s ease}
.appt-form textarea{resize:vertical}
.appt-form input:focus-visible,.appt-form select:focus-visible,.appt-form textarea:focus-visible{
  outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(26,86,50,.16)}
.appt-submit{margin-top:.5rem}

/* Durum ve boş durumlar */
.appt-error{margin:0 0 1.2rem;padding:.85rem 1rem;border-left:3px solid #A8322B;
  border-radius:0 14px 14px 0;background:#FCF1F0;color:#7A241E;font-size:.92rem;line-height:1.55}
.appt-empty{margin:0;padding:1.2rem;border:1px dashed var(--line);border-radius:16px;
  background:var(--paper);color:var(--mute);line-height:1.6}
.appt-fallback-note{display:block;margin:0 0 1.5rem;padding:1.1rem 1.2rem;
  border:1px solid rgba(26,86,50,.14);border-radius:16px;background:var(--green-tint)}
.appt-fallback-note strong{display:block;margin-bottom:.4rem;color:var(--green-d);
  font-family:var(--serif);font-weight:400;font-size:1.15rem}
.appt-fallback-note span{display:block;color:var(--mute);line-height:1.65}

/* Onay ekranı */
.appt-result{text-align:left}
.appt-result-badge{display:grid;place-items:center;width:2.8rem;height:2.8rem;margin:0 0 1rem;
  border-radius:50%;background:var(--green);color:#fff;font-size:1.3rem;line-height:1;
  box-shadow:0 10px 24px rgba(26,86,50,.25)}
.appt-result h2{margin:0 0 .6rem;font:400 clamp(1.3rem,4vw,1.85rem)/1.25 var(--serif);color:var(--green-d)}
.appt-result>p{margin:0 0 1.2rem;color:var(--mute);line-height:1.65}
.appt-summary-list{display:grid;gap:.6rem;margin:0 0 1.5rem;padding:1.1rem 1.2rem;
  border:1px solid rgba(26,86,50,.14);border-radius:16px;background:var(--green-tint)}
.appt-summary-list>div{display:flex;flex-wrap:wrap;gap:.2rem .6rem}
.appt-summary-list dt{flex:0 0 100%;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;
  font-weight:700;color:var(--mute)}
.appt-summary-list dd{margin:0;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.appt-cancel{display:flex;flex-direction:column;gap:.6rem;align-items:flex-start}
.appt-cancel-btn{padding:.7rem 1.1rem;border:1px solid #E3C6C3;border-radius:12px;background:#fff;
  color:#7A241E;font:700 .92rem/1 var(--sans);cursor:pointer;transition:border-color .18s ease,background .18s ease}
.appt-cancel-btn:hover{border-color:#A8322B;background:#FCF1F0}
.appt-hint{font-size:.82rem;color:var(--mute);line-height:1.55}
.appt-restart{color:var(--green);font-weight:700}
.appt-restart:hover{color:var(--green-d)}

.appt-flow[aria-busy="true"]{opacity:.6}

@media (min-width:640px){
  .appt-options--branch{grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr))}
  .appt-chosen>div{align-items:baseline}
  .appt-chosen dt{flex:0 0 6.5rem}
}
@media (prefers-reduced-motion:reduce){
  .appt-option,.appt-time,.appt-flow,.appt-step,.appt-step-no,.appt-cancel-btn{transition:none}
}
