:root{
  --bg:#F0F3F1; --panel:#FFFFFF; --ink:#16241F; --ink-soft:#4C5A54;
  --line:#D7DEDA; --teal:#1F6F5C; --teal-dark:#154E41; --marigold:#E29A2E; --marigold-dark:#B87A1E;
  --danger:#B4432F; --radius:10px;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#141B18; --panel:#1C2622; --ink:#EDF2EF; --ink-soft:#A9B6B0; --line:#2C3733;
  }
}
html{scroll-padding-top:env(safe-area-inset-top,0px); height:100%;}
*{box-sizing:border-box;}
body{margin:0; min-height:100%; background:var(--bg); color:var(--ink); font-family:'Inter',system-ui,-apple-system,sans-serif; line-height:1.5;}
h1,h2,h3{font-family:Georgia,'Zilla Slab',serif; margin:0 0 .35em; font-weight:600;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1000px; margin:0 auto; padding:0 20px 60px;}
.wrap.narrow{max-width:440px;}
.inline{display:inline;}

/* Header */
.site-header{border-bottom:1px solid var(--line); background:var(--panel); padding:calc(14px + env(safe-area-inset-top,0px)) 20px 14px;}
.topbar{max-width:1000px; margin:0 auto; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;}
.topbar-left{display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.logo{font-size:1.4rem; font-weight:700; white-space:nowrap;}
.logo span{color:var(--marigold-dark);}
.mainnav{display:flex; gap:16px; align-items:center; font-weight:600; font-size:.92rem; flex-wrap:wrap;}
.mainnav a, .mainnav button.link{color:var(--ink-soft);}

/* Location bar — state + city, right after the logo */
.location-bar{display:flex; gap:6px; align-items:center; flex-wrap:wrap;}
.location-bar select, .location-bar input{width:auto; padding:6px 9px; font-size:.82rem;}
.location-bar input[type="text"]{width:110px;}
@media (max-width:720px){
  .topbar{flex-direction:column; align-items:stretch;}
  .topbar-left{flex-direction:column; align-items:center;}
  .mainnav{justify-content:center;}
}

.site-footer{color:var(--ink-soft); font-size:.8rem; text-align:center; padding:24px 0;}

/* Hero */
.hero{padding:28px 20px 16px; margin:0 -20px 0;}
.hero .lead{color:var(--ink-soft);}

/* Filters */
.filters{margin:14px 0 22px;}
.chips{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:10px;}
.chips.small{margin-bottom:14px;}
.chip{border:1px solid var(--line); background:var(--panel); padding:6px 13px; border-radius:999px; font-size:.85rem; color:var(--ink-soft);}
.chip.active{background:var(--teal); border-color:var(--teal); color:#fff;}
.chip.small{padding:3px 10px; font-size:.75rem; display:inline-flex; align-items:center;}
.tag-chip{display:inline-flex; align-items:center; gap:5px;}
.tag-chip img{width:16px; height:16px; border-radius:4px; object-fit:cover;}
.tag-thumb{width:16px; height:16px; border-radius:4px; object-fit:cover; vertical-align:-3px; margin-right:2px;}
.row2{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px;}
@media (max-width:520px){.row2{grid-template-columns:1fr;}}
input,select,textarea{font:inherit; padding:9px 11px; border:1px solid var(--line); border-radius:7px; background:var(--bg); color:var(--ink); width:100%;}
textarea{min-height:80px; resize:vertical;}
.checkbox-field{display:flex; align-items:center; gap:8px; font-size:.88rem; margin-bottom:12px;}
.checkbox-field input{width:auto;}
.checkbox-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:4px 14px; margin:10px 0 18px; max-height:260px; overflow-y:auto; border:1px solid var(--line); border-radius:8px; padding:12px;}
.checkbox-grid .checkbox-field{margin-bottom:6px;}
.states-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));}

