/* ==========================================================================
   Otel ERP — tasarım sistemi
   Tüm renkler bu dosyadaki özel özelliklerdir (custom properties). Modül
   ekranları yeni renk tanımlamaz; buradaki token'ları ve bileşen sınıflarını kullanır.
   ========================================================================== */

:root {
    /* Zemin ve yüzeyler */
    --bg: #f3f3f1;
    --surface: #ffffff;
    --surface-alt: #f8f8f6;
    --border: #dcdcd8;
    --border-strong: #b9b9b4;

    /* Metin */
    --text: #1e2227;
    --text-muted: #5b6370;
    --text-faint: #6b727d;

    /* Tek vurgu rengi: koyu, doygunluğu düşük lacivert. Yalnızca birincil eylem ve aktif menü. */
    --accent: #2b4b66;
    --accent-hover: #1f3a50;
    --accent-soft: #e3eaf0;
    --on-accent: #ffffff;

    /* Kenar çubuğu */
    --sidebar-bg: #24292f;
    --sidebar-text: #c8ccd1;
    --sidebar-muted: #8b929b;
    --sidebar-hover: #2d3339;
    --sidebar-active: #33393f;
    --sidebar-border: #363c43;

    /* Anlamsal durum renkleri (yalnızca durum bildirimi için, sönük) */
    --success-text: #256b3a; --success-bg: #e3efe6; --success-border: #b9d7c1;
    --warning-text: #7d5514; --warning-bg: #f6ecd8; --warning-border: #e4cf9e;
    --danger-text: #963232;  --danger-bg: #f6e3e3;  --danger-border: #e2b5b5;
    --info-text: #2b5776;    --info-bg: #e2ebf2;    --info-border: #b4c9d8;
    --neutral-text: #5b6370; --neutral-bg: #ecece9; --neutral-border: #d2d2ce;

    /* ---- Anlamsal durum paleti (tek kaynak) -----------------------------------------
       Renk tek başına anlam taşımaz: her durumun yanında metin etiketi ve/veya şekil (kesik çizgi,
       taralı zemin, ok) bulunur. Metin/zemin çiftleri WCAG AA (>= 4.5:1) sağlar.
       Oda / konaklama durumları */
    --st-clean-text: #1f6a3a;     --st-clean-bg: #e3efe6;     --st-clean-border: #b9d7c1;      /* boş-temiz */
    --st-dirty-text: #8f2d2d;     --st-dirty-bg: #f6e3e3;     --st-dirty-border: #e2b5b5;      /* boş-kirli */
    --st-inspected-text: #1b5e5a; --st-inspected-bg: #dcecea; --st-inspected-border: #a6cbc7;  /* kontrol edildi */
    --st-occupied-text: #2b4b66;  --st-occupied-bg: #e2e9f0;  --st-occupied-border: #b4c6d6;   /* dolu / konaklıyor */
    --st-arriving-text: #0f5c80;  --st-arriving-bg: #d8eaf5;  --st-arriving-border: #a5cbe2;   /* bugün giriş */
    --st-departing-text: #8a4510; --st-departing-bg: #f8e6d3; --st-departing-border: #e5c19b;  /* bugün çıkış */
    --st-ooo-text: #3f444c;       --st-ooo-bg: #e2e2de;       --st-ooo-border: #a9a9a3;        /* arızalı / bloke (taralı) */
    --st-reserved-text: #4d5560;  --st-reserved-bg: #ffffff;  --st-reserved-border: #8b919b;   /* rezerve / opsiyon (kesik çizgi) */
    /* Bakiye: borç / alacak / sıfır */
    --bal-debt: #8f2d2d;  --bal-credit: #256b3a;  --bal-zero: #4d5560;
    /* Öncelik: acil = dolu zemin */
    --prio-urgent-bg: #963232; --prio-urgent-text: #ffffff;

    /* Tipografi ve ölçüler */
    --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
    --fs-base: 13.5px;
    --fs-sm: 12px;
    --fs-xs: 11px;
    --fs-lg: 15px;
    --fs-xl: 18px;
    --radius: 3px;
    --sidebar-w: 216px;
    --topbar-h: 44px;
    --focus: 0 0 0 2px var(--surface), 0 0 0 4px var(--accent);
}

