/* ============================================
   6amMart-Inspired Admin Panel Theme
   Dark sidebar + Teal accent color scheme
   ============================================ */

:root {
    --admin-panel-color: #00AA96;
    --admin-sidebar-bg: #334257;
    --admin-sidebar-dark: #2b3847;
    --admin-sidebar-text: rgba(255, 255, 255, 0.7);
    --admin-sidebar-active: #00AA96;
    --admin-sidebar-active-bg: rgba(0, 170, 150, 0.15);
    --admin-topbar-bg: #FFFFFF;
    --admin-topbar-text: #334257;
    --admin-accent: #00AA96;
    --admin-accent-dark: #009984;
    --admin-accent-light: rgba(0, 170, 150, 0.1);
    --admin-body-bg: #F8F9FA;
    --admin-card-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
    --admin-radius: 8px;
}

/* ============================================
   TOPBAR — Dark navy matching 6amMart sidebar
   ============================================ */
header.topbar,
.topbar {
    background: #334257 !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15) !important;
}

header.topbar .navbar-header,
.topbar .navbar-header {
    background: #334257 !important;
}

.topbar .navbar-light .navbar-nav .nav-item > a.nav-link {
    color: rgba(255, 255, 255, 0.85) !important;
}

.topbar .navbar-light .navbar-nav .nav-item > a.nav-link:hover,
.topbar .navbar-light .navbar-nav .nav-item > a.nav-link:focus {
    color: #FFFFFF !important;
}

.topbar .top-navbar .navbar-header .navbar-brand .dark-logo {
    display: none !important;
}

.topbar .top-navbar .navbar-header .navbar-brand .light-logo {
    display: inline-block !important;
    max-height: 45px !important;
    max-width: 180px !important;
    object-fit: contain;
}

/* Top navbar icons & toggle buttons — white on dark */
.topbar .navbar-light .navbar-nav .nav-item > a.nav-link .mdi,
.topbar .sidebar-toggle a,
.topbar .sidebar-toggle a i,
.topbar .nav-link i {
    color: rgba(255, 255, 255, 0.85) !important;
}

.topbar .sidebar-toggle a svg path {
    fill: rgba(255, 255, 255, 0.85) !important;
    stroke: rgba(255, 255, 255, 0.85) !important;
}

/* Multi-service nav tabs in topbar */
.topbar .navbar-light .multi-service-nav.navbar-nav .nav-item > a.nav-link {
    background: #00AA96 !important;
    color: #FFFFFF !important;
    border-radius: 6px !important;
    height: 40px !important;
    padding: 0 15px !important;
    margin-top: 10px;
    margin-bottom: 10px;
}

.topbar .navbar-light .multi-service-nav.navbar-nav .nav-item > a.nav-link:hover {
    background: #009984 !important;
    color: #FFFFFF !important;
}

/* Search bar in topbar */
.topbar .app-search input {
    background: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 6px !important;
    color: #FFFFFF !important;
}

.topbar .app-search input::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}

.topbar .app-search input:focus {
    border-color: #00AA96 !important;
    background: rgba(255, 255, 255, 0.15) !important;
}

/* ============================================
   SIDEBAR — Dark background like 6amMart
   ============================================ */
.left-sidebar {
    background: var(--admin-sidebar-bg) !important;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
}

.sidebar-nav {
    background: var(--admin-sidebar-bg) !important;
}

/* Sidebar links — light text on dark bg */
.sidebar-nav ul li a {
    color: var(--admin-sidebar-text) !important;
    border-bottom-color: rgba(255, 255, 255, 0.05) !important;
    transition: all 0.2s ease;
}

.sidebar-nav ul li a i {
    color: var(--admin-sidebar-text) !important;
}

/* Sidebar hover */
.sidebar-nav ul li a:hover {
    color: #FFFFFF !important;
    background: var(--admin-sidebar-active-bg) !important;
    border-color: var(--admin-sidebar-active) !important;
}

.sidebar-nav ul li a:hover i {
    color: var(--admin-sidebar-active) !important;
}

/* Sidebar active */
.sidebar-nav > ul > li.active > a {
    color: #FFFFFF !important;
    background: var(--admin-sidebar-active-bg) !important;
    border-color: var(--admin-sidebar-active) !important;
    border-left: 3px solid var(--admin-sidebar-active);
}

