/* ==========================================================================
   Eden Ridge dashboard
   Its own neutral palette, the site's typefaces, WordPress-familiar layout.
   ========================================================================== */

:root{
  --a-bg:#f4f5f3;
  --a-surface:#ffffff;
  --a-sidebar:#131f19;
  --a-sidebar-hover:#1d2d24;
  --a-ink:#1b1c19;
  --a-ink-soft:#5c6159;
  --a-ink-faint:#8b908a;
  --a-line:#e2e4df;
  --a-line-strong:#cfd3cc;
  --a-brass:#b6904f;
  --a-brass-soft:#cdae74;
  --a-brass-wash:#faf5ea;
  --a-danger:#a4342c;
  --a-danger-wash:#fbeeed;
  --a-ok:#2f6b46;
  --a-ok-wash:#eaf3ed;
  --a-warn:#8a6516;
  --a-warn-wash:#fdf5e4;
  --a-info:#2c5578;
  --a-info-wash:#eaf1f7;

  --a-serif:'Iowan Old Style','Palatino Linotype',Georgia,serif;
  --a-sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --a-radius:4px;
  --a-shadow:0 1px 2px rgba(19,31,25,.06), 0 8px 24px rgba(19,31,25,.06);
  --a-sidebar-w:246px;
  --a-topbar-h:58px;
}

