/* public/assets/css/style.css */

/* ===== Vars din Settings =====
   Folosim doar variabile – fără culori hardcodate care să le anuleze */
:root{
  --ctb-form-bg:#f8f9fa;
  --ctb-header-bg:#0b74ff;
  --ctb-header-text:#fff;
  --ctb-body-text:#333;
  --ctb-input-text:#000;
  --ctb-btn-primary-bg:#e50914;
  --ctb-btn-primary-text:#fff;
  --ctb-label-color:#39424e;
  --ctb-title-color:#111827;
  --ctb-price-color:#16212b;
  /* ↓ sunt setate din PHP, dar punem fallback în CSS-ul de utilizare */
  /* --ctb-summary-total-color */
  /* --ctb-modal-text-color  */
}

/* ===== Layout ===== */
#ctb-booking-form-container{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
  max-width:980px;margin:40px auto;
  box-shadow:0 10px 25px rgba(0,0,0,.08);border-radius:16px;overflow:hidden
}
#ctb-booking-form{padding:30px;background:var(--ctb-form-bg);color:var(--ctb-body-text)}
.ctb-form-step{display:none}
.ctb-form-step.active{display:block;animation:fadeIn .35s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

.ctb-form-header{background:var(--ctb-header-bg);color:var(--ctb-header-text);padding:20px;margin:-30px -30px 24px;border-radius:16px 16px 0 0}
.ctb-form-header h3{margin:0;font-size:20px;color:var(--ctb-header-text)}

.ctb-row{display:flex;flex-wrap:wrap;margin:0 -10px 20px}
.ctb-col{flex:1;padding:0 10px;min-width:200px}

/* Labels */
#ctb-booking-form label{display:block;margin:0 0 8px;font-weight:600;font-size:13px;color:var(--ctb-label-color)}

/* Inputs (uniforme) */
#ctb-booking-form input[type="text"],
#ctb-booking-form input[type="date"],
#ctb-booking-form input[type="time"],
#ctb-booking-form input[type="number"],
#ctb-booking-form select{
  width:100%;
  padding:11px;
  border:1px solid #d9d9d9;
  border-radius:10px;
  box-sizing:border-box;
  font-size:15px;
  color:var(--ctb-input-text);
  transition:border-color .2s;
  height:44px;                 /* înălțime uniformă */
  line-height:1.2;
  background:#fff;
}
#ctb-booking-form input:focus,#ctb-booking-form select:focus{outline:none;border-color:var(--ctb-header-bg)}

/* Buttons */
.ctb-btn{padding:11px 22px;border:none;border-radius:10px;cursor:pointer;font-size:15px;font-weight:700;transition:transform .15s,opacity .15s;margin-right:10px}
.ctb-btn:hover{transform:translateY(-1px)}
.ctb-btn-primary{background:var(--ctb-btn-primary-bg);color:var(--ctb-btn-primary-text)}
.ctb-btn-primary:disabled{opacity:.55;cursor:not-allowed}

/* Distance info */
.ctb-distance-info{margin-top:14px;padding:12px;background:#eef3f7;border-radius:10px;font-weight:500}

/* ===== Step 2 – Vehicles + Extras (REDESIGN TIP BLACKLANE) ===== */
#ctb-vehicle-list{
  display:flex;
  flex-direction:column;
  gap:0;
}

/* card mașină ca listă, nu card cu shadow mare */
.ctb-vehicle-option{
  display:flex;
  align-items:flex-start;
  gap:16px;
  background:#ffffff;
  border:1px solid #d1d5db;
  border-radius:0;
  padding:10px 14px;
  position:relative;
  box-shadow:none;
  cursor:pointer;
}

/* distanță între carduri */
.ctb-vehicle-option + .ctb-vehicle-option{
  margin-top:6px;
}

/* stare selectată – border negru și fundal gri */
.ctb-vehicle-option.selected{
  border:2px solid #111827;
  background:#f3f4f6;
}

/* imagine mașină */
.ctb-vehicle-option img{
  width:130px;
  height:90px;
  object-fit:cover;
  border-radius:6px;
  flex:0 0 130px;
}

/* info text */
.ctb-vehicle-info{
  flex:1 1 auto;
  min-width:0;
}

