/* =========================================================
   OTEL YÖNETİM SİSTEMİ — Arayüz
   Bootstrap 5 üzerine ince bir katman.
   Renkleri değiştirmek için :root içindeki değişkenleri düzenleyin.
   Marka rengi (--brand) Ayarlar ekranından değiştirilebilir.
   ========================================================= */

:root{
  --brand:#0E7490;
  --ink:#0B1B2B;
  /* Sol menü renkleri */
  --side-bg:#2B4C66;
  --side-bg-2:#22405A;
  --side-text:#E3ECF4;
  --side-muted:#A9BDCF;
  --bg:#F3F5F8;
  --surface:#FFFFFF;
  --line:#E3E8EF;
  --line-2:#EEF2F6;
  --text:#18212D;
  --muted:#667386;
  --radius:14px;
  --side-w:250px;

  /* Oda durum renkleri */
  --c-vacant:#16A34A;   --c-vacant-bg:#ECFDF3;
  --c-occupied:#2563EB; --c-occupied-bg:#EEF4FF;
  --c-dirty:#D97706;    --c-dirty-bg:#FFF7E8;
  --c-blocked:#DC2626;  --c-blocked-bg:#FEF1F1;
  --c-arrival:#9333EA;  --c-arrival-bg:#F7F0FF;

  --font:"Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Leelawadee UI","Noto Sans Thai","Sylfaen","Noto Sans Georgian","Helvetica Neue",Arial,sans-serif;
}

