@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@500;600;700;800;900&display=swap');
:root{--navy:#101d35;--navy2:#172b4d;--blue:#2563eb;--teal:#13a887;--mint:#dff8ef;--ink:#17243a;--muted:#6d7b90;--line:#e3eaf2;--paper:#fff;--canvas:#f3f6fa;--red:#b42318;--green:#087a50;--shadow:0 18px 48px rgba(18,37,67,.09);--radius:22px}
*{box-sizing:border-box}html{min-height:100%;scroll-behavior:smooth}body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 8% 4%,rgba(37,99,235,.09),transparent 30%),radial-gradient(ellipse at 95% 25%,rgba(19,168,135,.08),transparent 27%),var(--canvas);color:var(--ink);font:15px/1.6 'DM Sans',Arial,sans-serif}a{color:var(--blue);text-decoration:none;font-weight:700}a:hover{color:#1749b5;text-decoration:underline}button,input,select,textarea{font:inherit}
header:not(.auth-header){position:sticky;top:0;z-index:30;min-height:78px;padding:13px clamp(18px,4vw,64px);display:flex;align-items:center;justify-content:space-between;gap:22px;background:linear-gradient(110deg,#101d35,#172d50 70%,#123e4b);color:#fff;border-bottom:1px solid rgba(255,255,255,.1);box-shadow:0 8px 28px rgba(10,24,46,.2)}header>b{font:900 20px 'Manrope',sans-serif;letter-spacing:-.65px;color:#fff;white-space:nowrap}header>b:first-letter{color:#5be0b9}header nav{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap}header nav>a{padding:9px 12px;border-radius:11px;color:#dce7f5;font-size:12px;font-weight:800;white-space:nowrap;transition:.18s}header nav>a:hover,header nav>a:focus{background:rgba(255,255,255,.12);color:#fff;text-decoration:none}nav form{margin:0}.linkbtn{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:11px;color:#fff;padding:9px 14px;font-weight:800;cursor:pointer;font-size:12px}.linkbtn:hover{background:rgba(255,255,255,.18);color:#fff}.logout-btn{background:#fff0ee!important;color:#a82d25!important;border:1px solid #ffd3cd!important}.logout-btn:hover{background:#ffe1dc!important;color:#8c211b!important}.user-chip{display:inline-flex;align-items:center;max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.12);color:#e8f4fb;font-size:12px;font-weight:800}.nav-toggle{display:none;align-items:center;justify-content:center;flex-direction:column;gap:4px;width:43px;height:43px;border:1px solid rgba(255,255,255,.24);border-radius:13px;background:rgba(255,255,255,.1);cursor:pointer}.nav-toggle span{display:block;width:18px;height:2px;border-radius:2px;background:#fff}
main{width:min(1240px,calc(100% - 44px));margin:36px auto 56px;flex:1}.panel,.auth{background:rgba(255,255,255,.96);border:1px solid rgba(222,231,241,.95);border-radius:25px;padding:clamp(24px,3.4vw,42px);box-shadow:var(--shadow)}.panel h1,.auth h1{font:900 clamp(28px,3vw,40px)/1.16 'Manrope',sans-serif;letter-spacing:-1.25px;color:var(--navy);margin:0 0 12px}.panel h1:after{content:'';display:block;width:52px;height:4px;margin-top:14px;border-radius:9px;background:linear-gradient(90deg,var(--teal),#60d9b5)}.panel h2{font:900 21px 'Manrope',sans-serif;color:var(--navy);margin:32px 0 15px;letter-spacing:-.45px}.panel h3{font:800 16px 'Manrope',sans-serif;color:var(--navy)}.panel p,.hero p{color:var(--muted);line-height:1.75}.panel>p:first-of-type{margin-top:10px}.panel>p .btn{margin:4px 6px 4px 0}
.auth-header{min-height:76px;padding:12px clamp(18px,5vw,70px);display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid var(--line)}.footer-brand{display:inline-flex;align-items:center;gap:11px;color:var(--navy);font:900 19px 'Manrope',sans-serif;letter-spacing:-.55px;text-decoration:none}.footer-brand:hover{text-decoration:none;color:var(--blue)}.footer-brand strong{color:#0e9e7e}.brand-mark{display:grid;place-items:center;width:39px;height:39px;border-radius:13px;background:linear-gradient(145deg,#24c99d,#176b87);color:#fff;font:900 18px 'Manrope',sans-serif;box-shadow:0 7px 16px rgba(23,107,135,.23)}.auth-home-link{font-size:13px;color:#52647b}
.auth{position:relative;width:min(490px,calc(100% - 30px));margin:clamp(30px,7vh,76px) auto 54px;padding:clamp(28px,4vw,44px);border-radius:27px;overflow:hidden}.auth:before{content:'';position:absolute;left:0;top:0;right:0;height:6px;background:linear-gradient(90deg,#13a887,#2563eb)}.auth>b,.auth>.brand{display:inline-flex;align-items:center;gap:10px;margin-bottom:15px;color:#138e79;font:900 18px 'Manrope',sans-serif}.auth>b:before{content:'A';display:grid;place-items:center;width:35px;height:35px;border-radius:12px;background:linear-gradient(145deg,#20b486,#176b87);color:#fff}.auth form,.panel form{display:grid;gap:12px;margin:20px 0}.auth form{gap:14px;margin:25px 0 18px}.auth form .btn{width:100%;margin-top:7px}.auth label,.panel label{font-size:12px;letter-spacing:.25px;font-weight:900;color:#465872;margin-top:5px}input,select,textarea{width:100%;min-height:47px;padding:12px 14px;border:1px solid #d6e0eb;border-radius:13px;font-size:14px;background:#fff;color:var(--ink);outline:none;transition:border-color .16s,box-shadow .16s}textarea{min-height:115px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:#35b69b;box-shadow:0 0 0 4px rgba(19,168,135,.13)}input[type=checkbox],input[type=radio]{width:auto;min-height:0;accent-color:var(--teal)}input[type=file]{padding:9px;background:#f7fafc}
.btn,button.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:45px;background:linear-gradient(135deg,#17ae8a,#087f79);color:#fff;border:0;border-radius:13px;padding:11px 19px;font-weight:900;font-size:13px;cursor:pointer;box-shadow:0 8px 18px rgba(8,127,121,.2);transition:transform .16s,box-shadow .16s,filter .16s}.btn:hover,button.btn:hover{color:#fff;text-decoration:none;transform:translateY(-2px);filter:saturate(1.1);box-shadow:0 12px 24px rgba(8,127,121,.25)}.btn.secondary,.secondary{background:#e8f4f7;color:#17617a;box-shadow:none;border:1px solid #d4e8ed}.btn.secondary:hover{background:#dceef2;color:#104e63}.btn.danger,.danger{background:#fff0ee;color:#ae3028;border:1px solid #f3d1cd;box-shadow:none}.btn.danger:hover{background:#ffe5e1;color:#8d211b}.error,.success,.otp{padding:13px 16px;border-radius:13px;font-weight:700;font-size:13px}.error{color:#a82d25;background:#fff2f0;border:1px solid #ffd9d4}.success{color:#087a50;background:#eafaf2;border:1px solid #c9f0dc}.otp{color:#805800;background:#fff8e6;border:1px solid #f5dfaa}
.hero{position:relative;isolation:isolate;overflow:hidden;width:min(1320px,calc(100% - 36px));margin:38px auto 64px;padding:clamp(35px,6vw,78px);display:grid;grid-template-columns:1.08fr .92fr;gap:clamp(28px,5vw,72px);align-items:center;border-radius:34px;background:linear-gradient(115deg,#101d35 0%,#17365a 58%,#0b706b 120%);box-shadow:0 28px 70px rgba(14,35,63,.22);color:#fff}.hero:before,.hero:after{content:'';position:absolute;z-index:-1;border:1px solid rgba(255,255,255,.12);border-radius:50%;width:420px;height:420px;right:-90px;top:-220px}.hero:after{width:540px;height:540px;right:-180px;top:-265px}.hero section>small{display:inline-flex;padding:8px 13px;border:1px solid rgba(98,226,190,.35);border-radius:999px;background:rgba(26,181,142,.13);color:#83f0ce;font-size:10px;font-weight:900;letter-spacing:1.4px}.hero h1{margin:20px 0 15px;color:#fff;font:900 clamp(46px,6.5vw,82px)/1.02 'Manrope',sans-serif;letter-spacing:-3.5px}.hero em{color:#66e2bd;font-style:normal}.hero p{max-width:560px;color:#d1deed;font-size:16px}.hero .actions{margin-top:26px}.hero .btn{background:linear-gradient(135deg,#2bd4a5,#0ba987);color:#092d35}.hero .btn.secondary{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.25);box-shadow:none}.hero aside{position:relative;min-height:340px;padding:clamp(22px,4vw,36px);border:1px solid rgba(255,255,255,.2);border-radius:28px;background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.06));backdrop-filter:blur(14px);box-shadow:0 22px 55px rgba(0,0,0,.16);color:#fff}.hero aside h2{color:#fff;font:900 24px 'Manrope',sans-serif}.hero aside p{color:#d3e5ef}.hero aside .muted{color:#b8cedc}.car{display:grid;place-items:center;min-height:155px;margin-bottom:22px;border-radius:22px;background:linear-gradient(135deg,rgba(255,255,255,.2),rgba(83,222,184,.14));font-size:86px}.hero aside a{color:#76e9c7}
.booking{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;padding:24px;margin:25px 0 34px;border:1px solid #dce8ed;border-radius:21px;background:linear-gradient(145deg,#f7fcfb,#f4f8ff);box-shadow:0 12px 30px rgba(21,53,78,.06)}.booking label{align-self:end}.booking button,.booking #scheduleWrap{grid-column:1/-1}.booking #scheduleWrap{display:grid;gap:8px}.booking .btn{min-height:51px;font-size:14px}
.ride-list{display:grid;gap:15px}.ride{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;border:1px solid #e1e9f0;border-radius:18px;background:#fff;box-shadow:0 7px 22px rgba(18,37,67,.045);transition:transform .18s,box-shadow .18s,border-color .18s}.ride:hover{transform:translateY(-2px);border-color:#cfe5e3;box-shadow:0 13px 30px rgba(18,37,67,.08)}.ride>b,.ride strong{color:var(--navy)}.ride p{margin:6px 0}.ride form{margin:0;min-width:180px}.ride .actions,.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.ride .actions form{min-width:0}.inline{display:flex;align-items:center;gap:14px}.inline select{max-width:180px}.ride img{max-width:100%;height:auto}.ride>div:first-child>b{font-size:15px}.ride small{color:var(--muted)}
table{width:100%;border-collapse:separate;border-spacing:0;overflow:hidden;border:1px solid #e1e8f0;border-radius:16px;background:#fff;box-shadow:0 7px 22px rgba(18,37,67,.035)}td,th{text-align:left;padding:14px 15px;border-bottom:1px solid #e9eef3;font-size:13px;vertical-align:middle}th{background:#edf4f6;color:#40566e;font-size:10px;text-transform:uppercase;letter-spacing:.8px;font-weight:900}tr:last-child td{border-bottom:0}tbody tr:hover td{background:#f8fcfb}td form{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0!important}td form select{min-width:130px}.muted{color:var(--muted);font-size:.9rem}.live-track{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:14px;margin:13px 0;border:1px solid #d5ebe4;border-radius:14px;background:#effaf6}.live-track a{font-weight:800}.panel>p .btn{margin:5px 7px 5px 0}.panel form .btn{justify-self:start}.panel form.booking .btn{justify-self:stretch}.panel>form:not(.booking){max-width:720px}.panel .ride form{max-width:390px}.panel .ride form input,.panel .ride form select{min-width:0}.admin-nav-note{font-size:10px;color:#8fe4cb;letter-spacing:1.2px;font-weight:900}.table-wrap{width:100%;overflow-x:auto;margin:20px 0;border-radius:16px}.table-wrap table{min-width:820px}.panel code{display:inline-block;padding:10px 14px;border-radius:12px;background:#e8f7f2;color:#086c5a;font-weight:900;border:1px solid #ccebe0}
/* Admin overview: present operational figures as dashboard tiles */
body.page-admin-operations main.panel .ride-list{grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:14px}body.page-admin-operations main.panel .ride-list .ride{min-height:112px;align-items:flex-start;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#fff,#f3faf8)}body.page-admin-operations main.panel .ride-list .ride strong{font:900 30px 'Manrope',sans-serif;color:#087f79}
.site-footer{margin-top:auto;background:linear-gradient(110deg,#0e1a30,#142b49 72%,#0b4e4d);color:#dce6f2;padding:38px 24px 27px}.footer-inner{width:min(1240px,100%);margin:0 auto;display:grid;grid-template-columns:1fr auto;gap:10px 30px;align-items:center}.site-footer .footer-brand{color:#fff}.site-footer .footer-brand strong{color:#61e0bd}.site-footer p{margin:4px 0;color:#afc1d4;font-size:13px}.footer-links{display:flex;justify-content:flex-end;gap:20px;flex-wrap:wrap}.footer-links a{color:#d4deeb;font-size:12px;font-weight:800}.footer-links a:hover{color:#6be6c3}.footer-inner>small{grid-column:1/-1;padding-top:17px;margin-top:10px;border-top:1px solid rgba(255,255,255,.13);color:#91a3ba;font-size:11px}
@media(max-width:1100px){header:not(.auth-header){flex-wrap:wrap}.site-nav{gap:3px}header nav>a{padding:8px 9px;font-size:11px}}
@media(max-width:900px){header:not(.auth-header){display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:12px 18px}.nav-toggle{display:flex;grid-column:2;grid-row:1}.site-nav{display:none;grid-column:1/-1;width:100%;padding:12px 0 3px;align-items:stretch;justify-content:flex-start;flex-direction:column;gap:6px;border-top:1px solid rgba(255,255,255,.14)}.nav-open .site-nav{display:flex}.site-nav>a{padding:12px 13px;background:rgba(255,255,255,.08);font-size:13px}.site-nav form{width:100%}.site-nav .logout-btn{width:100%}.site-nav .user-chip{max-width:none;width:100%;border-radius:11px}.hero{grid-template-columns:1fr;margin-top:22px}.hero aside{max-width:680px}.footer-inner{grid-template-columns:1fr}.footer-links{justify-content:flex-start}.footer-inner>small{grid-column:auto}}
@media(max-width:640px){main{width:calc(100% - 22px);margin:17px auto 32px}.panel{padding:20px 15px;border-radius:18px}.panel h1{font-size:28px}.auth{margin:22px auto 32px;padding:26px 19px;border-radius:20px}.auth-header{min-height:64px}.hero{width:calc(100% - 22px);margin:17px auto 32px;padding:28px 20px;gap:25px;border-radius:24px}.hero h1{font-size:clamp(43px,12vw,56px);letter-spacing:-2.2px}.hero p{font-size:14px}.hero aside{padding:19px;border-radius:20px;min-height:0}.car{min-height:125px;font-size:68px}.booking{grid-template-columns:1fr;padding:17px;margin:18px 0 27px}.booking button,.booking #scheduleWrap{grid-column:auto}.ride{align-items:stretch;flex-direction:column;padding:16px}.ride form{min-width:0;width:100%}.ride .actions{align-items:stretch}.ride form .btn{width:100%}.actions>.btn,.actions>a.btn{flex:1 1 100%}.panel>p .btn{width:100%;margin:5px 0}table{display:block;overflow-x:auto;white-space:nowrap}td,th{padding:11px 12px}.site-footer{padding:29px 20px 23px}.footer-links{gap:12px 17px}.footer-inner>small{line-height:1.6}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Landing-page composition */
.page-home .hero{margin-top:32px;margin-bottom:34px}.page-home .hero-trust{margin-top:25px;font-size:12px;color:#a8bfd2;letter-spacing:.2px}.home-visual .visual-top{display:flex;align-items:center;gap:9px;color:#bfe8dc;font-size:10px;font-weight:900;letter-spacing:1.2px}.live-dot{width:8px;height:8px;border-radius:50%;background:#5ce2b6;box-shadow:0 0 0 5px rgba(92,226,182,.12)}.route-art{position:relative;height:205px;margin:19px 0 18px;border-radius:22px;background:linear-gradient(135deg,rgba(255,255,255,.12),rgba(10,168,135,.12));overflow:hidden}.route-art:before,.route-art:after{content:'';position:absolute;width:240px;height:120px;border:1px solid rgba(255,255,255,.12);border-radius:50%;transform:rotate(-28deg);left:15%;top:23%}.route-art:after{left:35%;top:4%;width:280px;height:170px}.route-line{position:absolute;left:28%;top:23%;width:45%;height:57%;border-left:3px dashed #64e0bd;border-bottom:3px dashed #64e0bd;border-radius:0 0 0 55px;transform:skew(-18deg)}.route-pin{position:absolute;z-index:2;display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#fff;color:#0b9b7d;box-shadow:0 5px 14px rgba(0,0,0,.2);font-size:12px}.pickup-pin{left:22%;top:18%}.destination-pin{right:20%;bottom:15%;color:#2563eb}.route-car{position:absolute;z-index:3;left:48%;top:43%;display:grid;place-items:center;width:60px;height:60px;border-radius:18px;background:#fff;font-size:32px;box-shadow:0 12px 26px rgba(0,0,0,.2);transform:rotate(-8deg)}.visual-caption{display:flex;align-items:center;justify-content:space-between}.visual-caption small{color:#8de5ca;font-size:10px;font-weight:900;letter-spacing:1.2px}.visual-caption h2{margin:4px 0 0;color:#fff;font:900 23px 'Manrope',sans-serif}.visual-arrow{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.13);color:#7ce5c5;font-size:24px}.home-visual>p{margin-bottom:0;font-size:13px}.home-features{width:min(1200px,calc(100% - 44px));margin:0 auto 64px;display:grid;grid-template-columns:repeat(3,1fr);gap:17px}.home-features article{padding:24px;border:1px solid #e0e9ef;border-radius:19px;background:#fff;box-shadow:0 9px 25px rgba(18,37,67,.045)}.feature-icon{display:grid;place-items:center;width:43px;height:43px;border-radius:14px;background:#e7f8f2;color:#07866d;font-size:23px;font-weight:900}.home-features h2{margin:15px 0 5px;color:var(--navy);font:900 17px 'Manrope',sans-serif}.home-features p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
@media(max-width:900px){.home-features{grid-template-columns:1fr 1fr}}@media(max-width:640px){.home-features{width:calc(100% - 22px);grid-template-columns:1fr;margin-bottom:34px}.home-features article{padding:20px}.route-art{height:170px}}

/* ASMJ Ride support chat */
.support-layout{width:min(1120px,calc(100% - 40px));margin:34px auto 58px;flex:1}
.support-intro{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:clamp(25px,4vw,42px);border-radius:26px;background:linear-gradient(115deg,#101d35 0%,#173858 65%,#087d72 100%);color:#fff;box-shadow:0 20px 48px rgba(16,29,53,.18);overflow:hidden;position:relative}
.support-intro:after{content:'';position:absolute;width:310px;height:310px;border:1px solid rgba(255,255,255,.1);border-radius:50%;right:7%;top:-190px;box-shadow:0 0 0 34px rgba(255,255,255,.025),0 0 0 70px rgba(255,255,255,.02)}
.support-intro h1{position:relative;z-index:1;margin:8px 0 8px;color:#fff;font:900 clamp(30px,4vw,44px)/1.1 'Manrope',sans-serif;letter-spacing:-1.4px}
.support-intro p{position:relative;z-index:1;max-width:650px;margin:0;color:#d2e1ed}
.support-eyebrow{color:#5ce0bb;font-size:10px;font-weight:900;letter-spacing:1.5px}
.support-shield{position:relative;z-index:1;display:grid;place-items:center;flex:0 0 112px;width:112px;height:112px;border:1px solid rgba(255,255,255,.23);border-radius:30px;background:rgba(255,255,255,.1);color:#70e7c5;font-size:45px;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.support-shield small{font-size:8px;font-weight:900;letter-spacing:1px;color:#d9f7ed}
.support-new,.support-conversations{margin-top:24px;padding:clamp(20px,3vw,30px);border:1px solid #e0e8ef;border-radius:23px;background:#fff;box-shadow:0 12px 34px rgba(18,37,67,.055)}
.support-section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:18px}
.support-section-heading h2{margin:4px 0 0;color:var(--navy);font:900 23px 'Manrope',sans-serif;letter-spacing:-.6px}
.support-live,.conversation-count{padding:7px 11px;border:1px solid #d5eee5;border-radius:999px;background:#effaf6;color:#087c65;font-size:11px;font-weight:900;white-space:nowrap}
.support-compose{margin:0!important;padding:20px;border-radius:18px;background:linear-gradient(145deg,#f8fbfd,#f2faf7);border:1px solid #e3edf0}
.support-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.support-form-grid label{display:grid;gap:7px;color:#40546d;font-size:12px;font-weight:900}
.support-form-grid .support-full{grid-column:1/-1}
.support-form-grid input,.support-form-grid select,.support-form-grid textarea{font-weight:500}
.required-mark{color:#b42318;font-size:10px;text-transform:uppercase;letter-spacing:.5px}
.optional-mark{color:#728197;font-size:10px;font-weight:700}
.support-compose-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:16px}
.support-compose-bottom small{max-width:540px;color:#728197;font-size:11px}
.conversation-card{margin-top:17px;padding:20px;border:1px solid #e2eaf1;border-radius:19px;background:#fff;box-shadow:0 7px 22px rgba(18,37,67,.035)}
.conversation-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}
.conversation-category{display:inline-flex;padding:5px 9px;border-radius:8px;background:#eaf7f3;color:#087e68;font-size:9px;font-weight:900;letter-spacing:.8px}
.conversation-head h3{margin:8px 0 3px;color:var(--navy);font:900 18px 'Manrope',sans-serif}
.conversation-head p{margin:0;color:#75849a;font-size:11px}
.status-pill{padding:6px 10px;border-radius:999px;background:#fff6e7;color:#98620b;font-size:10px;font-weight:900;letter-spacing:.5px}
.status-pill.in_progress{background:#eaf3ff;color:#245aa8}.status-pill.resolved,.status-pill.closed{background:#e8f8ef;color:#087a50}
.conversation-meta{margin-top:12px;color:#728197;font-size:11px}
.chat-thread{display:grid;gap:11px;margin:17px 0;padding:15px;border:1px solid #e7edf2;border-radius:16px;background:#f7f9fc}
.chat-message{max-width:84%;padding:12px 14px;border:1px solid #e3eaf1;border-radius:15px;background:#fff;box-shadow:0 3px 10px rgba(18,37,67,.025)}
.chat-message.from-user{justify-self:end;border-color:#d4eee4;background:#effaf6;border-bottom-right-radius:5px}
.chat-message.from-admin{justify-self:start;border-bottom-left-radius:5px}
.chat-message-meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;color:#52647a;font-size:10px}
.chat-message-meta b{color:#18334c;font-size:11px}.chat-message-meta time{color:#8996a7}
.chat-message p{margin:7px 0 0;color:#33465d;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-attachments{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.chat-attachments a{padding:7px 9px;border-radius:9px;background:#eaf1f8;color:#24577a;font-size:11px;font-weight:800}
.chat-reply-form{display:grid;gap:10px;margin:0!important;padding:14px;border:1px solid #e2eaf0;border-radius:15px;background:#fbfcfe}
.chat-reply-form textarea{min-height:78px;background:#fff}
.chat-reply-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.chat-reply-actions small{margin-right:auto;color:#8290a2;font-size:10px}
.attach-label{display:inline-flex;align-items:center;gap:5px;padding:8px 11px;border:1px solid #dbe5ed;border-radius:10px;background:#fff;color:#38536d;font-size:11px;font-weight:900;cursor:pointer}
.attach-label input{display:none}
.chat-reply-actions .btn{min-height:38px;padding:8px 14px}
.support-empty{padding:48px 20px;text-align:center;border:1px dashed #d7e3eb;border-radius:18px;background:#f9fbfd}
.support-empty>div{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 12px;border-radius:17px;background:#e7f8f2;color:#0a8b70;font-size:24px}
.support-empty h3{margin:0;color:var(--navy);font:900 18px 'Manrope',sans-serif}.support-empty p{margin:6px 0 0;color:#74849a;font-size:13px}
.footer-logout{display:inline-flex;margin:0!important}.footer-logout button{padding:0;border:0;background:transparent;color:#d4deeb;font:800 12px 'DM Sans',sans-serif;cursor:pointer}.footer-logout button:hover{color:#6be6c3;text-decoration:underline}
@media(max-width:640px){.support-layout{width:calc(100% - 22px);margin:16px auto 32px}.support-intro{padding:24px 20px;border-radius:20px}.support-shield{flex-basis:66px;width:66px;height:66px;border-radius:19px;font-size:28px}.support-shield small{font-size:6px}.support-form-grid{grid-template-columns:1fr}.support-form-grid .support-full{grid-column:auto}.support-section-heading{align-items:flex-start;flex-direction:column}.support-compose{padding:13px}.support-compose-bottom{align-items:stretch;flex-direction:column}.support-compose-bottom .btn{width:100%}.conversation-card{padding:14px}.conversation-head{flex-direction:column}.chat-message{max-width:96%}.chat-thread{padding:10px}.chat-reply-actions{align-items:stretch}.chat-reply-actions .btn{width:100%}.footer-logout{padding:3px 0}}
.home-logout{display:inline-flex;margin:0!important}.admin-status-control{display:flex;align-items:center;gap:6px;color:#64748b;font-size:10px;font-weight:900}.admin-status-control select{width:auto;min-width:120px;min-height:38px;padding:6px 9px;font-size:11px}.chat-reply-actions .admin-status-control{margin-right:auto}.chat-reply-actions .admin-status-control select{max-width:145px}

/* Refined navigation and link system — clear hierarchy for actions vs. text links */
:root{--link-ink:#29415d;--link-accent:#087f79;--link-border:#d8e4ec}
/* Header links: calm navigation, with sign-in and registration treated as intentional actions */
header:not(.auth-header) .site-nav>a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 14px;border:1px solid transparent;border-radius:12px;color:#e1eaf5;font-size:12px;font-weight:750;letter-spacing:.1px;text-decoration:none;transition:background .18s,border-color .18s,color .18s,transform .18s}
header:not(.auth-header) .site-nav>a:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.12);color:#fff;text-decoration:none;transform:translateY(-1px)}
header:not(.auth-header) .site-nav>a[href="/login"]{border-color:rgba(220,235,248,.38);background:rgba(255,255,255,.045);color:#fff;padding-inline:17px}
header:not(.auth-header) .site-nav>a[href="/login"]:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.62)}
header:not(.auth-header) .site-nav>a[href="/register"]{border-color:#50d7b3;background:linear-gradient(135deg,#5ce0ba,#21b991);color:#092f35;padding-inline:18px;box-shadow:0 7px 18px rgba(26,190,148,.2)}
header:not(.auth-header) .site-nav>a[href="/register"]:hover{background:linear-gradient(135deg,#83ebce,#38cba7);color:#082c32;box-shadow:0 10px 22px rgba(26,190,148,.27)}
header:not(.auth-header) .site-nav .linkbtn{min-height:40px;padding:9px 15px;border-radius:12px;font-size:12px}
/* Footer navigation: quiet outlined chips rather than plain, uneven text links */
.site-footer .footer-links{align-items:center;gap:9px}
.site-footer .footer-links>span{display:contents}
.site-footer .footer-links>a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 12px;border:1px solid rgba(216,230,244,.18);border-radius:10px;background:rgba(255,255,255,.045);color:#dce7f3;font-size:11px;font-weight:750;letter-spacing:.1px;text-decoration:none;transition:background .18s,border-color .18s,color .18s,transform .18s}
.site-footer .footer-links>a:hover{background:rgba(255,255,255,.12);border-color:rgba(111,226,194,.55);color:#83ebce;text-decoration:none;transform:translateY(-1px)}
.site-footer .footer-links>a[href="/login"]{border-color:rgba(216,230,244,.36);background:rgba(255,255,255,.09);color:#fff}
.site-footer .footer-links>a[href="/register"]{border-color:rgba(86,220,184,.55);background:rgba(32,180,134,.17);color:#8af0d0}
.site-footer .footer-links>a[href="/register"]:hover{background:rgba(32,180,134,.28);color:#b1f8e3}
.site-footer .footer-logout button{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 13px;border:1px solid rgba(255,255,255,.2);border-radius:10px;background:rgba(255,255,255,.06);color:#e2eaf4;font-size:11px;font-weight:800;transition:background .18s,border-color .18s,color .18s}
.site-footer .footer-logout button:hover{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.4);color:#fff;text-decoration:none}
/* Login/register secondary links should read as deliberate helper actions */
.auth>p{margin:13px 0;color:#64748b;font-size:13px}
.auth>p a{color:#087f79;font-weight:800;text-decoration:none;text-decoration-thickness:1px;text-underline-offset:4px}
.auth>p a:hover{color:#075e59;text-decoration:underline}
.auth-header .auth-home-link{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:8px 13px;border:1px solid #dce6ee;border-radius:10px;background:#f8fafc;color:#435a73;font-size:12px;font-weight:800;text-decoration:none;transition:.18s}
.auth-header .auth-home-link:hover{background:#edf7f5;border-color:#b9e2d7;color:#087f79;text-decoration:none}
/* Consistent keyboard focus for all navigation links and actions */
header a:focus-visible,.site-footer a:focus-visible,.auth a:focus-visible,.footer-logout button:focus-visible{outline:3px solid #69e3c1;outline-offset:3px}
@media(max-width:900px){header:not(.auth-header) .site-nav>a{justify-content:flex-start;width:100%;min-height:43px}header:not(.auth-header) .site-nav>a[href="/register"]{justify-content:center}header:not(.auth-header) .site-nav>a[href="/login"]{justify-content:center}}
@media(max-width:640px){.site-footer .footer-links{gap:8px}.site-footer .footer-links>a{min-height:38px;padding:8px 11px}.site-footer .footer-logout{display:inline-flex}.site-footer .footer-logout button{min-height:38px}}

/* Navigation fix: Spring Security/Thymeleaf wraps conditional links in spans.
   Target descendant anchors so authenticated/anonymous links receive the same styling. */
header:not(.auth-header) .site-nav{display:flex;align-items:center;gap:9px}
header:not(.auth-header) .site-nav>span{display:contents}
header:not(.auth-header) .site-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 14px;border:1px solid rgba(220,235,248,.22);border-radius:11px;background:rgba(255,255,255,.045);color:#e5edf7;font-size:12px;font-weight:800;letter-spacing:.1px;line-height:1.2;text-decoration:none;white-space:nowrap;transition:background .18s,border-color .18s,color .18s,transform .18s}
header:not(.auth-header) .site-nav a:hover{background:rgba(255,255,255,.12);border-color:rgba(111,226,194,.55);color:#fff;text-decoration:none;transform:translateY(-1px)}
header:not(.auth-header) .site-nav a[href="/login"]{border-color:rgba(220,235,248,.42);background:rgba(255,255,255,.08);color:#fff}
header:not(.auth-header) .site-nav a[href="/verify-mobile"]{border-color:rgba(220,235,248,.2);background:transparent;color:#d4e4f3}
header:not(.auth-header) .site-nav a[href="/register"]{border-color:#50d7b3;background:linear-gradient(135deg,#5ce0ba,#21b991);color:#092f35;padding-inline:18px;box-shadow:0 7px 18px rgba(26,190,148,.2)}
header:not(.auth-header) .site-nav a[href="/register"]:hover{background:linear-gradient(135deg,#83ebce,#38cba7);color:#082c32}
.site-footer .footer-links{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.site-footer .footer-links>span{display:contents}
.site-footer .footer-links a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:7px 12px;border:1px solid rgba(216,230,244,.2);border-radius:10px;background:rgba(255,255,255,.055);color:#dce7f3;font-size:11px;font-weight:800;letter-spacing:.1px;line-height:1.2;text-decoration:none;white-space:nowrap;transition:background .18s,border-color .18s,color .18s,transform .18s}
.site-footer .footer-links a:hover{background:rgba(255,255,255,.13);border-color:rgba(111,226,194,.55);color:#83ebce;text-decoration:none;transform:translateY(-1px)}
.site-footer .footer-links a[href="/login"]{border-color:rgba(216,230,244,.4);background:rgba(255,255,255,.1);color:#fff}
.site-footer .footer-links a[href="/register"]{border-color:rgba(86,220,184,.55);background:rgba(32,180,134,.18);color:#9af1d8}
@media(max-width:900px){header:not(.auth-header) .site-nav{align-items:stretch;gap:7px}header:not(.auth-header) .site-nav>span{display:contents}header:not(.auth-header) .site-nav a{width:100%;justify-content:flex-start;min-height:43px}header:not(.auth-header) .site-nav a[href="/register"]{justify-content:center}}
@media(max-width:640px){.site-footer .footer-links{gap:8px}.site-footer .footer-links a{min-height:38px;padding:8px 11px}}

/* Phase 1–4: service locations, journey selection and driver metrics */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:18px 0}
.stats-grid .ride{margin:0;padding:18px;background:linear-gradient(145deg,#fff,#f2fbf8);border:1px solid #dcebe7;border-radius:16px}
.stats-grid .ride h2{margin:8px 0 0;color:#087f70;font-size:1.65rem}
.page-customer select,.page-customer input,.page-customer textarea,.page-driver select,.page-driver input{max-width:100%}
.page-customer #returnWrap{padding:16px;margin:12px 0;border:1px solid #b9e7db;border-radius:14px;background:#f0fbf7}
.page-admin-rides .inline select{min-width:170px}

/* ASMJ Ride responsive release: mobile-first layout corrections across authenticated portals */
html,body{max-width:100%;overflow-x:hidden}body{min-width:320px}img,svg,video,iframe{max-width:100%}main{min-width:0}main.panel{width:min(1240px,calc(100% - 44px))}.panel,.auth,.ride,.booking,.support-layout,.conversation-card{min-width:0;max-width:100%}.panel *,.ride *,.booking *{min-width:0;overflow-wrap:anywhere}
/* Keep desktop navigation compact and make the mobile menu a usable overlay-like stack */
.app-header{gap:12px}.site-nav{min-width:0}.site-nav form{display:flex;align-items:center}.site-nav .linkbtn{min-height:42px}.nav-toggle{flex:0 0 43px}
/* Dashboard metrics and operational summaries */
.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}.stats-grid>.ride{min-width:0}.stats-grid .ride h2{font-size:clamp(1.25rem,2.2vw,1.7rem);overflow-wrap:anywhere}.ride-list{min-width:0}.ride{min-width:0}.ride>div{min-width:0;max-width:100%}.ride .actions{min-width:0}.ride .actions form{min-width:0;max-width:100%}.ride .actions .btn,.ride form .btn{white-space:normal;overflow-wrap:anywhere}
/* Forms: prevent oversized fields and make action rows wrap naturally */
form{min-width:0;max-width:100%}.booking{min-width:0}.booking>*{min-width:0}.inline{flex-wrap:wrap}.inline select{max-width:100%}.actions{min-width:0;flex-wrap:wrap}.actions form{min-width:0;max-width:100%}.actions button,.actions .btn{max-width:100%;white-space:normal}
/* Tables stay inside their own scroll region rather than widening the whole page */
.panel table{width:100%;max-width:100%;table-layout:auto}.panel{overflow-wrap:anywhere}.panel pre,.panel code{white-space:pre-wrap;overflow-wrap:anywhere}.panel details{max-width:100%}.panel details>*{max-width:100%}
/* Admin operation filters and multi-control forms */
.panel form:not(.booking){min-width:0}.panel form input,.panel form select,.panel form textarea{max-width:100%}.panel .inline form{flex:1 1 220px}.panel .inline form .btn{width:100%}
@media(max-width:1024px){main.panel{width:calc(100% - 32px)}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero{grid-template-columns:1fr}.hero aside{width:100%}}
@media(max-width:900px){
  header:not(.auth-header){grid-template-columns:minmax(0,1fr) 46px;min-height:66px;padding:10px 15px;gap:10px}
  header:not(.auth-header)>b{font-size:17px;white-space:normal;line-height:1.2}
  header:not(.auth-header) .site-nav{grid-column:1/-1;width:100%;max-height:min(72vh,620px);overflow-y:auto;overscroll-behavior:contain;padding:10px 0 4px}
  header:not(.auth-header) .site-nav a,header:not(.auth-header) .site-nav .linkbtn{width:100%;min-height:46px;justify-content:flex-start;padding:12px 14px;font-size:14px}
  header:not(.auth-header) .site-nav a[href="/register"]{justify-content:center}
  header:not(.auth-header) .site-nav form{width:100%}
  .site-nav .logout-btn{justify-content:center!important}
  main{width:calc(100% - 30px);margin:22px auto 36px}
  .panel{padding:clamp(18px,3vw,28px);border-radius:20px}
  .ride{gap:14px}
}
@media(max-width:640px){
  body{font-size:14px;line-height:1.55}
  main,main.panel{width:calc(100% - 20px);margin:12px auto 25px}
  .panel{padding:17px 13px;border-radius:17px;box-shadow:0 8px 24px rgba(18,37,67,.07)}
  .panel h1{font-size:clamp(23px,7vw,29px);letter-spacing:-.7px;line-height:1.15}
  .panel h2{font-size:18px;margin:23px 0 12px}
  .panel h3{font-size:15px}
  .panel p{font-size:13px;line-height:1.6;overflow-wrap:anywhere}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:13px 0}
  .stats-grid .ride{padding:13px 11px;border-radius:13px;gap:5px}
  .stats-grid .ride h2{font-size:1.25rem;margin:4px 0 0}
  .stats-grid .ride p,.stats-grid .ride small{font-size:11px}
  .ride-list{gap:11px}
  .ride{padding:13px;border-radius:14px;gap:11px;box-shadow:0 4px 14px rgba(18,37,67,.045)}
  .ride>div:first-child>b,.ride strong{font-size:13px}
  .ride p{font-size:12px;margin:4px 0}
  .ride small{font-size:11px;line-height:1.45;display:inline-block}
  .ride .actions{display:grid;grid-template-columns:1fr;gap:8px;width:100%}
  .ride .actions>*{width:100%;max-width:100%}
  .ride .actions form{width:100%}
  .ride .actions .btn,.ride form .btn,.actions>.btn,.actions>a.btn{width:100%;min-height:45px;font-size:13px}
  .booking{grid-template-columns:minmax(0,1fr);gap:9px;padding:13px;margin:15px 0 22px;border-radius:15px}
  .booking button,.booking #scheduleWrap{grid-column:auto}
  .booking label{margin-top:5px}
  input,select,textarea{min-height:46px;font-size:16px;padding:11px 12px;border-radius:11px}
  textarea{min-height:100px}
  .btn,button.btn{min-height:45px;padding:11px 14px;font-size:13px;border-radius:11px;white-space:normal}
  .inline{align-items:stretch;flex-direction:column;gap:9px;width:100%}
  .inline select{width:100%;max-width:100%}
  .actions{align-items:stretch;flex-direction:column;gap:9px;width:100%}
  .actions form{width:100%}
  .panel form{gap:9px;margin:14px 0}
  .panel form .btn{width:100%}
  .panel .inline form{flex:1 1 auto;width:100%}
  /* Tables have an independent horizontal scroll area; the document itself never overflows */
  .panel table{display:block;width:100%;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;white-space:normal}
  .panel table thead,.panel table tbody{min-width:600px}
  .panel td,.panel th{padding:9px 10px;font-size:11px;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
  .panel table td .btn,.panel table th .btn{min-height:36px;padding:7px 9px;font-size:11px}
  .panel details{padding:10px;border-radius:11px}
  .panel details summary{font-size:12px;font-weight:800}
  .site-footer{padding:24px 15px 19px}
  .footer-inner{gap:12px}
  .footer-inner>p{margin:0;font-size:12px}
  .site-footer .footer-links{display:flex;align-items:stretch;justify-content:flex-start;gap:8px;width:100%}
  .site-footer .footer-links a,.site-footer .footer-links .footer-logout button{min-height:40px;padding:8px 10px;font-size:11px}
  .footer-inner>small{font-size:10px}
  .auth-header{padding:10px 14px;min-height:60px}
  .footer-brand{font-size:16px;gap:8px}
  .brand-mark{width:34px;height:34px;border-radius:10px}
  .auth{width:calc(100% - 20px);margin:17px auto 25px;padding:24px 16px;border-radius:18px}
  .auth h1{font-size:27px}
  .hero{width:calc(100% - 20px);margin:12px auto 24px;padding:25px 17px;border-radius:20px;gap:19px}
  .hero h1{font-size:clamp(38px,11vw,50px);letter-spacing:-1.8px}
  .hero aside{padding:16px;border-radius:16px}
  .hero aside h2{font-size:20px}
  .support-layout{width:calc(100% - 20px);margin:12px auto 25px}
  .support-form-grid{grid-template-columns:minmax(0,1fr)}
  .support-form-grid .support-full{grid-column:auto}
  .chat-message{max-width:100%;overflow-wrap:anywhere}
  .conversation-card,.chat-thread,.support-compose{min-width:0;max-width:100%}
  .admin-status-control{align-items:stretch;flex-direction:column;width:100%}
  .admin-status-control select{width:100%;max-width:100%}
}
@media(max-width:380px){
  header:not(.auth-header){padding-inline:11px}
  main,main.panel{width:calc(100% - 14px)}
  .panel{padding:14px 10px}
  .stats-grid{gap:7px}
  .stats-grid .ride{padding:11px 9px}
  .stats-grid .ride h2{font-size:1.1rem}
  .ride{padding:11px}
  .site-footer .footer-links{gap:6px}
  .site-footer .footer-links a,.site-footer .footer-links .footer-logout button{padding-inline:8px;font-size:10px}
}