.ctb-vehicle-info h4{
  margin:0 0 4px;
  font-size:16px;
  font-weight:700;
  color:var(--ctb-title-color);
}

/* meta (icons + numere) */
.ctb-vehicle-meta{
  display:flex;
  gap:14px;
  align-items:center;
  color:#4d5b66;
  font-weight:600;
  font-size:13px;
  margin:2px 0 4px;
}

.ctb-vehicle-meta i{
  margin-right:4px;
  color:#111827;
}

/* descriere suplimentară (dacă o folosești) */
.ctb-vehicle-info p{
  margin:0;
  font-size:13px;
  color:#4b5563;
}

/* preț în dreapta, pe același rând */
.ctb-vehicle-price{
  position:static;
  margin-left:auto;
  font-size:18px;
  font-weight:800;
  color:var(--ctb-price-color);
  white-space:nowrap;
}

/* ascundem complet butonul SELECT, folosim doar JS */
.ctb-vehicle-option .ctb-select-vehicle{
  display:none !important;
}

/* hover ușor */
.ctb-vehicle-option:hover{
  background:#f9fafb;
}

/* Extras container sub listă */
.ctb-extras-wrap{margin-top:4px;padding:18px;background:#f7f8fb;border:1px dashed #e2e6ea;border-radius:14px}
.ctb-extras-wrap h4{margin:0 0 12px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:#8a97a3}
.ctb-extras-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ctb-extra-item{background:#fff;border:1px solid #e7eaee;border-radius:12px;padding:12px}
.ctb-extra-item label{display:flex;justify-content:space-between;align-items:center;margin:0 0 6px;font-weight:700;font-size:14px;color:var(--ctb-title-color)}
.ctb-extra-item input{width:100%;padding:10px;border:1px solid #d9d9d9;border-radius:10px;font-size:14px}

/* ===== Step 4 – Summary ===== */
#ctb-summary-content h4{margin:10px 0 6px;font-size:15px;color:var(--ctb-title-color)}
#ctb-summary-content .summary-item{display:flex;justify-content:space-between;margin:6px 0;font-size:14px}
/* ↓ culoare personalizabilă pentru TOTAL (label + valoare) */
#ctb-summary-content h3{color:var(--ctb-summary-total-color, var(--ctb-price-color));}

/* ===== Modal ===== */
.ctb-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.45);z-index:99999}
.ctb-modal-content{background:#fff;border-radius:14px;padding:24px;max-width:520px;width:92%;box-shadow:0 20px 40px rgba(0,0,0,.25);position:relative}
.ctb-modal-content h2,
.ctb-modal-content p{color:var(--ctb-modal-text-color, var(--ctb-body-text));}
.ctb-modal-close{position:absolute;top:8px;right:10px;background:transparent;border:none;font-size:22px;cursor:pointer}

/* Responsive (desktop→tablet) */
@media (max-width:900px){
  .ctb-vehicle-option{flex-wrap:wrap}
  .ctb-vehicle-price{position:static;margin-left:auto}
}

/* --- Vehicle specs box (Step 2) --- */
.ctb-vehicle-specs{
  margin:8px 0 16px;
  background:#f7f8fb;
  border:1px solid #e5e9ef;
  border-radius:14px;
  padding:16px;
}
.ctb-vehicle-specs .ctb-spec-col{display:inline-block;vertical-align:top;width:49%}
.ctb-vehicle-specs ul{list-style:none;margin:0;padding:0}
.ctb-vehicle-specs li{
  font-size:13px;padding:10px 0;border-bottom:1px dotted #e0e6ee;color:var(--ctb-title-color)
}
.ctb-vehicle-specs li:last-child{border-bottom:none}

/* ===== TABS – stil de desktop (dacă le folosești) ===== */
.ctb-tabs{display:flex;gap:8px;align-items:center;margin:10px 0 6px}
.ctb-tab{
  padding:8px 14px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;
  cursor:pointer;font-weight:600;line-height:1;color:#334155
}
.ctb-tab.active{background:#0f172a;color:#fff;border-color:#0f172a}

/* ===== MOBILE (≤640px) ===== */
@media (max-width:640px){

  /* 0) TABS: ascunse complet pe mobil (rescrise mai jos pentru switch) */
  .ctb-tabs{ display:none !important; visibility:hidden !important; }

  /* 1) Layout pe o singură coloană */
  .ctb-col{min-width:100%}
  .ctb-row{margin:0 0 14px}

  /* 2) Inputuri uniforme (inclusiv Date/Time) */
  #ctb-booking-form input[type="text"],
  #ctb-booking-form input[type="date"],
  #ctb-booking-form input[type="time"],
  #ctb-booking-form input[type="number"],
  #ctb-booking-form select{
    height:44px !important;
    padding:11px !important;
    border-radius:10px !important;
    border:1px solid #d9d9d9 !important;
    background:#fff;
    font-size:15px;
    line-height:1.2;
  }
  /* dezactivează look-ul nativ “înalt” pe unele browsere */
  input[type="date"], input[type="time"]{
    -webkit-appearance:none; appearance:none;
  }

  /* 3) Ascunde câmpurile extra: Passengers / Suitcases / Hand Luggage */
  #passengers, #luggage_large, #luggage_small{ display:none !important; }
  label[for="passengers"], label[for="luggage_large"], label[for="luggage_small"]{ display:none !important; }
  @supports(selector(.ctb-col:has(#passengers))){
    .ctb-col:has(#passengers),
    .ctb-col:has(#luggage_large),
    .ctb-col:has(#luggage_small){ display:none !important; }
  }

  /* 4) Buton principal pe 100% */
  .ctb-btn.ctb-btn-primary{ width:100%; height:52px; font-size:1.05rem; }

  /* 5) Nu atinge iconițele: dacă ai wrappers pentru iconițe, păstrăm spațiul */
  .input-icon, .with-icon{ position:relative; }
  .input-icon i, .with-icon i{
    position:absolute; left:12px; top:50%; transform:translateY(-50%);
    pointer-events:none;
  }
  .input-icon input, .with-icon input,
  .input-icon select, .with-icon select{
    padding-left:38px !important;
  }

  /* 6) Extras pe 1 col și card mașină compact pe mobil */
  .ctb-extras-grid{grid-template-columns:1fr;}

  .ctb-vehicle-option{
    padding:12px;
    gap:10px;
    align-items:center;
  }

  .ctb-vehicle-option img{
    width:90px;
    height:auto;
    flex:0 0 90px;
  }

  .ctb-vehicle-price{
    margin-left:auto;
    margin-top:0;
    font-size:16px;
  }
}

/* ===== Modal (fallbacks) ===== */
.ctb-modal{display:none;position:fixed;inset:0;z-index:9999}
.ctb-modal.is-open{display:block}
.ctb-modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.ctb-modal__dialog{position:relative;margin:10vh auto;max-width:560px;background:#fff;border-radius:12px;padding:20px;outline:0}
.ctb-modal-close{position:absolute;top:8px;right:10px;background:transparent;border:0;font-size:26px;line-height:1;cursor:pointer}
.ctb-no-scroll{overflow:hidden}

/* === MOBILE: show tabs as segmented switch + hours field full width === */
@media (max-width:640px){
  /* forțează afișarea taburilor pe mobil (anulează hide-ul anterior) */
  .ctb-tabs{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:6px;
    padding:4px;
    background:#f3f4f6;
    border:1px solid #e5e7eb;
    border-radius:12px;
    margin-bottom:10px;
  }
  .ctb-tab{
    border:0;
    background:transparent;
    border-radius:10px;
    padding:10px 12px;
    font-weight:700;
    color:#475569;
  }
  .ctb-tab.active{
    background:#ffffff;
    color:#0f172a;
    border:1px solid #e5e7eb;
    box-shadow:0 1px 2px rgba(0,0,0,.06);
  }

  /* "Hours" stă sub switch și ia toată lățimea */
  #hours-field-wrap{
    grid-column:1 / -1;
    margin-left:0;
  }
  #hours-field-wrap input{ width:100%; }
}

/* === MOBILE: show tabs as segmented switch + fix visibility === */
@media (max-width:640px){
  .ctb-tabs{
    display:grid !important;
    visibility:visible !important;
    pointer-events:auto !important;
    grid-template-columns:1fr 1fr;
    gap:6px;
    padding:4px;
    background:#f3f4f6;
    border:1px solid #e5e7eb;
    border-radius:12px;
    margin-bottom:10px;
  }
  .ctb-tab{
    display:block !important;
    border:0;
    background:transparent;
    border-radius:10px;
    padding:10px 12px;
    font-weight:700;
    color:#475569;
  }
  .ctb-tab.active{
    background:#ffffff;
    color:#0f172a;
    border:1px solid #e5e7eb;
    box-shadow:0 1px 2px rgba(0,0,0,.06);
  }

  #hours-field-wrap{
    grid-column:1 / -1;
    margin-left:0;
  }
  #hours-field-wrap input{ width:100%; }
}

#ctb-thank-you-modal[aria-hidden="true"] { display: none; }
#ctb-thank-you-modal .ctb-modal_dialog { position: relative; }
#ctb-thank-you-modal .ctb-modal-close {
  position: absolute; top: 10px; right: 12px; cursor: pointer;
  border: 0; background: transparent; font-size: 20px; line-height: 1;
}
body.ctb-no-scroll { overflow: hidden; }

/* ===========================================================
   COMPACT MODE PENTRU BOOKING FORM (tip Blacklane)
   =========================================================== */
#ctb-booking-form-container{
  max-width:520px;
  margin:24px auto;
  box-shadow:0 8px 20px rgba(0,0,0,.06);
}

#ctb-booking-form-container #ctb-booking-form{
  padding:18px 20px;
}

/* rândurile dintre câmpuri – mai puțin aer */
#ctb-booking-form-container .ctb-row{
  margin:0 0 8px !important;
}

/* coloane fără padding lateral suplimentar (controlăm din gap-ul intern) */
#ctb-booking-form-container .ctb-col{
  padding:0;
  min-width:0;
}

/* label + input mai apropiate */
#ctb-booking-form-container #ctb-booking-form label{
  margin:0 0 4px;
  font-size:12px;
}

/* inputuri mai joase și cu padding redus */
#ctb-booking-form-container #ctb-booking-form input[type="text"],
#ctb-booking-form-container #ctb-booking-form input[type="date"],
#ctb-booking-form-container #ctb-booking-form input[type="time"],
#ctb-booking-form-container #ctb-booking-form input[type="number"],
#ctb-booking-form-container #ctb-booking-form select{
  height:38px;
  padding:8px 10px;
  font-size:14px;
}

