/* Increase navigation text size to 16px for desktop only - NO OTHER CHANGES */

/* ========================================
   NAVIGATION TEXT SIZE INCREASE - DESKTOP ONLY
   ======================================== */

/* Desktop only - increase navigation text size from 14px to 16px */
@media (min-width: 768px) {
    /* ULTRA HIGH SPECIFICITY - Target the exact structure with maximum specificity */
    .web-size .header-sec-wrp .header-inner .nab-menu .nav-ul .links > a {
        font-size: 16px !important; /* Increase from 14px to 16px */
        line-height: 1.4 !important; /* Adjust line height for larger text */
    }
    
    /* Target the container first to override its font-size */
    .web-size .header-sec-wrp .header-inner .nab-menu .nav-ul .links {
        font-size: 16px !important; /* Override container font-size */
    }
    
    /* Additional high-specificity selectors to ensure override */
    .header-sec-wrp .header-inner .nab-menu .nav-ul .links > a {
        font-size: 16px !important; /* Increase from 14px to 16px */
        line-height: 1.4 !important; /* Adjust line height for larger text */
    }
    
    .header-sec-wrp .header-inner .nab-menu .nav-ul .links {
        font-size: 16px !important; /* Override container font-size */
    }
    
    /* Fallback selectors with high specificity */
    .nab-menu .nav-ul .links > a {
        font-size: 16px !important; /* Increase from 14px to 16px */
        line-height: 1.4 !important; /* Adjust line height for larger text */
    }
    
    .nab-menu .nav-ul .links {
        font-size: 16px !important; /* Override container font-size */
    }
    
    /* Final fallback selectors */
    .links > a {
        font-size: 16px !important; /* Increase from 14px to 16px */
        line-height: 1.4 !important; /* Adjust line height for larger text */
    }
    
    .links {
        font-size: 16px !important; /* Override container font-size */
    }
}

/* Mobile - keep original 15px size */
@media (max-width: 767px) {
    /* Target the container first to override its font-size */
    .nab-menu .nav-ul .links {
        font-size: 15px !important; /* Keep original 15px for mobile */
    }
    
    /* Target the exact same selector as the original CSS but with higher specificity */
    .nab-menu .nav-ul .links > a {
        font-size: 15px !important; /* Keep original 15px for mobile */
        line-height: 1.4 !important; /* Adjust line height */
    }
    
    /* Additional high-specificity selectors to ensure override */
    .header-sec-wrp .header-inner .nab-menu .nav-ul .links {
        font-size: 15px !important; /* Keep original 15px for mobile */
    }
    
    .header-sec-wrp .header-inner .nab-menu .nav-ul .links > a {
        font-size: 15px !important; /* Keep original 15px for mobile */
        line-height: 1.4 !important; /* Adjust line height */
    }
    
    /* Fallback selectors */
    .links {
        font-size: 15px !important; /* Keep original 15px for mobile */
    }
    
    .links > a {
        font-size: 15px !important; /* Keep original 15px for mobile */
        line-height: 1.4 !important; /* Adjust line height */
    }
}

/* ==========================
   PDP BUTTON STYLE FOR .view-bottom (override)
   Applies across all widths; mobile tweaks below
   ========================== */
