/* Varialbes will be replaced with proper Theme color when application runs. */
/* Please see theme.service.js for implementation.                           */
/* --primary: theme primary color                                            */
/* --secondary: theme secondary color                                        */
/* --borderRadius: theme value for the border radius                         */

/* ----- Defaults ----- */
span[type='button'],
span[type='submit'],
button {
  border-radius: --borderRadius;
}

span[type='button'].primary,
span[type='submit'].primary,
button.primary {
  border-color: --primary;
  background-color: --primary;
}

span[type='button'].primary.secondary-color,
span[type='submit'].primary.secondary-color,
button.primary.secondary-color {
  border-color: --secondary;
  background-color: --secondary;
}

span[type='button'].secondary,
span[type='submit'].secondary,
button.secondary {
  color: --primary;
  border-color: --primary;
}

select,
input {
  border-radius: --borderRadius !important;
}

input[type='radio']:checked {
  border-color: --primary;
}
input[type='radio']:checked:before {
  background-color: --primary;
}

select.form-control:focus,
input.form-control:focus,
.form-control:focus,
.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: --primary !important;
}

/* ----- Online Leasing ----- */
.link,
.deposit-insurance-list ul li::before {
  color: --primary;
}

.inline-link {
  color: --primary;
}

.link-more-less {
  color: --primary;
}
.link-more-less::after,
.link-more-less::before {
  background-color: --primary;
}

.custom-radio:before {
  background-color: --primary;
}

.selected .custom-radio,
.custom-radio.selected {
  border-color: --primary;
}

.custom-checkmark {
  border-radius: --borderRadius;
}

.selected .custom-checkmark,
.custom-checkmark.selected {
  border-color: --primary;
  background-color: --primary !important;
}

.tabs .tab.active {
  border-color: --primary;
}

.tiles-container .tile {
  border-radius: --borderRadius;
}

.badge-specials {
  background-color: --secondary;
}
.badge-specials::after {
  border-top-color: --secondary;
}

.progress-arrows-container .arrow.current {
  background-color: --primary;
}
.progress-arrows-container .arrow.current:after {
  border-left-color: --primary;
}

/* ----- Overrides - Swiper */
.swiper-pagination-bullet-active {
  background: --primary;
}

/* ----- Overrides - Bootstrap ----- */
.form-control:focus {
  border-color: --primary;
}

/* ----- Overrides - Date Picker ----- */
.calendar .dropdown-menu {
  border-radius: --borderRadius;
}

.calendar table td button .text-info {
  color: --primary;
}

.calendar table td button.btn-info,
.calendar table td button.btn-info:hover,
.calendar table td button.btn-info:focus,
.calendar table td button.btn-info:active,
.calendar table td button.btn-info:active:focus,
.calendar table td button.btn-info:active:hover {
  background-color: --primary;
}

/* ----- Components - Header ----- */
.rp-header .breadcrumb-scroll {
  border-color: --primary;
}

/* ----- Components - Menu ----- */
.rp-menu .home-btn {
  background-color: --secondary;
}

.rp-cart .rp-cart-menu-btn {
  background-color: --secondary;
}

/* ----- Components - Modal ----- */
.rp-modal .rp-modal-window {
  border-radius: --borderRadius;
}

.rp-modal-window .forgot-link span {
  color: --primary;
}

.modal-intro .swiper-slide.swiper-slide-active .animation .badge {
  border-color: --primary;
}

.modal-intro .swiper-slide .animation .badge.menu {
  background-color: --secondary;
}

/* ----- Components - Loader ----- */
.rp-loader .wrapper .hourglass {
  color: --primary;
}

.rp-loader .wrapper .hourglass .outer {
  color: --primary;
}

/* ----- Views - Search Floor Plans ----- */
#search-floorplan .tiles-container .floorplan-tile .compare-checkmark {
  background-color: --primary;
}

/* ----- Views - Home Details ----- */
#home-details .photo-gallery .photo-grid .photo:hover {
  outline-color: --primary;
}

/* ----- Views - Lease Terms ----- */
#lease-terms .terms .term.active {
  background-color: --primary;
  border-color: --primary;
}

#price-matrix .price-matrix td.active {
  background-color: --primary;
}

#price-matrix .price-matrix .matrix-btn {
  color: --primary;
}

/* ---- Views - Application Status Page ----- */

/* ---- Views - Applicants Page ----- */
.modal-idv-verify .otp-timer .rp-timer {
  color: --primary;
}

/* ---- Views - Pets Page ----- */

/* ---- Views - Applicants Info Page */
#applicants-info .accordion-container .expandable-container.open .expandable-container-header {
  background-color: --primary;
}

/* ---- Views - Payment Page ----- */
#payment .invoices .invoice .total {
  color: --primary;
}

/* ---- Menu ---- */
.rp-menu .sign-container:hover * {
  color: --primary;
}

.border-primary {
  border-color: --primary !important;
}
@media (max-width: 568px) {
  .rp-header {
    background-color: --primary;
  }
}