/*
Theme Name: Chic Lite Child — Top Auto Balear
Theme URI: https://www.topautobalear.com/
Description: Bright & friendly local re-skin of Chic Lite. CSS-only: same structure, same content, same booking form — new look. Brand #2282bd with a warm sun accent.
Author: Top Auto Balear
Template: chic-lite
Version: 1.0.0
*/

/* =========================================================
   0 · DESIGN TOKENS
   Swap the font vars for self-hosted Figtree/Bricolage later
   if you want; defaults below need no webfont.
   ========================================================= */
:root{
  --sea:#2282bd;          /* brand primary */
  --sea-dark:#1b6ea0;
  --sea-deep:#0e3a55;     /* headings / footer */
  --sun:#ffb22e;          /* warm accent (restraint) */
  --sun-deep:#f59300;
  --sky:#eaf6fd;          /* pale section wash */
  --sand:#fff4e3;         /* warm section wash */
  --ink:#16323f;          /* body text */
  --muted:#5d7682;
  --line:#e3edf2;
  --radius:18px;
  --radius-sm:12px;
  --radius-pill:999px;
  --shadow-sm:0 2px 10px rgba(14,58,84,.07);
  --shadow:0 18px 50px -18px rgba(14,58,84,.28);
  --font-body:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-display:var(--font-body);
}

/* =========================================================
   1 · BASE & TYPOGRAPHY
   ========================================================= */
body{
  font-family:var(--font-body);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.vrc-main-title,.page-title{
  font-family:var(--font-display);
  color:var(--sea-deep);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:1.12;
}
.page-title{ font-size:clamp(2rem,4.4vw,3rem); }
.entry-content h2{ font-size:clamp(1.6rem,3.2vw,2.3rem); margin:.2em 0 .5em; }
.entry-content h3{ font-size:clamp(1.2rem,2.4vw,1.5rem); }
a{ color:var(--sea); }
a:hover{ color:var(--sun-deep); }

/* keyboard focus everywhere */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
.wp-block-button__link:focus-visible,.vrcsfentrysubmit input:focus-visible{
  outline:3px solid var(--sun); outline-offset:2px;
}

/* =========================================================
   2 · HEADER  (.site-header.style-two)
   ========================================================= */
.site-header.style-two{
  position:sticky; top:0; z-index:40;
  background:rgba(255,255,255,.9);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  box-shadow:0 1px 0 rgba(14,58,84,.02);
}
.site-header .header-mid{ padding-block:10px; }
.site-header .header-bottom{ border:0; }

/* primary nav */
#primary-menu > li > a{
  font-family:var(--font-display);
  font-weight:600;
  color:var(--sea-deep);
  position:relative;
  transition:color .15s ease;
}
#primary-menu > li > a:hover,
#primary-menu > li.current-menu-item > a{ color:var(--sea); }
#primary-menu > li > a::after{
  content:""; position:absolute; left:0; right:100%; bottom:-4px;
  height:2px; background:var(--sun); transition:right .2s ease;
}
#primary-menu > li > a:hover::after,
#primary-menu > li.current-menu-item > a::after{ right:0; }

/* social icons in header */
.header-social .social-networks a{
  width:38px; height:38px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--sky); color:var(--sea);
  transition:transform .15s ease,background .15s ease,color .15s ease;
}
.header-social .social-networks a:hover{
  background:var(--sea); color:#fff; transform:translateY(-2px);
}

/* language switcher flags -> tidy row */
.lang-item{ display:inline-flex; align-items:center; }
.lang-item img{ border-radius:4px; box-shadow:var(--shadow-sm); }

/* =========================================================
   3 · CONTENT RHYTHM + CARD CONTAINERS
   ========================================================= */
#content.site-content{ background:linear-gradient(180deg,#f7fbff 0%, #ffffff 240px); }
.entry-content{ font-size:1.05rem; }
.entry-content > *{ margin-block:0; }
.entry-content > .wp-block-group{ margin-block:34px; }

