/* ODDEG Color Theme - Based on ODDEG Logo Color Palette */

/* ========================================
   ODDEG COLOR VARIABLES
   ======================================== */

:root {
    /* Primary Colors */
    --oddeg-geothermal-green: #32B46C;
    --oddeg-deep-earth-black: #1A1A1A;
    --oddeg-navbar-dark: #2C3E50;
    --oddeg-sky-blue: #1DAEEF;
    
    /* Secondary Colors */
    --oddeg-bright-red: #ED1C24;
    --oddeg-earthy-orange: #F4A43B;
    --oddeg-soft-teal: #5CC0AE;
    
    /* Tertiary/Accent Colors */
    --oddeg-desert-sand: #F7D9A1;
    --oddeg-leaf-green: #70C78B;
    --oddeg-classic-white: #FFFFFF;
    
    /* Utility Colors */
    --oddeg-light-gray: #F4F4F4;
    --oddeg-medium-gray: #6A6D76;
    --oddeg-dark-gray: #35383D;

    /* Sidebar Hover Colors */
    --oddeg-sidebar-hover: #4AC97A;
    --oddeg-sidebar-active: #5CC0AE;
}

/* ========================================
   PRIMARY BUTTON STYLES
   ======================================== */

.btn-primary, .btn.btn-theme, .login-btn {
    background-color: var(--oddeg-geothermal-green) !important;
    border-color: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
}

.btn-primary:hover, .btn.btn-theme:hover, .login-btn:hover {
    background-color: var(--oddeg-leaf-green) !important;
    border-color: var(--oddeg-leaf-green) !important;
    color: var(--oddeg-classic-white) !important;
}

/* SUCCESS BUTTON STYLES - Enhanced for better readability */
.btn-success, .btn.btn-success {
    background-color: var(--oddeg-geothermal-green) !important;
    border-color: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

.btn-success:hover, .btn.btn-success:hover,
.btn-success:focus, .btn.btn-success:focus,
.btn-success:active, .btn.btn-success:active {
    background-color: var(--oddeg-leaf-green) !important;
    border-color: var(--oddeg-leaf-green) !important;
    color: var(--oddeg-classic-white) !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
}

/* Specific fix for d-flex success buttons */
.d-flex .btn-success, .d-flex .btn.btn-success,
.btn-success.d-flex, .btn.btn-success.d-flex {
    background-color: var(--oddeg-geothermal-green) !important;
    border-color: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    text-decoration: none !important;
}

.d-flex .btn-success:hover, .d-flex .btn.btn-success:hover,
.btn-success.d-flex:hover, .btn.btn-success.d-flex:hover,
.d-flex .btn-success:focus, .d-flex .btn.btn-success:focus,
.btn-success.d-flex:focus, .btn.btn-success.d-flex:focus {
    background-color: var(--oddeg-leaf-green) !important;
    border-color: var(--oddeg-leaf-green) !important;
    color: var(--oddeg-classic-white) !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
    text-decoration: none !important;
}

.btn-secondary {
    background-color: var(--oddeg-earthy-orange) !important;
    border-color: var(--oddeg-earthy-orange) !important;
    color: var(--oddeg-deep-earth-black) !important;
}

.btn-secondary:hover {
    background-color: var(--oddeg-desert-sand) !important;
    border-color: var(--oddeg-desert-sand) !important;
    color: var(--oddeg-deep-earth-black) !important;
}

/* Custom button for schedule calculation */
#btn-calc-schedule-details-part {
    color: #ffffff !important;
}

/* ========================================
   NAVBAR/HEADER STYLES
   ======================================== */

