/* =========================================================
   CRM Fresh MU 7.0.2.5.4R.12.4 — FRONTEND PREMIUM CTA FINAL
   Mục tiêu:
   - Nút chọn xe / chiều đi chìm hơn, không cạnh tranh CTA.
   - Nút Đặt xe / Đặt xe ngay nổi bật nhưng vàng premium mềm, không chói.
   - Dùng selector có phạm vi quanh form/landing để tránh ảnh hưởng toàn site.
========================================================= */

:root{
  --dx-cta-gold:#d7aa2b;
  --dx-cta-gold-2:#f0d46b;
  --dx-cta-gold-soft:rgba(215,170,43,.34);
  --dx-cta-bg:#07110d;
  --dx-cta-bg-2:#101713;
  --dx-cta-line:rgba(215,170,43,.24);
  --dx-cta-line-soft:rgba(255,255,255,.12);
  --dx-cta-text:#f8fafc;
  --dx-cta-muted:rgba(226,232,240,.72);
}

/* =========================
   Option buttons: 4/7 chỗ, 1/2 chiều
   Cho chìm hơn, active chỉ sáng vừa đủ.
========================= */
:is(
  #bk_form_dat_xe,
  .dx-landing-v2,
  .dx-booking,
  .dx-booking-widget,
  .dx-price-widget,
  .dx-quick-price,
  .ep-route-booking,
  .ep-booking-widget,
  .route-price-panel,
  .xp14_booking,
  .xp14-booking,
  .xp14_form,
  .xp14-form
)
:is(
  .vehicle-option,
  .car-option,
  .trip-option,
  .service-option,
  .option-btn,
  .choice-btn,
  .dx-option,
  .dx-choice,
  .dx-car-option,
  .dx-trip-option,
  .ep-option,
  .ep-choice,
  .ep-car-option,
  .ep-trip-option,
  .xp14-option,
  .xp14-choice,
  button[data-car],
  button[data-vehicle],
  button[data-trip],
  button[data-service],
  [role="button"][data-car],
  [role="button"][data-vehicle],
  [role="button"][data-trip],
  [role="button"][data-service]
){
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 38%),
    linear-gradient(180deg,rgba(18,24,21,.82),rgba(6,11,9,.92))!important;
  border:1px solid var(--dx-cta-line-soft)!important;
  color:var(--dx-cta-muted)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045)!important;
  text-shadow:none!important;
  filter:none!important;
  transform:none!important;
}

:is(
  #bk_form_dat_xe,
  .dx-landing-v2,
  .dx-booking,
  .dx-booking-widget,
  .dx-price-widget,
  .dx-quick-price,
  .ep-route-booking,
  .ep-booking-widget,
  .route-price-panel,
  .xp14_booking,
  .xp14-booking,
  .xp14_form,
  .xp14-form
)
:is(
  .vehicle-option.active,
  .vehicle-option.is-active,
  .vehicle-option.selected,
  .vehicle-option[aria-pressed="true"],
  .car-option.active,
  .car-option.is-active,
  .car-option.selected,
  .car-option[aria-pressed="true"],
  .trip-option.active,
  .trip-option.is-active,
  .trip-option.selected,
  .trip-option[aria-pressed="true"],
  .service-option.active,
  .service-option.is-active,
  .service-option.selected,
  .service-option[aria-pressed="true"],
  .option-btn.active,
  .option-btn.is-active,
  .option-btn.selected,
  .option-btn[aria-pressed="true"],
  .choice-btn.active,
  .choice-btn.is-active,
  .choice-btn.selected,
  .choice-btn[aria-pressed="true"],
  .dx-option.active,
  .dx-option.is-active,
  .dx-option.selected,
  .dx-option[aria-pressed="true"],
  .dx-choice.active,
  .dx-choice.is-active,
  .dx-choice.selected,
  .dx-choice[aria-pressed="true"],
  .ep-option.active,
  .ep-option.is-active,
  .ep-option.selected,
  .ep-option[aria-pressed="true"],
  .ep-choice.active,
  .ep-choice.is-active,
  .ep-choice.selected,
  .ep-choice[aria-pressed="true"],
  button[data-car].active,
  button[data-car].is-active,
  button[data-car].selected,
  button[data-car][aria-pressed="true"],
  button[data-vehicle].active,
  button[data-vehicle].is-active,
  button[data-vehicle].selected,
  button[data-vehicle][aria-pressed="true"],
  button[data-trip].active,
  button[data-trip].is-active,
  button[data-trip].selected,
  button[data-trip][aria-pressed="true"],
  button[data-service].active,
  button[data-service].is-active,
  button[data-service].selected,
  button[data-service][aria-pressed="true"]
){
  background:
    linear-gradient(180deg,rgba(215,170,43,.30),rgba(215,170,43,.14) 45%,rgba(7,12,10,.92))!important;
  border-color:rgba(215,170,43,.46)!important;
  color:#f6e8b4!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 8px 20px rgba(0,0,0,.18)!important;
}

