/**
 * Mobile Responsive Fix - PDPM Karanganyar
 * Additional mobile responsive styles
 */

/* Mobile base styles */
@media (max-width: 768px) {
    /* Container padding */
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }

    /* Table responsive */
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Card adjustments */
    .card {
        margin-bottom: 1rem;
    }

    /* Button sizing */
    .btn {
        font-size: 0.875rem;
        padding: 0.5rem 1rem;
    }

    /* Form controls */
    .form-control {
        font-size: 0.875rem;
    }

    /* Navbar adjustments */
    .navbar-brand {
        font-size: 1rem;
    }

    /* Reduce spacing */
    .mb-4, .my-4 {
        margin-bottom: 1.5rem !important;
    }

    .mt-4, .my-4 {
        margin-top: 1.5rem !important;
    }
}

/* Small mobile devices */
@media (max-width: 576px) {
    /* Typography */
    h1 {
        font-size: 1.75rem;
    }

    h2 {
        font-size: 1.5rem;
    }

    h3 {
        font-size: 1.25rem;
    }

    /* Grid columns full width */
    .col-sm-6,
    .col-md-6,
    .col-lg-6 {
        width: 100%;
    }

    /* Images */
    img {
        max-width: 100%;
        height: auto;
    }

    /* Modal */
    .modal-dialog {
        margin: 0.5rem;
    }
}

/* Tablet landscape */
@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 960px;
    }
}

/* Fix for form elements on mobile */
@media (max-width: 768px) {
    select.form-control,
    textarea.form-control,
    input[type="text"].form-control,
    input[type="email"].form-control,
    input[type="password"].form-control {
        font-size: 16px; /* Prevent zoom on iOS */
    }
}