/* Randevu v1 — prototip stilleri.
   Bu dosya src/ui/tokens.css'in taslağıdır: token adları spec §5 ile birebir aynıdır.
   Prototip içindir; üretim kodu Tailwind 4 @theme ile aynı değişkenleri kullanır. */

:root {
  /* Renk rolleri — kontrast değerleri spec §5.2'de */
  --canvas: #F6F5F2;
  --surface: #FFFFFF;
  --sunken: #EDEBE6;
  --ink: #1C1B19;
  --ink-muted: #5C5A55;
  --line: #DAD7D0;
  --line-strong: #8A867D;
  --focus: #1A56DB;
  --danger: #B42318;
  --danger-surface: #FEF3F2;
  --warning: #8A4B00;
  --warning-surface: #FFF6E5;
  --success: #146C2E;
  --success-surface: #ECF8EF;
  --accent: #0F766E;         /* admin sabit vurgu */
  --on-accent: #FFFFFF;
  --accent-surface: #E6F2F1;
  --accent-ink: #115E59;
  /* Marka (müşteri tarafı). Sunucu settings.primary_color'dan üretir. */
  --brand: #0F766E;
  --on-brand: #FFFFFF;       /* #FFFFFF veya #000000; hangisi kontrastı yüksekse */
  --brand-edge: #0F766E;     /* beyaza karşı ≥ 3:1 olana dek koyulaştırılmış marka */

  /* Tip ölçeği */
  --fs-xs: 0.75rem;   /* 12 */
  --fs-sm: 0.875rem;  /* 14 */
  --fs-md: 1rem;      /* 16 */
  --fs-lg: 1.125rem;  /* 18 */
  --fs-xl: 1.375rem;  /* 22 */
  --fs-2xl: 1.75rem;  /* 28 */
  --lh-tight: 1.25;
  --lh-body: 1.5;

  /* Boşluk ölçeği (4 px taban) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px;

  --r-sm: 6px; --r-md: 10px; --r-pill: 999px;
  --shadow-raised: 0 1px 2px rgba(28,27,25,.06), 0 2px 8px rgba(28,27,25,.06);
  --shadow-overlay: 0 8px 32px rgba(28,27,25,.18);
  --dur: 150ms;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; font-family: var(--font); font-size: var(--fs-md); line-height: var(--lh-body);
  color: var(--ink); background: var(--canvas);
}
h1, h2, h3 { line-height: var(--lh-tight); margin: 0; }
h1 { font-size: var(--fs-xl); font-weight: 700; }
h2 { font-size: var(--fs-lg); font-weight: 650; }
h3 { font-size: var(--fs-md); font-weight: 650; }
p { margin: 0; }
a { color: var(--ink); text-underline-offset: 2px; }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--ink-muted); }
.small { font-size: var(--fs-sm); }
.xs { font-size: var(--fs-xs); }
.stack > * + * { margin-top: var(--s-4); }
.stack-sm > * + * { margin-top: var(--s-2); }
.row { display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
.spacer { flex: 1; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Odak: marka renginden bağımsız, her zeminde görünür */
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; border-radius: var(--r-sm); }

