/* Enhanced Responsive Styles for Django Admin */

/* Mobile-first responsive improvements */
@media (max-width: 768px) {
    /* Make tables scrollable on mobile */
    #result_list {
        overflow-x: auto;
        display: block;
    }

    /* Stack form fields vertically on mobile */
    .form-row {
        flex-direction: column !important;
    }

    /* Make buttons full-width on mobile */
    .submit-row input,
    .submit-row a,
    .button {
        width: 100% !important;
        margin: 5px 0 !important;
        text-align: center;
    }

    /* Adjust admin header for mobile */
    #header {
        padding: 10px;
    }

    #branding h1 {
        font-size: 1.2rem;
    }

    /* Make sidebar collapsible on mobile */
    #nav-sidebar {
        position: fixed;
        left: -260px;
        transition: left 0.3s ease;
        z-index: 1000;
    }

    #nav-sidebar.open {
        left: 0;
    }

    /* Improve field labels on mobile */
    .form-row label {
        display: block;
        width: 100%;
        margin-bottom: 5px;
    }

    /* Make select dropdowns responsive */
    select, input[type="text"], input[type="email"],
    input[type="tel"], textarea {
        width: 100% !important;
        max-width: 100%;
        box-sizing: border-box;
    }

    /* Adjust pagination on mobile */
    .paginator {
        font-size: 0.9rem;
    }

    .paginator a, .paginator span {
        padding: 5px 8px;
    }

    /* Make action dropdown more touch-friendly */
    .actions select {
        min-height: 44px;
        font-size: 16px;
    }

    .actions button {
        min-height: 44px;
        padding: 10px 15px;
    }
}

/* Tablet improvements */
@media (min-width: 769px) and (max-width: 1024px) {
    .form-row {
        display: flex;
        flex-wrap: wrap;
    }

    .form-row > div {
        flex: 1 1 48%;
        margin-right: 2%;
    }
}

/* Touch-friendly improvements for all devices */
button, input[type="submit"], .button, a.button {
    min-height: 36px;
    padding: 8px 15px;
    cursor: pointer;
}

/* Improve checkbox and radio button sizing for touch */
input[type="checkbox"], input[type="radio"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

/* Better spacing for fieldsets on all devices */
.module {
    margin-bottom: 20px;
}

fieldset.module {
    padding: 15px;
}

/* Responsive tables */
.results {
    overflow-x: auto;
}

/* Make filter sidebar responsive */
@media (max-width: 1024px) {
    #changelist-filter {
        width: 100%;
        float: none;
        margin-top: 20px;
    }

    #changelist {
        margin-right: 0;
    }
}

/* Improve readability on all devices */
body {
    font-size: 14px;
    line-height: 1.6;
}

/* Better contrast for better accessibility */
.module h2, .module caption {
    background-color: var(--header-bg, #417690);
    color: var(--header-color, #fff);
}

/* Print styles */
@media print {
    #header, #nav-sidebar, .breadcrumbs, .submit-row,
    .paginator, .actions {
        display: none !important;
    }

    body {
        margin: 0;
        padding: 0;
    }

    #content {
        margin: 0;
        padding: 0;
    }
}