/**
 * Custom Dark Mode Theme - Dark Slate
 * 
 * A modern, professional dark theme that complements the primary brand color #F05624
 * 
 * Color Palette:
 * - Background: #1A1D29 (Dark slate blue-grey)
 * - Sidebar: #262A38 (Lighter slate)
 * - Accent: #F05624 (Primary orange - unchanged)
 * - Text: #E8E8E8 (Soft white)
 * - Text Secondary: #B8BAC0 (Muted grey)
 * - Border: #2F3441 (Subtle border)
 */

/* ===== Prevent FOUC (Flash of Unstyled Content) ===== */
/* Apply dark styles to html element immediately */
html[data-bs-theme="dark"],
html.theme-loading-dark {
    background-color: #1a1d29 !important;
}

/* ===== Dark Mode Base Styles ===== */
body[data-bs-theme="dark"] {
    background-color: #1a1d29 !important;
    color: #e8e8e8 !important;
}

/* ===== Main Content Area ===== */
body[data-bs-theme="dark"] .main-content {
    background-color: #1a1d29 !important;
}

body[data-bs-theme="dark"] .page-content {
    background-color: #1a1d29 !important;
}

/* ===== Cards ===== */
body[data-bs-theme="dark"] .card {
    background-color: #262a38 !important;
    border: 2px solid #404654 !important;
    color: #e8e8e8 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

body[data-bs-theme="dark"] .card-header {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .card-body {
    background-color: #262a38 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .card-footer {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
}

/* ===== Sidebar ===== */
body[data-bs-theme="dark"][data-sidebar="dark"] .vertical-menu {
    background-color: #262a38 !important;
}

body[data-bs-theme="dark"] .vertical-menu {
    background-color: #262a38 !important;
}

body[data-bs-theme="dark"] #sidebar-menu ul li a {
    color: #b8bac0 !important;
}

body[data-bs-theme="dark"] #sidebar-menu ul li a:hover {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] #sidebar-menu ul li.mm-active > a {
    color: #f05624 !important;
    background-color: rgba(240, 86, 36, 0.1) !important;
}

body[data-bs-theme="dark"] .mm-active .active {
    color: #f05624 !important;
}

/* ===== Top Navbar ===== */
body[data-bs-theme="dark"][data-topbar="dark"] .navbar-header {
    background-color: #262a38 !important;
    border-bottom: 1px solid #2f3441 !important;
}

