/* Site polish: icons, mobile header and responsive fixes. Loaded after all other site styles. */
:root{--px-accent:#6e25ba;--px-accent-2:#9333ea;--px-soft:#f4edfc;--px-line:#ebe5f2;--px-text:#1d1530;--px-muted:#6f6880;--px-radius:16px}

/* ---------- Icons ---------- */
.ico{width:1.15em;height:1.15em;display:inline-block;vertical-align:-.2em;flex-shrink:0}
.empty-symbol .ico,.service-icon .ico,.path-icon .ico,.resource-symbol .ico{width:26px;height:26px}
.academy-benefits>div>span .ico,.dashboard-stats span .ico,.chip-icon .ico{width:22px;height:22px}
.class-controls span .ico{width:18px;height:18px}
.nav-caret{display:inline-flex;align-items:center}
.nav-caret .ico{width:14px;height:14px;transition:transform .2s}
details[open]>summary .nav-caret .ico{transform:rotate(180deg)}
.course-finder>span .ico{width:20px;height:20px}
.hero-badge .ico{width:15px;height:15px}
.cert-ok .ico{color:#2f7a4f}
.admin-sync h3 .ico{color:var(--px-accent)}
.win-dots{display:inline-flex;gap:5px;align-items:center}
.win-dots i{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.55}
/* Decorative diamonds that used to be text glyphs */
.contact-band:after{content:''!important;width:150px;height:150px;border:1px solid #ffffff12;border-radius:18px;transform:rotate(45deg);top:-40px!important;font-size:0!important}
.auth-layout>div:first-child:before{content:''!important;width:220px;height:220px;border:2px solid #9333ea12;border-radius:30px;transform:rotate(45deg);top:20px!important;left:10px!important;font-size:0!important}
:is(.page-login,.page-register) .auth-panel:before{content:''!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M12 3l8 9-8 9-8-9z'/%3E%3C/svg%3E"),linear-gradient(135deg,#9630ee,#6221bc)!important;background-repeat:no-repeat!important;background-position:center!important;background-size:26px 26px,cover!important}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ---------- Header ---------- */
.nav-toggle,.nav-mobile-actions,.mobile-login{display:none}
@media (max-width:900px){
 .announcement{display:none}
 .site-header{position:sticky;top:0;z-index:60;padding:8px 0!important;background:#ffffffeb;backdrop-filter:saturate(1.4) blur(10px)}
 .site-header .header-inner{display:flex!important;flex-wrap:nowrap!important;flex-direction:row!important;align-items:center!important;gap:8px!important;padding:8px 10px!important;min-height:0!important;border-radius:16px!important;position:relative}
 .site-header .brand{flex:1;min-width:0;gap:8px!important}
 .site-header .brand-icon{width:40px!important;height:40px!important;min-width:40px}
 .site-header .brand strong{font-size:16px!important;white-space:nowrap}
 .site-header .brand small{display:none!important}
 .site-header .header-actions{display:flex!important;flex-wrap:nowrap!important;gap:6px!important;margin:0!important;width:auto!important;order:2}
 .site-header .header-actions>*{display:none!important}
 .site-header .header-actions>.button:first-child,.site-header .header-actions>.mobile-login{display:inline-flex!important}
 .site-header .header-actions .button{min-height:38px!important;padding:6px 14px!important;font-size:13px!important;white-space:nowrap}
 .nav-toggle{display:inline-grid;place-items:center;order:3;width:42px;height:42px;border-radius:12px;border:1px solid var(--px-line);background:#fff;color:var(--px-text);cursor:pointer;padding:0}
 .nav-toggle .ico{width:22px;height:22px}
 .nav-toggle-close{display:none}
 .nav-open .nav-toggle-open{display:none}
 .nav-open .nav-toggle-close{display:inline}
 .site-header #main-nav{display:none!important;position:absolute;top:calc(100% + 8px);inset-inline:0;flex-direction:column!important;align-items:stretch!important;gap:2px!important;padding:10px!important;background:#fff;border:1px solid var(--px-line);border-radius:16px;box-shadow:0 18px 40px #2a103f22;max-height:calc(100vh - 110px);overflow-y:auto;width:auto!important;margin:0!important}
 .nav-open .site-header #main-nav{display:flex!important}
 .site-header #main-nav>a,.site-header #main-nav summary{display:flex!important;align-items:center;justify-content:space-between;padding:12px 14px!important;border-radius:12px;font-size:15px!important;color:var(--px-text)!important;white-space:normal}
 .site-header #main-nav>a:hover,.site-header #main-nav summary:hover{background:var(--px-soft)}
 .site-header #main-nav .nav-dropdown{width:100%}
 .site-header #main-nav .nav-drop-panel{position:static!important;transform:none!important;box-shadow:none!important;border:0!important;margin:0 8px 6px!important;padding:4px!important;min-width:0!important;width:auto!important;background:var(--px-soft)!important;border-radius:12px!important;opacity:1!important;visibility:visible!important}
 .site-header #main-nav .nav-drop-panel a{padding:10px 12px!important;display:block}
 .nav-mobile-actions{display:flex;flex-direction:column;gap:6px;margin-top:8px;padding-top:10px;border-top:1px solid var(--px-line)}
 .nav-mobile-actions a{display:block;padding:12px 14px;border-radius:12px;background:var(--px-accent);color:#fff!important;text-align:center;font-weight:bold}
 .nav-mobile-actions a+a{background:#fff;color:var(--px-accent)!important;border:1px solid var(--px-line)}
}
@media (max-width:380px){.site-header .brand strong{font-size:14px!important}}

/* ---------- Footer: trust badge belongs to the footer ---------- */
.site-footer section[aria-label="نشان اعتماد پرداخت"]{background:#ffffff08!important;border-color:#ffffff17!important;color:#ece7f6;padding:16px 20px!important;border-radius:16px!important}
.site-footer section[aria-label="نشان اعتماد پرداخت"] strong{color:#fff;font-size:15px!important;margin-bottom:4px!important}
.site-footer section[aria-label="نشان اعتماد پرداخت"]>div:last-child{min-width:96px!important;padding:8px 12px!important}

/* ---------- Homepage on phones: horizontal card rows instead of very long stacks ---------- */
@media (max-width:640px){
 .page-home .home-course-section .course-grid,.page-home .academy-journal .journal-grid{display:flex!important;grid-template-columns:none!important;gap:12px!important;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 14px;margin-inline:-4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
 .page-home .home-course-section .course-grid>*,.page-home .academy-journal .journal-grid>*{flex:0 0 82%;max-width:320px;scroll-snap-align:start}
 .page-home .section,.page-home .online-school,.page-home .learning-road,.page-home .academy-journal{padding-top:44px!important;padding-bottom:44px!important}
 .page-home .section-head{gap:10px!important;margin-bottom:18px!important}
 .page-home .section-head h2{font-size:26px!important;line-height:1.45}
 .page-home .hero{padding-top:18px!important}
 .page-home .hero h1{font-size:40px!important;line-height:1.35!important}
 .page-home .academy-benefits{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;padding:14px!important}
 .page-home .academy-benefits>div{gap:8px!important;padding:0!important;border:0!important}
 .page-home .department-grid{gap:12px!important}
}
@media (max-width:640px){
 .page-home .department-card{display:grid!important;grid-template-columns:56px 1fr auto!important;align-items:center!important;gap:14px!important;padding:14px 16px!important;min-height:0!important}
 .page-home .department-card .department-number,.page-home .department-card .eyebrow{display:none!important}
 .page-home .department-card .department-symbol{width:56px!important;height:56px!important;margin:0!important;font-size:24px!important;display:grid!important;place-items:center;border-radius:14px!important}
 .page-home .department-card h3{font-size:18px!important;margin:0 0 2px!important}
 .page-home .department-card p{margin:0!important;font-size:13px!important}
 .page-home .department-card .department-arrow{position:static!important;width:34px!important;height:34px!important;display:grid!important;place-items:center}
 .page-home .section-head>div+p,.page-home .section-head>p:last-child{font-size:13px!important}
}

/* ---------- Login / register / identity on phones: the form comes first ---------- */
@media (max-width:640px){
 .auth-layout{display:block!important;padding-top:14px!important;padding-bottom:30px!important;min-height:0!important}
 .auth-layout>div:first-child{display:none!important}
 .auth-panel{margin:0!important;padding:22px 18px!important;border-radius:20px!important}
 :is(.page-login,.page-register) .auth-panel:before{width:44px!important;height:44px!important;margin-bottom:14px!important;border-radius:14px!important}
 .auth-panel h2{font-size:24px!important;margin:0 0 4px!important}
 .auth-panel input{font-size:16px!important;min-height:48px}
 .auth-panel .button.block{min-height:50px}
 .page-complete-profile .auth-layout>div:first-child{display:none!important}
}
.password-login{margin-top:14px;border:1px solid var(--px-line);border-radius:14px;padding:4px 14px}
.password-login>summary{cursor:pointer;padding:10px 0;font-size:14px;color:var(--px-accent);font-weight:bold}
.password-login[open]>summary{border-bottom:1px solid var(--px-line);margin-bottom:12px}

/* ---------- Student panel on phones: one scrollable row of tabs ---------- */
.dashboard-sidebar nav a{display:inline-flex;align-items:center;gap:6px}
@media (max-width:900px){
 .dashboard-sidebar{padding:8px!important;border-radius:16px!important;position:sticky;top:76px;z-index:20}
 .dashboard-sidebar nav{display:flex!important;flex-wrap:nowrap!important;gap:6px!important;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .dashboard-sidebar nav::-webkit-scrollbar{display:none}
 .dashboard-sidebar nav a{flex:0 0 auto;white-space:nowrap;padding:9px 12px!important;border-radius:12px!important;font-size:13px!important}
 .dashboard-sidebar>*:not(nav){display:none!important}
}
@media (max-width:640px){
 .page-dashboard .page-hero.compact{padding:18px 0 8px!important}
 .page-dashboard .page-hero.compact h1{font-size:24px!important}
 .dashboard-stats{gap:8px!important}
 .dashboard-stats>div{padding:12px!important;border-radius:14px!important}
 .list-row{flex-wrap:wrap;gap:10px!important;padding:14px!important}
 .list-row>div:first-child{flex:1 1 100%}
}
@media (max-width:900px){
 .dashboard-layout{display:block!important;grid-template-columns:minmax(0,1fr)!important}
 .dashboard-layout>*{min-width:0!important;max-width:100%!important}
 .dashboard-sidebar{margin-bottom:12px!important}
}