/* =========================
   Supplier Theme Overrides
   ========================= */

/*
  1) Brand tokens
  IMPORTANT:
  Tenant CSS variables are injected per-request in Views/Shared/_Layout.cshtml
  (so each supplier sees their own colors).
  
  If we define :root variables here, this static file will override the injected
  values and break theming.
*/

/* 2) Common text helpers used in your CSS */
.orange {
    color: var(--brand-primary, #f8af00) !important;
}

.blue {
    color: var(--brand-secondary, #144166) !important;
}

/* 3) Buttons (your custom classes) */
.btn-green,
.btn-orange {
    background-color: var(--brand-primary, #f8af00) !important;
    border-color: var(--brand-primary, #f8af00) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

.btn-blue {
    background-color: var(--brand-secondary, #144166) !important;
    border-color: var(--brand-secondary, #144166) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

.btn-cyan {
    background-color: var(--brand-accent, #67c3d3) !important;
    border-color: var(--brand-accent, #67c3d3) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

.btn-red {
    background-color: var(--brand-danger, #ed7768) !important;
    border-color: var(--brand-danger, #ed7768) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

/* 4) Headers / separators */
.home-separator {
    background-color: var(--brand-primary, #f8af00) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

.sm-line,
.link-strok {
    background-color: var(--brand-primary, #f8af00) !important;
}

/* 5) Cards hover border uses primary */
.borderd-details:hover {
    border-color: var(--brand-primary, #f8af00) !important;
}

/* 6) Ribbons (diagonal) */
.diagonal,
.diagonal2 {
    background: var(--brand-primary, #f8af00) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

/* 7) Datepicker (theme-green) */
.theme-green .bs-datepicker-head {
    background-color: var(--brand-primary, #f8af00) !important;
}

.theme-green .bs-datepicker-body table td.week span {
    color: var(--brand-primary, #f8af00) !important;
}

.theme-green .bs-datepicker-body table td span.selected,
.theme-green .bs-datepicker-body table td.selected span {
    background-color: var(--brand-secondary, #144166) !important;
}

/* 8) Slider (ng5) */
.ng5-slider .ng5-slider-selection {
    background: var(--brand-primary, #f8af00) !important;
}

.ng5-slider .ng5-slider-pointer {
    background-color: var(--brand-primary, #f8af00) !important;
}

/* 9) Pagination */
.pagination > .active > a,
.pagination > .active > span {
    background-color: var(--brand-primary, #f8af00) !important;
    border-color: var(--brand-primary, #f8af00) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

/* 10) Qty (+/-) buttons */
.plus2,
.minus {
    background-color: var(--brand-primary, #f8af00) !important;
    color: var(--brand-on-primary, #ffffff) !important;
}

    .plus2:hover,
    .minus:hover {
        background-color: var(--brand-secondary) !important;
    }

/* 11) noUi slider */
.noUi-connect {
    background: var(--brand-primary) !important;
}

.noUi-horizontal .noUi-handle {
    border-color: var(--brand-primary) !important;
}

/* 12) Dropdown menu hover */
.dropdown-menu2 > li > a:hover {
    background-color: var(--brand-primary) !important;
}

/* 13) Custom checkbox/radio checked */
.check input:checked ~ .checkmark,
.check input:checked ~ .radio2 {
    background-color: var(--brand-primary) !important;
}

/* 14) Footer hover */
.footer-list > li > a:hover {
    color: var(--brand-primary) !important;
}

.social > a:hover {
    border-color: var(--brand-primary) !important;
}

.copy {
    border-top-color: var(--brand-primary) !important;
}

/* Global links + focus states (common missed areas) */
a:hover,
a:focus {
    color: var(--brand-primary) !important;
}

/* Inputs focus */
input:focus, select:focus, textarea:focus {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 .2rem rgba(0,0,0,.05) !important;
}

/* If bootstrap-like classes exist */
.btn-primary {
    background-color: var(--brand-primary) !important;
    border-color: var(--brand-primary) !important;
}

.text-primary {
    color: var(--brand-primary) !important;
}

.bg-primary {
    background-color: var(--brand-primary) !important;
}

/* Secondary helpers */
.text-secondary {
    color: var(--brand-secondary) !important;
}

.bg-secondary {
    background-color: var(--brand-secondary) !important;
}


/* ------------------------------
   UX fixes for B2B pages
   ------------------------------ */

/* Ensure general controls are readable (DataTables filter, modal footers, etc.) */
input:not([type="checkbox"]):not([type="radio"]),
select, textarea {
  background-color: #fff;
  color: #333;
}

input::placeholder, textarea::placeholder {
  color: #8a8a8a;
  opacity: 1;
}

/* DataTables search box + length selector */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
  background-color: #fff !important;
  color: #333 !important;
  border: 1px solid #dcdcdc;
}

/* Traveler modal footer + buttons (make sure "Done" is visible) */
.modal-footer {
  background: #fff;
}

.modal-footer .btn,
.modal-footer button,
.modal-footer a.btn {
  color: var(--on-primary) !important;
  background: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
}

/* Hotel card right-side actions (price + select) – keep readable */
.hotel-card-details-sec .price,
.hotel-card-details-sec .total,
.hotel-card-details-sec .btn,
.hotel-card-details-sec button {
  color: #111;
}


/* ---- Fix low-contrast hover states (dropdowns / notifications / menus) ---- */
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus,
.dropdown-menu > li.active > a,
.dropdown-menu > li.active > a:hover,
.dropdown-menu > li.active > a:focus {
    background-color: var(--brand-primary) !important;
    color: #fff !important;
}

/* Some templates use custom notification list items */
.notification_list li:hover,
.notification_list li:hover a,
.notification_list li.active,
.notification_list li.active a {
    background-color: var(--brand-primary) !important;
    color: #fff !important;
}

/* Ensure icons/text inside hovered items stay readable */
.dropdown-menu > li > a:hover i,
.dropdown-menu > li > a:focus i,
.notification_list li:hover i,
.notification_list li.active i {
    color: #fff !important;
}