/*!
Theme Name: International Documentary Film Festival Noida
Theme URI: http://underscores.me/
Author: Usmam
Author URI: http://underscores.me/
Description: The International Documentary Film Festival Noida (IDFFN) is a distinguished platform that showcases powerful documentary films from across the globe. For many aspiring filmmakers, documentaries serve as the foundation of their creative journey before moving on to feature cinema.
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: international-documentary-film-festival-noida
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

International Documentary Film Festival Noida is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/
/* Slider Section Styles */


/* ===========================================
   SUBTITLE & DESCRIPTION ONLY STYLES FOR SWIPER
   =========================================== */



/* Base Styles for Text Elements */
.slider-subtitle {
    display: block;
    font-size: 1rem; /* 16px */
    font-weight: 600;
    color: #FFD700; /* Gold color for better visibility */
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 12px;
    position: relative;
    padding-left: 20px;
}

.slider-subtitle::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 2px;
    background: #FFD700;
    border-radius: 2px;
}

/* Description Container */
.slider-description {
    display: block;
    font-size: 1.125rem; /* 18px */
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.95);
    margin: 0;
    padding: 0;
    max-width: 700px;
    text-align: left;
    position: relative;
}

/* Description Paragraph */
.slider-description p {
    margin: 0;
    padding: 15px 0 0 0;
    position: relative;
    padding-left: 20px;
    border-left: 2px solid rgba(255, 215, 0, 0.6);
}

.slider-description p::before {
    content: "❝";
    position: absolute;
    left: -5px;
    top: 0;
    font-size: 1.5rem;
    color: rgba(255, 215, 0, 0.6);
    font-family: serif;
}

/* Layout Container for Subtitle & Description */
.text-content-wrapper {
    position: relative;
    padding: 30px;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(10px);
    border-radius: 10px;
    margin: 20px auto;
    border: 1px solid rgba(255, 255, 255, 0.1);
    max-width: 700px;
}

.text-content-wrapper::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #FFD700, #FF8E53);
    border-radius: 10px 10px 0 0;
}

