/* ============================================================
   tb_city / city.css — restyling "Visual ciudad" 2026
   Se carga DESPUES de common.css: sobreescribe el look antiguo
   sin tocar la rejilla Bootstrap 2 ni el markup de modulos.
   Colores por instancia via :root (inyectado en index.php):
   --tbc-accent, --tbc-accent-ink, --tbc-dark
   ============================================================ */

:root {
  --tbc-paper: #faf8f4;
  --tbc-ink: #1c2430;
  --tbc-muted: #6b7280;
  --tbc-line: #e6e0d4;
}

/* ---------- Base ---------- */
body {
  background: #f2efe9 !important;
  font-family: 'Inter', system-ui, Arial, sans-serif !important;
  color: var(--tbc-ink);
  font-size: 14.5px;
  line-height: 1.55;
}
h1, h2, h3, h4, h5, h6 {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--tbc-ink) !important;
  text-transform: none !important;
  font-weight: 800 !important;
  letter-spacing: -.2px;
}
a:link, a:visited, a:active { color: var(--tbc-ink); }
a:hover { color: var(--tbc-ink); text-decoration: underline; }

.tbc-wrap { max-width: 1120px; margin: 0 auto; padding: 0 20px; position: relative; }

/* ---------- Topbar ---------- */
.tbc-topbar { background: var(--tbc-dark); color: #d7d7d7; font-size: 12.5px; }
.tbc-topbar .tbc-wrap { display: flex; justify-content: space-between; align-items: center; min-height: 34px; flex-wrap: wrap; }
.tbc-topbar a { color: #d7d7d7 !important; text-decoration: none; margin-left: 12px; }
.tbc-topbar a:hover { color: #fff !important; }
.tbc-topbar b { color: #fff; }
.tbc-topmenu ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; }
.tbc-topmenu li { display: inline-block; margin: 0; }

/* ---------- Header ---------- */
.tbc-hdr { background: #fff; border-bottom: 1px solid var(--tbc-line); }
.tbc-hdr .tbc-wrap { display: flex; align-items: center; justify-content: space-between; min-height: 74px; flex-wrap: wrap; }
.tbc-logo img { max-height: 52px; width: auto; }
.tbc-hdr-right { text-align: right; font-size: 13px; color: var(--tbc-muted); }
.tbc-phone span, .tbc-phone { font-size: 15px; font-weight: 700; color: var(--tbc-ink) !important; }
/* los modulos del sandbox/instancias meten h1/h2 en la cabecera: domesticarlos */
.tbc-hdr-right h1, .tbc-hdr-right h2, .tbc-hdr-right h3,
.tbc-phone h1, .tbc-phone h2, .tbc-phone h3 {
  font-size: 15px !important; font-weight: 700 !important; margin: 0 !important;
  color: var(--tbc-ink) !important; line-height: 1.3 !important;
}
.tbc-logo h1, .tbc-logo h2 { font-size: 18px !important; margin: 0 !important; }
.tbc-partnerlogo { max-height: 44px; }
.tbc-welcome { font-size: 12px; color: var(--tbc-muted); display: block; }

/* ---------- Nav ---------- */
.tbc-nav { background: #fff; border-bottom: 1px solid var(--tbc-line); }
.tbc-nav .tbc-wrap { display: flex; align-items: center; gap: 8px; min-height: 48px; }
.tbc-burger { display: none; font-size: 22px; text-decoration: none; padding: 6px 10px; }
.tbc-menu { flex: 1; overflow-x: auto; }
.tbc-menu ul.nav, .tbc-menu ul.menu, .tbc-menu ul {
  list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; align-items: center;
  background: none !important; flex-wrap: nowrap;
}
.tbc-menu ul li { float: none !important; margin: 0 !important; background: none !important; position: relative; }
.tbc-menu ul li a, .tbc-menu ul li .separator {
  display: block; padding: 10px 13px; font-weight: 600; font-size: 13.5px; color: var(--tbc-ink) !important;
  text-decoration: none !important; background: none !important; border-radius: 8px; white-space: nowrap;
  text-shadow: none !important;
}
.tbc-menu ul li a:hover, .tbc-menu ul li.active > a { background: var(--tbc-paper) !important; }
.tbc-menu ul li.active > a { box-shadow: inset 0 -3px 0 var(--tbc-accent); border-radius: 8px 8px 0 0; }
/* dropdowns del menu Joomla */
.tbc-menu ul ul {
  display: none; position: absolute; top: 100%; left: 0; background: #fff; min-width: 220px;
  border: 1px solid var(--tbc-line); border-radius: 10px; box-shadow: 0 10px 26px rgba(20,24,31,.12);
  padding: 6px; z-index: 500; flex-direction: column;
}
.tbc-menu ul li:hover > ul { display: flex; }
.tbc-menu ul ul li a { padding: 9px 12px; font-weight: 500; }
.tbc-bookbtn {
  background: var(--tbc-accent); color: var(--tbc-accent-ink) !important; font-weight: 800; font-size: 13.5px;
  padding: 9px 18px; border-radius: 9px; text-decoration: none !important; white-space: nowrap;
}
.tbc-bookbtn:hover { filter: brightness(1.06); }

/* ---------- Hero ---------- */
.tbc-hero {
  position: relative; color: #fff; text-align: center;
  background: linear-gradient(rgba(15,18,26,.55), rgba(15,18,26,.72)),
              radial-gradient(1100px 480px at 30% 0%, #3d5a80 0%, #293241 55%, #1a1f2b 100%);
}
.tbc-hero .tbc-wrap { padding: 58px 20px 46px; }
/* .tbc-herotitle: por clase, no por etiqueta — un script del framework
   antiguo degrada h1 duplicados a h2 y perderiamos el estilo */
.tbc-hero .tbc-herotitle, .tbc-hero h1, .tbc-hero h2 {
  color: #fff !important; font-size: 40px !important; font-weight: 900 !important;
  letter-spacing: -1px; line-height: 1.08 !important; max-width: 800px; margin: 0 auto !important;
  text-transform: none !important;
}
.tbc-hero p { color: #c9d2e0; font-size: 16px; margin: 14px auto 24px; max-width: 560px; }
.tbc-cta {
  display: inline-block; background: var(--tbc-accent); color: var(--tbc-accent-ink) !important;
  font-weight: 800; font-size: 15px; padding: 14px 32px; border-radius: 10px; text-decoration: none !important;
}
.tbc-cta:hover { filter: brightness(1.06); }
.tbc-strip { background: var(--tbc-accent); color: var(--tbc-accent-ink); font-weight: 700; font-size: 13px; padding: 10px 0; }
.tbc-strip .tbc-wrap { display: flex; gap: 30px; justify-content: center; flex-wrap: wrap; padding-top: 0; padding-bottom: 0; }

/* ---------- Contenido / componente ---------- */
.tbc-maincontainer { padding: 34px 20px 46px; }
.tbc-banner { padding-top: 20px; }

/* Modulos genericos: transparentes (NUNCA tarjeta global: hay modulos
   contenedor gigantes y overlays tipo cookies que no deben pintarse) */
.tbc-modgrid { padding-bottom: 30px; }
.moduletable h3, .moduletable-service h3 { font-size: 17px !important; margin-bottom: 10px !important; }
.tbc-modgrid { font-size: 14.5px; }
/* solo los modulos hoja marcados con sufijo -service reciben aspecto tarjeta */
.tbc-modgrid .moduletable-service {
  background: #fff; border: 1px solid var(--tbc-line); border-radius: 14px;
  padding: 20px 22px; margin-bottom: 18px;
}

/* ============================================================
   RESKIN DEL FORMULARIO DE RESERVA (com_taxibooking onepage)
   Solo forma y tipografia: los colores de fondo/boton siguen
   llegando de los settings del componente (media_onepage.css.php)
   ============================================================ */

#verticle_booking_wrap {
  border-radius: 16px !important;
  box-shadow: 0 14px 38px rgba(20,24,31,.12) !important;
  font-family: 'Inter', system-ui, sans-serif !important;
  overflow: hidden;
}
#booking_tab { border-radius: 16px !important; border: none !important; font-family: 'Inter', sans-serif !important; }
#booking_tab .ui-tabs-nav { border-radius: 0 !important; background: none !important; border: none !important; padding: 6px 6px 0 !important; }
#booking_tab .ui-tabs-nav li { border-radius: 10px 10px 0 0 !important; border: none !important; }
#booking_tab .ui-tabs-nav li a { font: 700 13px 'Inter', sans-serif !important; letter-spacing: .2px; }
#booking_tab .ui-widget-header { border: none !important; }

/* inputs y selects del onepage */
#verticle_booking_wrap input[type="text"],
#verticle_booking_wrap input[type="email"],
#verticle_booking_wrap input[type="tel"],
#verticle_booking_wrap select,
#verticle_booking_wrap textarea,
.info_inputbox input, .ver_inputbox input {
  border: 1px solid #d8d2c4 !important; border-radius: 9px !important;
  font: 400 14px 'Inter', sans-serif !important; padding: 9px 11px !important;
  box-shadow: none !important; background-image: none !important; min-width: 0;
}
#verticle_booking_wrap input:focus, #verticle_booking_wrap select:focus {
  border-color: var(--tbc-accent) !important; outline: none !important;
  box-shadow: 0 0 0 3px rgba(0,0,0,.06) !important;
}
#verticle_booking_wrap label { font: 600 11px 'Inter', sans-serif !important; letter-spacing: .5px; text-transform: uppercase; }

/* selectbox plugin (sbHolder) */
.sbHolder { border: 1px solid #d8d2c4 !important; border-radius: 9px !important; background: #fff !important; font-family: 'Inter', sans-serif !important; }
.sbSelector { font: 400 14px 'Inter', sans-serif !important; }
.sbOptions { border: 1px solid var(--tbc-line) !important; border-radius: 10px !important; box-shadow: 0 10px 26px rgba(20,24,31,.14) !important; font-family: 'Inter', sans-serif !important; }
.sbOptions li a { font-size: 13.5px !important; }
.sbOptions li a:hover { background: var(--tbc-paper) !important; }

/* boton principal del formulario */
#verticle_booking_wrap .submit, .ccms_form_element .submit, a.readon:link, a.readon:visited, a.readon:active {
  background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important;
  font: 800 15px 'Inter', sans-serif !important; text-transform: none !important;
  border: none !important; border-radius: 10px !important; padding: 12px 26px !important;
  box-shadow: none !important; text-shadow: none !important; cursor: pointer;
}
#verticle_booking_wrap .submit:hover, a.readon:hover { filter: brightness(1.06); background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important; }

/* acordeon de pasos */
.onepage_booking_accordion_slide, .acc_trigger {
  border-radius: 10px !important; font-family: 'Inter', sans-serif !important;
}

/* listado de vehiculos -> tarjetas */
#vehicle_wrapper .cars {
  background: #fff !important; border: 1px solid var(--tbc-line) !important; border-radius: 14px !important;
  margin-bottom: 14px !important; box-shadow: none !important; overflow: hidden;
}
#vehicle_wrapper .cars:hover { border-color: var(--tbc-accent) !important; box-shadow: 0 8px 22px rgba(20,24,31,.10) !important; }
#vehicle_wrapper .cars td { font-family: 'Inter', sans-serif !important; }
#vehicle_wrapper .cars .vehicle_price { font-weight: 900 !important; font-size: 20px !important; }
#vehicle_wrapper .cars .vehicle_booking .car_booking {
  background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important;
  border-radius: 10px !important; font-weight: 800 !important; border: none !important; text-shadow: none !important;
}

/* datepicker jQuery UI */
#ui-datepicker-div {
  border: 1px solid var(--tbc-line) !important; border-radius: 12px !important;
  box-shadow: 0 14px 34px rgba(20,24,31,.16) !important; font-family: 'Inter', sans-serif !important;
  background: #fff !important; padding: 10px !important;
}
#ui-datepicker-div .ui-datepicker-header { background: var(--tbc-paper) !important; border: none !important; border-radius: 8px !important; }
#ui-datepicker-div .ui-state-default { background: #fff !important; border: 1px solid transparent !important; text-align: center; border-radius: 7px !important; font-family: 'Inter', sans-serif !important; }
#ui-datepicker-div .ui-state-default:hover { border-color: var(--tbc-accent) !important; }
#ui-datepicker-div .ui-state-active { background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important; }

/* mensajes de sistema */
#system-message > dd > ul { border-radius: 10px; }

/* ---------- Footer ---------- */
.tbc-foot { background: #181b21; color: #9aa3b2; font-size: 13px; padding: 40px 0 22px; margin-top: 30px; }
.tbc-foot a, .tbc-foot a:link, .tbc-foot a:visited { color: #9aa3b2 !important; text-decoration: none; }
.tbc-foot a:hover { color: #fff !important; }
.tbc-foot h3, .tbc-foot h4, .tbc-foot h5 { color: #fff !important; font-size: 13px !important; text-transform: uppercase !important; letter-spacing: 1px; margin-bottom: 10px !important; }
.tbc-foot-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; margin-bottom: 24px; }
.tbc-foot-grid .moduletable, .tbc-foot-grid .moduletable-footerleft { background: none; border: none; padding: 0; margin: 0; color: #9aa3b2 !important; }
.tbc-foot-pay { margin: 6px 0 14px; }
.tbc-foot-legal { border-top: 1px solid #2a2f38; padding-top: 14px; font-size: 11.5px; color: #6d7686; }
.tbc-rating { padding: 10px 0; }
.tbc-seo { margin-top: 10px; font-size: 12px; color: #6d7686; }
.tbc-seo summary { cursor: pointer; font-weight: 700; color: #9aa3b2; padding: 6px 0; }
.tbc-seo a { font-size: 11.5px !important; }

/* ============================================================
   v4 — las pestanas remotas del modulo de reserva (jQuery UI
   carga por AJAX los href con URL real y incrusta la portada
   entera dentro del panel). Ocultar panel remoto y su pestana.
   ============================================================ */
#verticle_booking_wrap div[id^="ui-tabs-"] { display: none !important; }
#verticle_booking_wrap .ui-tabs-nav li:has(a[href^="/"]),
#verticle_booking_wrap .ui-tabs-nav li:has(a[href^="http"]) { display: none !important; }

/* ============================================================
   v3 — aviso de cookies (#ca_banner de mod_cookiesaccept)
   (v4: especificidad reforzada — el css del modulo carga despues)
   ============================================================ */
body div#ca_banner {
  position: fixed !important; top: auto !important; bottom: 18px !important;
  left: 18px !important; right: auto !important;
  width: 340px !important; max-width: calc(100vw - 36px) !important;
  background: #fff !important; border: 1px solid var(--tbc-line) !important;
  border-radius: 14px !important; box-shadow: 0 12px 34px rgba(0,0,0,.20) !important;
  padding: 16px 18px !important; z-index: 99997 !important;
  font: 400 12.5px/1.45 'Inter', sans-serif !important; color: var(--tbc-ink) !important;
  text-align: left !important; height: auto !important;
}
body div#ca_banner p { margin: 0 0 8px !important; font-size: 12.5px !important; color: var(--tbc-ink) !important; }
body div#ca_banner .accept {
  background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important;
  border-radius: 8px !important; font-weight: 700 !important; padding: 8px 18px !important;
  display: inline-block !important; cursor: pointer; width: auto !important; text-align: center;
}

/* ============================================================
   v3 — formulario de reserva (modulo y componente comparten ids)
   Panel blanco, inputs claros, selectbox a ancho completo
   ============================================================ */
#verticle_booking_wrap {
  background: #fff !important; border: 1px solid var(--tbc-line) !important;
  padding: 18px !important;
}
#verticle_booking_wrap ul { list-style: none !important; margin: 0 0 10px !important; padding: 0 !important; }
#verticle_booking_wrap ul li { margin: 0 !important; }
#verticle_booking_wrap ul li a { font: 700 13px 'Inter', sans-serif !important; text-decoration: none !important; }
/* inputs oscuros del pickup/destino y fechas -> claros */
#verticle_booking_wrap input[type="text"], #verticle_booking_wrap input:not([type]),
#verticle_booking_wrap .date_input input, #verticle_booking_wrap input[class*="date"], #verticle_booking_wrap input[id*="date"] {
  background: #fff !important; color: var(--tbc-ink) !important;
  border: 1px solid #d8d2c4 !important; text-shadow: none !important;
  width: 100% !important; max-width: 100% !important; box-sizing: border-box;
}
#verticle_booking_wrap input::placeholder { color: #9aa0aa !important; }
/* selectbox del plugin: ancho completo y texto visible */
#verticle_booking_wrap .sbHolder {
  width: 100% !important; max-width: 100% !important; height: 40px !important;
  box-sizing: border-box; margin-bottom: 6px !important;
}
#verticle_booking_wrap .sbSelector {
  color: var(--tbc-ink) !important; text-shadow: none !important;
  line-height: 38px !important; padding-left: 11px !important; width: 100% !important;
}
#verticle_booking_wrap .sbToggle { top: 8px !important; }
#verticle_booking_wrap label { color: var(--tbc-muted) !important; text-shadow: none !important; }
#verticle_booking_wrap .topouterWrap, #verticle_booking_wrap .seats_wrap, #verticle_booking_wrap .date_Wrap {
  background: none !important;
}
/* secciones internas sin fondos antiguos */
#verticle_booking_wrap .verticl_booking_toppart,
#verticle_booking_wrap .verticl_booking_midpart,
#verticle_booking_wrap .verticl_booking_bottompart { background: none !important; border: none !important; }

/* ============================================================
   v5 — grupos de selects del formulario en fila (pasajeros /
   equipaje / hora-minutos / fecha), etiquetas visibles, y la
   seccion "por horas" oculta si jQuery UI no la gestiona
   ============================================================ */
#verticle_booking_wrap .seats_wrap { display: flex !important; flex-wrap: wrap; gap: 8px; }
#verticle_booking_wrap .seats_wrap .seat_input_wrap { flex: 1 1 30%; min-width: 92px; float: none !important; width: auto !important; }
#verticle_booking_wrap .seat_input_wrap label { display: block !important; visibility: visible !important; height: auto !important; }
#verticle_booking_wrap .seats_wrap .sbHolder { width: 100% !important; }

#verticle_booking_wrap .date_Wrap .date_input { display: flex !important; flex-wrap: wrap; gap: 8px; align-items: center; }
#verticle_booking_wrap .date_Wrap .date_input input { flex: 2 1 46%; width: auto !important; }
#verticle_booking_wrap .date_Wrap .sbHolder { flex: 1 1 26%; width: auto !important; min-width: 72px; margin-bottom: 0 !important; }

#verticle_booking_wrap .houtly_inner, #verticle_booking_wrap .controls.hourly { display: flex !important; flex-wrap: wrap; gap: 8px; }
#verticle_booking_wrap .houtly_inner .sbHolder { flex: 1 1 40%; width: auto !important; }

/* seccion "alquiler por horas" sin registrar como pestana: ocultarla
   (si jQuery UI la gestiona, tendra .ui-tabs-panel y no se toca) */
#verticle_booking_wrap #tabs_hourly_hire:not(.ui-tabs-panel) { display: none !important; }
#verticle_booking_wrap #tabs_special_routes:not(.ui-tabs-panel) { display: none !important; }

/* ============================================================
   v6 — hero con formulario integrado (maqueta Visual ciudad)
   ============================================================ */
.tbc-hero-grid { display: block; }
.tbc-hero.tbc-hasform { text-align: left; }
.tbc-hero.tbc-hasform .tbc-hero-grid {
  display: grid; grid-template-columns: 1fr 440px; gap: 44px;
  align-items: start; padding: 46px 20px 40px;
}
.tbc-hero.tbc-hasform .tbc-herotitle, .tbc-hero.tbc-hasform h1, .tbc-hero.tbc-hasform h2 {
  margin: 0 0 14px !important; font-size: 36px !important; text-align: left;
}
.tbc-hero.tbc-hasform p { margin: 0 0 18px; max-width: none; text-align: left; }
.tbc-usps div { display: flex; gap: 10px; align-items: baseline; color: #c6cdd9; font-size: 14.5px; margin: 9px 0; }
.tbc-usps span { color: var(--tbc-accent); font-weight: 900; }
/* tarjeta del formulario en el hero */
.tbc-heroform .moduletable, .tbc-heroform .moduletable-bookonline {
  background: #fff; border-radius: 16px; box-shadow: 0 18px 44px rgba(0,0,0,.35);
  padding: 6px; width: auto !important; float: none !important; margin: 0 !important;
}
.tbc-heroform .span6 { width: auto !important; float: none !important; margin: 0 !important; }
.tbc-heroform h3 { font-size: 16px !important; padding: 12px 14px 0 !important; margin: 0 !important; }
.tbc-heroform #verticle_booking_wrap {
  border: none !important; box-shadow: none !important; padding: 12px !important;
  border-radius: 12px !important;
}
.tbc-heroform .sbHolder { height: 38px !important; }
.tbc-heroform .sbSelector { line-height: 36px !important; }

/* campos en 2 columnas dentro del formulario */
#verticle_booking_wrap .verticl_booking_midpart { display: flex !important; flex-wrap: wrap; gap: 0 12px; }
#verticle_booking_wrap .seats_wrap.left, #verticle_booking_wrap .seats_wrap.right {
  flex: 1 1 46%; display: block !important; float: none !important; width: auto !important;
}
#verticle_booking_wrap .seat_input_wrap { margin-bottom: 8px; }

/* ============================================================
   v6 — tipografia del contenido antiguo (mod_custom heredados)
   ============================================================ */
.tbc-modgrid h1, .tbc-modgrid h2 { font-size: 21px !important; margin: 26px 0 10px !important; color: var(--tbc-ink) !important; }
.tbc-modgrid h3 { font-size: 17px !important; margin: 20px 0 8px !important; }
.tbc-modgrid p, .tbc-modgrid li { color: #3d4654 !important; font-size: 14.5px; line-height: 1.65; }
.tbc-modgrid p span, .tbc-modgrid li span, .tbc-modgrid p font { color: inherit !important; }
.tbc-modgrid ul { padding-left: 18px; margin: 10px 0; }
.tbc-modgrid img { max-width: 100%; height: auto; border-radius: 10px; }
.tbc-modgrid .span6 { margin-bottom: 26px; }
#tbc-extra:empty { display: none; }

/* ============================================================
   v8 — pulido fino del formulario (detalle a detalle)
   ============================================================ */

/* 1. Inputs de recogida/destino: fuera el marco oscuro heredado
      (imagen de fondo del diseño antiguo) */
#verticle_booking_wrap .ver_inputbox, #verticle_booking_wrap .info_inputbox,
#verticle_booking_wrap .top_ver_input_wrap, #verticle_booking_wrap .topinnerWrap {
  background: none !important; border: none !important; box-shadow: none !important;
}
#verticle_booking_wrap .ver_inputbox input, #verticle_booking_wrap .info_inputbox input {
  background: #fff !important; background-image: none !important;
  border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
  height: 42px !important; padding: 0 12px !important; box-shadow: none !important;
}
#verticle_booking_wrap .ver_inputbox input:focus { border-color: var(--tbc-accent) !important; }

