:root { --sidebar: #173d2e; --surface: #fffefa; --soft: #f8f5ee; }
body { background: radial-gradient(circle at 92% 3%, rgba(237,200,91,.16), transparent 30rem), var(--paper); }
.dashboard-body { min-height: 100vh; }
.admin-sidebar { position: fixed; inset: 0 auto 0 0; z-index: 20; width: 244px; padding: 30px 22px 24px; color: #fff; background: linear-gradient(165deg,#1d4937 0%,#133326 100%); display: flex; flex-direction: column; box-shadow: 14px 0 45px rgba(17,47,35,.08); }
.sidebar-brand { color: #fff; font-size: 18px; gap: 12px; }
.sidebar-brand span { width: 40px; height: 40px; color: var(--green); background: #fff9ea; }
.sidebar-caption { margin: 34px 12px 10px; color: rgba(255,255,255,.45); font-size: 11px; font-weight: 700; letter-spacing: .18em; }
.side-nav { display: grid; gap: 8px; }
.side-nav a { min-height: 52px; padding: 9px 12px; border-radius: 14px; display: grid; grid-template-columns: 32px 1fr auto; gap: 10px; align-items: center; color: rgba(255,255,255,.72); font-weight: 650; transition: .2s ease; }
.side-nav a:hover { color: #fff; background: rgba(255,255,255,.07); }
.side-nav a.active { color: #173d2e; background: #fffaf0; box-shadow: 0 12px 24px rgba(0,0,0,.1); }
.side-nav i { width: 30px; height: 30px; border: 1px solid currentColor; border-radius: 9px; display: grid; place-items: center; font-style: normal; font-size: 12px; opacity: .75; }
.side-nav em { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 99px; display: grid; place-items: center; color: #fff; background: var(--orange); font-size: 11px; font-style: normal; }
.sidebar-footer { margin-top: auto; display: grid; gap: 12px; }
.front-link { min-height: 48px; padding: 0 14px; border: 1px solid rgba(255,255,255,.16); border-radius: 13px; display: flex; align-items: center; justify-content: space-between; color: rgba(255,255,255,.86); font-size: 13px; }
.front-link:hover { border-color: rgba(255,255,255,.4); background: rgba(255,255,255,.06); }
.sidebar-logout { padding: 7px 14px; border: 0; color: rgba(255,255,255,.55); background: transparent; cursor: pointer; font-size: 12px; }
.admin-page { min-height: 100vh; margin-left: 244px; }
.admin-topbar { min-height: 104px; padding: 22px 42px; border-bottom: 1px solid rgba(23,35,29,.09); display: flex; align-items: center; justify-content: space-between; gap: 28px; background: rgba(244,240,232,.83); position: sticky; top: 0; z-index: 10; backdrop-filter: blur(16px); }
.admin-topbar .kicker { margin-bottom: 6px; }
.admin-topbar h1 { margin: 0; font: 500 27px/1.2 Georgia,"Songti SC",serif; }
.top-stats { display: flex; align-items: stretch; gap: 8px; }
.top-stats article { min-width: 94px; padding: 10px 14px; border: 1px solid rgba(23,35,29,.09); border-radius: 13px; background: rgba(255,254,250,.75); }
.top-stats strong { margin-right: 7px; font: 650 19px Georgia,serif; }
.top-stats span { color: var(--muted); font-size: 11px; }
.admin-shell { width: min(1180px,calc(100% - 64px)); max-width: none; margin: 32px auto 72px; }
.notice { margin: 0 0 18px; box-shadow: 0 8px 25px rgba(23,35,29,.04); }
.panel { padding: 30px; border-color: rgba(23,35,29,.1); background: rgba(255,254,250,.94); box-shadow: 0 22px 60px rgba(23,35,29,.055); }
.workspace-panel { min-height: 400px; }
.panel-heading { align-items: center; margin-bottom: 26px; }
.panel-heading h2 { font-size: 30px; }
.section-kicker { margin: 0 0 7px; color: var(--orange); font-size: 10px; font-weight: 800; letter-spacing: .17em; }
.panel-tools { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 12px; }
.add-product-button { display: flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 18px; box-shadow: 0 11px 25px rgba(33,78,59,.18); }
.add-product-button b { font-size: 18px; font-weight: 400; }
.product-table-head { display: grid; grid-template-columns: minmax(260px,1fr) 120px 90px 100px 120px; gap: 18px; padding: 0 18px 12px 86px; color: #8a928d; font-size: 11px; }
.admin-products { gap: 9px; }
.admin-products article { grid-template-columns: 58px minmax(190px,1fr) 120px 90px 100px 120px; gap: 18px; min-height: 82px; padding: 11px 16px; border-color: rgba(23,35,29,.1); background: #fff; transition: transform .18s, border-color .18s, box-shadow .18s; }
.admin-products article:hover { transform: translateY(-1px); border-color: rgba(33,78,59,.25); box-shadow: 0 11px 28px rgba(23,35,29,.055); }
.mini-visual,.mini-image { width: 58px; height: 58px; border-radius: 14px; }
.mini-image { object-fit: cover; }
.admin-products h3 { margin-bottom: 7px; font-size: 15px; }
.admin-products p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-price { font: 600 16px Georgia,"Songti SC",serif; }
.product-stock { color: #445149; font-size: 13px; }
.product-status { display: flex; align-items: center; gap: 7px; width: max-content; font-size: 12px; }
.product-status i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px rgba(32,114,58,.08); }
.admin-products .on { color: #20723a; }
.admin-products .off { color: #999; }
.row-actions { align-items: center; gap: 7px; }
.row-actions a,.row-actions button { min-width: 48px; padding: 7px 10px; border-radius: 9px; text-align: center; text-decoration: none; }
.row-actions a { color: #fff; background: var(--green); }
.row-actions button { color: var(--muted); }
.order-card { padding: 24px; border-color: rgba(23,35,29,.1); background: #fff; transition: transform .2s,box-shadow .2s; }
.order-card:hover { transform: translateY(-2px); box-shadow: 0 16px 38px rgba(23,35,29,.07); }
.admin-dialog { width: min(820px,calc(100% - 28px)); max-height: min(88vh,900px); padding: 0; border: 0; border-radius: 24px; color: var(--ink); background: var(--surface); box-shadow: 0 35px 100px rgba(11,31,23,.3); overflow: hidden; }
.admin-dialog::backdrop { background: rgba(12,28,21,.58); backdrop-filter: blur(4px); }
.dialog-head { padding: 25px 30px 22px; border-bottom: 1px solid var(--line); display: flex; align-items: flex-start; justify-content: space-between; background: linear-gradient(135deg,#fbf8f1,#f4eee2); }
.dialog-head h2 { margin: 0 0 6px; font: 500 28px Georgia,"Songti SC",serif; }
.dialog-head p:last-child { margin: 0; color: var(--muted); font-size: 12px; }
.dialog-close { width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.7); font-size: 24px; line-height: 1; }
.dialog-form { max-height: calc(88vh - 112px); padding: 26px 30px 30px; overflow-y: auto; grid-template-columns: 1fr; }
.product-form input,.product-form textarea,.stack input { min-height: 44px; border-color: rgba(23,35,29,.16); transition: border-color .2s,box-shadow .2s; }
.product-form textarea { line-height: 1.65; resize: vertical; }
.product-form input:focus,.product-form textarea:focus,.stack input:focus { outline: 0; border-color: var(--green); box-shadow: 0 0 0 3px rgba(33,78,59,.1); }
.product-form input[type=color] { min-height: 46px; padding: 5px; }
.upload-field { padding: 14px; border: 1px dashed rgba(33,78,59,.25); border-radius: 13px; background: #f9faf7; }
.upload-field small { color: var(--muted); font-weight: 400; }
.dialog-actions { margin: 4px -30px -30px; padding: 18px 30px; border-top: 1px solid var(--line); display: flex; justify-content: flex-end; gap: 10px; background: var(--soft); position: sticky; bottom: -30px; }
.dialog-actions .primary { min-width: 120px; font-weight: 750; box-shadow: 0 10px 24px rgba(33,78,59,.16); }
.cancel-button { min-width: 80px; padding: 13px 20px; border: 1px solid var(--line); border-radius: 999px; text-align: center; background: #fff; }
.login-card { padding: 46px; border-color: rgba(23,35,29,.1); box-shadow: 0 34px 90px rgba(23,35,29,.12); }
.login-card .primary { width: 100%; }
@media(max-width:1100px){.product-table-head{display:none}.admin-products article{grid-template-columns:58px minmax(170px,1fr) 100px 80px 110px}.product-stock{display:none}.admin-products article .row-actions{justify-self:end}}
@media(max-width:800px){.admin-sidebar{position:static;width:100%;padding:14px 16px;display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center}.sidebar-brand b,.sidebar-caption,.sidebar-footer form{display:none}.sidebar-brand span{width:36px;height:36px}.side-nav{display:flex;gap:6px}.side-nav a{min-height:42px;padding:6px 11px;grid-template-columns:auto auto auto}.side-nav i{display:none}.sidebar-footer{margin:0}.front-link{min-height:40px;padding:0 11px}.front-link span{display:none}.admin-page{margin-left:0}.admin-topbar{min-height:92px;padding:18px;position:static}.top-stats article{min-width:0;padding:8px 10px}.top-stats span{display:none}.admin-shell{width:calc(100% - 24px);margin:18px auto 50px}.panel{padding:20px;border-radius:19px}.panel-heading{align-items:flex-start;flex-direction:column}.panel-tools{width:100%;justify-content:space-between}.admin-products article{grid-template-columns:52px 1fr auto;gap:12px}.mini-visual,.mini-image{width:52px;height:52px}.product-price{font-size:14px}.product-status{grid-column:2}.admin-products article .row-actions{grid-column:3;grid-row:1/3;flex-direction:column}.dialog-head{padding:22px 20px}.dialog-form{padding:22px 20px 26px}.dialog-actions{margin:4px -20px -26px;padding:16px 20px;bottom:-26px}.three{grid-template-columns:1fr 1fr}.login-card{padding:34px 24px}}
@media(max-width:520px){.admin-topbar{align-items:flex-start}.admin-topbar h1{font-size:24px}.top-stats article:not(:first-child){display:none}.side-nav a{font-size:12px}.panel-heading h2{font-size:26px}.add-product-button{min-height:40px}.admin-products article{grid-template-columns:48px 1fr}.mini-visual,.mini-image{width:48px;height:48px}.product-price{grid-column:2}.product-status{grid-column:2}.admin-products article .row-actions{grid-column:2;grid-row:auto;justify-self:start;flex-direction:row}.two,.three{grid-template-columns:1fr}.check{margin-top:0}.dialog-actions .primary{min-width:100px}}