.sidebar-nav > ul > li.active > a i {
    color: var(--admin-sidebar-active) !important;
}

.sidebar-nav ul li a.active,
.sidebar-nav ul li a.active:hover,
.sidebar-nav ul li.active a.has-arrow:hover {
    color: #FFFFFF !important;
    background: var(--admin-sidebar-active-bg) !important;
}

.sidebar-nav ul li a.active i,
.sidebar-nav ul li a.active:hover i,
.sidebar-nav ul li.active a:hover i {
    color: var(--admin-sidebar-active) !important;
}

/* Sub-menu items */
.sidebar-nav ul li ul {
    background: var(--admin-sidebar-dark) !important;
}

.sidebar-nav ul li ul li a {
    color: var(--admin-sidebar-text) !important;
}

.sidebar-nav ul li ul li a:hover,
.sidebar-nav ul li ul li.active a {
    color: #FFFFFF !important;
    border-color: var(--admin-sidebar-active) !important;
}

/* Sidebar section labels and search copy must remain readable on navy. */
.sidebar-nav > ul > li.nav-subtitle .nav-subtitle-span {
    color: rgba(255, 255, 255, 0.65) !important;
}

.sidebar-search input {
    color: rgba(255, 255, 255, 0.9) !important;
}

.sidebar-search input::placeholder {
    color: rgba(255, 255, 255, 0.6) !important;
    opacity: 1;
}

/* Sidebar arrows */
.sidebar-nav ul li a.has-arrow:hover::after,
.sidebar-nav .active > .has-arrow::after,
.sidebar-nav li > .has-arrow.active::after,
.sidebar-nav .has-arrow[aria-expanded="true"]::after {
    border-color: var(--admin-sidebar-active) !important;
}

/* Mini sidebar */
.mini-sidebar .sidebar-nav #sidebarnav > li:hover a i,
.mini-sidebar .sidebar-nav ul li a {
    color: var(--admin-sidebar-text) !important;
}

.mini-sidebar .sidebar-nav #sidebarnav > li:hover a i {
    color: var(--admin-sidebar-active) !important;
}

/* Sidebar header/user area */
.sidebar-nav .user-profile {
    background: var(--admin-sidebar-dark);
}

/* ============================================
   BODY & CARDS
   ============================================ */
body {
    background: var(--admin-body-bg) !important;
}

.page-wrapper > .container-fluid {
    background: var(--admin-body-bg);
}

.card {
    border-radius: var(--admin-radius) !important;
    box-shadow: var(--admin-card-shadow) !important;
    border: none !important;
}

.card-header {
    border-radius: var(--admin-radius) var(--admin-radius) 0 0 !important;
}

/* ============================================
   BUTTONS — Teal accent
   ============================================ */
.btn-primary,
.btn-primary.disabled {
    background: var(--admin-accent) !important;
    border-color: var(--admin-accent) !important;
}

.btn-primary:hover,
.btn-primary.disabled:hover {
    background: var(--admin-accent-dark) !important;
    border-color: var(--admin-accent-dark) !important;
}

.btn-primary.active,
.btn-primary:active,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    background: var(--admin-accent-dark) !important;
    border-color: var(--admin-accent-dark) !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 170, 150, 0.3) !important;
}

.btn-info {
    background: var(--admin-accent) !important;
    border-color: var(--admin-accent) !important;
}

.btn-info:hover {
    background: var(--admin-accent-dark) !important;
    border-color: var(--admin-accent-dark) !important;
}

/* ============================================
   LINKS & TEXT
   ============================================ */
a {
    color: var(--admin-accent);
}

a:hover, a:focus {
    color: var(--admin-accent-dark);
}

.text-themecolor {
    color: var(--admin-accent) !important;
}

.text-info {
    color: var(--admin-accent) !important;
}

/* ============================================
   TABS & NAV
   ============================================ */
.nav-tabs.card-header-tabs .nav-link.active,
.nav-tabs.card-header-tabs .nav-link:hover {
    background: var(--admin-accent) !important;
    border-color: var(--admin-accent) !important;
}

.nav-tabs.card-header-tabs .nav-link span.badge-success {
    background: var(--admin-accent) !important;
}

.profile-tab li a.nav-link.active,
.customtab li a.nav-link.active {
    border-bottom-color: var(--admin-accent) !important;
    color: var(--admin-accent) !important;
}