/* Sıfırlama / temel ------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: var(--fs-base); -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font); font-size: 1rem; line-height: 1.45; color: var(--text); background: var(--bg); }
h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: 1.3; }
h1 { font-size: var(--fs-xl); }
h2 { font-size: var(--fs-lg); }
h3 { font-size: 1rem; }
p { margin: 0 0 0.75rem; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
code, .mono { font-family: var(--font-mono); font-size: 0.92em; }
small, .text-sm { font-size: var(--fs-sm); }
.text-xs { font-size: var(--fs-xs); }
.text-muted { color: var(--text-muted); }
.text-faint { color: var(--text-faint); }
.text-right { text-align: right; }
.text-center { text-align: center; }
.nowrap { white-space: nowrap; }
.num { font-variant-numeric: tabular-nums; text-align: right; }
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
:focus-visible { outline: none; box-shadow: var(--focus); }
::selection { background: var(--accent-soft); }

/* Uygulama iskeleti ------------------------------------------------------- */
.app { display: flex; min-height: 100vh; }
.sidebar { width: var(--sidebar-w); flex: 0 0 var(--sidebar-w); background: var(--sidebar-bg); color: var(--sidebar-text); display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; overflow-y: auto; }
.sidebar__brand { height: var(--topbar-h); display: flex; align-items: center; padding: 0 16px; font-weight: 600; font-size: var(--fs-lg); color: #fff; border-bottom: 1px solid var(--sidebar-border); letter-spacing: 0.01em; }
.sidebar__section { padding: 12px 16px 4px; font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.08em; color: var(--sidebar-muted); }
.sidebar__nav { list-style: none; margin: 0; padding: 4px 0; }
.sidebar__link { display: flex; align-items: center; justify-content: space-between; padding: 6px 16px 6px 13px; color: var(--sidebar-text); border-left: 3px solid transparent; font-size: 1rem; }
.sidebar__link:hover { background: var(--sidebar-hover); text-decoration: none; color: #fff; }
.sidebar__link.is-active { background: var(--sidebar-active); border-left-color: var(--accent-soft); color: #fff; font-weight: 600; }
.sidebar__link.is-disabled { color: var(--sidebar-muted); cursor: default; }
.sidebar__link.is-disabled:hover { background: transparent; color: var(--sidebar-muted); }
.sidebar__tag { font-size: var(--fs-xs); color: var(--sidebar-muted); border: 1px solid var(--sidebar-border); border-radius: var(--radius); padding: 0 4px; }
.sidebar__footer { margin-top: auto; padding: 12px 16px; font-size: var(--fs-xs); color: var(--sidebar-muted); border-top: 1px solid var(--sidebar-border); }
.main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.topbar { height: var(--topbar-h); background: var(--surface); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 16px; padding: 0 20px; position: sticky; top: 0; z-index: 10; }
.topbar__toggle { display: none; }
.topbar__hotel { font-weight: 600; }
.topbar__date { display: flex; align-items: baseline; gap: 6px; padding: 2px 10px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-alt); }
.topbar__date-label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-muted); }
.topbar__date-value { font-weight: 600; font-variant-numeric: tabular-nums; }
.topbar__spacer { flex: 1; }
.topbar__user { display: flex; align-items: center; gap: 10px; font-size: var(--fs-sm); color: var(--text-muted); }
.topbar__user strong { color: var(--text); font-weight: 600; }
.topbar__user form { margin: 0; }
.content { padding: 20px; max-width: 1600px; width: 100%; }
.page-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.page-header__subtitle { color: var(--text-muted); margin-top: 2px; font-size: var(--fs-sm); }
.page-header__actions { display: flex; gap: 8px; align-items: center; }

