/* WCSAM 2.1.0 responsive/local enhancement layer */
@font-face{
  font-family:IRANSans;
  src:url("fonts/IRANSans-web.woff") format("woff");
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
:root{
  --brand:#5b5ce2;
  --brand-dark:#3c3dc3;
  --brand-soft:#eef0ff;
  --accent:#17a2b8;
  --ink:#172033;
  --muted:#718096;
  --canvas:#f5f7fb;
  --surface:#ffffff;
  --line:#e8ecf3;
  --sidebar:#111827;
  --radius:22px;
  --shadow:0 18px 48px rgba(20,31,56,.08);
}
html{scroll-behavior:smooth}
body{background:linear-gradient(180deg,#f8faff 0,#f4f6fb 38%,#f7f8fc 100%);font-family:IRANSans,Tahoma,Arial,sans-serif}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 90% 0,rgba(91,92,226,.08),transparent 25%),radial-gradient(circle at 0 85%,rgba(23,162,184,.06),transparent 28%);z-index:-1}
[hidden]{display:none!important}

/* Bootstrap 5.1 local compatibility for newer utility names used by the app */
.bg-primary-subtle{background-color:#eef0ff!important}.bg-success-subtle{background-color:#e9fbf3!important}.bg-warning-subtle{background-color:#fff7df!important}.bg-info-subtle{background-color:#e8f8fb!important}
.text-bg-success{color:#fff!important;background-color:#198754!important}.text-bg-danger{color:#fff!important;background-color:#dc3545!important}.text-bg-warning{color:#111!important;background-color:#ffc107!important}.text-bg-primary{color:#fff!important;background-color:#0d6efd!important}
html[dir=rtl] .ms-1{margin-left:0!important;margin-right:.25rem!important}html[dir=rtl] .ms-2{margin-left:0!important;margin-right:.5rem!important}html[dir=rtl] .ms-3{margin-left:0!important;margin-right:1rem!important}html[dir=rtl] .ms-auto{margin-left:0!important;margin-right:auto!important}
html[dir=rtl] .me-1{margin-right:0!important;margin-left:.25rem!important}html[dir=rtl] .me-2{margin-right:0!important;margin-left:.5rem!important}html[dir=rtl] .me-auto{margin-right:0!important;margin-left:auto!important}
html[dir=rtl] .text-start{text-align:right!important}html[dir=rtl] .text-end{text-align:left!important}
html[dir=rtl] .input-group>:not(:first-child):not(.dropdown-menu){margin-left:0;margin-right:-1px}
html[dir=rtl] .input-group>:first-child{border-radius:0 .5rem .5rem 0!important}html[dir=rtl] .input-group>:last-child{border-radius:.5rem 0 0 .5rem!important}

.login-screen{min-height:100dvh;padding:max(20px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));background:linear-gradient(135deg,#0f172a 0,#172554 48%,#312e81 100%)}
.login-screen::before,.login-screen::after{content:"";position:fixed;border-radius:50%;filter:blur(2px);pointer-events:none}.login-screen::before{width:340px;height:340px;top:-140px;right:-90px;background:rgba(99,102,241,.28)}.login-screen::after{width:300px;height:300px;bottom:-150px;left:-80px;background:rgba(14,165,233,.18)}
.login-shell{position:relative;z-index:1;box-shadow:0 35px 90px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(16px)}
.login-brand-panel{background:linear-gradient(145deg,rgba(79,70,229,.96),rgba(49,46,129,.95));position:relative;overflow:hidden}.login-brand-panel::after{content:"";position:absolute;width:260px;height:260px;border:55px solid rgba(255,255,255,.06);border-radius:50%;left:-90px;bottom:-95px}
.login-card{background:rgba(255,255,255,.98)}
.login-card .form-control,.login-card .input-group-text{border-color:#e6e9f2;background:#f8f9fc}.login-card .form-control:focus{background:#fff;border-color:rgba(91,92,226,.55);box-shadow:0 0 0 .25rem rgba(91,92,226,.12)}

.sidebar{background:linear-gradient(180deg,#111827 0,#172033 56%,#111827 100%);box-shadow:-16px 0 45px rgba(15,23,42,.16)}
.sidebar-head{border-bottom:1px solid rgba(255,255,255,.08)}.representative-chip{background:linear-gradient(135deg,rgba(99,102,241,.2),rgba(14,165,233,.11));border:1px solid rgba(255,255,255,.09)}
.nav-item{border:1px solid transparent}.nav-item:hover{background:rgba(255,255,255,.07);transform:translateX(-2px)}.nav-item.active{background:linear-gradient(135deg,rgba(99,102,241,.32),rgba(79,70,229,.19));border-color:rgba(129,140,248,.28);box-shadow:inset -3px 0 #a5b4fc}

.topbar{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(226,232,240,.85);padding-top:max(16px,env(safe-area-inset-top))}
.topbar h2{font-weight:900;letter-spacing:-.35px}.connection-state{background:#ecfdf5;border:1px solid #bbf7d0;color:#047857;padding:7px 12px;border-radius:999px;font-size:.79rem;font-weight:800}
.content-wrap{max-width:1600px;margin:0 auto;padding-bottom:max(30px,env(safe-area-inset-bottom))}
.panel-card,.stat-card,.product-card,.account-card,.order-card,.notice-card{border:1px solid rgba(226,232,240,.85);box-shadow:0 14px 38px rgba(22,34,58,.055);transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.panel-card:hover,.stat-card:hover,.product-card:hover{transform:translateY(-2px);box-shadow:0 20px 48px rgba(22,34,58,.09);border-color:#dbe2ef}
.stat-card{overflow:hidden;position:relative}.stat-card::after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;left:-42px;bottom:-52px;background:rgba(91,92,226,.06)}
.stat-icon{border-radius:18px!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.75)}
.panel-heading{align-items:flex-start}.panel-heading>i{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:var(--brand-soft);color:var(--brand)}
.permission-item{border:1px solid var(--line);background:#fafbfe}.permission-item.allowed{background:#f0fdf7;border-color:#ccefe0}.permission-item.denied{background:#fff8f8;border-color:#f5dada}
.product-card{background:linear-gradient(180deg,#fff,#fbfcff)}.product-price{color:var(--brand-dark)}
.form-control,.form-select{border-color:#dfe4ee;border-radius:13px}.form-control:focus,.form-select:focus{border-color:#8b8cf0;box-shadow:0 0 0 .24rem rgba(91,92,226,.12)}
.btn{border-radius:12px;font-weight:800}.btn-primary{background:linear-gradient(135deg,#6366f1,#4f46e5);border-color:#4f46e5;box-shadow:0 9px 22px rgba(79,70,229,.19)}.btn-primary:hover{background:linear-gradient(135deg,#5558e7,#4338ca);border-color:#4338ca}
.table-responsive{border:1px solid var(--line);border-radius:16px}.table{margin:0}.table thead th{background:#f8f9fc;color:#64748b;font-size:.78rem;white-space:nowrap;border-bottom-color:#e9edf4}.table tbody td{vertical-align:middle;border-color:#edf0f5}
.account-card,.order-card{background:#fff}.action-group{gap:8px}.action-group .btn{min-width:38px}
.wallet-hero{background:linear-gradient(145deg,#4338ca,#5b5ce2 62%,#0891b2);box-shadow:0 20px 44px rgba(67,56,202,.24)}
.loading-overlay{backdrop-filter:blur(5px)}.loading-box{border:1px solid #edf0f6;box-shadow:0 25px 70px rgba(15,23,42,.18)}
.toast-container{z-index:9999}.toast{box-shadow:0 18px 45px rgba(15,23,42,.18)}

@media (max-width:1199.98px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:991.98px){
  .sidebar{width:min(86vw,330px);transform:translateX(110%);transition:transform .28s cubic-bezier(.2,.8,.2,1)}.sidebar.open{transform:translateX(0)}
  .main-content{margin-right:0!important}.topbar{padding-left:16px;padding-right:16px}.content-wrap{padding:20px 16px 36px}
  .login-shell{grid-template-columns:1fr;max-width:620px}.login-brand-panel{padding:34px}.login-brand-panel p{max-width:none}.login-card .card-body{padding:30px!important}
}
@media (max-width:767.98px){
  .stats-grid{grid-template-columns:1fr 1fr;gap:12px}.stat-card{padding:16px}.stat-card strong{font-size:1.28rem}.stat-icon{width:46px;height:46px}
  .topbar{gap:10px}.topbar h2{font-size:1.05rem}.topbar p{font-size:.76rem;max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topbar-actions{gap:7px}.connection-state{display:none}.topbar .btn{padding:.55rem .7rem}
  .panel-card{padding:18px;border-radius:18px}.panel-heading h3{font-size:1rem}.panel-heading p{font-size:.76rem}.panel-heading>i{width:40px;height:40px}
  .permission-grid{grid-template-columns:1fr}.product-grid{grid-template-columns:1fr}.quota-grid{grid-template-columns:1fr}
  .account-toolbar{flex-direction:column}.account-toolbar>*{width:100%}.action-group{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%}.action-group .btn{width:100%;padding:.5rem .35rem}
  .table-responsive{border:0}.table-responsive .table{min-width:720px}
  .dialog-card{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto}
}
@media (max-width:479.98px){
  .login-screen{padding:12px}.login-brand-panel{padding:26px 22px}.login-brand-panel h1{font-size:1.7rem}.security-points{display:none}.login-card .card-body{padding:24px 20px!important}
  .stats-grid{grid-template-columns:1fr}.stat-card{min-height:auto}.topbar p{display:none}.content-wrap{padding-left:12px;padding-right:12px}.panel-card{padding:16px}
  .profile-list>div{grid-template-columns:1fr;gap:3px}.profile-list dd{text-align:right}.action-group{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