.profile-tab li a.nav-link:hover,
.customtab li a.nav-link:hover {
    color: var(--admin-accent) !important;
}

.menu-tab ul li.active a,
.menu-tab ul li a:hover {
    border-color: var(--admin-accent) !important;
    background: var(--admin-accent) !important;
}

/* ============================================
   PAGINATION
   ============================================ */
.pagination > .active > a,
.pagination > .active > span,
.pagination > li > a.page-link:hover {
    background-color: var(--admin-accent) !important;
    border-color: var(--admin-accent) !important;
}

.page-link {
    color: var(--admin-accent) !important;
}

/* ============================================
   BACKGROUNDS
   ============================================ */
.bg-info {
    background-color: var(--admin-accent) !important;
}

.bg-theme {
    background-color: var(--admin-accent) !important;
}

.bg-primary {
    background-color: var(--admin-accent) !important;
}

/* ============================================
   TABLE
   ============================================ */
.stylish-table tbody tr:hover,
.stylish-table tbody tr.active {
    border-left-color: var(--admin-accent) !important;
}

.table tr td.redirecttopage {
    color: var(--admin-accent) !important;
}

/* ============================================
   FORM CONTROLS
   ============================================ */
[type="checkbox"]:checked + label::before,
[type="radio"]:checked + label::before {
    border-right-color: var(--admin-accent) !important;
    border-bottom-color: var(--admin-accent) !important;
}

.radio-form [type="radio"]:checked + label::before {
    background: var(--admin-accent) !important;
}

.form-control:focus {
    border-color: var(--admin-accent) !important;
    box-shadow: 0 0 0 0.15rem rgba(0, 170, 150, 0.15) !important;
}

/* ============================================
   BUSINESS ANALYTICS / ORDER STATUS
   ============================================ */
.business-analytics .card-box i {
    background: var(--admin-accent) !important;
}

.order-status .data i,
.order-status span.count {
    color: var(--admin-accent) !important;
}

/* ============================================
   SECTION SELECTOR
   ============================================ */
.cat-slider .cat-item a.cat-link:hover,
.cat-slider .cat-item.section-selected a.cat-link {
    border-color: var(--admin-accent) !important;
}

.cat-slider .cat-item a.cat-link {
    border-bottom-color: var(--admin-accent) !important;
}

.cat-slider .cat-item.section-selected a.cat-link:after {
    border-color: var(--admin-accent) !important;
    background: var(--admin-accent) !important;
}

.cat-slider {
    border-color: var(--admin-accent) !important;
}

/* ============================================
   MISC
   ============================================ */
.right-sidebar .rpanel-title {
    background: var(--admin-accent) !important;
}

.label-themecolor {
    background: var(--admin-accent) !important;
}

ul.rating {
    color: #FFB800 !important; /* Keep ratings gold */
}

.vendor_payout_create-inner fieldset legend {
    background: var(--admin-accent) !important;
}

html body blockquote {
    border-left-color: var(--admin-accent) !important;
}

/* Badge colors */
.badge-primary {
    background: var(--admin-accent) !important;
}

.badge-info {
    background: var(--admin-accent) !important;
}

/* Warning buttons — keep them distinct */
.btn-warning,
.btn-warning.disabled {
    background: #FF9800 !important;
    border-color: #FF9800 !important;
}

.btn-warning:hover {
    background: #F57C00 !important;
    border-color: #F57C00 !important;
}

/* Dropdown active */
.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--admin-accent) !important;
}

/* Scrollbar for sidebar */
.left-sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
}

/* Footer */
.footer {
    background: var(--admin-topbar-bg);
    border-top: 1px solid #E9ECEF;
}

/* Mobile responsive */
@media screen and (max-width: 767px) {
    .mini-sidebar .sidebar-nav ul li a:hover,
    .sidebar-nav > ul > li.active > a {
        color: #FFFFFF !important;
    }
}

/* ============================================
   MODULES SECTION (Service List Dropdown)
   ============================================ */
.service-list-box {
    background: #FFFFFF !important;
    border: 1px solid #E9ECEF !important;
    border-radius: 8px !important;
    transition: all 0.2s ease;
}

.service-list-box:hover,
.service-list-box.selected-section {
    background: rgba(0, 170, 150, 0.05) !important;
    border-color: #00AA96 !important;
}

.service-list-box h3 {
    color: #334257 !important;
}
