/* Fix for admin panel with contrast issues - applied to both mobile and desktop */
/* Force light background and dark text for all admin pages */
body, 
.dashboard #content,
.change-list #content,
.change-form #content,
div.breadcrumbs,
#header,
.module,
.app-tailoring.model-customer.change-form #content, 
.app-tailoring.model-customer.change-list #content,
.paginator,
.object-tools,
.object-tools a,
.aligned label + div.help,
.aligned label + div.readonly,
.tabular tr.add-row td,
.tabular tr.add-row a,
.selector-available, 
.selector-chosen,
.selector h2,
.selector .selector-available h2, 
.selector .selector-chosen h2,
.dashboard .module h2,
.dashboard .module caption,
.selection-info,
#changelist-filter h2,
#changelist-filter h3,
p.paginator,
.related-widget-wrapper,
[role="contentinfo"],
.timezonewarning {
    background: #fff !important;
    color: #333 !important;
}

/* Fix for form elements */
.form-row,
.module h2, 
.module caption,
.module a,
.module label,
fieldset.module label,
fieldset.module legend,
.inline-group fieldset legend,
input,
textarea,
select,
.form-row label,
.datetime,
.vDateField,
.selector-available select,
.selector-chosen select,
.help,
p.help, 
form .help,
div.help,
.helptext,
.required label, 
label.required,
.field-service_name,
.field-service_cost,
.related-widget-wrapper-link,
.related-lookup,
.aligned .addon,
label[for],
.aligned label,
.app-auth.model-user.change-form div.help,
.app-auth.model-user.change-form label + div.readonly {
    color: #333 !important;
}

/* Fix specific input fields that might still be black */
.field-description textarea,
.field-notes textarea,
.field-email_content textarea, 
.field-sms_content textarea,
textarea#id_description,
textarea#id_notes,
textarea#id_email_content,
textarea#id_sms_content,
textarea.vLargeTextField,
.vLargeTextField,
input.vTextField,
.field-name input,
.field-email input,
.field-phone input,
.field-straat input,
input#id_name,
input#id_email,
input#id_phone,
.form-row input,
.form-row textarea,
.form-row select {
    background-color: #fff !important;
    color: #333 !important;
    border: 1px solid #ccc !important;
}

/* Fix for address fields and size fields */
.field-land input, #id_land,
.field-straat input, #id_straat,
.field-huisnummer input, #id_huisnummer,
.field-bus input, #id_bus,
.field-postcode input, #id_postcode,
.field-stad input, #id_stad,
.field-jasmaat input, #id_jasmaat,
.field-vestmaat input, #id_vestmaat,
.field-broekmaat input, #id_broekmaat,
.field-productvoorraadnummer input, #id_productvoorraadnummer,
.field-is_archived input, #id_is_archived,
.field-is_pickup input, #id_is_pickup,
.field-is_picked_up input, #id_is_picked_up,
.field-picked_up_date input, #id_picked_up_date {
    background-color: #fff !important;
    color: #333 !important;
    border: 1px solid #ccc !important;
}

/* Fix for "tonen" buttons and view links */
.viewlink, a.viewlink,
.inlineviewlink, a.inlineviewlink,
.addlink, a.addlink,
.changelink, a.changelink,
.tonen, .toon, a.tonen, a.toon,
[title*="Tonen"], a[title*="Tonen"],
[title*="View"], a[title*="View"],
.related-widget-wrapper-link {
    color: #447e9b !important;
}

/* Fix for expanded fieldsets after clicking "tonen" */
.collapsed,
fieldset.collapsed,
details, summary,
details[open],
.collapse,
.collapse.in,
.collapsible,
.collapsed h2, 
.collapsed caption,
.collapse-toggle,
.collapsed .form-row,
.collapse .form-row,
.collapse-content,
details .form-row,
details .field-box,
details input, 
details select, 
details textarea,
details label,
.dashboard .collapsed,
.module.collapsed,
.collapse-open,
.collapse-closed {
    background-color: #fff !important;
    color: #333 !important;
}