/* 2. selectbox: matar la flecha fantasma (sbToggle con sprite viejo)
      y poner un chevron propio */
#verticle_booking_wrap .sbHolder { position: relative; border-radius: 10px !important; }
#verticle_booking_wrap .sbToggle {
  background: none !important; width: 34px !important; height: 100% !important;
  top: 0 !important; right: 0 !important; left: auto !important;
}
#verticle_booking_wrap .sbHolder:after {
  content: '\2304'; position: absolute; right: 12px; top: 45%;
  transform: translateY(-50%); color: #9aa0aa; font-size: 16px; pointer-events: none;
  font-family: Arial, sans-serif;
}
#verticle_booking_wrap .sbSelector { padding-right: 34px !important; }

/* 3. fecha + hora + minutos en UNA fila proporcionada */
#verticle_booking_wrap .date_Wrap .date_input { display: flex !important; flex-wrap: nowrap !important; gap: 8px; align-items: center; }
#verticle_booking_wrap .date_Wrap .date_input input { flex: 0 1 50% !important; width: 50% !important; }
#verticle_booking_wrap .date_Wrap .sbHolder { flex: 1 1 23% !important; min-width: 64px; }

/* 4. currency como el resto de selects (nada de pastilla negra) */
#verticle_booking_wrap .currency_Wrap select, #verticle_booking_wrap .currency_Wrap .sbHolder,
#verticle_booking_wrap .currency_Wrap .sbSelector {
  background: #fff !important; color: var(--tbc-ink) !important;
  border-color: #d8d2c4 !important; text-shadow: none !important;
}
#verticle_booking_wrap .currency_Wrap select {
  border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
  height: 40px !important; padding: 0 10px !important; width: 120px !important;
  -webkit-appearance: none; appearance: none;
}