/* Paneller, ızgara ------------------------------------------------------- */
.panel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 16px; }
.panel__header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; border-bottom: 1px solid var(--border); background: var(--surface-alt); }
.panel__title { font-size: 1rem; font-weight: 600; }
.panel__count { font-weight: 400; color: var(--text-muted); margin-left: 6px; }
.panel__body { padding: 12px; }
.panel__body--flush { padding: 0; }
.panel__footer { padding: 8px 12px; border-top: 1px solid var(--border); background: var(--surface-alt); }
.grid { display: grid; gap: 16px; }
.grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.grid--6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 1100px) { .grid--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .grid--2, .grid--3, .grid--4, .grid--6 { grid-template-columns: 1fr; } }
.stack { display: flex; flex-direction: column; gap: 8px; }
.row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.row--between { justify-content: space-between; }
.mb-0 { margin-bottom: 0; } .mb-2 { margin-bottom: 8px; } .mb-4 { margin-bottom: 16px; }
.mt-2 { margin-top: 8px; } .mt-4 { margin-top: 16px; }
.stat { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 10px 12px; }
.stat__label { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-muted); }
.stat__value { font-size: 22px; font-weight: 600; line-height: 1.2; margin-top: 2px; font-variant-numeric: tabular-nums; }
.stat__hint { font-size: var(--fs-sm); color: var(--text-muted); margin-top: 2px; }
.stat--success .stat__value { color: var(--success-text); }
.stat--warning .stat__value { color: var(--warning-text); }
.stat--danger .stat__value { color: var(--danger-text); }
a.stat { display: block; color: inherit; text-decoration: none; }
a.stat:hover { border-color: var(--border-strong); text-decoration: none; }
.dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 16px; margin: 0; }
.dl dt { color: var(--text-muted); }
.dl dd { margin: 0; }

/* Tablolar --------------------------------------------------------------- */
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.table th, .table td { padding: 5px 10px; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--border); }
.table th { font-size: var(--fs-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-muted); background: var(--surface-alt); white-space: nowrap; }
.table tbody tr:hover { background: var(--surface-alt); }
.table tbody tr:last-child td { border-bottom: 0; }
.table td.num, .table th.num { text-align: right; }
.table .row-muted td { color: var(--text-faint); }
.table__sort { color: inherit; display: inline-flex; align-items: center; gap: 4px; }
.table__sort:hover { color: var(--text); text-decoration: none; }
.table__sort.is-active { color: var(--text); }
.table__sort-icon { font-size: 9px; opacity: 0.7; }
.table--compact th, .table--compact td { padding: 3px 8px; }
.table-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; border-top: 1px solid var(--border); background: var(--surface-alt); font-size: var(--fs-sm); color: var(--text-muted); flex-wrap: wrap; }
.pagination { display: flex; gap: 2px; list-style: none; margin: 0; padding: 0; }
.pagination a, .pagination span { display: inline-block; min-width: 26px; padding: 2px 6px; text-align: center; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); color: var(--text); font-size: var(--fs-sm); }
.pagination a:hover { border-color: var(--border-strong); text-decoration: none; }
.pagination .is-active span { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.pagination .is-disabled span { color: var(--text-faint); background: var(--surface-alt); }

/* Durum rozetleri --------------------------------------------------------- */
.pill { display: inline-block; padding: 0 7px; line-height: 18px; font-size: var(--fs-xs); font-weight: 600; border-radius: var(--radius); border: 1px solid; white-space: nowrap; letter-spacing: 0.02em; }
.pill--success { color: var(--success-text); background: var(--success-bg); border-color: var(--success-border); }
.pill--warning { color: var(--warning-text); background: var(--warning-bg); border-color: var(--warning-border); }
.pill--danger  { color: var(--danger-text);  background: var(--danger-bg);  border-color: var(--danger-border); }
.pill--info    { color: var(--info-text);    background: var(--info-bg);    border-color: var(--info-border); }
.pill--neutral { color: var(--neutral-text); background: var(--neutral-bg); border-color: var(--neutral-border); }
.pill--dot::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin-right: 5px; vertical-align: 1px; }

