/* SouqX v1.25.0 — coherent marketplace visual system, no behavioral changes */
:root{--sx-accent:#7651f4;--sx-accent-2:#a04ef4;--sx-radius:18px;--sx-ink:#19213a;--sx-elev:0 12px 35px rgba(32,35,72,.065);--sx-elev-hover:0 22px 44px rgba(42,32,101,.13)}
html{scroll-behavior:smooth}body{font-family:system-ui,"Segoe UI",Tahoma,Arial,sans-serif;line-height:1.55;background:radial-gradient(ellipse 60% 35% at 88% 0%,rgba(116,81,244,.045),transparent 75%),var(--bg);text-rendering:optimizeLegibility}
:where(h1,h2,h3){letter-spacing:-.025em;line-height:1.35}h1{font-weight:850}h2{font-weight:800}
:where(.wrap,.container){max-width:1320px}main{min-width:0}
.card{border:1px solid var(--line);border-radius:var(--sx-radius);box-shadow:var(--sx-elev);background:var(--card)}
.card:not(.sx-hub-stat){transition:border-color .2s,box-shadow .2s,transform .2s}
.card:hover{border-color:color-mix(in srgb,var(--p) 24%,var(--line))}
:where(input,select,textarea){font:inherit;color:var(--text);max-width:100%;accent-color:var(--p)}
:where(input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea){border-radius:12px!important;min-height:43px;background:var(--input);border:1px solid var(--line);transition:border-color .2s,box-shadow .2s}
:where(input:not([type=checkbox]):not([type=radio]),select,textarea):focus-visible{outline:none!important;border-color:var(--p)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 15%,transparent)}
:where(button,.btn){font-family:inherit;font-weight:700;cursor:pointer}
.btn{border-radius:12px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:7px}
:where(a,button,input,select,textarea):focus-visible{outline:3px solid color-mix(in srgb,var(--p) 38%,transparent);outline-offset:2px}
:where(.badge,.chip,.pill){border-radius:999px}
:where(table){width:100%;border-collapse:separate;border-spacing:0}
:where(th){font-size:12px;font-weight:750;color:var(--muted);background:color-mix(in srgb,var(--soft) 65%,var(--card));white-space:nowrap}
:where(th,td){padding:13px 12px;border-bottom:1px solid var(--line);text-align:start}
:where(tr:last-child td){border-bottom:0}
:where(tbody tr){transition:background .16s}
:where(tbody tr:hover){background:color-mix(in srgb,var(--p) 3%,var(--card))}
:where(.pagehead,.top){gap:15px;align-items:center;margin-bottom:22px}
:where(.pagehead h1,.top h1){font-size:clamp(27px,3vw,42px);font-weight:850}
:where(.form,.auth-card){border-radius:22px;padding:clamp(18px,3vw,34px)}
:where(.form label){font-weight:650}
.appbar{box-shadow:0 3px 20px rgba(35,35,70,.035)}
.sidebar{background:var(--card);border-color:var(--line)}
.sidebar :where(a,.navitem){transition:background .18s,color .18s,border-color .18s;border-radius:12px}
.sidebar :where(a,.navitem):hover{background:color-mix(in srgb,var(--p) 8%,var(--card))}
/* Marketplace: rich cards, comfortable grid, consistent category browsing */
.souqx-market-v180 :where(.card,.listing-card,.product-card,.category-card){border-radius:18px;overflow:hidden;box-shadow:var(--sx-elev);transition:transform .2s,box-shadow .2s}
.souqx-market-v180 :where(.listing-card,.product-card,.category-card):hover{transform:translateY(-4px);box-shadow:var(--sx-elev-hover)}
.souqx-market-v180 :where(img){object-fit:cover}
.souqx-market-v180 :where(h1){font-size:clamp(29px,3.5vw,49px)}
.souqx-market-v180 :where(.section,.market-section){margin-block:24px}
/* Listing detail and guided publishing */
.listing-page :where(.card){border-radius:22px}
.listing-page :where(img){border-radius:14px}
.sx-page-new-listing form{margin-inline:auto;box-shadow:0 20px 50px rgba(40,37,84,.09)}
.sx-page-new-listing .pagehead{border-bottom:1px solid var(--line);padding-bottom:18px;margin-bottom:22px}
/* Authentication and seller account */
.sx-page-login,.sx-page-register,.sx-page-forgot_password,.sx-page-reset_password,.sx-page-otp{min-height:min(72vh,740px);display:grid;align-items:center;justify-content:center;padding-block:34px}
.sx-page-login .auth-card,.sx-page-register .auth-card,.sx-page-forgot_password .auth-card,.sx-page-reset_password .auth-card,.sx-page-otp .auth-card{width:min(100%,530px);box-shadow:0 22px 70px rgba(40,37,84,.12);border:1px solid color-mix(in srgb,var(--p) 13%,var(--line))}
.sx-page-login .auth-card:before,.sx-page-register .auth-card:before{content:"SOUQX ACCOUNT";display:block;color:var(--p);letter-spacing:2px;font-weight:850;font-size:10px;margin-bottom:12px}
.sx-page-login .auth-title,.sx-page-register h1{font-size:clamp(28px,3vw,38px)}
/* Backoffice: clearer content rhythm */
.sx-page-admin .top{border-radius:22px;padding:clamp(20px,3vw,32px);background:linear-gradient(120deg,#21164c,#5940b5 65%,#8256f2);color:white;box-shadow:0 16px 36px rgba(48,34,125,.17)}
.sx-page-admin .top :where(h1,p){color:white!important}
.sx-page-admin .top .btn{background:white!important;color:#4934a0!important}
.sx-page-admin :where(.card){padding:20px}
.sx-page-categories :where(.card),.sx-page-countries :where(.card),.sx-page-locations :where(.card),.sx-page-attributes :where(.card),.sx-page-security :where(.card),.sx-page-backup :where(.card),.sx-page-whatsapp :where(.card){padding:clamp(15px,2vw,25px)}
/* Financial views and settings build on previous visual system */
.sx-v2 :where(.sx-v2-hero){border-radius:24px;box-shadow:0 18px 42px rgba(43,32,118,.12)}
.sx-v2 :where(.sx-v2-card,.card){border-radius:18px}
/* Empty states: don't invent metrics or imply data */
.sx-page-messages .card:only-child,.sx-page-notifications .card:only-child{min-height:130px}
/* Long Arabic / English strings and table responsiveness */
:where(.card,td,th){overflow-wrap:anywhere}
:where(.table-wrap,.table-responsive){overflow-x:auto;max-width:100%}
/* Dark-mode token compliance */
body.dark,html.dark body{--sx-elev:0 12px 35px rgba(0,0,0,.19);--sx-elev-hover:0 22px 44px rgba(0,0,0,.29)}
body.dark .sx-page-admin .top,html.dark body .sx-page-admin .top{background:linear-gradient(115deg,#281e57,#493185)}
/* Accessible reduced motion and smaller screens */
@media(max-width:850px){:where(.wrap,.container){padding-inline:14px}.sx-page-admin .top{align-items:stretch}.sx-page-admin .top .btn{flex:1 1 auto}}
@media(max-width:600px){:where(.wrap,.container){padding-inline:12px}:where(.card){border-radius:15px}:where(.form,.auth-card){padding:17px}:where(th,td){padding:10px 8px;font-size:12px}.sx-page-admin .top{border-radius:17px;padding:18px}.sx-page-login,.sx-page-register{min-height:65vh}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}