header .navbar, .landing-page .header {
    background: linear-gradient(135deg, var(--oddeg-navbar-dark) 0%, var(--oddeg-geothermal-green) 100%) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

header .navbar .nav-item .nav-link {
    color: var(--oddeg-classic-white) !important;
}

.landing-page .user-details span {
    color: var(--oddeg-classic-white) !important;
}

.landing-page .header i {
    color: var(--oddeg-classic-white) !important;
}

/* ========================================
   SIDEBAR STYLES
   ======================================== */

.sidebar, .sidebar ul {
    background-color: var(--oddeg-geothermal-green) !important;
}

.sidebar ul li.active {
    background: var(--oddeg-sidebar-active) !important;
    color: var(--oddeg-classic-white) !important;
    border-left: 4px solid var(--oddeg-sky-blue) !important;
    transform: translateX(2px);
    box-shadow: 2px 0 8px rgba(0,0,0,0.15);
}

.sidebar ul li:hover {
    background: var(--oddeg-sidebar-hover) !important;
    transition: all 0.3s ease;
    transform: translateX(2px);
    box-shadow: 2px 0 8px rgba(0,0,0,0.1);
}

.sidebar ul li:hover a, .sidebar ul li:hover a i {
    color: var(--oddeg-classic-white) !important;
    transition: color 0.3s ease;
}

.sidebar ul li {
    transition: all 0.3s ease;
    border-left: 4px solid transparent;
}

.sub-menu {
    background: var(--oddeg-sky-blue) !important;
    color: var(--oddeg-classic-white) !important;
}

.sub-menu li a {
    color: var(--oddeg-classic-white) !important;
}

.sub-menu li a:hover {
    color: var(--oddeg-desert-sand) !important;
}

/* ========================================
   FORM STYLES
   ======================================== */

.form-control:focus {
    border-color: var(--oddeg-geothermal-green) !important;
    box-shadow: 0 0 0 0.2rem rgba(50, 180, 108, 0.25) !important;
}

input[type="checkbox"]:checked ~ label:before {
    background: var(--oddeg-geothermal-green) no-repeat center !important;
}

/* ========================================
   ALERT STYLES
   ======================================== */

.alert-danger, .text-red {
    color: var(--oddeg-bright-red) !important;
}

.alert-success, .text-green {
    color: var(--oddeg-geothermal-green) !important;
}

.alert-info {
    color: var(--oddeg-sky-blue) !important;
}

.alert-warning {
    color: var(--oddeg-earthy-orange) !important;
}

/* ========================================
   LINK STYLES
   ======================================== */

a, .btn-link {
    color: var(--oddeg-sky-blue) !important;
}

a:hover, .btn-link:hover {
    color: var(--oddeg-geothermal-green) !important;
}

/* ========================================
   CARD STYLES
   ======================================== */

.card {
    border-color: var(--oddeg-soft-teal) !important;
}

.card-header {
    background-color: var(--oddeg-light-gray) !important;
    border-bottom-color: var(--oddeg-soft-teal) !important;
}

/* ========================================
   TABLE STYLES
   ======================================== */

.data-table thead tr, .table thead {
    background: var(--oddeg-desert-sand) !important;
    color: var(--oddeg-deep-earth-black) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(247, 217, 161, 0.1) !important;
}

/* ========================================
   CONSOLE/DASHBOARD STYLES
   ======================================== */

.console-part {
    background-color: var(--oddeg-light-gray) !important;
    border: none !important;
}

.console-app {
    background-color: var(--oddeg-soft-teal) !important;
    border-color: var(--oddeg-soft-teal) !important;
}

.console-part .logo-head {
    color: var(--oddeg-classic-white) !important;
}

.console-head1, .console-head2 {
    border-color: var(--oddeg-geothermal-green) !important;
}

.console-head1 h6, .console-head2 h6 {
    color: var(--oddeg-sky-blue) !important;
}

/* ========================================
   LANDING PAGE STYLES
   ======================================== */

.main-header {
    background-color: var(--oddeg-desert-sand) !important;
}

.main-header h1, .main-header p {
    color: var(--oddeg-deep-earth-black) !important;
}

/* ========================================
   BADGE STYLES
   ======================================== */

.badge-primary {
    background-color: var(--oddeg-geothermal-green) !important;
}

.badge-secondary {
    background-color: var(--oddeg-earthy-orange) !important;
}

.badge-danger {
    background-color: var(--oddeg-bright-red) !important;
}

.badge-info {
    background-color: var(--oddeg-sky-blue) !important;
}

/* ========================================
   PROGRESS BAR STYLES
   ======================================== */

.progress-bar {
    background-color: var(--oddeg-geothermal-green) !important;
}

.progress-bar.progress-red {
    background: var(--oddeg-bright-red) !important;
}

.progress-bar.progress-green {
    background: var(--oddeg-leaf-green) !important;
}

/* ========================================
   DROPDOWN STYLES
   ======================================== */

.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--oddeg-sky-blue) !important;
    color: var(--oddeg-classic-white) !important;
}

/* ========================================
   PAGINATION STYLES
   ======================================== */

.page-link {
    color: var(--oddeg-sky-blue) !important;
}

.page-link:hover {
    color: var(--oddeg-geothermal-green) !important;
    background-color: var(--oddeg-desert-sand) !important;
    border-color: var(--oddeg-geothermal-green) !important;
}

