/* =============================================
   Responsive Tasarım
   ============================================= */

/* ── Extra Large (≤1400px) ── */
@media (max-width: 1400px) {
    :root { --container-max: 1100px; }
}

/* ── Large (≤1200px) ── */
@media (max-width: 1200px) {
    :root { --container-max: 960px; }
    .grid-4 { grid-template-columns: repeat(3, 1fr); }
}

/* ── Medium / Tablet (≤992px) ── */
@media (max-width: 992px) {
    :root { --container-max: 720px; }

    .hero h1 { font-size: var(--text-4xl); }
    .hero .hero-subtitle { font-size: var(--text-lg); }

    .steps-grid { grid-template-columns: repeat(2, 1fr); }
    .grid-4 { grid-template-columns: repeat(2, 1fr); }
    .grid-3 { grid-template-columns: repeat(2, 1fr); }
    .grid-2 { grid-template-columns: 1fr; }

    .draw-grid { grid-template-columns: repeat(2, 1fr); }

    /* Navbar mobile */
    .navbar-nav {
        display: none;
        position: absolute;
        top: var(--header-height);
        left: 0;
        right: 0;
        background: var(--color-bg-secondary);
        border-bottom: 1px solid var(--color-border);
        flex-direction: column;
        padding: var(--space-4);
    }

    .navbar-nav.open { display: flex; }
    .navbar-toggle { display: block; }

    /* Wizard steps text hidden */
    .wizard-step span:not(.step-dot) { display: none; }
    .wizard-step-line { width: 20px; }

    /* Admin sidebar */
    .admin-sidebar {
        transform: translateX(-100%);
        position: fixed;
        z-index: var(--z-fixed);
    }
    .admin-sidebar.open { transform: translateX(0); }
    .admin-main { margin-left: 0 !important; }
}

/* ── Small / Mobile (≤768px) ── */
@media (max-width: 768px) {
    :root {
        --container-max: 100%;
        --header-height: 64px;
    }

    .container { padding: 0 var(--space-4); }

    h1 { font-size: var(--text-3xl); }
    h2 { font-size: var(--text-2xl); }
    h3 { font-size: var(--text-xl); }

    .hero { padding: var(--space-16) 0 var(--space-10); }
    .hero h1 { font-size: var(--text-3xl); }
    .hero .hero-subtitle { font-size: var(--text-base); }

    .steps-grid { grid-template-columns: 1fr; }
    .grid-3, .grid-4 { grid-template-columns: 1fr; }
    .draw-grid { grid-template-columns: 1fr; }

    .page-section { padding: var(--space-10) 0; }

    .btn-xl {
        padding: var(--space-4) var(--space-6);
        font-size: var(--text-base);
    }

    .card { padding: var(--space-4); }
    .stat-card { padding: var(--space-4); }
    .stat-card .stat-value { font-size: var(--text-2xl); }

    .winner-card { padding: var(--space-5); }
    .winner-card .winner-pic { width: 72px; height: 72px; }

    .footer-content { flex-direction: column; gap: var(--space-4); text-align: center; }

    /* Canlı çekiliş mobil */
    .slot-winner-type { font-size: var(--text-2xl); }
    .slot-name { font-size: var(--text-2xl); height: 60px; }
    .countdown-number { font-size: 8rem; }
    .congrats-text { font-size: var(--text-3xl); }

    /* Data table scroll */
    .table-container { margin: 0 calc(var(--space-4) * -1); border-radius: 0; }

    /* Modal */
    .modal { width: 95%; padding: var(--space-5); }
}

/* ── Extra Small (≤480px) ── */
@media (max-width: 480px) {
    .hero h1 { font-size: var(--text-2xl); }
    .countdown-number { font-size: 6rem; }
    .slot-name { font-size: var(--text-xl); height: 50px; }
    .congrats-text { font-size: var(--text-2xl); }

    .wizard-steps { gap: 0; }
    .wizard-step { padding: var(--space-1); }
    .wizard-step .step-dot { width: 28px; height: 28px; font-size: var(--text-xs); }
}