/* 5. vuelta / checkboxes en tamano normal */
#verticle_booking_wrap .check_box_wrap label, #verticle_booking_wrap label[for*="return"],
#verticle_booking_wrap .date_Wrap label {
  font: 600 12px 'Inter', sans-serif !important; text-transform: uppercase; letter-spacing: .5px;
}
#verticle_booking_wrap input[type="checkbox"] { accent-color: var(--tbc-accent); width: 16px; height: 16px; }

/* 6. promocode y campos sueltos con ancho contenido */
#verticle_booking_wrap input[id*="promo"], #verticle_booking_wrap input[name*="promo"] {
  max-width: 320px !important; width: 320px !important;
}

/* 7. cabeceras de acordeon del onepage (Datos del trayecto, Vehiculos...) */
.acc_trigger, .onepage_booking_accordion .acc_trigger {
  background: var(--tbc-dark) !important; border: none !important;
  border-radius: 10px !important; margin: 14px 0 10px !important;
}
.acc_trigger a, .acc_trigger {
  color: #fff !important; font: 700 14px 'Inter', sans-serif !important;
  text-shadow: none !important; padding: 12px 16px !important; display: block;
  text-decoration: none !important;
}
.acc_trigger.active, .acc_trigger:hover { background: #232936 !important; }
.acc_container { background: #fff !important; border: 1px solid var(--tbc-line) !important; border-radius: 12px !important; margin-bottom: 14px !important; }

/* 8. respiracion vertical consistente entre grupos */
#verticle_booking_wrap .check_box_wrap, #verticle_booking_wrap .info_input_wrap,
#verticle_booking_wrap .seat_input_wrap, #verticle_booking_wrap .date_Wrap {
  margin-bottom: 12px !important; padding: 0 !important;
}
#verticle_booking_wrap .separator { border: none !important; border-top: 1px solid var(--tbc-line) !important; margin: 14px 0 !important; height: 0 !important; background: none !important; }

/* 9. boton principal alineado a la derecha con margen sano */
#verticle_booking_wrap .submit { margin: 8px 0 4px !important; }

/* ============================================================
   v9 — formulario con selects NATIVOS (override mod_taxibooking
   en html/mod_taxibooking/default.php). Todo el look es nuestro:
   sin selectbox, sin css dinamico del modulo.
   ============================================================ */
.tbc-form { font-family: 'Inter', system-ui, sans-serif; }
.tbc-form #verticle_booking_wrap {
  background: #fff !important; border: none !important; box-shadow: none !important;
  padding: 16px !important; border-radius: 12px !important; overflow: visible !important;
}
/* pestañas (Direcciones / Horas) como pills */
.tbc-form #verticle_booking_wrap > ul {
  display: flex !important; gap: 6px; list-style: none !important;
  margin: 0 0 14px !important; padding: 0 !important; border: none !important; background: none !important;
}
.tbc-form #verticle_booking_wrap > ul li { margin: 0 !important; border: none !important; background: none !important; border-radius: 8px !important; }
.tbc-form #verticle_booking_wrap > ul li a {
  display: block; padding: 8px 16px !important; font: 700 13px 'Inter', sans-serif !important;
  color: var(--tbc-muted) !important; background: var(--tbc-paper) !important;
  border-radius: 8px !important; text-decoration: none !important; border: none !important;
}
.tbc-form #verticle_booking_wrap > ul li.ui-tabs-selected a,
.tbc-form #verticle_booking_wrap > ul li.ui-tabs-active a,
.tbc-form #verticle_booking_wrap > ul li.ui-state-active a {
  background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important;
}
.tbc-form .ui-tabs-panel, .tbc-form .verticl_booking_toppart {
  padding: 0 !important; border: none !important; background: none !important;
}
/* etiquetas */
.tbc-form label {
  display: block; font: 600 11px 'Inter', sans-serif !important; letter-spacing: .6px;
  text-transform: uppercase; color: var(--tbc-muted) !important; margin: 0 0 5px !important;
}
/* inputs y selects nativos */
.tbc-form input[type="text"] {
  width: 100%; height: 42px; box-sizing: border-box; padding: 0 12px;
  border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
  background: #fff !important; background-image: none !important;
  font: 400 14px 'Inter', sans-serif !important; color: var(--tbc-ink) !important;
  box-shadow: none !important;
}
.tbc-form select {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  width: 100%; height: 42px; box-sizing: border-box; padding: 0 32px 0 12px;
  border: 1.5px solid #d8d2c4; border-radius: 10px; color: var(--tbc-ink);
  font: 400 14px 'Inter', sans-serif; cursor: pointer;
  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239aa0aa' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center;
}
.tbc-form input:focus, .tbc-form select:focus { outline: none; border-color: var(--tbc-accent) !important; }
/* error: con ID delante — las reglas base usan #verticle_booking_wrap (ID)
   y cualquier selector solo-de-clases pierde contra ellas siempre */
