/* This file is reserved for overriding and extending the template styles. */

/* ========== CUSTOM COLOR SCHEME ========== */
/* 1. Sidebar Background Color: #e7f1f0 */
/* 2. Text Colour: #000 */
/* 3. Button, radio, switch, checkbox Colour: #63b4a2 */
/* 4. Button Hover Colour: #1f9f83 */

/* Override CSS Variables for all themes */
html[data-color="light-blue"],
html[data-color="light-green"],
html[data-color="light-red"],
html[data-color="light-purple"],
html[data-color="light-pink"],
html[data-color="dark-blue"],
html[data-color="dark-green"],
html[data-color="dark-red"],
html[data-color="dark-purple"],
html[data-color="dark-pink"],
:root {
    --primary: #63b4a2 !important;
    --primary-rgb: 99, 180, 162 !important;
    --primary-darker: #1f9f83 !important;
    --background-navcolor-light: #e7f1f0 !important;
    --body: #000 !important;
    --alternate: #000 !important;
    --dark-text: #000 !important;
    --text-color: #000 !important;
}

/* Force nav background color for all nav color modes */
html[data-navcolor="light"] .nav-container,
html[data-navcolor="dark"] .nav-container,
.nav-container {
    background: #e7f1f0 !important;
    background-image: none !important;
}

/* Global text color override */
body,
html,
* {
    color: #000 !important;
}

/* Button styles */
.btn-primary,
.btn-outline-primary {
    background-color: #63b4a2 !important;
    border-color: #63b4a2 !important;
    color: white !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: #1f9f83 !important;
    border-color: #1f9f83 !important;
    color: white !important;
}

.btn-outline-primary {
    background-color: transparent !important;
    color: #63b4a2 !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: #1f9f83 !important;
    color: white !important;
}

/* Form Controls - Checkboxes, Radio buttons, Switches */
.form-check-input:checked {
    background-color: #63b4a2 !important;
    border-color: #63b4a2 !important;
}

.form-check-input:focus {
    border-color: #63b4a2 !important;
    box-shadow: 0 0 0 0.25rem rgba(99, 180, 162, 0.25) !important;
}

.form-switch .form-check-input:checked {
    background-color: #63b4a2 !important;
    border-color: #63b4a2 !important;
}

.form-switch .form-check-input:focus {
    background-image: none !important;
    border-color: #63b4a2 !important;
    box-shadow: 0 0 0 0.25rem rgba(99, 180, 162, 0.25) !important;
}

/* Links */
a {
    color: #63b4a2 !important;
}

a:hover,
a:focus {
    color: #1f9f83 !important;
}

/* Navigation menu text */
.nav-container .menu-container .menu a,
.nav-container .menu-icons>li>a,
.nav-container .language-switch-container .language-button,
.nav-container .user-container .user .name {
    color: #000 !important;
}

/* Active menu items */
.nav-container .menu-container .menu a.active,
.nav-container .menu-container .menu a:hover {
    background: rgba(99, 180, 162, 0.1) !important;
    color: #000 !important;
}

/* Menu icons */
.nav-container .menu-container .menu a .icon {
    color: #63b4a2 !important;
}

/* Primary color for various components */
.text-primary {
    color: #63b4a2 !important;
}

.bg-primary {
    background-color: #63b4a2 !important;
}

.border-primary {
    border-color: #63b4a2 !important;
}

/* Input focus styles */
.form-control:focus,
.form-select:focus {
    border-color: #63b4a2 !important;
    box-shadow: 0 0 0 0.25rem rgba(99, 180, 162, 0.25) !important;
}

/* Table and other component text */
.table,
.table td,
.table th,
.table tr,
.card,
.card-body,
.dropdown-menu,
.dropdown-item {
    color: #000 !important;
}

/* Override any inline styles that might conflict */
[style*="color"] {
    color: #000 !important;
}

/* Ensure dropdowns and modals follow the color scheme */
.dropdown-menu {
    background-color: white !important;
}

.dropdown-item {
    color: #000 !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: rgba(99, 180, 162, 0.1) !important;
    color: #000 !important;
}

/* Progress bars and badges */
.progress-bar {
    background-color: #63b4a2 !important;
}

.badge.bg-primary {
    background-color: #63b4a2 !important;
}

/* Custom permission switch styles */
.permission-switch .form-check-input:checked {
    background-color: #63b4a2 !important;
    border-color: #63b4a2 !important;
}