/* distanța + durata – badge-uri mai compacte */
#ctb-booking-form-container .ctb-distance-info{
  margin-top:8px;
  padding:8px 10px;
  font-size:13px;
}

/* ===== TWEAKS: WIDTH PE PAS, HEADER, PRET, BACK BUTTON ===== */

/* Step 2-3-4: formular mai lat (Blacklane-style) */
#ctb-booking-form-container{
  max-width:780px;
}

/* Step 1: mai îngust (aprox. 70% din lățimea inițială) */
#ctb-booking-form-container.ctb-step-1-narrow{
  max-width:380px;
}

/* Titlul de pas – text alb, să se vadă mereu */
#ctb-booking-form-container .ctb-form-header h3{
  margin:0 0 10px;
  font-size:18px;
  font-weight:700;
  color:#ffffff;
}

/* DAR în Step 1 nu vrem header deloc */
#ctb-step-1 .ctb-form-header{
  display:none;
}

/* Preț mașină în Step 2 – mai puțin bold */
#ctb-booking-form-container .ctb-vehicle-price{
  font-weight:600;
}

/* Butonul BACK – text negru și fundal deschis */
#ctb-booking-form-container .ctb-navigation .ctb-btn.ctb-prev-step{
  color:#111827;
  background:#f3f4f6;
}

