/* Responsive Design - Mobil ve Tablet Optimizasyonu */

/* Genel Responsive Ayarlar */
* {
    box-sizing: border-box;
}

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

/* Navbar Düzeltmeleri */
@media (max-width: 991px) {
    .navbar-collapse {
        background: white;
        padding: 15px;
        margin-top: 10px;
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    }

    .navbar-nav {
        gap: 5px;
    }

    .nav-item {
        text-align: center;
    }

    .nav-link.btn-primary {
        margin: 10px 0 !important;
        width: 100%;
    }

    .dropdown-menu {
        width: 100%;
    }
}

/* Top Bar Mobil */
@media (max-width: 768px) {
    .bg-primary.py-2 small {
        font-size: 0.75rem;
    }

    .bg-primary.py-2 .col-md-6:first-child small:last-child {
        display: none;
    }

    .bg-primary.py-2 .text-md-end a {
        margin: 0 5px;
    }
}

/* Slider Mobil */
@media (max-width: 768px) {
    .carousel-item img {
        height: 300px !important;
        object-fit: cover;
    }

    .carousel-caption {
        bottom: 10px !important;
    }

    .carousel-caption h1 {
        font-size: 1.5rem !important;
    }

    .carousel-caption p {
        font-size: 0.9rem !important;
        display: none;
    }

    .carousel-caption .btn {
        padding: 8px 16px;
        font-size: 0.9rem;
    }
}

/* Card Grid Responsive */
@media (max-width: 576px) {
    .col-sm-6, .col-md-4, .col-md-6, .col-lg-3, .col-lg-4 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (min-width: 577px) and (max-width: 768px) {
    .col-md-6, .col-lg-4 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

/* Tablo Responsive */
@media (max-width: 768px) {
    .table-responsive {
        font-size: 0.85rem;
    }

    .table th, .table td {
        padding: 0.5rem !important;
    }

    .btn-group-sm .btn {
        padding: 0.25rem 0.5rem;
        font-size: 0.75rem;
    }
}

/* Footer Mobil */
@media (max-width: 768px) {
    footer .col-lg-4, footer .col-lg-2, footer .col-lg-3 {
        margin-bottom: 2rem;
        text-align: center;
    }

    footer .list-unstyled {
        padding: 0;
    }

    footer .text-md-end {
        text-align: center !important;
    }
}

/* Form Responsive */
@media (max-width: 768px) {
    .row .col-md-6 {
        margin-bottom: 1rem;
    }

    .form-control, .form-select {
        font-size: 16px; /* iOS zoom önleme */
    }
}

/* Admin Panel Sidebar Mobil */
@media (max-width: 991px) {
    .sidebar {
        position: fixed;
        left: -250px;
        transition: left 0.3s ease;
        z-index: 1050;
    }

    .sidebar.show {
        left: 0;
    }

    .main-content {
        margin-left: 0 !important;
    }

    .sidebar-toggle {
        display: block !important;
    }
}

/* Touch-friendly Buttons */
.btn {
    min-height: 44px;
    min-width: 44px;
}

@media (max-width: 768px) {
    .btn-group .btn {
        min-width: auto;
    }
}

/* Spacing Adjustments Mobile */
@media (max-width: 768px) {
    .py-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .mb-5, .mt-5 {
        margin-bottom: 2rem !important;
        margin-top: 2rem !important;
    }

    h1, .h1 {
        font-size: 2rem;
    }

    h2, .h2 {
        font-size: 1.5rem;
    }

    .display-4 {
        font-size: 2.5rem;
    }

    .lead {
        font-size: 1rem;
    }
}

/* Prevent horizontal scroll */
body {
    overflow-x: hidden;
}

.container, .container-fluid {
    overflow-x: hidden;
}

/* Touch-friendly dropdown */
@media (max-width: 991px) {
    .dropdown-menu {
        position: relative !important;
        transform: none !important;
    }

    .dropdown-toggle::after {
        float: right;
        margin-top: 8px;
    }
}

/* Image optimization for mobile */
@media (max-width: 768px) {
    .card-img-top {
        max-height: 200px;
        object-fit: cover;
    }

    .img-fluid {
        width: 100%;
    }
}

/* Better text readability on mobile */
@media (max-width: 768px) {
    body {
        font-size: 14px;
        line-height: 1.6;
    }

    p {
        margin-bottom: 1rem;
    }
}

/* Accordion mobile friendly */
@media (max-width: 768px) {
    .accordion-button {
        font-size: 0.95rem;
        padding: 1rem;
    }

    .accordion-body {
        font-size: 0.9rem;
    }
}

/* Blog cards mobile */
@media (max-width: 768px) {
    .blog-card {
        margin-bottom: 1.5rem;
    }

    .blog-card img {
        height: 200px !important;
    }
}

/* Product filter mobile */
@media (max-width: 768px) {
    .btn-outline-primary {
        margin: 5px 2px;
        font-size: 0.85rem;
        padding: 0.5rem 1rem;
    }
}

/* Language dropdown mobile */
@media (max-width: 991px) {
    .nav-item.dropdown .dropdown-menu {
        max-height: 300px;
        overflow-y: auto;
    }
}

/* Improved touch targets */
a, button, .btn, .nav-link {
    -webkit-tap-highlight-color: rgba(0,0,0,0.1);
}

/* Safe area for notched devices */
@supports (padding: max(0px)) {
    body {
        padding-left: max(0px, env(safe-area-inset-left));
        padding-right: max(0px, env(safe-area-inset-right));
    }
}

/* Loading optimization */
@media (max-width: 768px) {
    * {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Better modal on mobile */
@media (max-width: 768px) {
    .modal-dialog {
        margin: 0.5rem;
    }

    .modal-content {
        border-radius: 0.5rem;
    }
}
