/* ==================== Classical Hetianyu Jade Theme ==================== */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600;700&display=swap');

*{margin:0;padding:0;box-sizing:border-box;}
:root{
    --ink:#1a1a1a;--ink-light:#333;--ink-muted:#666;
    --jade-deep:#1B4332;--jade-mid:#2D6A4F;--jade-soft:#40916C;--jade-pale:#D8F3DC;
    --gold:#C9A227;--gold-light:#E8D5B7;--gold-pale:#F5EFE0;
    --cinnabar:#9B2335;--cinnabar-light:#C0392B;
    --paper:#FDFCF8;--paper-warm:#F5F0E8;--paper-cool:#F0EDE5;
    --wood:#5C4033;--wood-light:#8B6914;
    --border:#D4CFC5;--border-light:#E8E4DB;
    --shadow:0 2px 8px rgba(0,0,0,.06);--shadow-lg:0 4px 20px rgba(0,0,0,.1);
    --radius:6px;--radius-sm:3px;
}
body{font-family:"Noto Serif SC","Microsoft YaHei","PingFang SC",serif;background:var(--paper);color:var(--ink);line-height:1.8;font-size:18px;}
a{color:var(--wood);text-decoration:none;transition:color .3s;}
a:hover{color:var(--jade-mid);}
img{max-width:100%;vertical-align:middle;}
ul,ol{list-style:none;}
input,select,textarea,button{font-family:inherit;}
.container{max-width:1200px;margin:0 auto;padding:0 20px;}

