/* Shared customer / driver visual layer. No changes to checkout or job behavior. */
:is(.ride-portal,.driver-portal){
 --surface-ease:cubic-bezier(.22,.75,.25,1);
 --surface-shadow:0 4px 16px rgb(22 57 42 / 3%),0 16px 44px rgb(22 57 42 / 3%);
 --surface-shadow-hover:0 9px 20px rgb(22 57 42 / 5%),0 22px 50px rgb(22 57 42 / 8%);
 background:#f6f8f5;
 background-image:radial-gradient(ellipse at 12% 2%,#edf5eb 0,transparent 38%),radial-gradient(ellipse at 95% 18%,#f2f5ec 0,transparent 35%);
}
:is(.ride-portal,.driver-portal) a,
:is(.ride-portal,.driver-portal) a:hover,
:is(.ride-portal,.driver-portal) a:focus,
:is(.ride-portal,.driver-portal) a:active{text-decoration:none}
:is(.ride-portal,.driver-portal) :is(a,button,input,textarea,select,summary):focus-visible{
 outline:3px solid #4f9468;outline-offset:4px;
}
:is(.ride-portal,.driver-portal) .ride-card{
 border-color:#e0e8df;box-shadow:var(--surface-shadow);
}
:is(.ride-portal,.driver-portal) :is(.ride-btn,.ride-profile-link,.driver-dispatch-call,.chat-icon-button){
 border-radius:13px;
 transition:background-color .2s ease,border-color .2s ease,box-shadow .22s ease,transform .22s var(--surface-ease),color .2s ease;
}
:is(.ride-portal,.driver-portal) .ride-btn{font-weight:750;letter-spacing:-.01em;gap:10px}
:is(.ride-portal,.driver-portal) .ride-btn.primary{
 background:linear-gradient(135deg,#247658,#14523f);box-shadow:0 4px 10px #174f3719,inset 0 1px 0 #ffffff18;border-color:transparent;color:#fff;
}
:is(.ride-portal,.driver-portal) .ride-btn.accent{
 background:linear-gradient(120deg,#e6f2bd,#d4e9a3);border-color:#e1eeb8;color:#173f2a;box-shadow:0 4px 14px #071e1520,inset 0 1px 0 #ffffff5c;
}
:is(.ride-portal,.driver-portal) .ride-btn.secondary{background:#fff;border-color:#d9e4d9;color:#254b38}
:is(.ride-portal,.driver-portal) .ride-btn:disabled{opacity:.58;box-shadow:none;transform:none;cursor:wait}
:is(.ride-portal,.driver-portal) .ride-btn i{transition:transform .22s var(--surface-ease)}
:is(.ride-portal,.driver-portal) :is(input:not([type=checkbox]):not([type=radio]),textarea,select){
 transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;
}
:is(.ride-portal,.driver-portal) :is(.ride-field,.ride-form) :is(input,textarea,select):focus{
 border-color:#6b9b7c;box-shadow:0 0 0 4px #4f946812;
}
.ride-portal .ride-header,.driver-portal .driver-app-header{
 background:#ffffffed;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
 border-bottom-color:#e1e9e1;transition:box-shadow .22s ease,background-color .22s ease;
}
.ride-portal.surface-scrolled .ride-header,.driver-portal.surface-scrolled .driver-app-header{
 background:#fffffff5;box-shadow:0 8px 26px #153b2810;
}
.ride-portal .ride-brand-mark{border-radius:15px}
.ride-portal .ride-nav{gap:7px}
.ride-portal .ride-nav a{
 display:inline-flex;align-items:center;justify-content:center;
 padding:12px 18px;min-height:44px;border-radius:12px;color:#5b6c60;font-weight:750;
 box-shadow:none;transition:background-color .2s ease,color .2s ease,box-shadow .2s ease;
}
.ride-portal .ride-nav a[aria-current=page]{
 background:#e9f1e3;color:#244e35;box-shadow:inset 0 0 0 1px #dae7d2;
}
.ride-portal .ride-profile-link{background:#f4f8f1;border-color:#dfe9d9;color:#315840}
.ride-portal .ride-header-call{color:#256146}
.ride-portal .portal-welcome{margin-bottom:30px}
.ride-portal .portal-welcome h1{font-weight:800;line-height:1.18;letter-spacing:-.045em}
.ride-portal .portal-welcome .ride-eyebrow{color:#55784f;letter-spacing:.16em;margin-bottom:11px}
.ride-portal .portal-welcome p{max-width:740px;line-height:1.7}
.ride-portal .portal-date{padding:10px 14px;border:1px solid #e0e9dc;border-radius:30px;font-size:12px;background:#ffffff8f;white-space:nowrap}
.ride-portal .portal-hero{
 position:relative;isolation:isolate;border-radius:28px;
 background:radial-gradient(ellipse at 7% 0%,#2e6456 0,transparent 48%),radial-gradient(ellipse at 94% 100%,#295c3d 0,transparent 55%),linear-gradient(130deg,#123b30,#103e35);
 border:1px solid #295247;box-shadow:0 22px 48px -27px #0c332a80;
}
.ride-portal .portal-hero:before{
 content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:linear-gradient(115deg,transparent 52%,#ffffff04 52.15%,transparent 74%);
}
.ride-portal .portal-hero-copy{padding:46px 44px}
.ride-portal .portal-hero h2{font-size:clamp(34px,3.6vw,48px);letter-spacing:-.05em;line-height:1.12;margin:20px 0 18px}
.ride-portal .portal-hero .ride-eyebrow{
 display:inline-flex;gap:8px;align-items:center;padding:7px 11px;border:1px solid #e3eeb429;border-radius:30px;background:#ffffff07;color:#e0edb8;font-size:10px;letter-spacing:.12em;
}
.ride-portal .portal-hero p{line-height:1.75;color:#d5e4da}
.ride-portal .portal-hero-actions{gap:12px}
.ride-portal .portal-hero .ride-btn.secondary{background:#ffffff07;border-color:#b9d3bf60;color:#fff;box-shadow:inset 0 1px 0 #ffffff08}
.ride-portal .portal-hero-side{background:#ffffff03;border-color:#ffffff10;padding:30px;align-content:center;gap:15px}
.ride-portal .portal-assist-option{border-color:#ffffff16;background:linear-gradient(120deg,#ffffff09,#ffffff05);padding:22px 19px;border-radius:18px}
.ride-portal .portal-assist-option>i{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:#e5efb90b;color:#dfedb4;font-size:23px}
.ride-portal .portal-assist-option small{font-size:13px;line-height:1.6;margin-top:4px;color:#ccdfd0}
.ride-portal .portal-hero-side.website-hero-media{padding:0;align-content:stretch}
.ride-portal .portal-quick-actions{gap:18px;margin:26px 0 37px}
.ride-portal .portal-quick-action{padding:23px 21px;border-radius:19px;box-shadow:0 5px 16px #274c2808}
.ride-portal .portal-quick-action,.ride-portal .ride-action-card{
 transition:transform .24s var(--surface-ease),box-shadow .24s var(--surface-ease),border-color .24s ease,background-color .24s ease;
}
.ride-portal .portal-quick-action>i{border-radius:15px;background:#eef4e6;color:#577844;transition:background-color .22s ease,transform .22s var(--surface-ease)}
.ride-portal .portal-section-title h2{font-size:23px;letter-spacing:-.04em}
.ride-portal .portal-grid>.ride-card{padding:27px;border-radius:22px}
.ride-portal .portal-plan-price{letter-spacing:-.055em;font-size:38px}
.ride-portal .portal-grid>.ride-card .ride-btn{width:100%;margin-top:8px}
.ride-portal .portal-grid>.ride-card>.ride-pill{background:#edf4e5;color:#466332;border:1px solid #dce8d1}
.ride-portal .portal-support-card{background:linear-gradient(140deg,#eef3e7,#f7f8ef);border-color:#dce7d4}
.ride-portal .portal-support-card>i{display:grid;place-items:center;width:52px;height:52px;border:1px solid #d8e3cb;border-radius:17px;background:#ffffff8c;color:#54714a;font-size:23px}
.ride-portal .portal-support-card h2{font-size:25px;line-height:1.25}
.ride-portal .portal-support-card p{line-height:1.75}
.ride-portal .portal-process>div:before{background:#e7efdd;color:#44623b}
.ride-portal .ride-support-fab{border:1px solid #ffffff22;background:linear-gradient(130deg,#285e48,#123e31);box-shadow:0 10px 28px #123e3130;transition:transform .22s var(--surface-ease),box-shadow .22s ease}
.ride-portal .portal-tabs a{transition:background-color .2s ease,border-color .2s ease,color .2s ease}
.ride-portal .portal-active-request{background:linear-gradient(115deg,#e7f1dc,#f0f6e9);border-color:#d7e6c8}
.driver-portal .driver-desktop-nav a{transition:background-color .2s ease,color .2s ease,box-shadow .2s ease}
.driver-portal .driver-desktop-nav a[aria-current=page]{background:#e9f1e3;box-shadow:inset 0 0 0 1px #dae7d2}
.driver-portal .driver-duty-card{background:radial-gradient(ellipse at 5% 5%,#32634e,transparent 65%),linear-gradient(130deg,#123e31,#144a36);box-shadow:0 20px 40px -26px #173d2a8f;border:1px solid #305842}
.driver-portal .driver-stat-grid>div{box-shadow:var(--surface-shadow);border-color:#dfe8db}
.driver-portal .driver-vehicle-card{background:linear-gradient(140deg,#eaf1df,#f4f6ed)}
.driver-portal .driver-history-entry{transition:box-shadow .2s ease,border-color .2s ease}
.driver-portal .driver-history-entry[open]{border-color:#a7c298;box-shadow:0 4px 18px #2d543510}
.driver-portal .driver-history-entry summary:after{content:"+";font-size:21px;line-height:1;color:#6c8767}
.driver-portal .driver-history-entry[open] summary:after{content:"−"}
.driver-portal .driver-history-detail{animation:surface-reveal .25s var(--surface-ease) both}
.driver-portal [data-driver-screen]:not([hidden]){animation:surface-reveal .3s var(--surface-ease) both}
@keyframes surface-reveal{from{opacity:.3;transform:translateY(9px)}to{opacity:1;transform:translateY(0)}}
:is(.ride-portal,.driver-portal) :is(.ride-bottom-nav,.driver-mobile-nav){box-shadow:0 -4px 24px #14372006}
:is(.ride-portal,.driver-portal) :is(.ride-bottom-nav,.driver-mobile-nav) a>span,
.ride-portal .ride-bottom-nav a>i{transition:background-color .2s ease,color .2s ease,transform .2s var(--surface-ease)}
/* Keep conventional link cues inside reading content and chat attachments. */
.ride-portal .website-policy a,.ride-portal .chat-message a{text-decoration:underline;text-underline-offset:3px}
@media(hover:hover) and (pointer:fine){
 :is(.ride-portal,.driver-portal) .ride-btn:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 8px 20px #1b453b18}
 :is(.ride-portal,.driver-portal) .ride-btn.primary:not(:disabled):hover{background:linear-gradient(135deg,#2a8060,#175b45);box-shadow:0 8px 20px #164f392b}
 :is(.ride-portal,.driver-portal) .ride-btn.accent:not(:disabled):hover{background:linear-gradient(120deg,#ecf6cc,#e0edb5)}
 :is(.ride-portal,.driver-portal) .ride-btn:hover .fa-arrow-right{transform:translateX(3px)}
 .ride-portal .portal-hero .ride-btn.secondary:hover{background:#ffffff12;border-color:#c9dec880}
 .ride-portal .ride-nav a:hover,.driver-portal .driver-desktop-nav a:hover{background:#eff5e9;color:#294f33}
 .ride-portal .portal-quick-action:hover,.ride-portal .ride-action-card:hover{transform:translateY(-4px);box-shadow:var(--surface-shadow-hover);border-color:#bdcfb4}
 .ride-portal .portal-quick-action:hover>i{background:#e5eed8;transform:scale(1.05)}
 :is(.ride-portal,.driver-portal) :is(.ride-profile-link,.driver-dispatch-call):hover{background:#eaf2e1;border-color:#c4d5b8}
 .ride-portal .ride-support-fab:hover{transform:translateY(-3px);box-shadow:0 15px 30px #123e3138}
 .driver-portal .driver-history-entry summary:hover{background:#f7f9f4}
}
:is(.ride-portal,.driver-portal) .ride-btn:not(:disabled):active{transform:translateY(0) scale(.98);box-shadow:0 2px 6px #173d2412}
@media(max-width:1100px){.ride-portal .ride-nav a{padding:12px 13px}.ride-portal .portal-hero-copy{padding:34px}.ride-portal .portal-hero-side{padding:22px}.ride-portal .portal-quick-action{padding:19px 14px}}
@media(max-width:820px){
 .ride-portal .portal-welcome{margin-bottom:22px}.ride-portal .portal-welcome h1{font-size:29px}.ride-portal .portal-welcome .ride-eyebrow{font-size:10px;margin-bottom:8px}
 .ride-portal .portal-hero{border-radius:24px}.ride-portal .portal-hero-copy{padding:30px 27px}.ride-portal .portal-hero h2{font-size:36px;max-width:440px}
 .ride-portal .portal-quick-actions{gap:11px;margin:21px 0 30px}.ride-portal .portal-quick-action{padding:17px 5px;border-radius:17px}
 .ride-portal .portal-hero-side.website-hero-media{height:220px}.ride-portal .portal-grid>.ride-card{padding:24px}.ride-portal .portal-section-title h2{font-size:22px}
}
@media(max-width:520px){
 .ride-portal .portal-welcome h1{font-size:27px;line-height:1.22}.ride-portal .portal-welcome p{font-size:14px}
 .ride-portal .portal-hero-copy{padding:27px 23px}.ride-portal .portal-hero h2{font-size:33px;margin:18px 0 15px}.ride-portal .portal-hero .ride-eyebrow{font-size:9px;padding:6px 9px}
 .ride-portal .portal-hero p{font-size:14px;line-height:1.75}.ride-portal .portal-hero-actions .ride-btn{padding:12px 15px;min-height:47px}
 .ride-portal .portal-quick-action>i{width:41px;height:41px;border-radius:13px}.ride-portal .portal-quick-action strong{font-size:11px}.ride-portal .portal-quick-actions{gap:9px}
 .ride-portal .portal-grid>.ride-card{padding:24px 22px}.ride-portal .portal-support-card h2{font-size:24px}.ride-portal .portal-plan-price{font-size:36px}
}
@media(prefers-reduced-motion:reduce){
 :is(.ride-portal,.driver-portal) *,:is(.ride-portal,.driver-portal) *:before,:is(.ride-portal,.driver-portal) *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 :is(.ride-portal,.driver-portal) .ride-btn:hover,.ride-portal .portal-quick-action:hover,.ride-portal .ride-action-card:hover,.ride-portal .ride-support-fab:hover{transform:none}
}
