/* ==========================================================================
   Kulturni Element CSS - FINALNA KONSOLIDACIJA (v3.0.0)
   Sadrži sve obavezne stilove za tipografiju, komponente i Layout.
   Uklonjeni svi dupli stilovi za Header/Footer jer ih sada kontroliše Tailwind.
   ========================================================================== */

/* =========================================
   1. Reset & Osnovni Stilovi
   ========================================= */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: 'Open Sans', sans-serif;
    background-color: #f9f9f9;
    color: #333; 
    line-height: 1.6;
    display: flex; 
    flex-direction: column; 
    min-height: 100vh;
    overflow-x: hidden;
}
.container {
    max-width: 1280px; margin-left: auto; margin-right: auto;
    padding-left: 20px; padding-right: 20px;
    width: 100%; box-sizing: border-box;
}
img { max-width: 100%; height: auto; display: block; }
main { flex-grow: 1; padding-top: 0; padding-bottom: 0; overflow-x: hidden; }

/* =========================================
   2. Tipografija & Opšte Sekcije
   ========================================= */
h1, h2, h3, h4, h5, h6 { font-family: 'Cormorant Garamond', serif; }

/* Opšti H2 stilovi za sekcije (Osnovni stil) */
main h2 {
    font-family: 'Cormorant Garamond', serif; font-weight: 400; color: #9c2f28; 
    padding-bottom: 10px; margin-bottom: 30px; font-size: 2.5em; text-align: center; 
    position: relative;
}
main h2::after { 
    content: ''; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); 
    width: 60px; height: 3px; background-color: #9c2f28; border-radius: 2px;
}
/* Stil za paragraf ispod H2 */
main .container > p:first-of-type:not(.kontakt-intro) {
    margin-bottom: 30px; max-width: 800px; margin-left: auto; margin-right: auto; text-align: center; font-size: 1.05em; color: #555;
}

/* Prose stilovi (Tekst u člancima) */
.prose h2, .prose h3 { margin-top: 1.5em; margin-bottom: 0.8em; padding-bottom: 0.2em; border-bottom: 1px solid #e5e7eb; }
.prose p { margin-bottom: 1em; line-height: 1.7; }
.prose strong { font-weight: 600; }
.prose a { color: #9c2f28; text-decoration: underline; }
.prose a:hover { color: #7a241f; }
.prose ul { list-style: disc; padding-left: 1.5em; margin-bottom: 1em; }
.prose ul > li::marker { color: #9c2f28; }

/* Stilovi za biografiju (h4) */
.prose h4 {
    color: #9c2f28; font-family: 'Cormorant Garamond', serif; font-size: 1.5rem; line-height: 2rem;
    font-weight: 700; text-align: left; margin-top: 2rem; margin-bottom: 1.5rem;
    padding-bottom: 0.5rem; border-bottom: 1px solid rgba(156, 47, 40, 0.4);
}

/* =========================================
   3. Stilovi komponenti (Swiper, Filteri, Lightbox, Dugmad)
   ========================================= */

/* --- Glavni Slajder (#predstave-slider) - Održavanje custom navigacije --- */
#predstave-slider .swiper-button-next, 
#predstave-slider .swiper-button-prev { 
    color: #9c2f28; --swiper-navigation-size: 30px; 
    background-color: rgba(255, 255, 255, 0.7); border-radius: 50%; 
    width: 44px; height: 44px; transition: background-color 0.3s ease; 
}
#predstave-slider .swiper-button-next:hover, 
#predstave-slider .swiper-button-prev:hover { 
    background-color: rgba(255, 255, 255, 0.9); 
}
#predstave-slider .swiper-pagination-bullet { 
    background: rgba(255, 255, 255, 0.7); opacity: 1; width: 10px; height: 10px; 
    transition: background-color 0.3s ease; 
}
#predstave-slider .swiper-pagination-bullet-active { 
    background: #9c2f28; 
}