/* Hover option: chỉ nhích nhẹ, không phát sáng */
:is(
  #bk_form_dat_xe,
  .dx-landing-v2,
  .dx-booking,
  .dx-booking-widget,
  .dx-price-widget,
  .dx-quick-price,
  .ep-route-booking,
  .ep-booking-widget,
  .route-price-panel,
  .xp14_booking,
  .xp14-booking,
  .xp14_form,
  .xp14-form
)
:is(
  .vehicle-option,
  .car-option,
  .trip-option,
  .service-option,
  .option-btn,
  .choice-btn,
  .dx-option,
  .dx-choice,
  .ep-option,
  .ep-choice,
  button[data-car],
  button[data-vehicle],
  button[data-trip],
  button[data-service]
):hover{
  border-color:rgba(215,170,43,.34)!important;
  background:
    linear-gradient(180deg,rgba(215,170,43,.12),rgba(255,255,255,.02) 42%),
    linear-gradient(180deg,rgba(18,24,21,.86),rgba(6,11,9,.94))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055)!important;
}

/* =========================
   Main CTA: Đặt xe / Đặt xe ngay
   Vàng premium mềm, nổi hơn option nhưng không chói.
========================= */
:is(
  #bk_form_dat_xe,
  .dx-landing-v2,
  .dx-booking,
  .dx-booking-widget,
  .dx-price-widget,
  .dx-quick-price,
  .ep-route-booking,
  .ep-booking-widget,
  .route-price-panel,
  .xp14_booking,
  .xp14-booking,
  .xp14_form,
  .xp14-form
)
:is(
  .booking-submit,
  .book-submit,
  .btn-booking,
  .btn-book-now,
  .cta-book,
  .dx-submit,
  .dx-book-now,
  .dx-cta,
  .ep-submit,
  .ep-book-now,
  .ep-cta,
  .xp14-submit,
  .xp14-book-now,
  .xp14-cta,
  button[type="submit"],
  a[href*="tel:"].main-cta
){
  background:
    linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,0) 28%),
    linear-gradient(180deg,var(--dx-cta-gold-2),var(--dx-cta-gold))!important;
  border:1px solid rgba(255,231,152,.70)!important;
  color:#121212!important;
  font-weight:800!important;
  letter-spacing:.01em!important;
  text-shadow:0 1px 0 rgba(255,255,255,.18)!important;
  box-shadow:
    0 14px 30px rgba(215,170,43,.22),
    inset 0 1px 0 rgba(255,255,255,.32)!important;
  filter:none!important;
}

:is(
  #bk_form_dat_xe,
  .dx-landing-v2,
  .dx-booking,
  .dx-booking-widget,
  .dx-price-widget,
  .dx-quick-price,
  .ep-route-booking,
  .ep-booking-widget,
  .route-price-panel,
  .xp14_booking,
  .xp14-booking,
  .xp14_form,
  .xp14-form
)
:is(
  .booking-submit,
  .book-submit,
  .btn-booking,
  .btn-book-now,
  .cta-book,
  .dx-submit,
  .dx-book-now,
  .dx-cta,
  .ep-submit,
  .ep-book-now,
  .ep-cta,
  .xp14-submit,
  .xp14-book-now,
  .xp14-cta,
  button[type="submit"]
):hover{
  background:
    linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,0) 30%),
    linear-gradient(180deg,#f4d879,#cfa12d)!important;
  border-color:rgba(255,235,172,.82)!important;
  transform:translateY(-1px)!important;
  box-shadow:
    0 16px 34px rgba(215,170,43,.25),
    inset 0 1px 0 rgba(255,255,255,.34)!important;
}

/* Price box CTA side: bớt glow nền vàng quanh CTA */
:is(
  .dx-price-widget,
  .dx-quick-price,
  .ep-route-booking,
  .ep-booking-widget,
  .route-price-panel,
  #bk_form_dat_xe
)
:is(.price-box,.price-summary,.booking-price,.dx-price-box,.ep-price-box,.xp14-price-box){
  border-color:rgba(215,170,43,.24)!important;
  box-shadow:0 18px 46px rgba(0,0,0,.34),0 0 24px rgba(215,170,43,.055)!important;
}
