/* ==========================================================================
   LUNERA TEXTILE - RESPONSIVE CSS
   Tüm sayfalar için ortak responsive kurallar
   ========================================================================== */

/* ==========================================================================
   GLOBAL TEXT COLOR PALETTE - GRAYISH TONES
   ========================================================================== */

/* Headings - Dark Gray */
h1, h2, h3, h4, h5, h6,
.font_0, .font_1, .font_2 {
    color: #333333 !important;
}

/* Paragraphs - Medium Gray */
p, .font_7, .font_8, .font_9 {
    color: #555555 !important;
}

/* Description/Secondary Text - Light Gray */
.description, .subtitle, .caption,
small, .text-muted {
    color: #666666 !important;
}

/* Wix specific text elements */
[data-testid="richTextElement"] span,
.wixui-rich-text span {
    color: #555555 !important;
}

/* Custom pages text */
.content-section p,
.product-card p,
.feature-item p {
    color: #555555 !important;
}

.content-section h2,
.product-card h3,
.feature-item h3 {
    color: #333333 !important;
}

/* Footer text */
.footer-text, .site-footer p {
    color: #cccccc !important;
}

/* ==========================================================================
   BASE RESPONSIVE RULES
   ========================================================================== */

/* Prevent horizontal scroll */
html, body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

/* Make all images responsive by default */
img {
    max-width: 100%;
    height: auto;
}

/* ==========================================================================
   WIX PAGE CRITICAL FIXES - MOBILE (max-width: 980px)
   ========================================================================== */

@media screen and (max-width: 980px) {
    /* CRITICAL: Tüm elementlerin max-width'ini sınırla */
    * {
        max-width: 100vw !important;
        box-sizing: border-box !important;
    }
    
    /* Tüm section ve container'ların min-width'ini kaldır */
    section,
    [id^="comp-"],
    [data-mesh-id],
    .Oqnisf,
    .HT5ybB,
    .LWbAav,
    #SITE_HEADER,
    #SITE_FOOTER,
    #masterPage,
    #PAGES_CONTAINER,
    #SITE_PAGES {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Grid container içeriklerini düzelt */
    [data-mesh-id*="gridContainer"] {
        width: 100% !important;
    }
    
    [data-mesh-id*="gridContainer"] > * {
        left: 0 !important;
        margin-left: 15px !important;
        margin-right: 15px !important;
        width: calc(100% - 30px) !important;
        max-width: calc(100% - 30px) !important;
    }
    
    /* Wix'in margin: calc((100% - 980px) * 0.5) hesaplamalarını override et */
    [style*="calc((100% - 980px)"] {
        margin-left: 15px !important;
        margin-right: 15px !important;
    }
    
    /* Slider düzeltmeleri */
    #comp-l0un4d99 {
        height: auto !important;
        min-height: 300px !important;
    }
    
    /* Column strips - dikey yığınla */
    .V5AUxf,
    .CohWsy > div,
    [data-testid="columns"] {
        flex-direction: column !important;
    }
    
    .YzqVVZ,
    [class*="column"] {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
    }
    
    /* Repeater grid */
    .hRdzm4 {
        flex-direction: column !important;
    }
    
    .T7n0L6 {
        width: 100% !important;
    }
    
    /* Navigation */
    .StylableHorizontalMenu,
    .StylableHorizontalMenu ul,
    #comp-lk86xdwj,
    #comp-lk86xdwj ul {
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
    }
    
    .StylableHorizontalMenu li,
    #comp-lk86xdwj li {
        width: 100% !important;
        text-align: center !important;
        padding: 10px 0 !important;
        border-bottom: 1px solid rgba(0,0,0,0.1) !important;
    }
    
    /* Font size adjustments */
    h1, h2, .font_0 {
        font-size: 26px !important;
        line-height: 1.3 !important;
    }
    
    p, .font_7, .font_8 {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }
    
    /* Logo text */
    .j7pOnl {
        font-size: 22px !important;
        letter-spacing: 2px !important;
    }
    
    /* Footer columns */
    #SITE_FOOTER [data-mesh-id*="gridContainer"] > * {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        text-align: center !important;
    }
}

/* ==========================================================================
   TABLET BREAKPOINT (768px - 979px)
   ========================================================================== */

