/* Custom Admin Panel Styling - Yellow Theme */
:root {
    --primary-yellow: #fae97b;
    --dark-yellow: #0c1237;
    --light-yellow: #fff8e1;
    --lighter-yellow: #fffde7;
    --dark-text: #5d4037;
    --light-text: #fff3e0;
    --accent-yellow: #ffd54f;
    --border-yellow: #cbc67c;
}

/* Main background */
.content-wrapper {
    background-color: var(--lighter-yellow) !important;
}

/* Sidebar styling */
.main-sidebar {
    background-color: var(--dark-yellow) !important;
    border-right: 1px solid var(--border-yellow) !important;
}

/* Sidebar menu items */
.nav-sidebar > .nav-item > .nav-link {
    color: #f0f0f0 !important;  /* Light color for text and icons */
    border-left: 3px solid transparent !important;
    transition: all 0.3s ease;
}

/* Icons in sidebar */
.nav-sidebar > .nav-item > .nav-link i {
    color: #f0f0f0 !important;  /* Ensure icons are visible */
}

/* Hover effect on sidebar items */
.nav-sidebar > .nav-item > .nav-link:hover {
    background-color: var(--primary-yellow) !important;
    color: var(--dark-text) !important;
    border-left: 3px solid var(--dark-yellow) !important;
}

.nav-sidebar > .nav-item > .nav-link:hover i {
    color: var(--dark-text) !important;  /* Change icon color on hover */
}

/* Active menu item */
.nav-sidebar > .nav-item.menu-open > .nav-link,
.nav-sidebar > .nav-item > .nav-link.active {
    background-color: var(--primary-yellow) !important;
    color: var(--dark-text) !important;
    font-weight: 600;
    border-left: 3px solid var(--dark-yellow) !important;
}

.nav-sidebar > .nav-item.menu-open > .nav-link i,
.nav-sidebar > .nav-item > .nav-link.active i {
    color: var(--dark-text) !important;  /* Active state icon color */
}

/* Brand logo area */
.main-header {
    background-color: var(--primary-yellow) !important;
    border-bottom: 1px solid var(--border-yellow) !important;
}

.main-header .brand-link {
    background-color: var(--primary-yellow) !important;
    color: var(--dark-text) !important;
    border-bottom: none !important;
}

/* Search box in sidebar */
.sidebar-form {
    border: 1px solid var(--border-yellow) !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
}

/* Card styling */
.card {
    border: 1px solid var(--border-yellow) !important;
    border-radius: 8px !important;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05) !important;
}

.card-header {
    background-color: var(--light-yellow) !important;
    border-bottom: 1px solid var(--border-yellow) !important;
    color: var(--dark-text);
    font-weight: 600;
}

/* Buttons */
.btn-primary {
    background-color: var(--primary-yellow) !important;
    border-color: var(--dark-yellow) !important;
    color: var(--dark-text) !important;
    transition: all 0.3s ease;
}

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

/* Form controls */
.form-control:focus, 
.select2-selection,
.form-control {
    border-color: var(--border-yellow) !important;
    box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.25) !important;
}

/* Table styling */
.table thead th {
    background-color: var(--light-yellow) !important;
    border-bottom: 2px solid var(--border-yellow) !important;
    color: var(--dark-text);
}

.table-hover tbody tr:hover {
    background-color: rgba(255, 213, 79, 0.2) !important;
}

/* Navbar user panel */
.user-panel {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Content header */
.content-header {
    padding: 15px 20px !important;
    background-color: white;
    border-bottom: 1px solid rgba(0,0,0,0.05);
    margin-bottom: 20px;
}

/* Badges */
.badge-primary {
    background-color: var(--primary-yellow) !important;
    color: var(--dark-text) !important;
}

/* Pagination */
.page-item.active .page-link {
    background-color: var(--primary-yellow) !important;
    border-color: var(--dark-yellow) !important;
    color: var(--dark-text) !important;
}

.page-link {
    color: var(--dark-yellow) !important;
}

.page-link:hover {
    color: var(--dark-text) !important;
}