/* ===========================================================================
   iRent Car Rental — "Premium / Sleek" theme overlay  (Miami-sunset coral)
   Loaded via nginx after the app's own CSS, so it overrides the stock BookCars
   Material-UI look without touching the app build. Durable across redeploys.
   v1 — 2026-08
   ========================================================================= */

:root{
  --irent-coral:#ff5a3c;
  --irent-coral-2:#ff9d2f;
  --irent-grad:linear-gradient(135deg,#ff6a3d 0%,#ff9d2f 100%);
  --irent-grad-hover:linear-gradient(135deg,#f5512f 0%,#ff8f18 100%);
  --irent-ink:#151a23;
  --irent-muted:#5b6675;
  --irent-line:#e9ecf1;
  --irent-card-radius:16px;
  --irent-shadow-sm:0 4px 14px -6px rgba(21,26,35,.18);
  --irent-shadow:0 14px 40px -16px rgba(21,26,35,.28);
  --irent-shadow-lg:0 26px 70px -24px rgba(15,18,28,.55);
}

/* ---------- Typography: crisp modern system stack ---------- */
body,button,input,select,textarea,
.MuiTypography-root,.MuiButton-root,.MuiInputBase-root,.MuiChip-root{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,
    "Helvetica Neue",Arial,"Apple Color Emoji","Segoe UI Emoji",sans-serif!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body{color:var(--irent-ink);}
::selection{background:var(--irent-coral);color:#fff;}

/* Headings a touch tighter + heavier for a premium feel */
.MuiTypography-h1,.MuiTypography-h2,.MuiTypography-h3,
.MuiTypography-h4,.MuiTypography-h5,.MuiTypography-h6{
  letter-spacing:-.01em;font-weight:700;color:var(--irent-ink);
}

/* ---------- Buttons: coral gradient, rounded, no shouting caps ---------- */
.MuiButton-root{
  text-transform:none!important;
  font-weight:600!important;
  border-radius:12px!important;
  letter-spacing:.01em!important;
  box-shadow:none;
  transition:transform .15s ease,box-shadow .2s ease,background .2s ease,filter .2s ease;
}
.MuiButton-sizeLarge{padding:11px 26px!important;font-size:1rem!important;}
.MuiButton-containedPrimary,
.MuiButton-contained.MuiButton-colorPrimary,
.btn-primary,button.btn-primary{
  background:var(--irent-grad)!important;
  color:#fff!important;
  box-shadow:0 10px 24px -10px rgba(255,90,60,.65)!important;
  border:0!important;
}
.MuiButton-containedPrimary:hover,
.MuiButton-contained.MuiButton-colorPrimary:hover,
.btn-primary:hover{
  background:var(--irent-grad-hover)!important;
  box-shadow:0 16px 30px -12px rgba(255,90,60,.7)!important;
  transform:translateY(-1px);
}
.MuiButton-outlinedPrimary,.MuiButton-textPrimary{color:var(--irent-coral)!important;}
.MuiButton-outlinedPrimary{border-color:rgba(255,90,60,.5)!important;}
.MuiButton-outlinedPrimary:hover{
  border-color:var(--irent-coral)!important;background:rgba(255,90,60,.06)!important;
}

/* MUI "primary" accents used around the app (progress, checks, switches) */
.MuiCircularProgress-colorPrimary,.MuiCheckbox-colorPrimary.Mui-checked,
.MuiRadio-colorPrimary.Mui-checked{color:var(--irent-coral)!important;}
.MuiSwitch-colorPrimary.Mui-checked{color:var(--irent-coral)!important;}
.MuiSwitch-colorPrimary.Mui-checked+.MuiSwitch-track{background-color:var(--irent-coral)!important;}

/* Focus / active field colour → coral (was MUI blue) */
.MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{
  border-color:var(--irent-coral)!important;border-width:1.5px!important;
}
.MuiInputLabel-root.Mui-focused{color:var(--irent-coral)!important;}
.MuiOutlinedInput-root{border-radius:12px!important;}

/* ---------- Cards / surfaces: rounder, softer shadows ---------- */
.MuiPaper-rounded{border-radius:var(--irent-card-radius)!important;}
.MuiCard-root{border-radius:var(--irent-card-radius)!important;overflow:hidden;}
.MuiPaper-elevation1{box-shadow:var(--irent-shadow-sm)!important;}
.MuiPaper-elevation2,.MuiPaper-elevation3{box-shadow:var(--irent-shadow)!important;}
.MuiChip-root{border-radius:9px!important;font-weight:500!important;}
.MuiDialog-paper{border-radius:18px!important;}

/* Car result cards (BookCars) — best-effort, harmless if class absent */
.car,.car-container,.supplier{border-radius:var(--irent-card-radius)!important;}
.car{box-shadow:var(--irent-shadow-sm)!important;transition:transform .18s ease,box-shadow .2s ease;}
.car:hover{transform:translateY(-3px);box-shadow:var(--irent-shadow)!important;}

/* ===========================================================================
   HOMEPAGE HERO — premium dark cover + warm coral accent
   ========================================================================= */

/* Deepen the overlay to a rich near-black (was a flat blue wash) */
div.home div.home-content:after{
  background:linear-gradient(180deg,rgba(14,17,26,.45) 0%,rgba(14,17,26,.72) 55%,rgba(14,17,26,.88) 100%)!important;
}

/* Big headline: crisp white, tighter, subtle depth */
div.home div.home-cover{
  letter-spacing:-.02em!important;
  text-shadow:0 2px 24px rgba(0,0,0,.35);
}

/* Tagline: warm Miami-sunset coral, refined */
div.home div.home-title{
  color:#ff8a5c!important;
  font-weight:600!important;
  letter-spacing:.01em!important;
}

/* Search box: floating premium card */
div.home div.search div.home-search{
  border-radius:18px!important;
  box-shadow:var(--irent-shadow-lg)!important;
  padding:24px!important;
  border:1px solid rgba(255,255,255,.6);
}

/* ---------- Section titles: dark ink + centered coral underline ---------- */
.home .title{
  font-weight:800!important;
  letter-spacing:-.01em!important;
  color:var(--irent-ink)!important;
}
.home .title:after{
  content:"";display:block;width:56px;height:4px;border-radius:3px;
  background:var(--irent-grad);margin:14px auto 0;
}

/* "Why" / services icons pick up the accent tint */
.home .why-icon-wrapper,.home .services-icon-wrapper{color:var(--irent-coral);}

/* ---------- Links inside content areas ---------- */
.home a:not(.MuiButton-root),
.MuiContainer-root a:not(.MuiButton-root):not(.MuiIconButton-root){
  color:var(--irent-coral);text-decoration-color:rgba(255,90,60,.35);
}

/* ---------- Small niceties ---------- */
html{scroll-behavior:smooth;}
img{image-rendering:auto;}
:focus-visible{outline:2px solid var(--irent-coral);outline-offset:2px;}

/* ===========================================================================
   PARTNERS — logo wall (upgraded from ✓+name to real brand marks)
   Works with /partner-logos.js which swaps each badge to logo + caption.
   ========================================================================= */
section.partners{padding:56px 20px;}
section.partners h2{
  color:var(--irent-ink)!important;font-weight:800!important;
  letter-spacing:-.015em;font-size:1.8em!important;
}
section.partners .partners-intro{color:var(--irent-muted)!important;font-size:1.02em;}
section.partners .partners-grid{
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr))!important;gap:16px!important;
}
section.partners .partner-badge{
  flex-direction:column!important;gap:12px!important;padding:20px 14px!important;
  border:1px solid var(--irent-line)!important;border-radius:16px!important;background:#fff!important;
  box-shadow:var(--irent-shadow-sm)!important;
}
section.partners .partner-badge:hover{
  transform:translateY(-4px)!important;box-shadow:var(--irent-shadow)!important;
  border-color:rgba(255,90,60,.35)!important;
}
section.partners .partner-badge .pl-badge{
  display:flex;align-items:center;justify-content:center;
  width:60px;height:60px;border-radius:16px;background:#f4f6fa;overflow:hidden;flex-shrink:0;
}
section.partners .partner-badge img.partner-logo{
  width:44px;height:44px;object-fit:contain;display:block;
}
section.partners .partner-badge .pl-badge.pl-fallback{
  background:var(--irent-grad);color:#fff;font-weight:800;font-size:1.25rem;letter-spacing:.02em;
}
section.partners .partner-badge .pl-badge.pl-fallback::before{content:attr(data-ini);}
section.partners .partner-badge .partner-badge-name{
  font-size:.9rem!important;font-weight:600!important;color:var(--irent-ink)!important;text-align:center;line-height:1.25;
}
section.partners .partners-note{color:var(--irent-muted)!important;}

/* Hide the heavy hero video on phones — show the cover image instead (perf) */
@media (max-width:900px){
  div.home video, div.home-content video{display:none!important;}
}