/* Step 1 – ascundem Passengers / Suitcases / Hand Luggage */
#ctb-step-1 label[for="passengers"],
#ctb-step-1 #passengers,
#ctb-step-1 label[for="luggage_large"],
#ctb-step-1 #luggage_large,
#ctb-step-1 label[for="luggage_small"],
#ctb-step-1 #luggage_small{
  display:none !important;
}

/* Step 3 – lăsăm doar Flight Number (ascundem Gate + Terminal) */
#ctb-step-3 label[for="gate_number"],
#ctb-step-3 #gate_number,
#ctb-step-3 label[for="terminal"],
#ctb-step-3 #terminal{
  display:none !important;
}

/* By the hour – label la fel ca restul câmpurilor */
#ctb-step-1 #hours-field-wrap{
  margin:6px 0 10px;
  width:100%;
  max-width:100%;
  display:none;         /* controlat din JS */
  flex-direction:column;
  align-items:stretch;
  text-align:left;      /* ← NU mai centrat */
}

#ctb-step-1 #hours-field-wrap label{
  display:block;
  text-align:left;      /* ← forțăm alinierea la stânga */
  font-size:12px;
  font-weight:600;
      margin-right: auto !important;
}

#ctb-step-1 #hours-field-wrap input{
  width:100% !important;
  max-width:100%;
  border-radius:10px;
  border:1px solid #e5e7eb;
  padding:8px 10px;
  font-size:14px;
  box-sizing:border-box;
}