/* Anlamsal durum rozetleri: tone="clean|dirty|inspected|occupied|arriving|departing|ooo|reserved|urgent|debt|credit|zero" */
.pill--clean     { color: var(--st-clean-text);     background: var(--st-clean-bg);     border-color: var(--st-clean-border); }
.pill--dirty     { color: var(--st-dirty-text);     background: var(--st-dirty-bg);     border-color: var(--st-dirty-border); }
.pill--inspected { color: var(--st-inspected-text); background: var(--st-inspected-bg); border-color: var(--st-inspected-border); }
.pill--occupied  { color: var(--st-occupied-text);  background: var(--st-occupied-bg);  border-color: var(--st-occupied-border); }
.pill--arriving  { color: var(--st-arriving-text);  background: var(--st-arriving-bg);  border-color: var(--st-arriving-border); }
.pill--arriving:not(.pill--dot)::before { content: "\2192\00a0"; }
.pill--departing { color: var(--st-departing-text); background: var(--st-departing-bg); border-color: var(--st-departing-border); }
.pill--departing:not(.pill--dot)::before { content: "\2190\00a0"; }
.pill--ooo       { color: var(--st-ooo-text); border-color: var(--st-ooo-border); background: repeating-linear-gradient(135deg, var(--st-ooo-bg) 0 4px, #ecece9 4px 8px); }
.pill--reserved  { color: var(--st-reserved-text); background: var(--st-reserved-bg); border-color: var(--st-reserved-border); border-style: dashed; }
.pill--urgent    { color: var(--prio-urgent-text); background: var(--prio-urgent-bg); border-color: var(--prio-urgent-bg); }
.pill--debt      { color: var(--bal-debt);   background: var(--danger-bg);  border-color: var(--danger-border); }
.pill--credit    { color: var(--bal-credit); background: var(--success-bg); border-color: var(--success-border); }
.pill--zero      { color: var(--bal-zero);   background: var(--neutral-bg); border-color: var(--neutral-border); }

/* Renk açıklaması (legend) */
.legend { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; margin-bottom: 8px; font-size: var(--fs-sm); color: var(--text-muted); }
.legend__title { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.06em; margin-right: 2px; }
.legend__note { margin-left: 4px; }

/* Düğmeler ---------------------------------------------------------------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 30px; padding: 0 12px; font: inherit; font-size: 1rem; font-weight: 500; line-height: 1; border: 1px solid var(--border-strong); border-radius: var(--radius); background: var(--surface); color: var(--text); cursor: pointer; white-space: nowrap; text-decoration: none; }
.btn:hover { background: var(--surface-alt); text-decoration: none; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; }
.btn--primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.btn--primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
.btn--danger { color: var(--danger-text); border-color: var(--danger-border); }
.btn--danger:hover { background: var(--danger-bg); }
.btn--link { border-color: transparent; background: transparent; color: var(--accent); padding: 0 4px; }
.btn--link:hover { background: transparent; text-decoration: underline; }
.btn--sm { height: 24px; padding: 0 8px; font-size: var(--fs-sm); }
.btn--block { width: 100%; }

/* Formlar ----------------------------------------------------------------- */
.form-grid { display: grid; gap: 12px 16px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.form-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.form-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 700px) { .form-grid--2, .form-grid--3, .form-grid--4 { grid-template-columns: 1fr; } }
.field { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.field--span-2 { grid-column: span 2; }
.field--span-full { grid-column: 1 / -1; }
.field__label { font-size: var(--fs-sm); font-weight: 600; color: var(--text-muted); }
.field__label .req { color: var(--danger-text); margin-left: 2px; }
.field__help { font-size: var(--fs-xs); color: var(--text-faint); }
.field__error { font-size: var(--fs-xs); color: var(--danger-text); }
.input, .select, .textarea { width: 100%; height: 30px; padding: 0 8px; font: inherit; font-size: 1rem; color: var(--text); background: var(--surface); border: 1px solid var(--border-strong); border-radius: var(--radius); }
.textarea { height: auto; min-height: 72px; padding: 6px 8px; resize: vertical; }
.input:focus, .select:focus, .textarea:focus { border-color: var(--accent); }
.input.is-invalid, .select.is-invalid, .textarea.is-invalid { border-color: var(--danger-text); }
.input:disabled, .select:disabled, .textarea:disabled, .input[readonly] { background: var(--surface-alt); color: var(--text-muted); }
.select { padding-right: 24px; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%235b6370'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center; }
.checkbox { display: inline-flex; align-items: center; gap: 6px; font-size: 1rem; cursor: pointer; }
.checkbox input { width: 14px; height: 14px; margin: 0; accent-color: var(--accent); }
.form-actions { display: flex; gap: 8px; align-items: center; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border); }
.input-money { text-align: right; font-variant-numeric: tabular-nums; }
.filters { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end; padding: 10px 12px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 12px; }
.filters .field { min-width: 140px; }
.filters .field--grow { flex: 1 1 200px; }
.filters__actions { display: flex; gap: 6px; }

/* Bildirimler ------------------------------------------------------------- */
.alert { padding: 8px 12px; border: 1px solid; border-radius: var(--radius); margin-bottom: 12px; font-size: 1rem; display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.alert--success { color: var(--success-text); background: var(--success-bg); border-color: var(--success-border); }
.alert--warning { color: var(--warning-text); background: var(--warning-bg); border-color: var(--warning-border); }
.alert--danger  { color: var(--danger-text);  background: var(--danger-bg);  border-color: var(--danger-border); }
.alert--info    { color: var(--info-text);    background: var(--info-bg);    border-color: var(--info-border); }
.alert ul { margin: 4px 0 0; padding-left: 18px; }
.alert__close { background: none; border: 0; font: inherit; color: inherit; cursor: pointer; opacity: 0.7; padding: 0 2px; line-height: 1; }
.alert__close:hover { opacity: 1; }
.empty { padding: 24px 12px; text-align: center; color: var(--text-muted); font-size: var(--fs-sm); }
dialog.confirm { border: 1px solid var(--border-strong); border-radius: var(--radius); padding: 0; max-width: 420px; width: calc(100% - 32px); color: var(--text); background: var(--surface); }
dialog.confirm::backdrop { background: rgba(30, 34, 39, 0.45); }
.confirm__body { padding: 16px; }
.confirm__title { font-weight: 600; margin-bottom: 6px; }
.confirm__actions { display: flex; justify-content: flex-end; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--border); background: var(--surface-alt); }

/* Panel: hızlı işlemler ve dikkat sayaçları ------------------------------- */
.quick { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; margin-bottom: 12px; padding: 8px 12px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.quick__title { font-size: var(--fs-xs); text-transform: uppercase; letter-spacing: 0.06em; color: var(--text-muted); margin-right: 4px; }
.attn { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; margin-bottom: 16px; }
.attn__item { display: flex; align-items: center; gap: 10px; padding: 6px 10px; background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--border-strong); border-radius: var(--radius); color: var(--text); }
a.attn__item:hover { text-decoration: none; border-color: var(--border-strong); background: var(--surface-alt); }
.attn__value { font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; min-width: 1.6em; }
.attn__label { display: flex; flex-direction: column; line-height: 1.25; }
.attn__label small { color: var(--text-muted); font-size: var(--fs-xs); }
.attn__item--warning { border-left-color: var(--warning-text); background: var(--warning-bg); }
.attn__item--danger { border-left-color: var(--danger-text); background: var(--danger-bg); }
.attn__item--success { border-left-color: var(--success-text); }
.attn__item--warning .attn__value { color: var(--warning-text); }
.attn__item--danger .attn__value { color: var(--danger-text); }
.attn__item--success .attn__value { color: var(--success-text); }
.grid-span-2 { grid-column: span 2; }
.kbd { display: inline-block; min-width: 18px; padding: 0 5px; margin-left: 6px; font: 600 var(--fs-xs)/16px var(--font-mono); text-align: center; color: var(--text-muted); background: var(--surface-alt); border: 1px solid var(--border-strong); border-radius: var(--radius); }
.btn--primary .kbd { color: var(--on-accent); background: transparent; border-color: rgba(255, 255, 255, 0.55); }
.topbar__help { color: var(--text-muted); }
.scrim { display: none; }
dialog.shortcuts { max-width: 380px; }

/* Giriş ekranı ------------------------------------------------------------ */
.auth { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; }
.auth__box { width: 100%; max-width: 360px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }
.auth__header { padding: 16px 20px; border-bottom: 1px solid var(--border); background: var(--surface-alt); }
.auth__brand { font-weight: 600; font-size: var(--fs-lg); }
.auth__sub { font-size: var(--fs-sm); color: var(--text-muted); }
.auth__body { padding: 20px; }
.auth__footer { padding: 10px 20px; font-size: var(--fs-xs); color: var(--text-faint); border-top: 1px solid var(--border); }

/* Duyarlılık / yazdırma --------------------------------------------------- */
@media (max-width: 1100px) {
    .grid--3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .grid--3 > .grid-span-2 { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
    .grid--2, .grid--3 { grid-template-columns: 1fr; }
    .scrim { display: block; position: fixed; inset: 0; z-index: 15; background: rgba(30, 34, 39, 0.4); }
    .sidebar { position: fixed; left: 0; top: 0; z-index: 20; transform: translateX(-100%); transition: transform 0.15s ease; }
    .sidebar.is-open { transform: translateX(0); }
    .topbar__toggle { display: inline-flex; }
    .topbar__hotel { display: none; }
    .topbar { gap: 10px; padding: 0 12px; }
    .topbar__user > span { display: none; }
    .btn { height: 36px; }
    .btn--sm { height: 30px; }
    .input, .select { height: 36px; }
    .content { padding: 12px; }
}
@media print {
    .sidebar, .scrim, .topbar, .quick, .filters, .table-footer, .page-header__actions, .btn, dialog, .legend { display: none !important; }
    body { background: #fff; color: #000; }
    .content { padding: 0; max-width: none; }
    .panel, .stat, .attn__item { border: 0; background: #fff; }
    .table th, .table td { border-bottom: 1px solid #999; color: #000; }
    .pill { color: #000 !important; background: #fff !important; border: 1px solid #555 !important; }
    a { color: #000; text-decoration: none; }
    .table-wrap, .tl-wrap { overflow: visible; }
}

/* Yazdırma / PDF (tarayıcıdan "PDF olarak kaydet"): liste ve raporlar A4 yatay, başlık satırı her sayfada tekrarlanır */
@media print {
    @page { size: A4 landscape; margin: 10mm; }
    body { font-size: 11px; }
    .tabs, .pagination, .alert, input[type="checkbox"], .field__help, .no-print { display: none !important; }
    .table thead { display: table-header-group; }
    .table tr { break-inside: avoid; page-break-inside: avoid; }
    .table th, .table td { padding: 3px 6px; }
    .panel__header { border: 0; padding-left: 0; }
    .grid { display: block; }
    .grid > * { margin-bottom: 8px; }
    a[href]:after { content: none !important; }
}