/* HomeSlider Responsive Styles */

/* Home Slider*/
.slider-item {
    position: relative;
    overflow: hidden;
}

.slider-text-overlay {
    display: flex;
    align-items: center;
    justify-content: center;
}

.slider-content {
    animation-delay: 0.5s;
    padding-top: 10%;
}

.slider-title, .slider-subtitle, .slider-description {
    opacity: 0.95;
}

/* CSS Variables for dynamic text colors */
.slider-content {
    --text-color: inherit;
}

.slider-content .slider-title,
.slider-content .slider-subtitle,
.slider-content .slider-description {
    color: var(--text-color);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .slider-title {
        font-size: 1.8rem !important;
    }

    .slider-subtitle {
        font-size: 1.2rem !important;
    }

    .slider-description {
        font-size: 1rem !important;
    }
}

@media (max-width: 576px) {
    .slider-title {
        font-size: 1rem !important;
    }

    .slider-subtitle {
        font-size: 0.8rem !important;
    }

    .slider-description {
        font-size: 0.7rem !important;
    }
}

.home-slider .slider-text-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index: 2;
}

.home-slider .slider-content {
    pointer-events: auto;
    animation: fadeInUp 1s ease-in-out;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Desktop Styles */
.home-slider .slider-title {
    font-size: calc(2.5rem + (4rem - 2.5rem) * ((100vw - 992px) / (1920 - 992)));
    font-weight: bold;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
    margin-bottom: calc(0.75rem + (1.25rem - 0.75rem) * ((100vw - 992px) / (1920 - 992)));
    line-height: 1.2;
    color: inherit;
}

.home-slider .slider-subtitle {
    font-size: calc(1.5rem + (2.25rem - 1.5rem) * ((100vw - 992px) / (1920 - 992)));
    font-weight: 500;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.8);
    margin-bottom: calc(0.5rem + (1rem - 0.5rem) * ((100vw - 992px) / (1920 - 992)));
    line-height: 1.3;
    color: inherit;
}

.home-slider .slider-description {
    font-size: calc(1.125rem + (1.375rem - 1.125rem) * ((100vw - 992px) / (1920 - 992)));
    line-height: calc(1.5 + (1.7 - 1.5) * ((100vw - 992px) / (1920 - 992)));
    text-shadow: 1px 1px 3px rgba(0,0,0,0.8);
    margin-bottom: calc(1.5rem + (2rem - 1.5rem) * ((100vw - 992px) / (1920 - 992)));
    color: inherit;
}

/* Tablet Styles */
@media (min-width: 768px) and (max-width: 991px) {
    .home-slider .slider-title {
        font-size: calc(2rem + (2.5rem - 2rem) * ((100vw - 768px) / (991 - 768)));
        margin-bottom: 0rem;
    }
    
    .home-slider .slider-subtitle {
        font-size: calc(1.35rem + (1.75rem - 1.35rem) * ((100vw - 768px) / (991 - 768)));
        margin-bottom: 0rem;
    }
    
    .home-slider .slider-description {
        font-size: calc(1.05rem + (1.25rem - 1.05rem) * ((100vw - 768px) / (991 - 768)));
        line-height: 1;
        margin-bottom: 1.25rem;
    }
    
    .home-slider .slider-content {
        padding: 1.5rem;
    }
}

/* Mobile Styles */
@media (max-width: 767px) {
    .home-slider .slider-title {
        font-size: calc(1.8rem + (2.2rem - 1.8rem) * ((100vw - 320px) / (767 - 320)));
        margin-bottom: 0rem;
    }
    
    .home-slider .slider-subtitle {
        font-size: calc(1.2rem + (1.5rem - 1.2rem) * ((100vw - 320px) / (767 - 320)));
        margin-bottom: 0rem;
    }
    
    .home-slider .slider-description {
        font-size: calc(0.95rem + (1.15rem - 0.95rem) * ((100vw - 320px) / (767 - 320)));
        line-height: 1;
        margin-bottom: 1.25rem;
    }
    
    .home-slider .slider-text-overlay .container .row .col-lg-6 {
        width: 100%;
        max-width: 100%;
        padding: 0 1rem;
    }
    
    .home-slider .slider-text-overlay .container .row .col-md-8 {
        width: 100%;
        max-width: 100%;
    }
    
    .home-slider .slider-text-overlay .container .row .col-sm-10 {
        width: 100%;
        max-width: 100%;
    }
}