/* anulăm margin-left:auto din atributul inline */
#hours-field-wrap{
  margin-left:0 !important;
}
/* PRICE BADGE: mai mic + mai jos */
.route-card .route-price,
.btb-route-card .route-price,
.route-widget .route-price{
  font-size: 18px;          /* era prea mare */
  padding: 10px 12px;
  border-radius: 14px;
  align-self: flex-end;     /* îl împinge în jos */
  margin-top: 10px;         /* îl coboară */
  line-height: 1;
}
/* TEXT: orașele nu se mai taie pe mobil */
@media (max-width: 640px){
  .route-card .route-cities,
  .btb-route-card .route-cities,
  .route-widget .route-cities{
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
    max-width: 100%;
    line-height: 1.15;
  }

  /* dacă ai câte un span pentru oraș plecare/destinație */
  .route-card .route-city,
  .btb-route-card .route-city,
  .route-widget .route-city{
    display: inline-block;
    max-width: 100%;
    white-space: normal !important;
    font-size: 14px;
  }
}
@media (max-width: 640px){
  .route-card .route-top,
  .btb-route-card .route-top,
  .route-widget .route-top{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .route-card .route-price,
  .btb-route-card .route-price,
  .route-widget .route-price{
    align-self: flex-start; /* nu mai stă în dreapta */
    margin-top: 2px;
    font-size: 16px;
    padding: 8px 10px;
  }
}
/* =========================================================
   ROUTE WIDGET / ROUTE CARDS — price + cities mobile fix
   ========================================================= */

/* 1) badge preț: mai mic (desktop + mobile) */
.route-price,
.price-pill,
.price-badge,
[class*="price"][class*="badge"],
[class*="price"][class*="pill"]{
  font-size: 18px !important;
  padding: 10px 12px !important;
  border-radius: 16px !important;
  line-height: 1 !important;
}

/* 2) dacă prețul e într-un container în dreapta (flex), îl coborâm */
@media (min-width: 641px){
  .route-card,
  .btb-route-card,
  .route-item{
    align-items: flex-start;
  }

  .route-price,
  .price-pill,
  .price-badge{
    margin-top: 18px !important; /* îl coboară sub linia de orașe */
  }
}

/* 3) MOBILE: orașele să nu se taie, să facă wrap */
@media (max-width: 640px){
  /* orice titlu/linie cu orașe: scoatem ellipsis */
  .route-title,
  .route-cities,
  .route-from,
  .route-to,
  .trip-title,
  .from-city,
  .to-city,
  .city,
  [class*="city"],
  [class*="from"],
  [class*="to"]{
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
    max-width: 100% !important;
    word-break: break-word;
  }

  /* 4) MOBILE: punem prețul sub blocul de sus (în loc de colț dreapta) */
  .route-card,
  .btb-route-card,
  .route-item{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .route-price,
  .price-pill,
  .price-badge{
    font-size: 16px !important;
    padding: 8px 10px !important;
    margin-top: 0 !important;
    align-self: flex-start !important;
  }
}
/* =========================================================
   ROUTE WIDGET / ROUTE CARDS — price + cities mobile fix
   ========================================================= */

/* 1) badge preț: mai mic (desktop + mobile) */
.route-price,
.price-pill,
.price-badge,
[class*="price"][class*="badge"],
[class*="price"][class*="pill"]{
  font-size: 18px !important;
  padding: 10px 12px !important;
  border-radius: 16px !important;
  line-height: 1 !important;
}

/* 2) dacă prețul e într-un container în dreapta (flex), îl coborâm */
@media (min-width: 641px){
  .route-card,
  .btb-route-card,
  .route-item{
    align-items: flex-start;
  }

  .route-price,
  .price-pill,
  .price-badge{
    margin-top: 18px !important; /* îl coboară sub linia de orașe */
  }
}

/* 3) MOBILE: orașele să nu se taie, să facă wrap */
@media (max-width: 640px){
  /* orice titlu/linie cu orașe: scoatem ellipsis */
  .route-title,
  .route-cities,
  .route-from,
  .route-to,
  .trip-title,
  .from-city,
  .to-city,
  .city,
  [class*="city"],
  [class*="from"],
  [class*="to"]{
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: initial !important;
    max-width: 100% !important;
    word-break: break-word;
  }

  /* 4) MOBILE: punem prețul sub blocul de sus (în loc de colț dreapta) */
  .route-card,
  .btb-route-card,
  .route-item{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .route-price,
  .price-pill,
  .price-badge{
    font-size: 16px !important;
    padding: 8px 10px !important;
    margin-top: 0 !important;
    align-self: flex-start !important;
  }
}
/* ===============================
   WIDGET — arrow + View details
   =============================== */

/* 1) “View details” — mai vizibil, mai mare, fără opacity mic */
.view-details,
.viewDetails,
.route-view-details,
.route-details-toggle,
a[href*="details"],
button[aria-expanded],
button:has(svg),
button:has(i){
  font-size: 14px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  color: #0f172a !important;
}

/* 2) săgeata (icon / svg / i) — să se vadă clar */
.view-details svg,
.viewDetails svg,
.route-details-toggle svg,
button[aria-expanded] svg,
.view-details i,
.viewDetails i,
.route-details-toggle i,
button[aria-expanded] i{
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
  opacity: 1 !important;
  display: inline-block !important;
  transform: translateY(1px);
}

/* 3) Dacă săgeata e făcută din ::after sau e “ascunsă”,
      îi punem noi una vizibilă lângă text */
.view-details:after,
.viewDetails:after,
.route-details-toggle:after{
  content: " ▼" !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  opacity: 1 !important;
  display: inline-block !important;
  margin-left: 6px !important;
}

/* 4) Mobile: mai mult spațiu și hit-area mai mare */
@media (max-width: 640px){
  .view-details,
  .viewDetails,
  .route-details-toggle,
  button[aria-expanded]{
    padding: 10px 12px !important;
    border-radius: 10px !important;
  }
}
/* ==============================
   BTB ROUTES LIST — View details + arrow
   Scope: only inside the widget
   ============================== */

.btb-route-list .btb-route-card{
  position: relative;
}

/* “View details” (or orice toggle din partea de jos) */
.btb-route-list .btb-route-card .btb-route-details-toggle,
.btb-route-list .btb-route-card .btb-route-toggle,
.btb-route-list .btb-route-card .btb-route-expand-btn,
.btb-route-list .btb-route-card .btb-route-more,
.btb-route-list .btb-route-card [data-action="toggle"],
.btb-route-list .btb-route-card button{
  font-size: 13px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  color: #0f172a !important;
}

/* Forțăm săgeata să existe și să fie vizibilă (dacă nu e svg) */
.btb-route-list .btb-route-card .btb-route-details-toggle::after,
.btb-route-list .btb-route-card .btb-route-toggle::after,
.btb-route-list .btb-route-card .btb-route-expand-btn::after,
.btb-route-list .btb-route-card .btb-route-more::after,
.btb-route-list .btb-route-card [data-action="toggle"]::after{
  content: "▼" !important;
  display: inline-block !important;
  margin-left: 10px !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  transform: translateY(1px);
  transition: transform .18s ease;
}

/* Dacă ai un svg/icon existent, îl facem mare și vizibil */
.btb-route-list .btb-route-card svg,
.btb-route-list .btb-route-card i{
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
  opacity: 1 !important;
}

/* Rotație săgeată când e deschis:
   - fie card-ul primește .is-open
   - fie expand-ul are display/block și poți marca prin .is-open (cel mai ok) */
.btb-route-list .btb-route-card.is-open .btb-route-details-toggle::after,
.btb-route-list .btb-route-card.is-open .btb-route-toggle::after,
.btb-route-list .btb-route-card.is-open .btb-route-expand-btn::after,
.btb-route-list .btb-route-card.is-open .btb-route-more::after,
.btb-route-list .btb-route-card.is-open [data-action="toggle"]::after{
  transform: rotate(180deg) translateY(-1px);
}

/* Mobile: să nu mai fie “înghesuit” jos */
@media (max-width: 640px){
  .btb-route-list .btb-route-card .btb-route-details-toggle,
  .btb-route-list .btb-route-card .btb-route-toggle,
  .btb-route-list .btb-route-card .btb-route-expand-btn,
  .btb-route-list .btb-route-card .btb-route-more,
  .btb-route-list .btb-route-card [data-action="toggle"]{
    padding: 10px 12px !important;
    border-radius: 12px !important;
  }
}
/* ==============================
   BTB ROUTES LIST — View details + arrow
   Scope: only inside the widget
   ============================== */

.btb-route-list .btb-route-card{
  position: relative;
}

/* “View details” (or orice toggle din partea de jos) */
.btb-route-list .btb-route-card .btb-route-details-toggle,
.btb-route-list .btb-route-card .btb-route-toggle,
.btb-route-list .btb-route-card .btb-route-expand-btn,
.btb-route-list .btb-route-card .btb-route-more,
.btb-route-list .btb-route-card [data-action="toggle"],
.btb-route-list .btb-route-card button{
  font-size: 13px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  color: #0f172a !important;
}

/* Forțăm săgeata să existe și să fie vizibilă (dacă nu e svg) */
.btb-route-list .btb-route-card .btb-route-details-toggle::after,
.btb-route-list .btb-route-card .btb-route-toggle::after,
.btb-route-list .btb-route-card .btb-route-expand-btn::after,
.btb-route-list .btb-route-card .btb-route-more::after,
.btb-route-list .btb-route-card [data-action="toggle"]::after{
  content: "▼" !important;
  display: inline-block !important;
  margin-left: 10px !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  opacity: 1 !important;
  transform: translateY(1px);
  transition: transform .18s ease;
}

/* Dacă ai un svg/icon existent, îl facem mare și vizibil */
.btb-route-list .btb-route-card svg,
.btb-route-list .btb-route-card i{
  width: 18px !important;
  height: 18px !important;
  font-size: 18px !important;
  opacity: 1 !important;
}

/* Rotație săgeată când e deschis:
   - fie card-ul primește .is-open
   - fie expand-ul are display/block și poți marca prin .is-open (cel mai ok) */
.btb-route-list .btb-route-card.is-open .btb-route-details-toggle::after,
.btb-route-list .btb-route-card.is-open .btb-route-toggle::after,
.btb-route-list .btb-route-card.is-open .btb-route-expand-btn::after,
.btb-route-list .btb-route-card.is-open .btb-route-more::after,
.btb-route-list .btb-route-card.is-open [data-action="toggle"]::after{
  transform: rotate(180deg) translateY(-1px);
}

/* Mobile: să nu mai fie “înghesuit” jos */
@media (max-width: 640px){
  .btb-route-list .btb-route-card .btb-route-details-toggle,
  .btb-route-list .btb-route-card .btb-route-toggle,
  .btb-route-list .btb-route-card .btb-route-expand-btn,
  .btb-route-list .btb-route-card .btb-route-more,
  .btb-route-list .btb-route-card [data-action="toggle"]{
    padding: 10px 12px !important;
    border-radius: 12px !important;
  }
}
/* Respect Elementor boxed container */
.btb-route-search{
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0 14px;
  box-sizing: border-box;
}

.btb-route-list{
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

/* Asigură-te că nimic nu ia 100vw */
.btb-route-search,
.btb-route-search *{
  box-sizing: border-box;
}