/* ---------- Düğmeler ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
  min-height: 44px; padding: 0 var(--s-4); border-radius: var(--r-md);
  font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
  border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink);
  transition: background var(--dur) ease-out, border-color var(--dur) ease-out;
}
.btn:hover { background: var(--sunken); }
.btn-primary { background: var(--brand); color: var(--on-brand); border-color: var(--brand-edge); }
.btn-primary:hover { filter: brightness(.94); background: var(--brand); }
.admin .btn-primary { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.btn-danger { background: var(--danger); color: #fff; border-color: var(--danger); }
.btn-danger:hover { background: #912018; }
.btn-ghost { border-color: transparent; background: transparent; }
.btn-ghost:hover { background: var(--sunken); }
.btn-danger-ghost { border-color: transparent; background: transparent; color: var(--danger); }
.btn-danger-ghost:hover { background: var(--danger-surface); }
.btn-block { width: 100%; }
.btn-sm { min-height: 36px; padding: 0 var(--s-3); font-size: var(--fs-sm); }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; filter: none; }
.btn .spinner { width: 18px; height: 18px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- Formlar ---------- */
.field { display: grid; gap: var(--s-1); align-content: start; }
.field label, .label { font-weight: 600; font-size: var(--fs-sm); }
.field .hint { font-size: var(--fs-sm); color: var(--ink-muted); }
.input, select.input, textarea.input {
  width: 100%; min-height: 44px; padding: 10px 12px; font: inherit; font-size: var(--fs-md);
  color: var(--ink); background: var(--surface);
  border: 1px solid var(--line-strong); border-radius: var(--r-sm);
}
textarea.input { min-height: 160px; line-height: var(--lh-body); }
.input[aria-invalid="true"] { border: 2px solid var(--danger); padding: 9px 11px; }
.input[readonly] { background: var(--sunken); }
.field-error { display: flex; gap: var(--s-1); color: var(--danger); font-size: var(--fs-sm); font-weight: 600; }
.field-error::before { content: "⚠"; }
.input-unit { display: flex; align-items: stretch; }
.input-unit .input { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-unit span { display: grid; place-items: center; padding: 0 var(--s-3); border: 1px solid var(--line-strong); border-left: 0; border-radius: 0 var(--r-sm) var(--r-sm) 0; background: var(--sunken); color: var(--ink-muted); font-size: var(--fs-sm); white-space: nowrap; }
.check { display: flex; gap: var(--s-3); align-items: flex-start; }
.check input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--ink); flex: none; }
.check-box { padding: var(--s-3); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); }
.check-box[data-invalid] { border: 2px solid var(--danger); }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
legend { padding: 0; font-weight: 650; }

/* Anahtar (aktif/pasif) */
.switch { display: inline-flex; align-items: center; gap: var(--s-2); cursor: pointer; }
.switch input { appearance: none; width: 44px; height: 26px; border-radius: var(--r-pill); background: var(--line-strong); position: relative; margin: 0; cursor: pointer; transition: background var(--dur); }
.switch input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform var(--dur); }
.switch input:checked { background: var(--accent); }
.switch input:checked::after { transform: translateX(18px); }

/* ---------- Bildirimler ---------- */
.alert { display: grid; grid-template-columns: auto 1fr; gap: var(--s-1) var(--s-3); padding: var(--s-3) var(--s-4); border-radius: var(--r-md); border: 1px solid; }
.alert .icon { font-weight: 700; }
.alert p + p, .alert p + .row { margin-top: var(--s-2); }
.alert-danger { background: var(--danger-surface); border-color: #F4C7C3; color: var(--danger); }
.alert-danger .body { color: var(--ink); }
.alert-warning { background: var(--warning-surface); border-color: #F2D29B; }
.alert-warning .icon { color: var(--warning); }
.alert-success { background: var(--success-surface); border-color: #B7E1C1; }
.alert-success .icon { color: var(--success); }
.alert-info { background: var(--surface); border-color: var(--line); }

.badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: var(--r-pill); font-size: var(--fs-xs); font-weight: 650; border: 1px solid var(--line); background: var(--surface); color: var(--ink-muted); white-space: nowrap; }
.badge-success { background: var(--success-surface); color: var(--success); border-color: #B7E1C1; }
.badge-danger { background: var(--danger-surface); color: var(--danger); border-color: #F4C7C3; }
.badge-warning { background: var(--warning-surface); color: var(--warning); border-color: #F2D29B; }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); }
.card-pad { padding: var(--s-4); }

/* İskelet (yükleniyor) */
.skel { background: var(--sunken); border-radius: var(--r-sm); position: relative; overflow: hidden; }
.skel::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent); transform: translateX(-100%); animation: shimmer 1.4s infinite; }
@keyframes shimmer { to { transform: translateX(100%); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* ===================== MÜŞTERİ ===================== */
.c-shell { max-width: 560px; margin: 0 auto; min-height: 100vh; display: flex; flex-direction: column; }
.c-header { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-4); background: var(--surface); border-bottom: 1px solid var(--line); }
.c-header img, .c-logo { width: 40px; height: 40px; border-radius: var(--r-sm); flex: none; display: grid; place-items: center; background: var(--brand); color: var(--on-brand); font-weight: 700; }
.c-header .name { font-weight: 700; font-size: var(--fs-md); line-height: var(--lh-tight); }
.c-main { flex: 1; padding: var(--s-4); }
.c-footer { padding: var(--s-5) var(--s-4); font-size: var(--fs-sm); color: var(--ink-muted); border-top: 1px solid var(--line); }
.c-footer a { color: var(--ink-muted); }

.progress { display: flex; gap: var(--s-1); margin-bottom: var(--s-2); }
.progress span { flex: 1; height: 4px; border-radius: 2px; background: var(--line); }
.progress span.done { background: var(--brand-edge); }
.step-label { font-size: var(--fs-sm); color: var(--ink-muted); font-weight: 600; }

.summary { display: flex; flex-direction: column; gap: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); margin-bottom: var(--s-4); }
.summary a { display: flex; gap: var(--s-3); align-items: baseline; padding: var(--s-2) var(--s-3); min-height: 44px; align-items: center; text-decoration: none; color: var(--ink); }
.summary a + a { border-top: 1px solid var(--line); }
.summary .k { width: 72px; flex: none; font-size: var(--fs-sm); color: var(--ink-muted); }
.summary .v { flex: 1; font-weight: 600; }
.summary .edit { font-size: var(--fs-sm); text-decoration: underline; color: var(--ink-muted); }

.choice-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-2); }
.choice { display: flex; align-items: center; gap: var(--s-3); min-height: 56px; padding: var(--s-3) var(--s-4); background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--r-md); text-decoration: none; color: var(--ink); }
.choice:hover { border-color: var(--ink); }
.choice .t { flex: 1; min-width: 0; }
.choice .t strong { display: block; overflow-wrap: anywhere; }
.choice .meta { font-size: var(--fs-sm); color: var(--ink-muted); }
.choice .price { font-weight: 650; white-space: nowrap; }
.choice .chev { color: var(--ink-muted); }
.choice[aria-current="true"] { background: var(--brand); color: var(--on-brand); border: 2px solid var(--brand-edge); }
.choice[aria-current="true"] .meta, .choice[aria-current="true"] .chev { color: inherit; }