#verticle_booking_wrap input.incorrect,
#verticle_booking_wrap select.incorrect,
#verticle_booking_wrap textarea.incorrect,
#verticle_booking_wrap .incorrect,
.tbc-form .incorrect {
  border: 1.5px solid #d8574a !important; background-color: #fff7f6 !important;
  box-shadow: 0 0 0 3px rgba(216,87,74,.12) !important;
}
#tbc_form_error, .tbc_form_error {
  margin-top: 10px; background: #fdecea; color: #a13c32; border: 1px solid #f1c0ba;
  border-radius: 10px; padding: 10px 14px; font: 600 13px 'Inter', sans-serif;
}
/* estructura: origen/destino apilados, wrappers sin floats raros */
.tbc-form .topouterWrap, .tbc-form .topinnerWrap, .tbc-form .top_ver_input_wrap, .tbc-form .inputField {
  float: none !important; width: 100% !important; background: none !important; border: none !important; padding: 0 !important;
}
.tbc-form .topinnerWrap { margin-bottom: 12px !important; }
.tbc-form .getlocationField { float: right !important; margin: -2px 0 4px !important; }
.tbc-form .getlocationField a { font: 600 11.5px 'Inter', sans-serif !important; color: var(--tbc-muted) !important; }
.tbc-form .addstop, .tbc-form .remove_stops { font: 600 12px 'Inter', sans-serif !important; color: var(--tbc-ink) !important; }
/* pasajeros / maletas / sillas en rejilla de 2 columnas */
.tbc-form .verticl_booking_midpart { display: grid !important; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.tbc-form .seats_wrap { float: none !important; width: auto !important; display: block !important; background: none !important; }
.tbc-form .seat_input_wrap { margin: 0 0 12px !important; padding: 0 !important; float: none !important; width: 100% !important; }
/* fecha + hora + minutos en una fila */
.tbc-form .verticl_booking_bottompart { background: none !important; padding: 0 !important; }
.tbc-form .date_Wrap { float: none !important; width: 100% !important; margin-bottom: 12px !important; background: none !important; }
.tbc-form .date_input { display: flex !important; flex-wrap: nowrap !important; gap: 8px; align-items: center; }
.tbc-form .date_input input.date_inputbox { flex: 0 1 52%; width: 52% !important; }
.tbc-form .date_input select { flex: 1 1 22%; width: auto !important; min-width: 64px; }
.tbc-form .return { font: 600 13px 'Inter', sans-serif; margin: 4px 0 8px; display: flex; align-items: center; gap: 8px; }
.tbc-form .return input[type="checkbox"] { accent-color: var(--tbc-accent); width: 16px; height: 16px; margin: 0; }
.tbc-form .separator { border: none !important; border-top: 1px solid var(--tbc-line) !important; height: 0 !important; margin: 14px 0 !important; background: none !important; }
/* boton */
.tbc-form .submit.see_price {
  display: block; width: 100%; height: 48px; border: none; border-radius: 10px !important;
  background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important;
  font: 800 15px 'Inter', sans-serif !important; cursor: pointer; margin-top: 6px !important;
  text-transform: none !important; box-shadow: none !important; text-shadow: none !important;
}
.tbc-form .submit.see_price:hover { filter: brightness(1.06); }
/* desplegable de POIs y autocomplete */
.tbc-form .selectField-wrap { position: absolute; right: 8px; top: 34px; }
.tbc-form .poi_dropdown_wrapper {
  background: #fff; border: 1px solid var(--tbc-line); border-radius: 10px;
  box-shadow: 0 10px 26px rgba(20,24,31,.14); padding: 6px; z-index: 300;
}
.tbc-form .poi_link { padding: 8px 10px; border-radius: 7px; cursor: pointer; font-size: 13.5px; }
.tbc-form .poi_link:hover { background: var(--tbc-paper); }
.tbc-form .arrow_wrapper { color: transparent; overflow: hidden; width: 20px; height: 20px; cursor: pointer;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239aa0aa' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat center; }
.ui-autocomplete { border-radius: 10px !important; border: 1px solid var(--tbc-line) !important;
  box-shadow: 0 10px 26px rgba(20,24,31,.14) !important; font-family: 'Inter', sans-serif !important;
  background: #fff !important; padding: 4px !important; }
/* el tema jQuery UI viejo pintaba el texto en blanco: forzar tinta */
.ui-autocomplete .ui-menu-item, .ui-autocomplete .ui-menu-item a,
.ui-autocomplete .ui-menu-item-wrapper, .ui-autocomplete .ui-menu-item .ui-corner-all {
  color: var(--tbc-ink) !important; font-size: 13.5px !important;
  background: none !important; border: none !important; text-shadow: none !important;
  padding: 7px 10px !important; border-radius: 7px !important; cursor: pointer;
}
.ui-autocomplete .ui-menu-item a.ui-state-hover, .ui-autocomplete .ui-menu-item a.ui-state-focus,
.ui-autocomplete .ui-menu-item:hover, .ui-autocomplete .ui-menu-item .ui-state-active {
  background: var(--tbc-paper) !important; color: var(--tbc-ink) !important;
}
@media (max-width: 560px) {
  .tbc-form .verticl_booking_midpart { grid-template-columns: 1fr; }
  .tbc-form .date_input { flex-wrap: wrap !important; }
  .tbc-form .date_input input.date_inputbox { flex: 1 1 100%; width: 100% !important; }
}

/* ============================================================
   v13 — onepage (Reservar Online): el media_onepage.css.php del
   componente carga DESPUES y gana los empates; aqui doble-ID
   (#outer.tbc-form #inner ...) para ganar siempre.
   ============================================================ */
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap input[type="text"],
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap input:not([type]),
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap input.inputbox {
  height: 42px !important; box-sizing: border-box !important;
  border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
  background: #fff !important; background-image: none !important;
  color: var(--tbc-ink) !important; font: 400 14px 'Inter', sans-serif !important;
  padding: 0 12px !important; box-shadow: none !important; line-height: 40px !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap select {
  -webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important;
  height: 42px !important; box-sizing: border-box !important; width: 100% !important;
  border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
  color: var(--tbc-ink) !important; font: 400 14px 'Inter', sans-serif !important;
  padding: 0 32px 0 12px !important; cursor: pointer;
  background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239aa0aa' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center !important;
  text-shadow: none !important; float: none !important;
}
/* fecha + hora + minutos en una sola fila proporcionada */
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .date_Wrap { float: none !important; width: 100% !important; background: none !important; }
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .date_input {
  display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; align-items: center !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .date_input input.date_inputbox,
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .date_input input#orderdate,
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .date_input input#orderdatereturn {
  flex: 0 1 52% !important; width: 52% !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .date_input select {
  flex: 1 1 22% !important; width: auto !important; min-width: 64px !important; margin: 0 !important;
}
/* moneda compacta */
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .currency_Wrap select { width: 130px !important; }
/* etiquetas visibles y sin solaparse con las pestanas */
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .ui-tabs-nav { position: static !important; margin: 0 0 12px !important; float: none !important; }
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .ui-tabs-panel { padding-top: 6px !important; margin-top: 0 !important; overflow: visible !important; }
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap label {
  display: block !important; font: 600 11px 'Inter', sans-serif !important; letter-spacing: .6px !important;
  text-transform: uppercase !important; color: var(--tbc-muted) !important; margin: 0 0 5px !important;
  float: none !important; width: auto !important; text-shadow: none !important;
}
/* fila direccion: input flexible + disparador de lugares como boton
   cuadrado AL LADO (nada de absolutos dentro del input, que bloqueaban
   la escritura y rompian el posicionamiento del desplegable) */
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .top_ver_input_wrap {
  display: flex !important; gap: 8px !important; align-items: center !important;
  position: relative !important; float: none !important; width: 100% !important;
  background: none !important; border: none !important; padding: 0 !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .inputField {
  flex: 1 1 auto !important; position: static !important; float: none !important;
  width: auto !important; padding: 0 !important; background: none !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .getlocationField {
  order: 3; flex: 0 0 auto; float: none !important; margin: 0 !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .getlocationField a { font: 600 11.5px 'Inter', sans-serif !important; color: var(--tbc-muted) !important; }
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .selectField-wrap {
  position: static !important; flex: 0 0 42px !important; float: none !important;
  width: 42px !important; margin: 0 !important; padding: 0 !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .selectField {
  position: static !important; width: 42px !important; height: 42px !important;
  background: #fff !important; border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .arrow_wrapper {
  width: 100% !important; height: 100% !important; color: transparent !important; overflow: hidden !important;
  background: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239aa0aa' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat center !important;
  border: none !important; cursor: pointer; position: static !important; float: none !important;
}
/* el desplegable de lugares se ancla a la fila completa: ancho total, debajo */
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .top_ver_input_wrap .poi_dropdown_wrapper {
  position: absolute !important; left: 0 !important; right: 0 !important; top: calc(100% + 4px) !important;
  width: auto !important; max-height: 320px !important; overflow-y: auto !important; z-index: 500 !important;
}
/* desplegable de lugares (POI) en claro */
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .poi_dropdown_wrapper,
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .routefrom_dropdown_wrapper,
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .routeto_dropdown_wrapper,
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .routecategory_dropdown_wrapper,
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .routecategory_dropoff_dropdown_wrapper {
  background: #fff !important; border: 1px solid var(--tbc-line) !important; border-radius: 10px !important;
  box-shadow: 0 10px 26px rgba(20,24,31,.16) !important; padding: 6px !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .poi_link,
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .poi_link span {
  color: var(--tbc-ink) !important; background: none !important; font: 400 13.5px 'Inter', sans-serif !important;
  text-shadow: none !important; border: none !important;
}
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .poi_link { padding: 8px 10px !important; border-radius: 7px !important; cursor: pointer; }
#verticle_booking_wrap_outer.tbc-form #verticle_booking_wrap .poi_link:hover { background: var(--tbc-paper) !important; }
/* autocomplete HERE (se cuelga de body): tema claro con mas peso que el css del componente */
body .ui-autocomplete, html body .ui-autocomplete {
  background: #fff !important; border: 1px solid var(--tbc-line) !important; border-radius: 10px !important;
  box-shadow: 0 10px 26px rgba(20,24,31,.16) !important; padding: 4px !important;
}
body .ui-autocomplete .ui-menu-item, body .ui-autocomplete .ui-menu-item a,
body .ui-autocomplete .ui-menu-item .ui-corner-all, body .ui-autocomplete .ui-menu-item-wrapper {
  color: var(--tbc-ink) !important; background: none !important; border: none !important;
  font: 400 13.5px 'Inter', sans-serif !important; text-shadow: none !important;
  padding: 7px 10px !important; border-radius: 7px !important;
}
body .ui-autocomplete .ui-menu-item a.ui-state-hover, body .ui-autocomplete .ui-menu-item a.ui-state-focus,
body .ui-autocomplete .ui-menu-item:hover { background: var(--tbc-paper) !important; color: var(--tbc-ink) !important; }

/* ============================================================
   v15 — pasos 2/3/4 del onepage (coches, datos, resumen): viven
   FUERA de #verticle_booking_wrap. Doble ID + .tbc-form para
   ganar a media_onepage.css.php. Las dos raices posibles del
   flujo (#verticle_booking_wrap_outer y #onepage_booking_accordion)
   comparten reglas: selectores fusionados.
   ============================================================ */
/* tipografia Inter en todo el flujo (sin romper icon-fonts) */
#verticle_booking_wrap_outer.tbc-form,
#verticle_booking_wrap_outer.tbc-form *:not(i):not([class^="icon-"]):not([class*=" icon-"]):not(.fa),
#onepage_booking_accordion.tbc-form,
#onepage_booking_accordion.tbc-form *:not(i):not([class^="icon-"]):not([class*=" icon-"]):not(.fa) {
  font-family: 'Inter', system-ui, sans-serif !important;
}
/* inputs / selects / textareas de TODOS los pasos en claro */
#verticle_booking_wrap_outer.tbc-form input[type="text"],
#verticle_booking_wrap_outer.tbc-form input[type="email"],
#verticle_booking_wrap_outer.tbc-form input[type="tel"],
#verticle_booking_wrap_outer.tbc-form input:not([type]),
#verticle_booking_wrap_outer.tbc-form textarea,
#onepage_booking_accordion.tbc-form input[type="text"],
#onepage_booking_accordion.tbc-form input[type="email"],
#onepage_booking_accordion.tbc-form input[type="tel"],
#onepage_booking_accordion.tbc-form input:not([type]),
#onepage_booking_accordion.tbc-form textarea {
  background: #fff !important; color: var(--tbc-ink) !important;
  border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
  box-shadow: none !important; text-shadow: none !important;
  font: 400 14px 'Inter', sans-serif !important; padding: 8px 12px !important;
}
#verticle_booking_wrap_outer.tbc-form textarea,
#onepage_booking_accordion.tbc-form textarea { min-height: 84px !important; }
#verticle_booking_wrap_outer.tbc-form select,
#onepage_booking_accordion.tbc-form select {
  background-color: #fff !important; color: var(--tbc-ink) !important;
  border: 1.5px solid #d8d2c4 !important; border-radius: 10px !important;
}
#verticle_booking_wrap_outer.tbc-form input[type="radio"],
#verticle_booking_wrap_outer.tbc-form input[type="checkbox"],
#onepage_booking_accordion.tbc-form input[type="radio"],
#onepage_booking_accordion.tbc-form input[type="checkbox"] { accent-color: var(--tbc-accent); }
/* errores: doble ID + clase, gana a cualquier base */
#verticle_booking_wrap_outer.tbc-form input.incorrect,
#verticle_booking_wrap_outer.tbc-form select.incorrect,
#verticle_booking_wrap_outer.tbc-form textarea.incorrect,
#verticle_booking_wrap_outer.tbc-form .incorrect,
#onepage_booking_accordion.tbc-form input.incorrect,
#onepage_booking_accordion.tbc-form select.incorrect,
#onepage_booking_accordion.tbc-form textarea.incorrect,
#onepage_booking_accordion.tbc-form .incorrect {
  border: 1.5px solid #d8574a !important; background-color: #fff7f6 !important;
  box-shadow: 0 0 0 3px rgba(216,87,74,.12) !important;
}
/* cabeceras del acordeon (Booking Form / Available Cars / User Details / Summary) */
.ui-accordion-header, #onepage_booking_accordion .ui-accordion-header, h3.ui-accordion-header {
  background: var(--tbc-dark) !important; border: none !important; border-radius: 10px !important;
  margin: 10px 0 !important; padding: 0 !important;
}
.ui-accordion-header a, h3.ui-accordion-header a {
  color: #fff !important; font: 700 14px 'Inter', sans-serif !important;
  padding: 12px 16px !important; display: block !important; text-decoration: none !important;
  text-shadow: none !important; background: none !important;
}
.ui-accordion-header .ui-icon { filter: invert(1); }
.ui-accordion-content, #onepage_booking_accordion .ui-accordion-content {
  background: #fff !important; border: 1px solid var(--tbc-line) !important;
  border-radius: 12px !important; margin-bottom: 12px !important;
}
/* lista de coches */
#vehicle_wrapper .cars .vehicle_type h5, #vehicle_wrapper .cars td, #vehicle_wrapper .cars .car_desc {
  color: var(--tbc-ink) !important; text-shadow: none !important;
}
#vehicle_wrapper .cars .vehicle_price, #vehicle_wrapper .cars .vehicle_price * {
  color: var(--tbc-ink) !important; font-weight: 900 !important; font-size: 20px !important;
}
/* botones de paso (Next / Book now / Make booking) */
#verticle_booking_wrap_outer.tbc-form .step_submit_button,
#onepage_booking_accordion.tbc-form .step_submit_button,
.step_submit_button, .car_booking {
  background: var(--tbc-accent) !important; color: var(--tbc-accent-ink) !important;
  border: none !important; border-radius: 10px !important; cursor: pointer;
  font: 800 14px 'Inter', sans-serif !important; padding: 12px 24px !important;
  text-shadow: none !important; box-shadow: none !important; text-transform: none !important;
}
.step_submit_button:hover, .car_booking:hover { filter: brightness(1.06); }
.step_submit_button[disabled] { opacity: .5; cursor: not-allowed; }
/* precio destacado del paso de datos */
#verticle_booking_wrap_outer.tbc-form font[color="red"], #verticle_booking_wrap_outer.tbc-form .price_red,
#onepage_booking_accordion.tbc-form font[color="red"], #onepage_booking_accordion.tbc-form .price_red {
  color: var(--tbc-ink) !important; font-weight: 900 !important;
}
/* etiquetas de los pasos de datos/resumen */
#verticle_booking_wrap_outer.tbc-form .info_label, #verticle_booking_wrap_outer.tbc-form .info_label *,
#onepage_booking_accordion.tbc-form .info_label, #onepage_booking_accordion.tbc-form .info_label * {
  color: var(--tbc-muted) !important; font-size: 13px !important;
}



