/* Alo Solar Energy: scoped layout refinement. Business logic remains in original files. */
:root{--ui-space:clamp(18px,2.4vw,30px);--ui-border:rgba(202,215,204,.13);--ui-radius:18px}
html{scroll-padding-top:96px;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body[data-layout]{font-family:Inter,"Noto Sans Arabic",Tahoma,system-ui,sans-serif;line-height:1.65}
html[dir=rtl] body[data-layout]{font-family:"Noto Sans Arabic",Tahoma,system-ui,sans-serif}
body[data-layout] *,body[data-layout] *::before,body[data-layout] *::after{box-sizing:border-box}
body[data-layout] :is(button,input,select,textarea){font-family:inherit}
body[data-layout] :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){font-size:16px;max-width:100%;border-radius:11px}
body[data-layout] :is(button,a,input,select,textarea):focus-visible{outline:2px solid #e7c65a;outline-offset:3px}
body[data-layout] :is(p,h1,h2,h3,label){overflow-wrap:break-word}
html[dir=rtl] body[data-layout] :is(h1,h2,h3,.brand,.kicker,.eyebrow){letter-spacing:normal}
body[data-layout] :is(main,.container,.wrap,.form-grid,.calc-row,.fields)>*{min-width:0}
body[data-layout] :is(button,.btn,.login-button,.order){touch-action:manipulation}
body[data-layout=home] :is(.container){max-width:1240px}
body[data-layout=home] :is(.grid3,.features,.calculator-grid){gap:22px}
body[data-layout=home] :is(.card,.calc-card,.calc-result,.hero-card){border-radius:22px;border-color:var(--ui-border)}
body[data-layout=home] .hero-copy h1{font-size:clamp(34px,4.7vw,68px);line-height:1.3;max-width:850px}
body[data-layout=home] :is(.calc-card,.calc-result){padding:var(--ui-space)}
body[data-layout=home] :is(.calc-row,.easy-quality-grid){gap:14px}
body[data-layout=home] :is(.field,.calc-field)>label{display:block;margin-bottom:8px;font-size:14px;line-height:1.65}
body[data-layout=home] :is(.field,.calc-field) :is(input,select){min-height:50px}
body[data-layout=home] .brand-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
body[data-layout=home] :is(.calc-actions,.easy-actions){display:flex;flex-wrap:wrap;gap:12px}
body[data-layout=home] :is(.calc-actions,.easy-actions)>*{flex:1 1 130px;min-height:48px}
body[data-layout=home] .calc-breakdown{line-height:1.85}
body[data-layout=products] main{width:min(1220px,calc(100% - 40px));margin-inline:auto}
body[data-layout=products] .filters{display:flex;gap:10px;flex-wrap:wrap;margin-block:24px}
body[data-layout=products] .filters button{min-height:44px;padding:10px 18px;border-radius:12px}
body[data-layout=products] #productGrid{gap:22px;align-items:stretch}
body[data-layout=products] #productGrid>article{border-radius:20px;overflow:hidden}
body[data-layout=installers] main{width:min(1220px,calc(100% - 40px));margin-inline:auto}
body[data-layout=installers] .login-view{grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:clamp(28px,5vw,72px);align-items:start}
body[data-layout=installers] .login-card{padding:clamp(22px,3vw,34px);border-radius:24px;border-color:var(--ui-border);box-shadow:0 16px 48px #0002}
body[data-layout=installers] .login-copy{padding-top:28px}
body[data-layout=installers] .login-copy h1{font-size:clamp(30px,3.6vw,48px);line-height:1.45}
body[data-layout=installers] .auth-tabs{gap:6px;margin-bottom:26px;padding:5px;border-radius:13px}
body[data-layout=installers] .auth-tabs button{min-height:48px;font-size:14px}
body[data-layout=installers] #registerForm .form-grid{column-gap:16px;row-gap:18px}
body[data-layout=installers] #registerForm label{margin:0}
body[data-layout=installers] #registerForm label>span:first-child{display:block;margin-bottom:8px;font-size:14px}
body[data-layout=installers] #registerForm .registration-hint{font-size:12px;line-height:1.85;margin-top:8px}
body[data-layout=installers] :is(.login-button,.forgot-link){min-height:46px}
body[data-layout=installers] .price-grid{gap:20px}
body[data-layout=installers] .product{border-color:var(--ui-border);padding:22px;border-radius:20px}
body[data-layout=installers] .toolbar{gap:18px;flex-wrap:wrap}
body[data-layout=installers] .tabs{gap:8px}
body[data-layout=installers] .tabs button{min-height:44px}
body[data-layout=installers] .stats article{border-color:var(--ui-border)}
body[data-layout=admin] main{width:min(1360px,calc(100% - 48px));margin:32px auto 64px}
body[data-layout=admin] .heading{align-items:center;gap:20px;margin-bottom:28px}
body[data-layout=admin] .heading h1{font-size:clamp(25px,3vw,40px);line-height:1.45;margin-block:10px}
body[data-layout=admin] #adminPanel>nav{display:flex;flex-wrap:wrap;gap:8px;padding:10px;background:#0d1d15;border:1px solid var(--ui-border);border-radius:16px;margin-bottom:24px}
body[data-layout=admin] #adminPanel>nav button{min-height:46px;padding:10px 17px;border-radius:10px;font-size:14px}
body[data-layout=admin] :is(.box,.application-search){padding:var(--ui-space);border:1px solid var(--ui-border);border-radius:20px;margin-bottom:24px}
body[data-layout=admin] .box h2{font-size:21px;line-height:1.6;margin-top:0}
body[data-layout=admin] :is(.form-grid,.service-grid){gap:18px;align-items:start}
body[data-layout=admin] :is(.form-grid,.service-grid) label{font-size:13px;line-height:1.7}
body[data-layout=admin] :is(input:not([type=checkbox]):not([type=hidden]),select){min-height:46px}
body[data-layout=admin] .cards{gap:18px}
body[data-layout=admin] .cards>article{border-radius:18px;padding:22px;min-width:0}
body[data-layout=admin] .installer-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
body[data-layout=admin] .installer-tabs button{min-height:44px;padding:10px 15px}
body[data-layout=admin] .table-wrap{overflow:auto;max-width:100%;border:1px solid var(--ui-border);border-radius:16px}
body[data-layout=admin] table{min-width:780px;border-collapse:collapse}
body[data-layout=admin] :is(th,td){padding:14px;text-align:start;vertical-align:top}
body[data-layout=admin] th{background:#172b20;white-space:nowrap;font-size:13px}
body[data-layout=admin] tbody tr:nth-child(even){background:#ffffff03}
body[data-layout=admin] .section-title{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
body[data-layout=ev] .hero h1{line-height:1.2}
html[dir=rtl] body[data-layout=ev] .hero h1{letter-spacing:normal}
body[data-layout=ev] .fields{gap:16px}
body[data-layout=ev] .modal-card{max-height:calc(100dvh - 32px);overflow:auto;border-radius:22px}
body[data-layout=ev] .field label{line-height:1.8;margin-bottom:8px}
body[data-layout=ev] :is(.field input,.field select){min-height:48px}
@media(max-width:900px){
 body[data-layout=installers] .login-view{grid-template-columns:1fr;gap:24px;padding-top:30px}
 body[data-layout=installers] .login-copy{padding:0;text-align:center}
 body[data-layout=installers] .login-copy h1{font-size:30px}
 body[data-layout=installers] .login-card{width:100%;max-width:620px;margin-inline:auto}
 body[data-layout=admin] :is(.service-grid,.calc-grid){grid-template-columns:repeat(2,minmax(0,1fr))}
 body[data-layout=admin] .heading{flex-wrap:wrap}
}
@media(max-width:600px){
 body[data-layout] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){font-size:16px!important}
 body[data-layout=home] .container{width:calc(100% - 28px)}
 body[data-layout=home] :is(.calc-card,.calc-result){padding:18px}
 body[data-layout=home] .hero-copy h1{font-size:32px;line-height:1.45}
 body[data-layout=home] .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 body[data-layout=home] .easy-quality-grid{gap:8px}
 body[data-layout=home] .easy-quality{padding:12px 8px;font-size:13px}
 body[data-layout=products] main,body[data-layout=installers] main,body[data-layout=admin] main{width:calc(100% - 28px)}
 body[data-layout=products] #productGrid{grid-template-columns:minmax(0,1fr)}
 body[data-layout=products] .filters{gap:7px}
 body[data-layout=products] .filters button{flex:1 1 auto;font-size:13px;padding:9px 12px}
 body[data-layout=installers] .login-card{padding:22px 18px}
 body[data-layout=installers] .login-copy h1{font-size:27px}
 body[data-layout=installers] .stats{gap:10px;margin-block:22px}
 body[data-layout=installers] .welcome-row h1{font-size:28px}
 body[data-layout=installers] .product{padding:18px}
 body[data-layout=admin] main{margin-top:24px}
 body[data-layout=admin] #adminPanel>nav{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding:8px;scrollbar-width:thin}
 body[data-layout=admin] #adminPanel>nav button{flex:0 0 auto;white-space:nowrap}
 body[data-layout=admin] :is(.form-grid,.service-grid,.calc-grid){grid-template-columns:minmax(0,1fr)}
 body[data-layout=admin] .heading h1{font-size:25px}
 body[data-layout=admin] :is(.box,.application-search){padding:18px}
 body[data-layout=admin] .cards{grid-template-columns:minmax(0,1fr)}
 body[data-layout=admin] .application-search-controls{display:flex;flex-wrap:wrap;gap:10px}
 body[data-layout=admin] .application-search-controls input{flex:1 1 200px;min-width:0}
 body[data-layout=ev] .hero-copy{padding-top:85px}
 body[data-layout=ev] .hero h1{font-size:clamp(37px,11vw,56px);line-height:1.3}
 body[data-layout=ev] .head h2{font-size:30px;line-height:1.4}
 body[data-layout=ev] .modal-card{padding:22px 16px;width:calc(100% - 24px)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body[data-layout] *{animation-duration:.01ms!important;transition-duration:.01ms!important}}