/* Dark Theme Fixes for ATOSA B2B */

/* Fix notification bell icon visibility in dark mode */
.dark-mode .header-notify .header-icon,
.dark-mode .header-notify svg.header-icon {
    fill: #ffffff !important;
    color: #ffffff !important;
}

.dark-mode .header-notify svg.header-icon path {
    fill: #ffffff !important;
}

/* 1. Upper right menu - dark background and white text */
.dark-mode .dropdown-menu {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .dropdown-menu .dropdown-item {
    color: #ffffff !important;
}

.dark-mode .dropdown-menu .dropdown-item:hover,
.dark-mode .dropdown-menu .dropdown-item:focus {
    background-color: #2d3154 !important;
    color: #ffffff !important;
}

.dark-mode .dropdown-menu .dropdown-divider {
    border-top-color: #2d3154 !important;
}

/* Profile dropdown in header */
.dark-mode .profile-dropdown .dropdown-menu {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

/* User profile dropdown - all text white */
.dark-mode .profile-dropdown .text-center,
.dark-mode .profile-dropdown .user,
.dark-mode .profile-dropdown .font-weight-bold {
    color: #ffffff !important;
}

.dark-mode .profile-dropdown .user-semi-title {
    color: #c8cdd8 !important;
}

.dark-mode .profile-dropdown .small.text-muted {
    color: #c8cdd8 !important;
}

/* User stats section */
.dark-mode .profile-dropdown .bg-light {
    background-color: #2d3154 !important;
}

.dark-mode .profile-dropdown .text-muted {
    color: #c8cdd8 !important;
}

/* Dropdown items in profile */
.dark-mode .profile-dropdown .dropdown-item {
    color: #ffffff !important;
}

.dark-mode .profile-dropdown .dropdown-item:hover {
    background-color: #2d3154 !important;
    color: #ffffff !important;
}

.dark-mode .profile-dropdown .dropdown-item.text-danger {
    color: #ff6b6b !important;
}

.dark-mode .profile-dropdown .dropdown-item.text-danger:hover {
    background-color: #2d3154 !important;
    color: #ff6b6b !important;
}

/* SVG icons in profile dropdown - Enhanced for all layouts */
.dark-mode .profile-dropdown .dropdown-item svg.header-icon {
    fill: #ffffff !important;
    color: #ffffff !important;
}

.dark-mode .profile-dropdown .dropdown-item svg.header-icon path {
    fill: #ffffff !important;
}

.dark-mode .profile-dropdown .dropdown-item svg.header-icon path[fill="none"] {
    fill: none !important;
}

.dark-mode .profile-dropdown .dropdown-item.text-danger svg.header-icon {
    fill: #ff6b6b !important;
    color: #ff6b6b !important;
}

.dark-mode .profile-dropdown .dropdown-item.text-danger svg.header-icon path {
    fill: #ff6b6b !important;
}

.dark-mode .profile-dropdown .dropdown-item.text-danger svg.header-icon path[fill="none"] {
    fill: none !important;
}

/* More specific rules for user menu dropdown icons */
.dark-mode .profile-dropdown .dropdown-menu a.dropdown-item {
    color: #ffffff !important;
}

.dark-mode .profile-dropdown .dropdown-menu button.dropdown-item.text-danger {
    color: #ff6b6b !important;
}

.dark-mode .profile-dropdown .dropdown-menu a svg.header-icon,
.dark-mode .profile-dropdown .dropdown-menu button svg.header-icon {
    fill: #ffffff !important;
}

.dark-mode .profile-dropdown .dropdown-menu a svg.header-icon path,
.dark-mode .profile-dropdown .dropdown-menu button svg.header-icon path {
    fill: #ffffff !important;
}

.dark-mode .profile-dropdown .dropdown-menu a svg.header-icon path[fill="none"],
.dark-mode .profile-dropdown .dropdown-menu button svg.header-icon path[fill="none"] {
    fill: none !important;
}

.dark-mode .profile-dropdown .dropdown-menu button.text-danger svg.header-icon path {
    fill: #ff6b6b !important;
}

/* Force SVG visibility in all layouts */
body.dark-mode .profile-dropdown svg.header-icon {
    fill: #ffffff !important;
}

body.dark-mode .profile-dropdown svg.header-icon path {
    fill: #ffffff !important;
}

body.dark-mode .profile-dropdown svg.header-icon path[fill="none"] {
    fill: none !important;
}

body.dark-mode .profile-dropdown .text-danger svg.header-icon path {
    fill: #ff6b6b !important;
}

/* Notification dropdown */
.dark-mode .header-notify .dropdown-menu {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .header-notify .dropdown-header {
    background-color: #1a1c32 !important;
    border-bottom-color: #2d3154 !important;
    color: #ffffff !important;
}

.dark-mode .header-notify .dropdown-header h6,
.dark-mode .header-notify .dropdown-header .mb-0 {
    color: #ffffff !important;
}

.dark-mode .header-notify .notify-menu .dropdown-item {
    background-color: #1a1c32 !important;
    border-bottom-color: #2d3154 !important;
    color: #ffffff !important;
}

.dark-mode .header-notify .notify-menu .dropdown-item:hover {
    background-color: #2d3154 !important;
}

.dark-mode .header-notify .notify-menu .dropdown-item.bg-light {
    background-color: #2d3154 !important;
}

.dark-mode .header-notify .notify-menu .dropdown-item .fs-13,
.dark-mode .header-notify .notify-menu .dropdown-item span,
.dark-mode .header-notify .notify-menu .dropdown-item .text-wrap {
    color: #ffffff !important;
}

.dark-mode .header-notify .notify-menu .dropdown-item .text-muted,
.dark-mode .header-notify .notify-menu .dropdown-item .small {
    color: #c8cdd8 !important;
}

.dark-mode .header-notify .dropdown-footer {
    background-color: #1a1c32 !important;
    border-top-color: #2d3154 !important;
}

.dark-mode .header-notify .dropdown-footer .btn {
    color: #ffffff !important;
    border-color: #664dc9 !important;
}

.dark-mode .header-notify .dropdown-footer .btn:hover {
    background-color: #664dc9 !important;
    color: #ffffff !important;
}

/* Language switcher dropdown */
.dark-mode .language-switcher .dropdown-menu,
.dark-mode div.dropdown .dropdown-menu {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .dropdown-header-title,
.dark-mode .language-switcher .dropdown-header h6,
.dark-mode .language-switcher .dropdown-header .dropdown-header-title,
.dark-mode div.dropdown .dropdown-header h6 {
    color: #ffffff !important;
}

.dark-mode .language-switcher .dropdown-item,
.dark-mode .language-switcher .dropdown-item span,
.dark-mode div.dropdown .dropdown-item,
.dark-mode div.dropdown .dropdown-item span {
    color: #ffffff !important;
}

.dark-mode .language-switcher .dropdown-item:hover,
.dark-mode div.dropdown .dropdown-item:hover {
    background-color: #2d3154 !important;
    color: #ffffff !important;
}

.dark-mode .language-switcher .dropdown-item.active,
.dark-mode div.dropdown .dropdown-item.active {
    background-color: #664dc9 !important;
    color: #ffffff !important;
}

.dark-mode .language-switcher .dropdown-item.active span,
.dark-mode div.dropdown .dropdown-item.active span {
    color: #ffffff !important;
}

/* 3. Invoice list - Search by date menu white text */
.dark-mode .btn-group .dropdown-menu {
    background-color: #1a1c32 !important;
}

.dark-mode .btn-group .dropdown-menu .dropdown-item {
    color: #ffffff !important;
}

.dark-mode .btn-group .dropdown-menu .dropdown-item:hover,
.dark-mode .btn-group .dropdown-menu .dropdown-item.active {
    background-color: #664dc9 !important;
    color: #ffffff !important;
}

/* 4. All search drop-down menus - white text on dark background */
.dark-mode .select2-container--default .select2-selection--single {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
    color: #ffffff !important;
}

.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #ffffff !important;
}

.dark-mode .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #ffffff transparent transparent transparent !important;
}

.dark-mode .select2-dropdown {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .select2-container--default .select2-results__option {
    color: #ffffff !important;
    background-color: #1a1c32 !important;
}

.dark-mode .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #664dc9 !important;
    color: #ffffff !important;
}

.dark-mode .select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #2d3154 !important;
}

.dark-mode .select2-search--dropdown .select2-search__field {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
    color: #ffffff !important;
}

/* 6. Orders list - Actions dropdown white text and taller height */
.dark-mode .dropdown-menu.actions-dropdown {
    min-height: 150px !important;
}

.dark-mode .dropdown-menu .dropdown-item {
    padding: 0.75rem 1.5rem !important;
    line-height: 1.8 !important;
}

/* Make all action dropdowns 50% taller */
.dark-mode td .dropdown-menu,
.dark-mode .table .dropdown-menu {
    min-height: 120px !important;
}

.dark-mode td .dropdown-menu .dropdown-item,
.dark-mode .table .dropdown-menu .dropdown-item {
    padding: 0.65rem 1.25rem !important;
    min-height: 40px !important;
    display: flex !important;
    align-items: center !important;
}

/* 8. Shop sort dropdown - white text */
.dark-mode .form-select,
.dark-mode .form-control {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
    color: #ffffff !important;
}

.dark-mode .form-select option {
    background-color: #1a1c32 !important;
    color: #ffffff !important;
}

/* 10. Flash messages - black text for readability */
.dark-mode .alert-success {
    background-color: #d4edda !important;
    border-color: #c3e6cb !important;
    color: #000000 !important;
}

.dark-mode .alert-success .fe,
.dark-mode .alert-success i {
    color: #155724 !important;
}

.dark-mode .alert-success strong,
.dark-mode .alert-success span,
.dark-mode .alert-success p,
.dark-mode .alert-success h6,
.dark-mode .alert-success ul,
.dark-mode .alert-success li {
    color: #000000 !important;
}

.dark-mode .alert-danger {
    background-color: #f8d7da !important;
    border-color: #f5c6cb !important;
    color: #000000 !important;
}

.dark-mode .alert-danger .fe,
.dark-mode .alert-danger i {
    color: #721c24 !important;
}

.dark-mode .alert-danger strong,
.dark-mode .alert-danger span,
.dark-mode .alert-danger p,
.dark-mode .alert-danger h6,
.dark-mode .alert-danger ul,
.dark-mode .alert-danger li {
    color: #000000 !important;
}

.dark-mode .alert-info {
    background-color: #d1ecf1 !important;
    border-color: #bee5eb !important;
    color: #000000 !important;
}

.dark-mode .alert-info .fe,
.dark-mode .alert-info i {
    color: #0c5460 !important;
}

.dark-mode .alert-info strong,
.dark-mode .alert-info span,
.dark-mode .alert-info p,
.dark-mode .alert-info h6,
.dark-mode .alert-info ul,
.dark-mode .alert-info li {
    color: #000000 !important;
}

.dark-mode .alert-warning {
    background-color: #fff3cd !important;
    border-color: #ffeaa7 !important;
    color: #000000 !important;
}

.dark-mode .alert-warning .fe,
.dark-mode .alert-warning i {
    color: #856404 !important;
}

.dark-mode .alert-warning strong,
.dark-mode .alert-warning span,
.dark-mode .alert-warning p,
.dark-mode .alert-warning h6,
.dark-mode .alert-warning ul,
.dark-mode .alert-warning li {
    color: #000000 !important;
}

/* Additional dropdown fixes */
.dark-mode .dropdown-toggle::after {
    border-top-color: #ffffff !important;
}

/* Datepicker dropdown */
.dark-mode .datepicker-dropdown {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .datepicker table tr td,
.dark-mode .datepicker table tr th {
    color: #ffffff !important;
}

.dark-mode .datepicker table tr td.day:hover {
    background-color: #2d3154 !important;
}

.dark-mode .datepicker table tr td.active,
.dark-mode .datepicker table tr td.active:hover {
    background-color: #664dc9 !important;
    color: #ffffff !important;
}

/* TinyMCE dark mode support */
.dark-mode .tox .tox-menubar,
.dark-mode .tox .tox-toolbar,
.dark-mode .tox .tox-toolbar__primary {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .tox .tox-tbtn {
    color: #ffffff !important;
}

.dark-mode .tox .tox-edit-area__iframe {
    background-color: #1a1c32 !important;
}

.dark-mode .tox .tox-statusbar {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
    color: #ffffff !important;
}

/* Ensure dropdown menus appear above other elements */
.dark-mode .dropdown-menu {
    z-index: 1050 !important;
}

/* Fix for button dropdowns */
.dark-mode .btn-group .dropdown-toggle {
    color: #ffffff !important;
}

/* Additional form controls */
.dark-mode input[type="date"],
.dark-mode input[type="time"],
.dark-mode input[type="datetime-local"] {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
    color: #ffffff !important;
    color-scheme: dark;
}

/* Calendar icon color */
.dark-mode input[type="date"]::-webkit-calendar-picker-indicator,
.dark-mode input[type="time"]::-webkit-calendar-picker-indicator,
.dark-mode input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1);
    cursor: pointer;
    opacity: 1;
}

/* Ensure date input is clickable */
.dark-mode input[type="date"] {
    position: relative;
    cursor: pointer !important;
}

/* Make sure the calendar picker is visible and clickable */
.dark-mode input[type="date"]::-webkit-calendar-picker-indicator {
    position: relative;
    z-index: 2;
    pointer-events: auto;
}

/* Pickup date section - ensure no overlays */
.dark-mode .pickup-date-section {
    position: relative;
    z-index: 1;
}

.dark-mode .pickup-date-section .bg-light {
    background-color: #2d3154 !important;
}

.dark-mode .pickup-date-section input[type="date"] {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
    color: #ffffff !important;
    position: relative;
    z-index: 10;
}

/* Textarea */
.dark-mode textarea.form-control {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
    color: #ffffff !important;
}

/* Placeholder text */
.dark-mode ::placeholder {
    color: #8a92a6 !important;
    opacity: 1;
}

.dark-mode :-ms-input-placeholder {
    color: #8a92a6 !important;
}

.dark-mode ::-ms-input-placeholder {
    color: #8a92a6 !important;
}

/* Additional header icon fixes */
.dark-mode .header-icon,
.dark-mode svg.header-icon {
    fill: #ffffff !important;
    color: #ffffff !important;
}

.dark-mode .header-icon path {
    fill: #ffffff !important;
}

/* Profile dropdown user stats section */
.dark-mode .profile-dropdown .bg-light {
    background-color: #2d3154 !important;
}

.dark-mode .profile-dropdown .text-muted {
    color: #8a92a6 !important;
}

/* Ensure all header dropdowns have consistent styling */
.dark-mode .header .dropdown-menu {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .header .dropdown-menu .dropdown-item {
    color: #ffffff !important;
}

.dark-mode .header .dropdown-menu .dropdown-item:hover {
    background-color: #2d3154 !important;
}

.dark-mode .header .dropdown-menu .dropdown-divider {
    border-top-color: #2d3154 !important;
}

/* Fix for page header dropdowns (like search by date) */
.dark-mode .page-header .dropdown-menu {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .page-header .dropdown-menu .dropdown-item {
    color: #ffffff !important;
}

.dark-mode .page-header .dropdown-menu .dropdown-item:hover,
.dark-mode .page-header .dropdown-menu .dropdown-item.active {
    background-color: #664dc9 !important;
    color: #ffffff !important;
}

/* Shop page - vertical spacing between title, category, and description */
.shop-title {
    display: block !important;
    margin-bottom: 0.75rem !important;
}

.cardtitle {
    margin-bottom: 0.5rem !important;
}

.cardtitle + small.text-muted {
    display: block !important;
    margin-bottom: 1rem !important;
}

.shop-description {
    margin-top: 1rem !important;
}

/* Checkout - Total de Plată amount text white in dark mode */
.dark-mode .order-totals .text-primary,
.dark-mode .order-summary-mini .text-primary {
    color: #ffffff !important;
}

/* Success buttons - black text in dark mode */
.dark-mode .btn-success {
    color: #000 !important;
}

/* Orders list table - double the row height for dropdown visibility */
.table tbody tr {
    min-height: 120px !important;
}

.table tbody td {
    vertical-align: middle !important;
    padding: 1.5rem 0.75rem !important;
}

/* Ensure dropdown menu is visible and has enough space */
.table .dropdown-menu {
    min-height: 200px !important;
    max-height: 400px !important;
    overflow-y: auto !important;
}

/* Make table rows taller specifically for orders list */
.table-responsive .table tbody tr {
    height: 120px !important;
    min-height: 120px !important;
}

/* Shop page sort dropdown - ensure white text */
.dark-mode .btn-pill.dropdown-toggle + .dropdown-menu {
    background-color: #1a1c32 !important;
    border-color: #2d3154 !important;
}

.dark-mode .btn-pill.dropdown-toggle + .dropdown-menu .dropdown-item {
    color: #ffffff !important;
}

.dark-mode .btn-pill.dropdown-toggle + .dropdown-menu .dropdown-item:hover,
.dark-mode .btn-pill.dropdown-toggle + .dropdown-menu .dropdown-item:focus {
    background-color: #2d3154 !important;
    color: #ffffff !important;
}