/* cabeceras y paneles reales del acordeon del onepage */
h3.onepage_booking_accordion_header {
  background: var(--tbc-dark) !important; border: none !important; border-radius: 10px !important;
  margin: 10px 0 !important; padding: 0 !important;
}
h3.onepage_booking_accordion_header, h3.onepage_booking_accordion_header a {
  color: #fff !important; font: 700 14px 'Inter', sans-serif !important;
  text-decoration: none !important; text-shadow: none !important;
}
h3.onepage_booking_accordion_header a { display: block !important; padding: 12px 16px !important; background: none !important; }
h3.onepage_booking_accordion_header.ui-state-disabled { opacity: .55; }
.onepage_booking_accordion_slide, #onepage_booking_accordion .ui-accordion-content {
  background: #fff !important; border: 1px solid var(--tbc-line) !important;
  border-radius: 12px !important; margin-bottom: 12px !important; padding: 14px !important;
}

/* ============================================================
   v17 — cabecera navy con logo del grupo fijo, menu afinado,
   tipografia Inter en todo el contenido del componente
   ============================================================ */
/* cabecera oscura como booktaxigroup.com, logo blanco + ciudad */
.tbc-hdr { background: var(--tbc-dark) !important; border-bottom: 1px solid rgba(255,255,255,.08) !important; }
.tbc-logobrand { display: flex; align-items: center; gap: 12px; text-decoration: none !important; }
.tbc-logobrand img { height: 34px !important; width: auto !important; max-height: none; }
.tbc-logocity {
  background: var(--tbc-accent); color: var(--tbc-accent-ink);
  font: 800 12px 'Inter', sans-serif; letter-spacing: .5px; text-transform: uppercase;
  padding: 4px 12px; border-radius: 14px;
}
.tbc-hdr .tbc-hdr-right, .tbc-hdr .tbc-phone, .tbc-hdr .tbc-phone span,
.tbc-hdr .tbc-hdr-right h1, .tbc-hdr .tbc-hdr-right h2, .tbc-hdr .tbc-hdr-right h3,
.tbc-hdr .tbc-phone h1, .tbc-hdr .tbc-phone h2, .tbc-hdr .tbc-phone h3 {
  color: #fff !important;
}
.tbc-hdr .tbc-welcome { color: #b8c2d4 !important; }
/* menu: tamano y peso EXACTOS de la plantilla, gane quien gane */
.tbc-menu a, .tbc-menu ul li a {
  font-family: 'Inter', system-ui, sans-serif !important;
  font-size: 13.5px !important; font-weight: 600 !important;
  letter-spacing: .2px !important; line-height: 1.2 !important;
  padding: 10px 13px !important; text-transform: none !important;
}
/* Inter en TODO el contenido del componente (resumen incluido),
   viva en el panel que viva; sin tocar icon-fonts */
.tbc-maincontainer, .tbc-maincontainer *:not(i):not([class^="icon-"]):not([class*=" icon-"]):not(.fa) {
  font-family: 'Inter', system-ui, sans-serif !important;
}

/* ============================================================
   v18 — home horizontal (como la maqueta): hero centrado y el
   modulo de reserva a todo el ancho en rejilla compacta.
   + fecha/hora/minutos SIEMPRE en una linea con anchos sanos.
   ============================================================ */
/* hero: titular centrado arriba, formulario ancho debajo */
.tbc-hero.tbc-hasform .tbc-hero-grid {
  grid-template-columns: 1fr !important; gap: 26px !important; padding: 44px 20px 42px !important;
}
.tbc-hero.tbc-hasform .tbc-hero-copy { text-align: center; max-width: 780px; margin: 0 auto; }
.tbc-hero.tbc-hasform .tbc-herotitle, .tbc-hero.tbc-hasform h1, .tbc-hero.tbc-hasform h2 {
  text-align: center !important; margin: 0 auto 12px !important;
}
.tbc-hero.tbc-hasform p { margin: 0 auto 14px !important; text-align: center; max-width: 620px; }
.tbc-usps { display: flex; gap: 26px; justify-content: center; flex-wrap: wrap; }
.tbc-heroform { max-width: 1080px; width: 100%; margin: 0 auto; }
/* v22 — los ::before/::after del clearfix (display:table) cuentan como
   celdas en un grid: eran la celda fantasma y el desnivel de la vuelta */
.tbc-heroform #verticle_booking_wrap .verticl_booking_midpart::before,
.tbc-heroform #verticle_booking_wrap .verticl_booking_midpart::after,
.tbc-heroform #verticle_booking_wrap #tabs_address::before,
.tbc-heroform #verticle_booking_wrap #tabs_address::after,
.tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart::before,
.tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart::after {
  content: none !important; display: none !important;
}

/* rejilla interna del modulo (v19: doble peso contra las reglas con ID
   y celdas FIJADAS con grid-area para anular floats y auto-colocacion) */
.tbc-heroform #verticle_booking_wrap #tabs_address {
  display: grid !important; grid-template-columns: 1fr 1fr !important;
  gap: 0 16px !important; align-items: start !important;
}
.tbc-heroform #verticle_booking_wrap #tabs_address > .pickup_wrap  { grid-area: 1 / 1 !important; }
.tbc-heroform #verticle_booking_wrap #tabs_address > .dropoff_wrap { grid-area: 1 / 2 !important; }
.tbc-heroform #verticle_booking_wrap #tabs_address > .topouterWrap {
  float: none !important; width: auto !important; margin: 0 !important;
}
.tbc-heroform #verticle_booking_wrap .verticl_booking_midpart {
  display: grid !important; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)) !important; gap: 0 12px !important;
}
.tbc-heroform #verticle_booking_wrap .verticl_booking_midpart .seats_wrap { display: contents !important; }
.tbc-heroform #verticle_booking_wrap .seat_input_wrap { margin: 0 0 8px !important; width: auto !important; float: none !important; }
.tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart {
  display: grid !important; grid-template-columns: 1.5fr 1fr !important;
  gap: 0 16px !important; align-items: end !important;
}
.tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart > .date_Wrap.left { grid-area: 1 / 1 !important; margin: 0 !important; width: auto !important; }
.tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart > #return_label { grid-area: 1 / 2 !important; margin: 0 !important; width: auto !important; float: none !important; }
.tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart > .submit.see_price,
.tbc-heroform #verticle_booking_wrap .submit.see_price { grid-column: 1 / -1 !important; margin-top: 6px !important; }
/* compactar: controles 38px, etiquetas y margenes reducidos, boton 46px */
.tbc-heroform #verticle_booking_wrap input[type="text"],
.tbc-heroform #verticle_booking_wrap select,
.tbc-heroform #verticle_booking_wrap .selectField { height: 38px !important; }
.tbc-heroform #verticle_booking_wrap label { font-size: 10.5px !important; margin-bottom: 4px !important; }
.tbc-heroform #verticle_booking_wrap .topinnerWrap { margin-bottom: 8px !important; }
.tbc-heroform #verticle_booking_wrap .separator { margin: 8px 0 !important; }
.tbc-heroform #verticle_booking_wrap { padding: 14px 16px !important; }
.tbc-heroform #verticle_booking_wrap .submit.see_price { height: 46px !important; }
.tbc-heroform #verticle_booking_wrap .getlocationField { display: none !important; }