/* your existing white card pattern, modernised */
.rounded-container-white{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow-sm);
  padding:clamp(22px,4vw,42px) !important;
  transition:box-shadow .2s ease;
}
.rounded-container-white:hover{ box-shadow:var(--shadow); }

/* images get soft rounding */
.entry-content .wp-block-image img,
.entry-content figure img{
  border-radius:var(--radius-sm);
}

/* gutenberg buttons -> friendly pills */
.entry-content .wp-block-button__link,
.entry-content .wp-element-button{
  background:var(--sun) !important;
  color:#3a2600 !important;
  font-family:var(--font-display);
  font-weight:700;
  border:0 !important;
  border-radius:var(--radius-pill) !important;
  padding:.8em 1.6em !important;
  box-shadow:0 10px 24px -12px rgba(245,147,0,.8);
  transition:transform .15s ease,background .15s ease,color .15s ease;
}
.entry-content .wp-block-button__link:hover,
.entry-content .wp-element-button:hover{
  background:var(--sun-deep) !important; color:#fff !important;
  transform:translateY(-2px);
}
.entry-content .wp-block-button.is-style-outline .wp-block-button__link{
  background:#fff !important; color:var(--sea-deep) !important;
  border:1.5px solid var(--line) !important; box-shadow:none;
}

/* =========================================================
   4 · BOOKING FORM  (VikRentCar search module — CSS only)
   ========================================================= */

/* Card wrapper */
.wrap.plugin-container{
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:clamp(18px,3vw,30px) !important;
}
.vrc-main-title{
  font-size:1.3rem; margin:0 0 18px; color:var(--sea-deep);
}

/* -----------------------------------------------------------
   LOCATIONS ROW: two selects side by side, each 50%
   ----------------------------------------------------------- */
.vrc-searchf-section-locations{
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:12px;
  width:100%;
}
.vrc-searchf-section-locations .vrcsfentrycont{
  flex:none !important;
  margin:0 !important;
  min-width:0;
}

/* -----------------------------------------------------------
   DATETIMES ROW: 2-column grid, each cell = date + time
   Pickup left, dropoff right. No wrapping label break.
   ----------------------------------------------------------- */
.vrc-searchf-section-datetimes{
  display:grid !important;
  grid-template-columns:1fr 1fr;
  gap:12px;
  width:100%;
  margin-top:12px;
}
/* each pickup/dropoff block stacks label→date→time vertically */
.vrcdivsearch .vrc-searchf-section-datetimes .vrcsfentrycont{
  display:flex !important;
  flex-direction:column !important;
  flex-wrap:nowrap !important;
  gap:6px;
  flex:none !important;
  margin:0 !important;
  min-width:0;
}
/* label above date+time */
.vrcdivsearch .vrc-searchf-section-datetimes .vrcsfentrycont .vrcsfentrylabsel{
  margin-right:0 !important;
  flex:none !important;
}
.vrcdivsearch .vrc-searchf-section-datetimes .vrcsfentrycont .vrcsfentrytime{
  flex:none !important;
}
/* date field: full width, sensible height */
.vrcdivsearch .vrcsfentrylabsel .vrcsfentrydate{
  border:1.5px solid var(--line) !important;
  border-radius:var(--radius-sm) !important;
  background:#fbfdff !important;
  padding:0 10px !important;
  height:40px !important;
  display:flex !important;
  align-items:center !important;
  width:100% !important;
  box-sizing:border-box;
}
.vrcsfentrycont .vrcsfentrydate .hasDatepicker{
  height:36px !important;
  font-size:.95rem !important;
  color:var(--sea-deep) !important;
  flex:1 !important;
  min-width:0;
}
.vrcdivsearch .vrcsfentrylabsel .vrcsfentrydate i{
  margin-top:0 !important;
  color:var(--sea);
}
/* time selects row */
.vrcdivsearch .vrcsfentrycont .vrc-sf-time-container{
  display:flex !important;
  align-items:center;
  gap:4px;
  width:100%;
}
.vrcdivsearch .vrcsfentrycont .vrc-sf-time-container span:not(.vrctimesep){
  flex:1 !important;
}
.vrcdivsearch .vrcsfentrycont .vrc-sf-time-container span:not(.vrctimesep) select{
  width:100% !important;
}

