/*
 * Single-Variable Theme System
 * ─────────────────────────────────────────────────────────────────────────────
 * Every brand color on the page derives from --brand-primary.
 * To retheme any customer site, define these variables in :root inside
 * that customer's jlimo.custom.css — everything below updates automatically.
 *
 *   :root {
 *     --brand-primary:       #848A97;
 *     --brand-primary-light: #A5B4C7;
 *     --brand-primary-hover: #6f7786;
 *     --brand-on-primary:    #ffffff;
 *     --brand-dropdown-link: #848A97;
 *     --brand-user-id:       #848A97;
 *     --brand-toolbar-icon:  #848A97;
 *     --brand-review-title:  #848A97;
 *     --brand-now-bg:        #848A97;
 *     --brand-now-text:      #ffffff;
 *     --brand-now-border:    #848A97;
 *     --brand-cta-bg:        #848A97;
 *     --brand-cta-text:      #ffffff;
 *     --brand-modal-header:  #848A97;
 *     --brand-svg-filter:    invert(57%) sepia(8%) saturate(391%)
 *                            hue-rotate(182deg) brightness(93%) contrast(88%);
 *   }
 *
 * SVG filter generator: https://codepen.io/sosuke/pen/Pjoqqp
 * ─────────────────────────────────────────────────────────────────────────────
 */

