/* Same palette as the live site, kept independent so this tool has no build
   step of its own — it's plain files served by scripts/cms.mjs. */
:root{
  --ground:#F7F0E4; --surface:#FFFCF5; --raised:#FFFFFF;
  --line:#DCD0BE; --line-soft:#EAE2D5;
  --ink:#1B140D; --ink-2:#564635; --ink-3:#6B5A46;
  --saffron:#A63F09; --saffron-deep:#8A3406; --saffron-pale:rgba(232,100,10,.09);
  --crimson:#A03A20; --green:#2C6A50;
  --r-sm:8px; --r-md:12px;
  --shadow:0 1px 0 rgba(255,255,255,.8) inset,0 6px 18px -8px rgba(65,44,22,.18);
}
*{box-sizing:border-box}
/* .overlay sets display:flex, and a class beats the browser's own
   [hidden]{display:none} — so without this the publish panel ignored its
   hidden attribute and sat on top of everything, sign-in included. */
[hidden]{display:none !important}
html,body{height:100%}
body{
  margin:0;background:var(--ground);color:var(--ink-2);
  font:15px/1.6 'Segoe UI',system-ui,-apple-system,sans-serif;
}
h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400;color:var(--ink);margin:0}
button{font:inherit;cursor:pointer}
input,textarea,select{font:inherit;color:var(--ink)}

.top{
  position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding:.85rem 1.4rem;background:var(--surface);border-bottom:1px solid var(--line);
}
.brand{display:flex;align-items:center;gap:.7rem}
/* the temple's own mark, inlined so this tool keeps no build step */
.brand-mark{height:2.25rem;width:auto;display:block}
.brand b{display:block;font-size:.95rem;color:var(--ink)}
.brand span{display:block;font-size:.68rem;color:var(--ink-3)}
.top-actions{display:flex;align-items:center;gap:.9rem}
.status{font-size:.72rem;font-weight:600;color:var(--ink-3);min-width:8rem;text-align:right}
.status.ok{color:var(--green)}
.status.err{color:var(--crimson)}

.btn{border:1px solid var(--saffron);border-radius:999px;padding:.5rem 1.1rem;font-size:.82rem;font-weight:600;background:transparent;color:var(--saffron);transition:background .15s,color .15s}
.btn:hover{background:var(--saffron-pale)}
.btn-solid{background:var(--saffron);color:#fff;border-color:var(--saffron)}
.btn-solid:hover{background:var(--saffron-deep);border-color:var(--saffron-deep)}
.btn-ghost{border-color:var(--line);color:var(--ink-2)}
.btn-ghost:hover{background:var(--line-soft)}
.btn-small{padding:.32rem .7rem;font-size:.72rem}
.btn[disabled]{opacity:.5;cursor:default}

.shell{display:flex;min-height:calc(100vh - 60px)}
.nav{
  width:230px;flex:0 0 auto;border-right:1px solid var(--line);background:var(--surface);
  padding:1rem .6rem;overflow-y:auto;
}
.nav-group{font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);padding:1rem .6rem .35rem}
.nav-group:first-child{padding-top:.2rem}
.nav a{
  display:block;padding:.5rem .6rem;border-radius:8px;font-size:.86rem;color:var(--ink-2);
  text-decoration:none;margin-bottom:2px;
}
.nav a:hover{background:var(--saffron-pale);color:var(--saffron)}
.nav a.active{background:var(--saffron);color:#fff}

.main{flex:1;padding:1.6rem 2rem 4rem;max-width:900px}
.loading{color:var(--ink-3)}

.panel-head{margin-bottom:1.4rem}
.panel-head h2{font-size:1.5rem}
.panel-head p{color:var(--ink-3);font-size:.85rem;margin-top:.25rem}

.field{margin-bottom:1.1rem}
.field label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.03em;color:var(--ink-3);margin-bottom:.35rem}
.field .hint{font-size:.72rem;color:var(--ink-3);margin-top:.3rem}
/* password and email were missing here, so they fell back to the browser's
   default input width and sat visibly narrower than the rest. */
