/* ============================================================
   Palangi — Account / Student & Teacher dashboard theme
   Scoped to the account section via #sidebar and .row:has(#sidebar)
   so it never touches the storefront pages.
   ============================================================ */

:root{
    --acc-primary:#3659a1;
    --acc-primary-dark:#22406f;
    --acc-accent:#fbb040;
    --acc-danger:#dd0808;
    --acc-success:#1f8a3e;
    --acc-bg:#f5f7fb;
    --acc-border:#e7eaf3;
    --acc-radius:16px;
    --acc-shadow:0 10px 30px rgba(17,38,84,.08);
}

/* ---------------- sidebar ---------------- */
#sidebar.account-sidebar{
    background:#fff;
    border-radius:var(--acc-radius);
    box-shadow:var(--acc-shadow);
    padding:0 0 16px;
    overflow:hidden;
    position:sticky;
    top:20px;
}

.account-profile-card{
    background:linear-gradient(135deg,var(--acc-primary) 0%,var(--acc-primary-dark) 100%);
    padding:28px 20px 22px;
    text-align:center;
    color:#fff;
}
.account-profile-avatar{
    width:76px;height:76px;margin:0 auto 12px;border-radius:50%;
    overflow:hidden;border:3px solid rgba(255,255,255,.7);
    box-shadow:0 6px 18px rgba(0,0,0,.18);
}
.account-profile-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.account-profile-name{font-size:15px;font-weight:700;margin-bottom:8px}

.account-role-badge{
    display:inline-flex;align-items:center;justify-content:center;
    font-size:11px;font-weight:700;padding:3px 12px;border-radius:20px;
    background:rgba(255,255,255,.2);color:#fff;
}

.account-nav{padding:14px 14px 4px}
.account-nav-group{margin-bottom:14px}
.account-nav-group:last-child{margin-bottom:4px}
.account-nav-group-title{
    display:block;font-size:11px;font-weight:700;color:#9aa3b8;
    text-transform:uppercase;letter-spacing:.03em;padding:0 10px 6px;
}
.account-nav-link{
    display:flex;align-items:center;gap:10px;
    padding:9px 12px;border-radius:10px;font-size:13px;font-weight:600;
    color:#4b5468;text-decoration:none;transition:.2s;margin-bottom:2px;
}
.account-nav-link:hover{background:var(--acc-bg);color:var(--acc-primary-dark)}
.account-nav-link.is-active{
    background:linear-gradient(135deg,var(--acc-primary) 0%,var(--acc-primary-dark) 100%);
    color:#fff;box-shadow:0 6px 16px rgba(54,89,161,.28);
}
.account-nav-icon{
    width:20px;display:inline-flex;align-items:center;justify-content:center;
    font-size:14px;color:inherit;opacity:.85;
}
.account-nav-link.is-active .account-nav-icon{opacity:1}
.account-nav-label{flex:1}