/* fecha + hora + minutos en UNA linea, con selects contenidos (ambas raices) */
#onepage_booking_accordion.tbc-form .date_Wrap .date_input,
#verticle_booking_wrap_outer.tbc-form .date_Wrap .date_input,
.tbc-form .date_Wrap .date_input {
  display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; align-items: center !important;
  width: 100% !important; float: none !important;
}
#onepage_booking_accordion.tbc-form .date_Wrap .date_input > input,
#verticle_booking_wrap_outer.tbc-form .date_Wrap .date_input > input {
  flex: 1 1 auto !important; width: auto !important; min-width: 130px !important; max-width: none !important;
}
#onepage_booking_accordion.tbc-form .date_Wrap .date_input > select,
#verticle_booking_wrap_outer.tbc-form .date_Wrap .date_input > select {
  flex: 0 0 96px !important; width: 96px !important; min-width: 80px !important; max-width: 110px !important;
}

@media (max-width: 860px) {
  .tbc-heroform #verticle_booking_wrap #tabs_address { grid-template-columns: 1fr !important; }
  .tbc-heroform #verticle_booking_wrap #tabs_address > .pickup_wrap { grid-area: auto !important; }
  .tbc-heroform #verticle_booking_wrap #tabs_address > .dropoff_wrap { grid-area: auto !important; }
  .tbc-heroform #verticle_booking_wrap .verticl_booking_midpart { grid-template-columns: 1fr 1fr !important; }
  .tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart { grid-template-columns: 1fr !important; }
  .tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart > .date_Wrap.left,
  .tbc-heroform #verticle_booking_wrap .verticl_booking_bottompart > #return_label { grid-area: auto !important; }
}