/* ==================== Top Bar (古典细条) ==================== */
.top-bar{background:var(--jade-deep);color:var(--gold-light);font-size:16px;line-height:34px;letter-spacing:.5px;}
.top-bar .container{display:flex;justify-content:space-between;align-items:center;}
.top-bar a{color:var(--gold-light);margin:0 6px;opacity:.85;}
.top-bar a:hover{color:#fff;opacity:1;}
.top-bar .sep{color:rgba(255,255,255,.2);margin:0 4px;}

/* ==================== Header (古典Logo+搜索) ==================== */
.header{background:var(--paper);border-bottom:1px solid var(--border-light);position:sticky;top:0;z-index:100;box-shadow:var(--shadow);}
.header .container{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;}
.header .logo{flex-shrink:0;display:flex;align-items:center;gap:10px;}
.header .logo .logo-mark{width:44px;height:44px;background:linear-gradient(135deg,var(--jade-deep),var(--jade-mid));border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--gold);font-size:20px;font-weight:bold;border:2px solid var(--gold);}
.header .logo span{font-size:22px;font-weight:700;color:var(--jade-deep);letter-spacing:2px;font-family:"Noto Serif SC",serif;}
.header .logo small{display:block;font-size:16px;color:var(--gold);letter-spacing:4px;font-weight:400;margin-top:-4px;}
.search-box{flex:1;max-width:480px;margin:0 30px;display:flex;position:relative;}
.search-box input{flex:1;height:40px;padding:0 16px;border:1px solid var(--border);border-right:none;border-radius:20px 0 0 20px;font-size:16px;outline:none;background:var(--paper-warm);}
.search-box input:focus{border-color:var(--jade-soft);}
.search-box select{width:80px;height:40px;border:1px solid var(--border);border-left:none;border-right:none;background:var(--paper-warm);font-size:16px;outline:none;color:var(--ink-muted);cursor:pointer;}
.search-box button{height:40px;padding:0 24px;background:var(--jade-deep);color:var(--gold-light);border:none;border-radius:0 20px 20px 0;font-size:18px;cursor:pointer;letter-spacing:2px;}
.search-box button:hover{background:var(--jade-mid);}
.header .actions{display:flex;align-items:center;gap:20px;flex-shrink:0;}
.header .actions a{display:flex;flex-direction:column;align-items:center;color:var(--ink-muted);font-size:16px;transition:color .3s;position:relative;}
.header .actions a .icon{font-size:18px;margin-bottom:2px;}
.header .actions a:hover{color:var(--jade-deep);}
.cart-badge .num{position:absolute;top:-4px;right:-6px;background:var(--cinnabar);color:#fff;font-size:10px;min-width:16px;height:16px;line-height:16px;text-align:center;border-radius:50%;padding:0 4px;}

/* ==================== Main Nav (古典导航) ==================== */
.main-nav{background:var(--jade-deep);border-top:1px solid rgba(255,255,255,.08);}
.main-nav .container{display:flex;align-items:center;}
.main-nav .category-all{position:relative;width:220px;flex-shrink:0;}
.main-nav .category-all>a{display:block;padding:12px 20px;color:var(--gold-light);font-size:18px;font-weight:500;background:rgba(0,0,0,.15);letter-spacing:1px;}
.main-nav .category-all>a .icon{margin-right:8px;}
.main-nav .category-menu{position:absolute;left:0;top:100%;width:100%;background:var(--paper);box-shadow:var(--shadow-lg);border-radius:0 0 var(--radius) var(--radius);display:none;z-index:99;border:1px solid var(--border-light);border-top:none;}
.main-nav .category-all:hover .category-menu{display:block;}
.category-menu li{position:relative;}
.category-menu li>a{display:flex;align-items:center;justify-content:space-between;padding:11px 18px;color:var(--ink-light);font-size:16px;border-bottom:1px solid var(--border-light);transition:all .2s;}
.category-menu li>a:hover{background:var(--jade-pale);color:var(--jade-deep);}
.category-menu li>a .arrow{color:var(--ink-muted);font-size:16px;}
.category-menu .sub-menu{position:absolute;left:100%;top:0;width:480px;min-height:100%;background:var(--paper);box-shadow:var(--shadow-lg);padding:16px;display:none;z-index:100;border:1px solid var(--border-light);border-left:none;}
.category-menu li:hover .sub-menu{display:block;}
.sub-menu h4{color:var(--jade-deep);font-size:16px;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--border-light);font-weight:600;}
.sub-menu .sub-links{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.sub-menu .sub-links a{padding:3px 10px;background:var(--paper-warm);border-radius:var(--radius-sm);font-size:16px;color:var(--ink-muted);border:1px solid var(--border-light);}
.sub-menu .sub-links a:hover{background:var(--jade-pale);color:var(--jade-deep);border-color:var(--jade-soft);}
.main-nav .nav-links{display:flex;align-items:center;padding-left:15px;}
.main-nav .nav-links a{color:rgba(255,255,255,.7);padding:12px 18px;font-size:16px;letter-spacing:1px;transition:all .3s;}
.main-nav .nav-links a:hover,.main-nav .nav-links a.active{color:var(--gold);}

/* ==================== Banner (古典轮播) ==================== */
.banner-section{padding:20px 0;background:var(--paper-warm);}
.banner-section .container{display:flex;gap:15px;height:380px;}
.banner-slider{flex:1;position:relative;overflow:hidden;border-radius:var(--radius);border:1px solid var(--border-light);}
.banner-slider .slides{display:flex;transition:transform .6s ease;height:100%;}
.banner-slider .slide{min-width:100%;height:100%;background:linear-gradient(135deg,var(--jade-deep),var(--jade-mid));display:flex;align-items:center;justify-content:center;color:#fff;}
.banner-slider .dots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:6px;}
.banner-slider .dots span{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.4);cursor:pointer;}
.banner-slider .dots span.active{background:var(--gold);}
.banner-slider .arrow{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;background:rgba(0,0,0,.2);color:#fff;border:none;border-radius:50%;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .3s;}
.banner-slider .arrow:hover{background:rgba(0,0,0,.4);}
.banner-slider .arrow.left{left:10px;}
.banner-slider .arrow.right{right:10px;}
.banner-side{width:220px;display:flex;flex-direction:column;gap:12px;}
.banner-side .side-item{flex:1;background:var(--jade-deep);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:var(--gold-light);font-size:15px;overflow:hidden;border:1px solid var(--border-light);position:relative;}
.banner-side .side-item::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");}
.banner-side .side-item a{color:var(--gold-light);text-align:center;position:relative;z-index:1;}
.banner-side .side-item a div:first-child{font-size:18px;font-weight:600;letter-spacing:2px;}
.banner-side .side-item a div:last-child{font-size:16px;opacity:.7;margin-top:4px;}

/* 推荐店铺广告网格 */
.ads-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.ads-grid .ad-item{cursor:pointer;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/1;background:var(--paper-cool);}
.ads-grid .ad-item img{width:100%;height:100%;object-fit:cover;transition:transform .3s;}
.ads-grid .ad-item:hover img{transform:scale(1.05);}

/* ==================== Section ==================== */
.section{padding:30px 0;}
.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
.section-title h2{font-size:18px;color:var(--jade-deep);position:relative;padding-left:14px;font-weight:600;letter-spacing:1px;}
.section-title h2::before{content:'';position:absolute;left:0;top:6px;width:3px;height:16px;background:var(--gold);border-radius:2px;}
.section-title .more{color:var(--ink-muted);font-size:16px;}
.section-title .more:hover{color:var(--jade-deep);}

/* ==================== Product Card (古典卡片) ==================== */
.product-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.product-card{background:var(--paper);border-radius:var(--radius);overflow:hidden;transition:all .35s;cursor:pointer;position:relative;border:1px solid var(--border-light);}
.product-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--jade-pale);}
.product-card .img-wrap{position:relative;padding-top:100%;overflow:hidden;background:var(--paper-cool);}
.product-card .img-wrap img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.product-card:hover .img-wrap img{transform:scale(1.04);}
.product-card .tags{position:absolute;top:6px;left:6px;display:flex;flex-direction:column;gap:3px;}
.product-card .tags span{padding:2px 7px;border-radius:var(--radius-sm);font-size:10px;color:#fff;letter-spacing:1px;}
.tag-hot{background:var(--cinnabar);}
.tag-new{background:var(--jade-mid);}
.tag-seckill{background:var(--wood-light);}
.product-card .info{padding:10px 12px 12px;}
.product-card .name{font-size:16px;line-height:1.5;height:38px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:6px;color:var(--ink-light);}
.product-card .price-row{display:flex;align-items:baseline;gap:6px;justify-content:space-between;}
.product-card .price{font-size:16px;font-weight:700;color:var(--cinnabar);font-family:Georgia,serif;}
.product-card .price .unit{font-size:16px;font-weight:400;}
.product-card .price-old{font-size:16px;color:var(--ink-muted);text-decoration:line-through;}
.product-card .price-row .rating{font-size:16px;color:var(--ink-muted);white-space:nowrap;}
.product-card .meta{display:flex;gap:12px;font-size:16px;color:var(--ink-muted);margin-top:6px;}
.product-card .shop{font-size:16px;color:var(--wood);margin-top:4px;display:flex;justify-content:space-between;align-items:center;}
.product-card .shop .shop-count{font-size:16px;color:var(--ink-muted);}

/* ==================== Alert / Notice ==================== */
.alert{padding:10px 16px;border-radius:var(--radius);font-size:16px;margin-bottom:12px;}
.alert-info{background:var(--jade-pale);color:var(--jade-deep);border:1px solid #B7E4C7;}
.alert-success{background:#E8F5E9;color:var(--jade-mid);border:1px solid #A5D6A7;}
.alert-danger{background:#FFEBEE;color:var(--cinnabar);border:1px solid #EF9A9A;}

/* ==================== Card ==================== */
.card{background:var(--paper);border-radius:var(--radius);border:1px solid var(--border-light);overflow:hidden;}
.card-body{padding:16px;}

/* ==================== Page Header ==================== */
.page-header{background:var(--paper);border-bottom:1px solid var(--border-light);padding:10px 0;}
.breadcrumb{font-size:16px;color:var(--ink-muted);}
.breadcrumb a{color:var(--ink-muted);}
.breadcrumb a:hover{color:var(--jade-deep);}
.breadcrumb span{color:var(--border);margin:0 4px;}

/* ==================== Buttons ==================== */
.btn{display:inline-block;padding:8px 20px;border-radius:var(--radius);font-size:16px;cursor:pointer;border:none;text-align:center;transition:all .3s;letter-spacing:1px;}
.btn-primary{background:var(--jade-deep);color:var(--gold-light);}
.btn-primary:hover{background:var(--jade-mid);color:#fff;}
.btn-danger{background:var(--cinnabar);color:#fff;}
.btn-danger:hover{background:var(--cinnabar-light);}
.btn-outline{border:1px solid var(--jade-deep);color:var(--jade-deep);background:transparent;}
.btn-outline:hover{background:var(--jade-deep);color:var(--gold-light);}
.btn-sm{padding:5px 12px;font-size:16px;}
.btn-lg{padding:12px 32px;font-size:15px;}
.btn-block{display:block;width:100%;}

/* ==================== Form ==================== */
.form-group{margin-bottom:14px;}
.form-group label{display:block;margin-bottom:5px;color:var(--ink-light);font-weight:500;font-size:16px;}
.form-group .required::after{content:' *';color:var(--cinnabar);}
.form-control{width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);font-size:16px;transition:border-color .3s;outline:none;background:var(--paper);}
.form-control:focus{border-color:var(--jade-soft);}
select.form-control{cursor:pointer;}
textarea.form-control{resize:vertical;min-height:80px;}
.form-inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.form-row{display:flex;gap:12px;flex-wrap:wrap;}
.form-row .form-group{flex:1;min-width:120px;}

/* ==================== Pagination ==================== */
.pagination{display:flex;justify-content:center;align-items:center;gap:3px;padding:24px 0;}
.pagination a,.pagination span{padding:6px 12px;border:1px solid var(--border-light);border-radius:var(--radius-sm);font-size:16px;color:var(--ink-light);background:var(--paper);}
.pagination a:hover{border-color:var(--jade-deep);color:var(--jade-deep);}
.pagination .current{background:var(--jade-deep);color:var(--gold-light);border-color:var(--jade-deep);}
.pagination .total{color:var(--ink-muted);margin-left:8px;font-size:16px;border:none;background:transparent;}

/* ==================== Footer (古典页脚) ==================== */
.footer{background:var(--jade-deep);color:rgba(255,255,255,.5);margin-top:40px;border-top:3px solid var(--gold);}
.footer-links{display:flex;padding:40px 0 30px;border-bottom:1px solid rgba(255,255,255,.06);}
.footer-links .col{flex:1;min-width:140px;text-align:center;}
.footer-links h4{color:var(--gold-light);font-size:16px;margin-bottom:12px;font-weight:500;letter-spacing:2px;}
.footer-links a{display:block;color:rgba(255,255,255,.45);font-size:16px;padding:3px 0;transition:color .3s;}
.footer-links a:hover{color:var(--gold);}
.footer-info{text-align:center;padding:20px 0;font-size:16px;line-height:2;color:rgba(255,255,255,.35);}
.footer-info a{color:rgba(255,255,255,.4);margin:0 6px;}
.footer-info a:hover{color:var(--gold);}

/* ==================== Auth Page ==================== */
.auth-page{min-height:100vh;background:linear-gradient(135deg,var(--jade-deep),var(--jade-mid));display:flex;align-items:center;justify-content:center;padding:20px;}
.auth-box{background:var(--paper);border-radius:var(--radius);width:400px;max-width:100%;padding:36px;box-shadow:var(--shadow-lg);border:1px solid var(--border-light);}
.auth-box h2{text-align:center;color:var(--jade-deep);margin-bottom:6px;font-size:20px;letter-spacing:2px;}
.auth-box .sub{text-align:center;color:var(--ink-muted);margin-bottom:24px;font-size:16px;}
.auth-box .switch{text-align:center;margin-top:14px;font-size:16px;}
.auth-box .switch a{color:var(--jade-deep);font-weight:500;}

/* ==================== Product / Auction Detail Gallery (Magnifier) ==================== */
.product-detail .gallery-wrapper,
.auction-detail .gallery-wrapper{display:flex;gap:12px;min-width:420px;}
.product-detail .gallery-wrapper .thumbs,
.auction-detail .gallery-wrapper .thumbs{width:72px;display:flex;flex-direction:column;gap:6px;flex-shrink:0;}
.product-detail .gallery-wrapper .thumbs img,
.auction-detail .gallery-wrapper .thumbs img{width:100%;aspect-ratio:1;object-fit:cover;border:1px solid var(--border-light);border-radius:var(--radius-sm);cursor:pointer;}
.product-detail .gallery-wrapper .thumbs img.active,
.auction-detail .gallery-wrapper .thumbs img.active{border-color:var(--jade-deep);}
.product-detail .magnifier-stage,
.auction-detail .magnifier-stage{position:relative;flex-shrink:0;}
.product-detail .magnifier-box,
.auction-detail .magnifier-box{position:relative;width:420px;height:420px;border:1px solid var(--border-light);border-radius:var(--radius);overflow:hidden;cursor:crosshair;flex-shrink:0;}
.product-detail .magnifier-box .main-img,
.auction-detail .magnifier-box .main-img{width:100%;height:100%;object-fit:contain;display:block;background:#fafafa;}
.product-detail .magnifier-lens,
.auction-detail .magnifier-lens{position:absolute;top:0;left:0;width:180px;height:180px;border:2px solid rgba(0,0,0,.3);background:rgba(255,255,255,.15);pointer-events:none;display:none;z-index:10;}
.product-detail .magnifier-zoom,
.auction-detail .magnifier-zoom{position:absolute;left:calc(100% + 12px);top:0;width:420px;height:420px;border:1px solid var(--border-light);border-radius:var(--radius);overflow:hidden;visibility:hidden;background:#fff;z-index:50;box-shadow:0 4px 20px rgba(0,0,0,.12);}
.product-detail .magnifier-zoom.visible,
.auction-detail .magnifier-zoom.visible{visibility:visible;}
.product-detail .magnifier-zoom img,
.auction-detail .magnifier-zoom img{display:block;max-width:none;}
@media (max-width:960px){
    .product-detail .gallery-wrapper,
    .auction-detail .gallery-wrapper{flex-wrap:wrap;min-width:auto;}
    .product-detail .magnifier-box,
    .auction-detail .magnifier-box{width:100%;height:auto;aspect-ratio:1;}
    .product-detail .magnifier-zoom,
    .auction-detail .magnifier-zoom{display:none!important;}
}
.product-detail .info{flex:1;}
.product-detail .info .name{font-size:20px;font-weight:600;margin-bottom:6px;color:var(--ink);letter-spacing:.5px;}
.product-detail .info .subtitle{color:var(--ink-muted);margin-bottom:12px;font-size:16px;}
.product-detail .info .price-area{background:var(--paper-warm);padding:14px;border-radius:var(--radius);margin-bottom:14px;border:1px solid var(--border-light);}
.product-detail .info .price-area .price{font-size:26px;font-weight:700;color:var(--cinnabar);font-family:Georgia,serif;}
.product-detail .info .price-area .price .unit{font-size:18px;}
.product-detail .info .price-area .price-old{font-size:16px;color:var(--ink-muted);text-decoration:line-through;margin-left:8px;}
.product-detail .info .meta-item{display:flex;margin-bottom:6px;font-size:16px;}
.product-detail .info .meta-item .label{color:var(--ink-muted);width:56px;flex-shrink:0;}
.spec-section{margin-top:12px;}
.spec-section h4{font-size:16px;margin-bottom:6px;}
.spec-items{display:flex;flex-wrap:wrap;gap:6px;}
.spec-items span{padding:5px 14px;border:1px solid var(--border-light);border-radius:var(--radius-sm);cursor:pointer;font-size:16px;background:var(--paper);}
.spec-items span.active{border-color:var(--jade-deep);color:var(--jade-deep);background:var(--jade-pale);}
.quantity-ctrl{display:flex;align-items:center;gap:0;}
.quantity-ctrl input{width:50px;text-align:center;border:1px solid var(--border-light);height:32px;font-size:16px;}
.quantity-ctrl button{width:32px;height:32px;border:1px solid var(--border-light);background:var(--paper-warm);cursor:pointer;font-size:18px;}
.buy-actions{margin-top:18px;display:flex;gap:10px;}
.buy-actions .btn{flex:1;}

/* ==================== Shop Page ==================== */
.shop-header{background:var(--paper);padding:18px 0;border-bottom:1px solid var(--border-light);}
.shop-header .shop-info{display:flex;gap:16px;align-items:center;}
.shop-header .shop-logo{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid var(--gold);}
.shop-header .shop-name{font-size:18px;font-weight:600;}
.shop-header .shop-scores{display:flex;gap:24px;margin-top:6px;font-size:16px;}
.shop-header .shop-scores .score-item{text-align:center;}
.shop-header .shop-scores .score{font-size:16px;color:var(--cinnabar);font-weight:700;}
.shop-header .shop-actions{display:flex;gap:8px;align-items:center;margin-top:8px;}

/* ==================== Cart ==================== */
.cart-table{width:100%;background:var(--paper);border-radius:var(--radius);overflow:hidden;border:1px solid var(--border-light);}
.cart-table th{background:var(--paper-warm);padding:10px;text-align:left;font-size:16px;font-weight:500;border-bottom:1px solid var(--border-light);}
.cart-table td{padding:10px;border-bottom:1px solid var(--border-light);vertical-align:middle;}
.cart-table .check-col{width:36px;text-align:center;}
.cart-table .img-col{width:90px;}
.cart-table .img-col img{width:70px;height:70px;object-fit:cover;border-radius:var(--radius-sm);border:1px solid var(--border-light);}
.cart-table .name-col{min-width:180px;font-size:16px;}
.cart-table .qty-col{width:120px;}

/* ==================== Checkout ==================== */
.checkout-page{padding:16px 0;}
.checkout-page .section-box{background:var(--paper);border-radius:var(--radius);padding:16px;margin-bottom:12px;border:1px solid var(--border-light);}
.checkout-page .section-box h3{font-size:18px;margin-bottom:10px;padding-bottom:6px;border-bottom:1px solid var(--border-light);color:var(--jade-deep);}
.address-list{display:flex;flex-wrap:wrap;gap:10px;}
.address-card{width:calc(33.333% - 7px);padding:12px;border:1px solid var(--border-light);border-radius:var(--radius);cursor:pointer;font-size:16px;position:relative;background:var(--paper);}
.address-card.active{border-color:var(--jade-deep);background:var(--jade-pale);}
.address-card .addr-name{font-weight:600;margin-bottom:3px;}
.address-card .addr-mobile{color:var(--ink-muted);float:right;}

/* ==================== User Center ==================== */
.user-layout{display:flex;gap:16px;padding:16px 0;}
.user-sidebar{width:180px;flex-shrink:0;background:var(--paper);border-radius:var(--radius);overflow:hidden;border:1px solid var(--border-light);}
.user-sidebar .avatar-area{padding:18px;text-align:center;border-bottom:1px solid var(--border-light);}
.user-sidebar .avatar-area img{width:52px;height:52px;border-radius:50%;margin-bottom:6px;border:2px solid var(--gold);}
.user-sidebar .avatar-area .uname{font-weight:600;font-size:18px;}
.user-sidebar .menu a{display:block;padding:10px 16px;font-size:16px;color:var(--ink-light);border-left:2px solid transparent;transition:all .2s;}
.user-sidebar .menu a:hover,.user-sidebar .menu a.active{background:var(--jade-pale);color:var(--jade-deep);border-left-color:var(--jade-deep);}
.user-main{flex:1;background:var(--paper);border-radius:var(--radius);padding:20px;min-height:480px;border:1px solid var(--border-light);}

/* ==================== Table ==================== */
.data-table{width:100%;border-collapse:collapse;font-size:16px;}
.data-table th{background:var(--paper-warm);padding:10px 12px;text-align:left;font-weight:500;border-bottom:1px solid var(--border);white-space:nowrap;color:var(--ink-light);}
.data-table td{padding:10px 12px;border-bottom:1px solid var(--border-light);}
.data-table tr:hover td{background:#faf9f7;}
.data-table .status{display:inline-block;padding:2px 8px;border-radius:10px;font-size:16px;}
.status-pending{background:#FFF3E0;color:var(--wood-light);}
.status-paid{background:#E8F5E9;color:var(--jade-mid);}
.status-shipped{background:#E3F2FD;color:#1565C0;}
.status-done{background:#F3E5F5;color:#6A1B9A;}
.status-cancelled{background:#EEEEEE;color:#757575;}

/* ==================== Tab Nav ==================== */
.tab-nav{display:flex;border-bottom:1px solid var(--border-light);margin-bottom:16px;}
.tab-nav a{padding:10px 18px;font-size:16px;color:var(--ink-muted);border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .3s;}
.tab-nav a:hover{color:var(--jade-deep);}
.tab-nav a.active{color:var(--jade-deep);border-bottom-color:var(--jade-deep);font-weight:500;}

/* ==================== Dashboard ==================== */
.dashboard-layout{display:flex;min-height:100vh;}
.dashboard-sidebar{width:200px;background:var(--jade-deep);color:rgba(255,255,255,.4);flex-shrink:0;}
.dashboard-sidebar .logo{padding:18px;text-align:center;border-bottom:1px solid rgba(255,255,255,.06);}
.dashboard-sidebar .logo h2{color:var(--gold-light);font-size:15px;letter-spacing:2px;}
.dashboard-sidebar .user-info{padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06);font-size:16px;}
.dashboard-sidebar .menu{margin-top:8px;}
.dashboard-sidebar .menu a{display:block;padding:9px 16px;color:rgba(255,255,255,.5);font-size:16px;transition:all .2s;border-left:2px solid transparent;}
.dashboard-sidebar .menu a:hover,.dashboard-sidebar .menu a.active{background:rgba(255,255,255,.05);color:var(--gold-light);border-left-color:var(--gold);}
.dashboard-main{flex:1;background:var(--paper-warm);overflow-y:auto;}
.dashboard-topbar{background:var(--paper);padding:0 20px;height:50px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-light);}
.dashboard-topbar .breadcrumb{font-size:16px;color:var(--ink-muted);}
.dashboard-content{padding:20px;}

/* ==================== Stats Grid ==================== */
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px;}
.stat-card{background:var(--paper);border-radius:var(--radius);padding:16px;border:1px solid var(--border-light);}
.stat-card .label{font-size:16px;color:var(--ink-muted);margin-bottom:6px;}
.stat-card .value{font-size:24px;font-weight:700;color:var(--ink);font-family:Georgia,serif;}
.stat-card.primary{border-left:3px solid var(--jade-deep);}
.stat-card.success{border-left:3px solid var(--jade-mid);}
.stat-card.warning{border-left:3px solid var(--wood-light);}
.stat-card.danger{border-left:3px solid var(--cinnabar);}

/* ==================== Filter / Sort ==================== */
.filter-bar{background:var(--paper);padding:12px;border-radius:var(--radius);margin-bottom:14px;border:1px solid var(--border-light);}
.filter-bar .filter-row{display:flex;align-items:center;padding:6px 0;border-bottom:1px solid var(--border-light);font-size:16px;}
.filter-bar .filter-row:last-child{border-bottom:none;}
.filter-bar .filter-label{width:60px;color:var(--ink-muted);flex-shrink:0;font-size:16px;}
.filter-bar .filter-options{display:flex;flex-wrap:wrap;gap:6px;}
.filter-bar .filter-options a,.filter-bar .filter-options span{padding:3px 10px;border-radius:var(--radius-sm);background:var(--paper-warm);color:var(--ink-muted);font-size:16px;border:1px solid var(--border-light);}
.filter-bar .filter-options a.active{background:var(--jade-deep);color:var(--gold-light);border-color:var(--jade-deep);}
.sort-bar{display:flex;gap:3px;margin-bottom:14px;}
.sort-bar a{padding:6px 14px;background:var(--paper);border-radius:var(--radius-sm);font-size:16px;color:var(--ink-light);border:1px solid var(--border-light);}
.sort-bar a.active{background:var(--jade-deep);color:var(--gold-light);border-color:var(--jade-deep);}

/* ==================== Info Table ==================== */
.info-table{width:100%;font-size:16px;}
.info-table td{padding:8px 0;vertical-align:top;}
.info-table td:first-child{color:var(--ink-muted);width:80px;flex-shrink:0;}

/* ==================== Tag ==================== */
.tag{display:inline-block;padding:2px 8px;border-radius:var(--radius-sm);font-size:16px;}
.tag-green{background:#E8F5E9;color:var(--jade-mid);}
.tag-red{background:#FFEBEE;color:var(--cinnabar);}
.tag-orange{background:#FFF3E0;color:var(--wood-light);}

/* ==================== Empty State ==================== */
.empty-state{text-align:center;padding:40px 20px;color:var(--ink-muted);}
.empty-state .icon{font-size:40px;margin-bottom:8px;opacity:.5;}
.empty-state p{font-size:16px;}

/* ==================== Responsive ==================== */
@media (max-width:1200px){.product-grid{grid-template-columns:repeat(4,1fr);}}
@media (max-width:992px){.product-grid{grid-template-columns:repeat(3,1fr);}.banner-section .container{height:300px;}.user-layout{flex-direction:column;}.user-sidebar{width:100%;}.dashboard-sidebar{width:56px;overflow:hidden;}.dashboard-sidebar .logo h2,.dashboard-sidebar .menu a span{display:none;}.dashboard-sidebar .menu a{text-align:center;padding:10px;}}
@media (max-width:768px){.product-grid{grid-template-columns:repeat(2,1fr);}.banner-section .container{flex-direction:column;height:auto;}.banner-slider{height:180px;}.banner-side{width:100%;flex-direction:row;height:80px;}.header .search-box{margin:0 8px;}.main-nav .category-all{width:160px;}.stats-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:480px){.product-grid{grid-template-columns:1fr 1fr;gap:8px;}.header .container{flex-wrap:wrap;}.top-bar .container{flex-wrap:wrap;font-size:16px;}.top-bar .right{overflow-x:auto;white-space:nowrap;}}

/* ==================== Utility ==================== */
.text-center{text-align:center;}.text-right{text-align:right;}
.mt-1{margin-top:8px;}.mt-2{margin-top:16px;}.mt-3{margin-top:24px;}
.mb-1{margin-bottom:8px;}.mb-2{margin-bottom:16px;}.mb-3{margin-bottom:24px;}
.ml-1{margin-left:8px;}
.flex-between{display:flex;justify-content:space-between;align-items:center;}
.flex-1{flex:1;}