/* Alternative Style: Side by Side Layout */
.side-by-side-layout .slider-subtitle {
    flex: 0 0 30%;
    padding-right: 30px;
    margin-bottom: 0;
    font-size: 0.875rem; /* 14px */
    border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.side-by-side-layout .slider-description {
    flex: 0 0 70%;
    font-size: 0.9375rem; /* 15px */
}

.side-by-side-layout {
    display: flex;
    align-items: flex-start;
    gap: 30px;
}

/* Text Shadow for Better Readability */
.slider-subtitle {
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.slider-description {
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* Gradient Text Effect */
.gradient-text .slider-subtitle {
    background: linear-gradient(45deg, #FFD700, #FF8E53);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Icon with Subtitle */
.icon-subtitle .slider-subtitle {
    padding-left: 35px;
}

.icon-subtitle .slider-subtitle::before {
    content: "★";
    width: auto;
    height: auto;
    background: none;
    font-size: 0.875rem;
    color: #FFD700;
    left: 0;
    top: 0;
    transform: none;
}

/* Hover Effects */
.slider-description p:hover {
    transform: translateX(5px);
    transition: transform 0.3s ease;
}

/* Responsive Design */
@media (max-width: 992px) {
    .slider-subtitle {
        font-size: 0.875rem; /* 14px */
        letter-spacing: 1.5px;
        padding-left: 15px;
    }
    
    .slider-subtitle::before {
        width: 10px;
    }
    
    .slider-description {
        font-size: 1rem; /* 16px */
        max-width: 500px;
    }
    
    .slider-description p {
        padding-left: 15px;
    }
    
    .text-content-wrapper {
        padding: 20px;
        margin: 15px auto;
    }
    
    .side-by-side-layout {
        flex-direction: column;
        gap: 15px;
    }
    
    .side-by-side-layout .slider-subtitle {
        flex: none;
        width: 100%;
        padding-right: 0;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        padding-bottom: 10px;
    }
    
    .side-by-side-layout .slider-description {
        flex: none;
        width: 100%;
    }
}

@media (max-width: 768px) {
    .slider-subtitle {
        font-size: 0.75rem; /* 12px */
        letter-spacing: 1px;
        margin-bottom: 10px;
    }
    
    .slider-description {
        font-size: 0.875rem; /* 14px */
        line-height: 1.6;
    }
    
    .slider-description p {
        padding: 10px 0 0 10px;
    }
    
    .text-content-wrapper {
        padding: 15px;
        margin: 10px auto;
    }
    
    .slider-description p::before {
        font-size: 1.25rem;
    }
}

@media (max-width: 576px) {
    .slider-subtitle {
        font-size: 0.6875rem; /* 11px */
        padding-left: 12px;
    }
    
    .slider-subtitle::before {
        width: 8px;
    }
    
    .slider-description {
        font-size: 0.8125rem; /* 13px */
    }
    
    .slider-description p {
        padding-left: 8px;
        border-left-width: 1px;
    }
    
    .text-content-wrapper {
        padding: 12px;
        border-radius: 8px;
    }
    
    .text-content-wrapper::before {
        height: 2px;
    }
}

/* Special States for Swiper */
.swiper-slide-next .slider-subtitle,
.swiper-slide-prev .slider-subtitle {
    opacity: 0.5;
    transform: scale(0.95);
}

.swiper-slide-next .slider-description,
.swiper-slide-prev .slider-description {
    opacity: 0.3;
}

/* Loading State */
.slider-subtitle.loading,
.slider-description.loading {
    position: relative;
    overflow: hidden;
}

.slider-subtitle.loading::after,
.slider-description.loading::after {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    animation: loadingShimmer 1.5s infinite;
}

@keyframes loadingShimmer {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* Dark/Light Mode Adjustments */
@media (prefers-color-scheme: dark) {
    .slider-subtitle {
        color: #FFD700;
    }
    
    .slider-description {
        color: rgba(255, 255, 255, 0.9);
    }
    
    .text-content-wrapper {
        background: rgba(0, 0, 0, 0.5);
    }
}

@media (prefers-color-scheme: light) {
    .slider-subtitle {
        color: #D4AF37; /* Darker gold for light mode */
    }
    
    .slider-description {
        color: rgba(0, 0, 0, 0.8);
    }
    
    .text-content-wrapper {
        background: rgba(255, 255, 255, 0.9);
        border: 1px solid rgba(0, 0, 0, 0.1);
    }
    
    .slider-description p {
        border-left-color: rgba(212, 175, 55, 0.3);
    }
}

/* Print Styles */
@media print {
    .slider-subtitle {
        color: #000 !important;
        font-weight: 700;
    }
    
    .slider-description {
        color: #333 !important;
    }
    
    .slider-description p::before {
        color: #666 !important;
    }
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    .slider-subtitle {
        color: #FFFF00 !important;
        font-weight: 800;
    }
    
    .slider-description {
        color: #FFFFFF !important;
        font-weight: 600;
    }
    
    .text-content-wrapper {
        border: 2px solid #FFFF00;
        background: #000 !important;
    }
}

/* Custom Color Variations via Classes */
.slider-subtitle.primary {
    color: #4FC3F7;
}

.slider-subtitle.primary::before {
    background: #4FC3F7;
}

.slider-subtitle.secondary {
    color: #81C784;
}

.slider-subtitle.secondary::before {
    background: #81C784;
}

.slider-subtitle.accent {
    color: #FF8A65;
}

.slider-subtitle.accent::before {
    background: #FF8A65;
}

/* Description Style Variations */
.slider-description.large-text {
    font-size: 1.25rem;
    line-height: 1.8;
}

.slider-description.small-text {
    font-size: 0.9375rem;
    line-height: 1.6;
}

.slider-description.quote-style p {
    font-style: italic;
    font-family: Georgia, serif;
}

.slider-description.boxed-style p {
    background: rgba(255, 255, 255, 0.1);
    padding: 15px;
    border-radius: 5px;
    border-left: none;
}

.slider-description.boxed-style p::before {
    display: none;
}
/* Latest News Section */
.fa-latest-news-section {
    padding: 80px 0;
    background: #f8f9fa;
}

/* News Filter */
.news-filter {
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.filter-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
    justify-content: center;
}

.filter-nav li {
    padding: 10px 25px;
    background: #f0f0f0;
    border-radius: 30px;
    cursor: pointer;
    font-weight: 600;
    color: #555;
    transition: all 0.3s ease;
}

.filter-nav li:hover,
.filter-nav li.active {
    background: #0073aa;
    color: #fff;
    transform: translateY(-2px);
}

/* News Card */
.news-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    height: 100%;
    margin-bottom: 30px;
}

.news-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

.news-image {
    position: relative;
    height: 350px;
    overflow: hidden;
}

.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.news-card:hover .news-image img {
    transform: scale(1.05);
}

.news-date {
    position: absolute;
    top: 20px;
    right: 20px;
    background: #0073aa;
    color: #fff;
    width: 60px;
    height: 60px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    z-index: 2;
}

.news-date .day {
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
}

.news-date .month {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1;
    margin-top: 2px;
}

.news-content {
    padding: 25px;
}

.news-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
    font-size: 14px;
}

.news-category a {
    background: rgba(0, 115, 170, 0.1);
    color: #0073aa;
    padding: 5px 15px;
    border-radius: 20px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
}

.news-category a:hover {
    background: #0073aa;
    color: #fff;
}

.news-author {
    color: #666;
}

.news-author i {
    margin-right: 5px;
    color: #0073aa;
}

.news-title {
    font-size: 20px;
    margin: 0 0 15px 0;
    line-height: 1.4;
}

.news-title a {
    color: #222;
    text-decoration: none;
    transition: color 0.3s ease;
}

.news-title a:hover {
    color: #0073aa;
}

.news-excerpt {
    color: #666;
    line-height: 1.6;
    margin-bottom: 20px;
    font-size: 15px;
}

.news-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 15px;
    border-top: 1px solid #eee;
}

.read-more {
    color: #0073aa;
    text-decoration: none;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 5px;
    transition: all 0.3s ease;
}

.read-more:hover {
    color: #005a87;
    gap: 10px;
}

.read-more i {
    font-size: 14px;
    transition: transform 0.3s ease;
}

.read-more:hover i {
    transform: translateX(5px);
}

.news-comments {
    color: #666;
    font-size: 14px;
}

.news-comments i {
    margin-right: 5px;
    color: #0073aa;
}

/* No News Found */
.no-news-found {
    padding: 60px 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.no-news-found h3 {
    color: #333;
    margin-bottom: 15px;
}

.no-news-found p {
    color: #666;
    margin: 0;
}

/* Load More Button */
.load-more-news {
    margin-top: 40px;
}

.fa-primary-btn {
    background: #0073aa;
    color: #fff;
    border: none;
    padding: 15px 40px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.fa-primary-btn:hover {
    background: #005a87;
    transform: translateY(-2px);
}

.fa-primary-btn .button-icon {
    display: flex;
    align-items: center;
}

/* Featured News Banner */
.featured-news-banner {
    background: linear-gradient(135deg, #0073aa, #00a8ff);
    border-radius: 15px;
    padding: 50px;
    color: #fff;
    text-align: center;
}

.featured-news-banner h3 {
    font-size: 32px;
    margin-bottom: 15px;
}

.featured-news-banner p {
    font-size: 18px;
    margin-bottom: 30px;
    opacity: 0.9;
}

.newsletter-form {
    display: flex;
    max-width: 500px;
    margin: 0 auto;
    gap: 10px;
}

.newsletter-form input {
    flex: 1;
    padding: 15px 20px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
}

.newsletter-form button {
    background: #fff;
    color: #0073aa;
    border: none;
    padding: 15px 30px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.newsletter-form button:hover {
    background: #f0f0f0;
    transform: translateY(-2px);
}

/* News Categories Section */
.fa-news-categories {
    padding: 80px 0;
    background: #fff;
}

.section-title {
    font-size: 36px;
    margin-bottom: 15px;
    color: #222;
}

.section-subtitle {
    font-size: 18px;
    color: #666;
    margin-bottom: 40px;
}

.category-card {
    text-align: center;
    padding: 40px 30px;
    background: #f8f9fa;
    border-radius: 12px;
    transition: all 0.3s ease;
    margin-bottom: 30px;
}

.category-card:hover {
    background: #0073aa;
    color: #fff;
    transform: translateY(-5px);
}

.category-icon {
    font-size: 48px;
    color: #0073aa;
    margin-bottom: 20px;
    transition: color 0.3s ease;
}

.category-card:hover .category-icon {
    color: #fff;
}

.category-title {
    font-size: 22px;
    margin-bottom: 10px;
}

.category-title a {
    color: #222;
    text-decoration: none;
    transition: color 0.3s ease;
}

.category-card:hover .category-title a {
    color: #fff;
}

.category-count {
    color: #666;
    margin-bottom: 20px;
    font-size: 16px;
    transition: color 0.3s ease;
}

.category-card:hover .category-count {
    color: rgba(255,255,255,0.8);
}

.category-link {
    color: #0073aa;
    text-decoration: none;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.3s ease;
}

.category-card:hover .category-link {
    color: #fff;
}

.category-link:hover {
    gap: 10px;
}

.category-link i {
    font-size: 14px;
    transition: transform 0.3s ease;
}

.category-link:hover i {
    transform: translateX(5px);
}

/* Responsive Design */
@media (max-width: 992px) {
    .fa-latest-news-section,
    .fa-news-categories {
        padding: 60px 0;
    }
    
    .news-image {
        height: 220px;
    }
    
    .featured-news-banner {
        padding: 40px 30px;
    }
    
    .featured-news-banner h3 {
        font-size: 28px;
    }
}

@media (max-width: 768px) {
    .filter-nav {
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 10px;
    }
    
    .filter-nav li {
        white-space: nowrap;
    }
    
    .newsletter-form {
        flex-direction: column;
    }
    
    .newsletter-form input,
    .newsletter-form button {
        width: 100%;
    }
    
    .section-title {
        font-size: 30px;
    }
    
    .category-card {
        padding: 30px 20px;
    }
}

@media (max-width: 576px) {
    .fa-latest-news-section,
    .fa-news-categories {
        padding: 40px 0;
    }
    
    .news-image {
        height: 200px;
    }
    
    .news-content {
        padding: 20px;
    }
    
    .news-title {
        font-size: 18px;
    }
    
    .news-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    
    .featured-news-banner {
        padding: 30px 20px;
    }
    
    .featured-news-banner h3 {
        font-size: 24px;
    }
    
    .featured-news-banner p {
        font-size: 16px;
    }
}



/* Pagination */
.page-pagination {
    margin-top: 40px;
}

.page-pagination ul {
    display: flex;
    justify-content: center;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.page-pagination .page-numbers,
.page-pagination .nav-links a,
.page-pagination .nav-links span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #f5f5f5;
    color: #333;
    text-decoration: none;
    border-radius: 4px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.page-pagination .page-numbers:hover,
.page-pagination .page-numbers.current,
.page-pagination .nav-links .current {
    background: #0073aa;
    color: #fff;
}

.page-pagination .prev,
.page-pagination .next {
    width: auto;
    padding: 0 20px;
}

.page-pagination .prev i,
.page-pagination .next i {
    margin: 0 5px;
}