.account-logout-btn{
    display:flex;align-items:center;justify-content:center;gap:8px;
    margin:10px 14px 0;padding:10px;border-radius:10px;
    background:#fdecec;color:var(--acc-danger);font-weight:700;font-size:13px;
    text-decoration:none;transition:.2s;
}
.account-logout-btn:hover{background:var(--acc-danger);color:#fff}

/* ---------------- dashboard hero ---------------- */
.account-hero{
    background:linear-gradient(120deg,#eef2fb 0%,#fdf6ea 100%);
    border:1px solid var(--acc-border);
    border-radius:var(--acc-radius);
    padding:26px 28px;
    display:flex;flex-wrap:wrap;gap:20px;
    align-items:center;justify-content:space-between;
    margin-bottom:22px;
}
.account-hero-info{display:flex;align-items:center;gap:16px;flex:1;min-width:260px}
.account-hero-avatar{width:64px;height:64px;border-radius:50%;overflow:hidden;border:3px solid #fff;box-shadow:var(--acc-shadow);flex-shrink:0}
.account-hero-avatar img{width:100%;height:100%;object-fit:cover}
.account-hero-eyebrow{display:block;font-size:11px;font-weight:700;color:var(--acc-primary);margin-bottom:4px}
.account-hero-title{font-size:17px;font-weight:800;color:#20263d;display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.account-hero-subtitle{font-size:12.5px;color:#6b7385;margin:0;max-width:520px;line-height:1.9}

.account-hero .account-role-badge{background:#eef1fb;color:var(--acc-primary)}
.account-hero .account-role-badge-admin{background:#fdecec;color:var(--acc-danger)}
.account-hero .account-role-badge-teacher{background:#fff3e0;color:#c07300}
.account-hero .account-role-badge-student{background:#eaf6ec;color:var(--acc-success)}
.account-hero .account-role-badge-seller{background:#eef1fb;color:var(--acc-primary)}

.account-hero-stats{display:flex;gap:12px;flex-wrap:wrap}
.account-stat{
    background:#fff;border-radius:12px;padding:10px 18px;min-width:90px;
    text-align:center;box-shadow:var(--acc-shadow);
}
.account-stat-value{display:block;font-size:16px;font-weight:800;color:var(--acc-primary-dark)}
.account-stat-label{display:block;font-size:10.5px;color:#8b93a7;margin-top:2px}

/* ---------------- quick links grid ---------------- */
.account-quick-links{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));
    gap:12px;margin-bottom:6px;
}
.account-quick-link{
    display:flex;flex-direction:column;align-items:center;gap:8px;
    background:#fff;border:1px solid var(--acc-border);border-radius:14px;
    padding:16px 8px;text-decoration:none;color:#3b4256;font-size:12px;font-weight:600;
    transition:.2s;text-align:center;
}
.account-quick-link:hover{transform:translateY(-3px);box-shadow:var(--acc-shadow);border-color:transparent;color:var(--acc-primary-dark)}
.account-quick-link-icon{
    width:42px;height:42px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:var(--acc-bg);color:var(--acc-primary);font-size:16px;
}

/* ---------------- generic content styling for every account page ---------------- */
.row:has(#sidebar) .card{
    border:0;border-radius:var(--acc-radius);
    box-shadow:var(--acc-shadow);overflow:hidden;
}
.row:has(#sidebar) .card-header{
    background:#fff;border-bottom:1px solid var(--acc-border);
    font-size:14px;font-weight:800;color:#20263d;padding:16px 20px;
}
.row:has(#sidebar) .card-body{padding:20px}

.row:has(#sidebar) .table{margin-bottom:0}
.row:has(#sidebar) .table thead th,
.row:has(#sidebar) .thead-dark th{
    background:var(--acc-bg);color:#4b5468;font-size:12px;font-weight:700;
    border-bottom:0;border-color:var(--acc-border);
}
.row:has(#sidebar) .table td,
.row:has(#sidebar) .table th{vertical-align:middle;font-size:12.5px;padding:10px 12px}

.row:has(#sidebar) .btn{border-radius:8px}
.row:has(#sidebar) .btn-primary{
    background:linear-gradient(135deg,var(--acc-primary) 0%,var(--acc-primary-dark) 100%);
    border:0;
}
.row:has(#sidebar) .btn-outline-primary{color:var(--acc-primary);border-color:var(--acc-primary)}
.row:has(#sidebar) .btn-outline-primary:hover{background:var(--acc-primary);border-color:var(--acc-primary);color:#fff}

.row:has(#sidebar) .form-control{border-radius:8px;border-color:var(--acc-border)}
.row:has(#sidebar) .form-control:focus{border-color:var(--acc-primary);box-shadow:0 0 0 .2rem rgba(54,89,161,.12)}

/* ---------------- responsive ---------------- */
@media (max-width:991.98px){
    #sidebar.account-sidebar{position:static;margin-bottom:20px}
    .account-hero{padding:20px}
    .account-hero-stats{width:100%;justify-content:space-between}
    .account-stat{flex:1;min-width:70px;padding:8px 10px}
}