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

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:#172033;font-family:Vazirmatn,Tahoma,sans-serif;background:#f4f7fb}
a{text-decoration:none}
button,input,select,textarea{font-family:inherit}

:root{
 --blue:#2563eb;
 --blue2:#0284c7;
 --cyan:#0891b2;
 --navy:#09233e;
 --text:#10233f;
 --muted:#718096;
 --border:#e5edf5;
 --surface:#fff;
 --soft:#f7faff;
 --danger:#ef4444;
 --success:#079669;
}

/* =========================================================
   SIDEBAR APPLICATION SHELL
========================================================= */
.app-body{
 min-height:100vh;
 background:
  radial-gradient(circle at 90% 0%,rgba(37,99,235,.065),transparent 28%),
  radial-gradient(circle at 0% 100%,rgba(8,145,178,.055),transparent 30%),
  #f4f7fb;
}

.app-shell{min-height:100vh;display:flex;direction:rtl}

.app-sidebar{
 position:fixed;
 z-index:100;
 top:16px;
 right:16px;
 bottom:16px;
 width:252px;
 padding:16px;
 display:flex;
 flex-direction:column;
 background:rgba(255,255,255,.91);
 border:1px solid rgba(255,255,255,.82);
 border-radius:25px;
 backdrop-filter:blur(20px);
 -webkit-backdrop-filter:blur(20px);
 box-shadow:0 18px 55px rgba(15,39,64,.09);
}

