/* IRAQ iCLOUD | Customer Area V4 | Blue + White UI
   Shared styles for dashboard, my-orders, wallet and profile pages.
*/
:root{--blue:#1462e7;--blue-dark:#124fca;--navy:#152440;--ink:#263857;--muted:#8592a7;--bg:#f5f8fc;--line:#e7edf6;--white:#fff;--shadow:0 8px 28px rgba(34,77,142,.045)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:'Cairo',Tahoma,Arial,sans-serif;font-size:13px;line-height:1.7}a{text-decoration:none;color:var(--blue)}button,input,textarea,select{font:inherit}button{cursor:pointer}svg{flex:none;vertical-align:middle}h1,h2,h3,p{margin-top:0}h2{line-height:1.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #83b5ff;outline-offset:3px}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.client-shell{display:flex;min-height:100vh;align-items:stretch}.sidebar{position:sticky;top:0;flex:0 0 260px;width:260px;height:100vh;overflow-y:auto;display:flex;flex-direction:column;padding:27px 16px 18px;background:#fff;border-left:1px solid var(--line);z-index:50}.sidebar-brand{display:flex;align-items:center;justify-content:space-between;padding:0 11px}.logo{display:flex;align-items:center;gap:10px;white-space:nowrap;color:var(--navy)}.logo-symbol{height:40px;width:42px;display:grid;place-items:center;border-radius:12px;background:linear-gradient(145deg,#2c8bff,#0857da);font:800 italic 28px Arial,sans-serif;color:white;box-shadow:0 6px 15px rgba(17,100,230,.18)}.logo-word{font:800 19px Arial,sans-serif;letter-spacing:-.3px}.logo-word b{color:var(--blue)}.logo-word small{display:block;margin-top:5px;font:700 9px Arial,sans-serif;letter-spacing:2.2px;color:#9daac0}.sidebar-caption{font-size:11px;color:#a6b0c1;padding:32px 16px 13px;font-weight:800;letter-spacing:.1px}.side-nav{display:grid;gap:5px}.side-nav a{display:flex;align-items:center;gap:13px;color:#667994;padding:11px 13px;min-height:45px;border-radius:10px;font-weight:700;position:relative;transition:background .16s,color .16s}.side-nav a:hover{background:#f3f7ff;color:#2364ce}.side-nav a.active{background:#eaf2ff;color:#175fd9}.side-nav a .nav-icon{display:inline-grid;place-items:center;color:#98a7bd;width:23px}.side-nav a.active .nav-icon,.side-nav a:hover .nav-icon{color:#1868e9}.nav-active-mark{height:21px;width:3px;background:var(--blue);border-radius:5px;position:absolute;right:0}.sidebar-bottom{margin-top:auto;padding-top:32px}.sidebar-help{padding:15px 15px 13px;background:linear-gradient(160deg,#eff6ff,#f8fbff);border:1px solid #e7f0ff;border-radius:13px;display:grid;gap:3px}.sidebar-help-icon{color:var(--blue);margin-bottom:4px}.sidebar-help strong{color:#23466e;font-size:12px}.sidebar-help small{color:#7a8da6;font-size:10px;line-height:1.8}.sidebar-help a{display:flex;align-items:center;gap:5px;font-weight:800;margin-top:8px;font-size:11px}.logout-link{display:flex;align-items:center;gap:12px;color:#e15f61;padding:19px 12px 1px;font-weight:700}.client-content{flex:1;min-width:0;display:flex;flex-direction:column}.client-top{background:#fff;border-bottom:1px solid var(--line);padding:21px clamp(22px,3vw,48px);display:flex;justify-content:space-between;gap:20px;align-items:center}.breadcrumbs{display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:#a1adbe;font-size:10px;margin-bottom:5px}.breadcrumbs a{color:#8494aa}.breadcrumbs strong{color:#4a6484}.client-top h1{font-size:19px;margin:0;font-weight:800;color:#253c5b}.top-tools{display:flex;align-items:center;gap:18px}.top-new-order{display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid #dde8f8;border-radius:9px;padding:9px 13px;font-weight:800;font-size:11px;white-space:nowrap}.top-new-order:hover{background:#eff6ff}.top-user{display:flex;gap:10px;align-items:center;color:var(--navy);border-right:1px solid #e5edf7;padding-right:18px}.avatar{height:39px;width:39px;display:grid;place-items:center;border-radius:13px;color:#195fe0;font-size:19px;font-weight:800;background:#e9f2ff}.top-user-info{display:grid;max-width:165px}.top-user-info strong,.top-user-info small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-user-info strong{font-size:11px}.top-user-info small{font-size:10px;color:var(--muted)}.mobile-menu,.side-close,.nav-backdrop{display:none}.icon-button{border:0;background:none;padding:8px;color:#355678;border-radius:8px}.icon-button:hover{background:#f2f7ff}.client-main{padding:30px clamp(22px,3vw,48px) 44px;width:100%;max-width:1600px;margin:auto;flex:1}.client-footer{border-top:1px solid var(--line);color:#98a5b8;font-size:11px;padding:18px clamp(22px,3vw,48px);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.client-footer a{font-weight:700}
/* welcome */
.dashboard-hero{position:relative;overflow:hidden;background:linear-gradient(110deg,#0757dc,#1686f7);border-radius:18px;min-height:235px;display:flex;align-items:center;justify-content:space-between;padding:35px 42px;color:white;box-shadow:0 13px 30px rgba(12,103,216,.14)}.dashboard-hero:after{content:"";position:absolute;left:-60px;top:-100px;width:370px;height:370px;border:1px solid rgba(255,255,255,.13);border-radius:50%;pointer-events:none}.hero-copy{position:relative;z-index:2;max-width:530px}.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.16);padding:5px 12px;border-radius:50px;font-size:10px;font-weight:700}.dashboard-hero h2{font-size:28px;line-height:1.5;margin:10px 0 6px;font-weight:800;color:white}.wave{color:#b4e4ff}.dashboard-hero p{color:#dcf0ff;max-width:470px;font-size:12px;line-height:2;margin-bottom:17px}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.button,.btn,button:not(.icon-button):not(.nav-backdrop){border:0;border-radius:9px;padding:10px 16px;font-size:12px;font-weight:800;display:inline-flex;align-items:center;gap:7px;justify-content:center;transition:transform .18s,background .18s}.button:hover,.btn:hover{transform:translateY(-1px)}.button-white{background:white;color:#155ed8}.button-outline-white{background:transparent;border:1px solid rgba(255,255,255,.47);color:white}.button-outline-white:hover{background:rgba(255,255,255,.1)}.button-primary,.btn{background:var(--blue);color:#fff}.button-primary:hover,.btn:hover{background:var(--blue-dark);color:#fff}.hero-visual{position:absolute;left:70px;top:0;height:100%;width:275px;display:grid;place-items:center;color:#e8f9ff}.hero-orbit{position:absolute;border:1px solid rgba(255,255,255,.2);border-radius:50%}.hero-orbit.outer{width:236px;height:236px}.hero-orbit.inner{width:176px;height:176px;background:rgba(255,255,255,.035)}.hero-big-icon{position:relative;width:122px;height:122px;background:linear-gradient(150deg,rgba(255,255,255,.23),rgba(255,255,255,.07));display:grid;place-items:center;border:1px solid rgba(255,255,255,.3);border-radius:29px;transform:rotate(-8deg);box-shadow:0 12px 30px rgba(0,26,90,.15)}.hero-big-icon svg{width:76px;height:76px;transform:rotate(8deg)}.hero-dot{position:absolute;width:15px;height:15px;background:#99dafa;border-radius:50%;box-shadow:0 0 0 8px rgba(255,255,255,.10)}.dot-one{left:38px;top:48px}.dot-two{right:23px;bottom:31px;width:9px;height:9px;background:#fff}
/* generic panels and section headings */
.dashboard-section{margin-top:28px}.section-title-row,.section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.section-eyebrow{display:block;color:#91a2b9;font-size:10px;font-weight:700;margin-bottom:2px}.section-title-row h2,.section-head h2{font-size:17px;margin:0;color:#20395d;font-weight:800}.section-meta{font-size:10px;color:#9ba9bc}.dashboard-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.metric,.panel{border:1px solid #e7edf5;background:#fff;border-radius:13px;box-shadow:var(--shadow)}.metric{padding:20px 22px 18px;min-width:0}.metric-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;color:#788ba6;font-size:11px;font-weight:700}.metric-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:11px}.icon-wallet{background:#eaf3ff;color:#1f70e9}.icon-orders{background:#eeecff;color:#795be9}.icon-pending{background:#fff3e4;color:#eb9639}.icon-completed{background:#e9f8f2;color:#14ae79}.metric-amount{color:#1c3457;font-weight:800;font-size:29px;line-height:1.3;margin:13px 0 8px}.money-amount{text-align:right;direction:ltr;unicode-bidi:isolate}.metric-amount small{font-size:12px;color:#9babbf;font-weight:600}.metric-sub,.metric-link{color:#9babc0;font-size:10px}.metric-link{display:inline-flex;gap:2px;align-items:center;color:#2469dc;font-weight:700}
/* dashboard content */
.dashboard-columns{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:18px;margin-top:22px;align-items:start}.panel{padding:23px}.orders-panel{min-height:360px}.text-link{display:inline-flex;align-items:center;gap:4px;font-weight:800;font-size:11px;white-space:nowrap}.table-wrap{overflow-x:auto;width:100%}.order-table,table{border-collapse:collapse;width:100%}.order-table{min-width:570px}.order-table thead{background:#f8faff}.order-table th,.order-table td{text-align:right;padding:14px 12px;border-bottom:1px solid #edf1f6;font-size:11px}.order-table th{color:#92a1b5;font-weight:700;white-space:nowrap}.order-table tr:last-child td{border-bottom:0}.order-table td{color:#536680}.order-number{color:#1b6eea;font-weight:800;white-space:nowrap}.service-title{font-weight:700;color:#304667!important;max-width:185px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.price-cell{white-space:nowrap;font-weight:800;color:#304763!important}.date-cell{white-space:nowrap;color:#96a4b8!important}.detail-link{height:25px;width:25px;display:grid;place-items:center;border-radius:8px;background:#eff5ff}.detail-link:hover{background:#dbeaff}.status{display:inline-flex;align-items:center;gap:5px;border-radius:100px;padding:4px 10px;font-size:10px;font-weight:800;white-space:nowrap;background:#eff3f8;color:#7183a0}.status:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor}.status-completed{background:#e6f8ee;color:#16a36a}.status-processing{background:#e9f2ff;color:#236deb}.status-pending,.status-open{background:#fff3df;color:#c38320}.status-rejected,.status-cancelled{background:#fff0ef;color:#db6264}.status-closed{background:#edf1f6;color:#7a8ba2}.dashboard-aside{display:grid;gap:18px}.progress-panel .section-head{margin-bottom:20px}.panel-icon{background:#f1f6ff;color:#4385ed;border-radius:10px;height:34px;width:34px;display:grid;place-items:center}.progress-content{display:flex;justify-content:space-between;align-items:center;gap:17px}.donut{flex:none;height:134px;width:134px;border-radius:50%;background:conic-gradient(#1a71e8 calc(var(--percent)*1%),#eaf1fb 0);display:grid;place-items:center;position:relative}.donut:before{content:"";position:absolute;inset:13px;border-radius:50%;background:white}.donut>div{position:relative;display:grid;text-align:center;line-height:1.3;gap:2px}.donut strong{font:800 27px Arial,sans-serif;color:#243a5a}.donut small{font-size:10px;color:#9babbe}.progress-legend{display:grid;gap:12px;flex:1}.progress-legend>div{display:flex;align-items:center;gap:8px;color:#71829e;font-size:10px;white-space:nowrap}.progress-legend strong{margin-right:auto;color:#294365;font-size:12px}.legend-dot{width:8px;height:8px;border-radius:50%}.legend-dot.completed{background:#1a71e8}.legend-dot.processing{background:#61b5fa}.legend-dot.pending{background:#f1b85f}.progress-note{border-top:1px solid #edf1f8;margin:17px 0 0;padding-top:12px;font-size:10px;color:#9ba9bc;line-height:1.8}.support-panel{position:relative;display:grid;grid-template-columns:42px 1fr;column-gap:12px;align-items:start}.support-panel .section-eyebrow{margin-bottom:0}.support-panel h2{margin:0 0 5px;font-size:16px;color:#243c5c}.support-panel p{color:#8293a9;font-size:11px;margin:0}.support-panel p strong{color:#1e67dd}.support-icon{height:40px;width:40px;background:#ecf4ff;color:#246ee1;border-radius:11px;display:grid;place-items:center}.support-link{grid-column:2;display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;margin-top:12px}.empty-state{padding:43px 18px;text-align:center;display:flex;flex-direction:column;align-items:center}.empty-icon{height:58px;width:58px;background:#eef5ff;color:#4485ef;border-radius:18px;display:grid;place-items:center;margin-bottom:15px}.empty-state strong{color:#253d5a;font-size:15px}.empty-state p{font-size:11px;color:#97a7ba;max-width:320px;margin:5px 0 15px}.quick-section{margin-top:26px}.quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.quick-card{min-width:0;background:white;border:1px solid var(--line);border-radius:13px;padding:17px 14px;display:flex;align-items:center;gap:10px;color:#60738d;box-shadow:var(--shadow);transition:transform .17s,border-color .17s}.quick-card:hover{transform:translateY(-2px);border-color:#c3d9fa}.quick-card>span:nth-child(2){display:grid;min-width:0;flex:1}.quick-card strong{color:#2d4361;font-size:11px}.quick-card small{color:#96a6bc;font-size:10px;white-space:normal}.quick-card>svg{color:#9ab0cd}.quick-icon{height:40px;width:40px;display:grid;place-items:center;border-radius:10px}.quick-icon.blue{color:#2276ee;background:#e9f2ff}.quick-icon.purple{color:#8664e1;background:#f2edff}.quick-icon.green{color:#15a47b;background:#e7f9f2}.quick-icon.orange{color:#de8c30;background:#fff2e5}
/* Old client pages: preserve behavior, improve visual identity */
.welcome{background:linear-gradient(120deg,#0b62e4,#278dff);color:white;border-radius:16px;padding:27px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}.welcome h2{color:#fff;margin:0 0 7px}.welcome p{color:#e6f2ff;margin:0}.welcome .btn.secondary{color:var(--blue);background:#fff}.welcome .btn{background:#fff;color:#1462e7}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:20px 0}.cards .metric small{display:block;color:#8ea0b8}.cards .metric strong{display:block;font-size:25px;margin:8px 0}.cards .metric .hint{font-size:11px;color:#8b9db5}.two-col{display:grid;grid-template-columns:1.6fr 1fr;gap:17px;margin:20px 0}.panel h2{font-size:17px;margin:0 0 17px;color:#20395d}.section-head h2{margin:0}.quick-links{display:grid;gap:12px}.quick-links a{background:#f4f8ff;border:1px solid #e4effe;border-radius:10px;padding:12px 15px}.empty{padding:30px;text-align:center;color:#8295ae}.alert{padding:12px 15px;margin:0 0 18px;background:#ffeff0;color:#be4851;border-radius:10px}.alert.success{background:#e8f9f1;color:#13805a}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}.form-group{margin-bottom:15px}label{display:block;color:#5f738d;font-weight:700;margin:0 0 8px;font-size:12px}input,textarea,select{width:100%;padding:11px 13px;background:white;border:1px solid #dbe5f2;border-radius:9px;color:#2f425e;outline:none}textarea{min-height:120px;resize:vertical}input:focus,textarea:focus,select:focus{border-color:#67a5fb;box-shadow:0 0 0 3px #e3f0ff}.muted,.count{color:#8b9bb1}.transactions-credit{color:#10a575}.transactions-debit{color:#e06b70}.detail{white-space:pre-wrap;overflow-wrap:anywhere}.table-wrap>table:not(.order-table){min-width:570px}.table-wrap>table:not(.order-table) th,.table-wrap>table:not(.order-table) td{padding:12px;border-bottom:1px solid #edf1f7;text-align:right;font-size:12px}.table-wrap>table:not(.order-table) th{color:#8498b3;background:#f7faff}
@media(max-width:1290px){.dashboard-columns{grid-template-columns:1fr}.dashboard-aside{grid-template-columns:1fr 1fr}.progress-panel,.support-panel{height:100%}.quick-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-visual{left:10px}.hero-copy{max-width:520px}.dashboard-metrics{gap:11px}.metric{padding:17px}}
@media(max-width:1080px){.sidebar{flex-basis:225px;width:225px}.sidebar-brand{padding:0 4px}.logo-word{font-size:16px}.logo-symbol{width:35px;height:35px}.client-main{padding:25px}.client-top{padding:17px 25px}.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-visual{opacity:.45}.hero-copy{max-width:550px}}
@media(max-width:790px){.client-shell{display:block}.sidebar{position:fixed;right:0;top:0;bottom:0;transform:translateX(110%);transition:transform .25s ease;max-width:300px;width:min(300px,86vw);height:100vh;box-shadow:-12px 0 35px rgba(21,51,92,.17)}body.menu-open .sidebar{transform:translateX(0)}body.menu-open{overflow:hidden}.nav-backdrop{display:block;position:fixed;inset:0;background:rgba(11,31,59,.54);border:0;opacity:0;visibility:hidden;z-index:49;transition:opacity .23s,visibility .23s;width:100%;padding:0}body.menu-open .nav-backdrop{opacity:1;visibility:visible}.mobile-menu,.side-close{display:inline-flex;align-items:center;justify-content:center}.side-close{padding:5px}.client-top{gap:12px}.client-top h1{font-size:17px}.breadcrumbs{font-size:9px}.top-new-order{padding:8px 9px}.client-main{padding:21px 17px 30px}.client-footer{padding:18px}.dashboard-hero{padding:30px 25px;min-height:220px}.dashboard-hero h2{font-size:24px}.hero-visual{left:-40px;opacity:.18}.dashboard-aside{grid-template-columns:1fr 1fr}.progress-content{justify-content:flex-start}.top-user-info{display:none}.top-user{padding-right:12px}.two-col{grid-template-columns:1fr}.cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:580px){.client-top{padding:12px 16px}.breadcrumbs{gap:6px}.top-tools{gap:7px}.top-new-order{font-size:0;padding:9px}.top-new-order svg{height:18px;width:18px}.top-user{border:0;padding:0}.avatar{width:35px;height:35px}.dashboard-hero{padding:23px 20px;min-height:210px;border-radius:13px}.dashboard-hero h2{font-size:21px}.dashboard-hero p{font-size:11px}.hero-actions{gap:7px}.hero-actions .button{font-size:10px;padding:9px 11px}.section-title-row h2,.section-head h2{font-size:15px}.section-meta{display:none}.dashboard-metrics{gap:9px}.metric{padding:13px}.metric-icon{height:35px;width:35px}.metric-amount{font-size:24px}.metric-heading{font-size:10px}.dashboard-columns{margin-top:15px}.dashboard-aside{grid-template-columns:1fr}.progress-content{justify-content:space-around}.panel{padding:17px}.quick-actions{grid-template-columns:1fr 1fr;gap:9px}.quick-card{padding:12px 10px}.quick-card>svg{display:none}.quick-card strong{font-size:10px}.quick-card small{font-size:9px}.quick-icon{width:34px;height:34px}.quick-icon svg{width:19px;height:19px}.client-footer{justify-content:center;text-align:center}.form-grid{grid-template-columns:1fr}}
@media(max-width:380px){.dashboard-metrics{grid-template-columns:1fr 1fr}.metric-heading{flex-wrap:wrap}.quick-actions{grid-template-columns:1fr}.dashboard-hero h2{font-size:19px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}