/* ── Enhanced Account Sidebar Styles ── */
.auth-sb { max-width: 480px; }

/* Tab nav for logged-in user */
.acct-tab-nav { display: flex; border-bottom: 2px solid #f0e6d6; flex-shrink: 0; background: #fffaf5; }
.acct-tab-btn { flex: 1; padding: 11px 4px; border: none; background: transparent; font-family: 'Poppins', sans-serif; font-size: .71rem; font-weight: 700; color: #bbb; cursor: pointer; text-transform: uppercase; letter-spacing: .5px; position: relative; transition: color .2s; }
.acct-tab-btn::after { content: ''; position: absolute; bottom: -2px; left: 0; right: 0; height: 2.5px; background: #c1660a; transform: scaleX(0); transition: transform .25s; border-radius: 2px 2px 0 0; }
.acct-tab-btn.active { color: #4e2c10; }
.acct-tab-btn.active::after { transform: scaleX(1); }
.acct-tab-panel { display: none; padding: 20px 22px 28px; flex: 1; overflow-y: auto; }
.acct-tab-panel.active { display: block; }

/* Profile section */
.acct-profile-row { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.acct-avatar { width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, #c1660a, #e63946); display: flex; align-items: center; justify-content: center; font-family: 'Playfair Display', serif; font-size: 1.5rem; color: #fff; flex-shrink: 0; }
.acct-name-block { flex: 1; min-width: 0; }
.acct-name-block strong { display: block; font-family: 'Playfair Display', serif; font-size: 1.1rem; color: #2d1500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acct-name-block span { font-size: .75rem; color: #733f0a; font-family: 'Poppins', sans-serif; }

/* Discount chart */
.discount-chart { border-radius: 14px; overflow: hidden; border: 1.5px solid #ebd9c4; margin-bottom: 4px; }
.discount-chart table { width: 100%; border-collapse: collapse; font-family: 'Poppins', sans-serif; font-size: .72rem; }
.discount-chart thead tr { background: linear-gradient(135deg, #4e2c10, #8b4513); color: #f5e9d3; }
.discount-chart thead th { padding: 9px 8px; font-weight: 700; letter-spacing: .4px; text-align: center; }
.discount-chart tbody tr { background: #fffaf5; border-bottom: 1px solid #f0e6d6; transition: background .15s; }
.discount-chart tbody tr:hover { background: #fef4e5; }
.discount-chart tbody tr.best-deal { background: #fff8e8; }
.discount-chart td { padding: 8px; text-align: center; color: #4e2c10; font-weight: 600; }
.discount-chart .pack-label { font-weight: 800; color: #2d1500; }
.discount-chart .price-final { color: #c1660a; font-weight: 800; font-size: .82rem; }
.discount-chart .disc-pct { background: #e6f4ea; color: #166534; font-weight: 800; padding: 2px 7px; border-radius: 10px; font-size: .7rem; display: inline-block; }
.discount-chart .free-del { color: #16a34a; font-weight: 700; }
.discount-chart .paid-del { color: #999; }
.best-deal-badge { background: linear-gradient(135deg, #f4a11d, #e63946); color: #fff; font-family: 'Poppins', sans-serif; font-size: .58rem; font-weight: 800; padding: 2px 7px; border-radius: 8px; margin-left: 4px; vertical-align: middle; letter-spacing: .3px; }

/* Orders list */
.order-card { background: #fffaf5; border: 1.5px solid #ebd9c4; border-radius: 12px; padding: 12px 14px; margin-bottom: 10px; cursor: pointer; transition: all .2s; }
.order-card:hover { border-color: #c1660a; transform: translateX(2px); }
.order-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 5px; }
.order-id { font-family: 'Poppins', sans-serif; font-weight: 800; font-size: .78rem; color: #2d1500; }
.order-status { font-size: .65rem; font-weight: 700; padding: 2px 9px; border-radius: 10px; font-family: 'Poppins', sans-serif; letter-spacing: .3px; }
.status-paid { background: #dcfce7; color: #166534; }
.status-pending { background: #fef9c3; color: #92400e; }
.order-card-bottom { display: flex; align-items: center; justify-content: space-between; }
.order-amount { font-family: 'Poppins', sans-serif; font-weight: 800; color: #c1660a; font-size: .88rem; }
.order-date { font-size: .68rem; color: #4e2c10; font-family: 'Poppins', sans-serif; }
.order-view-btn { font-size: .65rem; font-weight: 700; color: #c1660a; background: none; border: 1px solid #c1660a; border-radius: 8px; padding: 3px 10px; cursor: pointer; font-family: 'Poppins', sans-serif; transition: .2s; }
.order-view-btn:hover { background: #c1660a; color: #fff; }

/* Order detail modal */
.od-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.7); z-index: 19999; display: none; align-items: center; justify-content: center; padding: 16px; backdrop-filter: blur(6px); }
.od-overlay.open { display: flex; }
.od-box { background: #fffaf5; border-radius: 20px; max-width: 480px; width: 100%; max-height: 88vh; overflow-y: auto; box-shadow: 0 24px 64px rgba(0,0,0,.4); animation: odPop .32s cubic-bezier(.175,.885,.32,1.275) forwards; }
@keyframes odPop { from { opacity:0; transform: scale(.88) translateY(20px); } to { opacity:1; transform: none; } }
.od-head { background: linear-gradient(135deg, #4e2c10, #c1660a); padding: 18px 20px; display: flex; align-items: center; justify-content: space-between; border-radius: 20px 20px 0 0; }
.od-head h3 { font-family: 'Playfair Display', serif; color: #f5e9d3; font-size: 1.2rem; margin: 0; }
.od-close { background: rgba(255,255,255,.15); border: none; color: #fff; width: 32px; height: 32px; border-radius: 50%; cursor: pointer; font-size: .85rem; display: flex; align-items: center; justify-content: center; transition: .2s; }
.od-close:hover { background: #e63946; }
.od-body { padding: 18px 20px 22px; }
.od-info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 16px; }
.od-info-item { background: #f8f0e4; border-radius: 8px; padding: 8px 10px; }
.od-info-item label { display: block; font-size: .62rem; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #a06020; margin-bottom: 2px; font-family: 'Poppins', sans-serif; }
.od-info-item span { font-size: .78rem; font-weight: 600; color: #2d1500; font-family: 'Poppins', sans-serif; }
.od-address-full { grid-column: 1 / -1; }
.od-items-title { font-size: .72rem; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; color: #7a4520; margin-bottom: 10px; font-family: 'Poppins', sans-serif; }
.od-item-row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid #f0e6d6; }
.od-item-row:last-child { border-bottom: none; }
.od-item-img { width: 46px; height: 54px; object-fit: contain; background: #fff; border-radius: 8px; padding: 3px; border: 1px solid #ebd9c4; }
.od-item-info { flex: 1; min-width: 0; }
.od-item-info strong { display: block; font-size: .78rem; font-weight: 700; color: #2d1500; font-family: 'Poppins', sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.od-item-info span { font-size: .7rem; color: #000; font-family: 'Poppins', sans-serif; }
.od-item-price { font-family: 'Poppins', sans-serif; font-weight: 800; font-size: .82rem; color: #c1660a; white-space: nowrap; }
.od-total-row { display: flex; justify-content: space-between; align-items: center; padding: 12px 0 0; border-top: 2px solid #ebd9c4; margin-top: 6px; }
.od-total-row strong { font-family: 'Poppins', sans-serif; font-weight: 800; font-size: .9rem; color: #2d1500; }
.od-total-row span { font-family: 'Poppins', sans-serif; font-weight: 900; font-size: 1.1rem; color: #c1660a; }

/* Address edit form */
.addr-section-lbl { font-size: .7rem; font-weight: 800; letter-spacing: .7px; text-transform: uppercase; color: #7a4520; margin-bottom: 12px; font-family: 'Poppins', sans-serif; padding-bottom: 6px; border-bottom: 2px solid #f0e6d6; }
.addr-type-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 14px;}
.addr-type-tab{flex:1;min-width:92px;border:1.5px solid #e8ddd0;background:#fffaf5;color:#7a4520;border-radius:22px;padding:9px 10px;font-family:'Poppins',sans-serif;font-size:.75rem;font-weight:900;cursor:pointer;transition:.2s;text-align:center;}
.addr-type-tab.active{background:linear-gradient(135deg,#c1660a,#e63946);color:#fff;border-color:#c1660a;box-shadow:0 6px 16px rgba(193,102,10,.18);}
.addr-type-panel{display:none;}
.addr-type-panel.active{display:block;}

.addr-field { margin-bottom: 12px; }
.addr-field label { display: block; font-size: .68rem; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #7a4520; margin-bottom: 4px; font-family: 'Poppins', sans-serif; }
.addr-field input, .addr-field textarea { width: 100%; padding: 10px 12px; border: 1.5px solid #e8ddd0; border-radius: 8px; font-size: .85rem; color: #1a1a1a; font-family: 'Poppins', sans-serif; background: #fffaf5; outline: none; transition: border-color .2s; resize: none; }
.addr-field input:focus, .addr-field textarea:focus { border-color: #c1660a; box-shadow: 0 0 0 3px rgba(193,102,10,.1); background: #fff; }
.addr-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.addr-save-btn { width: 100%; padding: 12px; background: linear-gradient(135deg, #c1660a, #e63946); color: #fff; border: none; border-radius: 10px; font-family: 'Poppins', sans-serif; font-size: .88rem; font-weight: 700; cursor: pointer; transition: .3s; margin-top: 6px; box-shadow: 0 4px 14px rgba(193,102,10,.3); }
.addr-save-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(193,102,10,.4); }
.addr-save-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }


    :root {
         --primary: #e63946;
         --secondary: #f4a261;
         --dark: #1a1a2e;
         --darker: #0d0d1a;
         --nav-bg: #f5e9d3; /* Solid consistent background */
         --nav-text: #4e2c10;
         --transition: all 0.3s ease;
      }

      /* ============ NAVBAR ============ */
      #nav {
         background: var(--nav-bg) !important;
         padding: 0;
         position: sticky !important;
         top: 0;
         z-index: 1050 !important;
         border-bottom: 1px solid rgba(0,0,0,0.06);
         transition: box-shadow 0.3s ease;
      }
      @media (max-width: 991px) {
         #nav .navbar-collapse {
            max-height: 85vh;
            overflow-y: auto;
         }
      }

      #nav.scrolled { box-shadow: 0 4px 30px rgba(0,0,0,0.15); }
      #nav .container { padding-top: 8px; padding-bottom: 8px; position: sticky;}

      /* Logo */
      .navbar-brand { text-decoration: none !important; }
      .blogo { display: flex; align-items: center; gap: 10px; }
      .blogo-img {
         height: 58px; width: auto; max-width: 180px;
         object-fit: contain; display: block;
         transition: transform 0.3s ease;
      }
      .navbar-brand:hover .blogo-img { transform: scale(1.04); }

      /* Nav Links */
      #nav .navbar-nav { gap: 2px; }
      #nav .nav-link {
         font-family: 'Poppins', sans-serif;
         font-size: 0.88rem;
         font-weight: 500;
         color: var(--nav-text) !important;
         padding: 8px 14px !important;
         border-radius: 8px;
         transition: var(--transition);
         letter-spacing: 0.3px;
         position: relative;
         text-decoration: none !important;
      }
      #nav .nav-link::after {
         content: '';
         position: absolute;
         bottom: 3px; left: 50%;
         transform: translateX(-50%);
         width: 0; height: 2px;
         border-radius: 2px;
         transition: width 0.3s ease;
      }
      #nav .nav-link:hover { color: var(--primary) !important; background: rgba(230,57,70,0.06); }
      #nav .nav-link:hover::after { width: 60%; }
      #nav .nav-link.page-active { color: var(--primary) !important; }
      #nav .nav-link.page-active::after { width: 60%; }

      /* Order Now CTA */
      .nav-cta {
         /* background: linear-gradient(135deg, #c1660a, #a84e08) !important; */
         background: linear-gradient(135deg, #dcb07d, #e7cfa5) !important;
         color: #fff !important;
         border-radius: 25px !important;
         padding: 9px 22px !important;
         font-weight: 600 !important;
         box-shadow: 0 4px 15px rgba(193,102,10,0.35);
         transition: var(--transition) !important;
      }
      .nav-cta::after { display: none !important; }
      .nav-cta:hover {
         color: #fff !important;
         transform: translateY(-2px);
         box-shadow: 0 8px 25px rgba(193,102,10,0.5) !important;
         background: linear-gradient(135deg, #d97510, #c1660a) !important;
      }


      .nav-cart-btn{
         position:relative;background:#fff!important;color:var(--nav-text)!important;border:2px solid rgba(78,44,16,.18);
         border-radius:25px!important;padding:8px 16px!important;font-weight:800!important;display:inline-flex!important;align-items:center;gap:8px;
      }
      .nav-cart-badge{position:absolute;top:-9px;right:-7px;background:var(--primary);color:#fff;border-radius:50%;min-width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:900;border:2px solid #fff;}

      /* Search btn */
      #navSearchBtn {
         background: rgba(78,44,16,0.1);
         border: 1px solid rgba(78,44,16,0.2);
         color: var(--nav-text);
         border-radius: 8px;
         width: 38px; height: 38px;
         display: flex; align-items: center; justify-content: center;
         cursor: pointer;
         transition: var(--transition);
         font-size: 0.85rem;
      }
      #navSearchBtn:hover { background: var(--primary); border-color: var(--primary); color: #fff; }

      /* Toggler */
      .navbar-toggler {
         padding: 6px 10px !important;
         border: 1.5px solid rgba(78,44,16,0.25) !important;
         border-radius: 8px !important;
      }
      .navbar-toggler:focus { box-shadow: none !important; }

      /* ============ MOBILE COLLAPSE MENU ============ */
      @media (max-width: 991px) {
         #nav .container { padding-top: 6px; padding-bottom: 6px; position: sticky; }
         .blogo-img { height: 50px; }

         #nav .navbar-collapse {
            background: transparent; /* Removed floating card background */
            padding: 10px 0 14px;      /* Trimmed spacing to keep it sleek */
            border-radius: 0;         /* Clean flush edges */
            margin-top: 0;
            border: none;             /* Removed ugly floating border outline */
            box-shadow: none;         /* Cleared overlapping box shadows */
         }
         #nav .navbar-nav { gap: 4px; margin-bottom: 15px; }
         #nav .nav-link {
            padding: 10px 14px !important;
            font-size: 0.95rem;
            border-radius: 8px;
         }
         #nav .nav-link:hover { background: rgba(230,57,70,0.07); }

         /* Action block container for mobile button */
         .nav-action-wrap {
            border-top: 1px solid rgba(78,44,16,0.1);
            padding-top: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
         }
         .nav-cta { display: inline-block; text-align: center; width: 100%; }
      }

      @media (max-width: 480px) {
         .blogo-img { height: 50px; }
         #nav .nav-link { font-size: 0.9rem; padding: 9px 12px !important; }
      }

      @media (max-width: 991px) {
         #navmenu .nav-action-wrap { display: none !important; }
      }

      /* Mobile header action buttons: visible before hamburger */
      .nav-mobile-actions{display:none;align-items:center;gap:7px;margin-left:auto;}
      .nav-mobile-actions .nav-cart-btn,
      .nav-mobile-actions .nav-acct-btn{height:38px;min-width:38px;padding:7px 10px!important;border-radius:22px!important;font-size:.8rem;white-space:nowrap;}
      .nav-mobile-actions .acct-name,
      .nav-mobile-actions .acct-text{display:none;}
      @media (max-width: 991px) {
         .nav-mobile-actions{display:flex!important;}
         .navbar-toggler{margin-left:6px!important;}
      }
      @media (min-width: 992px) {
         .nav-mobile-actions{display:none!important;}
      }
      @media (max-width: 380px) {
         .nav-mobile-actions{gap:5px;}
         .nav-mobile-actions .nav-cart-btn,
         .nav-mobile-actions .nav-acct-btn{height:34px;min-width:34px;padding:6px 8px!important;font-size:.75rem;}
         .nav-mobile-actions .nav-cart-btn > span:not(.nav-cart-badge){display:none;}
      }


      /* ============ SEARCH OVERLAY ============ */
      #searchOv {
         position: fixed; inset: 0;
         background: rgba(10,10,20,0.97);
         backdrop-filter: blur(20px);
         z-index: 9999;
         display: none; align-items: center; justify-content: center;
         padding: 20px;
      }
      #searchOv.active { display: flex; }
      .sovclose {
         position: absolute; top: 25px; right: 30px;
         background: rgba(255,255,255,0.1); border: none; color: #fff;
         width: 44px; height: 44px; border-radius: 50%;
         font-size: 1rem; cursor: pointer; transition: var(--transition);
      }
      .sovclose:hover { background: var(--primary); transform: rotate(90deg); }
      .sovbox { max-width: 640px; width: 100%; }
      .sovbox h4 {
         font-family: 'Playfair Display', serif; color: #fff;
         font-size: 1.6rem; margin-bottom: 24px; text-align: center;
      }
      .sovinput {
         display: flex;
         background: rgba(255,255,255,0.07);
         border: 1px solid rgba(255,255,255,0.15);
         border-radius: 50px; overflow: hidden; margin-bottom: 28px;
      }
      .sovinput input {
         flex: 1; background: transparent; border: none; outline: none;
         padding: 14px 22px; color: #fff;
         font-family: 'Poppins', sans-serif; font-size: 0.95rem;
      }
      .sovinput input::placeholder { color: rgba(255,255,255,0.4); }
      .sovinput button {
         background: var(--primary); border: none; color: #fff;
         padding: 14px 22px; cursor: pointer; font-size: 1rem;
      }
      .sovinput button:hover { background: #c1121f; }
      .sovtrend { text-align: center; }
      .sovtrend p {
         color: rgba(255,255,255,0.5); font-size: 0.8rem;
         font-family: 'Poppins', sans-serif; margin-bottom: 10px;
      }
      .sovtrend .ttag {
         display: inline-block;
         background: rgba(255,255,255,0.06);
         border: 1px solid rgba(255,255,255,0.1);
         color: rgba(255,255,255,0.7);
         padding: 5px 14px; border-radius: 20px;
         font-size: 0.8rem; margin: 4px; cursor: pointer;
         font-family: 'Poppins', sans-serif; transition: var(--transition);
      }
      .sovtrend .ttag:hover { background: var(--primary); color: #fff; border-color: var(--primary); }


      /* ============ AUTH SIDEBAR ============ */
      .auth-sb-overlay{position:fixed;inset:0;background:rgba(10,5,2,.55);z-index:10998;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;backdrop-filter:blur(4px);}
      .auth-sb-overlay.open{opacity:1;visibility:visible;}

      .auth-sb{position:fixed;top:0;right:-110%;width:100%;max-width:420px;height:100%;background:#fff;z-index:10999;display:flex;flex-direction:column;transition:right .4s cubic-bezier(.77,0,.175,1);box-shadow:-8px 0 48px rgba(0,0,0,.18);overflow-y:auto;}
      .auth-sb.open{right:0;}

      .auth-sb-head{background:linear-gradient(135deg,#4e2c10,#c1660a);padding:20px 24px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
      .auth-sb-head .brand-lbl{font-family:'Playfair Display',serif;font-size:1.3rem;color:#f5e9d3;letter-spacing:.5px;}
      /* .auth-sb-head .brand-lbl span{color:#f4a261;} */
      .auth-sb-xbtn{width:34px;height:34px;border-radius:50%;border:1.5px solid rgba(255,255,255,.3);background:transparent;color:#fff;font-size:.95rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition);}
      .auth-sb-xbtn:hover{background:var(--primary);border-color:var(--primary);}

      .auth-sb-tabs{display:flex;border-bottom:2px solid #f0e6d6;flex-shrink:0;}
      .auth-sb-tab{flex:1;padding:14px 8px;border:none;background:transparent;font-family:'Poppins',sans-serif;font-size:.82rem;font-weight:700;color:#aaa;cursor:pointer;text-transform:uppercase;letter-spacing:.6px;position:relative;transition:color .2s;}
      .auth-sb-tab::after{content:'';position:absolute;bottom:-2px;left:0;right:0;height:2.5px;background:var(--primary);transform:scaleX(0);transition:transform .25s;border-radius:2px 2px 0 0;}
      .auth-sb-tab.active{color:#4e2c10;}
      .auth-sb-tab.active::after{transform:scaleX(1);}

      .auth-sb-body{padding:26px 24px 32px;flex:1;}
      .auth-sb-title{font-family:'Playfair Display',serif;font-size:1.6rem;color:#2d1500;margin-bottom:2px;}
      .auth-sb-sub{font-size:.8rem;color:#999;margin-bottom:22px;font-family:'Poppins',sans-serif;}

      .asf-group{margin-bottom:15px;}
      .asf-group label{display:block;font-size:.72rem;font-weight:700;letter-spacing:.7px;text-transform:uppercase;color:#7a4520;margin-bottom:5px;font-family:'Poppins',sans-serif;}
      .asf-wrap{position:relative;}
      .asf-wrap input{width:100%;padding:11px 40px 11px 13px;border:1.5px solid #e8ddd0;border-radius:9px;font-size:.88rem;color:#1a1a1a;font-family:'Poppins',sans-serif;font-weight:500;background:#fffaf5;outline:none;transition:border-color .2s,box-shadow .2s;}
      .asf-wrap input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(230,57,70,.1);background:#fff;}
      .asf-wrap input::placeholder{color:#ccc;font-weight:400;}
      .asf-eye{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;color:#bbb;font-size:.9rem;padding:0;transition:color .2s;}
      .asf-eye:hover{color:var(--primary);}

      .asf-strength{height:3px;border-radius:3px;background:#f0e6d6;margin-top:5px;overflow:hidden;}
      .asf-strength-bar{height:100%;border-radius:3px;width:0;transition:width .4s,background .3s;}
      .asf-strength-lbl{font-size:.68rem;font-weight:700;font-family:'Poppins',sans-serif;color:#bbb;margin-top:3px;}

      .asf-remember{display:flex;align-items:center;gap:7px;margin:8px 0 18px;}
      .asf-remember input[type=checkbox]{width:15px;height:15px;accent-color:var(--primary);cursor:pointer;}
      .asf-remember label{font-size:.78rem;color:#777;cursor:pointer;font-family:'Poppins',sans-serif;font-weight:500;margin:0;}

      .asf-btn{width:100%;padding:13px;background:linear-gradient(135deg,#e63946,#c1660a);color:#fff;border:none;border-radius:10px;font-family:'Poppins',sans-serif;font-size:.9rem;font-weight:700;letter-spacing:.5px;cursor:pointer;transition:var(--transition);box-shadow:0 4px 16px rgba(230,57,70,.25);margin-top:4px;}
      .asf-btn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(230,57,70,.35);}

      .asf-switch{text-align:center;margin-top:16px;font-size:.78rem;color:#999;font-family:'Poppins',sans-serif;}
      .asf-switch a{color:var(--primary);font-weight:700;cursor:pointer;text-decoration:none;}
      .asf-switch a:hover{text-decoration:underline;}

      /* logged-in panel */
      .auth-li-panel{text-align:center;padding:36px 20px;}
      .auth-li-avatar{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--secondary));display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:1.8rem;color:#fff;margin:0 auto 14px;}
      .auth-li-name{font-family:'Playfair Display',serif;font-size:1.3rem;color:#2d1500;margin-bottom:3px;}
      .auth-li-email{font-size:.78rem;color:#aaa;margin-bottom:24px;font-family:'Poppins',sans-serif;}
      .auth-li-logout{display:inline-block;padding:10px 28px;background:#2d1500;color:#f4a261;border-radius:8px;font-family:'Poppins',sans-serif;font-size:.82rem;font-weight:700;letter-spacing:.5px;text-decoration:none;transition:var(--transition);}
      .auth-li-logout:hover{background:var(--primary);color:#fff;}

      /* Account btn in navbar */
      .nav-acct-btn{position:relative;background:#fff!important;color:var(--nav-text)!important;border:2px solid rgba(78,44,16,.18);border-radius:25px!important;padding:8px 14px!important;font-weight:700!important;display:inline-flex!important;align-items:center;gap:6px;font-size:1rem !important;cursor:pointer;transition:var(--transition);white-space:nowrap;}
      .nav-acct-btn:hover{border-color:var(--primary);color:var(--primary)!important;}
      /* .nav-acct-btn .acct-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:90px;display:inline-block;} */
      .nav-acct-btn .acct-name {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 45px;
        display: inline-block;
    }
      .nav-acct-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;border:2px solid #fff;position:absolute;top:1px;right:1px;}

      @media(max-width:480px){.auth-sb{max-width:100%;}}
      html { scroll-padding-top: 72px; }
      @media (max-width: 991px) { html { scroll-padding-top: 64px; } }

      /* ============ BOOTSTRAP ALERT TOAST AREA ============ */
      #siteAlertWrap {
         position: fixed;
         top: 88px;
         right: 18px;
         z-index: 20000;
         width: min(380px, calc(100vw - 24px));
         pointer-events: none;
      }
      #siteAlertWrap .alert {
         pointer-events: auto;
         border-radius: 12px;
         box-shadow: 0 10px 30px rgba(0,0,0,.16);
         font-family: 'Poppins', sans-serif;
         font-size: .88rem;
         padding: 12px 42px 12px 14px;
         margin-bottom: 10px;
         border-width: 1.5px;
      }
      #siteAlertWrap .alert strong { display:block; margin-bottom:2px; }
      #siteAlertWrap .btn-close { padding: 15px 14px; }
      @media (max-width: 575px) {
         #siteAlertWrap { top: 72px; right: 12px; left: 12px; width: auto; }
      }

      @media (max-width: 767px){
    .auth-sb{max-width:100%!important;width:100%!important;}
    .acct-tab-panel{padding:16px 14px 24px!important;}
    .addr-row-2{grid-template-columns:1fr!important;gap:0!important;}
    .addr-field input,.addr-field textarea{font-size:16px!important;}
    .od-box{max-height:92vh!important;border-radius:14px!important;}
    }
    @media (min-width:768px) and (max-width:1199px){
        .auth-sb{
            max-width:520px!important;
        }
    }