/* 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 {
    border-color: --primary;
}

/* ----- 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;
    }
}