body[data-mode=customer]{--navy:#252a30;--green:#641a34;--muted:#515356;--line:#d2d2d2;--bg:#f0f0f0;background:var(--bg);color:var(--navy)}body[data-mode=customer] .portal-header{background:#fff;border-bottom:3px solid #641a34;box-shadow:0 5px 20px #252a3009}body[data-mode=customer] .brand img{width:52px;height:52px;border-radius:14px}body[data-mode=customer] .brand{color:#252a30;font-size:19px}body[data-mode=customer] .portal-header nav a{background:#eaeaea;color:#641a34}body[data-mode=customer] .app-role{background:#252a30;color:#d9b3bf}body[data-mode=customer] .portal-shell{max-width:1200px;padding-top:38px}body[data-mode=customer] .portal-heading{padding-bottom:22px;border-bottom:1px solid #d8d5d6;margin-bottom:28px}body[data-mode=customer] .portal-heading h1{font-size:32px;color:#252a30}body[data-mode=customer] .portal-heading p{color:#515356;line-height:1.9}body[data-mode=customer] .eyebrow{color:#641a34;font-size:12px}.customer-auth-layout{display:grid;grid-template-columns:1fr 1fr;border-radius:24px;overflow:hidden;background:#fff;border:1px solid #d8d5d6;box-shadow:0 22px 60px #252a3010;max-width:1080px;margin:32px auto}.customer-welcome{padding:42px;background:linear-gradient(145deg,#641a34,#641a34);color:#fff}.customer-welcome>img{border-radius:50%;background:#fff;border:3px solid #fff;box-shadow:0 5px 20px #252a3030;margin-bottom:26px}.welcome-label{display:block;font-size:11px;color:#d9b3bf;font-weight:700;letter-spacing:.08em}.customer-welcome h2{font-size:31px;margin:13px 0;line-height:1.55;color:#fff}.customer-welcome>p{color:#e7e7e7;line-height:1.9;font-size:15px}.customer-welcome ol{list-style:none;padding:0;margin:28px 0}.customer-welcome li{display:flex;align-items:center;gap:15px;padding:16px 0;border-top:1px solid #ffffff26}.customer-welcome li>span{display:grid;place-items:center;flex:none;width:39px;height:39px;border-radius:12px;background:#ffffff14;color:#d9b3bf;font-weight:700;font-size:14px}.customer-welcome strong,.customer-welcome small{display:block}.customer-welcome strong{font-size:15px}.customer-welcome small{font-size:12px;color:#d4d4d4;margin-top:4px}.customer-welcome>a{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;color:#d9b3bf;font-size:13px;padding-top:12px}.customer-auth-layout .auth-panel{border:0;box-shadow:none;max-width:none;margin:0!important;padding:44px;border-radius:0!important;align-self:center}.customer-auth-layout .tabs{background:#eeeeee;border:1px solid #d2d2d2}.customer-auth-layout .tabs button{color:#515356}.customer-auth-layout .tabs button.active{background:#641a34;color:#fff;box-shadow:0 4px 10px #641a3425}.customer-auth-layout .auth-panel h2{font-size:25px;margin:18px 0 26px}.customer-auth-layout .auth-panel label{font-size:14px;margin-bottom:19px}.customer-auth-layout .auth-panel .muted{line-height:1.8}.customer-auth-layout .auth-panel .button.full{background:#641a34;box-shadow:0 5px 14px #641a3420}.customer-auth-layout .auth-panel .text-button{font-size:12px;line-height:1.7}body[data-mode=customer] input,body[data-mode=customer] select,body[data-mode=customer] textarea{background:#fff;border-color:#d8d5d6;border-radius:10px}body[data-mode=customer] input:focus,body[data-mode=customer] select:focus,body[data-mode=customer] textarea:focus{outline-color:#882345;border-color:#882345}body[data-mode=customer] .button{background:#252a30;border-radius:11px;min-height:47px}body[data-mode=customer] .button.green{background:#641a34}body[data-mode=customer] .button.light{background:#e8e8e8;color:#641a34;border:1px solid #d8d5d6}body[data-mode=customer] .button.danger{background:#fff0ef;color:#ac2f2f}body[data-mode=customer] .button:hover{filter:brightness(1.08)}body[data-mode=customer] button:focus-visible,body[data-mode=customer] a:focus-visible{outline-color:#a94466}body[data-mode=customer] .app-hero{background:linear-gradient(120deg,#252a30,#641a34);border-bottom:3px solid #d9b3bf;box-shadow:0 10px 24px #252a3015;padding:34px}body[data-mode=customer] .app-hero h2{font-size:29px}body[data-mode=customer] .app-hero p{color:#e4e4e4}body[data-mode=customer] .hero-action{background:#d9b3bf;color:#252a30;border-radius:10px}body[data-mode=customer] .web-navigation{background:#252a30;border-color:#882345;padding-top:24px}body[data-mode=customer] .web-navigation .nav-item{color:#e2e2e2;min-height:51px;font-size:14px}body[data-mode=customer] .web-navigation .nav-item.active{background:#641a34;color:#fff;box-shadow:inset -3px 0 #d9b3bf}body[data-mode=customer] .nav-item.active .app-icon{color:#d9b3bf}body[data-mode=customer] .dashboard-stats button,body[data-mode=customer] .stat{border-color:#d8d5d6;border-radius:15px!important;border-top:3px solid #641a34;box-shadow:0 5px 16px #252a3006}body[data-mode=customer] .dashboard-stats button:first-child,body[data-mode=customer] .stat:first-child{border-top-color:#a94466}body[data-mode=customer] .dashboard-stats button:last-child,body[data-mode=customer] .stat:last-child{border-top-color:#252a30}body[data-mode=customer] .stat span{font-size:12px;color:#515356}body[data-mode=customer] .stat-symbol{background:#fff0cc;color:#8a5c0a}body[data-mode=customer] .stat-symbol.green,body[data-mode=customer] .tile-icon.green{background:#d8f1e2;color:#006940}body[data-mode=customer] .stat-symbol.blue,body[data-mode=customer] .tile-icon.blue{background:#dfebf7;color:#143b66}body[data-mode=customer] .quick-actions>button{border-color:#d8d5d6;border-radius:16px;box-shadow:0 4px 15px #252a3005}body[data-mode=customer] .recent-order,body[data-mode=customer] .order-card{border-color:#d8d5d6;border-radius:14px!important;box-shadow:0 4px 16px #252a3006}body[data-mode=customer] .order-card.selected{border:2px solid #641a34;background:#f5f5f5;box-shadow:0 6px 18px #641a3412}body[data-mode=customer] .panel{border-color:#d8d5d6;border-radius:16px!important}body[data-mode=customer] #detail.panel{border-top:4px solid #641a34}body[data-mode=customer] .badge{background:#ececec;color:#882345;border:1px solid #d9d9d9;font-weight:700}body[data-mode=customer] .badge.paid,body[data-mode=customer] .badge.complete{background:#d7f1e1;color:#075d35;border-color:#9ed0b1}body[data-mode=customer] .badge.need_documents,body[data-mode=customer] .badge.pending{background:#fff0ca;color:#805608;border-color:#e6c36a}body[data-mode=customer] .badge.cancelled,body[data-mode=customer] .badge.failed{background:#ffe2df;color:#9d2929;border-color:#e8aaa6}body[data-mode=customer] .file{border-color:#d8d5d6;background:#fcfcfc}body[data-mode=customer] .upload,body[data-mode=customer] .required-documents{background:#f0f0f0;border-color:#d8d5d6}body[data-mode=customer] .service-tile{border-color:#d8d5d6;border-top:3px solid #641a34;border-radius:16px}body[data-mode=customer] .service-tile strong{font-size:14px}body[data-mode=customer] .service-tile:hover{background:#f3f3f3;border-color:#641a34}body[data-mode=customer] .custom-service{background:#eaeaea;border-color:#641a34}body[data-mode=customer] .profile-card{background:linear-gradient(130deg,#252a30,#641a34);color:#fff}body[data-mode=customer] .profile-card h2{color:#fff}body[data-mode=customer] .profile-card p{color:#e1e1e1}body[data-mode=customer] .profile-avatar{background:#d9b3bf;color:#252a30}body[data-mode=customer] .profile-info,body[data-mode=customer] .settings-list{border-color:#d8d5d6}body[data-mode=customer] .empty,body[data-mode=customer] .app-empty{border:1px dashed #d8d5d6;background:#f8f8f8;padding:42px 25px}body[data-mode=customer] dialog{border-top:5px solid #641a34;background:#fff;box-shadow:0 25px 90px #252a3040}body[data-mode=customer] dialog::backdrop{background:#252a30bd}body[data-mode=customer] footer{color:#515356}body[data-mode=customer] footer a{font-weight:700;color:#641a34}body[data-mode=customer] .bottom-nav{border-color:#d8d5d6}body[data-mode=customer] .bottom-nav .nav-item.active{background:#641a34;color:#fff}
@media(min-width:801px){body[data-mode=customer].web-layout.app-signed-in .portal-shell{padding-top:35px;padding-inline:38px}body[data-mode=customer] .web-navigation{width:220px}body[data-mode=customer] .workspace{gap:24px}body[data-mode=customer] .toolbar{padding:16px;border:1px solid #d8d5d6;background:#fff;border-radius:14px}}
@media(max-width:800px){body[data-mode=customer] .portal-header{padding:12px 15px}body[data-mode=customer] .brand{font-size:15px}body[data-mode=customer] .brand img{width:43px;height:43px}body[data-mode=customer] .app-role{display:none}body[data-mode=customer] .portal-shell{padding:25px 16px 35px}body[data-mode=customer] .portal-heading h1{font-size:26px}body[data-mode=customer] .portal-heading p{font-size:13px}.customer-auth-layout{grid-template-columns:1fr;margin:20px auto;border-radius:19px}.customer-welcome{padding:25px 23px}.customer-welcome>img{width:65px;height:65px;margin-bottom:15px;float:inline-end;margin-inline-start:12px}.customer-welcome h2{font-size:25px}.customer-welcome>p{font-size:13px;margin-bottom:0}.customer-welcome ol{display:none}.customer-welcome>a{margin-top:12px;font-size:12px}.customer-auth-layout .auth-panel{padding:26px 23px}.customer-auth-layout .auth-panel h2{font-size:22px}.customer-auth-layout .auth-panel .tabs button{font-size:12px}body[data-mode=customer] .app-hero{padding:25px 22px}body[data-mode=customer] .app-hero h2{font-size:25px}body[data-mode=customer] .web-navigation{padding:7px 10px}body[data-mode=customer] .web-navigation .nav-item{font-size:11px;min-height:43px;border-radius:8px}body[data-mode=customer] .web-navigation .nav-item.active{box-shadow:inset 0 -3px #d9b3bf}body[data-mode=customer] .dashboard-stats button{padding:16px 12px}body[data-mode=customer] .service-tile strong{font-size:12px}}

body[data-mode=customer]{--navy:#252a30;--green:#882345;--muted:#6c6f70;--line:#e1dde0;--bg:#f6f6f6}body[data-mode=customer] .portal-header{background:#fff;color:#252a30;border-bottom-color:#882345}body[data-mode=customer] .brand,body[data-mode=customer] .brand small{color:#252a30}body[data-mode=customer] .portal-header nav a{background:#f7eff2;color:#882345;border-color:#e1dde0}body[data-mode=customer] .app-role{background:#882345;color:#fff}body[data-mode=customer] .web-navigation{background:#fff;border-color:#e1dde0}body[data-mode=customer] .web-navigation .nav-item{color:#6c6f70}body[data-mode=customer] .web-navigation .nav-item.active{background:#882345;color:#fff}body[data-mode=customer] .nav-item.active .app-icon{color:#fff}body[data-mode=customer] .button,body[data-mode=customer] .button.green{background:#882345;color:#fff}body[data-mode=customer] .button.light{background:#f7eff2;color:#882345}body[data-mode=customer] .button.danger{background:#fff0ef;color:#ad3030}body[data-mode=customer] .app-hero,body[data-mode=customer] .profile-card{background:#882345}body[data-mode=customer] .hero-action{background:#fff;color:#882345}
.customer-welcome{background:#882345}.customer-welcome .welcome-label,.customer-welcome li>span,.customer-welcome>a{color:#fff}.customer-welcome>p,.customer-welcome small{color:#f4e8ec}.customer-auth-layout .tabs button.active,.customer-auth-layout .auth-panel .button.full{background:#882345;color:#fff}

body[data-mode=customer] .brand img{width:260px;height:auto;border-radius:0;border:0;object-fit:contain}@media(max-width:800px){body[data-mode=customer] .brand img{width:185px;height:auto}}
.customer-welcome>img{width:300px;height:auto;border-radius:8px;object-fit:contain;float:none;max-width:100%;padding:7px;background:#fff}@media(max-width:800px){.customer-welcome>img{width:230px;height:auto;float:none;margin-inline-start:0}}
.customer-welcome>img{width:120px;height:120px;border-radius:50%;padding:0;object-fit:contain}@media(max-width:800px){.customer-welcome>img{width:95px;height:95px}}