/* Buttons */
button.btn, a.btn{font:inherit; font-weight:600; border:none; border-radius:8px; padding:10px 18px; cursor:pointer; background:var(--teal); color:#fff; display:inline-block; font-size:.9rem;}
.btn.small{padding:7px 13px; font-size:.85rem;}
.btn.secondary{background:transparent; color:var(--teal-dark); border:1px solid var(--teal);}
.btn.secondary.danger{color:var(--danger); border-color:var(--danger);}
.btn.gold{background:var(--marigold); color:#2a1c04;}
button.link, a.link{background:none; border:none; color:var(--teal-dark); font:inherit; font-weight:600; cursor:pointer; padding:0; font-size:.85rem; text-decoration:none;}
button.link.danger, a.link.danger{color:var(--danger);}

/* Cards / grid */
.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:14px;}
.card{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; position:relative; display:flex; flex-direction:column;}
.card.featured{border-color:var(--marigold); box-shadow:0 0 0 1px var(--marigold);}
.badge{position:absolute; top:10px; left:10px; z-index:2; background:var(--marigold); color:#2a1c04; font-size:.68rem; font-weight:700; padding:3px 9px; border-radius:999px;}
.card .thumb{width:100%; height:150px; object-fit:cover; background:var(--bg);}
.thumb.placeholder{display:flex; align-items:center; justify-content:center; font-size:2.2rem;}
.card-body{padding:12px 14px 16px; display:flex; flex-direction:column; gap:4px;}
.meta{font-size:.78rem; color:var(--ink-soft);}
.price{font-weight:700; font-size:1.05rem; color:var(--teal-dark);}
.price.big{font-size:1.5rem; margin:4px 0;}
.rating{font-size:.82rem; color:var(--marigold-dark); font-weight:600;}
.empty{color:var(--ink-soft); text-align:center; padding:40px 0;}
.badges{display:flex; gap:6px; flex-wrap:wrap; margin:4px 0;}
.card-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; font-size:.82rem;}
.account-links{display:flex; gap:10px; justify-content:flex-end; margin:14px 0;}

/* Panels & forms */
.panel{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:22px; margin:18px 0;}
.field{display:flex; flex-direction:column; gap:5px; margin-bottom:12px;}
.field label{font-size:.82rem; font-weight:600; color:var(--ink-soft);}
.error{color:var(--danger); font-weight:600; font-size:.88rem;}
.status-pill{display:inline-block; font-size:.78rem; font-weight:600; padding:4px 11px; border-radius:999px; margin-bottom:14px;}
.status-pill.free{background:#DCEEE7; color:var(--teal-dark);}
.status-pill.paid{background:#F4E3C6; color:var(--marigold-dark);}
.status-pill.preview{background:#E4E9FF; color:#33409E;}
.edit-thumbs{display:flex; gap:10px; flex-wrap:wrap; margin:8px 0;}
.edit-thumb{display:flex; flex-direction:column; align-items:center; gap:4px; font-size:.75rem;}
.edit-thumb img{width:80px; height:80px; object-fit:cover; border-radius:8px; border:1px solid var(--line);}

/* Listing detail */
.listing-detail .gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:8px; margin-bottom:16px;}
.listing-detail .gallery img{width:100%; height:150px; object-fit:cover; border-radius:8px;}
.actions{display:flex; gap:10px; flex-wrap:wrap; margin:16px 0;}
.reviews{margin-top:30px; border-top:1px solid var(--line); padding-top:20px;}
.review{border-bottom:1px solid var(--line); padding:10px 0; font-size:.9rem;}
.review-form{max-width:420px;}

/* Payment */
.paybox{border:1px dashed var(--marigold); border-radius:var(--radius); padding:20px; background:var(--bg); margin-top:10px;}
.qr{width:200px; height:200px; border-radius:6px; background:#fff;}
.upi-link{display:block; word-break:break-all; font-size:.78rem; background:var(--panel); border:1px solid var(--line); padding:8px 10px; border-radius:6px; margin:8px 0;}

/* Admin */
body.admin{background:var(--bg);}
.admin-shell{display:flex; min-height:100vh;}
.admin-side{width:200px; background:var(--panel); border-right:1px solid var(--line); padding:20px 16px; display:flex; flex-direction:column; gap:18px; flex-shrink:0;}
.admin-side nav{display:flex; flex-direction:column; gap:10px; font-weight:600; font-size:.9rem; color:var(--ink-soft);}
.admin-main{flex:1; padding:24px 28px; overflow-x:auto;}
.stat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:12px; margin:16px 0 26px;}
.stat{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:16px; text-align:center;}
.stat-num{font-size:1.6rem; font-weight:700; color:var(--teal-dark);}
.stat-label{font-size:.8rem; color:var(--ink-soft);}
.admin-table{width:100%; border-collapse:collapse; background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; font-size:.88rem;}
.admin-table th, .admin-table td{padding:9px 12px; border-bottom:1px solid var(--line); text-align:left;}
.actions-cell{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.tag-status{font-size:.75rem; font-weight:700; padding:2px 8px; border-radius:999px; background:var(--line);}
.tag-status.published{background:#DCEEE7; color:var(--teal-dark);}
.tag-status.pending_approval, .tag-status.pending_payment{background:#F4E3C6; color:var(--marigold-dark);}
.tag-status.rejected, .tag-status.removed{background:#F3D9D3; color:var(--danger);}
.tag-status.unpublished{background:var(--line); color:var(--ink-soft);}

/* Mobile bottom nav — hidden on desktop, fixed + auto-hiding on mobile */
.bottom-nav{display:none;}
@media (max-width:720px){
  main.has-bottom-nav{padding-bottom:70px;}
  .bottom-nav{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:50;
    background:var(--panel); border-top:1px solid var(--line);
    padding:8px 6px calc(8px + env(safe-area-inset-bottom,0px));
    transition:transform .25s ease;
  }
  .bottom-nav.bn-hidden{transform:translateY(100%);}
  .bottom-nav a{flex:1; display:flex; flex-direction:column; align-items:center; gap:2px; font-size:.68rem; color:var(--ink-soft); font-weight:600;}
  .bottom-nav a.active{color:var(--teal-dark);}
  .bottom-nav .bn-icon{font-size:1.3rem;}
  .bottom-nav .bn-create{color:#fff;}
  .bottom-nav .bn-create .bn-icon{background:var(--marigold); color:#2a1c04; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1rem;}
  body.admin .bottom-nav{display:none;}
}