/* Manob Automation Custom Branding - Light Theme */

:root {
    --manob-primary: #0D9488;
    --manob-primary-dark: #0F766E;
    --manob-primary-light: #14B8A6;
    --manob-secondary: #1E293B;
    --manob-accent: #F59E0B;
}

/* Light Sidebar */
.sidebar-left,
.app-sidebar,
.mautic-sidebar-root,
.sidebar-content,
.nav-sidebar {
    background-color: #F8FAFC !important;
}

.sidebar-left .nav-sidebar > li > a,
.sidebar-left .sidebar-content a {
    color: #334155 !important;
}

.sidebar-left .nav-sidebar > li > a:hover,
.sidebar-left .nav-sidebar > li.active > a {
    background-color: var(--manob-primary) !important;
    color: #fff !important;
}

.sidebar-left .nav-sidebar > li > a i {
    color: #64748B !important;
}

.sidebar-left .nav-sidebar > li > a:hover i,
.sidebar-left .nav-sidebar > li.active > a i {
    color: #fff !important;
}

.sidebar-left {
    border-right: 1px solid #E2E8F0 !important;
}

/* Light Header/Navbar */
.navbar-default,
#app-header,
.navbar,
header.navbar {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid #E2E8F0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
}

/* Navbar text and icons - dark for light background */
.navbar-default .navbar-nav > li > a,
.navbar .nav > li > a,
#app-header .nav > li > a {
    color: #334155 !important;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar .nav > li > a:hover {
    color: var(--manob-primary) !important;
}

.navbar-default .navbar-nav > li > a i,
.navbar .nav > li > a i {
    color: #64748B !important;
}

.navbar-default .navbar-nav > li > a:hover i,
.navbar .nav > li > a:hover i {
    color: var(--manob-primary) !important;
}

/* Brand text in navbar */
.mautic-brand span,
.navbar a.mautic-brand span {
    color: var(--manob-primary) !important;
}

/* Search button */
.search-button,
.navbar .search-button {
    color: #64748B !important;
}

.search-button:hover {
    color: var(--manob-primary) !important;
}

/* Dropdown menus */
.navbar .dropdown-menu {
    background-color: #FFFFFF !important;
    border: 1px solid #E2E8F0 !important;
}

.dropdown-menu > li > a {
    color: #334155 !important;
}

.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: var(--manob-primary) !important;
    color: #fff !important;
}

/* Loading bar */
.loading-bar {
    background-color: var(--manob-primary) !important;
    color: #fff !important;
}

/* Primary color overrides */
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background-color: var(--manob-primary) !important;
    border-color: var(--manob-primary) !important;
}

.btn-primary:hover {
    background-color: var(--manob-primary-dark) !important;
    border-color: var(--manob-primary-dark) !important;
}

/* Links */
a {
    color: var(--manob-primary);
}

a:hover, a:focus {
    color: var(--manob-primary-dark);
}

/* Progress bars and badges */
.progress-bar,
.badge-primary,
.label-primary {
    background-color: var(--manob-primary) !important;
}

/* Form focus states */
.form-control:focus {
    border-color: var(--manob-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(13, 148, 136, 0.25) !important;
}

/* Checkboxes and radios */
input[type="checkbox"]:checked + label::before,
input[type="radio"]:checked + label::before {
    background-color: var(--manob-primary) !important;
    border-color: var(--manob-primary) !important;
}

/* Switches */
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary {
    background-color: var(--manob-primary) !important;
}

/* Submenu styling for light sidebar */
.sidebar-left .nav-sidebar .nav-group .nav-group-items a {
    color: #475569 !important;
}

.sidebar-left .nav-sidebar .nav-group .nav-group-items a:hover {
    color: var(--manob-primary) !important;
}

/* Notification badges */
.navbar .badge {
    background-color: var(--manob-primary) !important;
}

/* App content area */
#app-content {
    background-color: #F8FAFC !important;
}

/* Footer */
#app-footer {
    background-color: #FFFFFF !important;
    border-top: 1px solid #E2E8F0 !important;
}

#app-footer .text-muted {
    color: #64748B !important;
}