.field input[type=text],.field input[type=password],.field input[type=email],
.field input[type=number],.field textarea,.field select{
  width:100%;border:1px solid var(--line);border-radius:8px;background:var(--raised);
  padding:.55rem .7rem;color:var(--ink);box-shadow:var(--shadow);
}
.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--saffron);outline-offset:1px}
.field textarea{min-height:5.2rem;resize:vertical;font-family:inherit}
.field input[readonly]{background:var(--line-soft);color:var(--ink-3)}

.card{
  border:1px solid var(--line);border-radius:var(--r-md);background:var(--raised);
  padding:1.1rem 1.2rem;margin-bottom:1rem;box-shadow:var(--shadow);
}
.card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}
.card-head b{font-size:.8rem;color:var(--saffron);letter-spacing:.02em}
.card-actions{display:flex;gap:.4rem}

.stringlist-row{display:flex;gap:.5rem;margin-bottom:.5rem}
.stringlist-row input{flex:1}

.add-row{margin-top:.4rem}

.save-bar{
  position:sticky;bottom:0;display:flex;justify-content:flex-end;gap:.6rem;
  padding:1rem 0 .2rem;background:linear-gradient(180deg,transparent,var(--ground) 30%);
}

.overlay{
  position:fixed;inset:0;background:rgba(20,10,6,.55);display:flex;align-items:center;justify-content:center;
  padding:2rem;z-index:50;
}
.overlay-card{
  background:var(--raised);border-radius:var(--r-md);padding:1.4rem 1.5rem;max-width:720px;width:100%;
  max-height:80vh;display:flex;flex-direction:column;box-shadow:0 30px 60px -20px rgba(0,0,0,.4);
}
.overlay-card pre{
  flex:1;overflow:auto;background:#14100c;color:#e6dcc9;padding:1rem;border-radius:8px;
  font-size:.78rem;line-height:1.5;white-space:pre-wrap;word-break:break-word;
}
.overlay-actions{display:flex;justify-content:flex-end;margin-top:1rem}

/* ------------------------------------------------------------ login ---- */
.login-screen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  padding:2rem;background:var(--ground);
}
.login-card{
  width:100%;max-width:340px;background:var(--raised);border:1px solid var(--line);
  border-radius:var(--r-md);padding:2rem 1.8rem;box-shadow:0 20px 44px -20px rgba(65,44,22,.3);
  text-align:center;
}
.login-card .brand-mark{height:3.25rem;margin:0 auto .25rem}
.login-card h1{font-size:1.3rem;margin:.4rem 0 .1rem}
.login-card .sub{font-size:.78rem;color:var(--ink-3);margin-bottom:1.4rem}
.login-card .field{text-align:left}
.login-card button{width:100%;margin-top:.4rem;padding:.65rem}
.login-error{
  font-size:.78rem;color:var(--crimson);background:rgba(160,58,32,.08);
  border:1px solid rgba(160,58,32,.25);border-radius:8px;padding:.5rem .7rem;margin-bottom:1rem;
}

/* ------------------------------------------------------------- header -- */
.pending-badge{
  font-size:.68rem;font-weight:700;letter-spacing:.04em;color:var(--crimson);
  background:rgba(160,58,32,.08);border:1px solid rgba(160,58,32,.25);
  border-radius:999px;padding:.25rem .65rem;
}

/* -------------------------------------------------------------- users -- */
.users-table{width:100%;border-collapse:collapse;margin-top:.5rem}
.users-table th,.users-table td{text-align:left;padding:.6rem .5rem;border-bottom:1px solid var(--line-soft);font-size:.85rem}
.users-table th{font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3)}
.role-badge{
  display:inline-block;font-size:.68rem;font-weight:700;padding:.15rem .55rem;border-radius:999px;
}
.role-badge.admin{background:rgba(166,63,9,.1);color:var(--saffron)}
.role-badge.editor{background:rgba(44,106,80,.1);color:var(--green)}
.inline-actions{display:flex;gap:.4rem;flex-wrap:wrap}
.new-user-card{max-width:420px}

