/* Admin console — same palette, plainer furniture. Simon needs to
   change a price in ten seconds on a phone, not admire anything. */

body.admin{ background:var(--bone-2); }

.adm-bar{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.9rem clamp(1rem,4vw,2rem);
  background:var(--obsidian); color:var(--bone);
}
.adm-brand{ margin:0; font-family:var(--display); font-weight:300; font-size:1.25rem; line-height:1; }
.adm-brand span{ display:block; font-family:var(--body); font-size:.55rem; font-weight:600;
  letter-spacing:.26em; text-transform:uppercase; color:var(--brass); margin-top:.45rem; }
.adm-bar__right{ display:flex; align-items:center; gap:1rem; }
.adm-saved{ font-size:.62rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--brass); }

.adm-signin{ min-height:70vh; display:grid; place-items:center; padding:2rem 1.25rem; }
.adm-card{ background:var(--bone); border:1px solid var(--hair); padding:2rem; width:100%; max-width:24rem; }
.adm-card h1{ font-size:2rem; margin-bottom:.5rem; }
.adm-card p{ color:var(--ink-60); margin-bottom:1.5rem; }
.adm-error{ color:#9B2C2C; font-size:.88rem; margin:.75rem 0 0; }

.adm-main{ padding:clamp(1rem,4vw,2rem); max-width:64rem; margin-inline:auto; }

.adm-tabs{ display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:1.75rem; }
.adm-tab{
  border:1px solid var(--hair); background:var(--bone); cursor:pointer;
  padding:.6rem 1rem; font-family:var(--body); font-size:.72rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-60); border-radius:0;
  transition:background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.adm-tab:hover{ border-color:var(--brass); }
.adm-tab.is-on{ background:var(--obsidian); color:var(--brass-lt); border-color:var(--obsidian); }

.adm-panel{ display:none; }
.adm-panel.is-on{ display:block; }
.adm-lead{ color:var(--ink-60); font-size:.94rem; margin-bottom:1.5rem; max-width:60ch; }

.adm-group{ background:var(--bone); border:1px solid var(--hair); margin-bottom:1.25rem; }
.adm-group__head{
  display:flex; align-items:center; gap:1rem; flex-wrap:wrap;
  padding:1.1rem 1.25rem; border-bottom:1px solid var(--hair);
}
.adm-group__head h2{ font-size:1.5rem; margin:0; flex:1 1 auto; }
.adm-group__body{ padding:1.25rem; }

.adm-item{ border:1px solid var(--hair); padding:1.1rem 1.25rem; margin-bottom:.85rem; background:var(--bone); }
.adm-item:last-child{ margin-bottom:0; }
.adm-item.is-off{ opacity:.55; }
.adm-item__head{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:.9rem; }
.adm-item__head h3{ font-size:1.2rem; margin:0; flex:1 1 auto; }

.adm-grid{ display:grid; gap:.9rem; }
@media(min-width:640px){ .adm-grid--2{ grid-template-columns:1fr 1fr; } }

.adm-field label{
  display:block; font-size:.6rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--brass-dk); margin-bottom:.4rem;
}
.adm-field input,.adm-field textarea,.adm-field select{
  width:100%; font-family:var(--body); font-size:.98rem; color:var(--ink);
  padding:.55rem .7rem; background:#fff; border:1px solid var(--hair); border-radius:0;
}
.adm-field textarea{ resize:vertical; min-height:4.5rem; line-height:1.5; }
.adm-field input:focus,.adm-field textarea:focus,.adm-field select:focus{
  outline:none; border-color:var(--brass); box-shadow:0 0 0 2px rgba(201,167,106,.2);
}
.adm-field small{ display:block; margin-top:.35rem; font-size:.78rem; color:var(--ink-60); }

.adm-toggle{ display:inline-flex; align-items:center; gap:.6rem; cursor:pointer; font-size:.72rem;
  font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-60); }
.adm-toggle input{ width:2.6rem; height:1.4rem; appearance:none; background:var(--hair);
  position:relative; cursor:pointer; border-radius:100px; transition:background .3s var(--ease); }
.adm-toggle input::after{ content:""; position:absolute; top:3px; left:3px; width:1.1rem; height:1.1rem;
  background:#fff; border-radius:50%; transition:transform .3s var(--ease); }
.adm-toggle input:checked{ background:var(--brass); }
.adm-toggle input:checked::after{ transform:translateX(1.2rem); }
.adm-toggle input:focus-visible{ outline:2px solid var(--brass); outline-offset:2px; }

.adm-row{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:center;
  padding:.85rem 1rem; border:1px solid var(--hair); background:var(--bone); margin-bottom:.5rem; }
.adm-row--add{ background:var(--bone); margin-bottom:1.25rem; }
.adm-row input[type="date"],.adm-row input[type="text"]{
  flex:1 1 10rem; padding:.5rem .65rem; border:1px solid var(--hair); background:#fff;
  font-family:var(--body); font-size:.95rem; border-radius:0;
}
.adm-row__date{ font-weight:600; }
.adm-row__meta{ flex:1 1 auto; color:var(--ink-60); font-size:.88rem; }

.adm-link{ background:none; border:0; cursor:pointer; padding:.25rem 0;
  font-family:var(--body); font-size:.68rem; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--brass-dk); }
.adm-link:hover{ color:var(--ink); }
.adm-link--danger:hover{ color:#9B2C2C; }

.adm-actions{ display:flex; gap:1.25rem; align-items:center; margin-top:1rem;
  padding-top:.9rem; border-top:1px solid var(--hair); }

.adm-table{ width:100%; border-collapse:collapse; font-size:.9rem; background:var(--bone); }
.adm-table th{ text-align:left; font-size:.58rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--brass-dk); padding:.7rem .9rem; border-bottom:1px solid var(--hair); }
.adm-table td{ padding:.8rem .9rem; border-bottom:1px solid var(--hair); color:var(--ink-60); vertical-align:top; }
.adm-table td strong{ color:var(--ink); }
.adm-pill{ display:inline-block; font-size:.58rem; font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; padding:.2rem .5rem; border:1px solid currentColor; }
.adm-pill--confirmed{ color:#2F6B4F; }
.adm-pill--pending{ color:var(--brass-dk); }
.adm-pill--cancelled{ color:#9B2C2C; }
.adm-empty{ padding:1.5rem; color:var(--ink-60); border:1px dashed var(--hair); }
@media(max-width:640px){
  .adm-table thead{ display:none; }
  .adm-table tr{ display:block; border-bottom:1px solid var(--hair); padding:.85rem 0; }
  .adm-table td{ display:block; border:0; padding:.15rem .9rem; }
}