.days { display: grid; grid-template-columns: repeat(7, 1fr); gap: var(--s-1); }
.day { display: grid; place-items: center; gap: 0; min-height: 60px; padding: var(--s-1) 0; border: 1px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface); text-decoration: none; color: var(--ink); }
.day .dow { font-size: var(--fs-xs); color: var(--ink-muted); font-weight: 600; }
.day .dnum { font-size: var(--fs-lg); font-weight: 700; }
.day[aria-current="date"], .day[aria-current="true"] { background: var(--brand); color: var(--on-brand); border: 2px solid var(--brand-edge); }
.day[aria-current="true"] .dow { color: inherit; }
.day[aria-disabled="true"] { background: transparent; border-style: dashed; color: var(--ink-muted); }
.week-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--s-2); }

.slots { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-2); }
@media (max-width: 359px) { .slots { grid-template-columns: repeat(3, 1fr); } }
.slot { display: grid; place-items: center; min-height: 48px; border: 1px solid var(--line-strong); border-radius: var(--r-md); background: var(--surface); color: var(--ink); text-decoration: none; font-weight: 650; font-variant-numeric: tabular-nums; }
.slot:hover { border-color: var(--ink); }
.slot[aria-current="true"], .slot.selected { background: var(--brand); color: var(--on-brand); border: 2px solid var(--brand-edge); }
.slot-group + .slot-group { margin-top: var(--s-4); }
.slot-group h3 { font-size: var(--fs-sm); color: var(--ink-muted); margin-bottom: var(--s-2); }
label.slot { cursor: pointer; position: relative; }
label.slot input { position: absolute; opacity: 0; }
label.slot:has(input:checked) { background: var(--brand); color: var(--on-brand); border: 2px solid var(--brand-edge); }
label.slot:has(input:focus-visible) { outline: 3px solid var(--focus); outline-offset: 2px; }

.empty { text-align: center; padding: var(--s-6) var(--s-4); background: var(--surface); border: 1px dashed var(--line-strong); border-radius: var(--r-md); }
.empty .stack-sm { justify-items: center; }

.sticky-submit { padding: var(--s-2) 0 var(--s-4); }  /* bilinçli olarak sticky değil: mobil klavye ve KVKK kutusunu örter */

