/* TAXI · Pamja 3D (Stil "3D")
   A depth layer on top of styles.css + theme.css: lit surfaces, soft shadows, tactile buttons,
   metallic gold numerals, a floating glass dock. Active only while <html data-look="3d">;
   remove that attribute (switch "3D" under the clock) to get the classic look back. */

html[data-look="3d"]{
  --l-glow-a:#d8c29a33; --l-glow-b:#4f7bd629;
  --l-top:#1b222c; --l-bot:#10141a; --l-edge:#ffffff14; --l-edge-strong:#ffffff24; --l-under:#000000a6;
  --l-shadow:inset 0 1px 0 var(--l-edge),inset 0 -1px 0 #00000059,0 18px 34px -18px var(--l-under),0 3px 8px #00000052;
  --l-shadow-lift:inset 0 1px 0 var(--l-edge-strong),inset 0 -1px 0 #00000059,0 26px 44px -20px #000000c7,0 6px 14px #00000066;
  --l-key-top:#232b36; --l-key-bot:#161b22; --l-key-shadow:inset 0 1px 0 #ffffff1c,inset 0 -2px 0 #0000004d,0 6px 14px -8px #000000b3,0 1px 2px #00000080;
  --l-gold-a:#f6ead0; --l-gold-b:#d6bd8b; --l-gold-c:#ae8f57;
  --l-num-a:#f7ecd4; --l-num-b:#c9ab72;
  --l-glass:#10141ad1; --l-glass-line:#ffffff1f;
}
html[data-look="3d"][data-theme="light"]{
  --l-glow-a:#d4b47a33; --l-glow-b:#7fa6ff1f;
  --l-top:#ffffff; --l-bot:#f6f2ea; --l-edge:#ffffff; --l-edge-strong:#ffffff; --l-under:#4a3b1f40;
  --l-shadow:inset 0 1px 0 #ffffff,inset 0 -1px 0 #0000000d,0 18px 32px -20px var(--l-under),0 2px 6px #4a3b1f1a;
  --l-shadow-lift:inset 0 1px 0 #ffffff,inset 0 -1px 0 #0000000d,0 26px 44px -22px #4a3b1f59,0 6px 14px #4a3b1f24;
  --l-key-top:#ffffff; --l-key-bot:#f0ebe2; --l-key-shadow:inset 0 1px 0 #ffffff,inset 0 -2px 0 #0000000f,0 6px 14px -8px #4a3b1f4d,0 1px 2px #4a3b1f26;
  --l-num-a:#a8854a; --l-num-b:#6e5226;
  --l-glass:#ffffffd9; --l-glass-line:#00000014;
}

/* ambient light behind everything */
html[data-look="3d"] body::before{content:"";position:fixed;inset:-20vmax;z-index:-1;pointer-events:none;
  background:radial-gradient(40vmax 32vmax at 88% 6%,var(--l-glow-a),transparent 70%),radial-gradient(42vmax 36vmax at 0% 100%,var(--l-glow-b),transparent 70%)}
html[data-look="3d"] body{isolation:isolate}