body[data-bs-theme="dark"] .header-item {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .navbar-header .dropdown-menu {
    background-color: #262a38 !important;
    border-color: #2f3441 !important;
}

body[data-bs-theme="dark"] .navbar-header .dropdown-item {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .navbar-header .dropdown-item:hover {
    background-color: #2f3441 !important;
    color: #f05624 !important;
}

/* ===== Text Colors ===== */
body[data-bs-theme="dark"] h1,
body[data-bs-theme="dark"] h2,
body[data-bs-theme="dark"] h3,
body[data-bs-theme="dark"] h4,
body[data-bs-theme="dark"] h5,
body[data-bs-theme="dark"] h6 {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] p {
    color: #b8bac0 !important;
}

body[data-bs-theme="dark"] .text-muted {
    color: #b8bac0 !important;
}

body[data-bs-theme="dark"] label {
    color: #e8e8e8 !important;
}

/* Fix Input Fields background and text */
body[data-bs-theme="dark"] input.form-control,
body[data-bs-theme="dark"] textarea.form-control {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] input.form-control:focus,
body[data-bs-theme="dark"] textarea.form-control:focus {
    background-color: #2f3441 !important;
    border-color: #f05624 !important;
    color: #e8e8e8 !important;
    box-shadow: 0 0 0 0.2rem rgba(240, 86, 36, 0.25) !important;
}

/* Restore bg-primary for Card Headers (like in Support Form) */
body[data-bs-theme="dark"] .card-header.bg-primary {
    background-color: #f05624 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #f05624 !important;
}

body[data-bs-theme="dark"] .card-header.bg-primary h5 {
    color: #ffffff !important;
}

/* ===== Forms ===== */
body[data-bs-theme="dark"] .form-control {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .form-control:focus {
    background-color: #2f3441 !important;
    border-color: #f05624 !important;
    color: #e8e8e8 !important;
    box-shadow: 0 0 0 0.2rem rgba(240, 86, 36, 0.25) !important;
}

body[data-bs-theme="dark"] .form-control::placeholder {
    color: #75798b !important;
}

body[data-bs-theme="dark"] .form-select {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .form-select:focus {
    border-color: #f05624 !important;
    box-shadow: 0 0 0 0.2rem rgba(240, 86, 36, 0.25) !important;
}

body[data-bs-theme="dark"] .custom-select {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
    color: #e8e8e8 !important;
}

/* ===== Tables ===== */
body[data-bs-theme="dark"] .table {
    color: #e8e8e8 !important;
    border-color: #2f3441 !important;
}

body[data-bs-theme="dark"] .table thead th {
    background-color: #2f3441 !important;
    color: #e8e8e8 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .table tbody td {
    background-color: #262a38 !important;
    color: #e8e8e8 !important;
    border-color: #2f3441 !important;
}

body[data-bs-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(47, 52, 65, 0.5) !important;
}

body[data-bs-theme="dark"] .table-hover tbody tr:hover {
    background-color: #2f3441 !important;
    color: #e8e8e8 !important;
}

/* ===== Buttons - Keep Primary Orange ===== */
body[data-bs-theme="dark"] .btn-primary {
    background-color: #f05624 !important;
    border-color: #f05624 !important;
    color: #ffffff !important;
}

body[data-bs-theme="dark"] .btn-primary:hover {
    background-color: #d44a1f !important;
    border-color: #d44a1f !important;
}

body[data-bs-theme="dark"] .btn-outline-primary {
    color: #f05624 !important;
    border-color: #f05624 !important;
}

body[data-bs-theme="dark"] .btn-outline-primary:hover {
    background-color: #f05624 !important;
    border-color: #f05624 !important;
    color: #ffffff !important;
}

body[data-bs-theme="dark"] .btn-secondary {
    background-color: #404654 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .btn-secondary:hover {
    background-color: #4f5463 !important;
    border-color: #4f5463 !important;
}

/* Danger Buttons */
body[data-bs-theme="dark"] .btn-danger {
    background-color: #e12823 !important;
    border-color: #e12823 !important;
    color: #ffffff !important;
}

body[data-bs-theme="dark"] .btn-danger:hover {
    background-color: #c41f1a !important;
    border-color: #c41f1a !important;
}

body[data-bs-theme="dark"] .btn-outline-danger {
    color: #e12823 !important;
    border-color: #e12823 !important;
}

body[data-bs-theme="dark"] .btn-outline-danger:hover {
    background-color: #e12823 !important;
    border-color: #e12823 !important;
    color: #ffffff !important;
}

/* Success Buttons */
body[data-bs-theme="dark"] .btn-success {
    background-color: #38c67f !important;
    border-color: #38c67f !important;
    color: #ffffff !important;
}

body[data-bs-theme="dark"] .btn-success:hover {
    background-color: #2da968 !important;
    border-color: #2da968 !important;
}

body[data-bs-theme="dark"] .btn-outline-success {
    color: #38c67f !important;
    border-color: #38c67f !important;
}

body[data-bs-theme="dark"] .btn-outline-success:hover {
    background-color: #38c67f !important;
    border-color: #38c67f !important;
    color: #ffffff !important;
}

/* Info Buttons */
body[data-bs-theme="dark"] .btn-info {
    background-color: #4ba6ef !important;
    border-color: #4ba6ef !important;
    color: #ffffff !important;
}

body[data-bs-theme="dark"] .btn-info:hover {
    background-color: #3590db !important;
    border-color: #3590db !important;
}

body[data-bs-theme="dark"] .btn-outline-info {
    color: #4ba6ef !important;
    border-color: #4ba6ef !important;
}

body[data-bs-theme="dark"] .btn-outline-info:hover {
    background-color: #4ba6ef !important;
    border-color: #4ba6ef !important;
    color: #ffffff !important;
}

/* Warning Buttons */
body[data-bs-theme="dark"] .btn-warning {
    background-color: #ffc107 !important;
    border-color: #ffc107 !important;
    color: #1a1d29 !important;
}

body[data-bs-theme="dark"] .btn-warning:hover {
    background-color: #e0a800 !important;
    border-color: #e0a800 !important;
}

body[data-bs-theme="dark"] .btn-outline-warning {
    color: #ffc107 !important;
    border-color: #ffc107 !important;
}

body[data-bs-theme="dark"] .btn-outline-warning:hover {
    background-color: #ffc107 !important;
    border-color: #ffc107 !important;
    color: #1a1d29 !important;
}

/* Light/Secondary Outline Buttons - Make them visible */
body[data-bs-theme="dark"] .btn-outline-secondary {
    color: #b8bac0 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .btn-outline-secondary:hover {
    background-color: #404654 !important;
    border-color: #404654 !important;
    color: #ffffff !important;
}

body[data-bs-theme="dark"] .btn-light {
    background-color: #404654 !important;
    border-color: #404654 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .btn-light:hover {
    background-color: #4f5463 !important;
    border-color: #4f5463 !important;
}

/* ===== Badges ===== */
body[data-bs-theme="dark"] .badge {
    background-color: #2f3441 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .badge.bg-primary {
    background-color: #f05624 !important;
    color: #ffffff !important;
}

/* ===== Dropdowns ===== */
body[data-bs-theme="dark"] .dropdown-menu {
    background-color: #262a38 !important;
    border-color: #2f3441 !important;
}

body[data-bs-theme="dark"] .dropdown-item {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .dropdown-item:hover,
body[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: #2f3441 !important;
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .dropdown-divider {
    border-color: #2f3441 !important;
}

/* ===== Modals ===== */
body[data-bs-theme="dark"] .modal-content {
    background-color: #262a38 !important;
    border-color: #2f3441 !important;
}

body[data-bs-theme="dark"] .modal-header {
    background-color: #2f3441 !important;
    border-bottom-color: #404654 !important;
}

body[data-bs-theme="dark"] .modal-footer {
    background-color: #2f3441 !important;
    border-top-color: #404654 !important;
}

body[data-bs-theme="dark"] .modal-title {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .close {
    color: #e8e8e8 !important;
}

/* ===== Alerts ===== */
body[data-bs-theme="dark"] .alert {
    border-color: #2f3441 !important;
}

body[data-bs-theme="dark"] .alert-primary {
    background-color: rgba(240, 86, 36, 0.2) !important;
    border-color: #f05624 !important;
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .alert-success {
    background-color: rgba(56, 198, 127, 0.2) !important;
    border-color: #38c67f !important;
    color: #38c67f !important;
}

body[data-bs-theme="dark"] .alert-danger {
    background-color: rgba(225, 40, 35, 0.2) !important;
    border-color: #e12823 !important;
    color: #e12823 !important;
}

body[data-bs-theme="dark"] .alert-warning {
    background-color: rgba(255, 193, 7, 0.2) !important;
    border-color: #ffc107 !important;
    color: #ffc107 !important;
}

body[data-bs-theme="dark"] .alert-info {
    background-color: rgba(75, 166, 239, 0.2) !important;
    border-color: #4ba6ef !important;
    color: #4ba6ef !important;
}

/* ===== Borders ===== */
body[data-bs-theme="dark"] .border,
body[data-bs-theme="dark"] hr {
    border-color: #2f3441 !important;
}

/* ===== Page Title & Breadcrumb ===== */
body[data-bs-theme="dark"] .page-title-box {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .breadcrumb {
    background-color: transparent !important;
}

body[data-bs-theme="dark"] .breadcrumb-item {
    color: #b8bac0 !important;
}

body[data-bs-theme="dark"] .breadcrumb-item.active {
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .breadcrumb-item a {
    color: #e8e8e8 !important;
}

/* ===== Pagination ===== */
body[data-bs-theme="dark"] .pagination .page-link {
    background-color: #262a38 !important;
    border-color: #2f3441 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .pagination .page-link:hover {
    background-color: #2f3441 !important;
    border-color: #f05624 !important;
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .pagination .page-item.active .page-link {
    background-color: #f05624 !important;
    border-color: #f05624 !important;
    color: #ffffff !important;
}

/* ===== Custom App Styles ===== */
body[data-bs-theme="dark"] .ordersFilter,
body[data-bs-theme="dark"] .linkStore,
body[data-bs-theme="dark"] .groups-shipments,
body[data-bs-theme="dark"] .manually {
    background-color: #262a38 !important;
    border-color: #2f3441 !important;
}

body[data-bs-theme="dark"] .ordersFilter .custom-select,
body[data-bs-theme="dark"] .ordersFilter .custom-input {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
    color: #e8e8e8 !important;
}

/* ===== Status Badges (Keep Original Colors) ===== */
body[data-bs-theme="dark"] .ready {
    background-color: #cef1df !important;
    color: #38c67f !important;
}

body[data-bs-theme="dark"] .cancelOrder {
    background-color: #f8cac9 !important;
    color: #e12823 !important;
}

/* ===== Scrollbar Dark Theme ===== */
body[data-bs-theme="dark"] ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

body[data-bs-theme="dark"] ::-webkit-scrollbar-track {
    background: #1a1d29;
}

body[data-bs-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #404654;
    border-radius: 5px;
}

body[data-bs-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #4f5463;
}

/* ===== Right Sidebar Settings Panel ===== */
body[data-bs-theme="dark"] .right-bar {
    background-color: #262a38 !important;
}

body[data-bs-theme="dark"] .right-bar h6 {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .form-check-label {
    color: #e8e8e8 !important;
}

/* ===== Links ===== */
body[data-bs-theme="dark"] a {
    color: #f05624 !important;
}

body[data-bs-theme="dark"] a:hover {
    color: #d44a1f !important;
}

/* ===== Toast Notifications ===== */
body[data-bs-theme="dark"] .toast {
    background-color: #262a38 !important;
    border-color: #2f3441 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .toast-header {
    background-color: #2f3441 !important;
    border-bottom-color: #404654 !important;
    color: #e8e8e8 !important;
}

/* ===== Logo Fix - Force Visibility in Dark Mode ===== */
/* Override app.css rules that hide logo-dark when data-topbar=dark */
body[data-bs-theme="dark"][data-topbar="dark"] .logo-dark {
    display: block !important;
}

body[data-bs-theme="dark"][data-topbar="dark"] .logo-light {
    display: none !important;
}

/* Also handle the sidebar logo */
body[data-bs-theme="dark"][data-sidebar="dark"] .logo-dark {
    display: block !important;
}

body[data-bs-theme="dark"][data-sidebar="dark"] .logo-light {
    display: none !important;
}

/* ===== Dashboard Cards - Fix Text Visibility ===== */
/* Make sure all dashboard card text is visible in dark mode */
body[data-bs-theme="dark"] .mainCard .card-body span {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .mainCard .card-body .counter-value {
    color: #ffffff !important;
}

body[data-bs-theme="dark"] .mainCard .card-body .m-text {
    color: #b8bac0 !important;
}

body[data-bs-theme="dark"] .mainCard .card-body .total {
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .updateTables .card .card-body .m-text {
    color: #b8bac0 !important;
}

body[data-bs-theme="dark"] .updateTables .card .card-body .total {
    color: #f05624 !important;
}

/* Make sure all card text is white */
body[data-bs-theme="dark"] .card span,
body[data-bs-theme="dark"] .card .text-nowrap {
    color: #e8e8e8 !important;
}

/* ===== Support Page Fixes ===== */
/* Fix bg-light in dark mode to be dark */
body[data-bs-theme="dark"] .bg-light {
    background-color: #2f3441 !important;
    color: #e8e8e8 !important;
}

/* Fix border-bottom color */
body[data-bs-theme="dark"] .border-bottom {
    border-color: #404654 !important;
}

/* Fix text colors to ensure visibility */
body[data-bs-theme="dark"] .text-primary {
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .text-success {
    color: #38c67f !important;
}

body[data-bs-theme="dark"] .text-info {
    color: #4ba6ef !important;
}

/* Ensure form labels are visible */
body[data-bs-theme="dark"] .form-label {
    color: #e8e8e8 !important;
}

/* Fix Support Form Layout - Prevent fields from escaping card */
body[data-bs-theme="dark"] .card form .card-body {
    position: relative !important;
    z-index: 1 !important;
}

body[data-bs-theme="dark"] .card-header {
    position: relative !important;
    z-index: 10 !important;
}

body[data-bs-theme="dark"] .card form .mb-3,
body[data-bs-theme="dark"] .card form .col-md-6,
body[data-bs-theme="dark"] .card form .col-12 {
    position: relative !important;
    z-index: auto !important;
}

/* Fix card-body.row width - Remove negative margins that make it wider than header/footer */
body[data-bs-theme="dark"] .card .card-body.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ===== Invoice Boxes Dark Mode ===== */
body[data-bs-theme="dark"] .invoice-box {
    background-color: #262a38 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .invoice-box .header {
    border-bottom-color: #404654 !important;
}

body[data-bs-theme="dark"] .invoice-box .header h2,
body[data-bs-theme="dark"] .invoice-box .header p {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .invoice-box .client-info {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .invoice-box .client-info p {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .invoice-box table th {
    background-color: #2f3441 !important;
    color: #e8e8e8 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .invoice-box table td {
    color: #e8e8e8 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .invoice-box .summary-row {
    border-bottom-color: #404654 !important;
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .invoice-box .summary-row.total {
    border-top-color: #f05624 !important;
    border-bottom-color: #f05624 !important;
}

body[data-bs-theme="dark"] .paid-invoice-box {
    background-color: #2f3441 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .paid-invoice-box h5,
body[data-bs-theme="dark"] .paid-invoice-box p {
    color: #e8e8e8 !important;
}

/* ===== Shipments Page Custom Buttons ===== */
/* Fix .newAddress button in dark mode */
body[data-bs-theme="dark"] .page-content .sending-ship .addressForm .newAddress {
    background-color: #262a38 !important;
    border-color: #f05624 !important;
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .page-content .sending-ship .addressForm .newAddress:hover {
    background-color: #f05624 !important;
    color: #ffffff !important;
}

/* Fix saved addresses cards in shipments page */
body[data-bs-theme="dark"] .sending-ship div.radio-with-Icon .radioOption-type label {
    background-color: #262a38 !important;
    border-color: #404654 !important;
}

body[data-bs-theme="dark"] .sending-ship div.radio-with-Icon .radioOption-type input[type="radio"]:checked ~ label {
    border-color: #f05624 !important;
}

body[data-bs-theme="dark"] .sending-ship div.radio-with-Icon .radioOption-type .name {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .sending-ship div.radio-with-Icon .radioOption-type h3 {
    color: #e8e8e8 !important;
}

body[data-bs-theme="dark"] .sending-ship div.radio-with-Icon .radioOption-type h5 {
    color: #b8bac0 !important;
}

body[data-bs-theme="dark"] .sending-ship div.radio-with-Icon .radioOption-type .name .edit {
    color: #4ba6ef !important;
}

/* Fix step circles in shipment creation */
body[data-bs-theme="dark"] .sending-ship .bar-container .one {
    background-color: #262a38 !important;
    border-color: #404654 !important;
    color: #f05624 !important;
}

body[data-bs-theme="dark"] .sending-ship .bar-container .active {
    background-color: rgba(240, 86, 36, 0.2) !important;
    border-color: #f05624 !important;
}