/* Slider Content Positioning CSS - Works with all sliders */

/* Content Position Classes */
.content-position-left {
    text-align: left !important;
    margin-left: 2rem !important;
    margin-right: auto !important;
}

.content-position-center {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.content-position-right {
    text-align: right !important;
    margin-left: auto !important;
    margin-right: 2rem !important;
}

/* Navigation Position Controls */
.navigation-position-auto {
    /* Auto positioning - follows content */
}

.navigation-position-sides {
    /* Keep navigation on sides */
}

.navigation-position-bottom {
    /* Move navigation to bottom */
}

/* Responsive adjustments for content positioning */
@media (max-width: 768px) {
    .content-position-left,
    .content-position-right {
        margin-left: 1rem !important;
        margin-right: 1rem !important;
        text-align: center !important;
    }
    
    /* Mobile navigation adjustments */
    .default-slider.content-position-left .hero-nav-prev,
    .default-slider.content-position-left .hero-nav-next,
    .default-slider.content-position-right .hero-nav-prev,
    .default-slider.content-position-right .hero-nav-next {
        bottom: 1rem !important;
    }
    
    .default-slider.content-position-left .hero-nav-prev {
        left: 1rem !important;
    }
    
    .default-slider.content-position-left .hero-nav-next {
        left: 5rem !important;
    }
    
    .default-slider.content-position-right .hero-nav-prev {
        right: 5rem !important;
    }
    
    .default-slider.content-position-right .hero-nav-next {
        right: 1rem !important;
    }
}

@media (max-width: 480px) {
    .content-position-left,
    .content-position-right {
        margin-left: 0.5rem !important;
        margin-right: 0.5rem !important;
    }
    
    /* Small mobile navigation adjustments */
    .default-slider.content-position-left .hero-nav-prev,
    .default-slider.content-position-left .hero-nav-next,
    .default-slider.content-position-right .hero-nav-prev,
    .default-slider.content-position-right .hero-nav-next {
        bottom: 0.5rem !important;
    }
    
    .default-slider.content-position-left .hero-nav-prev {
        left: 0.5rem !important;
    }
    
    .default-slider.content-position-left .hero-nav-next {
        left: 4rem !important;
    }
    
    .default-slider.content-position-right .hero-nav-prev {
        right: 4rem !important;
    }
    
    .default-slider.content-position-right .hero-nav-next {
        right: 0.5rem !important;
    }
}

/* Override any existing text-align for positioning */
.hero-content.content-position-left,
.carousel-content-7294.content-position-left,
.parallax-content-8361.content-position-left,
.animated-slider .content.content-position-left {
    text-align: left !important;
    margin-left: 2rem !important;
    margin-right: auto !important;
}

.hero-content.content-position-center,
.carousel-content-7294.content-position-center,
.parallax-content-8361.content-position-center,
.animated-slider .content.content-position-center {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.hero-content.content-position-right,
.carousel-content-7294.content-position-right,
.parallax-content-8361.content-position-right,
.animated-slider .content.content-position-right {
    text-align: right !important;
    margin-left: auto !important;
    margin-right: 2rem !important;
}

/* Force positioning even with inline styles */
.hero-content[class*="content-position-"],
.carousel-content-7294[class*="content-position-"],
.parallax-content-8361[class*="content-position-"],
.animated-slider .content[class*="content-position-"] {
    position: relative !important;
}

/* Additional specificity for positioning */
.hero .hero-content.content-position-left,
.carousel-slider-7294 .carousel-content-7294.content-position-left,
.parallax-slider-8361 .parallax-content-8361.content-position-left,
.animated-slider-container .animated-slider .content.content-position-left {
    text-align: left !important;
    margin-left: 2rem !important;
    margin-right: auto !important;
}

.hero .hero-content.content-position-center,
.carousel-slider-7294 .carousel-content-7294.content-position-center,
.parallax-slider-8361 .parallax-content-8361.content-position-center,
.animated-slider-container .animated-slider .content.content-position-center {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.hero .hero-content.content-position-right,
.carousel-slider-7294 .carousel-content-7294.content-position-right,
.parallax-slider-8361 .parallax-content-8361.content-position-right,
.animated-slider-container .animated-slider .content.content-position-right {
    text-align: right !important;
    margin-left: auto !important;
    margin-right: 2rem !important;
}

/* Proper positioning for default slider with navigation following content */
.default-slider .hero-content.content-position-left {
    left: 2rem !important;
    transform: translateY(-50%) !important;
    text-align: left !important;
}

.default-slider .hero-content.content-position-center {
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    text-align: center !important;
}

.default-slider .hero-content.content-position-right {
    left: auto !important;
    right: 2rem !important;
    transform: translateY(-50%) !important;
    text-align: right !important;
}

/* Navigation buttons follow content position */
.default-slider.content-position-left .hero-nav-prev,
.default-slider.content-position-left .hero-nav-next {
    position: absolute !important;
    top: auto !important;
    bottom: 2rem !important;
    transform: none !important;
}

.default-slider.content-position-left .hero-nav-prev {
    left: 2rem !important;
}

.default-slider.content-position-left .hero-nav-next {
    left: 8rem !important;
}

.default-slider.content-position-center .hero-nav-prev,
.default-slider.content-position-center .hero-nav-next {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.default-slider.content-position-center .hero-nav-prev {
    left: 2rem !important;
}

.default-slider.content-position-center .hero-nav-next {
    right: 2rem !important;
}

.default-slider.content-position-right .hero-nav-prev,
.default-slider.content-position-right .hero-nav-next {
    position: absolute !important;
    top: auto !important;
    bottom: 2rem !important;
    transform: none !important;
}

.default-slider.content-position-right .hero-nav-prev {
    right: 8rem !important;
}

.default-slider.content-position-right .hero-nav-next {
    right: 2rem !important;
}

/* Ensure content background and styling work properly */
.default-slider .hero-content {
    color: white !important;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8) !important;
}

.default-slider .hero-content h2 {
    color: white !important;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8) !important;
    /* Font size will be set by inline styles from settings */
}

.default-slider .hero-content p {
    color: white !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8) !important;
    /* Font size will be set by inline styles from settings */
}

.default-slider .hero-content .btn {
    /* Button styling will be set by inline styles from settings */
    color: white !important;
    text-decoration: none !important;
    display: inline-block !important;
    border-radius: 5px !important;
    transition: all 0.3s ease !important;
}

/* Ensure content is always visible regardless of positioning */
.default-slider .hero-content {
    z-index: 10 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Fix for content not showing - ensure proper positioning */
.default-slider .hero-content[class*="content-position-"] {
    position: absolute !important;
    top: 50% !important;
    z-index: 10 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Remove debug styling and fix content visibility */
.default-slider .hero-content {
    /* Remove debug styling */
    border: none !important;
    background: transparent !important;
}