/* ── Filled buttons ────────────────────────────────────────────────────────── */
.btn-primary,
.loginButton,
.changeColor,
.submitReservationBtn,
.apply-coupon-btn,
.tabJobs-save-jobs,
.btn-confirm,
#loginBtn,
#confirmCancelBtn,
#cancelNoThanksBtn,
#signupSubmitBtn,
#turn,
#turn2,
#goBack,
#continue {
  background-color: var(--brand-primary, #4a90e2) !important;
  border-color:     var(--brand-primary, #4a90e2) !important;
  color:            var(--brand-on-primary, #ffffff) !important;
}

/* ── Hover / active states ─────────────────────────────────────────────────── */
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.loginButton:hover,
.loginButton:focus,
.changeColor:hover,
.changeColor:focus,
.submitReservationBtn:hover,
.submitReservationBtn:focus,
.apply-coupon-btn:hover,
.apply-coupon-btn:focus,
.tabJobs-save-jobs:hover,
.tabJobs-save-jobs:focus,
.btn-confirm:hover,
.btn-confirm:focus,
#loginBtn:hover,
#loginBtn:focus,
#confirmCancelBtn:hover,
#cancelNoThanksBtn:hover {
  background-color: var(--brand-primary, #4a90e2) !important;
  border-color:     var(--brand-primary, #4a90e2) !important;
  color:            var(--brand-on-primary, #ffffff) !important;
  filter: brightness(0.88);
}

/* ── Modal header ──────────────────────────────────────────────────────────── */
.ModalHeader,
.modal-header {
  background-color: var(--brand-modal-header, var(--brand-primary, #4a90e2)) !important;
}

/* ── Accent / panel text ───────────────────────────────────────────────────── */
.panel-title,
.tabjobs-heading-reslist,
.tjd-tripDsplNo-heading,
.tabJobs-tripNumber,
.subheading-review-confirm-msg,
.title-review-confirm-msg,
#reviewCofirmMessage > ul > li > i,
#shuttle-stop-link,
#acctFop,
#acctFop i,
#enter_cc_info,
#changetrips-popover-container > .changetrips-popover-link,
#tjr-changetrips-popover-container > .tjr-changetrips-popover-link {
  color: var(--brand-primary, #4a90e2) !important;
}

.review-head > p {
  color: var(--brand-review-title, var(--brand-primary, #4a90e2)) !important;
}

/* ── Inline links that carry the brand color ───────────────────────────────── */
a.DropdownLink,
#clearBtn {
  color: var(--brand-primary, #4a90e2) !important;
}

#dropdownMenu a {
  color: var(--brand-dropdown-link, var(--brand-primary, #4a90e2)) !important;
}

#user-id {
  color: var(--brand-user-id, var(--brand-dropdown-link, var(--brand-primary, #4a90e2))) !important;
}

/* ── Dedicated button/pill tokens ─────────────────────────────────────────── */
#setDateTimeNow + label,
.dateTimeCheckBoxLabel {
  background-color: var(--brand-now-bg, var(--brand-primary, #4a90e2)) !important;
  border-color: var(--brand-now-border, var(--brand-now-bg, var(--brand-primary, #4a90e2))) !important;
  color: var(--brand-now-text, var(--brand-on-primary, #ffffff)) !important;
}

#setDateTimeNow:checked + label,
#setDateTimeNow:hover + label,
.dateTimeCheckBoxLabel:hover,
.dateTimeCheckBoxLabel:focus {
  background-color: var(--brand-now-bg, var(--brand-primary, #4a90e2)) !important;
  border-color: var(--brand-now-border, var(--brand-now-bg, var(--brand-primary, #4a90e2))) !important;
  color: var(--brand-now-text, var(--brand-on-primary, #ffffff)) !important;
}

.submitReservationBtn {
  background-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  border-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  color: var(--brand-cta-text, var(--brand-on-primary, #ffffff)) !important;
}

.submitReservationBtn:hover,
.submitReservationBtn:focus,
.submitReservationBtn:active {
  background-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  border-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  color: var(--brand-cta-text, var(--brand-on-primary, #ffffff)) !important;
}

#loginBtn,
#btnSaveJob,
.changeColor.btn.btn-primary,
#payment_form button.btn.btn-primary,
#addAcct_Submit {
  background-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  border-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  color: var(--brand-cta-text, var(--brand-on-primary, #ffffff)) !important;
}

#loginBtn:hover,
#loginBtn:focus,
#loginBtn:active,
#btnSaveJob:hover,
#btnSaveJob:focus,
#btnSaveJob:active,
.changeColor.btn.btn-primary:hover,
.changeColor.btn.btn-primary:focus,
.changeColor.btn.btn-primary:active {
  background-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  border-color: var(--brand-cta-bg, var(--brand-primary, #4a90e2)) !important;
  color: var(--brand-cta-text, var(--brand-on-primary, #ffffff)) !important;
}

/* ── Shared icon color hooks ──────────────────────────────────────────────── */
.custom-color-toolbar-icon,
.utility-icons-clr,
.custom-icons-wrapper,
.custom-icons-wrapper i,
.custom-icons-wrapper .fa,
.custom-icons-wrapper .fas,
.custom-icons-wrapper .far,
.custom-icons-wrapper .fal,
.custom-icons-wrapper .fab,
i.custom-color-toolbar-icon,
i.utility-icons-clr,
.fa.custom-color-toolbar-icon,
.fas.custom-color-toolbar-icon,
.far.custom-color-toolbar-icon,
.fal.custom-color-toolbar-icon,
.fab.custom-color-toolbar-icon,
.fa.utility-icons-clr,
.fas.utility-icons-clr,
.far.utility-icons-clr,
.fal.utility-icons-clr,
.fab.utility-icons-clr {
  color: var(--brand-toolbar-icon, var(--brand-primary, #4a90e2)) !important;
}

/* ── SVG <img> icons: add class="brand-svg-icon" to recolor ────────────────── */
.brand-svg-icon,
.airplane-pu-icon-dropdown,
.airplane-do-icon-dropdown,
.remove-stop {
  filter: var(--brand-svg-filter, none);
}

/* ── Shared raster/icon-image hooks ───────────────────────────────────────── */
.drop-down-background-img,
.dropdown-img-trip-list,
.dropdown-img-jobs-with-complaint-list,
.dropdown-img-manage-bookers,
.dropdown-img-recurring-trips,
.dropdown-img-my-downloads,
.received-trips-link-toolbar,
.complaint-trips-link-toolbar,
.scheduled-trips-link-toolbar,
.manage-booker-link-toolbar,
.my-downloads-link-toolbar,
.localCrBtn {
  filter: var(--brand-svg-filter, none);
}

/*.arrow-changetrips-popover-link {*/
/*  border-top-color: var(--brand-primary, #4a90e2) !important;*/
/*}*/

/* ── jQuery-UI limosys dialogs ($.limosys.alert / $.limosys.confirm) ──────── */
.ui-widget-overlay {
  background: rgba(0, 0, 0, 0.55) !important;
  opacity: 1 !important;
}
.jlimo-dialog {
  border: 0 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
  padding: 0 !important;
}
.jlimo-dialog .ui-dialog-titlebar {
  background: var(--brand-modal-header, #4a90e2) !important;
  border: 0 !important;
  border-radius: 8px 8px 0 0 !important;
  padding: 10px 14px !important;
}
.jlimo-dialog .ui-dialog-title {
  color: var(--brand-on-primary, #ffffff) !important;
  font-weight: 600 !important;
}
/* Modern close button: transparent circle, white X, soft hover */
.jlimo-dialog .ui-dialog-titlebar-close {
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  transform: translateY(-50%) !important;
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  outline: none !important;
}
.jlimo-dialog .ui-dialog-titlebar-close:hover,
.jlimo-dialog .ui-dialog-titlebar-close:focus {
  background: rgba(255, 255, 255, 0.2) !important;
  border: 0 !important;
}
/* Close icon: Font Awesome times glyph instead of the legacy sprite/text */
.jlimo-dialog .ui-dialog-titlebar-close .ui-icon {
  background-image: none !important;
  text-indent: 0 !important;
  font-size: 0 !important;
  width: 14px !important;
  height: 14px !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  overflow: visible !important;
}
.jlimo-dialog .ui-dialog-titlebar-close .ui-icon::before {
  content: "\f00d" !important;
  font-family: 'Font Awesome 5 Free' !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  line-height: 1 !important;
  color: #ffffff !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
}
.jlimo-dialog .ui-dialog-content {
  color: #262626 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  text-align: center !important;
  padding: 22px 18px 8px !important;
}
.jlimo-dialog .ui-dialog-buttonpane {
  background: #ffffff !important;
  border-top: 0 !important;
  margin-top: 0 !important;
}
.jlimo-dialog .ui-dialog-buttonset {
  float: none !important;
  text-align: center !important;
}
/* Modern flat CTA: strip jQuery-UI gradient/shadow/text-shadow */
.jlimo-dialog .ui-dialog-buttonpane button {
  background-color: var(--brand-cta-bg, #4a90e2) !important;
  background-image: none !important;
  border: 0 !important;
  color: var(--brand-cta-text, #ffffff) !important;
  box-shadow: none !important;
  text-shadow: none !important;
  border-radius: 6px !important;
  min-width: 90px !important;
  padding: 8px 26px !important;
  font-family: 'Roboto', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}
.jlimo-dialog .ui-dialog-buttonpane button:hover,
.jlimo-dialog .ui-dialog-buttonpane button:focus {
  filter: brightness(0.88);
}