/* ===========================================
   RESPONSIVE STYLES
   Common responsive patterns extracted from templates
   =========================================== */

/* ===========================================
   TICKET GRID RESPONSIVE
   =========================================== */

@media only screen and (max-width: 600px) {
    .ticket-grid {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }

    .ticket-grid > div {
        min-width: 100% !important;
    }
}

@media only screen and (min-width: 601px) and (max-width: 900px) {
    .ticket-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ===========================================
   REGISTRATION ROW LAYOUT RESPONSIVE
   =========================================== */

@media (max-width: 768px) {
    .reg-row-item,
    .reg-row-item-b,
    .reg-row-item-c {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        gap: 1rem;
    }

    .reg-name,
    .reg-name-b,
    .reg-name-c,
    .reg-price,
    .reg-price-b,
    .reg-price-c,
    .reg-features,
    .reg-features-b,
    .reg-features-c,
    .reg-action,
    .reg-action-b,
    .reg-action-c {
        min-width: 100%;
    }

    .reg-features,
    .reg-features-b,
    .reg-features-c {
        justify-content: center;
    }
}

/* ===========================================
   SPEAKER CARDS RESPONSIVE
   =========================================== */

@media only screen and (max-width: 600px) {
    .speaker-card-wrapper {
        margin-bottom: 1.5rem;
    }
}

/* ===========================================
   SECTION TITLES RESPONSIVE
   =========================================== */

@media only screen and (max-width: 600px) {
    .text-section-title-xl {
        font-size: 1.75rem;
    }

    .text-section-title-lg {
        font-size: 1.5rem;
    }
}

/* ===========================================
   CONTAINER RESPONSIVE
   =========================================== */

@media only screen and (max-width: 600px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* ===========================================
   HERO SECTIONS RESPONSIVE
   =========================================== */

@media only screen and (max-width: 768px) {
    .hero-title {
        font-size: 2rem !important;
    }

    .hero-subtitle {
        font-size: 1.1rem !important;
    }
}

/* Template B Hero - Mobile Optimizations */
@media only screen and (max-width: 600px) {
    .hero-content-wrapper {
        min-height: auto !important;
    }

    .hero-content-wrapper .section-padding-lg {
        padding-top: 3rem !important;
        padding-bottom: 2rem !important;
    }

    .hero-badge-modern {
        margin-bottom: 1.5rem !important;
    }

    .hero-badge-modern span {
        font-size: 0.85rem !important;
    }

    .hero-title-modern {
        font-size: 2rem !important;
        line-height: 1.2 !important;
        margin-bottom: 1rem !important;
    }

    .hero-tagline-modern {
        font-size: 1rem !important;
        margin-bottom: 1.25rem !important;
        padding: 0 1rem !important;
    }

    .hero-location-modern {
        margin-bottom: 1.5rem !important;
        font-size: 0.9rem !important;
    }

    .hero-cta-wrapper {
        flex-direction: column !important;
        gap: 0.75rem !important;
        width: 100% !important;
        padding: 0 1rem !important;
    }

    .hero-cta-wrapper a {
        width: 100% !important;
        max-width: 280px !important;
        margin: 0 auto !important;
    }

    /* Stats Bar Mobile */
    .hero-stats-bar {
        position: relative !important;
        margin-top: 2rem !important;
    }

    .hero-stats-content {
        flex-direction: column !important;
        gap: 0 !important;
        padding: 1rem 0 !important;
    }

    .hero-stat-item {
        padding: 0.75rem 1rem !important;
        border-right: none !important;
        border-bottom: 1px solid #e5e7eb !important;
        width: 100% !important;
    }

    .hero-stat-item:last-child {
        border-bottom: none !important;
    }

    .hero-stat-number {
        font-size: 1.75rem !important;
    }

    .hero-stat-label {
        font-size: 0.75rem !important;
    }
}

@media only screen and (min-width: 601px) and (max-width: 768px) {
    .hero-content-wrapper {
        min-height: 60vh !important;
    }

    .hero-title-modern {
        font-size: 2.5rem !important;
    }

    .hero-stats-content {
        flex-wrap: wrap !important;
        gap: 0.5rem !important;
    }

    .hero-stat-item {
        padding: 0.5rem 1.5rem !important;
        flex: 1 1 calc(50% - 0.5rem) !important;
        border-right: 1px solid #e5e7eb !important;
    }

    .hero-stat-item:nth-child(2n) {
        border-right: none !important;
    }

    .hero-stat-item:last-child {
        border-right: none !important;
    }
}

/* Template C Hero - Mobile Optimizations */
@media only screen and (max-width: 600px) {
    .hero-minimal-section {
        min-height: auto !important;
        padding: 2rem 0 !important;
    }

    .hero-minimal-section .section-padding-lg {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .hero-minimal-section .row {
        flex-direction: column !important;
    }

    .hero-minimal-section .col.s12.l7 {
        padding-right: 0 !important;
        margin-bottom: 2rem !important;
        width: 100% !important;
    }

    .hero-minimal-section .col.s12.l5 {
        padding-left: 0 !important;
        width: 100% !important;
    }

    .hero-badge-minimal {
        margin-bottom: 1.25rem !important;
    }

    .hero-badge-minimal span {
        font-size: 0.8rem !important;
    }

    .hero-title-minimal {
        font-size: 2rem !important;
        line-height: 1.2 !important;
        margin-bottom: 1rem !important;
        padding-top: 2.5rem !important;
    }

    .hero-tagline-minimal {
        font-size: 1rem !important;
        margin-bottom: 1.5rem !important;
        line-height: 1.5 !important;
    }

    .hero-cta-minimal-wrapper {
        flex-direction: column !important;
        gap: 0.75rem !important;
        align-items: flex-start !important;
    }

    .btn-minimal-primary,
    .btn-minimal-link {
        width: 100% !important;
        max-width: 280px !important;
        justify-content: center !important;
    }

    .hero-info-card {
        padding: 1.5rem !important;
        margin-top: 1rem !important;
    }

    .hero-info-card-item {
        margin-bottom: 1.25rem !important;
        padding-bottom: 1rem !important;
    }

    .hero-info-card-item:last-child {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }

    .hero-info-card-label {
        font-size: 0.7rem !important;
        margin-bottom: 0.375rem !important;
    }

    .hero-info-card-value {
        font-size: 1rem !important;
    }
}

@media only screen and (min-width: 601px) and (max-width: 992px) {
    .hero-minimal-section {
        min-height: 70vh !important;
    }

    .hero-title-minimal {
        font-size: 2.75rem !important;
    }

    .hero-tagline-minimal {
        font-size: 1.1rem !important;
    }

    .hero-info-card {
        padding: 2rem !important;
    }
}

/* ===========================================
   CARD GRID RESPONSIVE
   =========================================== */

@media only screen and (max-width: 600px) {
    .card-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

@media only screen and (min-width: 601px) and (max-width: 992px) {
    .card-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
}

@media only screen and (min-width: 993px) {
    .card-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 2rem;
    }
}

/* ===========================================
   NAVBAR RESPONSIVE
   =========================================== */

@media only screen and (max-width: 992px) {
    .navbar-fixed {
        position: relative;
    }

    /* Remove body padding-top when navbar is not fixed */
    body {
        padding-top: 0 !important;
    }
}

/* ===========================================
   TEMPLATE A - IMPORTANT DATES RESPONSIVE
   =========================================== */

@media only screen and (max-width: 600px) {
    /* Important Dates Card - Remove fixed height and optimize */
    .dates-card {
        height: auto !important;
        padding: 1.5rem !important;
    }

    div.dates-card[style] {
        height: auto !important;
    }

    .dates-card > div:first-child {
        margin-bottom: 1rem !important;
    }

    .dates-card h2 {
        font-size: 0.75rem !important;
        margin-bottom: 0.5rem !important;
    }

    .dates-card > div:first-child > div {
        width: 40px !important;
        height: 2px !important;
        margin-bottom: 0.75rem !important;
    }

    .dates-card > div[style*="position: relative"] {
        padding-left: 1rem !important;
    }

    .dates-card ul li {
        padding: 0.75rem 0 !important;
        padding-left: 1.5rem !important;
    }

    .dates-card ul li > div[style*="display: flex"] {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.375rem !important;
    }

    .dates-card ul li > div > span:first-child {
        min-width: 100% !important;
        font-size: 0.875rem !important;
    }

    .dates-card ul li > div > span:last-child {
        font-size: 0.8rem !important;
        white-space: normal !important;
    }

    .dates-card
        ul
        li
        > div[style*="position: absolute"][style*="left: -1.5rem"] {
        left: -1rem !important;
        width: 8px !important;
        height: 8px !important;
        top: 1rem !important;
    }

    .dates-card p:last-child {
        margin-top: 1rem !important;
        padding-top: 0.75rem !important;
        font-size: 0.7rem !important;
    }

    /* CFP Dates Card */
    .cfp-dates-card {
        height: auto !important;
        padding: 1.5rem !important;
    }

    div.cfp-dates-card[style] {
        height: auto !important;
    }

    .cfp-dates-card h3 {
        font-size: 1.25rem !important;
        margin-bottom: 0.75rem !important;
    }

    .cfp-dates-card > div:first-child {
        margin-bottom: 1rem !important;
    }

    .cfp-dates-card > div:first-child > div {
        width: 40px !important;
        height: 2px !important;
        margin-bottom: 0.75rem !important;
    }

    /* Column adjustments */
    .col.s12.m12.l6 {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 1.5rem !important;
    }
}

@media only screen and (min-width: 601px) and (max-width: 992px) {
    .dates-card {
        padding: 2rem !important;
    }

    .dates-card li {
        padding: 0.875rem 0 !important;
    }
}

/* ===========================================
   FOOTER RESPONSIVE
   =========================================== */

@media only screen and (max-width: 600px) {
    .footer-content {
        text-align: center;
    }

    .footer-links {
        flex-direction: column;
        gap: 1rem;
    }
}