/* Dark Mode Fix for iPhone - Ensures proper visibility */
@media (prefers-color-scheme: dark) {

    /* Keep text light for readability */
    body {
        color: #f9fafb !important;
    }

    /* Cards with shadows get dark backgrounds - but preserve gradient buttons */
    .card.shadow-sm:not(.preserve-gradient),
    .card.shadow-lg:not(.preserve-gradient),
    .card:not(.preserve-gradient):not(.shadow-md) {
        background: #374151 !important;
        background-color: #374151 !important;
    }

    /* Card bodies dark - but not for gradient buttons */
    .card-body {
        background-color: transparent;
    }

    .card:not(.preserve-gradient) .card-body {
        background-color: #374151 !important;
    }

    /* FORCE ALL CARD TEXT TO BE LIGHT - override inline styles */
    .card h1,
    .card h2,
    .card h3,
    .card h4,
    .card h5,
    .card h6,
    .card p,
    .card span,
    .card div,
    .card label {
        color: #f9fafb !important;
    }

    /* Icons light gray */
    .bi,
    i[class*="bi-"] {
        color: #d1d5db !important;
    }

    /* Buttons visible */
    .btn-primary {
        background-color: #2563eb !important;
        color: white !important;
    }

    .btn-success {
        background-color: #16a34a !important;
        color: white !important;
    }

    .btn-warning {
        background-color: #eab308 !important;
        color: #1f2937 !important;
    }

    /* Forms and Search Inputs */
    input[type="text"],
    input[type="search"],
    input[type="number"],
    .form-control {
        background-color: #4b5563 !important;
        border-color: #6b7280 !important;
        color: #f9fafb !important;
    }

    /* ULTRA SPECIFIC Placeholder text - PURE WHITE */
    input.form-control::placeholder,
    input.form-control::-webkit-input-placeholder,
    input.form-control::-moz-placeholder,
    input.form-control:-ms-input-placeholder,
    input[type="text"]::placeholder,
    input[type="text"]::-webkit-input-placeholder,
    input[type="text"]::-moz-placeholder,
    input[type="text"]:-ms-input-placeholder,
    input::placeholder,
    input::-webkit-input-placeholder,
    input::-moz-placeholder,
    input:-ms-input-placeholder,
    #searchText::placeholder,
    #searchText::-webkit-input-placeholder,
    #searchText::-moz-placeholder,
    #searchText:-ms-input-placeholder {
        color: #ffffff !important;
        opacity: 1 !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    /* List group items (cart items, etc) */
    .list-group-item {
        background-color: #374151 !important;
        border-color: #4b5563 !important;
        color: #f9fafb !important;
    }

    /* Ensure all text in list items is visible */
    .list-group-item *,
    .list-group-item h1,
    .list-group-item h2,
    .list-group-item h3,
    .list-group-item h4,
    .list-group-item h5,
    .list-group-item h6,
    .list-group-item p,
    .list-group-item span,
    .list-group-item div,
    .list-group-item label {
        color: #f9fafb !important;
    }

    /* Alerts */
    .alert-success {
        background-color: rgba(34, 197, 94, 0.2) !important;
        border-color: rgb(34, 197, 94) !important;
        color: rgb(134, 239, 172) !important;
    }

    /* Tables */
    .table {
        color: #f9fafb !important;
    }

    .table thead {
        background-color: #374151 !important;
    }

    .table tbody tr {
        background-color: #4b5563 !important;
        border-color: #6b7280 !important;
    }

    /* Bottom menu */
    .fixed-bottom {
        background-color: #1f2937 !important;
    }

    /* Fix MainLayout header */
    .fixed-top.bg-light {
        background-color: #1f2937 !important;
        border-bottom: 1px solid #4b5563 !important;
    }

    .fixed-top.bg-light a {
        color: #f9fafb !important;
    }

    .fixed-top.bg-light h4 {
        color: #f9fafb !important;
    }

    .fixed-top.bg-light svg {
        fill: #d1d5db !important;
    }
}