/* =========================================================================
   Meridian Plumbing — admin CMS styles
   ========================================================================= */
:root {
  --slate-900:#14181c; --slate-800:#1d232a; --slate-700:#2b333c;
  --slate-500:#5a6672; --paper:#f4f0e8; --paper-2:#ebe5d8;
  --copper:#b5643c; --patina:#4f8a7e; --brass:#e0a83d; --brass-ink:#3a2c07;
  --line:#d5cdbc; --white:#fff; --danger:#c0432a; --ok:#2f7a5f;
  --font-display:"Archivo","Arial Narrow",sans-serif;
  --font-body:"Public Sans",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box;}
body{margin:0;font-family:var(--font-body);background:var(--paper-2);color:var(--slate-800);line-height:1.55;}
a{color:var(--copper);}
h1,h2,h3{font-family:var(--font-display);font-weight:800;letter-spacing:-.01em;margin:0;}

/* ---- Login ---- */
.login-wrap{min-height:100vh;display:grid;place-items:center;background:var(--slate-900);padding:24px;}
.login-card{background:var(--paper);width:100%;max-width:400px;padding:40px;border-radius:4px;border-top:5px solid var(--copper);}
.login-card h1{font-size:1.6rem;margin-bottom:6px;}
.login-card .sub{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-500);margin-bottom:26px;}
.seed-note{background:#eaf4f1;border:1px solid var(--patina);border-radius:3px;padding:12px 14px;font-size:.86rem;margin-bottom:22px;}
.seed-note code{background:var(--white);padding:1px 6px;border-radius:3px;font-family:var(--font-mono);}

/* ---- Shell ---- */
.admin-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh;}
.sidebar{background:var(--slate-900);color:var(--paper);padding:26px 0;position:sticky;top:0;height:100vh;overflow:auto;}
.sidebar__brand{padding:0 24px 24px;display:flex;gap:10px;align-items:center;border-bottom:1px solid rgba(255,255,255,.08);}
.sidebar__brand svg{width:30px;height:30px;}
.sidebar__brand b{font-family:var(--font-display);font-size:1.05rem;}
.sidebar__role{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;padding:16px 24px 8px;color:#8d8674;}
.sidebar nav{display:flex;flex-direction:column;}
.sidebar nav a{color:#cfc7b8;text-decoration:none;padding:12px 24px;font-size:.94rem;display:flex;justify-content:space-between;align-items:center;border-left:3px solid transparent;}
.sidebar nav a:hover{background:var(--slate-800);color:var(--paper);}
.sidebar nav a.active{border-left-color:var(--brass);color:var(--white);background:var(--slate-800);}
.sidebar__foot{padding:20px 24px;margin-top:12px;border-top:1px solid rgba(255,255,255,.08);font-size:.82rem;}
.sidebar__foot a{color:#cfc7b8;}
.badge{background:var(--copper);color:var(--paper);font-family:var(--font-mono);font-size:.64rem;padding:2px 7px;border-radius:20px;}

.main{padding:34px 40px 80px;max-width:1000px;}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:28px;gap:20px;flex-wrap:wrap;}
.page-head h1{font-size:1.9rem;}
.page-head p{color:var(--slate-500);margin:6px 0 0;font-size:.95rem;}

/* ---- Cards / forms ---- */
.card{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:26px;margin-bottom:22px;}
.card h2{font-size:1.15rem;margin-bottom:4px;}
.card .card__hint{color:var(--slate-500);font-size:.86rem;margin:0 0 18px;}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.field{margin-bottom:16px;}
.field:last-child{margin-bottom:0;}
.field label{display:block;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-500);margin-bottom:6px;}
.field input,.field select,.field textarea{width:100%;font-family:var(--font-body);font-size:.98rem;padding:11px 12px;border:1px solid var(--line);border-radius:3px;background:var(--white);}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--copper);outline-offset:1px;border-color:var(--copper);}
.field textarea{resize:vertical;min-height:90px;}

