/* SIGETH admin — deliberately plain. It is a tool, not a shop window. */
*,*::before,*::after{box-sizing:border-box}*{margin:0;padding:0}
:root{
  --ink:#0a1c2e; --dim:#6d8497; --line:#e2ecf4; --paper:#f4f8fb;
  --aqua:#0ea5c4; --amber:#ff8a1f; --ok:#059669; --err:#dc2626;
}
body{font:15px/1.55 Inter,system-ui,sans-serif;color:var(--ink);background:var(--paper)}
a{color:inherit;text-decoration:none}
code{font:12px/1 ui-monospace,Menlo,Consolas,monospace;background:var(--paper);
     border:1px solid var(--line);border-radius:5px;padding:3px 6px}

/* ---- login ---- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.login-card{width:100%;max-width:360px;background:#fff;border:1px solid var(--line);
  border-radius:16px;padding:32px;box-shadow:0 24px 48px -24px rgba(6,24,42,.24);text-align:left}
.login-card img{margin:0 auto 14px;display:block;border-radius:10px}
.login-card h1{font-size:1.2rem;text-align:center;margin-bottom:22px}
.login-card label{display:block;font-size:.78rem;font-weight:700;margin:14px 0 6px}
.login-card input{width:100%;padding:11px 13px;border:1.5px solid var(--line);
  border-radius:9px;background:var(--paper);font:inherit}
.login-card input:focus{outline:none;border-color:var(--aqua);background:#fff}
.login-card button{width:100%;margin-top:20px;padding:12px;border:0;border-radius:999px;
  background:var(--amber);color:#24160a;font:inherit;font-weight:700;cursor:pointer}
.login-card .back{display:block;text-align:center;margin-top:16px;font-size:.85rem;color:var(--dim)}

/* ---- chrome ---- */
.topbar{background:#fff;border-bottom:1px solid var(--line)}
/* Full width, deliberately: the bar and the sidebar below it are chrome, and
   chrome is anchored to the window. Capping and centring this made it drift
   away from the sidebar on anything wider than 1500px. Padding matches the
   sidebar's so the logo sits directly above the section icons. */
.topbar-in{width:100%;padding:12px 24px;display:flex;
  align-items:center;justify-content:space-between;gap:16px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800}
.logo img{border-radius:7px}
.topbar-right{display:flex;align-items:center;gap:12px}
.who{font-size:.85rem;color:var(--dim)}
.btn-ghost{font-size:.85rem;font-weight:600;border:1px solid var(--line);
  border-radius:999px;padding:7px 14px}
.btn-ghost:hover{border-color:var(--aqua);color:var(--aqua)}

.wrap{max-width:1500px;margin:0 auto;padding:22px 24px 60px}

.alert{padding:11px 15px;border-radius:10px;margin-bottom:18px;font-size:.9rem;font-weight:600}
.alert.ok{background:#e7f8f1;color:var(--ok)}
.alert.error{background:#fdeaea;color:var(--err)}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:20px}
.stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.stat.on{border-color:var(--aqua);box-shadow:0 0 0 3px rgba(14,165,196,.1)}
.stat strong{display:block;font-size:1.5rem;line-height:1.1}
.stat span{font-size:.8rem;color:var(--dim)}

.tabs{display:flex;gap:8px;margin-bottom:14px}
.tabs a{padding:8px 16px;border-radius:999px;font-size:.87rem;font-weight:600;
  border:1px solid var(--line);background:#fff}
.tabs a.on{background:var(--ink);color:#fff;border-color:var(--ink)}

.tablewrap{background:#fff;border:1px solid var(--line);border-radius:14px;overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:.87rem;min-width:900px}
th{text-align:left;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;
   color:var(--dim);padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
tbody tr:last-child td{border-bottom:0}
.dim{color:var(--dim);font-size:.82rem}
.empty{text-align:center;color:var(--dim);padding:40px}
.msg{max-width:420px}
.noterow td{border-top:0;padding-top:0;font-size:.83rem}
.warn{display:inline-block;margin-left:6px;font-size:.65rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.08em;color:var(--err);
  background:#fdeaea;border-radius:999px;padding:3px 7px}
.statusform select{padding:6px 9px;border:1px solid var(--line);border-radius:8px;
  background:var(--paper);font:inherit;font-size:.83rem}

/* ---- flash ---- */
.flashwrap{padding-top:18px;padding-bottom:0}

/* ---- page headers ---- */
.pagehead{display:flex;align-items:flex-start;justify-content:space-between;
  gap:16px;flex-wrap:wrap;margin:4px 0 18px}
.pagehead h1{font-size:1.35rem;display:flex;align-items:center;gap:10px}
.pagehead p{margin-top:4px;max-width:70ch}
.crumb{font-size:.82rem;color:var(--dim);font-weight:600}
.crumb:hover{color:var(--aqua)}

/* ---- status pills ---- */
.pill{display:inline-block;font-size:.68rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.07em;border-radius:999px;padding:3px 9px;background:var(--paper);
  color:var(--dim);border:1px solid var(--line);vertical-align:middle}
.pill--live,.pill--confirmed{background:#e7f8f1;color:var(--ok);border-color:#bfe9d8}
.pill--draft,.pill--cancelled{background:var(--paper);color:var(--dim)}
.pill--soon,.pill--new{background:#fff3e3;color:#b45f0c;border-color:#ffdcb4}
.pill--declined,.pill--error,.pill--critical{background:#fdeaea;color:var(--err);border-color:#f6cccc}
.pill--warning{background:#fff8e6;color:#a16207;border-color:#f5e2ae}
.pill--info{background:#eaf6fb;color:#0b7c95;border-color:#c6e8f2}
.pill--debug{background:var(--paper);color:var(--dim)}

/* ---- cards and forms ---- */
.card{background:#fff;border:1px solid var(--line);border-radius:14px;
  padding:22px 24px;margin-bottom:18px}
.card h2{font-size:1.02rem;margin-bottom:6px;display:flex;align-items:center;gap:8px}
.card > .hint{margin-bottom:14px}
.hint{display:block;font-size:.78rem;font-weight:400;color:var(--dim);line-height:1.5}
label{display:flex;flex-direction:column;font-size:.78rem;font-weight:700;margin-bottom:14px}
.grid2 > label input,.grid2 > label select,.grid2 > label textarea,
.grid3 > label input,.grid3 > label select,.grid3 > label textarea,
.grid4 > label input,.grid4 > label select,.grid4 > label textarea{margin-top:auto}
label input,label select,label textarea{display:block;width:100%;margin-top:5px;
  padding:9px 11px;border:1.5px solid var(--line);border-radius:9px;
  background:var(--paper);font:inherit;font-size:.9rem;font-weight:400;color:var(--ink)}
label textarea{resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--aqua);background:#fff}
input[type=file]{padding:8px;font-size:.82rem}
.inline-check{display:flex;flex-direction:row;align-items:center;gap:8px;
  font-size:.85rem;font-weight:600;margin:2px 0 12px}
.inline-check input{width:auto;margin:0;padding:0}
fieldset.sub{border:1px solid var(--line);border-radius:12px;padding:16px 18px 4px;margin:0 0 16px}
fieldset.sub legend{font-size:.72rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.1em;color:var(--dim);padding:0 8px}
.grid2,.grid3,.grid4{display:grid;gap:0 14px}
.grid2{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.grid3{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.grid4{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.formactions{display:flex;align-items:center;gap:14px;margin-top:6px}

.btn-primary{border:0;border-radius:999px;background:var(--amber);color:#24160a;
  font:inherit;font-weight:700;font-size:.87rem;padding:10px 20px;cursor:pointer}
.btn-primary:hover{filter:brightness(1.05)}
.btn-danger{border:1px solid #f6cccc;border-radius:999px;background:#fdeaea;color:var(--err);
  font:inherit;font-weight:700;font-size:.8rem;padding:7px 14px;cursor:pointer}
.btn-danger:hover{background:#fbdcdc}
.btn-danger.tiny{display:grid;place-items:center;width:38px;height:38px;
  padding:0;font-size:1rem;line-height:1}
button:disabled{opacity:.5;cursor:default}

.newprop{border-style:dashed}
.rowactions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rowactions form{margin:0}
.strong{font-weight:700}
.strong:hover{color:var(--aqua)}
.thumbcell{width:74px}
.thumb{display:block;width:58px;height:44px;object-fit:cover;border-radius:8px;border:1px solid var(--line)}
.thumb--none{display:grid;place-items:center;background:var(--paper);color:var(--dim);
  font-size:.6rem;text-align:center;line-height:1.2}
.imgpair{display:flex;gap:14px;flex-wrap:wrap;margin:4px 0 18px}
.imgpair figure{width:200px}
.imgpair img{width:100%;height:120px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}
.imgpair figcaption{font-size:.75rem;color:var(--dim);margin-top:5px}

/* ---- rooms ---- */
.room--new{border-style:dashed;background:#fcfeff}
.inlinedelete{margin:-8px 0 22px;text-align:right}

/* ---- repeatable rows ---- */
.repeat{display:grid;gap:8px;margin-bottom:12px}
/* Column counts follow the block: amenities and tags are label+icon, the facts
   strip is title+subtitle+icon. The icon picker is narrow on purpose — it is a
   short list of names, not free text. */
.repeat-row{display:grid;gap:8px;align-items:center}
.repeat-row--2{grid-template-columns:minmax(0,1fr) 190px 38px}
.repeat-row--3{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 190px 38px}
.repeat-row input,.repeat-row select{margin:0;padding:8px 10px;border:1.5px solid var(--line);
  border-radius:8px;background:var(--paper);font:inherit;font-size:.85rem}
@media (max-width:760px){
  .repeat-row--2,.repeat-row--3{grid-template-columns:minmax(0,1fr) 38px}
  .repeat-row--3 input:first-child{grid-column:1 / -1}
}

/* ---- gallery ---- */
.cats{display:grid;gap:8px}
.catrow{display:grid;grid-template-columns:1fr 1fr 90px 90px 90px;gap:8px;align-items:center}
.catrow input{margin:0;padding:8px 10px;border:1.5px solid var(--line);border-radius:8px;
  background:var(--paper);font:inherit;font-size:.85rem}
.catrow button{padding:8px 14px;font-size:.8rem}
@media (max-width:760px){.catrow{grid-template-columns:1fr 1fr}}

.photogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:14px;margin-bottom:18px}
.photocard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px}
.photocard.is-feature{border-color:var(--amber);box-shadow:0 0 0 3px rgba(255,138,31,.14)}
.photocard img{width:100%;height:130px;object-fit:cover;border-radius:8px;margin-bottom:8px}
.photocard input,.photocard select{width:100%;margin-bottom:6px;padding:7px 9px;
  border:1.5px solid var(--line);border-radius:8px;background:var(--paper);
  font:inherit;font-size:.8rem}
.photorow{display:grid;grid-template-columns:1fr 72px;gap:6px}
.photorow select,.photorow input{margin-bottom:0}
.filepath{font-size:.68rem;word-break:break-all;margin-top:6px}

.photoactions{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.pa{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;
  display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pa img{width:48px;height:38px;object-fit:cover;border-radius:6px}
.pa form{margin:0}
.pa button{font-size:.75rem;padding:6px 11px}

.stickysave{position:sticky;bottom:0;background:linear-gradient(transparent,var(--paper) 40%);
  padding:16px 0 8px;margin-top:4px}

/* ---- status editor in the bookings table ---- */
.statuscell{min-width:170px}
.statuscell .tiny{display:block;font-size:.7rem;margin-top:4px}
.statusedit summary{cursor:pointer;font-size:.78rem;font-weight:700;color:var(--aqua);
  margin-top:6px;list-style:none}
.statusedit summary::-webkit-details-marker{display:none}
.statusedit summary::before{content:"\25B8  "}
.statusedit[open] summary::before{content:"\25BE  "}
.statusedit form{margin-top:8px;display:grid;gap:6px;min-width:200px}
.statusedit select,.statusedit textarea{width:100%;padding:7px 9px;border:1.5px solid var(--line);
  border-radius:8px;background:var(--paper);font:inherit;font-size:.82rem}
.statusedit .inline-check{margin:0;font-size:.78rem}
.statusedit button{padding:8px 14px;font-size:.8rem}

/* ---- logs ---- */
.stat--error strong,.stat--critical strong{color:var(--err)}
.stat--warning strong{color:#a16207}
.logtable{min-width:1000px}
.logtable tr.lv-error td,.logtable tr.lv-critical td{background:#fffafa}
.logtable tr.lv-warning td{background:#fffdf6}
.nowrap{white-space:nowrap}
.small{font-size:.74rem;word-break:break-all}
.ctx summary{cursor:pointer;font-size:.74rem;color:var(--aqua);font-weight:700;margin-top:4px}
.ctx pre{margin-top:6px;padding:10px 12px;background:var(--paper);border:1px solid var(--line);
  border-radius:8px;font:11px/1.5 ui-monospace,Menlo,Consolas,monospace;
  white-space:pre-wrap;word-break:break-word;max-height:260px;overflow:auto}
.filelist{list-style:none;display:grid;gap:6px;font-size:.85rem}
.filelist span{margin-left:8px}

/* ===========================================================================
   Shell — sidebar on desktop, scrolling strip on a phone
   =========================================================================== */
/* No max-width here either — the sidebar is pinned to the window edge, and the
   reading width is applied to .wrap inside the content column instead. */
.shell{display:grid;grid-template-columns:216px minmax(0,1fr);align-items:start}
.shell-main{min-width:0}                    /* lets wide tables scroll instead of stretching the grid */

.side{position:sticky;top:0;display:flex;flex-direction:column;gap:2px;
  padding:20px 10px;border-right:1px solid var(--line);background:#fff;
  min-height:calc(100vh - 57px)}
.side a{display:flex;align-items:center;gap:11px;padding:10px 14px;border-radius:10px;
  font-size:.9rem;font-weight:600;color:var(--dim)}
.side a svg{flex:none}
.side a:hover{background:var(--paper);color:var(--ink)}
.side a.on{background:var(--ink);color:#fff}

@media (max-width:900px){
  .shell{display:block}
  .side{position:static;flex-direction:row;min-height:0;padding:10px 12px;
    border-right:0;border-bottom:1px solid var(--line);
    overflow-x:auto;-webkit-overflow-scrolling:touch}
  .side a{white-space:nowrap;padding:8px 13px}
}

/* the top bar loses its own nav now, so let the right side breathe */
.topbar-right{flex-wrap:wrap;justify-content:flex-end}
.who strong{color:var(--ink)}
.btn-ghost.on{border-color:var(--aqua);color:var(--aqua)}
@media (max-width:560px){
  .who{display:none}
  .topbar-in{gap:10px}
}

.wrap--narrow{max-width:640px;margin-left:0}

/* ===========================================================================
   Photo picker — choose by looking, not by typing a path
   =========================================================================== */
.picker{margin:0 0 22px}
.picker + .picker{padding-top:18px;border-top:1px dashed var(--line)}
.picker-head{margin-bottom:10px}
.picker-head strong{display:block;font-size:.85rem}
.picker-head .hint{margin-top:2px}

.picker-empty{padding:18px;border:1.5px dashed var(--line);border-radius:12px;
  background:var(--paper);color:var(--dim);font-size:.85rem;text-align:center}

.picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(116px,1fr));
  gap:10px;max-height:340px;overflow-y:auto;padding:4px;
  border:1px solid var(--line);border-radius:12px;background:var(--paper)}

.pick{position:relative;display:block;margin:0;cursor:pointer;border-radius:10px;
  overflow:hidden;border:2px solid transparent;background:#fff}
.pick input{position:absolute;opacity:0;width:1px;height:1px}
.pick img{display:block;width:100%;height:80px;object-fit:cover}
.pick:hover{border-color:#bfe0ec}
.pick:has(input:checked){border-color:var(--amber);box-shadow:0 0 0 3px rgba(255,138,31,.2)}
.pick:has(input:focus-visible){border-color:var(--aqua);box-shadow:0 0 0 3px rgba(14,165,196,.25)}

.pick-tick{position:absolute;top:5px;right:5px;width:21px;height:21px;border-radius:50%;
  background:var(--amber);color:#24160a;font-size:12px;font-weight:800;
  display:none;align-items:center;justify-content:center;line-height:1}
.pick:has(input:checked) .pick-tick{display:flex}

.pick-cap{display:block;padding:5px 7px;font-size:.68rem;font-weight:600;color:var(--dim);
  line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.pick--none .pick-box{display:grid;place-items:center;height:80px;font-size:.72rem;
  font-weight:700;color:var(--dim);background:repeating-linear-gradient(45deg,
    #fff,#fff 6px,var(--paper) 6px,var(--paper) 12px)}

.picker-orphan{margin-top:10px;font-size:.8rem;color:var(--dim)}
.picker-orphan label{display:flex;flex-direction:row;align-items:center;gap:8px;
  font-size:.8rem;font-weight:600;margin-bottom:2px}
.picker-orphan input{width:auto;margin:0}

/* Fallback for browsers without :has() — the tick still shows via the caption
   border, and the radio itself becomes visible so nothing is unusable. */
@supports not selector(:has(*)){
  .pick input{position:static;opacity:1;width:auto;height:auto;margin:6px}
  .pick-tick{display:none}
}

/* ---- pending-migration banner ---- */
.migrate{background:#fff8e6;border-bottom:2px solid var(--amber);color:#7a4a08;
  padding:14px 24px;font-size:.87rem;line-height:1.6}
.migrate strong{display:inline-block;color:#8a3d00}
.migrate ul{margin:8px 0 8px 20px}
.migrate li{margin:2px 0}
.migrate code{background:#fff;border-color:#f0dcb4}

/* ---- diagnostic checklists ---- */
.checks{list-style:none;display:grid;gap:12px;margin-bottom:14px}
.checks li{display:flex;gap:11px;align-items:flex-start;font-size:.87rem;line-height:1.5}
.checks .mark{flex:none;display:grid;place-items:center;width:22px;height:22px;
  border-radius:50%;font-size:.72rem;font-weight:800;margin-top:1px}
.checks .pass .mark{background:#e7f8f1;color:var(--ok)}
.checks .fail .mark{background:#fdeaea;color:var(--err)}
.checks .dim{font-weight:400}
.steps{margin:6px 0 0 20px;display:grid;gap:8px;font-size:.87rem;line-height:1.6;color:var(--dim)}
.steps strong{color:var(--ink)}

/* ---- menu QR ---- */
.qr-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:24px;align-items:start}
.qr-box{padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff}
.qr-box img{display:block;width:296px;height:296px;image-rendering:pixelated}
.qr-side input[readonly]{font:13px/1.4 ui-monospace,Menlo,Consolas,monospace;cursor:text}
.qr-actions{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 12px}
.qr-actions .btn-primary,.qr-actions .btn-ghost{display:inline-block;text-decoration:none;
  padding:10px 18px;font-size:.85rem;line-height:1.2}
@media (max-width:760px){
  .qr-row{grid-template-columns:1fr}
  .qr-box img{width:100%;height:auto;max-width:296px}
}

/* ---- review moderation ---- */
.revcard-head{display:flex;align-items:flex-start;justify-content:space-between;
  gap:14px;flex-wrap:wrap;margin-bottom:10px}
.revcard-head > div{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.revcard-stars{display:inline-flex;color:var(--amber)}
.revcard-title{font-size:1rem;margin-bottom:6px}
.revcard-body{font-size:.92rem;line-height:1.65;white-space:pre-wrap;
  padding:14px 16px;background:var(--paper);border-radius:10px;border:1px solid var(--line)}
.revcard-reply{margin-top:14px}
.revcard-reply label{margin-bottom:8px}
.revcard-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px;
  padding-top:14px;border-top:1px solid var(--line)}
.revcard-actions form{margin:0}
.revcard-actions .btn-ghost{display:inline-block;text-decoration:none;padding:8px 15px;font-size:.82rem}
.revcard-actions .btn-primary,.revcard-actions .btn-danger{padding:8px 15px;font-size:.82rem}

/* ---- replace one menu page in place ---- */
.pa--menu{flex-direction:column;align-items:stretch;gap:9px}
.pa--menu img{width:100%;height:120px;object-fit:cover;border-radius:8px}
.pa-name{font-weight:600}
.pa-replace{margin:0}
.pa-file{display:block;margin:0;cursor:pointer}
.pa-file input{position:absolute;opacity:0;width:1px;height:1px}
.pa-file span{display:block;padding:8px 14px;border:1px dashed var(--line);border-radius:999px;
  text-align:center;font-size:.8rem;font-weight:600;color:var(--aqua);background:var(--paper)}
.pa-file:hover span{border-color:var(--aqua);border-style:solid}