/* ===== Хостел · бронирование коек ===== */
:root{
  --bg:#f6f4f0;
  --card:#ffffff;
  --ink:#2b2620;
  --muted:#8a8177;
  --line:#e7e1d8;
  --accent:#2f7d6d;        /* тёплый зелёный */
  --accent-ink:#ffffff;
  --free:#e8f4ef;  --free-ink:#2f7d6d;  --free-line:#bfe0d5;
  --busy:#fdeaea;  --busy-ink:#b9403f;  --busy-line:#f2c5c4;
  --resv:#fdf3dd;  --resv-ink:#a4741b;  --resv-line:#efd9a8;
  --wood-a:#faf6ee; --wood-b:#f1e9db; --wood-line:#dcd0bc; --wood-ink:#7a6a4f;
  --radius:14px;
  --shadow:0 1px 2px rgba(43,38,32,.05),0 8px 24px rgba(43,38,32,.06);
  --ease:cubic-bezier(.23,1,.32,1);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;overflow-x:clip;max-width:100%}
body{
  font-family:"Segoe UI",system-ui,-apple-system,sans-serif;
  background:var(--bg); color:var(--ink);
  font-size:15px; line-height:1.45;
  -webkit-text-size-adjust:100%;
}
[hidden]{display:none !important}

/* иконки */
[data-icon] svg{width:1.1em;height:1.1em;vertical-align:-.18em;stroke:currentColor}