/* header + brand */
html[data-look="3d"] .app-header{background:var(--l-glass);-webkit-backdrop-filter:saturate(1.5) blur(14px);backdrop-filter:saturate(1.5) blur(14px);border-bottom:1px solid var(--l-glass-line);box-shadow:0 8px 24px -18px var(--l-under)}
html[data-look="3d"] .taxi-wordmark{background:linear-gradient(180deg,#ffffff,#c9ced6);-webkit-background-clip:text;background-clip:text;color:transparent!important;filter:drop-shadow(0 2px 3px #0009)}
html[data-look="3d"][data-theme="light"] .taxi-wordmark{background-image:linear-gradient(180deg,#2b3038,#05070a);filter:drop-shadow(0 1px 0 #fff) drop-shadow(0 2px 3px #0000002e)}

html[data-look="3d"] #language{box-shadow:var(--l-key-shadow);border-color:var(--l-glass-line)}

/* metallic numerals */
html[data-look="3d"] .dashboard-time time,html[data-look="3d"] .ride-time,html[data-look="3d"] .next-time{
  background:linear-gradient(180deg,var(--l-num-a) 15%,var(--l-num-b) 85%);-webkit-background-clip:text;background-clip:text;color:transparent!important;
  filter:drop-shadow(0 2px 2px #00000066)}
html[data-look="3d"][data-theme="light"] .dashboard-time time,html[data-look="3d"][data-theme="light"] .ride-time,html[data-look="3d"][data-theme="light"] .next-time{filter:drop-shadow(0 1px 0 #ffffff) drop-shadow(0 2px 2px #4a3b1f26)}

/* lit surfaces */
html[data-look="3d"] .ride,html[data-look="3d"] .panel,html[data-look="3d"] .stat-card,html[data-look="3d"] .request-card,
html[data-look="3d"] .driver-card,html[data-look="3d"] .login-card,html[data-look="3d"] .next-card,html[data-look="3d"] .invoice-card,
html[data-look="3d"] .annual-folder,html[data-look="3d"] .flight-result,html[data-look="3d"] .finance-summary>*{
  background:linear-gradient(180deg,var(--l-top),var(--l-bot));border-color:var(--l-glass-line);box-shadow:var(--l-shadow);border-radius:20px}
html[data-look="3d"] .ride{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
@media(hover:hover) and (pointer:fine){
  html[data-look="3d"] .ride:hover,html[data-look="3d"] .stat-card:hover,html[data-look="3d"] .driver-card:hover{transform:translateY(-3px);box-shadow:var(--l-shadow-lift)}
}
html[data-look="3d"] .ride:active{transform:scale(.993)}

/* hero card: glass with a gold-lit edge, tilts towards the pointer (look.js) */
html[data-look="3d"] #nextRideHero .featured-ride{
  border:1px solid transparent;border-radius:24px;
  background:radial-gradient(120% 90% at 100% 0%,var(--l-glow-a),transparent 55%) padding-box,linear-gradient(180deg,var(--l-top),var(--l-bot)) padding-box,
    linear-gradient(145deg,#e2cb9b99,#ffffff1a 35%,#00000033 70%,#d8c29a55) border-box;
  box-shadow:var(--l-shadow-lift),0 0 0 1px #00000014;transform:perspective(900px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;
  position:relative;overflow:hidden}
/* glass reflection */
html[data-look="3d"] #nextRideHero .featured-ride::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,transparent 28%,#ffffff14 42%,transparent 56%),linear-gradient(180deg,#ffffff0d,transparent 30%)}
html[data-look="3d"][data-theme="light"] #nextRideHero .featured-ride::before{background:linear-gradient(115deg,transparent 28%,#ffffff99 42%,transparent 56%)}
html[data-look="3d"][data-theme="light"] #nextRideHero .featured-ride{
  background:radial-gradient(120% 90% at 100% 0%,#e9d6ad66,transparent 55%) padding-box,linear-gradient(180deg,#ffffff,#f7f3ec) padding-box,
    linear-gradient(145deg,#c8a76a,#ffffff 35%,#e3dccd 70%,#c8a76a99) border-box}

/* tactile keys */
html[data-look="3d"] .secondary,html[data-look="3d"] .linkbtn.secondary,html[data-look="3d"] .travel-shortcuts>button,html[data-look="3d"] .icon-button{
  background:linear-gradient(180deg,var(--l-key-top),var(--l-key-bot));border-color:var(--l-glass-line);box-shadow:var(--l-key-shadow);transition:transform .12s,box-shadow .12s,filter .12s}
html[data-look="3d"] .primary,html[data-look="3d"] .login-submit,html[data-look="3d"] button[type="submit"]:not(.secondary):not(.text-button):not(.danger){
  background:linear-gradient(180deg,var(--l-gold-a) 0%,var(--l-gold-b) 55%,var(--l-gold-c) 100%);color:#1a150d;border-color:#00000026;
  box-shadow:inset 0 1px 0 #ffffffb3,inset 0 -2px 0 #00000026,0 8px 18px -8px #ae8f57b3,0 1px 2px #00000059;text-shadow:0 1px 0 #ffffff66;transition:transform .12s,box-shadow .12s}
html[data-look="3d"] .trip-workflow .workflow-primary{background:linear-gradient(180deg,#ffffff,#e6e2d8);color:#0b0c0e;border-color:#00000026;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #0000001f,0 10px 22px -10px #000000b3,0 2px 4px #00000066}
html[data-look="3d"][data-theme="light"] .trip-workflow .workflow-primary{background:linear-gradient(180deg,#2c323b,#0f1216);color:#fff;border-color:#000;box-shadow:inset 0 1px 0 #ffffff33,inset 0 -2px 0 #00000080,0 10px 22px -10px #0f1216b3,0 2px 4px #0f121666}
html[data-look="3d"] .trip-workflow .cancelRideBtn{box-shadow:var(--l-key-shadow)}
html[data-look="3d"] :is(.secondary,.primary,.login-submit,.travel-shortcuts>button,.icon-button,.workflow-primary,button[type="submit"]):active:not(:disabled){transform:translateY(1px);filter:brightness(.97);box-shadow:inset 0 1px 2px #00000040,0 1px 2px #00000040}

/* chips, pills, tokens */
html[data-look="3d"] .status-pill{box-shadow:inset 0 1px 0 #ffffff26,0 1px 2px #00000040}
html[data-look="3d"] .journey-letter{background:linear-gradient(180deg,var(--l-key-top),var(--l-key-bot));box-shadow:var(--l-key-shadow)}
html[data-look="3d"] .journey-letter.is-current{background:linear-gradient(180deg,var(--l-gold-a),var(--l-gold-c));color:#1a150d}
html[data-look="3d"] .filter-chips{border-radius:14px;box-shadow:inset 0 2px 4px #00000040,inset 0 -1px 0 var(--l-edge)}
html[data-look="3d"] .chip.selected{background:linear-gradient(180deg,var(--l-key-top),var(--l-key-bot));box-shadow:var(--l-key-shadow)}
html[data-look="3d"] .stat-card>svg{padding:7px;width:37px;height:37px;border-radius:12px;background:linear-gradient(180deg,var(--l-key-top),var(--l-key-bot));box-shadow:var(--l-key-shadow)}
html[data-look="3d"] input,html[data-look="3d"] select,html[data-look="3d"] textarea{box-shadow:inset 0 2px 4px #00000033,inset 0 -1px 0 var(--l-edge)}
html[data-look="3d"][data-theme="light"] input,html[data-look="3d"][data-theme="light"] select,html[data-look="3d"][data-theme="light"] textarea{box-shadow:inset 0 2px 3px #4a3b1f14,inset 0 -1px 0 #fff}
html[data-look="3d"] .theme-switch{box-shadow:inset 0 2px 4px #00000040,inset 0 -1px 0 var(--l-edge)}
html[data-look="3d"] .theme-switch button[aria-pressed="true"]{background:linear-gradient(180deg,var(--l-gold-a),var(--l-gold-c))!important;color:#1a150d!important;box-shadow:inset 0 1px 0 #ffffffb3,0 2px 6px #00000059}
html[data-look="3d"] .ride-name .sign-hint,html[data-look="3d"] .wait-chip:not(.is-running){background:linear-gradient(180deg,var(--l-key-top),var(--l-key-bot));box-shadow:var(--l-key-shadow)}

/* dialogs: lifted glass sheets with a grab handle on phones */
html[data-look="3d"] dialog.sheet{background:linear-gradient(180deg,var(--l-top),var(--l-bot));border-color:var(--l-glass-line);box-shadow:inset 0 1px 0 var(--l-edge-strong),0 -20px 60px -20px #000000b3}
@media(max-width:700px){html[data-look="3d"] dialog.sheet::before{content:"";display:block;width:42px;height:5px;margin:-12px auto 12px;border-radius:3px;background:var(--l-glass-line)}}

/* floating glass dock (phones / tablets) */
@media(max-width:1100px){
  html[data-look="3d"] .main-nav{margin:0 10px calc(8px + env(safe-area-inset-bottom,0px));padding:6px;border-radius:24px;border:1px solid var(--l-glass-line);
    background:var(--l-glass);-webkit-backdrop-filter:saturate(1.6) blur(18px);backdrop-filter:saturate(1.6) blur(18px);box-shadow:inset 0 1px 0 var(--l-edge),0 18px 36px -14px #000000b3,0 4px 10px #00000052}
  html[data-look="3d"][data-theme="light"] .main-nav{box-shadow:inset 0 1px 0 #fff,0 18px 36px -16px #4a3b1f59,0 4px 10px #4a3b1f1f}
  html[data-look="3d"] .main-nav button{border-radius:18px;min-height:50px}
}
html[data-look="3d"] .main-nav button[aria-current="page"]{background:linear-gradient(180deg,var(--l-key-top),var(--l-key-bot));box-shadow:var(--l-key-shadow);color:var(--gold)}
html[data-look="3d"] .main-nav button[aria-current="page"] svg{filter:drop-shadow(0 0 6px #d8c29a66)}

/* the 3D switch next to day/night */
.theme-switch .look-sep{width:1px;align-self:stretch;margin:4px 2px;background:var(--line)}
html body .theme-switch button.look-toggle{width:auto;padding:0 9px;font:800 11px/1 Inter,ui-sans-serif,-apple-system,"Segoe UI",sans-serif;letter-spacing:.04em}

@media(prefers-reduced-motion:reduce){
  html[data-look="3d"] .ride,html[data-look="3d"] #nextRideHero .featured-ride{transition:none;transform:none!important}
}