/* Ensure all labels and inputs inside collapsed sections are visible */
.collapsed label,
.collapsed input,
.collapsed select,
.collapsed textarea,
details label,
details input,
details select,
details textarea,
.collapse label,
.collapse input,
.collapse select,
.collapse textarea,
fieldset.module.aligned .form-row .field-box,
.field-box label,
.field-box input,
.field-box select,
.field-box textarea {
    background-color: #fff !important;
    color: #333 !important;
}

/* Target specific sections that may be toggled with "tonen" */
#id_straat, #id_huisnummer, #id_bus, #id_postcode, #id_stad,
#id_jasmaat, #id_vestmaat, #id_broekmaat,
.field-straat, .field-huisnummer, .field-bus, .field-postcode, .field-stad,
.field-jasmaat, .field-vestmaat, .field-broekmaat {
    background-color: #fff !important;
    color: #333 !important;
}

/* Fix table text */
td, th, tr, 
.results,
table, 
tbody, 
tfoot, 
thead, 
tr, 
th, 
td,
.dashboard tbody td a,
#result_list a,
.results table tbody th a,
.results table tbody td a,
.paginator a,
.paginator span.this-page {
    color: #333 !important;
    background: #f9f9f9 !important;
}

/* Fix striped table rows */
tr.row1 {
    background: #f9f9f9 !important;
}
tr.row2 {
    background: #fff !important;
}

/* Fix links */
a:link, a:visited {
    color: #447e9b !important;
}

/* Fix buttons */
.button, 
input[type=submit], 
input[type=button], 
.submit-row input, 
a.button,
.object-tools a {
    background: #79aec8 !important;
    color: #fff !important;
}

/* Fix header and navigation */
#header {
    background: #79aec8 !important;
    color: #fff !important;
}

#header a:link, 
#header a:visited {
    color: #fff !important;
}

#user-tools a {
    border-bottom: 1px solid rgba(255, 255, 255, 0.6) !important;
}

/* Fix filter sidebar */
#changelist-filter {
    background: #f8f8f8 !important;
}

#changelist-filter li.selected {
    background: #e8e8e8 !important;
}

#changelist-filter a:link, 
#changelist-filter a:visited {
    color: #555 !important;
}

/* Fix for dark sections */
.aligned .form-row, 
.aligned .field-box {
    background: #fff !important;
}

/* Fix for add another and calendar icons */
.add-another, 
.related-lookup, 
.datetimeshortcuts {
    background: #fff !important;
}

/* Fix breadcrumbs */
div.breadcrumbs {
    background: #79aec8 !important;
    color: #fff !important;
}

div.breadcrumbs a {
    color: #fff !important;
}