/* -------------------------------------------------------------- media -- */
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;margin-top:1.5rem}
.media-item{border:1px solid var(--line);border-radius:var(--r-sm);background:var(--raised);overflow:hidden;box-shadow:var(--shadow)}
.media-item img{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:var(--line-soft)}
.media-item .media-name{font-size:.7rem;padding:.4rem .5rem 0;word-break:break-all;color:var(--ink)}
.media-item .media-size{font-size:.65rem;padding:0 .5rem;color:var(--ink-3)}
.media-item .media-actions{display:flex;gap:.3rem;padding:.4rem .5rem .5rem}
.dropzone{
  border:2px dashed var(--line);border-radius:var(--r-md);padding:2rem;text-align:center;
  color:var(--ink-3);font-size:.85rem;margin-top:1rem;transition:border-color .15s,background .15s;
}
.dropzone.drag{border-color:var(--saffron);background:var(--saffron-pale)}
.dropzone input{display:none}
.dropzone label{color:var(--saffron);cursor:pointer;font-weight:600}

/* ------------------------------------------------------- enquiries -- */
.panel-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.hint { color: var(--ink-3); font-size: .86rem; margin: .4rem 0 1.2rem; max-width: 62ch; }

.enq-list { display: grid; gap: .9rem; }
.enq { border: 1px solid var(--line-soft); border-radius: var(--r-md); padding: 1rem 1.1rem; background: var(--raised); }
.enq-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.enq-top b { display: block; font-size: 1rem; color: var(--ink); }
.enq-when { color: var(--ink-3); font-size: .78rem; }
.enq-status {
  flex: none; border-radius: 999px; padding: .2rem .6rem;
  font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
}
.enq-status.is-new       { background: var(--saffron); color: #fff; }
.enq-status.is-in-hand   { background: var(--saffron-pale); color: var(--saffron-deep); }
.enq-status.is-answered  { background: rgba(44,106,80,.12); color: var(--green); }
.enq-who { display: flex; flex-wrap: wrap; gap: .9rem; margin: .55rem 0 .1rem; font-size: .86rem; }
.enq-who a { color: var(--saffron); }
.enq-message { white-space: pre-wrap; margin: .5rem 0 .9rem; font-size: .9rem; line-height: 1.55; }
.enq-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.btn-danger { border-color: var(--crimson); color: var(--crimson); }
.btn-danger:hover { background: var(--crimson); color: #fff; }

/* -------------------------------------------------------- activity -- */
table.audit { width: 100%; border-collapse: collapse; font-size: .84rem; }
table.audit th, table.audit td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
table.audit th { font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; color: var(--ink-3); }
table.audit td.nowrap { white-space: nowrap; color: var(--ink-3); }

.media-tabs { display: flex; gap: .5rem; margin-bottom: 1rem; }
.media-pdf {
  display: grid; place-items: center; aspect-ratio: 1; background: var(--surface);
  border-bottom: 1px solid var(--line-soft);
}
.media-pdf span { font-size: .8rem; font-weight: 700; letter-spacing: .1em; color: var(--ink-3); }

/* -------------------------------------------------------- bookings -- */
.enq-status.is-confirmed { background: var(--saffron-pale); color: var(--saffron-deep); }
.enq-status.is-paid      { background: rgba(44,106,80,.12); color: var(--green); }
.enq-status.is-done      { background: var(--line-soft); color: var(--ink-3); }
.enq-status.is-cancelled { background: var(--line-soft); color: var(--ink-3); text-decoration: line-through; }
.book-names { margin: .6rem 0 .2rem; padding-left: 1.1rem; font-size: .92rem; color: var(--ink); }
.book-names li { margin: .1rem 0; }
.book-facts { display: grid; grid-template-columns: max-content 1fr; gap: .2rem 1rem; margin: .5rem 0; font-size: .85rem; }
.book-facts dt { color: var(--ink-3); }
.book-facts dd { margin: 0; color: var(--ink); }