@media screen and (max-width: 979px) {
    /* Wix Container Overrides */
    .mesh-layout,
    [data-mesh-id],
    .wixui-column-strip,
    .wixui-column-strip__column {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Font size adjustments */
    .font_0, h1, h2 {
        font-size: 48px !important;
    }

    /* Column strip - stack columns */
    .CohWsy > .V5AUxf {
        flex-direction: column !important;
    }

    .wixui-column-strip__column,
    .YzqVVZ {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Header adjustments */
    #SITE_HEADER {
        padding: 10px !important;
    }

    /* Navigation */
    .SITE_HEADER nav,
    [data-testid="linkElement"] {
        font-size: 14px !important;
    }
}

/* ==========================================================================
   MOBILE BREAKPOINT (max-width: 767px)
   ========================================================================== */

@media screen and (max-width: 767px) {
    /* ==========================================================================
       WIX PAGES - HEADER & NAVIGATION
       ========================================================================== */
    
    /* Header container */
    #SITE_HEADER,
    .wixui-header {
        padding: 10px 15px !important;
    }

    /* Logo/Brand text */
    #comp-itcxd5aj,
    .wixui-rich-text h2,
    .comp-itcxd5aj {
        font-size: 24px !important;
        text-align: center !important;
    }

    /* Navigation menu - make it stack */
    #comp-iszt89yr,
    .DropDownMenu,
    .wixui-dropdown-menu,
    nav ul,
    .StylableHorizontalMenu {
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
    }

    .DropDownMenu li,
    nav ul li,
    .StylableHorizontalMenu li {
        width: 100% !important;
        text-align: center !important;
        padding: 8px 0 !important;
        border-bottom: 1px solid rgba(0,0,0,0.1) !important;
    }

    .DropDownMenu a,
    nav ul li a {
        font-size: 16px !important;
        padding: 10px !important;
        display: block !important;
    }

    /* ==========================================================================
       WIX PAGES - CONTENT SECTIONS
       ========================================================================== */

    /* Headings */
    .font_0,
    h1, h2 {
        font-size: 32px !important;
        line-height: 1.2 !important;
    }

    .font_7,
    .font_8,
    p {
        font-size: 14px !important;
        line-height: 1.6 !important;
    }

    /* Sections padding */
    section,
    .wixui-section,
    .Oqnisf {
        padding: 20px 15px !important;
    }

    /* Column strips - stack vertically */
    .CohWsy > .V5AUxf,
    .wixui-column-strip > div,
    [data-testid="columns"] {
        flex-direction: column !important;
    }

    .wixui-column-strip__column,
    .YzqVVZ {
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 20px !important;
    }

    /* Repeater/Grid layouts */
    .wixui-repeater > div,
    .hRdzm4 {
        flex-direction: column !important;
    }

    .wixui-repeater__item,
    .T7n0L6 {
        width: 100% !important;
        margin-bottom: 15px !important;
    }

    /* ==========================================================================
       WIX PAGES - SLIDER/GALLERY
       ========================================================================== */

    .SlideShowContainer,
    .wixui-slideshow,
    #comp-l0un4d99 {
        height: auto !important;
        min-height: 300px !important;
    }

    .SlideShowSlide,
    .wixui-slideshow__slide {
        padding: 20px !important;
    }

    /* Pro Gallery */
    .pro-gallery,
    .pro-gallery-parent-container {
        height: auto !important;
    }

    .pro-gallery-margin-container {
        height: auto !important;
    }

    /* ==========================================================================
       WIX PAGES - FOOTER
       ========================================================================== */

    #SITE_FOOTER,
    .wixui-footer,
    footer {
        padding: 20px 15px !important;
    }

    .wixui-footer .V5AUxf,
    footer .V5AUxf {
        flex-direction: column !important;
        text-align: center !important;
    }

    /* Social icons */
    .wixui-link-bar,
    .LinkBar {
        justify-content: center !important;
    }

    /* ==========================================================================
       CUSTOM PAGES - HEADER
       ========================================================================== */

    .site-header {
        padding: 15px !important;
    }

    .header-container {
        padding: 0 15px !important;
    }

    .brand-text {
        font-size: 24px !important;
    }

    /* Navigation - stack vertically */
    .nav-menu {
        flex-direction: column !important;
        height: auto !important;
        padding: 10px 0 !important;
    }

    .nav-menu li {
        width: 100% !important;
        flex: none !important;
        border-bottom: 1px solid rgba(0,0,0,0.1) !important;
    }

    .nav-menu a {
        padding: 12px 0 !important;
    }

    .nav-menu .menu-item-text {
        font-size: 16px !important;
        padding: 8px 15px !important;
    }

    /* ==========================================================================
       CUSTOM PAGES - CONTENT
       ========================================================================== */

    .content-section {
        padding: 30px 15px !important;
    }

    .content-section h2 {
        font-size: 28px !important;
        margin-bottom: 15px !important;
    }

    .content-section p {
        font-size: 14px !important;
    }

    /* Products grid */
    .products-grid {
        grid-template-columns: 1fr !important;
        gap: 15px !important;
        padding: 0 15px !important;
    }

    .product-card {
        min-height: 200px !important;
    }

    /* Features grid */
    .features-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 15px !important;
    }

    .feature-item {
        padding: 10px !important;
    }

    .feature-item h4 {
        font-size: 12px !important;
    }

    /* ==========================================================================
       CUSTOM PAGES - FOOTER
       ========================================================================== */

    .site-footer {
        padding: 20px 15px !important;
    }

    .footer-content {
        flex-direction: column !important;
        text-align: center !important;
        gap: 15px !important;
    }

    .footer-links {
        flex-direction: column !important;
        gap: 10px !important;
    }

    .social-icons {
        justify-content: center !important;
    }
}

/* ==========================================================================
   SMALL MOBILE BREAKPOINT (max-width: 480px)
   ========================================================================== */

@media screen and (max-width: 480px) {
    /* Even smaller fonts */
    .font_0,
    h1, h2 {
        font-size: 26px !important;
    }

    .brand-text {
        font-size: 20px !important;
    }

    /* Features grid - single column */
    .features-grid {
        grid-template-columns: 1fr !important;
    }

    /* Slider height */
    .SlideShowContainer,
    #comp-l0un4d99 {
        min-height: 250px !important;
    }

    /* Extra padding reduction */
    section,
    .content-section {
        padding: 15px 10px !important;
    }
}

/* ==========================================================================
   LANDSCAPE ORIENTATION FIXES
   ========================================================================== */

@media screen and (max-height: 500px) and (orientation: landscape) {
    .SlideShowContainer,
    #comp-l0un4d99 {
        min-height: 200px !important;
        height: 50vh !important;
    }
}

/* ==========================================================================
   PRINT STYLES
   ========================================================================== */

@media print {
    .nav-menu,
    #SITE_HEADER nav,
    .social-icons,
    .wixui-link-bar {
        display: none !important;
    }

    body {
        font-size: 12pt !important;
    }
}