/* =========================================================



   GlowBay Account — Premium Design System (Lazada-style)



   Standalone plugin. Orange brand, clean cards, soft UI.



   ========================================================= */



:root {



  --gba-orange: #FF6A00;



  --gba-orange-2: #FF8C3A;



  --gba-orange-dark: #E85D00;



  --gba-orange-soft: #FFF1E6;



  --gba-orange-3: #FFD0A8;



  --gba-pink: #FF4D6D;



  --gba-blue: #0EA5E9;



  --gba-purple: #8B5CF6;



  --gba-ink: #1F2430;



  --gba-body: #4A5160;



  --gba-muted: #8A92A3;



  --gba-border: #ECECF1;



  --gba-card: #F7F8FA;



  --gba-surface: #F5F5F5;



  --gba-shadow-sm: 0 2px 10px rgba(20,24,40,.06);



  --gba-shadow-md: 0 10px 30px rgba(20,24,40,.10);



  --gba-shadow-premium: 0 18px 50px rgba(255,107,0,.16);



  --gba-radius: 16px;



}







.gba-account { padding: 28px 0 64px; background: var(--gba-surface); min-height: 60vh; }



.gba-container { max-width: 1180px; margin: 0 auto; padding: 0 20px; }



.gba-layout { display: grid; grid-template-columns: 280px 1fr; gap: 26px; align-items: start; }







/* ===== Sidebar ===== */



.gba-side {



  position: sticky; top: 92px;



  background: #fff; border: 1px solid var(--gba-border);



  border-radius: 20px; padding: 16px; box-shadow: var(--gba-shadow-sm);



}



.gba-user { display: flex; align-items: center; gap: 12px; padding: 10px 8px 16px; border-bottom: 1px solid var(--gba-border); margin-bottom: 12px; }



.gba-avatar {



  width: 50px; height: 50px; border-radius: 50%; flex: 0 0 auto;



  background: linear-gradient(135deg,var(--gba-orange),var(--gba-orange-2));



  color: #fff; display: flex; align-items: center; justify-content: center;



  font-size: 22px; font-weight: 900; box-shadow: 0 6px 16px rgba(255,107,0,.3);



}



.gba-user-meta b { display: block; font-size: 14.5px; color: var(--gba-ink); }



.gba-tier { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; color: var(--gba-orange); }



.gba-nav { display: flex; flex-direction: column; gap: 3px; }



.gba-nav-item {



  position: relative; display: flex; align-items: center; gap: 12px;



  padding: 12px 14px; border-radius: 12px; text-decoration: none;



  color: var(--gba-body); font-weight: 700; font-size: 14px; min-height: 46px;



  transition: background .2s, color .2s;



}



.gba-nav-ic { width: 20px; text-align: center; font-size: 15px; color: var(--gba-orange); flex: 0 0 auto; }



.gba-nav-item:hover { background: var(--gba-orange-soft); color: var(--gba-orange); }



