@font-face{font-family:DIN Next LT Arabic;src:url(/font/DINNextLTArabic-Medium-4.ttf) format("truetype");font-weight:400;font-style:normal}:root{font-family:DIN Next LT Arabic,Cairo,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#213547;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--primary-color: #0a7e5a;--primary-hover: #086b4d;--secondary-color: #ffd700;--background-color: #f5f5f5;--card-background: #ffffff;--text-color: #213547;--text-secondary: #666666;--border-color: #e0e0e0}html,body,#root{height:100%}body{margin:0;display:flex;min-width:320px;min-height:100vh;background-color:var(--background-color)}#root{width:100%}h1{font-size:3.2em;line-height:1.1}button{font-family:inherit}a{font-weight:500;color:var(--primary-color);text-decoration:inherit}a:hover{color:var(--primary-hover)}button{border-radius:8px;border:1px solid transparent;font-size:1em;font-weight:500;font-family:inherit;cursor:pointer;transition:all .25s}button:hover{opacity:.9}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}input{font-family:inherit}*{margin:0;padding:0;box-sizing:border-box}body{font-family:DIN Next LT Arabic,Cairo,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:#f5f5f5}.app-container{min-height:100vh;display:flex;flex-direction:column}.header{background-color:#fff;border-bottom:1px solid #e0e0e0;position:sticky;top:0;z-index:100;box-shadow:0 2px 4px #0000001a}.header-container{display:flex;align-items:center;justify-content:space-between;padding:.75rem 2rem;max-width:1920px;margin:0 auto}.logo-section .absher-logo{height:60px;width:auto}.main-nav{display:flex;gap:.5rem;flex:1;justify-content:center}.nav-btn{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.5rem 1rem;background:none;border:none;cursor:pointer;border-radius:8px;transition:all .2s;font-size:.75rem}.nav-btn:hover{background-color:#f0f0f0;transform:translateY(-2px)}.nav-btn.active{background-color:#0a7e5a;color:#fff}.nav-icon{width:24px;height:24px}.header-right{display:flex;align-items:center;gap:1.5rem}.vision-logo img{height:50px;width:auto}.moi-logo img{height:60px;width:auto}.profile-section{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:linear-gradient(135deg,#f8f9fa,#fff);border-radius:50px;border:1px solid #e0e0e0;transition:all .2s}.profile-section:hover{box-shadow:0 2px 8px #0000001a}.profile-img{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#0a7e5a,#0fa875);display:flex;align-items:center;justify-content:center;color:#fff}.profile-img svg{width:24px;height:24px}.main-layout{display:flex;flex:1;max-width:1920px;margin:0 auto;width:100%}.sidebar{width:280px;background-color:#fff;border-left:1px solid #e0e0e0;padding:1rem}.sidebar-header{display:flex;align-items:center;justify-content:center;margin-bottom:1rem;padding-bottom:1rem;border-bottom:2px solid #0a7e5a}.sidebar-toggle{background:none;border:none;cursor:pointer;color:#0a7e5a;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;transition:all .2s}.sidebar-toggle:hover{background-color:#f0f0f0}.sidebar-toggle svg{width:24px;height:24px}.sidebar-nav{display:flex;flex-direction:column;gap:.5rem}.sidebar-item{display:flex;align-items:center;gap:.75rem;padding:1rem;background:none;border:none;border-radius:8px;cursor:pointer;text-align:right;font-size:1rem;transition:all .2s;position:relative}.sidebar-item:hover{background-color:#f0f0f0}.sidebar-item.active{background-color:#0a7e5a;color:#fff}.sidebar-item.gamification{background:linear-gradient(135deg,gold,#ffed4e);color:#000;font-weight:700;border:2px solid #ffa500}.sidebar-item.gamification:hover{transform:scale(1.02);box-shadow:0 4px 8px #ffd7004d}.sidebar-item.gamification.active{background:linear-gradient(135deg,orange,gold);color:#000}.sidebar-icon{width:24px;height:24px;flex-shrink:0}.badge-new{position:absolute;left:10px;background-color:#f44;color:#fff;font-size:.65rem;padding:.2rem .5rem;border-radius:12px;font-weight:700}.main-content{flex:1;padding:2rem;overflow-y:auto}.services-container{max-width:1200px;margin:0 auto}.search-section{display:flex;gap:1rem;margin-bottom:2rem;background:#fff;padding:1.5rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.search-input{flex:1;padding:.75rem 1rem;border:2px solid #e0e0e0;border-radius:8px;font-size:1rem;text-align:right;font-family:inherit}.search-btn{padding:.75rem 2rem;background-color:#0a7e5a;color:#fff;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:background-color .2s}.search-btn:hover{background-color:#086b4d}.main-services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin-bottom:3rem}.service-card{background:#fff;border-radius:16px;padding:2rem 1.5rem;display:flex;flex-direction:column;align-items:center;gap:1rem;box-shadow:0 2px 8px #00000014;transition:all .3s cubic-bezier(.4,0,.2,1);border:1px solid rgba(10,126,90,.1)}.service-card:hover{transform:translateY(-6px);box-shadow:0 8px 24px #0a7e5a26;border-color:#0a7e5a4d}.service-icon{font-size:3rem}.service-icon-svg{width:64px;height:64px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#e8f5f1,#f0f9f6);border-radius:16px;color:#0a7e5a;transition:all .3s}.service-card:hover .service-icon-svg{background:linear-gradient(135deg,#0a7e5a,#0fa875);color:#fff;transform:scale(1.1) rotate(5deg)}.service-icon-svg svg{width:36px;height:36px}.service-btn{width:100%;padding:.75rem;background-color:#0a7e5a;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:background-color .2s;font-family:inherit}.service-btn:hover{background-color:#086b4d}.other-services-section{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.section-title{text-align:center;font-size:1.5rem;margin-bottom:2rem;color:#333;position:relative}.section-title:after{content:"";display:block;width:100px;height:3px;background:linear-gradient(90deg,transparent,#0a7e5a,transparent);margin:.5rem auto 0}.other-services-carousel{position:relative;display:flex;align-items:center;gap:1rem}.carousel-arrow{background-color:#0a7e5a;color:#fff;border:none;width:40px;height:40px;border-radius:50%;font-size:1.5rem;cursor:pointer;transition:background-color .2s;flex-shrink:0}.carousel-arrow:hover{background-color:#086b4d}.other-services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1.5rem;flex:1}.other-service{position:relative;min-height:180px}.service-badge{position:absolute;top:-10px;right:-10px;background:linear-gradient(135deg,#f44,#f66);color:#fff;padding:.25rem .75rem;border-radius:4px;font-size:.75rem;font-weight:700;transform:rotate(15deg);box-shadow:0 2px 4px #0003}.service-name{text-align:center;font-size:.95rem;color:#333}.carousel-dots{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem}.dot{width:10px;height:10px;border-radius:50%;background-color:#ccc;cursor:pointer;transition:background-color .2s}.dot.active{background-color:#0a7e5a}.gamification-panel{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:2rem}.stats-overview{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.profile-card,.points-card{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.profile-header{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.profile-avatar{width:80px;height:80px;border-radius:50%;border:3px solid #0a7e5a}.profile-info h2{font-size:1.5rem;margin-bottom:.25rem}.citizen-id{color:#666;font-size:.9rem}.tier-badge{display:flex;align-items:center;gap:1rem;background:linear-gradient(135deg,silver,#e8e8e8);padding:1.5rem;border-radius:8px}.tier-icon{font-size:3rem}.tier-info h3{font-size:1.25rem;margin-bottom:.25rem}.tier-info p{color:#666;font-size:.9rem}.points-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.points-header h3{font-size:1.25rem}.points-icon{font-size:2rem}.points-value{font-size:3.5rem;font-weight:700;color:#0a7e5a;text-align:center;margin:1rem 0}.points-progress{margin-top:1.5rem}.progress-bar{width:100%;height:20px;background-color:#e0e0e0;border-radius:10px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#0a7e5a,#0fa875);transition:width .3s}.progress-text{text-align:center;margin-top:.5rem;color:#666;font-size:.9rem}.achievements-section{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.badges-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.5rem}.badge-card{background:#f9f9f9;border-radius:12px;padding:1.5rem;text-align:center;transition:transform .2s}.badge-card.earned{background:linear-gradient(135deg,#fff9e6,#fff);border:2px solid #ffd700}.badge-card.earned:hover{transform:scale(1.05)}.badge-card.locked{opacity:.5;filter:grayscale(50%)}.badge-icon{font-size:3rem;margin-bottom:.5rem}.badge-name{font-weight:700;margin-bottom:.25rem;color:#333}.badge-desc{font-size:.85rem;color:#666}.earn-points-section{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 2px 8px #0000001a}.earn-methods{display:flex;flex-direction:column;gap:1rem}.earn-card{display:flex;align-items:center;gap:1.5rem;padding:1.5rem;background:linear-gradient(135deg,#f9f9f9,#fff);border-radius:12px;border-right:4px solid #0a7e5a;transition:all .3s;box-shadow:0 2px 4px #0000000d}.earn-card:hover{transform:translate(-4px);box-shadow:0 4px 12px #0a7e5a26}.earn-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0a7e5a,#0fa875);border-radius:12px;color:#fff;flex-shrink:0}.earn-icon svg{width:28px;height:28px}.earn-details{flex:1}.earn-details h4{font-size:1.1rem;margin-bottom:.25rem}.earn-details p{color:#666;font-size:.9rem}.earn-value{padding:.5rem 1rem;border-radius:20px;font-size:.85rem;font-weight:700}.earn-value.low-value{background-color:#e3f2fd;color:#1976d2}.earn-value.high-value{background-color:#fff3e0;color:#f57c00}.footer{background-color:#0a7e5a;color:#fff;padding:2rem;margin-top:auto}.footer-container{max-width:1920px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem}.footer-brand{display:flex;flex-direction:column;align-items:center;gap:1rem}.footer-logo img{width:100px;height:100px}.footer-phone{font-size:1.5rem;font-weight:700}.footer-apps{display:flex;flex-direction:column;gap:.5rem}.footer-apps img{height:40px}.footer-column h4{margin-bottom:1rem;font-size:1.1rem}.footer-column ul{list-style:none}.footer-column ul li{margin-bottom:.5rem}.footer-column ul li a{color:#fff;text-decoration:none;transition:opacity .2s}.footer-column ul li a:hover{opacity:.8}.social-links{display:flex;gap:1rem;margin-bottom:1rem}.social-icon{font-size:2rem;cursor:pointer;transition:transform .2s}.social-icon:hover{transform:scale(1.1)}.accessibility-tools h4{margin-top:1rem;margin-bottom:.5rem}.accessibility-buttons{display:flex;gap:.5rem}.accessibility-buttons button{padding:.5rem 1rem;background:#fff;color:#0a7e5a;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s}.accessibility-buttons button:hover{background-color:#f0f0f0}.placeholder-content{background:#fff;padding:3rem;border-radius:12px;text-align:center;box-shadow:0 2px 8px #0000001a}.placeholder-content h2{font-size:2rem;margin-bottom:1rem;color:#333}.placeholder-content p{font-size:1.2rem;color:#666}@media(max-width:1024px){.main-layout{flex-direction:column}.sidebar{width:100%;border-left:none;border-bottom:1px solid #e0e0e0}.sidebar-nav{flex-direction:row;overflow-x:auto}.stats-overview{grid-template-columns:1fr}}@media(max-width:768px){.header-container{flex-direction:column;gap:1rem}.main-nav{flex-wrap:wrap}.main-services-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.other-services-grid,.badges-grid{grid-template-columns:repeat(2,1fr)}.footer-container{grid-template-columns:1fr}}