:root{--primary:#075a9f;--primary-dark:#06365f;--secondary:#13aeea;--accent:#39dfc2;--bg:#f3f9fd;--surface:#fff;--text:#122033;--muted:#5e6b7a;--border:#dde6f0;--warning:#f4c95d;--danger:#e66a6a;--success:#33b27b;--shadow:0 24px 60px #075a9f29;--soft-shadow:0 12px 30px #12203314;--card-radius:22px}*{box-sizing:border-box}body{background:radial-gradient(circle at 12% 0%, #39dfc233, transparent 28%), radial-gradient(circle at 90% 5%, #13aeea29, transparent 26%), linear-gradient(180deg, #eefaff 0%, var(--bg) 310px);min-width:320px;color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Arial,sans-serif}button,input,select,textarea{font:inherit}button,.actions a{background:linear-gradient(135deg, var(--primary), var(--secondary));color:#fff;cursor:pointer;border:0;border-radius:14px;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:10px 15px;font-weight:800;text-decoration:none;transition:transform .18s,box-shadow .18s,border-color .18s,background .18s,opacity .18s;display:inline-flex;box-shadow:0 13px 24px #075a9f33}button:hover,.actions a:hover{transform:translateY(-1px);box-shadow:0 14px 24px #0f4c8133}button.secondary,.actions a.secondary,button.ghost{color:var(--primary);box-shadow:none;background:#eef7fc;border:1px solid #cde4f3}button.ghost{background:#fff}.glass-button{color:#fff;box-shadow:none;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffff29;border:1px solid #ffffff52}button.danger{color:#a83232;box-shadow:none;background:#fff0f0;border:1px solid #ffd1d1}.actions a.success-button{background:linear-gradient(135deg, var(--success), var(--accent))}button:disabled{opacity:.62;cursor:not-allowed;transform:none}input,select,textarea{border:1px solid var(--border);width:100%;color:var(--text);background:#fbfdff;border-radius:12px;outline:none;margin-top:7px;padding:12px 13px;transition:border-color .16s,box-shadow .16s,background .16s}input:focus,select:focus,textarea:focus{border-color:var(--secondary);background:#fff;box-shadow:0 0 0 4px #1ba6e224}textarea{resize:vertical;min-height:94px}label{color:var(--text);gap:4px;font-size:13px;font-weight:800;display:grid}h1,h2,h3,p{overflow-wrap:anywhere}h1,h2,h3{color:var(--text);line-height:1.12}h1{letter-spacing:0}h2{font-size:clamp(22px,2.4vw,34px)}h3{font-size:20px}p{color:var(--muted)}.app-shell{width:min(1240px,100%);margin:0 auto;padding:22px 28px 42px;position:relative}.topbar{z-index:10;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#f3f9fddb;border:1px solid #dde6f0b8;border-radius:0 0 24px 24px;justify-content:space-between;align-items:center;gap:18px;margin:0 -10px 24px;padding:14px 12px;display:flex;position:sticky;top:0;box-shadow:0 12px 36px #071f3614}.topbar h1,.login-card h2,.page-hero h2{margin:0}.brand-block{align-items:center;gap:13px;min-width:0;display:flex}.brand-mark{color:#fff;background:linear-gradient(135deg, #ffffff42, transparent 42%), linear-gradient(135deg, var(--primary), var(--secondary) 62%, var(--accent));border-radius:16px;flex:none;place-items:center;width:46px;height:46px;font-size:22px;font-weight:900;display:grid;box-shadow:0 14px 28px #0f4c813d}.brand-mark span{background:#ffffff38;border-radius:999px;place-items:center;width:27px;height:27px;display:grid}.user-box{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:10px;display:flex}.user-meta{justify-items:end;gap:4px;display:grid}.user-name{color:var(--text);font-weight:800}.role-pill{min-height:32px;color:var(--primary);background:#1ba6e21f;border:1px solid #1ba6e238;border-radius:999px;align-items:center;padding:7px 11px;font-size:12px;font-weight:900;display:inline-flex}.logout-button{min-height:38px;padding-inline:13px}.shell-ribbon{background:linear-gradient(90deg,#075a9f14,#39dfc21f,#fff0);border-radius:30px;height:76px;margin:-18px -18px -50px}.card{border:1px solid var(--border);border-radius:var(--card-radius);box-shadow:var(--soft-shadow);background:#fffffff2;padding:20px}.card,.package-card,.media-card,.customer-booking-card,.calendar-booking-card,.employee-task-card{transition:transform .18s,box-shadow .18s,border-color .18s}.card:hover,.package-card:hover,.media-card:hover,.customer-booking-card:hover,.calendar-booking-card:hover,.employee-task-card:hover{box-shadow:var(--shadow);transform:translateY(-2px)}.stack{gap:18px;display:grid}.grid{grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:16px;display:grid}.cards{margin-bottom:20px}.stat-card{background:linear-gradient(#fffffff5,#f5fcfff5),#fff;border-color:#13aeea2e;min-height:128px;position:relative;overflow:hidden}.stat-card:after{content:"";background:#47d7ac2e;border-radius:999px;width:96px;height:96px;position:absolute;bottom:-32px;right:-30px}.stat-card h2{color:var(--primary-dark);margin:0;font-size:34px}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 8px;font-size:11px;font-weight:900}.page-hero{background:linear-gradient(135deg, #06365ff2, #075a9fd6 48%, #13aeeabd), var(--primary);min-height:260px;box-shadow:var(--shadow);border-radius:30px;justify-content:space-between;align-items:center;gap:18px;margin-bottom:20px;padding:clamp(22px,4vw,38px);display:flex;position:relative;overflow:hidden}.page-hero:after{content:"";border:28px solid #ffffff29;border-radius:999px;width:210px;height:210px;position:absolute;inset:auto -54px -78px auto}.page-hero h2,.page-hero p,.page-hero .eyebrow{color:#fff;position:relative}.page-hero p{color:#ffffffdb;max-width:620px;margin:10px 0 0}.page-hero h2{max-width:760px;font-size:clamp(34px,5vw,58px)}.hero-metric{color:#fff;background:#ffffff29;border:1px solid #ffffff3d;border-radius:18px;min-width:150px;padding:16px;position:relative}.hero-metric span{color:#ffffffc7;text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;font-size:12px;font-weight:900;display:block}.hero-metric strong{font-size:34px}.hero-actions{margin-top:24px;position:relative}.login-hero,.admin-hero,.employee-hero,.customer-hero{background-position:50%;background-size:cover}.login-hero{background-image:linear-gradient(135deg,#06365feb,#075a9fc7 52%,#39dfc2ad),url(/hero-carwash.png)}.admin-hero{background-image:linear-gradient(135deg,#06365ff0,#075a9fc7 52%,#39dfc2a3),url(/dashboard-banner.png)}.employee-hero{background-image:linear-gradient(135deg,#06365ff0,#13aeeab8),url(/employee-banner.png)}.customer-hero{background-image:linear-gradient(135deg,#06365feb,#075a9fb3,#39dfc28f),url(/customer-banner.png)}.login-page{grid-template-columns:minmax(280px,1.05fr) minmax(320px,460px);align-items:stretch;gap:32px;min-height:100vh;padding:34px;display:grid}.login-hero{min-height:calc(100vh - 68px);box-shadow:var(--shadow);border-radius:34px;flex-direction:column;justify-content:center;padding:clamp(28px,6vw,72px);display:flex;position:relative;overflow:hidden}.login-hero:after{content:"";border:34px solid #ffffff24;border-radius:999px;width:320px;height:320px;position:absolute;bottom:-96px;right:-72px}.login-hero>*{z-index:1;position:relative}.login-hero h1{color:#fff;margin:14px 0 12px;font-size:clamp(36px,6vw,68px)}.login-hero p,.login-hero .eyebrow{color:#ffffffdb;max-width:620px}.login-mark{background:#ffffff2e;border:1px solid #ffffff52;width:58px;height:58px}.login-proof-grid{flex-wrap:wrap;gap:10px;margin-top:26px;display:flex}.login-proof-grid span{color:#fff;background:#ffffff26;border:1px solid #fff3;border-radius:999px;padding:10px 12px;font-size:13px;font-weight:800}.login-card{width:100%;box-shadow:var(--shadow);border-radius:28px;align-self:center;gap:16px;padding:28px;display:grid}.demo-box{flex-wrap:wrap;gap:8px;padding-top:4px;display:flex}.trust-strip{flex-wrap:wrap;gap:10px;margin-top:28px;display:flex}.trust-strip span{color:#fff;background:#ffffff26;border:1px solid #ffffff38;border-radius:999px;padding:10px 13px;font-size:12px;font-weight:900}.business-strip{box-shadow:var(--soft-shadow);background:#fff;border:1px solid #13aeea29;border-radius:20px;margin:-4px 0 22px;padding:12px}.business-strip span{color:var(--primary-dark);background:#eefaff;border-color:#ccecf8}.error,.success,.alert{border-radius:14px;margin:0;padding:12px 14px;font-weight:800}.error{color:#a83232;background:#fff0f0;border:1px solid #ffd1d1}.success{color:#116b4d;background:#eaf9f2;border:1px solid #bdebd6}.tabs{z-index:1;border:1px solid var(--border);background:#ffffffb8;border-radius:18px;flex-wrap:wrap;gap:8px;margin-bottom:20px;padding:8px;display:flex;position:relative}.tabs button{color:var(--primary);box-shadow:none;background:0 0;border:1px solid #0000}.tabs button.active{color:var(--primary-dark);background:#fff;border-color:#cde4f3;box-shadow:0 8px 16px #0f4c811a}.tabs button:hover{transform:translateY(-1px)}.employee-filters,.filters-row{background:#ffffffdb}.employee-filters{grid-template-columns:1fr minmax(180px,240px) minmax(220px,280px);align-items:end;gap:16px;margin-bottom:18px;display:grid}.filter-buttons{flex-wrap:wrap;gap:8px;display:flex}.filter-buttons button.active{background:var(--primary);color:#fff}.filters-row{border:1px solid var(--border);border-radius:16px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));align-items:end;gap:12px;margin-bottom:14px;padding:12px;display:grid}.request-controls{gap:8px;min-width:180px;display:grid}.section-head{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.section-head h2,.card h2{margin-top:0}.section-title{margin:28px 0 14px}.section-title h2{margin:0}.package-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:22px;display:grid}.package-card{background-color:#0000;background-image:linear-gradient(#ffffffeb,#f0fbfff0),url(/wash-package.png);background-position:50%;background-repeat:repeat,repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;border-color:#13aeea2e;align-content:space-between;gap:16px;min-height:245px;display:grid;position:relative;overflow:hidden}.package-card:after{content:"";background:#39dfc229;border-radius:999px;width:130px;height:130px;position:absolute;top:-45px;right:-45px}.package-card>*{z-index:1;position:relative}.package-card h3{color:var(--primary-dark);margin:0 0 10px}.package-card strong{color:var(--primary);font-size:26px}.package-card ul{color:var(--text);gap:8px;margin:0;padding-left:18px;font-weight:700;display:grid}.package-card.selected{border-color:var(--accent);box-shadow:0 0 0 4px #39dfc22e, var(--soft-shadow)}.package-card-1{background-image:linear-gradient(#ffffffed,#f0fbfff2),url(/customer-banner.png)}.package-card-2{background-image:linear-gradient(#ffffffeb,#f0fbfff0),url(/wash-package.png)}.package-card-3{background-image:linear-gradient(#ffffffe6,#eefafff0),url(/support-detail.png)}.package-card-4{background-image:linear-gradient(#ffffffe8,#effdfaf2),url(/dashboard-banner.png)}.ops-grid{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-bottom:20px;display:grid}.media-card{background-color:#0000;background-image:linear-gradient(#fffffff0,#f4fcfff0),url(/dashboard-banner.png);background-position:50%;background-repeat:repeat,repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;min-height:210px;position:relative;overflow:hidden}.media-card h2{margin:0 0 10px}.premium-panel{border-color:#13aeea33}.form-card{gap:14px;display:grid}.form-grid,.inline-form{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));align-items:end;gap:14px;display:grid}.form-grid label:has(textarea){grid-column:span 2}.form-actions{align-self:end}.check-row{align-items:center;gap:10px;min-height:47px;padding:10px 0;display:flex}.check-row input{width:auto;accent-color:var(--secondary);margin:0}.table-wrap{border:1px solid var(--border);background:#fff;border-radius:16px;overflow-x:auto;box-shadow:inset 0 1px #fffc}table{border-collapse:separate;border-spacing:0;width:100%;min-width:760px}th,td{text-align:left;vertical-align:top;border-bottom:1px solid #edf3f8;padding:13px 14px}th{z-index:1;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;background:#f7fbfe;font-size:12px;position:sticky;top:0}tbody tr:hover{background:#f8fcff}tbody tr:last-child td{border-bottom:0}td small{color:var(--muted);margin-top:4px;display:block}.badge{color:var(--primary);text-transform:capitalize;white-space:nowrap;background:#eef7fc;border:1px solid #cde4f3;border-radius:999px;justify-content:center;align-items:center;gap:6px;padding:6px 10px;font-size:12px;font-weight:900;display:inline-flex}.badge-dot{background:currentColor;border-radius:999px;width:7px;height:7px;box-shadow:0 0 0 3px #ffffffad}.badge-completed,.badge-paid,.badge-active{color:#116b4d;background:#eaf9f2;border-color:#bdebd6}.badge-pending,.badge-partial{color:#7a5512;background:#fff7da;border-color:#f5df94}.badge-cancelled,.badge-inactive{color:#a83232;background:#fff0f0;border-color:#ffd1d1}.badge-assigned,.badge-in-progress{color:var(--primary);background:#e8f5fd;border-color:#bfe4f8}.badge-reschedule-requested{color:#8a4f12;background:#fff1dc;border-color:#ffd8a8}.task-list{gap:14px;display:grid}.task-card{grid-template-columns:1fr auto auto;align-items:center;gap:16px;display:grid}.employee-task-list{gap:16px}.employee-task-card{border-left:5px solid var(--secondary);background:linear-gradient(90deg,#13aeea14,#fff0 34%),#fff;gap:16px;display:grid}.task-main{grid-template-columns:1fr auto;align-items:start;gap:14px;display:grid}.task-main h2{margin:0 0 8px}.task-main p{margin:6px 0}.task-status{flex-wrap:wrap;justify-content:flex-end;gap:8px;display:flex}.task-detail-grid{background:#f6fbfe;border:1px solid #e1eef7;border-radius:16px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;padding:14px;display:grid}.task-detail-grid span{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;font-size:11px;font-weight:900;display:block}.task-notes{grid-column:1/-1}.task-actions{border-top:1px solid #edf3f8;padding-top:14px}.empty-state{text-align:center;background:#f8fcff;border:1px dashed #c7dceb;border-radius:16px;padding:34px 20px;position:relative}.empty-state:before{content:"";background:linear-gradient(135deg,#13aeea38,#39dfc238);border:1px solid #13aeea33;border-radius:999px;width:54px;height:54px;margin:0 auto 14px;display:block}.empty-state h2,.empty-state h3{margin:0 0 6px}.empty-state p{margin:0}.customer-overview-grid{grid-template-columns:minmax(220px,.7fr) 1.3fr;align-items:start;gap:18px;display:grid}.customer-card-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.customer-booking-card{background:linear-gradient(135deg,#f8fcff,#effbff);border:1px solid #dcebf6;border-radius:18px;grid-template-columns:1fr auto;align-items:start;gap:14px;padding:18px;display:grid}.car-profile-card{overflow:hidden}.car-visual{background-color:#0000;background-image:linear-gradient(135deg,#06365fdb,#13aeeaa8,#39dfc280),url(/wash-package.png);background-position:50%;background-repeat:repeat,repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;height:96px;margin:-20px -20px 16px}.support-card{color:#fff;background:linear-gradient(135deg, #06365ff5, #075a9fdb, #13aeeab8), url(/support-detail.png), var(--primary);background-position:50%;background-size:cover}.support-card h2,.support-card p,.support-card .eyebrow{color:#fff}.support-card .actions a{box-shadow:none;background:#ffffff29;border:1px solid #ffffff47}.customer-booking-card h2{margin:0 0 8px}.customer-booking-card p{margin:6px 0}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.export-panel{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.export-panel h2{margin:0}.confirm-overlay{z-index:50;background:#12203385;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.confirm-dialog{border-top:5px solid var(--danger);gap:18px;width:min(440px,100%);display:grid}.confirm-dialog h2{margin:0 0 8px}.confirm-dialog p{margin:0}.calendar-toolbar{justify-content:space-between;align-items:end;gap:16px;display:flex}.calendar-controls{grid-template-columns:minmax(190px,240px) auto;align-items:end;gap:10px;display:grid}.calendar-group{gap:14px;display:grid}.calendar-booking-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;display:grid}.calendar-booking-card{border:1px solid #dcebf6;border-left:5px solid var(--secondary);background:#fbfdff;border-radius:18px;gap:14px;padding:16px;display:grid}.calendar-booking-head{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.calendar-booking-head strong{color:var(--primary-dark);font-size:22px}.calendar-booking-body{gap:8px;display:grid}.calendar-booking-body p{color:var(--text);gap:2px;margin:0;font-weight:800;display:grid}.calendar-booking-body span,.receipt-item span,.receipt-notes span{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:900}.calendar-approve-box{background:#f6fbfe;border:1px solid #e1eef7;border-radius:14px;gap:8px;padding:12px;display:grid}.plan-badge{width:fit-content;color:var(--primary);text-transform:capitalize;background:#eef7fc;border:1px solid #cde4f3;border-radius:999px;align-items:center;padding:6px 10px;font-size:12px;font-weight:900;display:inline-flex}.plan-monthly{color:#116b4d;background:#eaf9f2;border-color:#bdebd6}.plan-weekly{color:#7a5512;background:#fff7da;border-color:#f5df94}.car-plan-line{flex-wrap:wrap;align-items:center;gap:8px;margin:2px 0;display:flex}.receipt-overlay{z-index:40;background:#12203385;place-items:start center;padding:28px;display:grid;position:fixed;inset:0;overflow:auto}.receipt-shell{width:min(820px,100%)}.receipt-print-area{border:1px solid var(--border);background:#fff;border-radius:18px;gap:20px;padding:26px;display:grid}.receipt-header{border-bottom:2px solid #edf3f8;justify-content:space-between;align-items:flex-start;gap:18px;padding-bottom:18px;display:flex}.receipt-header h2,.receipt-header p{margin:0 0 6px}.receipt-title{color:var(--primary);justify-items:end;gap:6px;display:grid}.receipt-title strong{font-size:24px}.receipt-grid{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;display:grid}.receipt-item{background:#f8fcff;border:1px solid #e1eef7;border-radius:14px;padding:12px}.receipt-item p,.receipt-item strong{color:var(--text);margin:5px 0 0;display:block}.receipt-notes{background:#fffdf5;border:1px solid #f5df94;border-radius:14px;padding:14px}.receipt-notes p{margin:5px 0 0}@media print{body *{visibility:hidden}.receipt-overlay,.receipt-overlay *{visibility:visible}.receipt-overlay{background:#fff;padding:0;display:block;position:static}.receipt-shell{width:100%;box-shadow:none;border:0;padding:0}.receipt-print-area{border:0;padding:0}.no-print{display:none!important}}@media (width<=900px){.login-page{grid-template-columns:1fr;padding:20px}.login-hero{min-height:auto}}@media (width<=760px){.app-shell{padding:14px 16px 30px}.topbar,.task-card,.page-hero{grid-template-columns:1fr;display:grid}.topbar{align-items:start;margin-inline:-6px;padding-inline:6px}.topbar h1{font-size:24px}.user-box{justify-content:flex-start}.tabs{flex-wrap:nowrap;padding-bottom:10px;overflow-x:auto}.tabs button{white-space:nowrap}.employee-filters,.export-panel,.calendar-toolbar,.calendar-controls,.calendar-booking-head,.receipt-header,.task-main,.customer-overview-grid,.customer-booking-card{grid-template-columns:1fr}.calendar-toolbar,.calendar-booking-head,.receipt-header{display:grid}.receipt-title{justify-items:start}.task-status{justify-content:flex-start}.form-grid label:has(textarea){grid-column:span 1}.card,.page-hero{border-radius:18px;padding:16px}.page-hero{min-height:0}.page-hero h2{font-size:34px}.package-grid,.ops-grid{grid-template-columns:1fr}.user-meta{justify-items:start}th,td{padding:10px 9px}button,.actions a{width:auto}}@media (width<=520px){.brand-mark{border-radius:14px;width:40px;height:40px}.login-page{padding:12px}.login-card{padding:20px}.login-hero{border-radius:22px}.hero-metric{width:100%}.actions button,.actions a{flex:150px}}