/* --- Sekcija "Актуелно" (#aktuelno) - Navigacija (premešteno) --- */
#aktuelno h2 { color: #fff; } 
#aktuelno h2::after { background-color: #fff; }
#aktuelno .swiper-button-next, #aktuelno .swiper-button-prev { 
    color: #fff; top: 50%; transform: translateY(-50%); 
    width: 30px; height: 30px; background-color: rgba(0, 0, 0, 0.2); 
    border-radius: 50%; --swiper-navigation-size: 18px; 
}
#aktuelno .swiper-button-next:hover, #aktuelno .swiper-button-prev:hover { 
    background-color: rgba(0, 0, 0, 0.4); 
}
#aktuelno .swiper-button-prev { left: 10px; } 
#aktuelno .swiper-button-next { right: 10px; }


/* --- Filteri za PROJEKTE i PRODAVNICU --- */
.filter-button-prodavnica-main.active-filter { color: #9c2f28; font-weight: 600; border-bottom-color: #9c2f28;}
.filter-button-shop.active-filter { background-color: #9c2f28; box-shadow: 0 0 0 3px rgba(229, 231, 235, 0.7); }
.filter-button-shop.active-filter i { color: white !important; }
.filter-button-svi.active-filter{color:#9c2f28;font-weight:600;border-bottom-color:#9c2f28;}
.filter-button-kugla{ border-radius:9999px !important; }
.filter-button-kugla.active-filter{background-color:#9c2f28;box-shadow:0 0 0 3px rgba(229,231,235,0.7);transform:scale(1.05);}
.filter-button-kugla.active-filter i{color:white!important;transform:scale(1.15);}

/* --- Lightbox Stilovi (Galileja/Projekti/Prodavnica) --- */
.lb-data .lb-caption, .lb-data .lb-number { font-family: 'Open Sans', sans-serif !important; font-size: 0.875rem !important; color: #f3f4f6 !important; }
.lb-close { filter: brightness(0) invert(1); opacity: 0.7; transition: opacity 0.2s ease; }
.lb-close:hover { opacity: 1; }
.lb-nav a.lb-prev, .lb-nav a.lb-next { filter: brightness(0) invert(1); opacity: 0.5; transition: opacity 0.2s ease; }
.lb-nav a.lb-prev:hover, .lb-nav a.lb-next:hover { opacity: 1; }
.lightboxOverlay { background-color: rgba(0,0,0,0.85) !important; }

/* --- Stilovi za mapu i video --- */
.map-container { position: relative; width: 100%; padding-top: 54%; overflow: hidden; border-radius: 0.375rem; border: 1px solid #e5e7eb; }
.map-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.sidebar-video-container { position: relative; width: 100%; padding-top: 56.25%; overflow: hidden; border-radius: 0.375rem; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1); }
.sidebar-video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* --- Dugmad (Iz style.css) --- */
.button {
    display: inline-block; padding: 10px 20px; background-color: #9c2f28; color: #fff !important; 
    text-decoration: none; border-radius: 5px; font-weight: 700; font-family: 'Open Sans', sans-serif; 
    transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease; 
    border: none; cursor: pointer; line-height: 1.4;
}
.button:hover { 
    background-color: #7a241f; transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,0.15); 
    color: #fff !important; text-decoration: none; 
}
.button.button-card { padding: 6px 12px; font-size: 0.85em; font-weight: 600; }

/* --- Scroll-to-top (Iz style.css) --- */
#scrollToTopBtn {
    display: none; position: fixed; bottom: 20px; right: 30px; z-index: 99; border: none; outline: none; 
    background-color: #9c2f28; color: white; cursor: pointer; padding: 0; border-radius: 50%; 
    width: 45px; height: 45px; font-size: 20px; line-height: 45px; text-align: center; 
    transition: background-color 0.3s ease, opacity 0.3s ease, transform 0.3s ease; 
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
#scrollToTopBtn:hover { background-color: #7a241f; transform: scale(1.05); }

/* --- Media Queries (Iz originalnog style.css) --- */
@media (max-width: 992px) { 
    .oblasti-grid, .tim-grid, .vesti-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
}
@media (max-width: 600px) { 
    main h2:not(#kontakt-stranica h2) { font-size: 2em; } 
    .oblasti-grid, .tim-grid, .dogadjaji-grid, .vesti-grid { grid-template-columns: 1fr; gap: 25px; }
}

/* =========================================
   5. Footer (Samo za custom stilove)
   ========================================= */
/* Bilo kakvi custom stilovi koji ne mogu da se reše Tailwind-om (npr. ikonice, font-size) */
/* ... */