.page-item.active .page-link {
    background-color: var(--oddeg-geothermal-green) !important;
    border-color: var(--oddeg-geothermal-green) !important;
}

/* ========================================
   MODAL STYLES
   ======================================== */

.modal-header {
    background-color: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
}

.modal-header .close {
    color: var(--oddeg-classic-white) !important;
}

/* ========================================
   CALENDAR STYLES
   ======================================== */

.calendar-section {
    background-color: var(--oddeg-classic-white) !important;
}

.calendar-section .calendar-content h2 {
    color: var(--oddeg-deep-earth-black) !important;
}

/* ========================================
   NOTIFICATION STYLES
   ======================================== */

.notification-left .badge.sync-on {
    background: var(--oddeg-sky-blue) !important;
}

.notification-left .badge.sync-pending {
    background: var(--oddeg-bright-red) !important;
}

/* ========================================
   UTILITY CLASSES
   ======================================== */

.text-oddeg-primary {
    color: var(--oddeg-geothermal-green) !important;
}

.text-oddeg-secondary {
    color: var(--oddeg-earthy-orange) !important;
}

.text-oddeg-accent {
    color: var(--oddeg-sky-blue) !important;
}

.bg-oddeg-primary {
    background-color: var(--oddeg-geothermal-green) !important;
}

.bg-oddeg-secondary {
    background-color: var(--oddeg-earthy-orange) !important;
}

.bg-oddeg-accent {
    background-color: var(--oddeg-sky-blue) !important;
}

.border-oddeg-primary {
    border-color: var(--oddeg-geothermal-green) !important;
}

.border-oddeg-secondary {
    border-color: var(--oddeg-earthy-orange) !important;
}

.border-oddeg-accent {
    border-color: var(--oddeg-sky-blue) !important;
}

/* ========================================
   TEXT READABILITY ENHANCEMENTS
   ======================================== */

/* Force white text on success buttons for better readability */
.btn-success *, .btn.btn-success *,
.btn-success a, .btn.btn-success a,
.btn-success span, .btn.btn-success span,
.btn-success i, .btn.btn-success i {
    color: var(--oddeg-classic-white) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) !important;
}

/* Enhanced contrast for d-flex success buttons */
.d-flex .btn-success *, .d-flex .btn.btn-success *,
.btn-success.d-flex *, .btn.btn-success.d-flex * {
    color: var(--oddeg-classic-white) !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
}

/* Ensure icons in success buttons are visible */
.btn-success .mdi, .btn.btn-success .mdi,
.btn-success .fa, .btn.btn-success .fa,
.btn-success .fas, .btn.btn-success .fas,
.btn-success .far, .btn.btn-success .far {
    color: var(--oddeg-classic-white) !important;
    opacity: 1 !important;
}