.view-bottom {
    background: linear-gradient(180deg, #0099DD 0%, #0077BB 100%) !important;
    border: 1px solid #006699 !important;
    border-radius: 8px !important;
    padding: 8px 24px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 4px 12px rgba(48, 168, 220, 0.3) !important;
    position: relative !important;
    overflow: hidden !important;
    min-width: 200px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    font-family: 'Lato', Arial, sans-serif !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
    border: 2px solid transparent !important;
    background-clip: padding-box !important;
    color: #FFFFFF !important;
    will-change: transform;
}

.view-bottom:hover {
    background: linear-gradient(180deg, #28A745 0%, #218838 100%) !important;
    border: 1px solid #1E7E34 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.4) !important;
    color: #FFFFFF !important;
}

/* Keep inline-block specifically where layout expects it */
.wedding-wrp .view-bottom { display: inline-block !important; }

/* Mobile adjustments to ensure one-line label and tap target */
@media (max-width: 768px) {
    .view-bottom {
        min-width: 140px !important;
        height: 36px !important;
        padding: 6px 16px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* Touch target compliance */
@media (max-width: 768px) {
    .view-bottom {
        min-height: 44px !important;
        min-width: 44px !important;
    }
}

/* Focus state */
.view-bottom:focus {
    outline: 2px solid #006699 !important;
    outline-offset: 2px !important;
}

/* ULTRA HIGH SPECIFICITY - Override conflicting .view-bottom rules */
.wedding-sec .container-fluid .wedding-inner .row .col-md-4 .wedding-wrp .ml a.view-bottom,
.wedding-sec .container-fluid .wedding-inner .row .col-md-8 .wedding-wrp .ml a.view-bottom,
.wedding-sec .ml a.view-bottom,
.wedding-wrp .ml a.view-bottom,
a.view-bottom.view-bottom {
    background: linear-gradient(180deg, #0099DD 0%, #0077BB 100%) !important;
    border: 1px solid #006699 !important;
    border-radius: 8px !important;
    padding: 8px 24px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 4px 12px rgba(48, 168, 220, 0.3) !important;
    position: relative !important;
    overflow: hidden !important;
    min-width: 200px !important;
    height: 38px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
    font-family: 'Lato', Arial, sans-serif !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.1) !important;
    border: 2px solid transparent !important;
    background-clip: padding-box !important;
    color: #FFFFFF !important;
    will-change: transform;
}

.wedding-sec .container-fluid .wedding-inner .row .col-md-4 .wedding-wrp .ml a.view-bottom:hover,
.wedding-sec .container-fluid .wedding-inner .row .col-md-8 .wedding-wrp .ml a.view-bottom:hover,
.wedding-sec .ml a.view-bottom:hover,
.wedding-wrp .ml a.view-bottom:hover,
a.view-bottom.view-bottom:hover {
    background: linear-gradient(180deg, #28A745 0%, #218838 100%) !important;
    border: 1px solid #1E7E34 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(40, 167, 69, 0.4) !important;
    color: #FFFFFF !important;
}

/* Mobile adjustments for View Collection CTAs */
@media (max-width: 768px) {
    .wedding-sec .container-fluid .wedding-inner .row .col-md-4 .wedding-wrp .ml a.view-bottom,
    .wedding-sec .container-fluid .wedding-inner .row .col-md-8 .wedding-wrp .ml a.view-bottom,
    .wedding-sec .ml a.view-bottom,
    .wedding-wrp .ml a.view-bottom,
    a.view-bottom.view-bottom {
        min-width: 140px !important;
        height: 36px !important;
        padding: 6px 16px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* Touch target compliance for View Collection CTAs */
@media (max-width: 768px) {
    .wedding-sec .container-fluid .wedding-inner .row .col-md-4 .wedding-wrp .ml a.view-bottom,
    .wedding-sec .container-fluid .wedding-inner .row .col-md-8 .wedding-wrp .ml a.view-bottom,
    .wedding-sec .ml a.view-bottom,
    .wedding-wrp .ml a.view-bottom,
    a.view-bottom.view-bottom {
        min-height: 44px !important;
        min-width: 44px !important;
    }
}

/* Focus state for View Collection CTAs */
.wedding-sec .container-fluid .wedding-inner .row .col-md-4 .wedding-wrp .ml a.view-bottom:focus,
.wedding-sec .container-fluid .wedding-inner .row .col-md-8 .wedding-wrp .ml a.view-bottom:focus,
.wedding-sec .ml a.view-bottom:focus,
.wedding-wrp .ml a.view-bottom:focus,
a.view-bottom.view-bottom:focus {
    outline: 2px solid #006699 !important;
    outline-offset: 2px !important;
}