/* Theme CSS Variables */

/* Default Theme (Orange) */
.theme-default {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Blue Theme */
.theme-blue {
    --primary-color: #2196F3;
    --primary-dark: #1976D2;
    --primary-light: #42A5F5;
    --secondary-color: #1565C0;
    --accent-color: #03DAC6;
    --text-color: #1565C0;
    --light-bg: #F0F8FF;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Green Theme */
.theme-green {
    --primary-color: #4CAF50;
    --primary-dark: #388E3C;
    --primary-light: #66BB6A;
    --secondary-color: #2E7D32;
    --accent-color: #8BC34A;
    --text-color: #2E7D32;
    --light-bg: #F0FFF0;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Purple Theme */
.theme-purple {
    --primary-color: #9C27B0;
    --primary-dark: #7B1FA2;
    --primary-light: #BA68C8;
    --secondary-color: #6A1B9A;
    --accent-color: #E1BEE7;
    --text-color: #6A1B9A;
    --light-bg: #F8F0FF;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Red Theme */
.theme-red {
    --primary-color: #F44336;
    --primary-dark: #D32F2F;
    --primary-light: #EF5350;
    --secondary-color: #C62828;
    --accent-color: #FFCDD2;
    --text-color: #C62828;
    --light-bg: #FFF0F0;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Dark Theme - Updated to Light */
.theme-dark {
    --primary-color: #2D3142;
    --primary-dark: #1A1D28;
    --primary-light: #4A5568;
    --secondary-color: #1A1D28;
    --accent-color: #FF6B35;
    --text-color: #2D3142;
    --light-bg: #F5F5F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Elegant Theme */
.theme-elegant {
    --primary-color: #607D8B;
    --primary-dark: #455A64;
    --primary-light: #90A4AE;
    --secondary-color: #37474F;
    --accent-color: #CFD8DC;
    --text-color: #37474F;
    --light-bg: #F5F7F8;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Modern Theme */
.theme-modern {
    --primary-color: #00BCD4;
    --primary-dark: #0097A7;
    --primary-light: #26C6DA;
    --secondary-color: #006064;
    --accent-color: #B2EBF2;
    --text-color: #006064;
    --light-bg: #F0FDFF;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Dark Blue Theme - Updated to Light */
.theme-dark-blue {
    --primary-color: #1E3A8A;
    --primary-dark: #1E40AF;
    --primary-light: #3B82F6;
    --secondary-color: #1E293B;
    --accent-color: #60A5FA;
    --text-color: #1E293B;
    --light-bg: #F0F4FF;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Dark Green Theme - Updated to Light */
.theme-dark-green {
    --primary-color: #065F46;
    --primary-dark: #047857;
    --primary-light: #10B981;
    --secondary-color: #064E3B;
    --accent-color: #34D399;
    --text-color: #064E3B;
    --light-bg: #F0FFF4;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Dark Red Theme - Updated to Light */
.theme-dark-red {
    --primary-color: #7F1D1D;
    --primary-dark: #991B1B;
    --primary-light: #DC2626;
    --secondary-color: #450A0A;
    --accent-color: #F87171;
    --text-color: #450A0A;
    --light-bg: #FFF5F5;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Royal Purple Theme - Updated to Light */
.theme-royal-purple {
    --primary-color: #581C87;
    --primary-dark: #7C3AED;
    --primary-light: #A855F7;
    --secondary-color: #3B0764;
    --accent-color: #C084FC;
    --text-color: #3B0764;
    --light-bg: #FAF5FF;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Midnight Theme - Updated to Light */
.theme-midnight {
    --primary-color: #1F2937;
    --primary-dark: #111827;
    --primary-light: #374151;
    --secondary-color: #0F172A;
    --accent-color: #6B7280;
    --text-color: #1F2937;
    --light-bg: #F9FAFB;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Pink Theme */
.theme-pink {
    --primary-color: #EC4899;
    --primary-dark: #BE185D;
    --primary-light: #F9A8D4;
    --secondary-color: #BE185D;
    --accent-color: #F9A8D4;
    --text-color: #BE185D;
    --light-bg: #FDF2F8;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Brown Theme */
.theme-brown {
    --primary-color: #A0522D;
    --primary-dark: #8B4513;
    --primary-light: #D2691E;
    --secondary-color: #8B4513;
    --accent-color: #D2691E;
    --text-color: #8B4513;
    --light-bg: #FDF8F3;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Yellow Theme */
.theme-yellow {
    --primary-color: #F59E0B;
    --primary-dark: #D97706;
    --primary-light: #FCD34D;
    --secondary-color: #D97706;
    --accent-color: #FCD34D;
    --text-color: #D97706;
    --light-bg: #FFFBEB;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Gold Theme */
.theme-gold {
    --primary-color: #D4AF37;
    --primary-dark: #B8860B;
    --primary-light: #FFD700;
    --secondary-color: #B8860B;
    --accent-color: #FFD700;
    --text-color: #B8860B;
    --light-bg: #FFFBEB;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Teal Theme */
.theme-teal {
    --primary-color: #14B8A6;
    --primary-dark: #0F766E;
    --primary-light: #5EEAD4;
    --secondary-color: #0F766E;
    --accent-color: #5EEAD4;
    --text-color: #0F766E;
    --light-bg: #F0FDFA;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Indigo Theme */
.theme-indigo {
    --primary-color: #6366F1;
    --primary-dark: #4338CA;
    --primary-light: #A5B4FC;
    --secondary-color: #4338CA;
    --accent-color: #A5B4FC;
    --text-color: #4338CA;
    --light-bg: #EEF2FF;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Coral Theme */
.theme-coral {
    --primary-color: #FF6B6B;
    --primary-dark: #E53E3E;
    --primary-light: #FCA5A5;
    --secondary-color: #E53E3E;
    --accent-color: #FCA5A5;
    --text-color: #E53E3E;
    --light-bg: #FEF2F2;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Sunset Gradient Theme */
.theme-gradient-sunset {
    --primary-color: #FF6B6B;
    --primary-dark: #FF8E53;
    --primary-light: #FFE66D;
    --secondary-color: #FF8E53;
    --accent-color: #FFE66D;
    --text-color: #FF8E53;
    --light-bg: #FFF5F5;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Ocean Gradient Theme */
.theme-gradient-ocean {
    --primary-color: #667eea;
    --primary-dark: #764ba2;
    --primary-light: #a8c0ff;
    --secondary-color: #764ba2;
    --accent-color: #a8c0ff;
    --text-color: #764ba2;
    --light-bg: #F0F4FF;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Forest Gradient Theme */
.theme-gradient-forest {
    --primary-color: #11998e;
    --primary-dark: #38ef7d;
    --primary-light: #7dd3fc;
    --secondary-color: #38ef7d;
    --accent-color: #7dd3fc;
    --text-color: #38ef7d;
    --light-bg: #F0FFF4;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Purple Gradient Theme */
.theme-gradient-purple {
    --primary-color: #667eea;
    --primary-dark: #764ba2;
    --primary-light: #a8c0ff;
    --secondary-color: #764ba2;
    --accent-color: #a8c0ff;
    --text-color: #764ba2;
    --light-bg: #FAF5FF;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Neon Pink Theme */
.theme-neon-pink {
    --primary-color: #FF1493;
    --primary-dark: #FF69B4;
    --primary-light: #FFB6C1;
    --secondary-color: #FF69B4;
    --accent-color: #FFB6C1;
    --text-color: #FF69B4;
    --light-bg: #FDF2F8;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Neon Blue Theme */
.theme-neon-blue {
    --primary-color: #00BFFF;
    --primary-dark: #1E90FF;
    --primary-light: #87CEEB;
    --secondary-color: #1E90FF;
    --accent-color: #87CEEB;
    --text-color: #1E90FF;
    --light-bg: #F0F8FF;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Neon Green Theme */
.theme-neon-green {
    --primary-color: #39FF14;
    --primary-dark: #32CD32;
    --primary-light: #90EE90;
    --secondary-color: #32CD32;
    --accent-color: #90EE90;
    --text-color: #32CD32;
    --light-bg: #F0FFF0;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Vintage Theme */
.theme-vintage {
    --primary-color: #8B4513;
    --primary-dark: #654321;
    --primary-light: #CD853F;
    --secondary-color: #654321;
    --accent-color: #CD853F;
    --text-color: #654321;
    --light-bg: #FDF8F3;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}

/* Minimal Theme */
.theme-minimal {
    --primary-color: #F5F5F5;
    --primary-dark: #E0E0E0;
    --primary-light: #CCCCCC;
    --secondary-color: #E0E0E0;
    --accent-color: #CCCCCC;
    --text-color: #666666;
    --light-bg: #FFFFFF;
    --white: #FFFFFF;
    --success: #10B981;
    --danger: #EF4444;
    --warning: #F59E0B;
    --info: #3B82F6;
}

/* Custom Theme - will be dynamically updated with JavaScript */
.theme-custom {
    --primary-color: #FF6B35;
    --primary-dark: #E85A2A;
    --primary-light: #FF8B5F;
    --secondary-color: #2D3142;
    --accent-color: #FFB400;
    --text-color: #2D3142;
    --light-bg: #FFF8F5;
    --white: #FFFFFF;
    --success: #4CAF50;
    --danger: #FF5252;
    --warning: #FFB400;
    --info: #2196F3;
}

/* Enhanced custom theme support */
.theme-custom .btn-primary,
.theme-custom .btn-outline-primary,
.theme-custom .navbar-brand,
.theme-custom .menu-section h2,
.theme-custom .item-price,
.theme-custom .add-to-cart-btn {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .btn-outline-primary:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
}

.theme-custom .menu-item .card:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

.theme-custom .theme-primary {
    color: var(--primary-color) !important;
}

/* Dark Mode Styles */
.dark-mode {
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3a3a3a;
    --text-primary: #ffffff;
    --text-secondary: #b3b3b3;
    --text-muted: #808080;
    --border-color: #404040;
    --shadow-color: rgba(0, 0, 0, 0.3);
}

.dark-mode body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

.dark-mode .navbar {
    background-color: var(--bg-secondary) !important;
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .navbar-brand,
.dark-mode .navbar-nav .nav-link {
    color: var(--text-primary) !important;
}

.dark-mode .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .card-header {
    background-color: var(--bg-tertiary);
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .form-control {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .form-control:focus {
    background-color: var(--bg-tertiary);
    border-color: var(--primary-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.2rem rgba(255, 107, 53, 0.25);
}

.dark-mode .form-label {
    color: var(--text-primary);
}

.dark-mode .btn-outline-secondary {
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .btn-outline-secondary:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
    border-color: var(--border-color);
}

.dark-mode .table {
    color: var(--text-primary);
}

.dark-mode .table th {
    background-color: var(--bg-tertiary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.dark-mode .table td {
    border-color: var(--border-color);
}

.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.05);
}

.dark-mode .modal-content {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .modal-header {
    border-bottom: 1px solid var(--border-color);
}

.dark-mode .modal-footer {
    border-top: 1px solid var(--border-color);
}

.dark-mode .modal-title {
    color: var(--text-primary);
}

.dark-mode .btn-close {
    filter: invert(1);
}

.dark-mode .dropdown-menu {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .dropdown-item {
    color: var(--text-primary);
}

.dark-mode .dropdown-item:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .alert {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .text-muted {
    color: var(--text-muted) !important;
}

.dark-mode .border {
    border-color: var(--border-color) !important;
}

.dark-mode .border-top {
    border-top-color: var(--border-color) !important;
}

.dark-mode .border-bottom {
    border-bottom-color: var(--border-color) !important;
}

.dark-mode .border-start {
    border-left-color: var(--border-color) !important;
}

.dark-mode .border-end {
    border-right-color: var(--border-color) !important;
}

/* Dark mode for specific components */
.dark-mode .menu-item .card {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .menu-item .card:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px var(--shadow-color);
}

.dark-mode .menu-section h2 {
    color: var(--text-primary);
}

.dark-mode .item-price {
    color: var(--primary-color);
}

.dark-mode .item-description {
    color: var(--text-secondary);
}

.dark-mode .cart-item {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.dark-mode .cart-total {
    background-color: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

/* Dark mode for admin dashboard */
.dark-mode .sidebar {
    background-color: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

.dark-mode .sidebar .nav-link {
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .sidebar .nav-link.active {
    background-color: var(--primary-color);
    color: white;
}

.dark-mode .main-content {
    background-color: var(--bg-primary);
}

.dark-mode .settings-nav-btn {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn:hover {
    background-color: var(--bg-tertiary);
    color: var(--text-primary);
}

.dark-mode .settings-nav-btn.active {
    background-color: var(--primary-color);
    color: white;
}