/**
 * Tenant Theme Override CSS
 * This file overrides the default blue theme with a red theme for tenant users
 * It can be removed to revert to the original theme
 */

/* Primary Color Variables Override */
:root {
    --tenant-primary: #dc3545;
    --tenant-primary-dark: #c82333;
    --tenant-primary-darker: #a71d2a;
    --tenant-primary-darkest: #8b1a1a;
    --tenant-primary-light: #e4606d;
    --tenant-primary-lighter: #f8d7da;
    --tenant-primary-lightest: #fef2f3;
}

/* Button Primary Override */
.btn-primary {
    background-color: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: var(--tenant-primary-dark) !important;
    border-color: var(--tenant-primary-dark) !important;
}

.btn-outline-primary {
    color: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
    color: #fff !important;
}

/* Text Primary Override */
.text-primary {
    color: var(--tenant-primary) !important;
}

/* Background Primary Override */
.bg-primary {
    background-color: var(--tenant-primary) !important;
}

.bg-soft-primary {
    background-color: var(--tenant-primary-lightest) !important;
}

/* Badge Primary Override */
.badge-primary,
.badge.bg-primary {
    background-color: var(--tenant-primary) !important;
}

/* Alert Primary Override */
.alert-primary {
    color: #842029;
    background-color: var(--tenant-primary-lighter);
    border-color: #f1aeb5;
}

/* Sidebar/Vertical Menu Override */
.vertical-menu {
    background: var(--tenant-primary-darker) !important;
    border-right: 1px solid var(--tenant-primary-darkest) !important;
}

.navbar-brand-box {
    background-color: var(--tenant-primary-darkest) !important;
}

/* Sidebar Logo Text */
.navbar-brand-box .logo-txt {
    color: #fff !important;
}

/* Sidebar Menu Items */
#sidebar-menu ul li a {
    color: rgba(255, 255, 255, 0.7) !important;
}

#sidebar-menu ul li a .nav-icon {
    color: rgba(255, 255, 255, 0.7) !important;
}

#sidebar-menu ul li a:hover,
#sidebar-menu ul li a:hover .nav-icon {
    color: #fff !important;
}

/* Sidebar Active Menu Item */
#sidebar-menu ul li.mm-active > a {
    background-color: rgba(255, 255, 255, 0.15) !important;
    color: #fff !important;
}

#sidebar-menu ul li.mm-active > a .nav-icon {
    color: #fff !important;
}

/* Sidebar Submenu */
#sidebar-menu ul li ul.sub-menu li a {
    color: rgba(255, 255, 255, 0.6) !important;
}

#sidebar-menu ul li ul.sub-menu li a:hover {
    color: #fff !important;
}

#sidebar-menu ul li ul.sub-menu li a:before {
    border-color: rgba(255, 255, 255, 0.6) !important;
}

#sidebar-menu ul li ul.sub-menu li a:hover:before {
    background-color: #fff !important;
    border-color: #fff !important;
}

/* Menu Title in Sidebar */
.menu-title {
    color: rgba(255, 255, 255, 0.5) !important;
}

/* Topbar for Tenant */
#page-topbar {
    border-bottom: 1px solid rgba(220, 53, 69, 0.1);
}

/* Links and Interactive Elements */
a {
    color: var(--tenant-primary);
}

a:hover {
    color: var(--tenant-primary-dark);
}

/* Form Controls Focus State */
.form-control:focus,
.form-select:focus {
    border-color: var(--tenant-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

/* Custom Control (Checkbox/Radio) */
.form-check-input:checked {
    background-color: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
}

/* Progress Bar */
.progress-bar {
    background-color: var(--tenant-primary) !important;
}

/* Pagination */
.page-link {
    color: var(--tenant-primary);
}

.page-link:hover {
    color: var(--tenant-primary-dark);
}

.page-item.active .page-link {
    background-color: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
}

/* Dropdown Item Active/Hover */
.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--tenant-primary-lightest);
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--tenant-primary) !important;
    color: #fff !important;
}

/* Card Headers with Primary Background */
.card-header.bg-primary {
    background-color: var(--tenant-primary) !important;
}

/* Tables */
.table-primary {
    background-color: var(--tenant-primary-lightest) !important;
}

/* Navigation Tabs */
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    color: var(--tenant-primary);
    border-color: #dee2e6 #dee2e6 #fff;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: var(--tenant-primary) !important;
}

/* Breadcrumb */
.breadcrumb-item.active {
    color: var(--tenant-primary);
}

/* Spinner */
.spinner-border-primary {
    color: var(--tenant-primary) !important;
}

/* For Small Sidebar Mode */
body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > a {
    background-color: var(--tenant-primary-dark) !important;
    color: #fff !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul > li:hover > a .nav-icon {
    color: #fff !important;
}

body[data-sidebar-size=sm] .vertical-menu #sidebar-menu > ul ul {
    background-color: var(--tenant-primary-darker) !important;
}

/* Scrollbar in Sidebar (if visible) */
.vertical-menu .simplebar-scrollbar:before {
    background: rgba(255, 255, 255, 0.3) !important;
}

/* Logo Override for Tenant */
.navbar-brand-box .logo-dark {
    display: none !important;
}

.navbar-brand-box .logo-light {
    display: block !important;
}

/* Icons and SVG elements with primary color */
.text-primary svg,
svg.text-primary {
    fill: var(--tenant-primary) !important;
}

/* Modal Headers */
.modal-header.bg-primary {
    background-color: var(--tenant-primary) !important;
}

/* Toast Notifications */
.toast-primary {
    background-color: var(--tenant-primary) !important;
    color: #fff !important;
}

/* DataTables Customization (if used) */
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--tenant-primary-light) !important;
    border-color: var(--tenant-primary-light) !important;
}

/* Sweet Alert Customization (if used) */
.swal2-styled.swal2-confirm {
    background-color: var(--tenant-primary) !important;
}

/* Custom Scrollbar */
::-webkit-scrollbar-thumb {
    background-color: var(--tenant-primary-light);
}

::-webkit-scrollbar-thumb:hover {
    background-color: var(--tenant-primary);
}

/* Loader/Preloader if exists */
.preloader,
.spinner-grow.text-primary {
    color: var(--tenant-primary) !important;
}

/* Calendar Events (if calendar is used) */
.fc-event-primary {
    background-color: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
}

/* Charts (if used) */
.apexcharts-theme-light .apexcharts-selection-rect {
    fill: var(--tenant-primary);
    stroke: var(--tenant-primary);
}

/* File Upload Zones */
.dropzone {
    border-color: var(--tenant-primary-light) !important;
}

.dropzone:hover {
    border-color: var(--tenant-primary) !important;
}

/* Timeline */
.timeline-item .timeline-icon {
    background-color: var(--tenant-primary) !important;
}

/* Switches */
.form-switch .form-check-input:checked {
    background-color: var(--tenant-primary) !important;
    border-color: var(--tenant-primary) !important;
}

/* Range Slider */
.form-range::-webkit-slider-thumb {
    background: var(--tenant-primary) !important;
}

.form-range::-moz-range-thumb {
    background: var(--tenant-primary) !important;
}

/* Tooltips */
.tooltip-primary .tooltip-inner {
    background-color: var(--tenant-primary) !important;
}

/* Popovers */
.popover-primary {
    background-color: var(--tenant-primary) !important;
}

.popover-primary .popover-header {
    background-color: var(--tenant-primary-dark) !important;
}