/* ===== вход ===== */
.login-screen{
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:
    radial-gradient(900px 600px at 50% 50%, rgba(246,244,240,.9) 0%, rgba(246,244,240,.25) 55%, transparent 75%),
    url("assets/bg-login.svg?v=2"),
    radial-gradient(1000px 500px at 80% -10%, #ece5d8 0%, transparent 60%),
    radial-gradient(800px 400px at 0% 110%, #e3ede9 0%, transparent 55%),
    var(--bg);
  background-size:auto, 260px 260px, auto, auto, auto;
  padding:20px;
}
.login-card{
  background:var(--card); border:1px solid var(--line); border-radius:20px;
  box-shadow:var(--shadow); padding:36px 32px; width:100%; max-width:380px;
  display:flex; flex-direction:column; gap:14px; text-align:center;
}
.login-card h1{margin:0;font-size:26px;letter-spacing:-.02em}
.login-sub{margin:-8px 0 8px;color:var(--muted);font-size:14px}
.login-logo{
  width:58px;height:64px;margin:0 auto;
  border-radius:50% 50% 14px 14px / 62% 62% 14px 14px; /* восточная арка */
  background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:26px;padding-top:6px;
}
.login-card{position:relative}
.login-card::before{ /* тонкая арка-рамка над карточкой */
  content:"";position:absolute;inset:8px;pointer-events:none;
  border:1px solid var(--line);
  border-radius:36px 36px 14px 14px / 48px 48px 14px 14px;
}
.login-error{color:var(--busy-ink);font-size:13px;margin:0;text-align:start;
  background:var(--busy);border:1px solid var(--busy-line);border-radius:10px;padding:8px 11px}
.login-ok{color:var(--free-ink);font-size:13px;margin:0;text-align:start;
  background:var(--free);border:1px solid var(--free-line);border-radius:10px;padding:8px 11px}
.auth-links{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.link-btn{
  background:none;border:0;padding:2px;cursor:pointer;
  font:inherit;font-size:13px;color:var(--accent);font-weight:600;
}
.link-btn:hover{text-decoration:underline}
.link-btn#authForgot{color:var(--muted);font-weight:500}
.login-card .field{text-align:start}

/* ===== поля ===== */
.field{display:flex;flex-direction:column;gap:5px;font-size:13px;color:var(--muted);flex:1}
.field>span{font-weight:600}
.field input,.field select,.select,.search-box input{
  font:inherit;color:var(--ink);background:#fff;
  border:1px solid var(--line);border-radius:10px;padding:9px 12px;outline:none;
  transition:border-color .15s var(--ease), box-shadow .15s var(--ease);
}
.field input:focus,.field select:focus,.select:focus,.search-box input:focus{
  border-color:var(--accent); box-shadow:0 0 0 3px rgba(47,125,109,.15);
}
.field-row{display:flex;gap:12px}
.field-check .check{
  display:flex;align-items:center;gap:8px;color:var(--ink);
  border:1px solid var(--line);border-radius:10px;padding:9px 12px;cursor:pointer;
}
.field-check input{width:16px;height:16px;accent-color:var(--accent)}

/* ===== кнопки ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  font:inherit;font-weight:600;font-size:14px;
  border:1px solid transparent;border-radius:10px;padding:9px 14px;cursor:pointer;
  transition:transform .12s var(--ease), background .15s, border-color .15s;
}
.btn:active{transform:scale(.97)}
.btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.btn-primary{background:var(--accent);color:var(--accent-ink)}
.btn-primary:hover{background:#276a5c}
.btn-ghost{background:#fff;border-color:var(--line);color:var(--ink)}
.btn-ghost:hover{border-color:#cfc6b8}
.btn-danger{background:#fff;border-color:var(--busy-line);color:var(--busy-ink)}
.btn-danger:hover{background:var(--busy)}
.btn-wide{width:100%}
.btn-sm{padding:5px 10px;font-size:13px;border-radius:8px}
.btn-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:8px;border:1px solid var(--line);
  background:#fff;color:var(--muted);cursor:pointer;font-size:15px;
}
.btn-icon:hover{color:var(--ink);border-color:#cfc6b8}

/* ===== шапка ===== */
.topbar{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:rgba(255,255,255,.92);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);padding:10px 20px;
}
.brand{font-weight:700;font-size:16px;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.brand-icon{
  width:30px;height:30px;border-radius:9px;background:var(--accent);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:15px;
}
.brand-logo{width:30px;height:30px;border-radius:8px;object-fit:cover;flex:none}
.login-logo-img{
  width:72px;height:72px;margin:0 auto;display:block;border-radius:18px;
  box-shadow:0 4px 16px rgba(43,38,32,.12);
}
.tabs{
  display:flex;gap:4px;background:var(--bg);border:1px solid var(--line);
  border-radius:11px;padding:3px;min-width:0;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.tabs::-webkit-scrollbar{display:none}
.tab{
  flex:none;white-space:nowrap;
  font:inherit;font-weight:600;font-size:14px;color:var(--muted);
  background:transparent;border:0;border-radius:8px;padding:7px 14px;cursor:pointer;
  transition:background .15s,color .15s;
}
.tab:hover{color:var(--ink)}
.tab.active{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(43,38,32,.12)}
.topbar-actions{margin-inline-start:auto;display:flex;gap:8px}

/* ===== статистика ===== */
.stats{display:flex;gap:10px;flex-wrap:wrap;padding:16px 20px 0}
.stat{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:10px 16px;min-width:120px;
}
.stat b{display:block;font-size:22px;letter-spacing:-.02em}
.stat span{font-size:12.5px;color:var(--muted)}
.stat.s-busy b{color:var(--busy-ink)}
.stat.s-free b{color:var(--free-ink)}
.stat.s-resv b{color:var(--resv-ink)}

/* ===== карта мест ===== */
.view{padding:16px 20px 60px}
.apt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(430px,1fr));gap:16px}
.apt-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:16px 18px;
}
.apt-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.apt-head h3{margin:0;font-size:17px;letter-spacing:-.01em}
.apt-floor{font-size:12.5px;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:2px 10px}
.apt-occ{margin-inline-start:auto;font-size:12.5px;color:var(--muted)}
.amenities{display:flex;gap:6px;flex-wrap:wrap;margin:4px 0 12px}
.amenity{
  display:inline-flex;align-items:center;gap:5px;
  font-size:12px;color:var(--muted);
  background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:3px 10px;
}
.room-block{margin-bottom:12px}
.room-title{
  display:flex;align-items:center;gap:7px;
  font-size:13px;font-weight:700;color:var(--muted);margin-bottom:7px;
  text-transform:uppercase;letter-spacing:.04em;
}
.beds{display:flex;flex-wrap:wrap;gap:8px}
.bed{
  position:relative;
  min-width:66px;padding:8px 10px;border-radius:11px;cursor:pointer;
  border:1px solid var(--free-line);background:var(--free);color:var(--free-ink);
  font:inherit;font-weight:700;font-size:13.5px;text-align:center;
  transition:transform .12s var(--ease), box-shadow .15s var(--ease);
}
.bed small{display:block;font-weight:500;font-size:11px;opacity:.8;margin-top:2px;
  max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bed:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(43,38,32,.12)}
.bed:active{transform:scale(.97)}
.bed.busy{background:var(--busy);border-color:var(--busy-line);color:var(--busy-ink)}
.bed.resv{background:var(--resv);border-color:var(--resv-line);color:var(--resv-ink)}

/* капсульные боксы — белое дерево */
.room-block.capsule .beds{gap:10px}
.bed.capsule{
  background:
    repeating-linear-gradient(90deg,
      rgba(163,142,109,.06) 0 2px, transparent 2px 9px,
      rgba(163,142,109,.09) 9px 10px, transparent 10px 26px),
    linear-gradient(180deg,var(--wood-a),var(--wood-b));
  border:1px solid var(--wood-line);
  border-bottom-width:3px;
  border-radius:13px 13px 9px 9px;
  color:var(--wood-ink);
}
.bed.capsule.busy{color:var(--busy-ink);border-color:var(--busy-line);
  box-shadow:inset 0 0 0 2px rgba(185,64,63,.25)}
.bed.capsule.resv{color:var(--resv-ink);border-color:var(--resv-line);
  box-shadow:inset 0 0 0 2px rgba(164,116,27,.25)}

/* редактирование на карте */
.bed.add-bed{
  background:transparent;border:1.5px dashed #cfc6b8;color:var(--muted);font-weight:600;
}
.bed.add-bed:hover{border-color:var(--accent);color:var(--accent);box-shadow:none;transform:none}
.bed-x{
  position:absolute;top:-7px;inset-inline-end:-7px;width:19px;height:19px;border-radius:50%;
  background:var(--busy-ink);color:#fff;font-size:13px;font-weight:700;line-height:19px;text-align:center;
  box-shadow:0 1px 4px rgba(0,0,0,.3);
}
.bed-x:hover{background:#963332}
.btn-xs{width:26px;height:26px;font-size:13px}
.btn-icon.danger{color:var(--busy-ink);border-color:var(--busy-line)}
.btn-icon.danger:hover{background:var(--busy);color:var(--busy-ink)}
.room-title .btn-xs{margin-inline-start:2px}
.map-add-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px;padding-top:10px;border-top:1px dashed var(--line)}
.btn-dashed{background:transparent;border:1.5px dashed #cfc6b8;color:var(--muted)}
.btn-dashed:hover{border-color:var(--accent);color:var(--accent)}
.apt-add{
  min-height:180px;border:2px dashed #cfc6b8;border-radius:var(--radius);
  background:transparent;color:var(--muted);font:inherit;font-weight:600;font-size:15px;
  display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;
  transition:border-color .15s,color .15s;
}
.apt-add:hover{border-color:var(--accent);color:var(--accent)}

/* панель карты + легенда */
.map-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.map-toolbar .legend{margin:0;flex:1}
#btnMapEdit.edit-on{background:var(--accent);color:#fff;border-color:var(--accent)}
.legend{display:flex;gap:14px;flex-wrap:wrap;margin:0 0 14px;font-size:12.5px;color:var(--muted)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-inline-end:5px;vertical-align:-1px;border:1px solid}
.legend .l-free i{background:var(--free);border-color:var(--free-line)}
.legend .l-busy i{background:var(--busy);border-color:var(--busy-line)}
.legend .l-resv i{background:var(--resv);border-color:var(--resv-line)}
.legend .l-wood i{background:linear-gradient(180deg,var(--wood-a),var(--wood-b));border-color:var(--wood-line)}

/* ===== таблица броней ===== */
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.search-box{position:relative;flex:1;min-width:220px;display:flex}
.search-box [data-icon]{position:absolute;inset-inline-start:11px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:14px;pointer-events:none}
.search-box input{width:100%;padding-inline-start:34px}
.table-wrap{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);overflow-x:auto;
}
.bookings-table{width:100%;border-collapse:collapse;font-size:14px;min-width:900px}
.bookings-table th{
  text-align:start;font-size:11.5px;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap;
}
.bookings-table td{padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
.bookings-table tr:last-child td{border-bottom:0}
.bookings-table tr:hover td{background:#fbfaf7}
.place-chip{
  display:inline-block;font-size:12.5px;font-weight:600;
  background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:3px 9px;white-space:nowrap;
}
.pill{display:inline-block;font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;border:1px solid;white-space:nowrap}
.pill.active{background:var(--busy);border-color:var(--busy-line);color:var(--busy-ink)}
.pill.future{background:var(--resv);border-color:var(--resv-line);color:var(--resv-ink)}
.pill.past{background:var(--bg);border-color:var(--line);color:var(--muted)}
.pill.paid{background:var(--free);border-color:var(--free-line);color:var(--free-ink)}
.pill.unpaid{background:var(--busy);border-color:var(--busy-line);color:var(--busy-ink)}
.row-actions{display:flex;gap:6px;justify-content:flex-end}
.empty-note{text-align:center;color:var(--muted);padding:28px 10px;margin:0}
.note-cell{color:var(--muted);font-size:12.5px}

/* ===== структура ===== */
.structure-intro{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}
.structure-intro p{margin:0;color:var(--muted);max-width:640px}
.struct-apt{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:16px 18px;margin-bottom:14px;
}
.struct-apt-head{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:12px}
.struct-apt-head .field{flex:0 1 160px}
.struct-apt-head .btn-danger{margin-inline-start:auto}
.struct-rooms{display:flex;flex-direction:column;gap:8px}
.struct-room{
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;
  background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 12px;
}
.struct-room.capsule{
  background:linear-gradient(180deg,var(--wood-a),var(--wood-b));
  border-color:var(--wood-line);
}
.struct-room input[type=text]{width:90px}
.struct-room input[type=number]{width:72px}
.struct-room .room-kind{font-size:12.5px;color:var(--muted);min-width:118px}
.struct-room input{
  font:inherit;border:1px solid var(--line);border-radius:8px;padding:6px 9px;background:#fff;
}
.struct-room .grow{flex:1}
.struct-add-row{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}

/* ===== аналитика ===== */
.an-month-nav{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.an-month-nav h2{margin:0;font-size:19px;min-width:168px;text-align:center;letter-spacing:-.01em}
.an-month-nav .btn-icon{font-size:19px;font-weight:700}
.an-note{color:var(--muted);font-size:12.5px;margin-inline-start:6px}
.an-kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:10px;margin-bottom:16px}
.an-kpis .stat{min-width:0}
.an-kpis .stat b{font-size:19px;white-space:nowrap}
.an-grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}
.an-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding:14px 16px;margin-bottom:16px;
}
.an-grid2 .an-card{margin-bottom:0}
.an-card h4{margin:0 0 12px;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
/* загрузка по дням */
.an-chart{display:flex;align-items:flex-end;gap:2px;height:120px}
.an-bar{flex:1;background:var(--free-line);border-radius:3px 3px 0 0;min-height:2px}
.an-bar:hover{background:var(--accent)}
.an-bar.full{background:var(--busy-ink)}
.an-bar.today{background:var(--accent);box-shadow:0 0 0 1.5px var(--accent)}
.an-chart-x{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:5px}
/* выручка по месяцам */
.an-rev{height:auto;gap:8px}
.an-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0}
.an-colbar{height:104px;width:100%;display:flex;align-items:flex-end;justify-content:center}
.an-colbar i{display:block;width:68%;max-width:46px;background:var(--free-line);border-radius:6px 6px 3px 3px;min-height:3px}
.an-col.cur .an-colbar i{background:var(--accent)}
.an-col b{font-size:11px;white-space:nowrap}
.an-col span{font-size:11px;color:var(--muted)}
/* топ квартир */
.an-top-row{display:flex;align-items:center;gap:10px;padding:5px 0}
.an-top-name{min-width:64px;font-weight:600;font-size:13.5px;white-space:nowrap}
.an-top-bar{flex:1;height:12px;background:var(--bg);border-radius:999px;overflow:hidden}
.an-top-bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.an-top-row b{min-width:88px;text-align:end;font-size:13px;white-space:nowrap}
/* должники */
.an-debt-table{min-width:680px}
.an-debt-wrap{box-shadow:none;border:0;border-radius:0}

@media (max-width:640px){
  .an-grid2{grid-template-columns:1fr}
  .an-kpis{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
  .an-note{display:none}
}

/* ===== глазок в поле пароля ===== */
.pass-wrap{position:relative;display:block}
.pass-wrap input{width:100%;padding-inline-end:42px}
.pass-eye{
  position:absolute;inset-inline-end:6px;top:50%;transform:translateY(-50%);
  width:30px;height:30px;border:0;border-radius:8px;background:transparent;cursor:pointer;
  color:var(--muted);display:inline-flex;align-items:center;justify-content:center;padding:0;
}
.pass-eye:hover{color:var(--ink);background:var(--bg)}
.pass-eye.on{color:var(--accent)}
.pass-eye svg{width:17px;height:17px}

/* ===== календарь (шахматка) ===== */
.cal-legend{margin-bottom:12px}
.cal-legend i{display:inline-block;width:12px;height:12px;border-radius:4px;margin-inline-end:5px;vertical-align:-1px;border:1px solid}
.cal-legend .l-live i{background:var(--busy);border-color:var(--busy-line)}
.cal-legend .l-fut i{background:var(--resv);border-color:var(--resv-line)}
.cal-legend .l-pastb i{background:#eceae6;border-color:#dcd8d1}
.cal-legend .l-free i{background:#fff;border-color:var(--line)}
/* Календарь = своё окно прокрутки на весь экран: страница при этом НЕ скроллится,
   поэтому строка дат и заголовок квартиры всегда видны (высоту ставит JS: fitCalendar) */
body.cal-mode{overflow:hidden}
.cal-wrap{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow);padding-bottom:4px;
  overflow:auto;max-height:calc(100vh - 232px);min-height:220px;
  overscroll-behavior:contain;
}
.cal-row{display:flex;align-items:stretch;min-width:max-content}
.cal-row:not(.cal-head):hover .cal-bed{background:var(--bg)}
.cal-head{
  position:sticky;top:0;z-index:6;background:var(--card);
  border-bottom:1px solid var(--line);
}
.cal-head .cal-bed{z-index:7}
.cal-bed{
  flex:none;width:132px;padding:5px 10px;
  font-size:12.5px;font-weight:600;white-space:nowrap;
  display:flex;align-items:center;gap:6px;
  position:sticky;inset-inline-start:0;z-index:2;background:var(--card);
  border-inline-end:1px solid var(--line);
}
.cal-bed i{
  font-style:normal;font-size:10.5px;font-weight:700;color:var(--muted);
  background:var(--bg);border:1px solid var(--line);border-radius:5px;padding:0 5px;
}
.cal-bed.capsule{background:linear-gradient(90deg,var(--wood-a),#fff)}
.cal-head .cal-bed{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.cal-days{
  display:grid;grid-template-columns:repeat(var(--days),28px);
  flex:none;position:relative;
}
.cal-cell{
  grid-row:1;height:30px;border-inline-end:1px solid #e6e1d8;border-bottom:1px solid #ece7de;
  font-size:10.5px;color:var(--muted);display:flex;align-items:center;justify-content:center;
}
.cal-cell.weekend{background:#faf8f5}
.cal-cell.today{background:rgba(47,125,109,.09);box-shadow:inset 1px 0 0 var(--accent),inset -1px 0 0 var(--accent)}
.cal-head .cal-cell{height:26px;font-weight:600;border-bottom:0}
.cal-row:not(.cal-head) .cal-cell{cursor:pointer}
.cal-row:not(.cal-head) .cal-cell:hover{background:var(--free)}
.cal-bar{
  grid-row:1;margin:3px 1px;border-radius:6px;cursor:pointer;
  display:flex;align-items:center;padding:0 6px;overflow:hidden;
  font-size:11.5px;font-weight:600;line-height:1;z-index:1;
  border:1px solid;
}
.cal-bar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cal-bar:hover{filter:brightness(.96);box-shadow:0 2px 8px rgba(43,38,32,.18)}
.cal-bar.live{background:var(--busy);border-color:var(--busy-line);color:var(--busy-ink)}
.cal-bar.future{background:var(--resv);border-color:var(--resv-line);color:var(--resv-ink)}
.cal-bar.past{background:#eceae6;border-color:#dcd8d1;color:#8a8177}
.cal-apt-group{display:block;min-width:max-content}
.cal-apt{
  position:sticky;top:27px;z-index:5;
  min-width:max-content;                 /* полоса тянется на всю ширину сетки */
  background:var(--bg);border-block:1px solid var(--line);
}
.cal-apt span{
  position:sticky;inset-inline-start:0;  /* текст держится у левого края при прокрутке вбок */
  display:block;width:max-content;padding:7px 10px;
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);
}

/* ===== бухгалтерия ===== */
.stat.profit-pos b{color:var(--free-ink)}
.stat.profit-neg b{color:var(--busy-ink)}
.fin-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.fin-head h4{margin:0}
.fin-actions{margin-inline-start:auto;display:flex;gap:8px;flex-wrap:wrap}
.fin-cat-name{min-width:190px;font-size:13px;font-weight:600}
.an-top-bar i.bar-exp{background:var(--busy-ink)}
.sum-in{color:var(--free-ink)}
.sum-out{color:var(--busy-ink)}

@media (max-width:640px){
  .fin-cat-name{min-width:120px;font-size:12px}
  .cal-bed{width:104px}
}

/* ===== команда / приватность телефона ===== */
.role-badge{
  display:inline-block;margin-inline-start:8px;vertical-align:1px;
  font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;
  background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:2px 9px;color:var(--muted);
}
.hostel-switch{max-width:210px;font-size:13px;padding:8px 10px}
.phone-hidden{display:inline-flex;align-items:center;gap:5px;color:var(--muted);font-size:12.5px}
.phone-hidden [data-icon] svg{width:.95em;height:.95em}
.team-row{
  display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--line);
}
.team-row:last-of-type{border-bottom:0}
.team-row.pending{opacity:.75}
.team-ava{
  width:34px;height:34px;border-radius:10px;flex:none;
  background:var(--bg);border:1px solid var(--line);color:var(--muted);
  display:inline-flex;align-items:center;justify-content:center;
}
.team-main{flex:1;min-width:0}
.team-main b{font-size:14px;word-break:break-all}
.team-sub{font-size:12.5px;color:var(--muted)}
.team-add{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.team-add input{
  flex:1;min-width:200px;font:inherit;background:#fff;
  border:1px solid var(--line);border-radius:10px;padding:9px 12px;outline:none;
}
.team-add input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(47,125,109,.15)}
.team-msg{margin:10px 0 0;font-size:13px;border-radius:10px;padding:9px 12px}
.team-msg.ok{color:var(--free-ink);background:var(--free);border:1px solid var(--free-line)}
.team-msg.err{color:var(--busy-ink);background:var(--busy);border:1px solid var(--busy-line)}
.team-note p{margin:0 0 8px;color:var(--muted);font-size:13.5px;line-height:1.5}
.team-note p:last-child{margin-bottom:0}
.team-note b{color:var(--ink)}

/* ===== тумблер настроек ===== */
.switch-row{display:flex;align-items:flex-start;gap:12px;cursor:pointer;padding:4px 0}
.switch{position:relative;flex:none;width:44px;height:25px;margin-top:2px}
.switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer;z-index:2}
.switch i{
  position:absolute;inset:0;border-radius:999px;background:#d9d3c8;
  transition:background .18s var(--ease);pointer-events:none;
}
.switch i::after{
  content:"";position:absolute;top:3px;inset-inline-start:3px;width:19px;height:19px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(43,38,32,.28);
  transition:transform .18s var(--ease);
}
.switch input:checked + i{background:var(--accent)}
.switch input:checked + i::after{transform:translateX(19px)}
html[dir="rtl"] .switch input:checked + i::after{transform:translateX(-19px)}
.switch input:focus-visible + i{box-shadow:0 0 0 3px rgba(47,125,109,.25)}
.switch-text{display:flex;flex-direction:column;gap:3px}
.switch-text b{font-size:14px}
.switch-text span{font-size:12.5px;color:var(--muted);line-height:1.45}
.team-note-small{margin:10px 0 0;font-size:12px;color:var(--muted);line-height:1.5}

/* ===== здания ===== */
.bld-bar{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0 0 14px;
  padding-bottom:12px;border-bottom:1px dashed var(--line);
}
.bld-label{color:var(--muted);display:inline-flex;margin-inline-end:2px}
.bld-chip{
  font:inherit;font-weight:600;font-size:13px;color:var(--muted);
  background:var(--card);border:1px solid var(--line);border-radius:999px;
  padding:6px 14px;cursor:pointer;white-space:nowrap;
  transition:border-color .15s,color .15s,background .15s;
}
.bld-chip:hover{border-color:#cfc6b8;color:var(--ink)}
.bld-chip.on{background:var(--accent);border-color:var(--accent);color:#fff}
.bld-chip.add{border-style:dashed;color:var(--accent)}

/* ===== модалки ===== */
.modal-backdrop{
  position:fixed;inset:0;z-index:100;
  background:rgba(43,38,32,.45);
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.modal{
  background:var(--card);border-radius:18px;box-shadow:0 24px 64px rgba(43,38,32,.3);
  width:100%;max-width:560px;max-height:88vh;display:flex;flex-direction:column;
  animation:modalIn .22s var(--ease);
}
@keyframes modalIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.modal-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;border-bottom:1px solid var(--line);
}
.modal-head h2{margin:0;font-size:17px;letter-spacing:-.01em}
.modal-body{padding:18px 20px;overflow-y:auto}
.booking-form{display:flex;flex-direction:column;gap:13px}
.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}
.conflict-error{color:var(--busy-ink);font-size:13px;margin:0;background:var(--busy);
  border:1px solid var(--busy-line);border-radius:10px;padding:9px 12px}

/* карточка койки в модалке */
.bed-status-line{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.bk-item{
  border:1px solid var(--line);border-radius:12px;padding:11px 14px;margin-bottom:9px;
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;
}
.bk-item.active{border-color:var(--busy-line);background:#fffafa}
.bk-item.future{border-color:var(--resv-line);background:#fffdf6}
.bk-item .bk-main{flex:1;min-width:180px}
.bk-item .bk-main b{font-size:14.5px}
.bk-item .bk-dates{font-size:12.5px;color:var(--muted);margin-top:2px}
.bk-past-head{font-size:12.5px;color:var(--muted);margin:14px 0 8px;text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.bk-item.past{opacity:.65}

/* ===== планшет: вкладки уезжают на свою строку и прокручиваются ===== */
@media (max-width:1000px){
  .topbar{gap:8px 12px;padding:10px 14px}
  .tabs{order:3;flex:1 0 100%;margin:0}
  .topbar-actions{margin-inline-start:auto}
}

/* ===== телефон ===== */
@media (max-width:640px){
  .topbar{gap:8px 10px;padding:9px 12px}
  .brand{font-size:15px;gap:7px}
  .brand-icon{width:27px;height:27px;font-size:14px}
  .role-badge{font-size:10px;padding:2px 7px}
  .btn-label{display:none}
  .btn{padding:8px 11px}
  .tab{padding:7px 12px;font-size:13.5px}
  .hostel-switch{max-width:150px;font-size:12.5px;padding:7px 8px}

  .view,.stats{padding-left:12px;padding-right:12px}
  .apt-grid{grid-template-columns:1fr}
  .field-row{flex-direction:column}
  .struct-apt-head .btn-danger{margin-inline-start:0}

  /* карточки-цифры: две в ряд, без разъезда */
  .stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .stats .stat{min-width:0;padding:9px 12px}
  .stats .stat b{font-size:19px}
  .an-kpis{grid-template-columns:1fr 1fr;gap:8px}
  .an-kpis .stat{padding:9px 11px}
  .an-kpis .stat b{font-size:17px}
  .an-kpis .stat span{font-size:11.5px}

  /* заголовок месяца и кнопки-стрелки */
  .an-month-nav{gap:8px}
  .an-month-nav h2{font-size:17px;min-width:0;flex:1}

  /* карта мест */
  .map-toolbar{gap:8px}
  .legend{font-size:11.5px;gap:8px 10px}
  .bed{min-width:60px;padding:7px 8px;font-size:13px}
  .bed small{max-width:76px}

  /* календарь: колонка коек уже, дни чуть уже — скролл внутри карточки */
  .cal-bed{width:92px;font-size:11.5px;padding:5px 7px}
  .cal-days{grid-template-columns:repeat(var(--days),26px)}
  .cal-bar{font-size:11px;padding:0 4px}
  .cal-legend{font-size:11.5px}
  /* на телефоне карточки-цифры прячем — экран отдаём календарю целиком */
  body.cal-mode .stats{display:none}
  body.cal-mode .an-note{display:none}

  /* бухгалтерия */
  .fin-actions{margin-inline-start:0;width:100%}
  .fin-actions .btn{flex:1;justify-content:center}
  .fin-cat-name{min-width:96px;font-size:11.5px}
  .an-top-row b{min-width:70px;font-size:12px}

  /* команда */
  .team-add{flex-direction:column}
  .team-add input,.team-add .btn{width:100%}

  /* модалки — почти на весь экран, поля не мельчат iOS */
  .modal-backdrop{padding:10px;align-items:flex-end}
  .modal{max-height:92vh;border-radius:18px}
  .modal-body{padding:14px}
  .field input,.field select,.select,.search-box input,.team-add input,.struct-room input{font-size:16px}
}


/* ===== переключатель языков ===== */
.lang-switch{display:inline-flex;gap:2px;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:2px}
.lang-btn{
  font:inherit;font-weight:600;font-size:12px;color:var(--muted);
  background:transparent;border:0;border-radius:7px;padding:5px 9px;cursor:pointer;white-space:nowrap;
}
.lang-btn:hover{color:var(--ink)}
.lang-btn.on{background:#fff;color:var(--ink);box-shadow:0 1px 3px rgba(43,38,32,.12)}
.login-langs{position:absolute;top:14px;inset-inline-end:14px}
.login-card{position:relative}
/* арабской вязи нужен чуть больший межстрочный интервал */
html[lang="ar"] body{line-height:1.6}
html[lang="ar"] .stat b,html[lang="ar"] .an-kpis .stat b{letter-spacing:0}
@media (max-width:640px){
  .lang-btn{padding:5px 7px;font-size:11.5px}
}