/* ============================================================
   v24 — margenes heredados DENTRO de filas flex: producian los
   desniveles de milimetros (fecha vs selects, input vs chevron).
   Verificado en vivo: con margin 0 todo queda a 753-795 exactos.
   ============================================================ */
.tbc-form .date_Wrap .date_input input,
.tbc-form .date_Wrap .date_input select,
#onepage_booking_accordion.tbc-form .date_Wrap .date_input input,
#onepage_booking_accordion.tbc-form .date_Wrap .date_input select,
#verticle_booking_wrap_outer.tbc-form .date_Wrap .date_input input,
#verticle_booking_wrap_outer.tbc-form .date_Wrap .date_input select {
  margin: 0 !important;
}
.tbc-form .top_ver_input_wrap input,
.tbc-form .top_ver_input_wrap .inputField,
.tbc-form .top_ver_input_wrap .selectField-wrap,
.tbc-form .top_ver_input_wrap .selectField,
#onepage_booking_accordion.tbc-form .top_ver_input_wrap input,
#onepage_booking_accordion.tbc-form .top_ver_input_wrap .selectField-wrap,
#verticle_booking_wrap_outer.tbc-form .top_ver_input_wrap input,
#verticle_booking_wrap_outer.tbc-form .top_ver_input_wrap .selectField-wrap {
  margin: 0 !important;
}
.tbc-form .top_ver_input_wrap .selectField-wrap { align-self: center !important; }

/* ============================================================
   v25 — tono tipografico: lista de coches menos negrita, y el
   precio rojo del paso de datos pasa a destacado de marca
   ============================================================ */
#vehicle_wrapper .cars td, .tbc-form #vehicle_wrapper .cars td { font-weight: 400 !important; }
#vehicle_wrapper .cars .vehicle_type h5 {
  font-weight: 700 !important; font-size: 16.5px !important; letter-spacing: 0 !important;
}
#vehicle_wrapper .cars .vehicle_type { font-weight: 400 !important; }
#vehicle_wrapper .cars .vehicle_price, #vehicle_wrapper .cars .vehicle_price * {
  font-weight: 800 !important; font-size: 20px !important;
}
/* "Route from ..." menos rotundo */
#vehicle_wrapper h2, #vehicle_wrapper h3, .tbc-form .routes_heading {
  font-weight: 700 !important; font-size: 17px !important;
}
/* precio en rojo (inline) del paso de datos -> tinta de marca, bien destacado */
#onepage_booking_accordion.tbc-form font[color="red"]:not(#warning_msg):not(.messagetext),
#onepage_booking_accordion.tbc-form [style*="color:red"]:not(#warning_msg):not(.messagetext),
#onepage_booking_accordion.tbc-form [style*="color: red"]:not(#warning_msg):not(.messagetext),
#verticle_booking_wrap_outer.tbc-form font[color="red"]:not(#warning_msg):not(.messagetext),
#verticle_booking_wrap_outer.tbc-form [style*="color:red"]:not(#warning_msg):not(.messagetext),
#verticle_booking_wrap_outer.tbc-form [style*="color: red"]:not(#warning_msg):not(.messagetext) {
  color: var(--tbc-ink) !important; font-weight: 800 !important; font-size: 20px !important;
}