.gba-nav-item.is-active { background: var(--gba-orange); color: #fff; box-shadow: 0 8px 18px rgba(255,107,0,.32); }



.gba-nav-item.is-active .gba-nav-ic { color: #fff; }



.gba-nav-item.is-active::before {



  content: ""; position: absolute; left: -16px; top: 50%; transform: translateY(-50%);



  width: 4px; height: 26px; background: var(--gba-orange); border-radius: 0 4px 4px 0;



}







/* ===== Content ===== */



.gba-content { min-width: 0; }



.gba-card { background: #fff; border: 1px solid var(--gba-border); border-radius: var(--gba-radius); padding: 26px; box-shadow: var(--gba-shadow-sm); margin-bottom: 22px; }



.gba-card-title { font-size: 22px; font-weight: 900; color: var(--gba-ink); margin: 0 0 18px; display: flex; align-items: center; gap: 10px; }



.gba-card-title i { color: var(--gba-orange); }







/* ===== Reference Dashboard (exact design) ===== */



.gba-dash { display: block; }



.gba-side { background: #fff; border: 1px solid var(--gba-border); border-radius: 20px; padding: 18px; box-shadow: var(--gba-shadow-sm); position: sticky; top: 90px; }



.gba-nav { display: flex; flex-direction: column; gap: 4px; }



.gba-nav-item { display: flex; align-items: center; gap: 12px; padding: 13px 15px; border-radius: 13px; text-decoration: none; color: var(--gba-ink); font-weight: 700; font-size: 14px; transition: background .2s, color .2s; }



.gba-nav-item i { font-size: 16px; width: 20px; text-align: center; }



.gba-nav-item:hover { background: var(--gba-orange-soft); }



.gba-nav-item.is-active { background: var(--gba-orange); color: #fff; }



.gba-refer { margin-top: 18px; background: linear-gradient(160deg, var(--gba-orange-soft), #fff); border: 1px solid var(--gba-orange-3); border-radius: 16px; padding: 20px 16px; text-align: center; }



.gba-refer > i { font-size: 30px; color: var(--gba-orange); }



.gba-refer h3 { font-size: 16px; font-weight: 900; margin: 8px 0 4px; color: var(--gba-ink); }



.gba-refer p { font-size: 12.5px; color: var(--gba-muted); margin: 0 0 12px; }



.gba-refer-btn { display: inline-block; background: var(--gba-orange); color: #fff; text-decoration: none; font-weight: 800; font-size: 13px; padding: 9px 22px; border-radius: 11px; }



.gba-refer-btn:hover { background: var(--gba-orange-dark); }







.gba-main { min-width: 0; }







/* ===== Welcome banner (reference) ===== */



.gba-welcome {



  background: linear-gradient(120deg, var(--gba-orange) 0%, var(--gba-orange-2) 60%, #FF5A7A 100%);



  border-radius: 22px; padding: 26px 30px; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 22px; color: #fff; box-shadow: var(--gba-shadow-md);



}



.gba-welcome-l { display: flex; align-items: center; gap: 18px; min-width: 0; }



.gba-welcome-av { width: 64px; height: 64px; border-radius: 50%; overflow: hidden; flex: 0 0 auto; background: rgba(255,255,255,.25); display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 900; }



.gba-welcome-av img { width: 100%; height: 100%; object-fit: cover; }



.gba-welcome h2 { font-size: 24px; font-weight: 900; margin: 0 0 2px; }



.gba-welcome-sub { font-size: 15px; margin: 0 0 2px; opacity: .95; font-weight: 600; }



.gba-welcome-thanks { font-size: 13px; margin: 0; opacity: .85; }



.gba-welcome-r { display: flex; flex-direction: column; align-items: center; gap: 10px; flex: 0 0 auto; }



.gba-gift { font-size: 46px; line-height: 1; }



.gba-member-badge { background: rgba(255,255,255,.22); padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 700; white-space: nowrap; }







/* ===== Stats cards ===== */



.gba-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-bottom: 22px; }



.gba-stat { background: #fff; border: 1px solid var(--gba-border); border-radius: 18px; padding: 20px; box-shadow: var(--gba-shadow-sm); }



.gba-stat-ic { width: 46px; height: 46px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-size: 19px; margin-bottom: 12px; }



.gba-stat-ic.c-orange { background: #FFEDD5; color: #F97316; }



.gba-stat-ic.c-blue { background: #DBEAFE; color: #3B82F6; }



.gba-stat-ic.c-green { background: #DCFCE7; color: #22C55E; }



.gba-stat-ic.c-purple { background: #F3E8FF; color: #A855F7; }



.gba-stat-num { font-size: 24px; font-weight: 900; color: var(--gba-ink); line-height: 1.1; }



.gba-stat-lbl { font-size: 13px; color: var(--gba-muted); margin: 2px 0 10px; font-weight: 600; }



.gba-stat-link { font-size: 12.5px; color: var(--gba-orange); text-decoration: none; font-weight: 700; }



.gba-stat-link:hover { text-decoration: underline; }







/* ===== Dashboard grid ===== */



.gba-dash-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 20px; align-items: start; }



.gba-dash-right { display: flex; flex-direction: column; gap: 20px; }







/* Recent orders */



.gba-recent { margin-bottom: 0; }



.gba-recent-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; }



.gba-recent-head h2 { font-size: 20px; font-weight: 900; color: var(--gba-ink); margin: 0; }



.gba-recent-head a { color: var(--gba-orange); font-weight: 700; text-decoration: none; font-size: 14px; }



.gba-orders-list { display: flex; flex-direction: column; }



.gba-order { display: flex; align-items: center; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--gba-border); }



.gba-order:last-child { border-bottom: none; }



.gba-order-l { display: flex; align-items: center; gap: 16px; flex: 1 1 auto; min-width: 0; }



.gba-order-img { width: 68px; height: 68px; border-radius: 14px; object-fit: cover; background: var(--gba-surface); flex: 0 0 auto; }



.gba-order-ph { display: flex; align-items: center; justify-content: center; color: var(--gba-muted); font-size: 24px; }



.gba-order-l h3 { font-size: 15px; font-weight: 700; margin: 0 0 4px; color: var(--gba-ink); }



.gba-order-l p { font-size: 12.5px; color: var(--gba-muted); margin: 0; }



.gba-status { flex: 0 0 auto; padding: 6px 14px; border-radius: 20px; font-size: 12px; font-weight: 700; }



.gba-status.is-delivered { background: #DCFCE7; color: #16A34A; }



.gba-status.is-shipped { background: #F3E8FF; color: #9333EA; }



.gba-status.is-processing { background: #DBEAFE; color: #2563EB; }



.gba-status.is-pending { background: #FFEDD5; color: #EA580C; }



.gba-status.is-cancelled { background: #FEE2E2; color: #DC2626; }



.gba-order-price { flex: 0 0 auto; font-weight: 800; font-size: 15px; color: var(--gba-ink); }







/* Quick links */



.gba-quick-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }



.gba-quick-item { display: flex; flex-direction: column; align-items: center; gap: 8px; text-decoration: none; color: var(--gba-body); font-size: 12.5px; font-weight: 600; padding: 6px; }



.gba-quick-ic { width: 50px; height: 50px; border-radius: 50%; background: var(--gba-orange-soft); color: var(--gba-orange); display: flex; align-items: center; justify-content: center; font-size: 19px; transition: .2s; }



.gba-quick-item:hover .gba-quick-ic { background: var(--gba-orange); color: #fff; transform: translateY(-2px); }







/* Stay updated */



.gba-update { display: flex; align-items: center; gap: 16px; }



.gba-update-l { flex: 1 1 auto; }



.gba-update-l h3 { font-size: 17px; font-weight: 900; color: var(--gba-ink); margin: 0 0 4px; }



.gba-update-l p { font-size: 13px; color: var(--gba-muted); margin: 0 0 12px; }



.gba-update-btn { display: inline-block; background: var(--gba-orange); color: #fff; text-decoration: none; font-weight: 800; font-size: 13px; padding: 9px 18px; border-radius: 11px; }



.gba-update-btn:hover { background: var(--gba-orange-dark); }



.gba-update-ic { font-size: 38px; flex: 0 0 auto; }







/* Free shipping banner */



.gba-free-banner { display: flex; align-items: center; gap: 14px; background: linear-gradient(120deg,#ECFDF3,#DCFCE7); border: 1px solid #BBF7D0; border-radius: 18px; padding: 18px 20px; }



.gba-free-ic { font-size: 34px; flex: 0 0 auto; }



.gba-free-banner h3 { font-size: 17px; font-weight: 900; color: #15803D; margin: 0 0 2px; }



.gba-free-banner p { font-size: 13px; color: #4B7A57; margin: 0; }







/* Sidebar promo box */



.gba-promo { margin-top: 18px; background: linear-gradient(160deg, #7C3AED 0%, #A855F7 100%); border-radius: 16px; padding: 18px 16px; text-align: center; color: #fff; }



.gba-promo-ic { font-size: 30px; }



.gba-promo h4 { font-size: 16px; font-weight: 900; margin: 6px 0 4px; }



.gba-promo p { font-size: 12px; margin: 0; opacity: .9; line-height: 1.5; }







/* ===== Login (exact reference design) ===== */



.gba-login { padding: 40px 0 56px; background: linear-gradient(160deg,#FFF6EF 0%,#FDEFE6 50%,#FBE9F2 100%); min-height: 70vh; }



.gba-login-wrap { display: grid; grid-template-columns: 1.05fr 0.95fr; max-width: 1040px; margin: 0 auto; border-radius: 26px; overflow: hidden; box-shadow: var(--gba-shadow-premium); min-height: 600px; background:#fff; }



.gba-login-brand { position: relative; padding: 40px 40px 30px; color: #fff; background: linear-gradient(155deg,#FF6A00 0%,#FF8C3A 55%,#FF5A7A 100%); display: flex; flex-direction: column; overflow: hidden; }



.gba-brand-top { margin-bottom: 22px; }



.gba-brand-logo { display: flex; align-items: center; gap: 10px; }



.gba-b-ic { width: 40px; height: 40px; border-radius: 11px; background: #fff; color: var(--gba-orange); display: flex; align-items: center; justify-content: center; font-weight: 900; font-size: 20px; }



.gba-b-txt b { font-size: 21px; letter-spacing: .3px; display:block; line-height:1; }



.gba-b-txt span { font-size: 10px; letter-spacing: 2px; color: rgba(255,255,255,.85); }



.gba-brand-h { font-size: 30px; line-height: 1.2; font-weight: 900; margin: 0 0 12px; }



.gba-brand-h span { color: #FFF1D6; }



.gba-brand-desc { font-size: 14.5px; opacity: .95; margin: 0 0 22px; line-height: 1.6; max-width: 320px; }



.gba-trust { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; margin-bottom: 26px; }



.gba-trust-i { display: flex; align-items: center; gap: 9px; font-size: 12.5px; font-weight: 700; }



.gba-trust-i .ti { width: 34px; height: 34px; border-radius: 10px; background: rgba(255,255,255,.2); display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }



.gba-trust-i .ti svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 1.6; }



.gba-showcase { margin-top: auto; position: relative; min-height: 96px; }



.gba-leaf, .gba-flower { position: absolute; font-size: 30px; }



.gba-leaf-l { left: -8px; bottom: 30px; }



.gba-flower-l { left: 20px; bottom: -6px; font-size: 26px; }



.gba-flower-r { right: 24px; bottom: -4px; font-size: 26px; }



.gba-shelf { display: flex; gap: 12px; align-items: flex-end; justify-content: center; background: rgba(255,255,255,.16); border-radius: 50% 50% 18px 18px / 30% 30% 0 0; padding: 18px 14px 12px; }



.gba-prod { width: 46px; height: 64px; border-radius: 12px; background: #fff; display: flex; align-items: center; justify-content: center; font-size: 26px; box-shadow: 0 6px 14px rgba(0,0,0,.18); }



.gba-prod.p2 { height: 56px; }



.gba-prod.p4 { height: 52px; }







.gba-login-card { background: #fff; padding: 44px 40px 30px; display: flex; flex-direction: column; justify-content: center; position: relative; }



.gba-card-h { font-size: 28px; font-weight: 900; color: var(--gba-ink); margin: 0 0 6px; }



.gba-card-sub { font-size: 14.5px; color: var(--gba-muted); margin: 0 0 24px; }







.gba-social { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }



.gba-soc { display: flex; align-items: center; justify-content: center; gap: 8px; height: 48px; border-radius: 12px; font-size: 13.5px; font-weight: 700; text-decoration: none; border: 1.5px solid var(--gba-border); background: #fff; color: var(--gba-ink); transition: background .2s, border-color .2s, box-shadow .2s; }



.gba-soc svg { width: 18px; height: 18px; flex: 0 0 auto; }



.gba-soc:hover { box-shadow: 0 6px 16px rgba(0,0,0,.08); border-color: #cfd6e4; }



.gba-soc.google:hover { background: #fef6f4; border-color: #f3c7bf; }



.gba-soc.facebook:hover { background: #f3f7ff; border-color: #c3d4fb; }



.gba-soc.apple:hover { background: #f3f3f3; }



.gba-social-note { text-align: center; font-size: 11px; color: var(--gba-muted); margin: 14px 0 0; line-height: 1.5; }



.gba-social-note a { color: var(--gba-orange); text-decoration: none; font-weight: 600; }



.gba-social-note a:hover { text-decoration: underline; }



.gba-alt-link { display: block; text-align: center; margin-top: 14px; font-size: 13.5px; color: var(--gba-body); text-decoration: none; }



.gba-alt-link b { color: var(--gba-orange); }







.gba-or { display: flex; align-items: center; gap: 12px; margin: 18px 0; color: var(--gba-muted); font-size: 12px; }



.gba-or::before, .gba-or::after { content: ""; flex: 1; height: 1px; background: var(--gba-border); }







.gba-login-form { display: flex; flex-direction: column; gap: 14px; }



.gba-login-form label { font-size: 13px; font-weight: 700; color: var(--gba-ink); display: flex; flex-direction: column; gap: 7px; position: relative; }



.gba-in { display: flex; align-items: center; gap: 10px; height: 50px; border: 1.5px solid var(--gba-border); border-radius: 12px; padding: 0 14px; transition: border-color .2s, box-shadow .2s; }



.gba-in svg { width: 18px; height: 18px; stroke: var(--gba-muted); flex: 0 0 auto; }



.gba-in input { flex: 1; border: none; outline: none; font-size: 14px; color: var(--gba-ink); background: transparent; }



.gba-in:focus-within { border-color: var(--gba-orange); box-shadow: 0 0 0 3px var(--gba-orange-soft); }



.gba-pw { position: relative; padding-right: 8px; }



.gba-pw input { padding-right: 40px; }



.gba-pw-toggle { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border: none; background: transparent; cursor: pointer; display: flex; align-items: center; justify-content: center; }



.gba-pw-toggle svg { stroke: var(--gba-muted); }



.gba-forgot { position: absolute; right: 0; top: 0; font-size: 12px; color: var(--gba-orange); text-decoration: none; font-weight: 600; }



.gba-forgot:hover { text-decoration: underline; }



.gba-remember { flex-direction: row !important; align-items: center; gap: 8px !important; font-weight: 600 !important; font-size: 13px !important; color: var(--gba-body) !important; margin-top: -2px; }



.gba-remember input { width: 16px; height: 16px; accent-color: var(--gba-orange); }



.gba-btn { height: 52px; border: none; border-radius: 13px; background: linear-gradient(135deg,var(--gba-orange),var(--gba-orange-2)); color: #fff; font-size: 15px; font-weight: 800; cursor: pointer; transition: background .2s, transform .15s, box-shadow .2s; box-shadow: 0 8px 22px rgba(255,106,0,.28); margin-top: 4px; }



.gba-btn:hover { background: var(--gba-orange-dark); transform: translateY(-2px); box-shadow: 0 10px 26px rgba(255,111,0,.36); }



.gba-btn:active { transform: translateY(1px); }



.gba-lost { display: block; text-align: center; font-size: 13px; color: var(--gba-orange); margin-top: 16px; text-decoration: none; }



.gba-lost:hover { text-decoration: underline; }



.gba-soon { display: flex; align-items: center; gap: 10px; justify-content: center; margin-top: 16px; padding: 10px 14px; border: 1px dashed var(--gba-border); border-radius: 12px; font-size: 12px; font-weight: 600; color: var(--gba-muted); }



.gba-soon svg { width: 16px; height: 16px; }







.gba-foot-icons { display: flex; justify-content: space-between; gap: 10px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--gba-border); }



.gba-foot-icons > div { display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 11px; color: var(--gba-muted); font-weight: 600; text-align: center; flex: 1; }



.gba-foot-icons .fi { font-size: 20px; }







/* ===== WooCommerce native endpoint content polish ===== */



.gba-content .woocommerce-MyAccount-content { background: #fff; border: 1px solid var(--gba-border); border-radius: var(--gba-radius); padding: 26px; box-shadow: var(--gba-shadow-sm); }



.gba-content table.shop_table, .gba-content table.woocommerce-orders-table { width: 100%; border-collapse: separate; border-spacing: 0; }



.gba-content table th { text-align: left; font-size: 12px; text-transform: uppercase; letter-spacing: .5px; color: var(--gba-muted); padding: 10px 14px; border-bottom: 2px solid var(--gba-border); }



.gba-content table td { padding: 14px; border-bottom: 1px solid var(--gba-border); font-size: 14px; color: var(--gba-body); }



.gba-content table tr:hover td { background: var(--gba-card); }



.gba-content .button, .gba-content .woocommerce-button { display: inline-flex; align-items: center; gap: 6px; background: var(--gba-orange); color: #fff; border: none; border-radius: 10px; padding: 9px 16px; font-weight: 700; text-decoration: none; font-size: 13px; }



.gba-content .button:hover { background: var(--gba-orange-dark); }



.gba-content fieldset { border: 1px solid var(--gba-border); border-radius: 12px; padding: 18px 22px; margin: 0 0 18px; }



.gba-content legend { font-weight: 800; color: var(--gba-ink); padding: 0 8px; }



.gba-content .form-row label { font-size: 13px; font-weight: 700; color: var(--gba-ink); display: block; margin-bottom: 6px; }



.gba-content input.input-text, .gba-content textarea, .gba-content select { width: 100%; height: 48px; border: 1.5px solid var(--gba-border); border-radius: 11px; padding: 0 14px; font-size: 14px; }



.gba-content input.input-text:focus, .gba-content textarea:focus, .gba-content select:focus { outline: none; border-color: var(--gba-orange); box-shadow: 0 0 0 3px var(--gba-orange-soft); }







/* Hide empty content wrapper (dashboard renders separately) to avoid blank grid column */



.gba-content:empty { display: none; }







/* ===== Responsive ===== */



@media (max-width: 1100px) {



  .gba-dash { grid-template-columns: 1fr; }



  .gba-side { position: static; }



  .gba-top-grid { grid-template-columns: 1fr; }



  .gba-bot-grid { grid-template-columns: 1fr; }



}



@media (max-width: 1000px) {



  .gba-layout { grid-template-columns: 1fr; gap: 20px; }



  .gba-side-old { position: static; }



  .gba-login-wrap { grid-template-columns: 1fr; min-height: 0; }



  .gba-login-brand { padding: 40px 32px; }



  .gba-brand-foot { position: static; margin-top: 28px; }



  .gba-login-card { padding: 40px 32px; }



}



@media (max-width: 600px) {



  .gba-account { padding: 16px 0 48px; }



  .gba-container { padding: 0 14px; }



  .gba-side { padding: 14px; border-radius: 16px; }



  .gba-nav { flex-direction: row; gap: 8px; overflow-x: auto; padding: 4px 2px 6px; -webkit-overflow-scrolling: touch; }



  .gba-nav-item { flex: 0 0 auto; border-radius: 11px; padding: 10px 14px; font-size: 13px; white-space: nowrap; }



  .gba-nav-item.is-active { border-left: none; }



  .gba-refer { margin-top: 14px; }



  .gba-hero { flex-direction: column; align-items: flex-start; gap: 14px; padding: 22px 18px; border-radius: 18px; }



  .gba-hero-txt h2 { font-size: 22px; }



  .gba-shop-btn { width: 100%; text-align: center; }



  .gba-summary { padding: 18px; border-radius: 18px; }



  .gba-ov-grid { grid-template-columns: repeat(5,1fr); gap: 6px; overflow-x: auto; }



  .gba-ov { padding: 12px 6px; border-radius: 14px; min-width: 90px; }



  .gba-ov-ic { width: 38px; height: 38px; font-size: 16px; }



  .gba-ov h4 { font-size: 11px; }



  .gba-ov h2 { font-size: 22px; }



  .gba-card { padding: 18px; border-radius: 16px; }



  .gba-order { flex-wrap: wrap; gap: 10px; }



  .gba-order-l { flex: 1 1 100%; }



  .gba-order-price { margin-left: auto; }



  .gba-wallet-amt { font-size: 26px; }



  .gba-wallet-btns { flex-direction: column; }



  .gba-add-money, .gba-trans { width: 100%; }



  .gba-banner { padding: 22px 18px; border-radius: 18px; }



  .gba-banner-txt h2 { font-size: 22px; }



  .gba-coupon { padding: 14px; }



  .gba-coupon-code { font-size: 18px; }



  .gba-coupon-r h3 { font-size: 17px; }



  .gba-content .woocommerce-MyAccount-content { padding: 18px; border-radius: 16px; }



}



@media (max-width: 380px) {



  .gba-ov-grid { grid-template-columns: repeat(5,1fr); }



}







/* ===== GlowBay Login — Reference 100% match additions ===== */



.gba-brand-h { font-size: 30px; line-height: 1.22; font-weight: 900; margin: 0 0 12px; color:#fff; }



.gba-brand-h span { color: #FFF1D6; }



.gba-brand-desc { font-size: 14px; opacity:.95; margin: 0 0 22px; line-height:1.55; max-width:330px; }







/* Feature list (star/truck/check/headset) */



.gba-feat { list-style:none; padding:0; margin:0 0 24px; display:flex; flex-direction:column; gap:13px; }



.gba-feat li { display:flex; align-items:flex-start; gap:12px; }



.gba-feat .fi { width:38px; height:38px; flex:0 0 auto; border-radius:11px; background:rgba(255,255,255,.2); color:#fff; display:flex; align-items:center; justify-content:center; }



.gba-feat .fi .gb-ico { width:20px; height:20px; stroke:#fff; }



.gba-feat b { display:block; font-size:14px; font-weight:800; color:#fff; }



.gba-feat small { display:block; font-size:12px; opacity:.88; margin-top:1px; line-height:1.4; }







/* Product showcase with real images */



.gba-showcase { margin-top:auto; position:relative; min-height:120px; }



.gba-shelf { display:flex; gap:12px; align-items:flex-end; justify-content:center; background:rgba(255,255,255,.16); border-radius:50% 50% 18px 18px / 30% 30% 0 0; padding:20px 16px 14px; }



.gba-prod { width:60px; height:84px; border-radius:12px; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 14px rgba(0,0,0,.18); overflow:hidden; }



.gba-prod img { width:100%; height:100%; object-fit:cover; }



.gba-prod.p2 { height:72px; }



.gba-prod.p4 { height:64px; }



.gba-badge-float { position:absolute; top:-6px; right:6px; background:#fff; color:var(--gba-orange); font-size:11px; font-weight:800; padding:7px 12px; border-radius:10px; box-shadow:0 6px 16px rgba(0,0,0,.15); border:1.5px dashed var(--gba-orange); }







/* MY -> BD route */



.gba-route { display:flex; align-items:center; gap:12px; margin-top:18px; }



.gba-route .gba-flag { font-size:24px; line-height:1; }



.gba-route-line { flex:1; display:flex; align-items:center; }



.gba-route-line svg { display:block; }







.gba-trust-foot { margin-top:16px; font-size:12px; opacity:.92; line-height:1.5; color:#fff; font-weight:600; }







/* Email / Phone tabs */



.gba-tabs { display:flex; gap:6px; margin-bottom:20px; border-bottom:2px solid var(--gba-border); }



.gba-tab { flex:1; background:transparent; border:none; padding:12px 8px; font-size:14.5px; font-weight:800; color:var(--gba-muted); cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-2px; transition:color .2s,border-color .2s; }



.gba-tab:hover { color:var(--gba-ink); }



.gba-tab.active { color:var(--gba-orange); border-bottom-color:var(--gba-orange); }







/* Bottom legal bar */



.gba-bottom-bar { margin-top:22px; padding-top:16px; border-top:1px solid var(--gba-border); display:flex; flex-direction:column; gap:8px; font-size:11.5px; color:var(--gba-muted); text-align:center; }



.gba-bottom-bar a { color:var(--gba-muted); text-decoration:none; }



.gba-bottom-bar a:hover { color:var(--gba-orange); }



.gba-bottom-bar .gba-legal { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }



.gba-bottom-bar .gba-pay { font-weight:700; color:var(--gba-body); letter-spacing:.3px; }







/* Service icons (truck/refresh/card/headset) use gb_login_icon stroke */



.gba-foot-icons .fi .gb-ico { width:20px; height:20px; stroke:var(--gba-orange); }



/* ===== Login form polish (fix label overlap) ===== */

.gba-login-form label { gap: 8px; }

.gba-login-form label:not(.gba-remember) { margin-bottom: 4px; }

.gba-login-form label.gba-pw-label { margin-top: 6px; }

.gba-in { height: 52px; }

.gba-in input { font-size: 14.5px; }

.gba-forgot { top: -2px; }

/* Showcase image safety: never stretch */

.gba-prod img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 10px; }

.gba-prod { background: #fff; }


/* ===== Affiliate CTA (replaces promo box) ===== */
.gba-affiliate-cta { display:block; text-decoration:none; color:#fff; cursor:pointer; transition: transform .15s, box-shadow .2s; }
.gba-affiliate-cta:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(255,107,0,.34); }
.gba-affiliate-btn { display:inline-block; margin-top:10px; background:#fff; color:var(--gba-orange); font-weight:800; font-size:12.5px; padding:7px 16px; border-radius:10px; }

/* === New dashboard (reference match) === */
.gba-welcome { display:flex; justify-content:space-between; align-items:center; background:linear-gradient(120deg,#FFF7F0,#FFF); border:1px solid #F0DFD0; border-radius:18px; padding:20px 24px; margin-bottom:18px; }
.gba-welcome-l { display:flex; gap:14px; align-items:center; }
.gba-welcome-av { width:56px; height:56px; border-radius:50%; overflow:hidden; background:#FF6A00; color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:800; }
.gba-welcome-av img { width:100%; height:100%; object-fit:cover; }
.gba-welcome h2 { font-size:22px; margin:0; color:#1F2430; }
.gba-welcome-sub { margin:2px 0 0; color:#6B7280; font-size:13px; }
.gba-member-badge { background:#FFE9D6; color:#C2410C; font-size:12px; font-weight:800; padding:6px 12px; border-radius:10px; display:inline-flex; align-items:center; gap:6px; }
.gba-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:18px; }
.gba-stat { background:#fff; border:1px solid #EEF0F4; border-radius:16px; padding:16px; }
.gba-stat-ic { width:42px; height:42px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:18px; margin-bottom:10px; }
.gba-stat-ic.c-orange { background:#FFF1E6; color:#FF6A00; } .gba-stat-ic.c-blue { background:#E6F0FF; color:#2563EB; } .gba-stat-ic.c-green { background:#ECFDF3; color:#16A34A; } .gba-stat-ic.c-purple { background:#F3E8FF; color:#9333EA; }
.gba-stat-num { font-size:26px; font-weight:900; color:#1F2430; }
.gba-stat-lbl { font-size:12px; color:#8A92A3; margin-top:2px; }
.gba-dash-grid2 { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:16px; margin-bottom:16px; }
.gba-card { background:#fff; border:1px solid #EEF0F4; border-radius:16px; padding:18px; }
.gba-card h2 { font-size:16px; margin:0 0 14px; color:#1F2430; }
.gba-recent-head, .gba-box-head, .gba-rec-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.gba-recent-head a, .gba-box-head a, .gba-rec-head a { color:#FF6A00; font-size:12px; font-weight:700; text-decoration:none; }
.gba-order { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid #F4F5F8; }
.gba-order:last-child { border-bottom:none; }
.gba-order-l { display:flex; gap:12px; align-items:center; }
.gba-order-img { width:48px; height:48px; border-radius:10px; object-fit:contain; background:#F8FAFC; border:1px solid #F0F2F6; flex:0 0 auto; }
.gba-order-ph { display:flex; align-items:center; justify-content:center; color:#C0C6D2; }
.gba-order h3 { font-size:13px; margin:0; color:#1F2430; }
.gba-order p { font-size:11px; color:#8A92A3; margin:2px 0 0; }
.gba-status { font-size:11px; font-weight:700; padding:3px 9px; border-radius:8px; }
.gba-status.is-delivered { background:#ECFDF3; color:#15803D; } .gba-status.is-processing { background:#FFF1E6; color:#C2410C; } .gba-status.is-shipped { background:#E6F0FF; color:#2563EB; } .gba-status.is-cancelled { background:#FEE2E2; color:#B91C1C; } .gba-status.is-pending { background:#FEF9C3; color:#A16207; }
.gba-order-price { font-size:13px; font-weight:800; color:#1F2430; white-space:nowrap; }
/* donut */
.gba-donut-ring { position:relative; width:160px; height:160px; margin:0 auto 14px; border-radius:50%; }
.gba-donut-ring::after { content:''; position:absolute; inset:30px; background:#fff; border-radius:50%; z-index:1; }
.gba-donut-center { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; }
.gba-donut-center { position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; pointer-events:none; }
.gba-donut-center b { font-size:24px; color:#1F2430; } .gba-donut-center small { font-size:11px; color:#8A92A3; }
.gba-donut-legend { display:flex; flex-direction:column; gap:7px; }
.gba-donut-leg { display:flex; align-items:center; gap:8px; font-size:12.5px; color:#475569; } .gba-donut-leg b { margin-left:auto; color:#1F2430; }
.gba-dot { width:10px; height:10px; border-radius:50%; flex:0 0 auto; }
/* account overview */
.gba-ov-row { display:flex; justify-content:space-between; font-size:13px; padding:8px 0; border-bottom:1px solid #F4F5F8; }
.gba-ov-row span { color:#8A92A3; } .gba-ov-row b { color:#1F2430; font-weight:600; text-align:right; }
.gba-edit-btn { display:block; text-align:center; margin-top:14px; background:#FF6A00; color:#fff; padding:10px; border-radius:11px; text-decoration:none; font-weight:700; font-size:13px; }
/* grid3 */
.gba-dash-grid3 { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:18px; }
.gba-box h3 { font-size:14px; margin:0; color:#1F2430; }
.gba-addr { padding:10px 0; border-bottom:1px solid #F4F5F8; } .gba-addr:last-child { border-bottom:none; }
.gba-addr b { font-size:13px; color:#1F2430; } .gba-default { background:#ECFDF3; color:#15803D; font-size:10px; padding:2px 7px; border-radius:6px; margin-left:6px; }
.gba-addr p { font-size:11.5px; color:#6B7280; margin:3px 0 0; }
.gba-pm { display:flex; align-items:center; gap:9px; padding:9px 0; border-bottom:1px solid #F4F5F8; font-size:13px; color:#475569; } .gba-pm:last-child { border-bottom:none; } .gba-pm i { color:#FF6A00; }
.gba-coupon { background:#FFF8F2; border:1px dashed #FFB877; border-radius:11px; padding:10px; margin-bottom:9px; }
.gba-coupon b { color:#C2410C; font-size:13px; } .gba-coupon span { display:block; font-size:11px; color:#8A92A3; } .gba-coupon small { font-size:10px; color:#B0B6C3; }
.gba-exclusive { background:linear-gradient(135deg,#7C3AED,#A855F7); border-radius:16px; padding:20px; color:#fff; }
.gba-ex-ic { font-size:32px; }
.gba-exclusive h3 { font-size:15px; margin:8px 0 4px; }
.gba-exclusive p { font-size:12px; opacity:.9; margin:0 0 12px; }
.gba-shop-btn { display:inline-block; background:#fff; color:#FF6A00; padding:8px 16px; border-radius:10px; font-weight:800; font-size:12px; text-decoration:none; }
/* recommended */
.gba-rec-head h2 { font-size:17px; color:#1F2430; margin:0; }
.gba-rec-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:14px; }
.gba-rec-card { background:#fff; border:1px solid #EEF0F4; border-radius:14px; padding:10px; text-align:center; transition:.2s; }
.gba-rec-card:hover { box-shadow:0 10px 26px rgba(255,106,0,.12); transform:translateY(-4px); }
.gba-rec-card img { width:100%; height:110px; object-fit:contain; margin-bottom:8px; }
.gba-rec-name { font-size:12px; font-weight:600; color:#1F2430; min-height:32px; line-height:1.3; }
.gba-rec-price { font-size:14px; font-weight:800; color:#1F2430; margin:4px 0 8px; }
.gba-rec-add { display:block; background:#FF6A00; color:#fff; padding:8px; border-radius:9px; font-size:12px; font-weight:700; text-decoration:none; }
@media (max-width:1100px){ .gba-stats{grid-template-columns:repeat(2,1fr)} .gba-dash-grid2,.gba-dash-grid3{grid-template-columns:1fr} .gba-rec-grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width:700px){ .gba-rec-grid{grid-template-columns:repeat(2,1fr)} }