/* Override Bootstrap default button styles for better readability */
.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.btn.btn-success:not(:disabled):not(.disabled):active,
.btn.btn-success:not(:disabled):not(.disabled).active {
    background-color: var(--oddeg-geothermal-green) !important;
    border-color: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

/* Force text color inheritance for nested elements */
.btn-success:not(:disabled):not(.disabled):active *,
.btn-success:not(:disabled):not(.disabled).active *,
.btn.btn-success:not(:disabled):not(.disabled):active *,
.btn.btn-success:not(:disabled):not(.disabled).active * {
    color: var(--oddeg-classic-white) !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
}

/* Additional flexbox-specific overrides for better readability */
.d-flex.btn-success,
.btn-success.d-flex,
.d-flex .btn-success,
.btn.btn-success.d-flex,
.d-flex .btn.btn-success {
    background-color: var(--oddeg-geothermal-green) !important;
    border-color: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    text-decoration: none !important;
}

/* Ensure all text elements in flexbox success buttons are white */
.d-flex.btn-success *,
.btn-success.d-flex *,
.d-flex .btn-success *,
.btn.btn-success.d-flex *,
.d-flex .btn.btn-success * {
    color: var(--oddeg-classic-white) !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    text-decoration: none !important;
}

/* Hover states for flexbox success buttons */
.d-flex.btn-success:hover,
.btn-success.d-flex:hover,
.d-flex .btn-success:hover,
.btn.btn-success.d-flex:hover,
.d-flex .btn.btn-success:hover,
.d-flex.btn-success:focus,
.btn-success.d-flex:focus,
.d-flex .btn-success:focus,
.btn.btn-success.d-flex:focus,
.d-flex .btn.btn-success:focus {
    background-color: var(--oddeg-leaf-green) !important;
    border-color: var(--oddeg-leaf-green) !important;
    color: var(--oddeg-classic-white) !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
    text-decoration: none !important;
}

/* Hover states for text elements in flexbox success buttons */
.d-flex.btn-success:hover *,
.btn-success.d-flex:hover *,
.d-flex .btn-success:hover *,
.btn.btn-success.d-flex:hover *,
.d-flex .btn.btn-success:hover *,
.d-flex.btn-success:focus *,
.btn-success.d-flex:focus *,
.d-flex .btn-success:focus *,
.btn.btn-success.d-flex:focus *,
.d-flex .btn.btn-success:focus * {
    color: var(--oddeg-classic-white) !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
    text-decoration: none !important;
}

/* ========================================
   SPECIFIC COMPONENT OVERRIDES
   ======================================== */

/* Console/Dashboard specific colors */
.console-part {
    background-color: var(--oddeg-light-gray) !important;
    border: none !important;
}

.console-app {
    background-color: var(--oddeg-soft-teal) !important;
    border-color: var(--oddeg-soft-teal) !important;
}

.console-head1, .console-head2 {
    border-color: var(--oddeg-geothermal-green) !important;
}

/* Landing page header override */
.landing-page .header {
    background: linear-gradient(135deg, var(--oddeg-navbar-dark) 0%, var(--oddeg-geothermal-green) 100%) !important;
}

/* Vendor management navbar override */
header .navbar.vendormanagement {
    background: linear-gradient(135deg, var(--oddeg-navbar-dark) 0%, var(--oddeg-geothermal-green) 100%) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

/* Button hover states */
.btn:hover {
    transform: translate3d(0, -2px, 0);
    box-shadow: 0 4px 8px rgba(26, 26, 26, 0.15);
}

/* Login form specific */
.login-form {
    border-color: var(--oddeg-geothermal-green) !important;
}

.login-form .form-control {
    border-color: var(--oddeg-soft-teal) !important;
}

/* Checkbox override */
input[type="checkbox"]:checked ~ label:before {
    background: var(--oddeg-geothermal-green) no-repeat center !important;
}

/* Table header override */
.data-table thead tr, .table thead {
    background: var(--oddeg-desert-sand) !important;
    color: var(--oddeg-deep-earth-black) !important;
}

/* Sidebar active state override */
.sidebar ul li.active {
    background: var(--oddeg-sidebar-active) !important;
    color: var(--oddeg-classic-white) !important;
    border-left: 4px solid var(--oddeg-sky-blue) !important;
    transform: translateX(2px);
    box-shadow: 2px 0 8px rgba(0,0,0,0.15);
}

.sidebar ul li:hover {
    background: var(--oddeg-sidebar-hover) !important;
    transition: all 0.3s ease;
    transform: translateX(2px);
    box-shadow: 2px 0 8px rgba(0,0,0,0.1);
}

/* Submenu override */
.sub-menu, .submenu ul {
    background: var(--oddeg-sky-blue) !important;
}

/* Main header background */
.main-header {
    background-color: var(--oddeg-desert-sand) !important;
}

/* Error/Alert colors */
.text-red, .alert-danger {
    color: var(--oddeg-bright-red) !important;
}

.text-green, .alert-success {
    color: var(--oddeg-geothermal-green) !important;
}

/* Link colors */
.form-check-label.forgotclick {
    color: var(--oddeg-sky-blue) !important;
}

/* Dropdown hover */
.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--oddeg-sky-blue) !important;
    color: var(--oddeg-classic-white) !important;
}

/* Calendar dots - using ODDEG colors */
.calendar-dot-1 {
    background-color: var(--oddeg-earthy-orange) !important;
}

.calendar-dot-2 {
    background-color: var(--oddeg-sky-blue) !important;
}

.calendar-dot-3 {
    background-color: var(--oddeg-bright-red) !important;
}

.calendar-dot-4 {
    background-color: var(--oddeg-geothermal-green) !important;
}

.calendar-dot-5 {
    background-color: var(--oddeg-soft-teal) !important;
}

/* Progress bars */
.progress-bar.progress-red {
    background: var(--oddeg-bright-red) !important;
}

.progress-bar.progress-green {
    background: var(--oddeg-leaf-green) !important;
}

/* Badge colors */
.badge.sync-on {
    background: var(--oddeg-sky-blue) !important;
}

.badge.sync-pending {
    background: var(--oddeg-bright-red) !important;
}