*{box-sizing:border-box;}
body{
  margin:0; background:var(--a-bg); color:var(--a-ink);
  font-family:var(--a-sans); font-size:14px; line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{margin:0; font-weight:600;}
img{max-width:100%; display:block;}
input,select,textarea,button{font-family:inherit; font-size:inherit;}
:focus-visible{outline:2px solid var(--a-brass); outline-offset:2px;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;}
/* The `hidden` attribute must win over any class that sets a display value —
   otherwise .btn, .consent and friends stay visible when JS hides them. */
[hidden]{display:none !important;}


/* ------------------------------------------------------------- structure */
.shell{display:flex; min-height:100vh;}
.sidebar{
  width:var(--a-sidebar-w); flex-shrink:0; background:var(--a-sidebar); color:#cfd6cf;
  display:flex; flex-direction:column; position:fixed; inset:0 auto 0 0; z-index:40;
  overflow-y:auto;
}
.sidebar-brand{padding:20px 22px 16px; display:flex; gap:11px; align-items:center; color:#f2eee2;}
.sidebar-brand svg{width:26px; height:26px;}
.sidebar-brand .name{font-family:var(--a-serif); font-size:16px; letter-spacing:.06em;}
.sidebar-brand .tag{display:block; font-size:9px; letter-spacing:.18em; text-transform:uppercase; color:var(--a-brass-soft); margin-top:2px;}
.sidebar nav{padding:6px 10px 24px;}
.sidebar nav a{
  display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:var(--a-radius);
  font-size:13.5px; color:#c2cbc2; margin-bottom:1px;
}
.sidebar nav a:hover{background:var(--a-sidebar-hover); color:#f2eee2;}
.sidebar nav a.active{background:var(--a-sidebar-hover); color:#f2eee2; box-shadow:inset 2px 0 0 var(--a-brass);}
.sidebar nav a svg{width:17px; height:17px; flex-shrink:0; opacity:.85;}
.sidebar .group{padding:16px 22px 6px; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:#79857a;}
.sidebar .badge{
  margin-left:auto; background:var(--a-brass); color:#161b13; border-radius:10px;
  padding:1px 7px; font-size:11px; font-weight:600;
}

.main{flex:1; margin-left:var(--a-sidebar-w); min-width:0; display:flex; flex-direction:column;}
.topbar{
  height:var(--a-topbar-h); background:var(--a-surface); border-bottom:1px solid var(--a-line);
  display:flex; align-items:center; gap:14px; padding:0 24px; position:sticky; top:0; z-index:30;
}
.topbar h1{font-size:15px; font-weight:600;}
.topbar .spacer{flex:1;}
.topbar a.ghost{font-size:13px; color:var(--a-ink-soft); padding:7px 12px; border:1px solid var(--a-line-strong); border-radius:var(--a-radius);}
.topbar a.ghost:hover{border-color:var(--a-brass); color:var(--a-ink);}
.menu-toggle{display:none; background:none; border:1px solid var(--a-line-strong); border-radius:var(--a-radius); padding:6px 10px; cursor:pointer;}

.account{position:relative;}
.account summary{list-style:none; cursor:pointer; display:flex; align-items:center; gap:9px; padding:5px 8px; border-radius:var(--a-radius);}
.account summary::-webkit-details-marker{display:none;}
.account summary:hover{background:var(--a-bg);}
.avatar{width:28px; height:28px; border-radius:50%; background:var(--a-sidebar); color:#f2eee2; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:600;}
.account-menu{
  position:absolute; right:0; top:calc(100% + 8px); background:var(--a-surface); border:1px solid var(--a-line);
  border-radius:var(--a-radius); box-shadow:var(--a-shadow); min-width:190px; padding:6px; z-index:50;
}
.account-menu a, .account-menu button{
  display:block; width:100%; text-align:left; padding:8px 11px; border:none; background:none;
  border-radius:var(--a-radius); font-size:13.5px; color:var(--a-ink); cursor:pointer;
}
.account-menu a:hover, .account-menu button:hover{background:var(--a-bg);}

.content{padding:26px 24px 90px; flex:1; max-width:1180px; width:100%;}
.content.wide{max-width:none;}
.page-head{display:flex; align-items:flex-start; gap:16px; margin-bottom:20px; flex-wrap:wrap;}
.page-head h2{font-family:var(--a-serif); font-size:24px; font-weight:500;}
.page-head p{color:var(--a-ink-soft); font-size:13.5px; margin:5px 0 0;}
.page-head .spacer{flex:1;}

/* ---------------------------------------------------------------- cards */
.card{background:var(--a-surface); border:1px solid var(--a-line); border-radius:var(--a-radius); box-shadow:var(--a-shadow);}
.card + .card{margin-top:18px;}
.card-head{padding:15px 20px; border-bottom:1px solid var(--a-line); display:flex; align-items:center; gap:12px;}
.card-head h3{font-size:14px;}
.card-head .spacer{flex:1;}
.card-body{padding:20px;}
.card-body.tight{padding:14px 20px;}

.grid{display:grid; gap:18px;}
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr));}
@media (max-width:1000px){ .grid.cols-3, .grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .grid.cols-2, .grid.cols-3, .grid.cols-4{grid-template-columns:1fr;} }

.stat{padding:18px 20px;}
.stat .n{font-family:var(--a-serif); font-size:30px; line-height:1.1;}
.stat .l{font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--a-ink-faint); margin-top:6px;}

/* --------------------------------------------------------------- forms */
.field{margin-bottom:18px;}
/* :not(.switch) matters — this rule is more specific than .switch and would
   otherwise blockify the toggle, collapsing its inline track to zero width. */
.field > label:not(.switch), .field-label{display:block; font-size:12px; font-weight:600; letter-spacing:.02em; margin-bottom:6px; color:var(--a-ink);}
.field .hint{font-size:12px; color:var(--a-ink-faint); margin:-2px 0 7px;}
input[type=text], input[type=email], input[type=password], input[type=number],
input[type=url], input[type=tel], input[type=date], input[type=search], select, textarea{
  width:100%; padding:9px 11px; border:1px solid var(--a-line-strong); border-radius:var(--a-radius);
  background:var(--a-surface); color:var(--a-ink); transition:border-color .15s ease;
}
input:focus, select:focus, textarea:focus{border-color:var(--a-brass); outline:none; box-shadow:0 0 0 3px var(--a-brass-wash);}
textarea{resize:vertical; min-height:76px; line-height:1.6;}
.counter{float:right; font-size:11px; color:var(--a-ink-faint); font-weight:400;}
.counter.over{color:var(--a-warn);}

.switch{display:inline-flex; align-items:center; gap:9px; cursor:pointer; font-size:13.5px; position:relative; line-height:1.4;}
.switch input{position:absolute; opacity:0; width:0; height:0;}
.switch .track{
  display:block; width:38px; height:21px; border-radius:11px; background:var(--a-line-strong);
  position:relative; transition:background .18s ease; flex-shrink:0;
}
.switch .track::after{
  content:""; position:absolute; top:2px; left:2px; width:17px; height:17px; border-radius:50%;
  background:#fff; transition:transform .18s ease; box-shadow:0 1px 2px rgba(0,0,0,.25);
}
.switch input:checked + .track{background:var(--a-brass);}
.switch input:checked + .track::after{transform:translateX(17px);}
.switch input:focus-visible + .track{outline:2px solid var(--a-brass); outline-offset:2px;}

.btn{
  display:inline-flex; align-items:center; gap:7px; padding:9px 16px; border-radius:var(--a-radius);
  border:1px solid transparent; cursor:pointer; font-size:13px; font-weight:600; line-height:1.3;
  transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.btn-primary{background:var(--a-sidebar); color:#f2eee2;}
.btn-primary:hover{background:var(--a-sidebar-hover);}
.btn-accent{background:var(--a-brass); color:#161b13;}
.btn-accent:hover{background:var(--a-brass-soft);}
.btn-ghost{border-color:var(--a-line-strong); background:var(--a-surface); color:var(--a-ink);}
.btn-ghost:hover{border-color:var(--a-brass);}
.btn-danger{background:var(--a-danger); color:#fff;}
.btn-danger:hover{filter:brightness(1.08);}
.btn-sm{padding:6px 11px; font-size:12px;}
.btn[disabled]{opacity:.5; pointer-events:none;}
.btn svg{width:15px; height:15px;}

/* ------------------------------------------------------------ save bar */
.savebar{
  position:fixed; left:var(--a-sidebar-w); right:0; bottom:0; background:var(--a-surface);
  border-top:1px solid var(--a-line); padding:12px 24px; display:flex; align-items:center; gap:12px;
  z-index:35; box-shadow:0 -2px 14px rgba(19,31,25,.06);
}
.savebar .spacer{flex:1;}
.savebar .state{font-size:12.5px; color:var(--a-ink-faint);}
.savebar .state.dirty{color:var(--a-warn); font-weight:600;}

/* --------------------------------------------------------------- flash */
.flash{padding:12px 16px; border-radius:var(--a-radius); font-size:13.5px; margin-bottom:16px; border:1px solid transparent;}
.flash-success{background:var(--a-ok-wash); color:var(--a-ok); border-color:#c9e0d2;}
.flash-error{background:var(--a-danger-wash); color:var(--a-danger); border-color:#f0cdca;}
.flash-info{background:var(--a-info-wash); color:var(--a-info); border-color:#cfe0ee;}
.flash-warn{background:var(--a-warn-wash); color:var(--a-warn); border-color:#eddfbc;}

/* --------------------------------------------------------------- table */
table.data{width:100%; border-collapse:collapse; font-size:13.5px;}
table.data th{
  text-align:left; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--a-ink-faint);
  padding:10px 14px; border-bottom:1px solid var(--a-line); font-weight:600; white-space:nowrap;
}
table.data td{padding:12px 14px; border-bottom:1px solid var(--a-line); vertical-align:middle;}
table.data tr:last-child td{border-bottom:none;}
table.data tbody tr:hover{background:var(--a-bg);}
table.data a.row-link{font-weight:600;}
.table-wrap{overflow-x:auto;}
.empty{padding:44px 20px; text-align:center; color:var(--a-ink-faint);}
.empty h4{font-family:var(--a-serif); font-size:18px; font-weight:500; color:var(--a-ink); margin-bottom:6px;}

.pill{display:inline-block; padding:3px 10px; border-radius:11px; font-size:11px; font-weight:600; letter-spacing:.03em;}
.pill-new{background:var(--a-info-wash); color:var(--a-info);}
.pill-contacted{background:var(--a-warn-wash); color:var(--a-warn);}
.pill-qualified{background:var(--a-brass-wash); color:var(--a-warn);}
.pill-won{background:var(--a-ok-wash); color:var(--a-ok);}
.pill-lost{background:var(--a-bg); color:var(--a-ink-faint);}
.pill-spam{background:var(--a-danger-wash); color:var(--a-danger);}
.pill-draft{background:var(--a-warn-wash); color:var(--a-warn);}
.pill-live{background:var(--a-ok-wash); color:var(--a-ok);}

.filters{display:flex; gap:10px; flex-wrap:wrap; align-items:flex-end;}
.filters .field{margin-bottom:0; min-width:150px;}
.filters .field.grow{flex:1; min-width:220px;}

.pagination{display:flex; gap:6px; padding:14px 20px; align-items:center; font-size:13px; color:var(--a-ink-soft);}
.pagination a{padding:5px 10px; border:1px solid var(--a-line-strong); border-radius:var(--a-radius);}
.pagination a:hover{border-color:var(--a-brass);}
.pagination .spacer{flex:1;}

/* ------------------------------------------------------- section editor */
.editor{display:grid; grid-template-columns:250px minmax(0,1fr); gap:20px; align-items:start;}
@media (max-width:900px){ .editor{grid-template-columns:1fr;} }
.section-list{background:var(--a-surface); border:1px solid var(--a-line); border-radius:var(--a-radius); overflow:hidden; box-shadow:var(--a-shadow);}
.section-list li{list-style:none; display:flex; align-items:center; gap:8px; border-bottom:1px solid var(--a-line); padding:0 6px 0 4px;}
.section-list li:last-child{border-bottom:none;}
.section-list ul{margin:0; padding:0;}
.section-list a.tab{flex:1; padding:11px 6px; font-size:13.5px; display:flex; align-items:center; gap:8px; min-width:0;}
.section-list a.tab .label{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.section-list li.active{background:var(--a-brass-wash); box-shadow:inset 2px 0 0 var(--a-brass);}
.section-list li.hidden-section a.tab{color:var(--a-ink-faint);}
.drag{cursor:grab; color:var(--a-ink-faint); padding:6px 2px; background:none; border:none;}
.drag:active{cursor:grabbing;}
.section-list li.dragging{opacity:.45;}
.dot-draft{width:7px; height:7px; border-radius:50%; background:var(--a-warn); flex-shrink:0;}

/* ------------------------------------------------------------ repeaters */
.rep{border:1px solid var(--a-line); border-radius:var(--a-radius); background:var(--a-bg);}
.rep-rows{padding:10px; display:flex; flex-direction:column; gap:8px;}
.rep-row{background:var(--a-surface); border:1px solid var(--a-line); border-radius:var(--a-radius);}
.rep-row.dragging{opacity:.45;}
.rep-head{display:flex; align-items:center; gap:8px; padding:8px 10px; cursor:pointer;}
.rep-head .title{flex:1; font-size:13px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.rep-head .num{font-size:11px; color:var(--a-ink-faint); min-width:20px;}
.rep-body{padding:4px 14px 14px; border-top:1px solid var(--a-line);}
.rep-row.collapsed .rep-body{display:none;}
.rep-actions{display:flex; gap:4px;}
.icon-btn{background:none; border:1px solid transparent; border-radius:var(--a-radius); padding:4px 6px; cursor:pointer; color:var(--a-ink-faint);}
.icon-btn:hover{border-color:var(--a-line-strong); color:var(--a-ink);}
.icon-btn.danger:hover{color:var(--a-danger); border-color:var(--a-danger);}
.icon-btn svg{width:15px; height:15px; display:block;}
.rep-add{margin:0 10px 10px;}

/* ---------------------------------------------------------- media field */
.media-field{display:flex; gap:12px; align-items:flex-start;}
.media-preview{
  width:112px; height:78px; border:1px solid var(--a-line-strong); border-radius:var(--a-radius);
  background:var(--a-bg) center/cover no-repeat; flex-shrink:0; overflow:hidden;
  display:flex; align-items:center; justify-content:center; color:var(--a-ink-faint); font-size:11px;
}
.media-preview img{width:100%; height:100%; object-fit:cover;}
.media-meta{flex:1; min-width:0; font-size:12px; color:var(--a-ink-faint);}
.media-meta .name{color:var(--a-ink); font-weight:600; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.media-actions{display:flex; gap:6px; margin-top:8px; flex-wrap:wrap;}

.media-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(148px,1fr)); gap:12px;}
.media-tile{border:1px solid var(--a-line); border-radius:var(--a-radius); overflow:hidden; background:var(--a-surface); cursor:pointer; position:relative;}
.media-tile.selected{border-color:var(--a-brass); box-shadow:0 0 0 2px var(--a-brass-wash);}
.media-tile .thumb{aspect-ratio:4/3; background:var(--a-bg);}
.media-tile .thumb img{width:100%; height:100%; object-fit:cover;}
.media-tile .meta{padding:8px 10px; font-size:11.5px; color:var(--a-ink-faint);}
.media-tile .meta strong{display:block; color:var(--a-ink); font-size:12.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

.modal{position:fixed; inset:0; background:rgba(19,31,25,.55); display:none; align-items:center; justify-content:center; z-index:60; padding:24px;}
.modal.open{display:flex;}
.modal-panel{background:var(--a-surface); border-radius:var(--a-radius); width:100%; max-width:880px; max-height:86vh; display:flex; flex-direction:column; overflow:hidden;}
.modal-head{padding:15px 20px; border-bottom:1px solid var(--a-line); display:flex; align-items:center; gap:12px;}
.modal-head h3{font-size:15px;}
.modal-head .spacer{flex:1;}
.modal-body{padding:18px 20px; overflow-y:auto;}
.modal-foot{padding:13px 20px; border-top:1px solid var(--a-line); display:flex; gap:10px; justify-content:flex-end;}

.icon-picker{display:grid; grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:8px;}
.icon-choice{border:1px solid var(--a-line); border-radius:var(--a-radius); padding:10px 6px; text-align:center; cursor:pointer; background:var(--a-surface);}
.icon-choice.selected{border-color:var(--a-brass); background:var(--a-brass-wash);}
.icon-choice svg{width:22px; height:22px; margin:0 auto 6px; color:var(--a-brass);}
.icon-choice span{font-size:10.5px; color:var(--a-ink-faint); display:block; line-height:1.3;}

/* --------------------------------------------------------- richtext box */
.rt-toolbar{display:flex; gap:4px; border:1px solid var(--a-line-strong); border-bottom:none; border-radius:var(--a-radius) var(--a-radius) 0 0; padding:5px; background:var(--a-bg);}
.rt-toolbar button{background:none; border:1px solid transparent; border-radius:3px; padding:4px 9px; cursor:pointer; font-size:12.5px; color:var(--a-ink-soft);}
.rt-toolbar button:hover{background:var(--a-surface); border-color:var(--a-line-strong); color:var(--a-ink);}
.rt-area{
  border:1px solid var(--a-line-strong); border-radius:0 0 var(--a-radius) var(--a-radius);
  min-height:120px; padding:11px 12px; background:var(--a-surface); line-height:1.7;
}
.rt-area:focus{outline:none; border-color:var(--a-brass); box-shadow:0 0 0 3px var(--a-brass-wash);}
.rt-area p{margin:0 0 12px;}
.rt-area ul{margin:0 0 12px; padding-left:20px;}

/* --------------------------------------------------------------- login */
.auth{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px; background:var(--a-sidebar);}
.auth-card{background:var(--a-surface); border-radius:var(--a-radius); width:100%; max-width:392px; padding:34px 32px; box-shadow:0 24px 60px rgba(0,0,0,.3);}
.auth-brand{display:flex; align-items:center; gap:10px; margin-bottom:22px; color:var(--a-ink);}
.auth-brand svg{width:28px; height:28px; color:var(--a-sidebar);}
.auth-brand .name{font-family:var(--a-serif); font-size:17px; letter-spacing:.06em;}
.auth-card h1{font-size:17px; margin-bottom:6px;}
.auth-card p.lede{color:var(--a-ink-soft); font-size:13.5px; margin:0 0 20px;}
.auth-card .btn{width:100%; justify-content:center; margin-top:6px;}
.auth-links{margin-top:18px; font-size:13px; display:flex; justify-content:space-between; gap:12px;}
.auth-links a{color:var(--a-ink-soft); border-bottom:1px solid var(--a-line-strong);}

/* ------------------------------------------------------------ enquiries */
.drawer-grid{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:18px; align-items:start;}
@media (max-width:900px){ .drawer-grid{grid-template-columns:1fr;} }
.note{padding:12px 14px; border-bottom:1px solid var(--a-line); font-size:13px;}
.note:last-child{border-bottom:none;}
.note .who{font-size:11px; color:var(--a-ink-faint); margin-bottom:4px;}
.kv{display:flex; justify-content:space-between; gap:14px; padding:9px 0; border-bottom:1px solid var(--a-line); font-size:13px;}
.kv:last-child{border-bottom:none;}
.kv .k{color:var(--a-ink-faint);}
.kv .v{text-align:right; word-break:break-word;}
.message-box{padding:14px 16px; background:var(--a-bg); border-left:2px solid var(--a-brass); border-radius:var(--a-radius); line-height:1.75; white-space:pre-wrap;}

.actions-row{display:flex; gap:8px; flex-wrap:wrap;}
.diff{font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; white-space:pre-wrap; background:var(--a-bg); padding:14px; border-radius:var(--a-radius); max-height:340px; overflow:auto;}

/* --------------------------------------------------------------- mobile */
@media (max-width:820px){
  .sidebar{transform:translateX(-100%); transition:transform .22s ease; width:270px;}
  .sidebar.open{transform:none;}
  .main{margin-left:0;}
  .savebar{left:0;}
  .menu-toggle{display:inline-flex;}
  .content{padding:18px 16px 96px;}
  .scrim{position:fixed; inset:0; background:rgba(19,31,25,.45); z-index:39;}
}