/* Prototip sergi düzeni (yalnız prototipte) */
.proto-note { max-width: 560px; margin: var(--s-4) auto; padding: var(--s-3) var(--s-4); font-size: var(--fs-sm); border: 1px dashed var(--line-strong); border-radius: var(--r-md); color: var(--ink-muted); background: var(--surface); }
.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: var(--s-5); padding: var(--s-5); max-width: 1400px; margin: 0 auto; }
.frame { background: var(--canvas); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.frame > .cap { padding: var(--s-2) var(--s-3); background: var(--ink); color: #fff; font-size: var(--fs-xs); font-weight: 600; }
.frame .c-main { padding: var(--s-4); }

/* ===================== ADMIN ===================== */
.admin { background: var(--canvas); }
.a-shell { display: grid; grid-template-columns: 1fr; grid-template-rows: auto 1fr auto; min-height: 100vh; }
.a-top .btn-primary { display: none; }
.a-top { display: flex; align-items: center; gap: var(--s-3); padding: 0 var(--s-4); height: 56px; background: var(--surface); border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 5; }
.a-top .brandname { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 52vw; }
.a-nav { display: none; }
.a-nav a { display: flex; align-items: center; gap: var(--s-2); min-height: 40px; padding: 0 var(--s-3); border-radius: var(--r-sm); text-decoration: none; color: var(--ink); font-weight: 550; }
.a-nav a:hover { background: var(--sunken); }
.a-nav a[aria-current="page"] { background: var(--accent-surface); color: var(--accent-ink); font-weight: 700; }
.a-main { padding: var(--s-4); min-width: 0; }
.a-page-head { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; margin-bottom: var(--s-4); }
.a-page-head h1 { flex: 1; min-width: 200px; }
.a-tabbar { position: sticky; bottom: 0; display: grid; grid-template-columns: repeat(5, 1fr); background: var(--surface); border-top: 1px solid var(--line); z-index: 5; }
.a-tabbar a { display: grid; place-items: center; min-height: 56px; font-size: var(--fs-xs); font-weight: 600; text-decoration: none; color: var(--ink-muted); }
.a-tabbar a[aria-current="page"] { color: var(--accent-ink); box-shadow: inset 0 3px 0 var(--accent); }
@media (min-width: 1024px) {
  .a-shell { grid-template-columns: 232px 1fr; grid-template-rows: auto 1fr; }
  .a-top .btn-primary { display: inline-flex; }
  .a-top { grid-column: 1 / -1; }
  .a-nav { display: flex; flex-direction: column; gap: 2px; padding: var(--s-4) var(--s-3); border-right: 1px solid var(--line); background: var(--surface); }
  .a-main { padding: var(--s-5) var(--s-6); }
  .a-tabbar { display: none; }
  .a-menu-btn { display: none; }
}

.banner-setup { display: flex; gap: var(--s-3); align-items: center; flex-wrap: wrap; padding: var(--s-2) var(--s-4); background: var(--warning-surface); border-bottom: 1px solid #F2D29B; font-size: var(--fs-sm); }

.list { list-style: none; margin: 0; padding: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); }
.list > li + li { border-top: 1px solid var(--line); }
.appt-row { display: grid; grid-template-columns: 64px 1fr auto; gap: var(--s-1) var(--s-3); padding: var(--s-3) var(--s-4); align-items: start; }
.appt-row .time { font-weight: 700; font-variant-numeric: tabular-nums; }
.appt-row .time small { display: block; font-weight: 500; color: var(--ink-muted); font-size: var(--fs-xs); }
.appt-row .who { font-weight: 650; overflow-wrap: anywhere; }
.appt-row .what { font-size: var(--fs-sm); color: var(--ink-muted); }
.appt-row .tel { white-space: nowrap; }
.appt-row.now { background: var(--accent-surface); }
@media (max-width: 599px) { .appt-row { grid-template-columns: 56px 1fr; } .appt-row .tel { grid-column: 2; justify-self: start; } }
.group-h { font-size: var(--fs-sm); color: var(--ink-muted); font-weight: 650; margin: var(--s-5) 0 var(--s-2); }

.table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.table th, .table td { text-align: left; padding: var(--s-3) var(--s-4); border-top: 1px solid var(--line); vertical-align: top; }
.table thead th { border-top: 0; font-size: var(--fs-sm); color: var(--ink-muted); background: var(--canvas); font-weight: 650; }
.table td.num, .table th.num { text-align: right; }

.seg { display: inline-flex; border: 1px solid var(--line-strong); border-radius: var(--r-md); overflow: hidden; background: var(--surface); }
.seg a, .seg button { min-height: 40px; padding: 0 var(--s-4); display: grid; place-items: center; text-decoration: none; color: var(--ink); font: inherit; font-weight: 600; border: 0; background: transparent; }
.seg a + a { border-left: 1px solid var(--line-strong); }
.seg a[aria-current="page"] { background: var(--ink); color: #fff; }

/* Gün takvimi ızgarası */
.cal { --row: 32px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); overflow: auto; }
.cal-grid { display: grid; grid-template-columns: 56px repeat(var(--cols), minmax(150px, 1fr)); position: relative; }
.cal-head { position: sticky; top: 0; z-index: 3; background: var(--surface); border-bottom: 1px solid var(--line-strong); padding: var(--s-2) var(--s-3); font-weight: 650; min-height: 52px; }
.cal-head .sub { display: block; font-size: var(--fs-xs); color: var(--ink-muted); font-weight: 500; }
.cal-times { grid-column: 1; position: relative; }
.cal-times div { height: var(--row); font-size: var(--fs-xs); color: var(--ink-muted); text-align: right; padding-right: 8px; transform: translateY(-7px); font-variant-numeric: tabular-nums; }
.cal-col { position: relative; border-left: 1px solid var(--line); background-image: repeating-linear-gradient(to bottom, transparent 0, transparent calc(var(--row) * 2 - 1px), var(--line) calc(var(--row) * 2 - 1px), var(--line) calc(var(--row) * 2)); }
.cal-off { position: absolute; left: 0; right: 0; background: repeating-linear-gradient(135deg, var(--sunken) 0 6px, #E4E1DA 6px 12px); }
.cal-off span { position: absolute; top: 4px; left: 8px; font-size: var(--fs-xs); color: var(--ink-muted); font-weight: 600; }
.cal-ev { position: absolute; left: 4px; right: 4px; border-radius: var(--r-sm); background: var(--accent-surface); border: 1px solid #9CC9C4; border-left: 4px solid var(--accent); padding: 2px 6px; font-size: var(--fs-xs); line-height: 1.3; overflow: hidden; text-decoration: none; color: var(--ink); display: block; }
.cal-ev strong { font-size: var(--fs-sm); }
.cal-ev .buf { position: absolute; left: -4px; right: -1px; bottom: 0; background: repeating-linear-gradient(135deg, transparent 0 4px, rgba(15,118,110,.18) 4px 8px); border-top: 1px dashed #9CC9C4; }
.cal-ev.manual { border-left-color: var(--ink); }
.cal-ev.cancelled { background: var(--surface); border-style: dashed; border-left: 4px dashed var(--line-strong); color: var(--ink-muted); text-decoration: line-through; }
.cal-ev[aria-current="true"] { outline: 3px solid var(--focus); outline-offset: 1px; }
.cal-now { position: absolute; left: 56px; right: 0; height: 0; border-top: 2px solid var(--danger); z-index: 2; }
.cal-now span { position: absolute; left: -54px; top: -10px; background: var(--danger); color: #fff; font-size: 11px; font-weight: 700; padding: 1px 4px; border-radius: 4px; }

/* Haftalık matris */
.week { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); table-layout: fixed; }
.week th, .week td { border-top: 1px solid var(--line); border-left: 1px solid var(--line); padding: var(--s-2); vertical-align: top; }
.week thead th { border-top: 0; font-size: var(--fs-sm); text-align: left; background: var(--canvas); }
.week thead th a { text-decoration: none; }
.week th:first-child, .week td:first-child { border-left: 0; }
.week tbody th { text-align: left; font-size: var(--fs-sm); width: 132px; background: var(--canvas); }
.week .today { background: var(--accent-surface); }
.wk-item { display: block; padding: 2px 4px; border-radius: 4px; font-size: var(--fs-xs); line-height: 1.35; text-decoration: none; color: var(--ink); overflow-wrap: anywhere; }
.wk-item + .wk-item { margin-top: 2px; }
.wk-item:hover { background: var(--sunken); }
.wk-item b { font-variant-numeric: tabular-nums; }
.wk-more { font-size: var(--fs-xs); font-weight: 650; }
.wk-closed { font-size: var(--fs-xs); color: var(--ink-muted); }

/* Çekmece / diyalog */
.scrim { position: fixed; inset: 0; background: rgba(28,27,25,.42); z-index: 20; }
.drawer { position: fixed; z-index: 21; top: 0; right: 0; bottom: 0; width: min(420px, 100vw); background: var(--surface); box-shadow: var(--shadow-overlay); display: flex; flex-direction: column; }
.drawer-head { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line); min-height: 56px; }
.drawer-body { padding: var(--s-4); overflow: auto; flex: 1; }
.drawer-foot { padding: var(--s-3) var(--s-4); border-top: 1px solid var(--line); display: flex; gap: var(--s-2); }
.dialog { position: fixed; z-index: 31; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(440px, calc(100vw - 32px)); background: var(--surface); border-radius: var(--r-md); box-shadow: var(--shadow-overlay); padding: var(--s-5); }
.dialog .actions { display: flex; gap: var(--s-2); justify-content: flex-end; margin-top: var(--s-5); flex-wrap: wrap; }
.dl { display: grid; grid-template-columns: 96px 1fr; gap: var(--s-2) var(--s-3); margin-left: 0; margin-right: 0; margin-bottom: 0; }
.dl dt { color: var(--ink-muted); font-size: var(--fs-sm); }
.dl dd { margin: 0; overflow-wrap: anywhere; }

.toast { position: fixed; z-index: 40; left: 50%; bottom: 24px; transform: translateX(-50%); background: var(--ink); color: #fff; padding: var(--s-3) var(--s-4); border-radius: var(--r-md); box-shadow: var(--shadow-overlay); display: flex; gap: var(--s-3); align-items: center; font-size: var(--fs-sm); }
.toast a { color: #fff; }

.steps { list-style: none; margin: 0; padding: 0; counter-reset: s; }
.steps li { display: grid; grid-template-columns: 36px 1fr; gap: var(--s-3); padding: var(--s-4); border-top: 1px solid var(--line); }
.steps li:first-child { border-top: 0; }
.steps .dot { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; border: 2px solid var(--line-strong); color: var(--ink-muted); background: var(--surface); }
.steps .done .dot { background: var(--success); border-color: var(--success); color: #fff; }
.steps .current .dot { border-color: var(--accent); color: var(--accent-ink); }

.hours { width: 100%; border-collapse: collapse; }
.hours th, .hours td { padding: var(--s-2); border-top: 1px solid var(--line); text-align: left; vertical-align: middle; }
.hours thead th { border-top: 0; font-size: var(--fs-sm); color: var(--ink-muted); }
.hours .input { min-height: 40px; padding: 6px 8px; width: 100px; }
.hours tr.closed td:not(:first-child):not(:nth-child(2)) { color: var(--ink-muted); }

.grid-2 { display: grid; gap: var(--s-4); }
@media (min-width: 768px) { .grid-2 { grid-template-columns: 1fr 1fr; } }
.section { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s-5); }
.section > h2 { margin-bottom: var(--s-1); }
.section > .hint { margin-bottom: var(--s-4); color: var(--ink-muted); font-size: var(--fs-sm); }
.save-bar { position: sticky; bottom: 0; display: flex; gap: var(--s-3); align-items: center; padding: var(--s-3) var(--s-4); background: var(--surface); border-top: 1px solid var(--line); margin: var(--s-5) calc(var(--s-4) * -1) 0; z-index: 4; }
@media (min-width: 1024px) { .save-bar { margin: var(--s-5) calc(var(--s-6) * -1) 0; padding: var(--s-3) var(--s-6); } }

/* İki bölmeli liste + düzenleyici (hizmetler, personel) */
.panes { display: grid; gap: var(--s-5); align-items: start; }
@media (min-width: 1024px) { .panes { grid-template-columns: minmax(280px, 360px) 1fr; } }
@media (max-width: 1023px) { .panes.has-editor .pane-list { display: none; } }
.item-row { display: flex; gap: var(--s-3); align-items: center; padding: var(--s-3) var(--s-4); text-decoration: none; color: var(--ink); min-height: 56px; }
.item-row:hover { background: var(--canvas); }
.item-row[aria-current="true"] { background: var(--accent-surface); box-shadow: inset 3px 0 0 var(--accent); }
.item-row .t { flex: 1; min-width: 0; }
.item-row .t strong { display: block; overflow-wrap: anywhere; }
.item-row .meta { font-size: var(--fs-sm); color: var(--ink-muted); }
.back-link { display: none; }
@media (max-width: 1023px) { .back-link { display: inline-flex; } }
.panes > * { min-width: 0; }
.hours .field-error { white-space: normal; }