/* Button variants */
.btn-work {
    border-color: var(--oddeg-sky-blue) !important;
    color: var(--oddeg-deep-earth-black) !important;
}

.btn-template {
    background-color: var(--oddeg-sky-blue) !important;
    color: var(--oddeg-classic-white) !important;
}

.btn-search {
    background: var(--oddeg-sky-blue) !important;
    color: var(--oddeg-classic-white) !important;
}

/* Notification styles */
.notification-left .btn {
    background: var(--oddeg-classic-white) !important;
    color: var(--oddeg-medium-gray) !important;
}

.notification-right .btn.btn-active {
    color: var(--oddeg-geothermal-green) !important;
    border-color: var(--oddeg-geothermal-green) !important;
    background: rgba(50, 180, 108, 0.1) !important;
}

/* Tab styles */
.nav-pills .nav-link.active {
    background: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
}

/* Modal header */
.modal-header.reportbuilder-modal {
    background: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
}

/* UI Dialog buttons */
.ui-button.ui-corner-all.ui-widget {
    background-color: var(--oddeg-geothermal-green) !important;
    color: var(--oddeg-classic-white) !important;
}

/* Switch/Toggle styles */
input:checked + .slider {
    background-color: var(--oddeg-geothermal-green) !important;
}

/* Accordion styles */
.accordion-heading {
    background: var(--oddeg-desert-sand) !important;
    color: var(--oddeg-deep-earth-black) !important;
}

/* Highlight sections */
.highlighten-section {
    background: rgba(247, 217, 161, 0.3) !important;
}

/* Tree view active */
.tree .active {
    background: var(--oddeg-desert-sand) !important;
    color: var(--oddeg-deep-earth-black) !important;
}

/* Label table */
.label-table {
    background: var(--oddeg-desert-sand) !important;
}

/* Tab header */
.tab-header {
    background: var(--oddeg-desert-sand) !important;
}

/* ========================================
   ENHANCED SIDEBAR ANIMATIONS
   ======================================== */

/* Sidebar item text animation */
.sidebar ul li a {
    transition: all 0.3s ease;
}

.sidebar ul li:hover a {
    padding-left: 8px;
}

/* Sidebar icon animation */
.sidebar ul li a i {
    transition: all 0.3s ease;
}

.sidebar ul li:hover a i {
    transform: scale(1.1);
}

/* Fix sub-category (submenu) positioning */
.sub-category {
    transition: all 0.3s ease;
    /* Compensate for parent transform */
    left: calc(100% - 2px) !important;
}

/* Ensure sub-category appears correctly when parent is hovered */
.submenu-outer:hover .sub-category {
    /* Adjust for the 2px transform of parent */
    left: calc(100% - 2px) !important;
    display: block !important;
}

/* Ensure sub-category items don't inherit parent transforms */
.sub-category-list li {
    transform: none !important;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Reset sub-category item hover effects */
.sub-category-list li:hover {
    transform: none !important;
}

/* Sub-category links should not have the parent padding animation */
.sub-category-list li a {
    padding-left: inherit !important;
    transition: color 0.3s ease;
}

.sub-category-list li:hover a {
    padding-left: inherit !important;
}

/* Fix fish-sidebar sub-category top alignment */
.fish-sidebar .sub-category {
    top: 0 !important;
}

/* Sidebar focus states */
.sidebar ul li:focus-within {
    background: var(--oddeg-sidebar-hover) !important;
    transform: translateX(2px);
    box-shadow: 2px 0 8px rgba(0,0,0,0.1);
}

/* Sidebar item ripple effect */
.sidebar ul li::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    transition: width 0.3s ease;
    z-index: 1;
}

.sidebar ul li:hover::before {
    width: 100%;
}

/* Ensure content stays above ripple */
.sidebar ul li a {
    position: relative;
    z-index: 2;
}

/* ========================================
   NAVBAR ENHANCEMENTS
   ======================================== */

/* Navbar brand hover effect */
header .navbar-brand:hover {
    color: var(--oddeg-classic-white) !important;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.3);
    transition: all 0.3s ease;
}

/* Navbar nav links hover enhancement */
header .navbar .nav-item .nav-link:hover {
    color: var(--oddeg-desert-sand) !important;
    transform: translateY(-1px);
    transition: all 0.3s ease;
}

/* Dropdown menu enhancement */
.dropdown-menu {
    border: none !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
    border-radius: 8px !important;
}

/* Button hover enhancement */
.btn-console:hover, .btn-management:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    transition: all 0.3s ease;
}