/* ============================================================
   v26 — social proof antes del pie: reseñas verificadas con
   rotacion de 3 en 3 + bocadillo de reservas en tiempo real
   ============================================================ */
.tbc-social { background: #fff; border-top: 1px solid var(--tbc-line); padding: 50px 0 54px; }
.tbc-social-h { font-size: 22px !important; margin: 0 0 4px !important; }
.tbc-social-st { color: var(--tbc-accent); letter-spacing: 3px; font-size: 18px; }
.tbc-social-sub { color: var(--tbc-muted) !important; font-size: 14px; margin: 0 0 24px !important; }
.tbc-tgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; transition: opacity .3s; }
.tbc-tgrid.tbc-fade { opacity: 0; }
.tbc-tc { background: var(--tbc-paper); border: 1px solid var(--tbc-line); border-radius: 14px; padding: 20px 22px; }
.tbc-tc-st { color: var(--tbc-accent); letter-spacing: 2px; font-size: 14px; margin-bottom: 10px; }
.tbc-tc p { font-size: 14px !important; color: #3d4756 !important; font-style: italic; line-height: 1.55 !important; margin: 0 !important; }
.tbc-tc-who { margin-top: 12px; font-size: 12.5px; color: var(--tbc-muted); }
.tbc-tc-who b { color: var(--tbc-ink); display: block; font-size: 13px; font-style: normal; }
.tbc-toast {
  position: fixed; left: 18px; bottom: 18px; z-index: 99990;
  background: #fff; border: 1px solid var(--tbc-line); border-left: 4px solid var(--tbc-accent);
  border-radius: 12px; padding: 12px 16px; font: 400 12.5px/1.45 'Inter', sans-serif; color: #3d4756;
  box-shadow: 0 14px 34px -10px rgba(15,25,50,.3); max-width: 300px;
  opacity: 0; transform: translateY(14px); transition: .4s; pointer-events: none;
}
.tbc-toast.on { opacity: 1; transform: translateY(0); }
.tbc-toast b { color: var(--tbc-ink); }
.tbc-toast-tt { color: #9aa1ad; font-size: 11px; margin-top: 2px; }
@media (max-width: 991px) {
  .tbc-tgrid { grid-template-columns: 1fr; }
  .tbc-toast { display: none; }
}

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .tbc-hero h1 { font-size: 28px !important; }
  .tbc-hero.tbc-hasform .tbc-hero-grid { grid-template-columns: 1fr; gap: 24px; }
  .tbc-hero.tbc-hasform .tbc-herotitle { font-size: 26px !important; }
  .tbc-burger { display: block; }
  .tbc-menu { display: none; }
  body.tbc-navopen .tbc-menu { display: block; position: absolute; top: 48px; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--tbc-line); z-index: 600; padding: 8px 14px 14px; }
  body.tbc-navopen .tbc-menu ul { flex-direction: column; align-items: stretch; }
  body.tbc-navopen .tbc-menu ul ul { position: static; display: block; box-shadow: none; border: none; padding-left: 14px; }
  .tbc-foot-grid { grid-template-columns: 1fr 1fr; }
  .tbc-hdr .tbc-wrap { min-height: 62px; }
  .mobilehide { display: none !important; }
  /* rejilla bootstrap 2 en movil */
  .tbc-modgrid .span4, .tbc-modgrid .span6, .tbc-modgrid .span8, .tbc-modgrid .span12 { width: 100% !important; margin-left: 0 !important; float: none !important; }
}
@media (max-width: 560px) {
  .tbc-topbar .tbc-wrap { justify-content: center; }
  .tbc-foot-grid { grid-template-columns: 1fr; }
  .tbc-hero .tbc-wrap { padding: 40px 16px 34px; }
  .tbc-strip .tbc-wrap { gap: 14px; font-size: 12px; }
}

/* ============================================================
   v27 — WhatsApp 24/7 apilado en cabecera + linea legal
   ============================================================ */
a.tbc-phone {
  display: inline-flex !important;
  flex-direction: column;
  align-items: flex-end;
  gap: 1px;
  text-decoration: none !important;
  line-height: 1.25 !important;
}
a.tbc-phone .tbc-phlbl {
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: var(--tbc-accent) !important;
}
a.tbc-phone .tbc-phnum {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #fff !important;
}
a.tbc-phone:hover .tbc-phnum { color: var(--tbc-accent) !important; }
/* linea legal del pie: enlaces discretos */
.tbc-foot-legal a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.tbc-foot-legal a:hover { color: #fff; }

/* ============================================================
   v28 — resumen de servicio en home (intro + pasos + tarifas)
   y plegado "Leer mas" del texto SEO heredado
   ============================================================ */
.tbc-quick { background: #fff; border-bottom: 1px solid var(--tbc-line); }
.tbc-quick .tbc-wrap { padding: 42px 22px 46px; }
.tbc-quick-intro {
  font-size: 17px; line-height: 1.65; color: var(--tbc-ink);
  max-width: 860px; margin: 0 0 30px;
}
.tbc-quick-h {
  font: 800 22px/1.25 'Inter', system-ui, sans-serif; color: var(--tbc-ink);
  margin: 0 0 18px; letter-spacing: -.2px;
}
.tbc-steps {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px;
  margin: 0 0 34px;
}
.tbc-step {
  background: var(--tbc-paper, #f7f8fa); border: 1px solid var(--tbc-line);
  border-radius: 14px; padding: 20px 20px 18px; position: relative;
}
.tbc-stepn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--tbc-accent); color: var(--tbc-accent-ink);
  font: 800 14px 'Inter', sans-serif; margin-bottom: 12px;
}
.tbc-step h3 { font: 700 16px/1.3 'Inter', sans-serif; color: var(--tbc-ink); margin: 0 0 7px; }
.tbc-step p  { font-size: 14px; line-height: 1.55; color: var(--tbc-muted); margin: 0; }
.tbc-fares { width: 100%; max-width: 720px; border-collapse: collapse; }
.tbc-fares td {
  padding: 11px 6px; border-bottom: 1px solid var(--tbc-line);
  font-size: 15px; color: var(--tbc-ink);
}
.tbc-fares td:last-child { text-align: right; white-space: nowrap; }
.tbc-fares .tbc-fare-from { font-size: 12px; color: var(--tbc-muted); margin-right: 4px; }
.tbc-fares b { font-weight: 800; }
/* plegado del contenido SEO heredado */
.tbc-clip {
  max-height: 420px !important; overflow: hidden !important; position: relative;
}
.tbc-clip::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 110px;
  background: linear-gradient(rgba(255,255,255,0), #fff 85%);
  pointer-events: none;
}
.tbc-readmore {
  display: block; margin: 10px auto 34px; cursor: pointer;
  background: #fff; color: var(--tbc-ink);
  border: 1.5px solid var(--tbc-ink); border-radius: 22px;
  font: 700 14px 'Inter', sans-serif; padding: 9px 26px;
  transition: all .15s ease;
}
.tbc-readmore:hover { background: var(--tbc-accent); border-color: var(--tbc-accent); color: var(--tbc-accent-ink); }
@media (max-width: 860px) {
  .tbc-steps { grid-template-columns: 1fr; }
  .tbc-quick .tbc-wrap { padding: 30px 16px 34px; }
  .tbc-quick-intro { font-size: 15.5px; }
}

/* ============================================================
   v30 — plegado "Leer mas" con modulos flotados (Bootstrap 2) y
   recolocacion de extras sin parpadeo
   ============================================================ */
/* los contenedores plegables contienen sus floats SIEMPRE (con o sin
   recorte): sin esto, al expandir colapsaban a ~30px y el contenido
   flotado se montaba sobre las secciones siguientes */
[data-tbc-clip] { display: flow-root; }
#tbc-main, #tbc-extra { display: flow-root; }
/* los modulos que llegan en topmodule junto al formulario se ocultan
   hasta que tbcRelocateExtras los lleva a #tbc-extra (evita el flash
   dentro del hero y la zona "vacia" bajo el formulario) */
.tbc-heroform > div:not(:has(#price_form)) { display: none; }
#tbc-extra > div { display: block; }