/* -----------------------------------------------------------
   SHARED: consistent inputs/selects
   ----------------------------------------------------------- */
.vrcdivsearch .vrcsfentrycont select,
.vrcsfentryselect select,
.vrcsfentrycont #vrccomselph select,
.vrcsfentrycont #vrccomselpm select,
.vrcsfentrycont #vrccomseldh select,
.vrcsfentrycont #vrccomseldm select{
  border:1.5px solid var(--line) !important;
  border-radius:var(--radius-sm) !important;
  background:#fbfdff !important;
  color:var(--sea-deep) !important;
  font-family:var(--font-body) !important;
  font-size:.93rem !important;
  height:40px !important;
  padding:0 .7em !important;
}
.vrcdivsearch .vrcsfentrycont select:focus,
.vrcsfentryselect select:focus{
  border-color:var(--sea) !important;
  box-shadow:0 0 0 3px rgba(34,130,189,.15) !important;
  outline:none !important;
}
/* labels */
.vrcdivsearch .vrcsfentrycont label,
.vrcsfentrylabsel label,
.vrcsfentrytime > label{
  display:block !important;
  font-weight:700 !important;
  color:var(--muted) !important;
  text-transform:uppercase !important;
  letter-spacing:.06em !important;
  font-size:.74rem !important;
  margin-bottom:4px !important;
}

/* -----------------------------------------------------------
   SUBMIT ROW
   ----------------------------------------------------------- */
.vrc-searchf-section-sbmt{
  margin-top:14px !important;
  display:block !important;
}
.vrc-searchf-section-sbmt .vrcsfentrycont{
  margin:0 !important;
}
.vrcsfentrysubmit input,
.vrcsfentrysubmit button{
  background:var(--sea) !important;
  color:#fff !important;
  border:0 !important;
  border-radius:var(--radius-pill) !important;
  font-family:var(--font-display) !important;
  font-weight:700 !important;
  font-size:1rem !important;
  padding:.85em 2em !important;
  width:100% !important;
  cursor:pointer;
  box-shadow:0 12px 26px -14px rgba(34,130,189,.9);
  transition:transform .15s ease,background .15s ease;
}
.vrcsfentrysubmit input:hover,
.vrcsfentrysubmit button:hover{
  background:var(--sea-dark) !important;
  transform:translateY(-2px);
}

/* -----------------------------------------------------------
   RESPONSIVE: stack to single column below 600px
   ----------------------------------------------------------- */
@media(max-width:600px){
  .vrc-searchf-section-locations,
  .vrc-searchf-section-datetimes{
    grid-template-columns:1fr !important;
  }
}

/* =========================================================
   5 · REVIEW WIDGETS  (light touch only — third-party markup)
   ========================================================= */
.trustpilot-widget,
.ti-widget{ margin-block:8px; }

/* =========================================================
   6 · FOOTER  (.site-footer)
   ========================================================= */
.site-footer{
  background:var(--sea-deep);
  color:#cfe0ea;
}
.site-footer .footer-t{ padding-block:48px; }
.site-footer h1,.site-footer h2,.site-footer h3,.site-footer h4,
.site-footer .widget-title{ color:#fff; }
.site-footer a{ color:#cfe0ea; }
.site-footer a:hover{ color:var(--sun); }
.site-footer .grid.column-3{ gap:32px; }

/* =========================================================
   7 · MOTION PREFERENCES
   ========================================================= */
@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; }
}