.sidebar-brand{display:flex;align-items:center;gap:11px;padding:4px 5px 17px;border-bottom:1px solid #edf2f7}
.sidebar-brand-icon{width:43px;height:43px;flex:0 0 43px;display:flex;align-items:center;justify-content:center;border-radius:14px;color:#fff;background:linear-gradient(135deg,#0284c7,#2563eb);box-shadow:0 8px 20px rgba(37,99,235,.22)}
.sidebar-brand-icon svg{width:25px;height:25px}
.sidebar-brand-text strong{display:block;color:#10233f;font-size:12px;font-weight:900}
.sidebar-brand-text span{display:block;margin-top:3px;color:#94a3b8;font-size:9px}

.sidebar-user-card{display:flex;align-items:center;gap:10px;margin:15px 0;padding:11px;border:1px solid #dbeafe;border-radius:16px;background:linear-gradient(135deg,#eff6ff,#f0f9ff)}
.sidebar-avatar{width:40px;height:40px;flex:0 0 40px;display:flex;align-items:center;justify-content:center;border-radius:13px;color:#2563eb;background:#fff;border:1px solid #dbeafe;font-weight:900}
.admin-avatar{color:#0f766e;background:#ecfeff;border-color:#cffafe}
.sidebar-user-info{min-width:0}
.sidebar-user-info strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#1e293b;font-size:10px;font-weight:800}
.sidebar-user-info span{display:block;margin-top:3px;color:#64748b;font-size:8.5px}

.sidebar-nav{display:flex;flex-direction:column;gap:5px;flex:1;overflow-y:auto;padding:2px 0}
.sidebar-section-title{margin:7px 7px 5px;color:#a1adba;font-size:8px;font-weight:800}
.account-title{margin-top:16px}
.sidebar-link,.sidebar-info-link{min-height:44px;padding:0 11px;display:flex;align-items:center;gap:10px;border-radius:13px;color:#64748b;font-size:10px;font-weight:700;transition:.2s ease}
.sidebar-link svg,.sidebar-info-link svg{width:18px;height:18px;flex:0 0 auto}
.sidebar-link:hover{color:#2563eb;background:#eff6ff;transform:translateX(-2px)}
.sidebar-link.active{color:#fff;background:linear-gradient(135deg,#2563eb,#0284c7);box-shadow:0 8px 20px rgba(37,99,235,.2)}
.sidebar-badge{margin-right:auto;min-width:21px;padding:2px 6px;text-align:center;border-radius:20px;color:#2563eb;background:#dbeafe;font-size:8px}
.sidebar-link.active .sidebar-badge{background:#fff}
.sidebar-info-link{color:#64748b;background:#f8fafc;border:1px solid #edf2f7}
.sidebar-info-link b{margin-right:auto;padding:3px 7px;border-radius:20px;color:#087c59;background:#e7f8f1;font-size:8px}
.sidebar-footer{padding-top:13px;border-top:1px solid #edf2f7}
.sidebar-logout{height:42px;padding:0 11px;display:flex;align-items:center;gap:9px;border-radius:12px;color:#ef4444;font-size:10px;font-weight:700;transition:.2s}
.sidebar-logout:hover{background:#fef2f2}
.sidebar-logout svg{width:18px;height:18px}
.sidebar-version{text-align:center;margin-top:8px;color:#b0bac6;font-size:7.5px}

.app-main{width:calc(100% - 284px);margin-right:284px;min-height:100vh;padding:28px 30px 45px}
.app-page-head{max-width:1180px;margin:0 auto 19px;display:flex;align-items:center;justify-content:space-between;gap:15px}
.app-eyebrow{color:#94a3b8;font-size:9px;margin-bottom:3px}
.app-page-head h1{margin:0;color:#10233f;font-size:22px;font-weight:900}
.head-credit{display:flex;align-items:baseline;gap:6px;padding:9px 13px;border:1px solid #e1ebf6;border-radius:13px;background:#fff;box-shadow:0 6px 20px rgba(15,39,64,.04)}
.head-credit span{color:#94a3b8;font-size:9px}.head-credit strong{color:#1267d6;font-size:14px}.head-credit small{color:#94a3b8;font-size:8px}

.app-main>.card,.app-main>.hero,.app-main>.grid,.app-main>.section,.app-main>form{max-width:1180px;margin-left:auto;margin-right:auto}

.global-flash{max-width:1180px;margin:0 auto 14px;padding:12px 15px;border-radius:13px;font-size:11px;background:#e8f2ff;color:#1459a8;border:1px solid #dbeafe}
.global-flash.success{background:#e8f8f1;color:#08704f;border-color:#ccefe1}
.global-flash.error{background:#ffebee;color:#b72e3c;border-color:#ffd5da}
.dashboard-flash{position:fixed;top:18px;left:18px;right:18px;z-index:999;max-width:500px;margin-left:auto;box-shadow:0 15px 35px rgba(0,0,0,.12)}

/* =========================================================
   GENERIC COMPONENTS
========================================================= */
.container{width:min(1180px,92%);margin:30px auto}
.card{background:rgba(255,255,255,.95);border:1px solid #e7edf5;border-radius:20px;padding:20px;box-shadow:0 9px 28px rgba(23,52,90,.055)}
.card h2{margin:0 0 8px;color:#132943;font-size:18px;font-weight:900}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:20px 0}
.stat .num{font-size:27px;font-weight:800;margin-top:8px}
.muted{color:#718096;font-size:12px}
.hero{background:linear-gradient(135deg,#0b376d,#0877c9);color:#fff;border-radius:24px;padding:30px;box-shadow:0 20px 45px rgba(11,55,109,.13)}
.hero h1{margin:0 0 8px;font-size:28px}
.btn{border:0;border-radius:12px;padding:11px 17px;background:linear-gradient(135deg,#2563eb,#0284c7);color:#fff;cursor:pointer;font-family:inherit;font-weight:700;display:inline-block;box-shadow:0 7px 17px rgba(37,99,235,.16)}
.btn.green{background:linear-gradient(135deg,#079669,#10b981)}
.btn.red{background:linear-gradient(135deg,#dc3545,#ef4444)}
.btn.gray{background:#edf2f7;color:#26364b;box-shadow:none}
.form{background:#fff;padding:24px;border-radius:20px;border:1px solid #e5ebf2}
.fields{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}
.field label{display:block;font-size:12px;margin-bottom:7px;color:#55657b}
.field input,.field select,.actions input,.actions select{width:100%;padding:12px;border:1px solid #d7e0ea;border-radius:11px;font:inherit;background:#fff;outline:none}
.field input:focus,.field select:focus,.actions input:focus,.actions select:focus{border-color:#93c5fd;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
.actions{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap}
.table-wrap{overflow:auto;background:#fff;border-radius:18px;border:1px solid #e5ebf2}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:13px 14px;border-bottom:1px solid #edf1f5;text-align:right;white-space:nowrap}
.table th{background:#f8fafc;color:#52647b;font-size:11px}.table td{font-size:11px;color:#344860}.table tr:last-child td{border-bottom:0}.table tr:hover td{background:#fbfdff}
.badge{padding:5px 9px;border-radius:20px;background:#e8f2ff;color:#1267d6;font-size:10px;font-weight:700}.badge.green{background:#e7f8f1;color:#087c59}.badge.red{background:#ffebee;color:#b92f3c}
.slot{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-top:12px}.slot:first-child{margin-top:0}
.price{font-weight:800;color:#0d7c5c}
.section{margin-top:28px}.section h2{font-size:19px}
.app-footer{text-align:center;color:#9aa6b5;padding:0 20px 28px;margin-right:284px;font-size:9px}

/* =========================================================
   LOGIN
========================================================= */
.login{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 20% 20%,rgba(27,120,192,.35),transparent 35%),radial-gradient(circle at 90% 80%,rgba(8,145,178,.2),transparent 30%),linear-gradient(135deg,#071d39,#0b4c82)}
.loginbox{width:min(450px,92%);background:rgba(255,255,255,.97);border-radius:28px;padding:35px;box-shadow:0 30px 80px rgba(0,20,46,.34)}
.loginbox h1{text-align:center;margin:0 0 8px}.loginbox p{text-align:center;color:#667085}.logo{font-size:48px;text-align:center;margin-bottom:12px}

footer:not(.app-footer){text-align:center;color:#8793a4;padding:35px}

/* =========================================================
   MOBILE — STILL SIDEBAR, NO TOP MENU
========================================================= */
@media(max-width:900px){
 .app-sidebar{width:78px;padding:12px;top:10px;right:10px;bottom:10px;border-radius:20px}
 .sidebar-brand{justify-content:center;padding-bottom:13px}.sidebar-brand-text,.sidebar-user-info,.sidebar-section-title,.sidebar-link span,.sidebar-info-link span,.sidebar-info-link b,.sidebar-logout span,.sidebar-version{display:none}
 .sidebar-brand-icon{width:45px;height:45px;flex-basis:45px}
 .sidebar-user-card{justify-content:center;padding:8px;margin:12px 0}.sidebar-avatar{width:42px;height:42px;flex-basis:42px}
 .sidebar-link,.sidebar-info-link,.sidebar-logout{justify-content:center;padding:0;min-height:46px}
 .sidebar-link.active{transform:none}.sidebar-badge{position:absolute;margin-top:-31px;margin-right:-33px;min-width:17px;padding:1px 4px;font-size:7px}
 .app-main{width:calc(100% - 104px);margin-right:104px;padding:20px 16px 35px}
 .app-footer{margin-right:104px}
 .app-page-head{margin-bottom:15px}.app-page-head h1{font-size:19px}.head-credit{padding:8px 10px}.head-credit span,.head-credit small{display:none}
 .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:560px){
 .app-main{padding:15px 10px 30px}.app-sidebar{right:7px;width:66px}.app-main{width:calc(100% - 83px);margin-right:83px}.app-footer{margin-right:83px}
 .grid{grid-template-columns:1fr}.fields{grid-template-columns:1fr}.card{padding:16px;border-radius:17px}.hero{padding:23px;border-radius:20px}.hero h1{font-size:23px}.slot{align-items:flex-start;flex-direction:column}.slot form,.slot form .btn{width:100%}
 .app-page-head{align-items:flex-start}.head-credit{display:none}
}

/* Dashboard keeps the same sidebar on small screens — no bottom/top menu. */
@media(max-width:760px){
    .dashboard-page .dashboard-layout{
        display:grid !important;
        grid-template-columns:68px minmax(0,1fr) !important;
        gap:10px !important;
        padding:0 8px !important;
    }
    .dashboard-page .dashboard-sidebar{
        display:flex !important;
        position:sticky !important;
        top:8px !important;
        width:68px !important;
        height:calc(100vh - 16px) !important;
        max-height:none !important;
        padding:8px !important;
        border-radius:20px !important;
    }
    .dashboard-page .sidebar-brand{
        justify-content:center !important;
        padding:2px 0 11px !important;
    }
    .dashboard-page .sidebar-brand > div:last-child,
    .dashboard-page .sidebar-user-name,
    .dashboard-page .sidebar-user-role,
    .dashboard-page .menu-label,
    .dashboard-page .dashboard-menu-item:not(.active) .menu-badge,
    .dashboard-page .logout-link:not(:has(svg)){display:none !important}
    .dashboard-page .sidebar-user{justify-content:center !important;padding:7px !important}
    .dashboard-page .dashboard-menu-item{justify-content:center !important;padding:0 !important;min-height:43px !important}
    .dashboard-page .dashboard-menu-item svg{width:19px !important;height:19px !important}
    .dashboard-page .dashboard-menu-item .menu-badge{position:absolute;transform:translate(-18px,-13px);margin:0}
    .dashboard-page .sidebar-footer .logout-link{justify-content:center !important;padding:0 !important}
    .dashboard-page .sidebar-footer .logout-link svg{width:18px !important;height:18px !important}
    .dashboard-page .dashboard-main{min-width:0 !important}
}