/* Global form element styles for entire application */

/* Base styles for all form inputs */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
input[type="search"],
input[type="date"],
input[type="datetime-local"],
input[type="time"],
input[type="month"],
input[type="week"],
select,
textarea,
.form-control,
.form-select,
.vTextField {
    min-height: 38px !important;
    padding: 0.4rem 0.3rem !important;
    font-size: 15px !important;
    border-radius: 4px !important;
    /* width: 100% !important; */
    max-width: none !important;
}

/* Textarea specific styles */
textarea {
    /* min-height: 100px !important; */
    /* padding: 0.75rem !important; */
    resize: vertical !important;
}

/* Select specific padding adjustment */
select {
    /* padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important; */
}

/* Focus styles for all form elements */
input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2) !important;
    border-color: rgb(59, 130, 246) !important;
    outline: none !important;
}

/* Select2 specific height adjustment */
.select2-container--default .select2-selection--single {
    height: 38px !important;
    /* padding: 0.25rem 0.5rem !important; */
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 28px !important;
    padding-left: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px !important;
}

/* Django admin specific overrides */
.module input[type="text"],
.module input[type="email"],
.module input[type="password"],
.module input[type="number"],
.module select,
.module textarea {
    min-height: 38px !important;
    /* padding: 0.5rem 0.75rem !important; */
}

/* Submit buttons should be proportional */
input[type="submit"],
button[type="submit"],
.submit-row input,
.btn,
.button {
    min-height: 38px !important;
    /* padding: 0.5rem 1.25rem !important; */
    font-size: 15px !important;
}

/* File inputs */
input[type="file"] {
    /* padding: 0.5rem 0.75rem !important; */
    font-size: 15px !important;
}

/* Checkbox and radio buttons - don't change height */
input[type="checkbox"],
input[type="radio"] {
    min-height: initial !important;
    width: initial !important;
}

/* Mobile responsiveness - slightly taller on mobile for touch */
@media (max-width: 768px) {
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="number"],
    input[type="tel"],
    input[type="url"],
    input[type="search"],
    input[type="date"],
    input[type="datetime-local"],
    input[type="time"],
    select,
    textarea,
    .form-control,
    .form-select {
        min-height: 42px !important;
        font-size: 16px !important;
    }
    
    input[type="submit"],
    button[type="submit"],
    .submit-row input,
    .btn,
    .button {
        min-height: 42px !important;
        font-size: 16px !important;
    }
}

/* Fix for inline forms */
.inline-related input[type="text"],
.inline-related input[type="number"],
.inline-related select {
    min-height: 34px !important;
    /* padding: 0.375rem 0.5rem !important; */
}

/* Finance dashboard specific elements */
#warehouse-selector,
select[name="driver_id"],
select[name="business_id"],
select[name="type"],
.filter-select {
    min-height: 38px !important;
    /* padding: 0.5rem 0.75rem !important; */
}

/* Admin changelist filters */
#changelist-filter select {
    min-height: 34px !important;
    /* padding: 0.375rem 0.75rem !important; */
}

/* Autocomplete dropdowns */
.ui-autocomplete {
    font-size: 15px !important;
}



/* Admin changelist action buttons */
#changelist table td a.button {
    /* padding: 0.25rem 0.5rem !important; */
    font-size: 13px !important;
    margin: 0 2px !important;
    display: inline-block !important;
    white-space: nowrap !important;
}

/* Make action column wider to accommodate buttons */
#changelist table th:last-child,
#changelist table td:last-child {
    min-width: 200px !important;
}

/* Ensure buttons wrap properly on smaller screens */
@media (max-width: 1024px) {
    #changelist table td a.button {
        margin: 2px !important;
        font-size: 12px !important;
    }
}