.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:.8rem;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;padding:12px 20px;border:2px solid transparent;border-radius:3px;cursor:pointer;transition:background .15s;}
.btn--brass{background:var(--brass);color:var(--brass-ink);}
.btn--brass:hover{background:#f0ba51;}
.btn--dark{background:var(--slate-800);color:var(--paper);}
.btn--dark:hover{background:var(--slate-700);}
.btn--ghost{background:transparent;border-color:var(--line);color:var(--slate-700);}
.btn--ghost:hover{background:var(--paper-2);}
.btn--danger{background:transparent;border-color:var(--danger);color:var(--danger);}
.btn--danger:hover{background:var(--danger);color:var(--white);}
.btn--sm{padding:7px 12px;font-size:.72rem;}

.alert{padding:13px 16px;border-radius:3px;font-size:.92rem;margin-bottom:22px;border:1px solid;}
.alert--ok{background:#eaf4f1;border-color:var(--patina);color:#23574d;}
.alert--err{background:#f7e9e3;border-color:var(--copper);color:#7a3a20;}

.section-block{border:1px solid var(--line);border-radius:4px;margin-bottom:18px;background:var(--paper);}
.section-block__head{padding:16px 22px;background:var(--paper-2);border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;cursor:pointer;}
.section-block__head h2{font-size:1.05rem;}
.section-block__head .chev{font-family:var(--font-mono);color:var(--slate-500);}
.section-block__body{padding:22px;}

/* ---- Image field ---- */
.imgfield{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
.imgfield__preview{width:120px;height:80px;object-fit:cover;border:1px solid var(--line);border-radius:3px;background:var(--paper-2);}
.imgfield__empty{width:120px;height:80px;display:grid;place-items:center;border:1px dashed var(--line);border-radius:3px;color:var(--slate-500);font-family:var(--font-mono);font-size:.66rem;}

/* ---- Tables ---- */
.table{width:100%;border-collapse:collapse;background:var(--paper);border:1px solid var(--line);border-radius:4px;overflow:hidden;}
.table th,.table td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--line);font-size:.92rem;vertical-align:top;}
.table th{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-500);background:var(--paper-2);}
.table tr:last-child td{border-bottom:0;}
.table tr.unread td{background:#fbf3e9;}
.pill{font-family:var(--font-mono);font-size:.64rem;padding:3px 8px;border-radius:20px;letter-spacing:.05em;text-transform:uppercase;}
.pill--new{background:var(--brass);color:var(--brass-ink);}
.pill--admin{background:var(--copper);color:var(--paper);}
.pill--editor{background:var(--patina);color:var(--paper);}
.muted{color:var(--slate-500);font-size:.82rem;}

.stat-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:26px;}
.stat-card{background:var(--paper);border:1px solid var(--line);border-radius:4px;padding:22px;}
.stat-card .n{font-family:var(--font-display);font-weight:800;font-size:2.2rem;color:var(--copper);}
.stat-card .l{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-500);margin-top:4px;}

.inline-form{display:inline;}
.row-actions{display:flex;gap:8px;flex-wrap:wrap;}

.msg-detail{background:var(--paper-2);border-left:3px solid var(--copper);padding:14px 16px;border-radius:0 3px 3px 0;margin-top:8px;font-size:.94rem;white-space:pre-wrap;}

/* Toggle rows */
.toggle{display:flex;align-items:center;gap:12px;cursor:pointer;font-size:.98rem;}
.toggle input{width:18px;height:18px;accent-color:var(--copper);cursor:pointer;flex:0 0 18px;}
.toggle span{user-select:none;}
.field .muted{display:block;margin-top:6px;}
.card code{background:var(--paper-2);padding:1px 6px;border-radius:3px;font-family:var(--font-mono);font-size:.85em;}

/* Appearance: palette presets */
.palette-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;}
.swatch-card{display:block;border:2px solid var(--line);border-radius:5px;padding:14px;cursor:pointer;background:var(--white);transition:border-color .15s;}
.swatch-card:hover{border-color:var(--slate-500);}
.swatch-card.is-selected{border-color:var(--copper);}
.swatch-card input{position:absolute;opacity:0;pointer-events:none;}
.swatch-row{display:flex;gap:0;border-radius:4px;overflow:hidden;margin-bottom:10px;}
.swatch{flex:1;height:34px;}
.swatch-name{font-family:var(--font-mono);font-size:.78rem;color:var(--slate-700);}

/* Appearance: font pairings */
.font-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.font-card{display:block;border:2px solid var(--line);border-radius:5px;padding:16px 18px;cursor:pointer;background:var(--white);transition:border-color .15s;}
.font-card:hover{border-color:var(--slate-500);}
.font-card.is-selected{border-color:var(--copper);}
.font-card input{position:absolute;opacity:0;pointer-events:none;}
.font-card__label{display:block;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-500);margin-bottom:10px;}
.font-card__demo{display:block;font-size:1.5rem;font-weight:700;line-height:1.1;color:var(--slate-900);margin-bottom:6px;}
.font-card__demo-body{display:block;font-size:.92rem;color:var(--slate-700);}

/* Appearance: individual color pickers */
.color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;}
.color-field label{display:block;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.05em;text-transform:uppercase;color:var(--slate-500);margin-bottom:6px;}
.color-input{display:flex;gap:8px;align-items:center;}
.color-input input[type=color]{width:42px;height:38px;padding:0;border:1px solid var(--line);border-radius:4px;background:none;cursor:pointer;flex:0 0 42px;}
.color-input input[type=text]{flex:1;font-family:var(--font-mono);font-size:.86rem;padding:9px 10px;border:1px solid var(--line);border-radius:3px;}
.color-input input[type=text]:focus{outline:2px solid var(--copper);outline-offset:1px;}

@media(max-width:820px){
  .admin-shell{grid-template-columns:1fr;}
  .sidebar{position:relative;height:auto;}
  .sidebar nav{flex-direction:row;flex-wrap:wrap;}
  .grid-2{grid-template-columns:1fr;}
  .stat-cards{grid-template-columns:1fr;}
  .main{padding:24px 20px 60px;}
}