*{box-sizing:border-box}
[hidden]{display:none!important}   /* hidden özniteliği Bootstrap d-flex gibi sınıflara da üstün gelsin */
html,body{min-height:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:14.5px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.min-w-0{min-width:0}
.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.text-brand{color:var(--brand)!important}
.fw-650{font-weight:650}

/* ---------- Butonlar ---------- */
.btn{border-radius:10px;font-weight:500}
.btn-brand{background:var(--brand);border-color:var(--brand);color:#fff;align-items:center}
.btn-brand:hover,.btn-brand:focus{background:var(--brand);border-color:var(--brand);color:#fff;filter:brightness(.92)}
.btn-light{background:#fff;border-color:var(--line)}
.btn-light:hover{background:var(--line-2);border-color:var(--line)}
.btn-icon{border:1px solid var(--line);background:#fff;color:var(--text);width:38px;height:38px;border-radius:10px;display:inline-grid;place-items:center;font-size:17px;cursor:pointer}
.btn-icon:hover{background:var(--line-2)}
.btn-dots{border:0;background:transparent;width:32px;height:32px;border-radius:8px;display:inline-grid;place-items:center;color:var(--muted);font-size:17px}
.btn-dots:hover,.btn-dots[aria-expanded=true]{background:var(--line-2);color:var(--text)}
.lang-abbr{font-size:12px;font-weight:700;letter-spacing:.04em}
.dropdown-menu{z-index:1045;max-height:min(72vh,620px);overflow-y:auto;overscroll-behavior:contain;border-radius:12px;border-color:var(--line);box-shadow:0 12px 32px rgba(16,24,40,.12);padding:6px;font-size:14px}
.dropdown-item{border-radius:8px;padding:7px 10px;display:flex;align-items:center;gap:9px}
.dropdown-item i{width:18px;text-align:center;opacity:.8}
.dropdown-item.active,.dropdown-item:active{background:var(--brand)}

/* ---------- Sol menü ---------- */
.side{position:fixed;inset:0 auto 0 0;width:var(--side-w);z-index:1040;background:linear-gradient(180deg,var(--side-bg) 0%,var(--side-bg-2) 100%);color:var(--side-text);display:flex;flex-direction:column;transition:transform .2s ease,width .2s ease;box-shadow:1px 0 0 rgba(0,0,0,.05)}
.side-brand{display:flex;align-items:center;gap:10px;padding:18px 18px 16px;border-bottom:1px solid rgba(255,255,255,.10);text-decoration:none!important}
.side-brand img{max-height:36px;max-width:160px;object-fit:contain}
.side-mark{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--brand);color:#fff;font-size:18px;flex:none;box-shadow:0 4px 10px rgba(0,0,0,.18)}
.side-name{color:#fff;font-weight:650;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-nav{flex:1;overflow-y:auto;padding:12px 10px}
.side-nav::-webkit-scrollbar{width:6px}.side-nav::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:6px}
/* Açılır / kapanır grup başlığı */
.side-sec{margin-top:6px}
.side-group{width:100%;display:flex;align-items:center;gap:10px;border:0;background:transparent;text-align:left;font-size:11px;letter-spacing:.08em;
  color:var(--side-muted);text-transform:uppercase;padding:10px 11px 6px;font-weight:700;border-radius:8px;cursor:pointer}
.side-group:hover{color:#fff;background:rgba(255,255,255,.05)}
.side-group i:first-child{font-size:14px;width:20px;text-align:center}
.side-group span{flex:1}
.side-chev{font-size:11px;transition:transform .2s ease}
.side-sec.closed .side-chev{transform:rotate(-90deg)}
.side-sub{display:grid;grid-template-rows:1fr;transition:grid-template-rows .2s ease}
.side-sub>*{min-height:0}
.side-sec.closed .side-sub{display:none}
.side-link{display:flex;align-items:center;gap:11px;padding:9px 11px;margin:2px 0;border-radius:10px;color:var(--side-text);font-weight:500;font-size:14px;
  text-decoration:none!important;transition:background .15s,box-shadow .15s,color .15s}
.side-link i{font-size:16.5px;width:20px;text-align:center;opacity:.9}
.side-link span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-link:hover{background:rgba(255,255,255,.09);color:#fff}
/* Bulunduğumuz sayfa: beyaz zemin + belirgin gölge */
.side-link.active{background:#fff;color:var(--side-bg-2);font-weight:650;box-shadow:0 8px 20px -6px rgba(3,18,32,.55),0 2px 6px rgba(3,18,32,.25)}
.side-link.active i{color:var(--brand);opacity:1}
.side-badge{font-style:normal;background:#F59E0B;color:#111;border-radius:20px;font-size:11px;font-weight:700;padding:1px 7px}
.side-foot{padding:12px 14px;border-top:1px solid rgba(255,255,255,.10);display:flex;align-items:center;gap:10px}
.avatar{width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff;font-weight:650}
.su-name{color:#fff;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.su-role{font-size:12px;color:var(--side-muted)}
.side-backdrop{position:fixed;inset:0;background:rgba(10,16,24,.5);z-index:1035;display:none}
.side-backdrop.show{display:block}

html.side-mini .side{width:72px}
html.side-mini .side-name,html.side-mini .side-link span,html.side-mini .side-group,html.side-mini .side-chev,html.side-mini .su-name,html.side-mini .su-role,html.side-mini .side-foot .min-w-0{display:none}
html.side-mini .side-link{justify-content:center;padding:10px 0;position:relative}
html.side-mini .side-badge{position:absolute;top:2px;right:6px;font-size:9px;padding:0 5px}
html.side-mini .side-brand,html.side-mini .side-foot{justify-content:center;padding-left:6px;padding-right:6px}
html.side-mini .main{margin-left:72px}
html.side-mini .side-sec.closed .side-sub{display:grid}
html.side-mini .side-sec{margin-top:4px;padding-top:4px;border-top:1px solid rgba(255,255,255,.08)}

/* ---------- Ana alan ---------- */
.main{margin-left:var(--side-w);min-height:100vh;display:flex;flex-direction:column;transition:margin-left .2s ease;min-width:0}
.topbar{position:sticky;top:0;z-index:1020;background:rgba(255,255,255,.9);backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid var(--line);padding:11px 22px;display:flex;align-items:center;gap:10px}
.tb-title{flex:1;min-width:0}
.tb-title h1{margin:0;font-size:19px;font-weight:650;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-right{display:flex;align-items:center;gap:8px}
.tb-actions{display:flex;align-items:center;gap:8px}
.content{padding:22px;flex:1;min-width:0}
.foot{display:flex;justify-content:space-between;padding:14px 22px;font-size:12.5px;color:var(--muted);border-top:1px solid var(--line)}

@media (max-width:991.98px){
  .side{transform:translateX(-100%)}
  .side.show{transform:none}
  .main,html.side-mini .main{margin-left:0}
  html.side-mini .side{width:var(--side-w)}
  .content{padding:14px}
  .topbar{padding:10px 14px}
}

/* ---------- Kartlar / paneller ---------- */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:18px}
.panel-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.panel-head h2{font-size:15.5px;font-weight:650;margin:0;flex:1;display:flex;align-items:center;gap:8px}
.panel-head h2 .count{background:var(--line-2);color:var(--muted);border-radius:20px;font-size:12px;padding:1px 9px;font-weight:600}
.panel-body{padding:18px}
.panel-body.p0{padding:0}

/* Özet kutuları */
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:14px;margin-bottom:18px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:15px 16px;display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none!important}
a.kpi:hover{border-color:var(--brand)}
.kpi-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font-size:19px;flex:none;background:var(--line-2);color:var(--brand)}
.kpi small{display:block;color:var(--muted);font-size:12.5px;font-weight:500}
.kpi b{white-space:nowrap;font-size:19px;font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.kpi.k-green .kpi-ic{background:var(--c-vacant-bg);color:var(--c-vacant)}
.kpi.k-blue .kpi-ic{background:var(--c-occupied-bg);color:var(--c-occupied)}
.kpi.k-amber .kpi-ic{background:var(--c-dirty-bg);color:var(--c-dirty)}
.kpi.k-red .kpi-ic{background:var(--c-blocked-bg);color:var(--c-blocked)}
.kpi.k-purple .kpi-ic{background:var(--c-arrival-bg);color:var(--c-arrival)}

/* ---------- Tablolar ---------- */
.table{margin:0;font-size:14px;--bs-table-hover-bg:#F7F9FC}
.table thead th{font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:650;background:#FAFBFD;border-bottom:1px solid var(--line);white-space:nowrap;padding:10px 12px}
.table td{padding:10px 12px;vertical-align:middle;border-color:var(--line-2)}
.table tfoot td{font-weight:650;background:#FAFBFD}
.table-wrap{overflow-x:auto}
.sub{display:block;font-size:12.5px;color:var(--muted)}
.row-late td:first-child{box-shadow:inset 3px 0 0 var(--c-blocked)}
.row-today td:first-child{box-shadow:inset 3px 0 0 var(--c-arrival)}

/* Durum etiketleri */
.badge-st{display:inline-block;font-size:12px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--line-2);color:var(--muted);white-space:nowrap}
.st-pending,.st-upcoming,.st-open,.st-stored{background:#FFF7E8;color:#B45309}
.st-checked_in,.st-in_progress,.st-partial{background:var(--c-occupied-bg);color:var(--c-occupied)}
.st-checked_out,.st-done,.st-paid,.st-resolved,.st-returned{background:var(--c-vacant-bg);color:#15803D}
.st-cancelled,.st-no_show,.st-overdue,.st-disposed{background:var(--c-blocked-bg);color:var(--c-blocked)}
.st-clean{background:var(--c-vacant-bg);color:#15803D}
.st-dirty{background:var(--c-dirty-bg);color:#B45309}
.prio{font-size:11.5px;font-weight:650;padding:2px 8px;border-radius:6px}
.prio-low{background:var(--line-2);color:var(--muted)}
.prio-normal{background:var(--c-occupied-bg);color:var(--c-occupied)}
.prio-high{background:var(--c-blocked-bg);color:var(--c-blocked)}
.vip{background:#FEF3C7;color:#92400E;font-size:10.5px;font-weight:700;border-radius:5px;padding:1px 5px;margin-left:4px}

/* Sekmeler */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:18px;overflow-x:auto}
.tabs a{padding:10px 14px;color:var(--muted);font-weight:550;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;text-decoration:none!important}
.tabs a:hover{color:var(--text)}
.tabs a.active{color:var(--brand);border-bottom-color:var(--brand)}
.tabs a .count{background:var(--line-2);border-radius:20px;font-size:11.5px;padding:0 7px;margin-left:5px}

/* Filtre çubuğu */
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.filters .form-control,.filters .form-select{width:auto;min-width:140px}
.filters .grow{flex:1;min-width:200px}

/* Boş liste */
.empty{text-align:center;padding:44px 20px;color:var(--muted)}
.empty i{font-size:34px;opacity:.5}
.empty p{margin:8px 0 0}

/* ---------- Formlar / modallar ---------- */
.form-label{font-size:13px;font-weight:600;color:#3B4656;margin-bottom:4px}
.form-control,.form-select{border-radius:10px;border-color:#D6DDE6}
.form-control:focus,.form-select:focus{border-color:var(--brand);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--brand) 18%,transparent)}
.modal-content{border-radius:16px;border:0}
.modal-header{border-bottom-color:var(--line-2)}
.modal-footer{border-top-color:var(--line-2)}
.modal-title{font-size:17px;font-weight:650}
.form-section{margin-bottom:18px}
.fs-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:10px;display:flex;gap:6px;align-items:center}
.price-card{background:#F8FAFC;border:1px solid var(--line);border-radius:14px;padding:14px}
.sum-list{display:grid;grid-template-columns:1fr auto;gap:5px 10px;margin:0;font-size:14px}
.sum-list dt{font-weight:500;color:var(--muted)}
.sum-list dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.sum-list .grand{font-size:17px;color:var(--text);font-weight:700;border-top:1px dashed var(--line);padding-top:6px}
.breakdown{max-height:180px;overflow:auto;font-size:13px;margin-top:6px}
.breakdown div{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dotted var(--line)}
.breakdown em{color:var(--c-arrival);font-style:normal;font-size:11.5px;margin-left:6px}
.plan-row{display:grid;grid-template-columns:1fr 1fr 1.2fr auto;gap:6px;margin-bottom:6px}
.info-strip{display:flex;flex-wrap:wrap;gap:6px 22px;background:#F8FAFC;border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.info-strip small{display:block;color:var(--muted);font-size:11.5px}
.info-strip b{font-weight:650}

/* Otomatik tamamlama */
.guest-pick{position:relative}
.ac-list{position:absolute;left:0;right:0;top:100%;z-index:20;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(16,24,40,.14);max-height:260px;overflow:auto;display:none;margin-top:4px}
.ac-list.show{display:block}
.ac-item{padding:8px 12px;cursor:pointer;border-bottom:1px solid var(--line-2)}
.ac-item:hover,.ac-item.hl{background:#F1F6FB}
.ac-item small{color:var(--muted);display:block;font-size:12px}
.picked{display:flex;align-items:center;gap:10px;background:var(--c-occupied-bg);border-radius:12px;padding:8px 12px}
.picked:empty{display:none}
.picked .avatar{background:var(--c-occupied);width:32px;height:32px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:6px;background:var(--line-2);border-radius:20px;padding:4px 6px 4px 12px;font-size:13px}
.chip button{border:0;background:transparent;line-height:1;color:var(--muted);padding:2px 4px}
.new-guest{background:#F8FAFC;border:1px dashed #C9D3DF;border-radius:12px;padding:12px}

/* ---------- ODA DURUM PANOSU ---------- */
.board-legend{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
.flt{border:1px solid var(--line);background:#fff;border-radius:20px;padding:5px 12px;font-size:13px;font-weight:550;display:inline-flex;align-items:center;gap:7px;cursor:pointer;color:var(--text)}
.flt b{font-variant-numeric:tabular-nums}
.flt .dot{width:9px;height:9px;border-radius:50%}
.flt.active{border-color:var(--text);box-shadow:inset 0 0 0 1px var(--text)}
.floor-title{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin:22px 0 10px;display:flex;align-items:center;gap:10px}
.floor-title:after{content:"";flex:1;height:1px;background:var(--line)}
.room-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:12px}
.rc{position:relative;background:#fff;border:1px solid var(--line);border-radius:14px;padding:11px 12px 12px;min-height:150px;display:flex;flex-direction:column;border-top:4px solid var(--c-vacant);transition:box-shadow .15s}
.rc:hover{box-shadow:0 8px 22px rgba(16,24,40,.08)}
.rc.occupied{border-top-color:var(--c-occupied);background:linear-gradient(180deg,var(--c-occupied-bg),#fff 55%)}
.rc.blocked{border-top-color:var(--c-blocked);background:linear-gradient(180deg,var(--c-blocked-bg),#fff 55%)}
.rc.vacant.dirty{border-top-color:var(--c-dirty);background:linear-gradient(180deg,var(--c-dirty-bg),#fff 55%)}
.rc-top{display:flex;align-items:flex-start;gap:6px}
.rc-no{font-size:22px;font-weight:750;letter-spacing:-.02em;line-height:1.1}
.rc-type{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-top .btn-dots{margin-left:auto;margin-top:-4px;margin-right:-6px}
.rc-tags{display:flex;flex-wrap:wrap;gap:4px;margin:7px 0}
.tag{font-size:11px;font-weight:650;border-radius:6px;padding:1px 7px;display:inline-flex;align-items:center;gap:3px}
.tag-vacant{background:var(--c-vacant-bg);color:#15803D}
.tag-occupied{background:#DCE8FF;color:#1D4ED8}
.tag-dirty{background:#FDECC8;color:#9A5B06}
.tag-clean{background:var(--c-vacant-bg);color:#15803D}
.tag-blocked{background:#FDDCDC;color:#B91C1C}
.tag-arrival{background:#EFE3FF;color:#7E22CE}
.tag-departure{background:#FFE4E6;color:#BE123C}
.rc-guests{font-size:13px;font-weight:600;line-height:1.35;flex:1}
.rc-guests span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rc-foot{font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 6px;margin-top:6px;align-items:center}
.rc-foot b{color:var(--text)}
.rc-quick{border:1px dashed #C7D1DD;background:transparent;border-radius:9px;width:100%;padding:6px;font-size:12.5px;color:var(--muted);font-weight:550;margin-top:auto}
.rc-quick:hover{border-color:var(--brand);color:var(--brand);background:#fff}
.rc-icons{display:flex;gap:6px;font-size:12px}
.rc-icons i{color:var(--c-dirty)}
.rc .bal{color:var(--c-blocked);font-weight:650;white-space:nowrap}
.is-hidden{display:none!important}

/* Takvim */
.cal-wrap{overflow:auto;border:1px solid var(--line);border-radius:var(--radius);background:#fff;max-height:calc(100vh - 210px)}
.cal{border-collapse:separate;border-spacing:0;font-size:12.5px;min-width:100%}
.cal th,.cal td{border-right:1px solid var(--line-2);border-bottom:1px solid var(--line-2);height:38px;min-width:46px;padding:0;text-align:center}
.cal thead th{position:sticky;top:0;background:#FAFBFD;z-index:2;font-weight:600;font-size:11.5px;line-height:1.2;padding:4px 2px}
.cal thead th.today{background:var(--brand);color:#fff}
.cal thead th.we{color:#B45309}
.cal .rcol{position:sticky;left:0;background:#fff;z-index:1;text-align:left;padding:0 10px;min-width:110px;white-space:nowrap;font-weight:650}
.cal thead .rcol{z-index:3;background:#FAFBFD}
.cal .rcol small{color:var(--muted);font-weight:500;margin-left:4px}
.cal td.free{cursor:pointer}
.cal td.free:hover{background:#F1F6FB}
.cal td.free:hover:after{content:"+";color:var(--brand);font-weight:700}
.cal td.today-col{background:#F6FAFD}
.cal .bar{display:block;margin:4px 1px;padding:4px 7px;border-radius:7px;color:#fff;font-weight:600;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;text-decoration:none!important}
.cal .bar.pending{background:#A855F7}
.cal .bar.checked_in{background:#2563EB}
.cal .bar.checked_out{background:#94A3B8}

/* Görevlerim (personel ekranı) */
.task-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;gap:14px;align-items:center;margin-bottom:10px}
.task-room{width:58px;height:58px;border-radius:12px;background:var(--line-2);display:grid;place-items:center;font-weight:750;font-size:19px;flex:none}
.task-card.high .task-room{background:var(--c-blocked-bg);color:var(--c-blocked)}
.task-card .btn-done{min-width:120px}
@media (max-width:575.98px){.task-card{flex-wrap:wrap}.task-card .btn-done{width:100%}}

/* Detay sayfası */
.dl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.dl-grid small{display:block;color:var(--muted);font-size:12px}
.dl-grid b{font-weight:600}
.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.doc{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.doc-thumb{height:110px;background:#F1F4F8;display:grid;place-items:center;color:var(--muted);font-size:34px;overflow:hidden}
.doc-thumb img{width:100%;height:100%;object-fit:cover}
.doc-meta{padding:8px 10px;font-size:12.5px}
.doc-meta b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.amen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px}
.amen-list{display:flex;flex-wrap:wrap;gap:4px}
.amen-list span{font-size:12px;background:var(--line-2);border-radius:6px;padding:1px 7px;color:#3B4656}

/* Raporlar: basit çubuk grafik */
.bars{display:flex;align-items:flex-end;gap:3px;height:160px;padding-top:10px}
.bars .b{flex:1;background:color-mix(in srgb,var(--brand) 75%,#fff);border-radius:4px 4px 0 0;min-height:2px;position:relative}
.bars .b:hover{background:var(--brand)}
.bars-x{display:flex;gap:3px;font-size:10.5px;color:var(--muted);margin-top:4px}
.bars-x span{flex:1;text-align:center;overflow:hidden}
.meter{height:8px;background:var(--line-2);border-radius:8px;overflow:hidden}
.meter span{display:block;height:100%;background:var(--brand);border-radius:8px}

/* Giriş ekranı */
.auth{min-height:100vh;display:grid;grid-template-columns:1.1fr 1fr}
.auth-art{background:linear-gradient(160deg,var(--side-bg),var(--side-bg-2));color:#fff;padding:48px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.auth-art:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-160px;bottom:-200px;background:var(--brand);opacity:.35}
.auth-art h2{font-size:34px;font-weight:700;letter-spacing:-.02em;max-width:420px;position:relative}
.auth-art p{color:#AFC0D2;max-width:420px;position:relative}
.auth-form{display:flex;align-items:center;justify-content:center;padding:32px}
.auth-box{width:100%;max-width:370px}
@media (max-width:860px){.auth{grid-template-columns:1fr}.auth-art{display:none}}

/* Orta genişlikte ekranlar (küçük dizüstü): tablolar sıkışık, ikincil sütunlar gizli */
@media (min-width:992px) and (max-width:1399.98px){
  .table td,.table thead th{padding-left:8px;padding-right:8px}
  .table{font-size:13.5px}
  .opt{display:none!important}
}

/* Belge yükleme kutusu (pasaport tarama) */
.doc-up{background:#F8FAFC;border:1px dashed #C9D3DF;border-radius:12px;padding:10px}
.du-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.du-list{display:grid;gap:8px;margin-top:8px}
.du-list:empty{margin-top:0}
.du-item{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:10px;padding:6px}
.du-thumb{width:56px;height:44px;border-radius:7px;background:#EEF2F6;display:grid;place-items:center;overflow:hidden;color:#DC2626;font-size:22px}
.du-thumb img{width:100%;height:100%;object-fit:cover}
.du-meta{min-width:0}
.du-meta small{display:block;color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}

/* =========================================================
   TELEFON VE TABLET
   ========================================================= */
.bottom-nav{display:none}
@media (max-width:991.98px){
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .bottom-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1030;background:#fff;border-top:1px solid var(--line);
    padding:4px 4px calc(4px + env(safe-area-inset-bottom));box-shadow:0 -6px 20px rgba(16,24,40,.06)}
  .bn-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border:0;background:none;
    color:var(--muted);font-size:20px;padding:6px 2px;position:relative;text-decoration:none!important;min-height:52px}
  .bn-item em{font-style:normal;font-size:10.5px;font-weight:600;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .bn-item.active{color:var(--brand)}
  .bn-new span{width:46px;height:46px;border-radius:50%;background:var(--brand);color:#fff;display:grid;place-items:center;margin-top:-22px;
    box-shadow:0 6px 16px rgba(14,116,144,.35);border:3px solid #fff}
  .bn-new em{color:var(--brand)}
  .bn-badge{position:absolute;top:2px;left:calc(50% + 6px);background:#F59E0B;color:#111;font-size:10px;border-radius:10px;padding:0 5px;line-height:16px}
  .foot{display:none}
  .side-nav{padding-bottom:20px}
}
@media (max-width:767.98px){
  body{font-size:15px}
  .content{padding:12px}
  .topbar{flex-wrap:wrap;padding:8px 12px;gap:8px}
  .tb-title h1{font-size:17px}
  .tb-actions{order:3;width:100%;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch}
  .tb-actions .btn,.tb-actions .btn-group{flex:none}
  .btn-icon{width:40px;height:40px}
  .btn-dots{width:40px;height:40px}
  .panel{border-radius:12px;margin-bottom:12px}
  .panel-head{padding:12px 14px}
  .panel-body{padding:14px}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:12px}
  .kpi{padding:12px;gap:10px;flex-direction:column;align-items:flex-start}
  .kpi-ic{width:34px;height:34px;font-size:16px}
  .kpi b{font-size:17px;white-space:normal}
  .filters .form-control,.filters .form-select{min-width:0;flex:1 1 140px}
  .filters .grow{flex-basis:100%}
  .tabs a{padding:9px 10px;font-size:14px}
  .room-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .rc{min-height:140px;padding:9px 10px 10px}
  .rc-no{font-size:20px}
  .dl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .info-strip{gap:6px 14px}
  .plan-row{grid-template-columns:1fr 1fr auto}
  .plan-row [name="plan_note[]"]{grid-column:1 / 3}
  .form-control,.form-select{font-size:16px}          /* iPhone'da kutuya dokununca ekran büyümesin */
  .modal-footer{position:sticky;bottom:0;background:#fff}
  .task-card{padding:12px}
  .doc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .amen-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cal-wrap{max-height:none}
  .board-legend{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px}
  .flt{flex:none}
  #floorFilter{min-width:130px}

}

/* Tablet ve telefon: tablolar kart görünümüne geçer (yana kaydırma gerekmez) */
@media (max-width:991.98px){
  /* Tablolar telefonda kart olur: her satır bir kutu, her hücre "Başlık: değer" */
  table.table-cards thead{display:none}
  table.table-cards,table.table-cards tbody,table.table-cards tr,table.table-cards td,table.table-cards tfoot{display:block;width:100%}
  table.table-cards tr{border-bottom:8px solid var(--bg);padding:8px 4px;position:relative}
  table.table-cards td{border:0;padding:3px 10px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;text-align:right;white-space:normal!important;overflow-wrap:anywhere}
  table.table-cards td>*{max-width:100%}
  table.table-cards td[data-label]:before{content:attr(data-label);font-size:12px;color:var(--muted);font-weight:600;text-align:left;flex:none;max-width:45%}
  table.table-cards td:not([data-label]),table.table-cards td[data-label=""]{justify-content:flex-end}
  table.table-cards td[data-label=""]:before{display:none}
  table.table-cards td:first-child{font-size:15.5px}
  table.table-cards td .sub{text-align:right}
  table.table-cards td.num{text-align:right}
  table.table-cards tfoot tr{border-bottom:0}
  table.table-cards tfoot td:empty{display:none}
  table.table-cards .row-late,table.table-cards .row-today{border-left:0}
  table.table-cards tr.row-late{box-shadow:inset 4px 0 0 var(--c-blocked)}
  table.table-cards tr.row-today{box-shadow:inset 4px 0 0 var(--c-arrival)}
  table.table-cards tr td:first-child{box-shadow:none!important}
}

/* Küçük dizüstü + sol menü açık: içerik dar kalır, tablolar kart görünümüne geçer */
@media (min-width:992px) and (max-width:1199.98px){
  /* Tablolar telefonda kart olur: her satır bir kutu, her hücre "Başlık: değer" */
  html:not(.side-mini) table.table-cards thead{display:none}
  html:not(.side-mini) table.table-cards,html:not(.side-mini) table.table-cards tbody,html:not(.side-mini) table.table-cards tr,html:not(.side-mini) table.table-cards td,html:not(.side-mini) table.table-cards tfoot{display:block;width:100%}
  html:not(.side-mini) table.table-cards tr{border-bottom:8px solid var(--bg);padding:8px 4px;position:relative}
  html:not(.side-mini) table.table-cards td{border:0;padding:3px 10px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 12px;text-align:right;white-space:normal!important;overflow-wrap:anywhere}
  html:not(.side-mini) table.table-cards td>*{max-width:100%}
  html:not(.side-mini) table.table-cards td[data-label]:before{content:attr(data-label);font-size:12px;color:var(--muted);font-weight:600;text-align:left;flex:none;max-width:45%}
  html:not(.side-mini) table.table-cards td:not([data-label]),html:not(.side-mini) table.table-cards td[data-label=""]{justify-content:flex-end}
  html:not(.side-mini) table.table-cards td[data-label=""]:before{display:none}
  html:not(.side-mini) table.table-cards td:first-child{font-size:15.5px}
  html:not(.side-mini) table.table-cards td .sub{text-align:right}
  html:not(.side-mini) table.table-cards td.num{text-align:right}
  html:not(.side-mini) table.table-cards tfoot tr{border-bottom:0}
  html:not(.side-mini) table.table-cards tfoot td:empty{display:none}
  html:not(.side-mini) table.table-cards .row-late,html:not(.side-mini) table.table-cards .row-today{border-left:0}
  html:not(.side-mini) table.table-cards tr.row-late{box-shadow:inset 4px 0 0 var(--c-blocked)}
  html:not(.side-mini) table.table-cards tr.row-today{box-shadow:inset 4px 0 0 var(--c-arrival)}
  html:not(.side-mini) table.table-cards tr td:first-child{box-shadow:none!important}
}
@media (max-width:380px){
  .room-grid{grid-template-columns:1fr}
}

/* ---------- Yazdırma ---------- */
@media print{
  .side,.topbar,.foot,.no-print,.btn,.filters,.tabs,.bottom-nav{display:none!important}
  body{padding:0!important}
  .main{margin:0!important}
  .content{padding:0}
  .panel{border:0}
  body{background:#fff}
}