@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;
500;
600;
700;
800;
900&display=swap');

:root{
--gx-primary:#f16821;
--gx-primary-dk:#c4511a;
--gx-primary-lt:#fff4ed;
--gx-primary-glow:rgba(241,104,33,.18);
--gx-dark:#0f172a;
--gx-dark2:#1e293b;
--gx-dark3:#334155;
--gx-gold:#c8a96e;
--gx-gold-lt:#f5e6c8;
--gx-green:#16a34a;
--gx-green-lt:#f0fdf4;
--gx-blue:#2563eb;
--gx-blue-lt:#eff6ff;
--gx-red:#dc2626;
--gx-red-lt:#fff5f5;
--gx-yellow:#d97706;
--gx-yellow-lt:#fffbeb;
--gx-purple:#7c3aed;
--gx-purple-lt:#f5f3ff;
--gx-bg:#f8fafc;
--gx-bg2:#f1f5f9;
--gx-white:#ffffff;
--gx-border:#e2e8f0;
--gx-border2:#cbd5e1;
--gx-muted:#94a3b8;
--gx-sub:#64748b;
--gx-text:#0f172a;
--gx-font:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
--gx-r:12px;
--gx-rsm:8px;
--gx-rxs:6px;
--gx-r-full:9999px;
--gx-sh-xs:0 1px 2px rgba(0,0,0,.05);
--gx-sh:0 1px 4px rgba(0,0,0,.06),0 4px 12px rgba(0,0,0,.06);
--gx-sh-md:0 4px 16px rgba(0,0,0,.10);
--gx-sh-lg:0 12px 40px rgba(0,0,0,.14);
--gx-sh-primary:0 4px 16px rgba(241,104,33,.28);
--gx-tr:.18s ease;
--gx-tr-slow:.32s ease;
--gx-sidebar-w:230px
}
.gx-dashboard,.gx-search-page,.gx-vendor-profile,.gx-vendor-store,.gx-auth-wrap,.gx-auction-wrap,.gx-boq-wrap,.gx-neg-wrap,.gx-rental-wrap,.gx-rental-detail-wrap,.gx-earnings-wrap,.gx-morning-dashboard,.gx-admin-wrap,.gx-sv-dashboard,.gx-compare-wrap,.gx-compare-vendors-wrap,.gx-dash-wrap,.gx-modal,.gx-modal-overlay{
font-family:var(--gx-font) !important;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale
}
.gx-sidebar{
background:linear-gradient(180deg,#0c1829 0%,#111e2e 35%,#132030 70%,#0f1b2a 100%) !important;
border-right:1px solid rgba(241,104,33,.12);
box-shadow:4px 0 24px rgba(0,0,0,.18)
}
.gx-sidebar-brand{
background:rgba(255,255,255,.03);
border-bottom:1px solid rgba(255,255,255,.07) !important;
padding:18px 16px
}
.gx-vendor-logo{
border:2.5px solid rgba(241,104,33,.5) !important;
box-shadow:0 0 0 3px rgba(241,104,33,.12)
}
.gx-sidebar-brand h4{
font-weight:700 !important;
font-size:.84rem !important;
letter-spacing:-.01em
}
.gx-sidebar-nav{
padding:10px 0 !important
}
.gx-nav-link{
font-size:.82rem !important;
font-weight:500 !important;
padding:10px 18px !important;
margin:1px 8px;
border-radius:var(--gx-rsm);
border-left:3px solid transparent !important;
color:rgba(255,255,255,.6) !important;
transition:all var(--gx-tr) !important;
letter-spacing:.01em
}
.gx-nav-link:hover{
background:rgba(255,255,255,.06) !important;
color:rgba(255,255,255,.92) !important;
text-decoration:none !important;
transform:translateX(2px)
}
.gx-nav-link.active{
background:linear-gradient(90deg,rgba(241,104,33,.22) 0%,rgba(241,104,33,.06) 100%) !important;
border-left-color:var(--gx-primary) !important;
color:#fff !important;
font-weight:600 !important
}
.gx-nav-link.active::after{
content:'';
position:absolute;
right:0;
top:0;
bottom:0;
width:3px;
background:var(--gx-primary);
border-radius:var(--gx-rxs) 0 0 var(--gx-rxs);
opacity:.35
}
.gx-nav-logout{
border-top:1px solid rgba(255,255,255,.07) !important;
margin-top:8px;
color:rgba(220,38,38,.75) !important
}
.gx-nav-logout:hover{
background:rgba(220,38,38,.08) !important;
color:#ef4444 !important
}
.gx-sidebar-footer{
border-top:1px solid rgba(255,255,255,.06) !important;
font-size:.7rem;
color:rgba(255,255,255,.28) !important
}
.gx-topbar{
background:rgba(255,255,255,.88) !important;
backdrop-filter:blur(14px) !important;
-webkit-backdrop-filter:blur(14px) !important;
border-bottom:1px solid rgba(226,232,240,.7) !important;
box-shadow:0 1px 0 rgba(0,0,0,.04),0 4px 16px rgba(0,0,0,.05) !important
}
.gx-page-title{
font-weight:800 !important;
font-size:.94rem !important;
letter-spacing:-.02em;
color:var(--gx-dark) !important
}
.gx-stat-card,.gx-kpi-card,.gxa-stat-card{
background:#fff !important;
border:1px solid var(--gx-border) !important;
border-top:none !important;
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
position:relative;
overflow:hidden;
transition:transform var(--gx-tr),box-shadow var(--gx-tr) !important
}
.gx-stat-card::before,.gx-kpi-card::before{
content:'';
position:absolute;
top:0;
left:0;
right:0;
height:3px;
background:linear-gradient(90deg,var(--gx-primary),#ff9a3c);
border-radius:var(--gx-r) var(--gx-r) 0 0
}
.gx-kpi-card.gx-kpi-success::before{
background:linear-gradient(90deg,var(--gx-green),#4ade80)
}
.gx-kpi-card.gx-kpi-warn::before{
background:linear-gradient(90deg,var(--gx-yellow),#fbbf24)
}
.gxa-stat-card.success::before{
background:linear-gradient(90deg,var(--gx-green),#4ade80)
}
.gxa-stat-card.warn::before{
background:linear-gradient(90deg,var(--gx-yellow),#fbbf24)
}
.gxa-stat-card.danger::before{
background:linear-gradient(90deg,var(--gx-red),#f87171)
}
.gx-stat-card::after,.gx-kpi-card::after{
content:'';
position:absolute;
top:-24px;
right:-24px;
width:72px;
height:72px;
background:radial-gradient(circle,var(--gx-primary-glow) 0%,transparent 70%);
border-radius:50%;
pointer-events:none
}
.gx-stat-card:hover,.gx-kpi-card:hover{
transform:translateY(-3px) !important;
box-shadow:var(--gx-sh-md) !important
}
.gx-stat-val,.gx-kpi-val,.gxa-stat-val{
font-size:1.5rem !important;
font-weight:900 !important;
letter-spacing:-.03em;
background:linear-gradient(135deg,var(--gx-dark) 0%,var(--gx-primary) 200%);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text;
line-height:1.15 !important
}
.gx-stat-label,.gx-kpi-lbl,.gxa-stat-lbl{
font-size:.72rem !important;
font-weight:600 !important;
color:var(--gx-sub) !important;
text-transform:uppercase;
letter-spacing:.04em;
margin-top:5px !important
}
.gx-card{
border:1px solid var(--gx-border) !important;
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
transition:box-shadow var(--gx-tr) !important
}
.gx-card:hover{
box-shadow:var(--gx-sh-md) !important
}
.gx-card-header{
padding:14px 20px !important;
border-bottom:1px solid var(--gx-border) !important;
background:var(--gx-bg) !important
}
.gx-card-header h4{
font-size:.9rem !important;
font-weight:800 !important;
letter-spacing:-.01em
}
.gx-card-body{
padding:20px !important
}
.gx-dash-panel{
border:1px solid var(--gx-border) !important;
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important
}
.gx-btn{
font-family:var(--gx-font) !important;
font-weight:600 !important;
letter-spacing:.01em;
border-radius:var(--gx-rsm) !important;
transition:all var(--gx-tr) !important;
position:relative;
overflow:hidden
}
.gx-btn::after{
content:'';
position:absolute;
inset:0;
background:rgba(255,255,255,.12);
opacity:0;
transition:opacity .15s
}
.gx-btn:active::after{
opacity:1
}
.gx-btn-primary{
background:linear-gradient(135deg,#f16821 0%,#e05818 100%) !important;
box-shadow:var(--gx-sh-primary) !important;
color:#fff !important;
border:none !important
}
.gx-btn-primary:hover{
background:linear-gradient(135deg,#e05818 0%,#c4511a 100%) !important;
box-shadow:0 6px 22px rgba(241,104,33,.38) !important;
transform:translateY(-2px) !important;
color:#fff !important;
text-decoration:none !important
}
.gx-btn-secondary{
background:var(--gx-dark) !important;
color:#fff !important;
box-shadow:0 2px 8px rgba(0,0,0,.18) !important
}
.gx-btn-secondary:hover{
background:var(--gx-dark2) !important;
transform:translateY(-1px) !important;
text-decoration:none !important
}
.gx-btn-outline{
border:1.5px solid var(--gx-border) !important;
color:var(--gx-dark) !important;
background:#fff !important
}
.gx-btn-outline:hover{
border-color:var(--gx-primary) !important;
color:var(--gx-primary) !important;
background:var(--gx-primary-lt) !important;
text-decoration:none !important
}
.gx-btn-danger{
background:var(--gx-red-lt) !important;
border:1.5px solid rgba(220,38,38,.3) !important;
color:var(--gx-red) !important
}
.gx-btn-danger:hover{
background:var(--gx-red) !important;
color:#fff !important;
border-color:var(--gx-red) !important;
text-decoration:none !important
}
.gx-btn-success{
background:linear-gradient(135deg,#16a34a,#15803d) !important;
color:#fff !important;
box-shadow:0 4px 14px rgba(22,163,74,.28) !important
}
.gx-btn-ai{
background:linear-gradient(135deg,#7c3aed,#6d28d9) !important;
color:#fff !important;
border:none !important;
box-shadow:0 4px 14px rgba(124,58,237,.28) !important
}
.gx-btn-ai:hover{
background:linear-gradient(135deg,#6d28d9,#5b21b6) !important;
color:#fff !important;
text-decoration:none !important
}
.gx-btn-whatsapp{
background:linear-gradient(135deg,#25d366,#1db954) !important;
color:#fff !important;
box-shadow:0 4px 14px rgba(37,211,102,.3) !important
}
.gx-btn:disabled{
opacity:.5 !important;
cursor:not-allowed !important;
transform:none !important;
box-shadow:none !important
}
.gxa-btn-approve{
font-family:var(--gx-font) !important;
font-weight:600 !important;
border-radius:var(--gx-rxs) !important;
transition:all var(--gx-tr) !important
}
.gxa-btn-reject{
font-family:var(--gx-font) !important;
font-weight:600 !important;
border-radius:var(--gx-rxs) !important;
transition:all var(--gx-tr) !important
}
.gx-badge{
font-family:var(--gx-font) !important;
font-weight:600 !important;
font-size:.68rem !important;
letter-spacing:.02em
}
.gx-status-badge,.gx-status-pill,.gx-type-badge{
font-family:var(--gx-font) !important;
font-weight:600 !important;
letter-spacing:.02em
}
.gx-table{
font-family:var(--gx-font) !important;
font-size:.84rem !important
}
.gx-table thead th{
font-weight:700 !important;
font-size:.72rem !important;
text-transform:uppercase;
letter-spacing:.05em;
color:var(--gx-sub) !important;
background:var(--gx-bg) !important;
padding:10px 14px !important;
border-bottom:2px solid var(--gx-border) !important
}
.gx-table tbody td{
padding:12px 14px !important;
vertical-align:middle;
border-bottom:1px solid var(--gx-bg2) !important;
transition:background var(--gx-tr)
}
.gx-table tbody tr:hover td{
background:#f8f9ff !important
}
.gxa-admin-table{
font-family:var(--gx-font) !important
}
.gxa-admin-table th{
font-weight:700 !important;
font-size:.72rem !important;
letter-spacing:.04em;
text-transform:uppercase
}
.gx-form-group input,.gx-form-group select,.gx-form-group textarea,.gxa-input,.gx-form-input,.gx-bid-input,.gx-neg-form input,.gx-neg-form textarea,.gx-neg-form select{
font-family:var(--gx-font) !important;
font-size:.875rem !important;
border:1.5px solid var(--gx-border) !important;
border-radius:var(--gx-rsm) !important;
transition:border-color var(--gx-tr),box-shadow var(--gx-tr) !important;
background:#fff !important
}
.gx-form-group input:focus,.gx-form-group select:focus,.gx-form-group textarea:focus,.gxa-input:focus,.gx-form-input:focus,.gx-bid-input:focus,.gx-neg-form input:focus,.gx-neg-form textarea:focus{
border-color:var(--gx-primary) !important;
box-shadow:0 0 0 3px var(--gx-primary-glow) !important;
outline:none !important
}
.gx-form-group label,.gxa-form-group label,.gx-neg-form label{
font-size:.78rem !important;
font-weight:600 !important;
color:var(--gx-sub) !important;
letter-spacing:.02em
}
.gx-modal-overlay,.gxa-modal-overlay{
backdrop-filter:blur(6px) !important;
-webkit-backdrop-filter:blur(6px) !important;
background:rgba(15,23,42,.55) !important
}
.gx-modal-content,.gx-modal,.gxa-modal-box{
border-radius:16px !important;
box-shadow:0 24px 64px rgba(0,0,0,.22),0 0 0 1px rgba(255,255,255,.08) !important;
font-family:var(--gx-font) !important
}
.gx-modal-header{
padding:18px 22px !important;
border-bottom:1px solid var(--gx-border) !important;
background:var(--gx-bg) !important;
border-radius:16px 16px 0 0 !important
}
.gx-modal-header h3{
font-weight:800 !important;
letter-spacing:-.02em
}
.gx-profile-banner{
background:linear-gradient(135deg,#0c1829 0%,#1a2e4a 40%,#c4511a 120%) !important;
min-height:220px !important;
border-radius:var(--gx-r) !important;
position:relative;
overflow:hidden
}
.gx-profile-banner::after{
content:'';
position:absolute;
inset:0;
background-image:radial-gradient(ellipse at 80% 50%,rgba(241,104,33,.18) 0%,transparent 60%),repeating-linear-gradient( 45deg,transparent,transparent 30px,rgba(255,255,255,.015) 30px,rgba(255,255,255,.015) 31px );
pointer-events:none
}
.gx-profile-avatar img{
border:3px solid rgba(255,255,255,.85) !important;
box-shadow:0 4px 20px rgba(0,0,0,.3) !important
}
.gx-profile-hero-info h1{
font-weight:900 !important;
letter-spacing:-.03em;
text-shadow:0 2px 12px rgba(0,0,0,.3)
}
.gx-quick-stats{
box-shadow:var(--gx-sh-md) !important;
border-radius:0 0 var(--gx-r) var(--gx-r) !important
}
.gx-qs-item strong{
font-weight:900 !important;
font-size:1.25rem !important
}
.gx-store-banner{
height:260px !important;
border-radius:var(--gx-r) var(--gx-r) 0 0 !important
}
.gx-store-banner::after{
background:linear-gradient(to bottom,transparent 30%,rgba(0,0,0,.55) 100%) !important
}
.gx-store-header{
border-radius:0 0 var(--gx-r) var(--gx-r) !important;
box-shadow:var(--gx-sh) !important
}
.gx-search-hero{
background:linear-gradient(135deg,#0c1829 0%,#1a2e4a 50%,#c4511a 140%) !important;
border-radius:var(--gx-r) !important;
position:relative;
overflow:hidden
}
.gx-search-hero::before{
content:'';
position:absolute;
inset:0;
background-image:radial-gradient(ellipse at 90% 20%,rgba(241,104,33,.22) 0%,transparent 55%),radial-gradient(ellipse at 10% 80%,rgba(37,99,235,.12) 0%,transparent 50%);
pointer-events:none
}
.gx-search-hero h1{
font-weight:900 !important;
letter-spacing:-.04em !important;
font-size:2.4rem !important
}
.gx-search-bar input{
font-family:var(--gx-font) !important;
background:rgba(255,255,255,.14) !important;
border:1.5px solid rgba(255,255,255,.2) !important;
border-radius:var(--gx-rsm) !important;
backdrop-filter:blur(8px)
}
.gx-search-bar input:focus{
background:rgba(255,255,255,.22) !important;
border-color:rgba(255,255,255,.5) !important;
outline:none !important;
box-shadow:0 0 0 3px rgba(255,255,255,.1) !important
}
.gx-search-filters{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
border:1px solid var(--gx-border) !important
}
.gx-vendor-card{
border-radius:var(--gx-r) !important;
border:1px solid var(--gx-border) !important;
box-shadow:var(--gx-sh) !important;
transition:transform var(--gx-tr),box-shadow var(--gx-tr) !important;
will-change:transform
}
.gx-vendor-card:hover{
transform:translateY(-4px) !important;
box-shadow:0 16px 40px rgba(0,0,0,.12),0 0 0 1px rgba(241,104,33,.08) !important
}
.gx-prod-card{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
transition:transform var(--gx-tr),box-shadow var(--gx-tr) !important
}
.gx-prod-card:hover{
transform:translateY(-3px) !important;
box-shadow:var(--gx-sh-md) !important
}
.gx-rental-card{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
border:1px solid var(--gx-border) !important;
transition:transform var(--gx-tr),box-shadow var(--gx-tr) !important
}
.gx-rental-card:hover{
transform:translateY(-4px) !important;
box-shadow:var(--gx-sh-md) !important
}
.gx-gallery-main{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh-md) !important;
border:1px solid var(--gx-border) !important
}
.gp-topbar{
background:var(--gx-dark) !important
}
.gp-breadcrumb{
font-family:var(--gx-font);
font-size:.78rem !important
}
.gx-auth-wrap{
background:linear-gradient(135deg,#f8fafc 0%,#fff4ed 50%,#f0f7ff 100%) !important;
position:relative
}
.gx-auth-wrap::before{
content:'';
position:absolute;
inset:0;
background-image:radial-gradient(ellipse at 20% 80%,rgba(241,104,33,.07) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(37,99,235,.05) 0%,transparent 50%);
pointer-events:none
}
.gx-auth-card{
border-radius:20px !important;
box-shadow:0 8px 40px rgba(0,0,0,.1),0 0 0 1px rgba(226,232,240,.8) !important;
position:relative;
z-index:1
}
.gx-auth-logo-text{
font-size:1.7rem !important;
font-weight:900 !important;
letter-spacing:-.04em !important;
background:linear-gradient(135deg,var(--gx-primary),#ff7f3f);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text
}
.gx-auth-title{
font-weight:800 !important;
letter-spacing:-.02em !important
}
.gx-auth-tab-row{
background:var(--gx-bg2) !important;
border-radius:10px !important
}
.gx-auth-tab.active{
color:var(--gx-primary) !important;
box-shadow:0 2px 8px rgba(0,0,0,.08) !important
}
.gx-morning-dashboard{
background:#0d0d0d !important;
font-family:var(--gx-font) !important
}
.gx-pd-title{
font-weight:900 !important;
letter-spacing:-.04em !important;
font-size:1.5rem !important
}
.gx-auction-hero{
background:linear-gradient(135deg,#0c1829 0%,#1a2e4a 60%,#1c2432 100%) !important;
border-radius:14px !important;
position:relative;
overflow:hidden
}
.gx-auction-hero::before{
content:'';
position:absolute;
top:-60px;
right:-60px;
width:220px;
height:220px;
background:radial-gradient(circle,rgba(241,104,33,.12) 0%,transparent 70%);
pointer-events:none
}
.gx-auction-title{
font-weight:900 !important;
letter-spacing:-.03em !important
}
.gx-bid-panel{
border-radius:14px !important;
border:1px solid var(--gx-border) !important;
box-shadow:var(--gx-sh) !important
}
.gx-bid-feed-wrap{
border-radius:14px !important;
border:1px solid var(--gx-border) !important;
box-shadow:var(--gx-sh) !important
}
#gxa-countdown{
font-size:1.8rem !important;
font-weight:900 !important;
letter-spacing:-.04em;
color:var(--gx-primary) !important
}
#gx-chatbot-bubble{
background:linear-gradient(135deg,#b8860b,#d4a017) !important;
box-shadow:0 4px 24px rgba(184,134,11,.5),0 0 0 4px rgba(184,134,11,.12) !important;
transition:transform .22s ease,box-shadow .22s ease !important
}
#gx-chatbot-bubble:hover{
transform:scale(1.1) !important;
box-shadow:0 8px 32px rgba(184,134,11,.65),0 0 0 6px rgba(184,134,11,.14) !important
}
.gx-notif-dropdown{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh-lg) !important;
border:1px solid var(--gx-border) !important
}
.gx-notif-item.unread{
background:var(--gx-primary-lt) !important;
border-left:3px solid var(--gx-primary)
}
.gx-notif-btn:hover{
border-color:var(--gx-primary) !important;
color:var(--gx-primary) !important;
background:var(--gx-primary-lt) !important
}
.gx-toast{
font-family:var(--gx-font) !important;
font-weight:600 !important;
border-radius:10px !important;
box-shadow:0 8px 24px rgba(0,0,0,.22) !important;
letter-spacing:.01em
}
.gx-toast.success{
background:linear-gradient(135deg,#16a34a,#15803d) !important
}
.gx-toast.error{
background:linear-gradient(135deg,#dc2626,#b91c1c) !important
}
.gx-toast.info{
background:linear-gradient(135deg,#1e293b,#0f172a) !important
}
.gx-page-btn{
font-family:var(--gx-font) !important;
font-weight:600 !important;
border-radius:var(--gx-rsm) !important;
transition:all var(--gx-tr) !important
}
.gx-page-btn.active,.gx-page-btn:hover{
background:var(--gx-primary-lt) !important;
border-color:var(--gx-primary) !important;
color:var(--gx-primary) !important
}
.gx-empty-state{
padding:40px 20px !important;
background:var(--gx-bg) !important;
border-radius:var(--gx-r) !important;
border:1px dashed var(--gx-border) !important
}
.gx-empty-icon,.gx-empty-state .gx-empty-icon{
font-size:2.8rem !important;
margin-bottom:12px !important
}
.gx-empty-state p{
font-size:.9rem !important;
color:var(--gx-sub) !important;
font-weight:500 !important;
margin-bottom:16px !important
}
.gx-admin-wrap{
font-family:var(--gx-font) !important
}
.gxa-stat-card{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
border:1px solid var(--gx-border) !important;
position:relative;
overflow:hidden;
padding:16px !important;
transition:box-shadow var(--gx-tr) !important
}
.gxa-stat-card:hover{
box-shadow:var(--gx-sh-md) !important
}
.gxa-stat-card.primary::before{
background:var(--gx-primary)
}
.gxa-stat-card::before{
content:'';
position:absolute;
top:0;
left:0;
right:0;
height:3px;
background:var(--gx-border2)
}
.gx-settings-tabs{
border-radius:var(--gx-r) !important;
border:1px solid var(--gx-border) !important
}
.gx-settings-tab{
font-family:var(--gx-font) !important;
border-radius:var(--gx-rsm) !important;
font-weight:600 !important;
transition:all var(--gx-tr) !important
}
.gx-settings-tab.active{
background:var(--gx-primary) !important;
color:#fff !important
}
.gx-settings-section{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
border:1px solid var(--gx-border) !important
}
.gxa-qa-btn{
font-family:var(--gx-font) !important;
border-radius:var(--gx-rsm) !important;
transition:all var(--gx-tr) !important
}
.gx-boq-drop-zone{
border-radius:var(--gx-r) !important;
border:2px dashed var(--gx-border) !important;
transition:all var(--gx-tr) !important
}
.gx-boq-drop-zone:hover,.gx-boq-drop-zone.drag-over{
border-color:var(--gx-primary) !important;
background:var(--gx-primary-lt) !important;
box-shadow:0 0 0 4px var(--gx-primary-glow) !important
}
.gx-boq-step{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important
}
.gx-neg-card{
box-shadow:0 2px 10px rgba(0,0,0,.07) !important;
border-radius:14px 14px 14px 0 !important
}
.mine .gx-neg-card{
background:linear-gradient(135deg,#fff4ed,#fff8f4) !important;
border-color:var(--gx-primary) !important;
border-radius:14px 14px 0 14px !important
}
.gx-neg-price{
font-weight:900 !important;
letter-spacing:-.02em
}
.gx-step.active{
background:linear-gradient(135deg,var(--gx-primary),#ff9a3c) !important;
box-shadow:0 4px 12px var(--gx-primary-glow) !important
}
.gx-earn-card.gx-earn-available{
background:linear-gradient(135deg,#f0fdf4,#ffffff) !important;
border-color:var(--gx-green) !important;
box-shadow:0 4px 16px rgba(22,163,74,.12) !important
}
.gx-earn-val{
font-weight:900 !important;
letter-spacing:-.02em
}
.gx-loyalty-pts{
font-weight:900 !important;
letter-spacing:-.03em;
background:linear-gradient(135deg,var(--gx-gold),#e8b86d);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
background-clip:text
}
@keyframes gx-skeleton-shimmer{
0%{
background-position:-400px 0
}
100%{
background-position:400px 0
}

}
.gx-skeleton{
background:linear-gradient( 90deg,#f0f0f0 25%,#e4e4e4 50%,#f0f0f0 75% ) !important;
background-size:800px 100% !important;
animation:gx-skeleton-shimmer 1.4s ease infinite !important;
border-radius:var(--gx-rsm) !important;
color:transparent !important
}
@keyframes gx-fade-up{
from{
opacity:0;
transform:translateY(10px)
}
to{
opacity:1;
transform:translateY(0)
}

}
.gx-stats-grid .gx-stat-card,.gx-dash-kpi .gx-kpi-card{
animation:gx-fade-up .3s ease both
}
.gx-stats-grid .gx-stat-card:nth-child(1),.gx-dash-kpi .gx-kpi-card:nth-child(1){
animation-delay:.04s
}
.gx-stats-grid .gx-stat-card:nth-child(2),.gx-dash-kpi .gx-kpi-card:nth-child(2){
animation-delay:.08s
}
.gx-stats-grid .gx-stat-card:nth-child(3),.gx-dash-kpi .gx-kpi-card:nth-child(3){
animation-delay:.12s
}
.gx-stats-grid .gx-stat-card:nth-child(4),.gx-dash-kpi .gx-kpi-card:nth-child(4){
animation-delay:.16s
}
.gx-stats-grid .gx-stat-card:nth-child(5),.gx-dash-kpi .gx-kpi-card:nth-child(5){
animation-delay:.20s
}
.gx-stats-grid .gx-stat-card:nth-child(6),.gx-dash-kpi .gx-kpi-card:nth-child(6){
animation-delay:.24s
}
@media (prefers-reduced-motion:reduce){
.gx-stats-grid .gx-stat-card,.gx-dash-kpi .gx-kpi-card{
animation:none !important
}
.gx-btn,.gx-vendor-card,.gx-prod-card,.gx-rental-card{
transition:none !important
}

}
.gx-sidebar::-webkit-scrollbar,#gxa-bid-feed::-webkit-scrollbar,.gx-modal-content::-webkit-scrollbar,.gx-notif-dropdown::-webkit-scrollbar{
width:5px
}
.gx-sidebar::-webkit-scrollbar-track,#gxa-bid-feed::-webkit-scrollbar-track,.gx-modal-content::-webkit-scrollbar-track{
background:transparent
}
.gx-sidebar::-webkit-scrollbar-thumb,#gxa-bid-feed::-webkit-scrollbar-thumb,.gx-modal-content::-webkit-scrollbar-thumb{
background:rgba(100,116,139,.35);
border-radius:10px
}
.gx-sidebar::-webkit-scrollbar-thumb:hover{
background:rgba(241,104,33,.5)
}
.gx-notice,.gxa-notice,.gxa-notice-success,.gxa-notice-error,.gxa-notice-info,.gxa-notice-warn{
font-family:var(--gx-font) !important;
border-radius:var(--gx-rsm) !important;
font-weight:500 !important
}
.gx-compare-table{
border-radius:var(--gx-r) !important;
box-shadow:var(--gx-sh) !important;
font-family:var(--gx-font) !important;
overflow:hidden
}
.gx-compare-table th{
font-family:var(--gx-font) !important;
font-size:.8rem !important;
letter-spacing:.02em
}
.gx-rate-card{
border-radius:var(--gx-rsm) !important;
transition:box-shadow var(--gx-tr) !important
}
.gx-rate-card:hover{
box-shadow:var(--gx-sh) !important
}
.gx-rate-card.gx-rate-featured{
background:linear-gradient(135deg,#fff4ed,#fff8f4) !important;
border-color:var(--gx-primary) !important
}
.gx-like-btn{
font-family:var(--gx-font) !important;
border-radius:var(--gx-r-full) !important;
transition:all .25s cubic-bezier(.34,1.56,.64,1) !important
}
.gx-sv-card{
border-radius:var(--gx-rsm) !important;
transition:border-color var(--gx-tr),box-shadow var(--gx-tr) !important
}
.gx-sv-card:hover{
border-color:var(--gx-primary) !important;
box-shadow:var(--gx-sh) !important
}
.gx-btn:focus-visible,.gx-nav-link:focus-visible,.gx-auth-tab:focus-visible,.gx-page-btn:focus-visible{
outline:2.5px solid var(--gx-primary) !important;
outline-offset:2px !important
}
@media (max-width:768px){
.gx-search-hero h1{
font-size:1.6rem !important
}
.gx-profile-hero-info h1{
font-size:1.25rem !important
}
.gx-stat-val{
font-size:1.25rem !important
}
.gx-auction-title{
font-size:1.15rem !important
}
.gx-auth-card{
padding:28px 22px !important
}
.gx-modal-content,.gx-modal{
border-radius:12px !important
}

}
@media (max-width:480px){
.gx-btn{
font-size:.8rem !important
}
.gx-stat-val{
font-size:1.15rem !important
}

}
.gx-dashboard-buyer{
max-width:1200px;
margin:0 auto;
padding:20px;
font-family:var(--gx-font) !important;
background:var(--gx-bg);
min-height:100vh
}
.gx-buyer-topbar{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:22px;
flex-wrap:wrap;
gap:12px;
padding-bottom:18px;
border-bottom:1px solid var(--gx-border)
}
.gx-buyer-title{
margin:0 !important;
font-size:1.35rem !important;
font-weight:900 !important;
color:var(--gx-dark) !important;
letter-spacing:-.03em;
font-family:var(--gx-font) !important
}
.gx-buyer-subtitle{
font-size:.82rem;
color:var(--gx-sub);
margin-top:3px;
font-family:var(--gx-font)
}
.gx-buyer-actions{
display:flex;
gap:8px;
flex-wrap:wrap;
align-items:center
}
.gx-stat-card-buyer{
text-align:center !important;
padding:18px 14px !important;
position:relative;
overflow:hidden
}
.gx-stat-card-buyer::before{
content:'';
position:absolute;
top:0;
left:0;
right:0;
height:3px;
background:linear-gradient(90deg,var(--gx-primary),#ff9a3c)
}
.gx-buyer-stat-icon{
font-size:1.4rem;
margin-bottom:6px;
display:block;
line-height:1
}
.gx-buyer-grid-2{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px;
margin-top:16px
}
.gx-buyer-grid-pmc{
display:grid;
grid-template-columns:2fr 1fr;
gap:16px;
margin-top:16px
}
.gx-buyer-panel{
background:var(--gx-white) !important;
border:1px solid var(--gx-border) !important;
border-radius:var(--gx-r) !important;
padding:18px !important;
box-shadow:var(--gx-sh);
transition:box-shadow var(--gx-tr)
}
.gx-buyer-panel:hover{
box-shadow:var(--gx-sh-md)
}
.gx-buyer-panel-sm{
margin-bottom:14px !important
}
.gx-buyer-panel-title{
margin:0 0 12px !important;
font-size:.92rem !important;
font-weight:800 !important;
color:var(--gx-dark) !important;
font-family:var(--gx-font) !important;
letter-spacing:-.01em;
padding-bottom:8px;
border-bottom:1px solid var(--gx-border)
}
.gx-buyer-row{
display:flex;
justify-content:space-between;
padding:7px 0;
border-bottom:1px solid var(--gx-bg2);
font-size:.83rem;
transition:background var(--gx-tr);
align-items:center
}
.gx-buyer-row:last-child{
border-bottom:none
}
.gx-buyer-row:hover{
background:var(--gx-bg) !important
}
.gx-buyer-row-meta{
color:var(--gx-muted) !important;
font-size:.75rem !important
}
.gx-buyer-view-all{
display:block;
text-align:center;
margin-top:12px;
font-size:.83rem;
color:var(--gx-primary) !important;
font-weight:600;
text-decoration:none !important;
transition:color var(--gx-tr)
}
.gx-buyer-view-all:hover{
color:var(--gx-primary-dk) !important;
text-decoration:underline !important
}
.gx-buyer-empty{
color:var(--gx-muted) !important;
text-align:center !important;
padding:18px 0 !important;
font-size:.84rem !important
}
.gx-buyer-locks-panel{
background:var(--gx-green-lt) !important;
border:1px solid #86efac !important;
border-radius:var(--gx-r) !important;
padding:14px !important;
margin-top:16px;
box-shadow:var(--gx-sh)
}
.gx-buyer-locks-title{
margin:0 0 10px !important;
font-size:.86rem !important;
font-weight:800 !important;
color:var(--gx-green) !important;
font-family:var(--gx-font) !important
}
.gx-buyer-lock-row{
display:flex;
justify-content:space-between;
font-size:.83rem;
padding:4px 0;
border-bottom:1px solid rgba(22,163,74,.12);
align-items:center
}
.gx-buyer-lock-row:last-child{
border-bottom:none
}
.gx-buyer-budget-panel{
background:var(--gx-green-lt) !important;
border-color:#86efac !important
}
.gx-buyer-budget-rows{
font-size:.84rem
}
.gx-transport-req-card{
border:1px solid var(--gx-border);
border-radius:var(--gx-rsm);
padding:12px;
margin-bottom:10px;
font-size:.83rem;
background:var(--gx-white);
transition:border-color var(--gx-tr),box-shadow var(--gx-tr)
}
.gx-transport-req-card:hover{
border-color:var(--gx-primary);
box-shadow:0 2px 12px rgba(241,104,33,.1)
}
.gx-transport-req-title{
font-weight:700;
margin-bottom:4px;
color:var(--gx-dark)
}
.gx-transport-req-route{
color:var(--gx-sub);
margin-bottom:8px;
font-size:.8rem
}
.gx-transport-req-footer{
display:flex;
justify-content:space-between;
align-items:center
}
.gx-tq-modal-box{
max-width:400px !important
}
.gx-tq-label{
font-size:.82rem;
font-weight:600;
display:block;
margin-bottom:4px;
color:var(--gx-sub);
font-family:var(--gx-font)
}
.gx-tq-input{
width:100%;
padding:9px 12px;
border:1.5px solid var(--gx-border);
border-radius:var(--gx-rsm);
box-sizing:border-box;
font-family:var(--gx-font);
font-size:.875rem;
transition:border-color var(--gx-tr),box-shadow var(--gx-tr);
background:var(--gx-white);
color:var(--gx-dark)
}
.gx-tq-input:focus{
border-color:var(--gx-primary);
box-shadow:0 0 0 3px var(--gx-primary-glow);
outline:none
}
@media (max-width:768px){
.gx-buyer-grid-2,.gx-buyer-grid-pmc{
grid-template-columns:1fr !important
}
.gx-dashboard-buyer{
padding:14px !important
}
.gx-buyer-topbar{
padding-bottom:14px
}

}
@media (max-width:480px){
.gx-buyer-title{
font-size:1.1rem !important
}

}
.gx-mt-sm{
margin-top:8px !important
}
.gx-mt-md{
margin-top:16px !important
}
.gx-mt-lg{
margin-top:24px !important
}
.gx-mb-sm{
margin-bottom:8px !important
}
.gx-mb-md{
margin-bottom:16px !important
}
.gx-ml-sm{
margin-left:8px !important
}
.gx-ml-auto{
margin-left:auto !important
}
.gx-text-right{
text-align:right !important
}
.gx-text-center{
text-align:center !important
}
.gx-font-bold{
font-weight:700 !important
}
.gx-text-muted{
font-size:.82rem;
color:var(--gx-sub) !important
}
.gx-text-tiny-muted{
font-size:.72rem;
color:var(--gx-muted) !important
}
.gx-text-danger{
color:var(--gx-red) !important;
font-weight:600
}
.gx-text-success{
color:var(--gx-green) !important;
font-weight:600
}
.gx-text-warning{
color:var(--gx-yellow) !important;
font-weight:600
}
.gx-clickable{
cursor:pointer !important
}
.gx-col-xs{
width:40px !important
}
.gx-input-narrow{
width:110px !important
}
.gx-btn-full{
width:100% !important;
text-align:center !important;
display:block !important;
justify-content:center
}
.gx-btn-danger-outline{
background:var(--gx-red-lt) !important;
border:1.5px solid rgba(220,38,38,.4) !important;
color:var(--gx-red) !important
}
.gx-btn-danger-outline:hover{
background:var(--gx-red) !important;
color:#fff !important;
border-color:var(--gx-red) !important
}
.gx-btn-row{
display:flex;
gap:8px;
flex-wrap:wrap;
align-items:center
}
.gx-page-actions{
display:flex;
gap:8px;
flex-wrap:wrap;
align-items:center
}
.gx-dashboard-2col{
display:grid;
grid-template-columns:1fr 1fr;
gap:16px
}
.gx-disabled-overlay{
opacity:.35 !important;
pointer-events:none !important;
user-select:none
}
.gx-page-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:22px;
flex-wrap:wrap;
gap:12px;
font-family:var(--gx-font) !important
}
.gx-page-title-h2{
margin:0 !important;
font-size:1.25rem !important;
font-weight:900 !important;
color:var(--gx-dark) !important;
letter-spacing:-.03em;
font-family:var(--gx-font) !important
}
.gx-section-title-sm{
margin-top:14px !important;
font-size:.9rem !important;
font-weight:800 !important;
color:var(--gx-dark) !important;
font-family:var(--gx-font) !important
}
.gx-empty-card{
text-align:center;
padding:48px 24px;
background:var(--gx-white);
border-radius:14px;
border:1px solid var(--gx-border);
box-shadow:var(--gx-sh)
}
.gx-empty-card-lg{
padding:60px 24px !important;
border-radius:16px !important
}
.gx-empty-icon-lg{
font-size:2.8rem;
margin-bottom:12px;
display:block;
line-height:1
}
.gx-empty-title{
margin:0 0 8px !important;
font-size:1rem !important;
font-weight:800 !important;
color:var(--gx-dark) !important;
font-family:var(--gx-font) !important
}
.gx-empty-desc{
color:var(--gx-sub) !important;
margin:0 0 16px !important;
font-size:.9rem !important
}
.gx-card-list{
display:flex;
flex-direction:column;
gap:14px
}
.gx-hire-card{
background:var(--gx-white) !important;
border:1px solid var(--gx-border) !important;
border-radius:var(--gx-r) !important;
padding:18px !important;
box-shadow:var(--gx-sh);
transition:box-shadow var(--gx-tr)
}
.gx-hire-card:hover{
box-shadow:var(--gx-sh-md)
}
.gx-hire-card-header{
display:flex;
justify-content:space-between;
align-items:flex-start;
flex-wrap:wrap;
gap:8px;
margin-bottom:12px
}
.gx-hire-card-title{
font-weight:800 !important;
font-size:1rem !important;
color:var(--gx-dark) !important;
margin-bottom:4px;
font-family:var(--gx-font) !important
}
.gx-hire-card-meta{
font-size:.82rem !important;
color:var(--gx-sub) !important
}
.gx-hire-card-party{
font-size:.82rem !important;
color:var(--gx-text) !important;
margin-top:2px
}
.gx-hire-progress-row{
display:flex;
margin:12px 0
}
.gx-hire-progress-step{
flex:1;
text-align:center
}
.gx-hire-card-footer{
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
gap:8px
}
.gx-hire-agreed-label{
font-size:.82rem;
color:var(--gx-sub)
}
.gx-rfq-card{
background:var(--gx-white) !important;
border:1px solid var(--gx-border) !important;
border-radius:var(--gx-r) !important;
padding:18px !important;
box-shadow:var(--gx-sh);
transition:box-shadow var(--gx-tr),border-color var(--gx-tr)
}
.gx-rfq-card:hover{
box-shadow:var(--gx-sh-md)
}
.gx-rfq-card--expiring{
border-color:var(--gx-yellow) !important;
border-left:4px solid var(--gx-yellow) !important
}
.gx-rfq-card-header{
display:flex;
justify-content:space-between;
align-items:flex-start;
flex-wrap:wrap;
gap:8px;
margin-bottom:10px
}
.gx-rfq-card-title{
font-weight:800 !important;
font-size:1rem !important;
color:var(--gx-dark) !important;
margin-bottom:4px
}
.gx-rfq-card-meta{
font-size:.82rem !important;
color:var(--gx-sub) !important
}
.gx-rfq-card-status{
text-align:right;
flex-shrink:0
}
.gx-rfq-expires{
font-size:.72rem !important;
color:var(--gx-yellow) !important;
font-weight:600 !important
}
.gx-rfq-meta-row{
display:flex;
gap:14px;
flex-wrap:wrap;
margin-bottom:10px
}
.gx-rfq-meta-item{
font-size:.83rem;
color:var(--gx-text) !important
}
.gx-rfq-pill{
display:inline-block;
padding:2px 9px;
border-radius:var(--gx-r-full);
font-size:.75rem;
font-weight:700;
font-family:var(--gx-font)
}
.gx-rfq-pill--open{
background:var(--gx-green-lt);
color:var(--gx-green);
border:1px solid #86efac
}
.gx-rfq-pill--quoted{
background:var(--gx-blue-lt);
color:#0c4a6e;
border:1px solid #7dd3fc
}
.gx-rfq-pill--awarded{
background:var(--gx-primary-lt);
color:var(--gx-primary-dk);
border:1px solid #fdba74
}
.gx-rfq-pill--closed{
background:var(--gx-bg2);
color:var(--gx-sub);
border:1px solid var(--gx-border)
}
.gx-rfq-pill--expired{
background:var(--gx-red-lt);
color:var(--gx-red);
border:1px solid #fecaca
}
.gx-auction-grid{
display:grid;
grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
gap:16px
}
.gx-auction-card{
background:var(--gx-white);
border:1px solid var(--gx-border);
border-radius:14px !important;
overflow:hidden !important;
position:relative;
box-shadow:var(--gx-sh);
transition:transform var(--gx-tr),box-shadow var(--gx-tr)
}
.gx-auction-card:hover{
transform:translateY(-3px);
box-shadow:var(--gx-sh-md)
}
.gx-auction-featured-badge{
position:absolute;
top:10px;
left:10px;
background:var(--gx-primary);
color:#fff;
padding:2px 10px;
border-radius:var(--gx-r-full);
font-size:.72rem;
font-weight:700;
z-index:2
}
.gx-auction-card-header{
background:linear-gradient(135deg,#0c1829 0%,#1a2e4a 60%,#1c2432 100%);
padding:20px;
text-align:center;
position:relative
}
.gx-auction-card-header::after{
content:'';
position:absolute;
top:-30px;
right:-30px;
width:100px;
height:100px;
background:radial-gradient(circle,rgba(241,104,33,.1) 0%,transparent 70%);
pointer-events:none
}
.gx-auction-card-type{
font-size:.72rem;
color:var(--gx-muted) !important;
margin-bottom:4px
}
.gx-auction-card-title{
font-size:.84rem !important;
color:#fff !important;
font-weight:700 !important;
font-family:var(--gx-font) !important;
position:relative;
z-index:1
}
.gx-auction-mini-timer{
font-size:1.1rem !important;
font-weight:900 !important;
color:var(--gx-primary) !important;
margin-top:8px;
font-variant-numeric:tabular-nums
}
.gx-auction-card-ended{
color:var(--gx-muted) !important;
font-size:.82rem !important;
margin-top:8px
}
.gx-auction-card-body{
padding:14px !important
}
.gx-auction-card-stats{
display:flex;
justify-content:space-between;
margin-bottom:10px
}
.gx-auction-stat-label{
font-size:.72rem;
color:var(--gx-muted) !important;
margin-bottom:2px
}
.gx-auction-stat-value{
font-size:1.1rem !important;
font-weight:800 !important;
color:var(--gx-primary) !important;
font-family:var(--gx-font) !important
}
.gx-text-right .gx-auction-stat-value{
color:var(--gx-dark) !important
}
.gx-auction-vendor-name{
font-size:.78rem !important;
color:var(--gx-sub) !important;
margin-bottom:10px
}
.gx-compare-header{
display:flex !important;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
gap:12px;
margin-bottom:24px
}
.gx-compare-title{
margin:0 !important;
font-size:1.6rem !important;
font-weight:900 !important;
color:var(--gx-dark) !important;
letter-spacing:-.04em;
font-family:var(--gx-font) !important
}
.gx-compare-subtitle{
margin:4px 0 0 !important;
color:var(--gx-sub) !important;
font-size:.9rem !important
}
.gx-compare-empty-desc{
color:var(--gx-sub) !important;
max-width:400px;
margin:0 auto 24px !important
}
.gx-compare-remove-label{
color:var(--gx-sub) !important;
font-size:.85rem !important;
align-self:center
}
.gx-compare-remove-btn{
background:var(--gx-red-lt) !important;
color:var(--gx-red) !important;
border:1px solid #fecaca !important;
border-radius:var(--gx-r-full) !important;
padding:4px 14px;
font-size:.8rem;
text-decoration:none !important;
transition:all var(--gx-tr);
display:inline-block;
font-family:var(--gx-font);
font-weight:600
}
.gx-compare-remove-btn:hover{
background:var(--gx-red) !important;
color:#fff !important;
border-color:var(--gx-red) !important
}
.gx-compare-alt-row td{
background:var(--gx-bg) !important
}
.gx-register-panel{
max-width:540px !important;
margin:0 auto !important
}
.gx-register-title{
margin:0 0 20px !important;
font-size:1.2rem !important;
font-weight:800 !important;
color:var(--gx-dark) !important;
letter-spacing:-.02em;
font-family:var(--gx-font) !important
}
.gx-register-footer-text{
text-align:center !important;
font-size:.78rem !important;
color:var(--gx-muted) !important;
margin-top:12px !important
}
.gx-ai-import-banner{
margin:0 0 16px;
display:flex;
align-items:center;
gap:8px;
flex-wrap:wrap
}
.gx-ai-import-hint{
font-size:.74rem !important;
color:var(--gx-muted) !important
}
.gx-bid-hint-text{
margin-top:8px !important;
font-size:.75rem !important;
color:var(--gx-muted) !important
}
.gx-folder-header{
display:flex;
align-items:center;
gap:10px;
margin-bottom:16px
}
.gx-profile-section{
padding:20px !important
}
.gx-prod-thumb{
width:100% !important;
height:120px !important;
object-fit:cover !important;
border-radius:var(--gx-rsm) !important;
display:block
}
.gx-prod-name{
font-size:.85rem !important;
margin-top:6px !important;
color:var(--gx-dark) !important;
font-weight:700 !important;
font-family:var(--gx-font) !important;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis
}
.gx-prod-price{
color:var(--gx-primary) !important;
font-weight:800 !important;
margin:4px 0 8px !important;
font-size:.88rem !important
}
.gx-neg-sub{
font-size:.82rem !important;
color:var(--gx-sub) !important;
margin-top:4px
}
@media (max-width:768px){
.gx-dashboard-2col{
grid-template-columns:1fr !important
}
.gx-auction-grid{
grid-template-columns:1fr 1fr !important
}
.gx-compare-title{
font-size:1.2rem !important
}

}
@media (max-width:480px){
.gx-auction-grid{
grid-template-columns:1fr !important
}
.gx-page-title-h2{
font-size:1.1rem !important
}
.gx-empty-card{
padding:32px 16px !important
}

}

/* ═══════════════════════════════════════════════════════════════════════════
   SHOPIFY-INSPIRED ULTRA-PREMIUM VENDOR DASHBOARD REDESIGN (v5.0.0)
   - Harmonious, clean dark sidebar with smooth orange accent highlights.
   - Glassmorphic topbar with crisp icons and readable page headers.
   - Elegant, clean card layouts with refined typography and soft borders.
   - Rounded primary buttons with micro-interactions and glowing states.
   - Inputs and textareas with slate borders, custom icons, and warm focus rings.
   - Table layouts with alternate zebra striping, row hover lifts, and clean status badges.
   - Micro-animations, responsive layout transitions, and high visual excellence.
   - Guarantees minimum global font size of 17px on all content layouts.
═══════════════════════════════════════════════════════════════════════════ */

/* 1. Global Reset & Overrides */
.gx-dashboard {
  background: #f4f6f8 !important; /* Soft light slate background like Shopify */
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  color: #1a1f2c !important;
}

/* Hardened Typography Rule */
.gx-dashboard span,
.gx-dashboard label,
.gx-dashboard p,
.gx-dashboard a,
.gx-dashboard button,
.gx-dashboard input,
.gx-dashboard select,
.gx-dashboard textarea,
.gx-dashboard table td,
.gx-dashboard table th {
  font-size: 17px !important;
}

/* Clear Headings */
.gx-dashboard h1, .gx-dashboard .gx-page-title-h2 { font-size: 26px !important; font-weight: 800 !important; color: #0f172a !important; letter-spacing: -0.02em !important; }
.gx-dashboard h2 { font-size: 22px !important; font-weight: 700 !important; color: #1e293b !important; }
.gx-dashboard h3, .gx-dashboard .gx-card-title { font-size: 20px !important; font-weight: 700 !important; color: #1e293b !important; }
.gx-dashboard h4 { font-size: 18px !important; font-weight: 600 !important; color: #1e293b !important; }
.gx-dashboard h5 { font-size: 17px !important; font-weight: 600 !important; color: #334155 !important; }

/* 2. Sleek Dark Shopify Sidebar */
.gx-sidebar {
  background: #0f111a !important; /* Deep modern dark indigo-black */
  border-right: 1px solid rgba(255, 255, 255, 0.04) !important;
  box-shadow: 4px 0 24px rgba(0, 0, 0, 0.12) !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.gx-sidebar-brand {
  background: rgba(255, 255, 255, 0.01) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  padding: 24px 20px !important;
}

.gx-vendor-logo {
  border-radius: 12px !important;
  border: 2px solid rgba(241, 104, 33, 0.4) !important;
  box-shadow: 0 4px 12px rgba(241, 104, 33, 0.1) !important;
  transition: transform 0.2s ease !important;
}
.gx-vendor-logo:hover {
  transform: scale(1.05);
}

.gx-sidebar-brand h4 {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  margin-top: 4px !important;
}

.gx-sb-badge {
  background: rgba(241, 104, 33, 0.12) !important;
  color: #ff9f68 !important;
  border: 1px solid rgba(241, 104, 33, 0.2) !important;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
}

.gx-sb-kyc {
  display: inline-flex !important;
  align-items: center;
  padding: 3px 10px !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  margin-top: 8px !important;
}
.gx-sb-kyc.approved {
  background: rgba(22, 163, 74, 0.15) !important;
  color: #4ade80 !important;
  border: 1px solid rgba(22, 163, 74, 0.2) !important;
}
.gx-sb-kyc.pending {
  background: rgba(217, 119, 6, 0.15) !important;
  color: #fbbf24 !important;
  border: 1px solid rgba(217, 119, 6, 0.2) !important;
}

/* Navigation Group & Labels */
.gx-nav-group-label, .gx-nav-section-label {
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #64748b !important;
  padding: 16px 20px 6px !important;
}

/* Sidebar Nav Links */
.gx-nav-link {
  color: #94a3b8 !important;
  padding: 12px 18px !important;
  margin: 3px 12px !important;
  border-radius: 8px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  border-left: none !important;
  font-weight: 500 !important;
}

.gx-nav-link:hover {
  background: rgba(255, 255, 255, 0.05) !important;
  color: #ffffff !important;
  transform: translateX(4px) !important;
  text-decoration: none !important;
}

.gx-nav-link.active {
  background: linear-gradient(90deg, rgba(241, 104, 33, 0.15) 0%, rgba(241, 104, 33, 0.02) 100%) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  border-left: 4px solid var(--gx-primary) !important;
  border-radius: 0 8px 8px 0 !important;
  margin-left: 0 !important;
  padding-left: 14px !important;
}
.gx-nav-link.active::after {
  display: none !important; /* Remove legacy indicators */
}

.gx-nav-icon {
  font-size: 18px !important;
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0.7;
  color: inherit !important;
}
.gx-nav-link.active .gx-nav-icon {
  opacity: 1;
  color: var(--gx-primary) !important;
}

/* Custom Nav Badges */
.gx-nav-badge {
  background: #f16821 !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 2px 8px !important;
  border-radius: 10px !important;
  margin-left: auto !important;
}

.gx-nav-badge-warn {
  background: #ef4444 !important;
}

.gx-nav-logout {
  border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
  margin-top: 16px !important;
  color: #fca5a5 !important;
}
.gx-nav-logout:hover {
  background: rgba(239, 68, 68, 0.1) !important;
  color: #ef4444 !important;
}

.gx-sidebar-footer {
  border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
  padding: 16px 20px !important;
  color: #475569 !important;
  font-size: 13px !important;
}

/* 3. Glassmorphic Topbar */
.gx-topbar {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border-bottom: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  padding: 14px 24px !important;
  height: 70px !important;
}

.gx-page-title {
  color: #0f172a !important;
  font-size: 20px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}

.gx-sidebar-toggle {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 8px !important;
  width: 40px !important;
  height: 40px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  transition: all 0.2s ease !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}
.gx-sidebar-toggle:hover {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}

/* 4. Elegant Cards */
.gx-card, .gx-buyer-panel, .gx-ov-card, .gx-chart-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.02) !important;
  padding: 24px !important;
  margin-bottom: 24px !important;
  transition: all 0.2s ease !important;
}
.gx-card:hover, .gx-buyer-panel:hover, .gx-ov-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
  transform: translateY(-1px);
}

.gx-card-header {
  background: transparent !important;
  border-bottom: 1px solid #f1f5f9 !important;
  padding: 0 0 16px 0 !important;
  margin-bottom: 20px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}

.gx-card-header h4 {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
}

.gx-card-body {
  padding: 0 !important;
}

/* 5. Shopify-like KPI Stat Cards */
.gx-stats-row, .gx-balance-cards, .gx-dash-kpi {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 20px !important;
  margin-bottom: 28px !important;
}

.gx-stat, .gx-kpi-card, .gx-balance-card, .gx-stat-card-buyer {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 24px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  transition: all 0.2s ease !important;
}
.gx-stat:hover, .gx-kpi-card:hover, .gx-balance-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06) !important;
  border-color: #cbd5e1 !important;
}

/* Strip top gradient borders and replace with elegant, subtle colored side/top bar */
.gx-stat-card::before, .gx-kpi-card::before, .gx-stat-card-buyer::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: var(--gx-primary) !important;
  border-radius: 12px 12px 0 0 !important;
}

.gx-kpi-card.gx-kpi-success::before { background: #16a34a !important; }
.gx-kpi-card.gx-kpi-warn::before { background: #d97706 !important; }

/* Stat Icons */
.gx-stat__icon, .gx-kpi-card__icon, .gx-buyer-stat-icon {
  width: 46px !important;
  height: 46px !important;
  border-radius: 50% !important;
  background: #f8fafc !important;
  color: #475569 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;
  margin-bottom: 4px !important;
  border: 1px solid #e2e8f0 !important;
}

/* Stat Values */
.gx-stat__val, .gx-kpi-val, .gx-balance-val, .gx-kpi-card__value {
  font-size: 28px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  letter-spacing: -0.03em !important;
  line-height: 1.15 !important;
  background: none !important;
  -webkit-text-fill-color: initial !important;
}

/* Stat Labels */
.gx-stat__lbl, .gx-kpi-lbl, .gx-balance-label, .gx-kpi-card__label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin-top: 0 !important;
}

/* 6. Professional Rounded Buttons */
.gx-btn {
  border-radius: 8px !important;
  font-weight: 600 !important;
  padding: 10px 20px !important;
  height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}

.gx-btn-primary {
  background: #f16821 !important; /* Clean primary fill */
  border: none !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(241, 104, 33, 0.2) !important;
}
.gx-btn-primary:hover {
  background: #e05818 !important;
  box-shadow: 0 4px 12px rgba(241, 104, 33, 0.3) !important;
  transform: translateY(-1px) !important;
}

.gx-btn-outline {
  border: 1px solid #cbd5e1 !important;
  color: #334155 !important;
  background: #ffffff !important;
}
.gx-btn-outline:hover {
  border-color: #94a3b8 !important;
  background: #f8fafc !important;
  color: #0f172a !important;
}

.gx-btn-secondary {
  background: #0f172a !important;
  color: #ffffff !important;
}
.gx-btn-secondary:hover {
  background: #1e293b !important;
}

.gx-btn-success {
  background: #16a34a !important;
  color: #ffffff !important;
}
.gx-btn-success:hover {
  background: #15803d !important;
}

.gx-btn-danger {
  background: #ef4444 !important;
  color: #ffffff !important;
}
.gx-btn-danger:hover {
  background: #dc2626 !important;
}

.gx-btn-ai {
  background: #7c3aed !important;
  color: #ffffff !important;
}
.gx-btn-ai:hover {
  background: #6d28d9 !important;
}

/* 7. Warm & Refined Forms */
.gx-form-group input, .gx-form-group select, .gx-form-group textarea,
.gx-input, .gx-textarea, .gx-select, .gxa-input {
  border: 1.5px solid #cbd5e1 !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  background: #ffffff !important;
  color: #0f172a !important;
  transition: all 0.2s ease !important;
  outline: none !important;
}

.gx-form-group input:focus, .gx-form-group select:focus, .gx-form-group textarea:focus,
.gx-input:focus, .gx-textarea:focus, .gx-select:focus, .gxa-input:focus {
  border-color: #f16821 !important;
  box-shadow: 0 0 0 4px rgba(241, 104, 33, 0.15) !important;
}

.gx-form-group label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #475569 !important;
  margin-bottom: 6px !important;
  display: block !important;
}

/* 8. Zebra Striped Tables & Row Lifts */
.gx-table-wrap {
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02) !important;
}

.gx-table {
  width: 100% !important;
  border-collapse: collapse !important;
}

.gx-table thead th {
  background: #f8fafc !important;
  color: #475569 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  padding: 16px 20px !important;
  border-bottom: 1.5px solid #e2e8f0 !important;
}

.gx-table tbody td {
  padding: 16px 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  color: #1e293b !important;
  vertical-align: middle !important;
  transition: background 0.18s ease !important;
}

.gx-table tbody tr:hover td {
  background: #f8fafc !important;
}

.gx-table tbody tr:last-child td {
  border-bottom: none !important;
}

/* 9. Soft Pill Status Badges */
.gx-badge, .gx-pill, .gxp-badge, .gx-badge-status {
  padding: 6px 12px !important;
  border-radius: 20px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  border: 1px solid transparent !important;
}

/* Success / Published */
.gx-badge-success, .gx-pill-publish, .gx-pill-instock, .gxp-badge--pub, .gxp-stock--in, .gx-badge-status--completed, .gx-badge-status--active {
  background: #dcfce7 !important;
  color: #15803d !important;
  border: 1px solid rgba(21, 128, 61, 0.15) !important;
}

/* Warning / Pending */
.gx-badge-warning, .gx-pill-pending, .gxp-badge--pnd, .gxp-stock--low, .gx-badge-status--pending, .gx-badge-status--processing, .gx-badge-status--submitted {
  background: #fef3c7 !important;
  color: #b45309 !important;
  border: 1px solid rgba(180, 83, 9, 0.15) !important;
}

/* Danger / Cancelled / Out of Stock */
.gx-badge-danger, .gx-pill-outofstock, .gxp-badge--sale, .gxp-stock--out, .gx-badge-status--cancelled, .gx-badge-status--failed, .gx-badge-status--rejected {
  background: #fee2e2 !important;
  color: #b91c1c !important;
  border: 1px solid rgba(185, 28, 28, 0.15) !important;
}

/* Neutral / Draft */
.gx-badge-info, .gx-pill-draft, .gxp-badge--dft, .gx-badge-status--draft, .gx-badge-status--inactive {
  background: #f1f5f9 !important;
  color: #475569 !important;
  border: 1px solid rgba(71, 85, 105, 0.15) !important;
}

/* 10. Refined Modals with Blurred Overlays */
.gx-modal-overlay, .gxa-modal-overlay {
  background: rgba(15, 23, 42, 0.6) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

.gx-modal-content, .gx-modal, .gxa-modal-box {
  border-radius: 16px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.18) !important;
  background: #ffffff !important;
  overflow: hidden !important;
}

.gx-modal-header {
  background: #f8fafc !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 20px 24px !important;
}

.gx-modal-header h3 {
  font-size: 20px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
}

/* Smooth custom scrollbars for table wrappers and dropdowns */
.gx-sidebar::-webkit-scrollbar, .gx-table-wrap::-webkit-scrollbar, .gx-notif-dropdown::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
.gx-sidebar::-webkit-scrollbar-thumb, .gx-table-wrap::-webkit-scrollbar-thumb, .gx-notif-dropdown::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 10px;
}
.gx-sidebar::-webkit-scrollbar-thumb:hover, .gx-table-wrap::-webkit-scrollbar-thumb:hover, .gx-notif-dropdown::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* ==========================================================================
   GARUDO PRO VENDOR DASHBOARD REDESIGN OVERRIDES
   ========================================================================== */

/* Sidebar Header / Brand overriding */
.gx-sidebar-brand {
  padding: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
}
.gx-sidebar-brand img.gx-vendor-logo {
  width: 48px !important;
  height: 48px !important;
  border-radius: 8px !important;
  border: 2px solid rgba(255,255,255,0.2) !important;
  box-shadow: none !important;
}
.gx-sb-info {
  margin-top: 4px;
}

/* Sidebar active link styling */
.gx-nav-link {
  font-size: 17px !important;
}
.gx-nav-link.active {
  background: #f16821 !important; /* solid orange */
  border-left: none !important;
  border-left-color: transparent !important;
  color: #fff !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
}
.gx-nav-link.active::after {
  display: none !important; /* remove left border or indicator */
}
.gx-nav-link.active span.gx-nav-icon svg {
  color: #fff !important;
}

/* Topbar Styling */
.gx-topbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  padding: 12px 24px !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 99 !important;
}
.gx-topbar-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.gx-topbar-title {
  font-size: 22px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  margin: 0 !important;
}
.gx-topbar-right {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}
.gx-topbar-bell {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  background: #f8fafc !important;
  border-radius: 50% !important;
  color: #64748b !important;
  border: 1px solid #e2e8f0 !important;
  text-decoration: none !important;
}
.gx-topbar-bell:hover {
  background: #f1f5f9 !important;
  color: #0f172a !important;
}
.gx-topbar-bell-badge {
  position: absolute !important;
  top: 0px !important;
  right: 0px !important;
  background: #ef4444 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 2px solid #ffffff !important;
}
.gx-topbar-avatar {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  border: 1.5px solid #e2e8f0 !important;
}
.gx-topbar-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.gx-topbar-btn-store {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 16px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #0f172a !important;
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
.gx-topbar-btn-store:hover {
  background: #f8fafc !important;
  border-color: #94a3b8 !important;
}
.gx-topbar-btn-add {
  display: inline-flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  background: #f16821 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
.gx-topbar-btn-add:hover {
  background: #e05818 !important;
}

/* KYC alert banner overrides */
.gx-kyc-alert {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: #fffbeb !important;
  border: 1px solid #fde047 !important;
  border-left: 4px solid #f16821 !important;
  padding: 16px 20px !important;
  border-radius: 8px !important;
  margin-bottom: 24px !important;
}
.gx-kyc-alert__left {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}
.gx-kyc-alert__icon {
  font-size: 28px !important;
  color: #f16821 !important;
}
.gx-kyc-alert strong {
  font-size: 17px !important;
  color: #854d0e !important;
  display: block !important;
  margin-bottom: 4px !important;
}
.gx-kyc-alert p {
  font-size: 17px !important;
  color: #a16207 !important;
  margin: 0 !important;
}
.gx-btn-kyc {
  display: inline-flex !important;
  align-items: center !important;
  padding: 10px 18px !important;
  background: #f16821 !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  font-size: 17px !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  transition: all 0.2s ease !important;
}
.gx-btn-kyc:hover {
  background: #e05818 !important;
  color: #ffffff !important;
}

/* Stat cards overrides */
.gx-stats-row.gx-stats-5 {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}
@media (max-width: 1024px) {
  .gx-stats-row.gx-stats-5 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}
@media (max-width: 640px) {
  .gx-stats-row.gx-stats-5 {
    grid-template-columns: 1fr !important;
  }
}
.gx-stats-5 .gx-stat-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 16px !important;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05), 0 2px 4px -1px rgba(0,0,0,0.02) !important;
  position: relative !important;
  overflow: hidden !important;
  transition: transform 0.2s, box-shadow 0.2s !important;
}
.gx-stats-5 .gx-stat-card::before {
  display: none !important; /* hide gradient top border */
}
.gx-stats-5 .gx-stat-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 15px -3px rgba(0,0,0,0.08) !important;
}
.gx-stats-5 .gx-stat__icon {
  width: 44px !important;
  height: 44px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.gx-stats-5 .gx-stat__body {
  display: flex !important;
  flex-direction: column !important;
}
.gx-stats-5 .gx-stat__val {
  font-size: 24px !important;
  font-weight: 700 !important;
  color: #0f172a !important;
  line-height: 1.2 !important;
  margin-bottom: 2px !important;
  background: none !important;
  -webkit-text-fill-color: initial !important;
}
.gx-stats-5 .gx-stat__label {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}
.gx-stats-5 .gx-stat__sub {
  font-size: 17px !important;
  color: #94a3b8 !important;
  margin-top: 1px !important;
}

/* Balance cards overrides */
.gx-balance-row {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 16px !important;
  margin-bottom: 24px !important;
}
@media (max-width: 1024px) {
  .gx-balance-row {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 640px) {
  .gx-balance-row {
    grid-template-columns: 1fr !important;
  }
}
.gx-bal-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 20px !important;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}
.gx-bal-label {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #94a3b8 !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  margin-bottom: 8px !important;
}
.gx-bal-val {
  font-size: 26px !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  margin-bottom: 4px !important;
}
.gx-text-green {
  color: #10b981 !important;
}
.gx-text-orange {
  color: #f97316 !important;
}
.gx-bal-sub {
  font-size: 17px !important;
  color: #94a3b8 !important;
  margin-bottom: 12px !important;
}
.gx-btn-withdraw {
  align-self: flex-start !important;
  padding: 8px 16px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  background: #f16821 !important;
  border: none !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  transition: background 0.2s ease !important;
}
.gx-btn-withdraw:hover {
  background: #e05818 !important;
}

/* Quick Actions overrides */
.gx-quick-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-bottom: 24px !important;
}
.gx-quick-actions .gx-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 20px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}
.gx-quick-actions .gx-btn-primary {
  background: #f16821 !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
}
.gx-quick-actions .gx-btn-primary:hover {
  background: #e05818 !important;
  color: #ffffff !important;
  transform: none !important;
}
.gx-quick-actions .gx-btn-outline {
  background: #ffffff !important;
  color: #1e293b !important;
  border: 1px solid #cbd5e1 !important;
}
.gx-quick-actions .gx-btn-outline:hover {
  background: #f8fafc !important;
  border-color: #94a3b8 !important;
  color: #1e293b !important;
}

/* Two-column layout grid overrides */
.gx-dashboard-grid-2 {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 20px !important;
  margin-bottom: 24px !important;
}
@media (max-width: 1024px) {
  .gx-dashboard-grid-2 {
    grid-template-columns: 1fr !important;
  }
}
.gx-ov-card {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 12px !important;
  padding: 20px !important;
  box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05) !important;
}
.gx-ov-card__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 20px !important;
  border-bottom: 1px solid #f1f5f9 !important;
  padding-bottom: 12px !important;
}
.gx-ov-card__title {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #1e293b !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.gx-link-btn {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #64748b !important;
  text-decoration: none !important;
}
.gx-link-btn:hover {
  color: #f16821 !important;
}

/* Product list items overrides */
.gx-ov-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}
.gx-ov-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 0 !important;
  border-bottom: 1px solid #f8fafc !important;
}
.gx-ov-row:last-child {
  border-bottom: none !important;
}
.gx-ov-row-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.gx-ov-icon-wrapper {
  width: 40px !important;
  height: 40px !important;
  border-radius: 8px !important;
  background: #f1f5f9 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748b !important;
  flex-shrink: 0 !important;
}
.gx-ov-icon-wrapper img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}
.gx-ov-row-info {
  display: flex !important;
  flex-direction: column !important;
}
.gx-ov-row-title {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: #1e293b !important;
}
.gx-ov-row-subtitle {
  font-size: 17px !important;
  color: #64748b !important;
  margin-top: 2px !important;
}
.gx-ov-row-right {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}
.gx-badge-status {
  font-size: 17px !important;
  font-weight: 600 !important;
  padding: 4px 10px !important;
  border-radius: 9999px !important;
  text-transform: capitalize !important;
}
.gx-badge-status.publish, .gx-badge-status.completed {
  background: #d1fae5 !important;
  color: #065f46 !important;
}
.gx-badge-status.processing {
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}
.gx-badge-status.pending {
  background: #fef3c7 !important;
  color: #d97706 !important;
}
.gx-badge-status.draft {
  background: #f1f5f9 !important;
  color: #475569 !important;
}
.gx-ov-price {
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #f16821 !important;
  min-width: 80px !important;
  text-align: right !important;
}

/* Revenue Chart bar class overrides */
.gx-chart-bar {
  transition: opacity 0.2s ease, transform 0.2s ease !important;
  cursor: pointer !important;
}
.gx-chart-bar:hover {
  opacity: 1 !important;
  transform: scaleY(1.03) !important;
  transform-origin: bottom !important;
}

/* Activity logs overrides */
.gx-activity-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
.gx-activity-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
}
.gx-activity-icon {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}
.gx-activity-content {
  display: flex !important;
  flex-direction: column !important;
  font-size: 17px !important;
  color: #1e293b !important;
  line-height: 1.4 !important;
}
.gx-activity-content strong {
  font-weight: 600 !important;
  color: #0f172a !important;
}
.gx-activity-time {
  font-size: 17px !important;
  color: #94a3b8 !important;
  margin-top: 2px !important;
}