/* Extra Small Mobile */
@media (max-width: 480px) {
    .home-slider .slider-title {
        font-size: 1.75rem;
    }
    
    .home-slider .slider-subtitle {
        font-size: 1.15rem;
    }
    
    .home-slider .slider-description {
        font-size: 0.9rem;
        line-height: 1.4;
        margin-bottom: 1rem;
    }
    
    .home-slider .slider-content {
        padding: 0.75rem;
    }
}

/* Large Desktop Styles */
@media (min-width: 1400px) {
    .home-slider .slider-title {
        font-size: 3rem;
        margin-bottom: 1rem;
    }
    
    .home-slider .slider-subtitle {
        font-size: 2rem;
        margin-bottom: 0.5rem;
    }
    
    .home-slider .slider-description {
        font-size: 1.5rem;
        line-height: 1.75;
        margin-bottom: 2.25rem;
    }
}

/* Better spacing between elements */
.home-slider .slider-content > * + * {
    margin-top: calc(0.5rem + (0.75rem - 0.5rem) * ((100vw - 320px) / (1920 - 320)));
}

/* Animation for better user experience */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Enhanced text shadows for different backgrounds */
.home-slider .slider-content.shadow-strong .slider-title {
    text-shadow: 3px 3px 6px rgba(0,0,0,0.9);
}

.home-slider .slider-content.shadow-strong .slider-subtitle {
    text-shadow: 2px 2px 4px rgba(0,0,0,0.9);
}

.home-slider .slider-content.shadow-strong .slider-description {
    text-shadow: 1px 1px 3px rgba(0,0,0,0.9);
}

/* Responsive container improvements */
.home-slider .slider-text-overlay .container {
    height: 100%;
}

.home-slider .slider-text-overlay .row {
    height: 100%;
}

/* Better text readability on mobile */
@media (max-width: 767px) {
    .home-slider .slider-title {
        text-shadow: 2px 2px 5px rgba(0,0,0,0.9);
    }
    
    .home-slider .slider-subtitle {
        text-shadow: 1px 1px 4px rgba(0,0,0,0.9);
    }
    
    .home-slider .slider-description {
        text-shadow: 1px 1px 3px rgba(0,0,0,0.9);
    }
}

/* Hover effects for interactive elements within slider */
.home-slider .slider-content a,
.home-slider .slider-content button {
    transition: all 0.3s ease;
}

.home-slider .slider-content a:hover,
.home-slider .slider-content button:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

/* Better alignment options */
.home-slider .text-align-start {
    text-align: left !important;
}

.home-slider .text-align-center {
    text-align: center !important;
}

.home-slider .text-align-end {
    text-align: right !important;
}

/* Responsive text alignment */
@media (max-width: 767px) {
    .home-slider .text-align-mobile-center {
        text-align: center !important;
    }
}

/* Dynamic text color support - Will be set via inline CSS variable */
.home-slider .slider-content[style*="--text-color"] .slider-title,
.home-slider .slider-content[style*="--text-color"] .slider-subtitle,
.home-slider .slider-content[style*="--text-color"] .slider-description {
    color: var(--text-color) !important;
}

/* Additional text shadow for light colors on light backgrounds */
.home-slider .slider-content[data-text-light="true"] .slider-title,
.home-slider .slider-content[data-text-light="true"] .slider-subtitle,
.home-slider .slider-content[data-text-light="true"] .slider-description {
    text-shadow: 
        2px 2px 4px rgba(0,0,0,0.8),
        1px 1px 2px rgba(0,0,0,0.6),
        0 0 1px rgba(0,0,0,0.4);
}

/* Additional text shadow for dark colors on dark backgrounds */
.home-slider .slider-content[data-text-dark="true"] .slider-title,
.home-slider .slider-content[data-text-dark="true"] .slider-subtitle,
.home-slider .slider-content[data-text-dark="true"] .slider-description {
    text-shadow: 
        2px 2px 4px rgba(255,255,255,0.8),
        1px 1px 2px rgba(255,255,255,0.6),
        0 0 1px rgba(255,255,255,0.4);
}