/* Fix for mobile/tablet admin panel with black background and black text */
@media (max-width: 1024px) {
    /* Force light background for all admin pages */
    body, 
    #container,
    .dashboard #content,
    .change-list #content,
    .change-form #content,
    div.breadcrumbs,
    #header,
    .module,
    .app-tailoring.model-customer.change-form #content, 
    .app-tailoring.model-customer.change-list #content,
    .paginator,
    .object-tools,
    .object-tools a,
    .aligned label + div.help,
    .aligned label + div.readonly,
    .tabular tr.add-row td,
    .tabular tr.add-row a,
    .selector-available, 
    .selector-chosen,
    .selector h2,
    .selector .selector-available h2, 
    .selector .selector-chosen h2,
    .dashboard .module h2,
    .dashboard .module caption,
    .selection-info,
    #changelist-filter h2,
    #changelist-filter h3,
    p.paginator,
    .related-widget-wrapper,
    [role="contentinfo"],
    #summary-for-dillen,
    .timezonewarning,
    #main,
    #content,
    .content,
    .app-tailoring .module,
    .module.aligned,
    .aligned .form-row,
    .form-row .field-box,
    .sidebar,
    .list-filter,
    .inline-group,
    .inline-related,
    .selector,
    .grp-cell,
    .results,
    .results table,
    .results td,
    .results th {
        background: #fff !important;
        color: #333 !important;
    }
    
    /* Stronger fix for mobile form elements */
    .form-row,
    .module h2, 
    .module caption,
    .module a,
    .module label,
    fieldset.module label,
    fieldset.module legend,
    .inline-group fieldset legend,
    input,
    textarea,
    select,
    .form-row label,
    .datetime,
    .vDateField,
    .selector-available select,
    .selector-chosen select,
    .help,
    p.help, 
    form .help,
    div.help,
    .helptext,
    .required label, 
    label.required,
    .field-service_name,
    .field-service_cost,
    .related-widget-wrapper-link,
    .related-lookup,
    .aligned .addon,
    label[for],
    .aligned label,
    .app-auth.model-user.change-form div.help,
    .app-auth.model-user.change-form label + div.readonly,
    fieldset,
    .selector .selector-filter,
    .module.aligned,
    .form-row .field-box {
        color: #333 !important;
        background: #fff !important;
        border-color: #999 !important;
    }
    
    /* Fix specific elements that may be hard to see on mobile devices */
    .module p,
    .module ul,
    .module h3,
    .module h4,
    .module dl,
    .module dd,
    .module dt,
    .sidebar-title,
    .section,
    .form-section,
    .empty-form,
    .add-row,
    .paginator,
    .paginator a,
    ul.object-tools li a,
    .addlink,
    .changelink,
    .inlinechangelink,
    .inline-deletelink,
    .deletelink {
        color: #333 !important;
        background-color: #fff !important;
    }
    
    /* Fix specific input fields on mobile that might still be black */
    .field-description textarea,
    .field-notes textarea,
    .field-email_content textarea, 
    .field-sms_content textarea,
    textarea#id_description,
    textarea#id_notes,
    textarea#id_email_content,
    textarea#id_sms_content,
    textarea.vLargeTextField,
    .vLargeTextField,
    input.vTextField,
    .field-name input,
    .field-email input,
    .field-phone input,
    .field-straat input,
    input#id_name,
    input#id_email,
    input#id_phone,
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="url"],
    input[type="number"],
    input[type="tel"],
    textarea,
    select,
    .vTextField,
    .vLargeTextField,
    form input,
    form textarea,
    form select,
    [type="text"],
    [type="password"],
    [type="email"],
    [type="url"],
    [type="number"],
    [type="tel"] {
        background-color: #fff !important;
        color: #333 !important;
        border: 1px solid #ccc !important;
    }
    
    /* Fix service summary tables on mobile */
    .summary-table,
    .summary-table th,
    .summary-table td,
    .summary-table tbody tr,
    .summary-table thead tr,
    .summary-table tfoot tr,
    .service-summary-section,
    .service-summary-section *,
    .service-summary,
    .service-summary *,
    .service-notes-section,
    .service-notes-section *,
    .service-note-item,
    .service-note-header,
    .service-note-content,
    #recent-actions-module,
    #recent-actions-module *,
    .table-header,
    .table-row-even,
    .table-row-odd,
    .table-cell,
    .table-cell-price,
    .table-cell-status,
    .table-footer,
    .footer-label,
    .footer-value,
    .grand-total,
    .grand-total-text {
        background-color: #fff !important;
        color: #333 !important;
    }
    
    /* Fix special labels and values */
    .status-approved,
    .status-pending,
    .grand-total-value,
    .current-value,
    .future-value,
    .paid-value {
        color: inherit !important;
    }
    
    /* Force special colors for status indicators */
    .status-approved {
        color: #28a745 !important;
    }
    
    .status-pending {
        color: #ffc107 !important;
    }
    
    .future-value {
        color: #17a2b8 !important;
    }
    
    .current-value {
        color: #fd7e14 !important;
    }
    
    .paid-value {
        color: #28a745 !important;
    }
    
    .grand-total-value {
        color: #28a745 !important;
    }

    /* Additional fixes for address and size fields on mobile */
    .field-land input, #id_land,
    .field-straat input, #id_straat,
    .field-huisnummer input, #id_huisnummer,
    .field-bus input, #id_bus,
    .field-postcode input, #id_postcode,
    .field-stad input, #id_stad,
    .field-jasmaat input, #id_jasmaat,
    .field-vestmaat input, #id_vestmaat,
    .field-broekmaat input, #id_broekmaat,
    .field-productvoorraadnummer input, #id_productvoorraadnummer,
    .field-service_type select, #id_service_type,
    .field-location select, #id_location,
    .field-wedding_date input, #id_wedding_date,
    .field-is_archived input, #id_is_archived,
    .field-is_pickup input, #id_is_pickup,
    .field-is_picked_up input, #id_is_picked_up,
    .field-picked_up_date input, #id_picked_up_date {
        background-color: #fff !important;
        color: #333 !important;
        border: 1px solid #ccc !important;
    }

    /* Fix for checkboxes on mobile */
    input[type="checkbox"], 
    .checkbox-row input, 
    .checkbox-row label {
        background-color: transparent !important;
        color: #333 !important;
    }
    
    /* Additional fixes for Customer form fields */
    #customer_form .form-row input,
    #customer_form .form-row textarea,
    #customer_form .form-row select,
    .field-box input,
    .field-box textarea,
    .field-box select,
    #id_name,
    #id_email,
    #id_phone,
    #id_description {
        background-color: #fff !important;
        color: #333 !important;
        border: 1px solid #ccc !important;
    }
    
    /* Fix table text and colors on mobile */
    td, th, tr, 
    .results,
    table, 
    tbody, 
    tfoot, 
    thead, 
    tr, 
    th, 
    td,
    .dashboard tbody td a,
    #result_list a,
    .results table tbody th a,
    .results table tbody td a,
    .paginator a,
    .paginator span.this-page {
        color: #333 !important;
        background: #f9f9f9 !important;
    }
    
    /* Fix mobile-specific table row striping */
    tr.row1 {
        background: #f9f9f9 !important;
    }
    tr.row2 {
        background: #fff !important;
    }

    /* Fix mobile links */
    a:link, a:visited {
        color: #447e9b !important;
    }
    
    /* Fix mobile buttons with stronger specificity */
    .button, 
    input[type=submit], 
    input[type=button], 
    .submit-row input, 
    a.button,
    .object-tools a,
    .addlink {
        background: #79aec8 !important;
        color: #fff !important;
    }

    /* Fix mobile header with stronger specificity */
    #header {
        background: #79aec8 !important;
        color: #fff !important;
    }

    #header a:link, 
    #header a:visited,
    #user-tools,
    #user-tools a {
        color: #fff !important;
    }

    /* Fix mobile breadcrumbs */
    div.breadcrumbs {
        background: #79aec8 !important;
        color: #fff !important;
    }

    div.breadcrumbs a {
        color: #fff !important;
    }

    /* Fix special mobile sections */
    #changelist-filter,
    .module h2, 
    .module caption,
    .inline-group h2,
    h2.related-title {
        color: #333 !important;
        background: #f8f8f8 !important;
    }

    /* Force dark text for summary sections frequently used on mobile */
    #recent-actions-module h2,
    #recent-actions-module h3,
    #recent-actions-module caption,
    .object-history,
    .messagelist,
    .history-list li,
    .service-summary li,
    .service-summary,
    .summary,
    .summary-for-dillen,
    .summary li {
        color: #333 !important;
        background: #fff !important;
    }

    /* Fix input fields on mobile devices */
    input[type="text"],
    input[type="password"],
    input[type="email"],
    input[type="url"],
    input[type="number"],
    input[type="tel"],
    textarea,
    select,
    .vTextField {
        background-color: #fff !important;
        color: #333 !important;
        border: 1px solid #ccc !important;
    }

    /* Fix for Django messages on mobile */
    .messagelist li {
        background-color: #f8f8f8 !important;
        color: #333 !important;
        border: 1px solid #ddd !important;
    }

    /* Override any dark mode settings applied by the browser */
    @media (prefers-color-scheme: dark) {
        body, #container, #content, * {
            background-color: #fff !important;
            color: #333 !important;
        }
        
        /* Force white background on all inputs in dark mode */
        input, textarea, select, .vTextField, .vLargeTextField {
            background-color: #fff !important;
            color: #333 !important;
        }
    }

    /* Fix for expanded fieldsets after clicking "tonen" on mobile */
    .collapsed,
    fieldset.collapsed,
    details, summary,
    details[open],
    .collapse,
    .collapse.in,
    .collapsible,
    .collapsed h2, 
    .collapsed caption,
    .collapse-toggle,
    .collapsed .form-row,
    .collapse .form-row,
    .collapse-content,
    details .form-row,
    details .field-box,
    details input, 
    details select, 
    details textarea,
    details label,
    .dashboard .collapsed,
    .module.collapsed,
    .collapse-open,
    .collapse-closed {
        background-color: #fff !important;
        color: #333 !important;
    }
    
    /* Ensure all labels and inputs inside collapsed sections are visible on mobile */
    .collapsed label,
    .collapsed input,
    .collapsed select,
    .collapsed textarea,
    details label,
    details input,
    details select,
    details textarea,
    .collapse label,
    .collapse input,
    .collapse select,
    .collapse textarea,
    fieldset.module.aligned .form-row .field-box,
    .field-box label,
    .field-box input,
    .field-box select,
    .field-box textarea {
        background-color: #fff !important;
        color: #333 !important;
    }
    
    /* Target specific sections that may be toggled with "tonen" on mobile */
    #id_straat, #id_huisnummer, #id_bus, #id_postcode, #id_stad,
    #id_jasmaat, #id_vestmaat, #id_broekmaat,
    .field-straat, .field-huisnummer, .field-bus, .field-postcode, .field-stad,
    .field-jasmaat, .field-vestmaat, .field-broekmaat {
        background-color: #fff !important;
        color: #333 !important;
    }
    
    /* Force fieldsets and all their content to have light background */
    fieldset, fieldset *, .module {
        background-color: #fff !important;
        color: #333 !important;
    }

    /* Fix table headers on mobile */
    .table-header,
    .module h2, 
    .module caption,
    .table-header th {
        background-color: #f0f0f0 !important;
        color: #333 !important;
        font-weight: bold !important;
        border-bottom: 1px solid #ddd !important;
    }
    
    /* Fix module headers for better visibility */
    .module h2, 
    .dashboard .module h2,
    .dashboard .module caption,
    .module caption {
        background-color: #f0f0f0 !important;
        color: #333 !important;
        font-weight: bold !important;
        border-bottom: 1px solid #ddd !important;
        padding: 8px 12px !important;
    }
    
    /* Fix buttons for better contrast */
    .button, 
    input[type=submit], 
    input[type=button], 
    .submit-row input, 
    a.button,
    .object-tools a,
    .addlink,
    .print-pdf-button,
    .add-service-button,
    .tailor-message-button,
    input[type="submit"] {
        background: #417690 !important;
        color: white !important;
        font-weight: bold !important;
        text-shadow: none !important;
        border: none !important;
    }
    
    /* Fix admin header */
    #header {
        background: #417690 !important;
        color: white !important;
    }
    
    #branding h1, 
    #branding h1 a:link, 
    #branding h1 a:visited,
    #site-name,
    #site-name a:link,
    #site-name a:visited,
    #user-tools,
    #user-tools a:link,
    #user-tools a:visited {
        color: white !important;
    }
    
    /* Fix breadcrumbs */
    div.breadcrumbs {
        background: #417690 !important;
        color: white !important;
    }
    
    div.breadcrumbs a:link,
    div.breadcrumbs a:visited {
        color: white !important;
    }
    
    /* Fix form fields */
    label,
    .field label,
    .fields label,
    .fieldset label,
    .form-row label {
        color: #333 !important;
        font-weight: bold !important;
    }
    
    /* Fix select inputs */
    select,
    .vSelectField,
    .selector select,
    select.selector-available,
    select.selector-chosen {
        background-color: #fff !important;
        color: #333 !important;
        border: 1px solid #ccc !important;
    }
    
    /* Fix dark select options if they exist */
    option,
    select option {
        background-color: #fff !important;
        color: #333 !important;
    }
    
    /* Fix links in tables */
    table a:link, 
    table a:visited,
    td a:link,
    td a:visited,
    tr a:link,
    tr a:visited,
    tbody a:link,
    tbody a:visited,
    .results a:link,
    .results a:visited {
        color: #417690 !important;
    }
    
    /* Fix alternating row colors */
    tr.row1, tr:nth-child(odd) {
        background-color: #fff !important;
    }
    
    tr.row2, tr:nth-child(even) {
        background-color: #f8f8f8 !important;
    }
    
    /* Fix dashboard widgets */
    .dashboard .module {
        background-color: #fff !important;
        border: 1px solid #eee !important;
    }
    
    /* Ensure proper text visibility in all form controls */
    input, textarea, select, button {
        color: #333 !important;
        background-color: #fff !important;
    }
    
    /* Fix tabs if they exist */
    .tabs,
    .tab,
    .tab-content,
    .tab-pane,
    .nav-tabs,
    .nav-tabs a,
    .nav-tabs li,
    .nav-tabs li a {
        background-color: #fff !important;
        color: #333 !important;
    }
    
    /* Fix active tabs */
    .nav-tabs .active,
    .nav-tabs .active a,
    .nav-tabs li.active,
    .nav-tabs li.active a {
        background-color: #e9ecef !important;
        color: #333 !important;
        font-weight: bold !important;
    }
    
    /* Fix for service summary section which often has contrast issues */
    .service-summary-section,
    .service-summary-section h3,
    .service-summary-section h4,
    .service-summary-section table,
    .service-summary-section th,
    .service-summary-section td,
    .service-summary-section tr {
        background-color: #fff !important;
        color: #333 !important;
    }
    
    /* Final catchall for any remaining dark elements */
    body * {
        color: #333 !important;
        background-color: transparent !important;
    }
    
    /* Override the catchall for specific elements that need different colors */
    #header *,
    .breadcrumbs *,
    .button, 
    input[type=submit], 
    input[type=button], 
    .submit-row input, 
    a.button,
    .object-tools a,
    .status-approved,
    .status-pending,
    .future-value,
    .current-value,
    .paid-value,
    .grand-total-value {
        color: inherit !important;
    }
} 

/* Fix for notification form */
.app-tailoring.model-customer.change-list form .form-row input#id_subject,
.app-tailoring.model-customer.change-list form .form-row textarea#id_message,
.app-tailoring.model-customer.change-list form .form-row label,
.app-tailoring.model-customer.change-list form .description,
.app-tailoring.model-customer.change-list form .description ul,
.app-tailoring.model-customer.change-list form .description li,
form[action*="send_bulk_notifications"] .form-row,
form[action*="send_bulk_notifications"] .form-row label,
form[action*="send_bulk_notifications"] .form-row input,
form[action*="send_bulk_notifications"] .form-row textarea,
form[action*="send_bulk_notifications"] .description,
form[action*="send_bulk_notifications"] .description ul li {
    background-color: #fff !important;
    color: #333 !important;
}

/* Fix table text */
td, th, tr, 
.results,
table, 
tbody, 
tfoot, 
thead, 
tr, 
th, 
td,
.dashboard tbody td a,
#result_list a,
.results table tbody th a,
.results table tbody td a,
.paginator a,
.paginator span.this-page {
    color: #333 !important;
    background: #f9f9f9 !important;
} 