/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/

/* ========================================
   FONTS
   ======================================== */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700;800;900&display=swap');

@font-face {
    font-family: 'Brule';
    src: url('fonts/Brule-SemiBold.eot');
    src: local('Brule SemiBold'), local('Brule-SemiBold'),
        url('fonts/Brule-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('fonts/Brule-SemiBold.woff') format('woff'),
        url('fonts/Brule-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}


div#gf_progressbar_wrapper_1 {
    padding-bottom: 50px;
}
/* Gravity Forms - naziv koraka neka bude mala slova */
.gf_progressbar_title .gf_step_page_name{
  text-transform: lowercase !important;
}


.gform_wrapper input:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus{
  outline: none !important;
  box-shadow: none !important;
  border-color: #ca162b !important;
}


.gform-theme.gform-theme--framework.gform_wrapper .button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper .gform-theme-button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper :where(:not(.mce-splitbtn))>button:not([id*=mceu_]):not(.mce-open):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper button.button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type=submit],[type=button],[type=reset]).button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input:is([type=submit],[type=button],[type=reset]):where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)), .gform-theme.gform-theme--framework.gform_wrapper input[type=submit].button.gform_button:where(:not(.gform-theme-no-framework):not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
    background-color: #ca162b !important;
    border-radius: 0px !important;
}


/* Sakrij globalni error summary */
.gform_validation_errors{
  display: none !important;
}

input#gform_previous_button_1 {
    border: none !important;
    color: #fff;
}





/* SVE inline validation poruke */
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message{
    font-weight: bold;
}



/* ========================================
   GLOBAL STYLES & UTILITIES
   ======================================== */

/* Fix za Chrome/Safari overscroll pozadinu */
html {
    background-color: #ffffff !important;
    background-color: var(--nectar-bg-color, #ffffff) !important;
}

.ds-margin0auto {
    margin: 0 auto !important;
}

.ds-font-brule-600 {
    font-family: 'Brule', sans-serif;
    font-weight: 600 !important;
}




.ds-font-barlow-600 {
    font-family: 'Barlow', sans-serif;
    font-weight: 600 !important;
    text-transform: uppercase;

}






.row .col img {
    margin-bottom: 0;
}

.gallery a img {
    border: none !important;
}

/* Scroll Lock */
html.nectar-no-scroll,
body.nectar-no-scroll {
    overflow: hidden !important;
    height: 100% !important;
    width: 100% !important;
    position: fixed;
    top: 0;
    left: 0;
}


body #ajax-content-wrap #error-404 h1 {
    margin-top: 70px;
}



/* ========================================
   HOVER EFFECTS & ANIMATIONS
   ======================================== */
.ds-zoomefekt-hover {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    transform-origin: center center;
    will-change: transform;
}

.ds-zoomefekt-hover:hover {
    transform: scale(1.05);
    z-index: 10;
}



.full-width-section .light .nectar-button:hover,
.nectar-button:hover {
    opacity: 1 !important;
}

/* Link Zoom Style */
.ds-hover-style-zoom .nectar-link-underline-effect a {
    text-decoration: none !important;
    background-image: none !important;
    display: inline-block;
    transition: transform 0.3s ease;
    position: relative;
}

.ds-hover-style-zoom .nectar-link-underline-effect a:hover {
    transform: scale(1.05);
}

.ds-hover-style-zoom .nectar-link-underline-effect a:not(:empty)::after {
    content: ">" !important;
    font-family: auto, sans-serif !important;
    font-weight: 600 !important;
    font-size: 1em !important;
    margin-left: 0.25em !important;
    display: inline !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: inherit !important;
}

.ds-hover-style-zoom .nectar-link-underline-effect a:empty {
    display: none !important;
}

/* ========================================
   HEADER & NAVIGATION
   ======================================== */
/* Header Border Removals */
.ascend #header-outer.transparent[data-transparent-header=true][data-full-width=true][data-remove-border=true] #top nav ul #nectar-user-account a:after,
.ascend #header-outer.transparent[data-transparent-header=true][data-full-width=true][data-remove-border=true] #top nav ul #search-btn a:after,
.ascend #header-outer.transparent[data-transparent-header=true][data-full-width=true][data-remove-border=true] #top nav ul .slide-out-widget-area-toggle a:after,
.ascend #header-outer.transparent[data-transparent-header=true][data-full-width=true][data-remove-border=true] .cart-contents:after,
.ascend #header-outer[data-transparent-header="true"][data-full-width="true"][data-remove-border="true"] #top nav ul #search-btn a:after,
.ascend #header-outer[data-transparent-header="true"][data-full-width="true"][data-remove-border="true"] #top nav ul #nectar-user-account a:after,
.ascend #header-outer[data-transparent-header="true"][data-full-width="true"][data-remove-border="true"] #top nav ul .slide-out-widget-area-toggle a:after,
.ascend #header-outer[data-transparent-header="true"][data-full-width="true"][data-remove-border="true"] .cart-contents:after,
body #header-outer[data-transparent-header="true"] #top nav ul #nectar-user-account > div,
body[data-header-color="custom"] #top nav ul #nectar-user-account > div,
#header-outer:not(.transparent) .sf-menu > li ul,
.ascend #header-outer[data-full-width=true] #top nav ul #nectar-user-account a,
.ascend #header-outer[data-full-width=true] #top nav ul #search-btn a,
.ascend #header-outer[data-full-width=true] #top nav ul .slide-out-widget-area-toggle a {
    border: none !important;
}

body #header-outer[data-transparent-header="true"].transparent {
    border-bottom: none !important;
}

/* Header Icons */
#header-outer .cart-menu .cart-icon-wrap .icon-salient-cart,
#top nav ul #nectar-user-account a span,
#top nav ul #search-btn a span {
    font-size: 22px;
}

/* Hamburger Menu Lines */
#header-outer.transparent[data-permanent-transparent="false"] #top .slide-out-widget-area-toggle.mobile-icon i:before,
#header-outer.transparent[data-permanent-transparent="false"] #top .slide-out-widget-area-toggle.mobile-icon i:after,
.lines:after,
.lines:before {
    width: 100% !important;
}

.lines:before {
    color: #000;
    font-size: 24px;
    height: 24px;
    line-height: 10px;
}

/* ========================================
   OFF-CANVAS MENU
   ======================================== */
/* Menu Animation */
.off-canvas-menu-container ul.menu > li > a {
    position: relative !important;
    display: inline-block !important;
    text-decoration: none !important;
    padding-bottom: 10px !important;
}

.off-canvas-menu-container ul.menu > li > a::after {
    content: '' !important;
    position: absolute !important;
    width: 0 !important;
    height: 3px !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background-color: #ffffff !important;
    transition: width 0.3s ease, left 0.3s ease, transform 0.3s ease !important;
}

.off-canvas-menu-container ul.menu > li > a:hover::after {
    width: 100% !important;
    left: 0 !important;
    transform: translateX(0) !important;
}

/* Social Links */
#slide-out-widget-area .off-canvas-social-links {
    display: flex !important;
    flex-direction: row !important;
}

#slide-out-widget-area .off-canvas-social-links:after {
    display: none !important;
}

#slide-out-widget-area .off-canvas-social-links li {
    transition: transform 0.3s ease !important;
}

#slide-out-widget-area .off-canvas-social-links li:hover {
    transform: scale(1.20) !important;
}

#slide-out-widget-area .off-canvas-social-links li a {
    opacity: 1 !important;
    transition: transform 0.3s ease;
    display: inline-block;
}

/* Social Links Order */
#slide-out-widget-area .off-canvas-social-links li:nth-child(1) { order: 4 !important; } /* X */
#slide-out-widget-area .off-canvas-social-links li:nth-child(2) { order: 1 !important; } /* Facebook */
#slide-out-widget-area .off-canvas-social-links li:nth-child(3) { order: 3 !important; } /* YouTube */
#slide-out-widget-area .off-canvas-social-links li:nth-child(4) { order: 2 !important; } /* Instagram */



/* ========================================
   SEARCH
   ======================================== */
form[role="search"] span {
    display: none !important;
}

body.ascend #search-outer #search #search-box input[type="text"] {
    font-size: 60px;
    font-family: 'Brule', sans-serif;
    font-weight: 600 !important;
    letter-spacing: 6px !important;
}




/* Base rotacija - već ima 45deg */
body.material #search-outer #search #close a {
    right: 12px;
    transition: transform 0.3s ease !important; /* DODANO */
}

/* Hover rotacija - dodaj još 90deg */
body.material #search-outer #search #close a:hover {
    transform: rotate(90deg) !important;
}


@media only screen and (max-width: 999px) {
  body.material #search-outer #search #close a:hover {
    transform: none !important;
  }
}








#search-outer #close a:before,
.slide_out_area_close:before {
    background: none !important;
}

#search-outer #search #close a span:not(.close-line) {
    color: #000;
    font-size: 34px;
    height: 24px;
    line-height: 1;
    display: inline-block;
    transform-origin: center center;
}




/* Search Results */
.nectar-ajax-search-results .search-post-item {
    border-radius: 0px !important;
}

#search-box .ui-autocomplete .desc {
    display: none !important;
}

#search-results {
    margin-bottom: 30px;
    overflow: visible;
    text-align: center;
}

#search-results .search-form input[type="text"] {
    background-color: transparent !important;
    border-bottom: 1px solid #000 !important;
    max-width: 250px;
    margin: 0 auto !important;
}

body.search-no-results[data-header-resize] .container-wrap {
    padding: 8% 0 6% 0 !important;
}

/* ========================================
   FOOTER
   ======================================== */
.ds-footer-menu .menu,
.ds-footermenu .menu {
    margin-left: 0;
    padding-left: 0;
}

.ds-footer-menu .menu li,
.ds-footermenu .menu li {
    list-style: none !important;
    padding: 0 !important;
    margin-bottom: 10px;
}

.ds-footer-menu .menu li:last-child,
.ds-footermenu .menu li:last-child {
    margin-bottom: 0;
}

.ds-footer-menu .menu a,
.ds-footermenu a {
    color: #000 !important;
    font-weight: bold !important;
    display: inline-block !important;
    transition: all 0.3s ease !important;
    transform-origin: center center !important;
    padding-bottom: 10px !important;
    font-size: 18px !important;
}

.ds-footer-menu .menu a {
    text-transform: uppercase !important;
    text-shadow: 0 0 0 transparent !important;
}

.ds-footermenu a {
    font-weight: 600 !important;
    font-size: 17px !important;
}

/* Osnovni stil za footer linkove */
.ds-footer-menu .menu a,
.ds-footermenu a,
.ds-footer-digitalnisvemirhoverzoom a {
    position: relative;
    display: inline-block;
    text-decoration: none;
}

/* Kreiramo pseudo-element za underline */
.ds-footer-menu .menu a::after,
.ds-footermenu a::after,
.ds-footer-digitalnisvemirhoverzoom a::after {
    content: "";
    position: absolute;
    bottom: -4px; /* udaljenost underline-a od teksta, prilagodi po dizajnu */
    left: 0;
    width: 100%;
    border-top: 2px solid #000; /* boja underline-a (možeš staviti varijablu ili custom boju) */
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.3s ease-out, border-color 0.3s ease-out;
}

/* Hover state - aktiviramo underline */
.ds-footer-menu .menu a:hover::after,
.ds-footermenu a:hover::after,
.ds-footer-digitalnisvemirhoverzoom a:hover::after {
    transform: scaleX(1);
}


/* ========================================
   FORMS
   ======================================== */
input[type=text],
body[data-form-style="minimal"] input[type="text"] {
    padding: 2px 10px !important;
    padding-right: 40px !important;
    font-size: 18px;
    font-weight: 600;
    color: #000 !important;
    font-family: 'Barlow', sans-serif;
}

/* ========================================
   ANSAMBL SINGLE PAGE
   ======================================== */
.ansambl-single-wrapper {
    width: 100%;
}

.ansambl-single-container {
    max-width: 1570px;
    margin: 0 auto;
    padding: 0 90px;
}

.ansambl-title {
    font-size: 50px;
    font-weight: 700;
    padding: 6% 0;
    margin: 0;
    text-align: left;
    line-height: 1.2;
    letter-spacing: 0;
}

.ansambl-content-grid {
    display: grid;
    grid-template-columns: 40% 60%;
    gap: 70px;
    margin-bottom: 60px;
}

.ansambl-image-col {
    width: 100%;
}

.ansambl-featured-image {
    width: 100%;
    height: auto;
    display: block;
}

/* Ansambl Tabs */
.ansambl-tabs {
    width: 100%;
}

.ansambl-tab-buttons {
    display: flex;
    margin-bottom: 50px;
}

/* postavi varijablu za horizontalni padding da sve bude sinkro */
.ansambl-tab-buttons { --tab-pad-x: 30px; }

.ansambl-tab-button {
    background: none;
    border: none;
    padding: 10px var(--tab-pad-x) 20px var(--tab-pad-x);
    font-size: 20px;
    font-family: "Barlow";
    letter-spacing: 0.3px;
    cursor: pointer;
    position: relative;
    transition: color 0.35s ease;
    color: #000;
    font-weight: 600 !important;
    display: inline-block;
}

.ansambl-tab-button:first-child {
    padding-left: 0;
}

/* HOVER underline – širina točno kao tekst (bez paddinga) */
.ansambl-tab-button:not(.active)::after {
    content: "";
    position: absolute;
    bottom: 10px;               /* prilagodi po želji */
    left: var(--tab-pad-x);    /* sužavanje za padding */
    right: var(--tab-pad-x);
    border-top: 2px solid #000;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .3s ease-out, border-color .3s ease-out;
}

/* prvi tab nema lijevi padding, pa i crta kreće od ruba */
.ansambl-tab-button:first-child:not(.active)::after {
    left: 0;
}

.ansambl-tab-button:not(.active):hover::after {
    transform: scaleX(1);
}

/* ACTIVE ostaje kako si imao */
.ansambl-tab-button.active {
    color: #000;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 10px;
}






.ansambl-tab-content {
    display: none;
    animation: fadeIn 0.3s ease;
}

.ansambl-tab-content.active {
    display: block;
}

/* Ansambl Content Sections */
.ansambl-biography {
    font-size: 18px;
    line-height: 1.6;
}

.ansambl-biography p {
    margin-bottom: 0.2em;
}

.ansambl-predstave-list {
    margin-top: 20px;
}

.ansambl-predstava-item {
    padding: 20px 0;
    border-bottom: 1px solid #eee;
}

.ansambl-predstava-item:last-child {
    border-bottom: none;
}

.ansambl-predstava-title {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 0 0;
    line-height: 1.1;
    margin-bottom: 14px;
}

.ansambl-predstava-title a {
    color: #000;
    text-decoration: none;
    transition: color 0.3s ease;
}

.ansambl-predstava-title a:hover {
    color: #000;
    text-decoration: underline;
}

.ansambl-predstava-role {
    font-size: 16px;
    color: #000;
    margin: 0;
    padding-bottom: 0px;
    margin-top: -8px;
}

.ansambl-awards {
    font-size: 18px;
    line-height: 1.6;
}

/* TV & Film Section */
.ansambl-tv-film-section {
    background-color: #f5f5f5;
    padding: 80px 0 60px 0;
    margin-top: 80px;
}

.ansambl-section-title {
    font-size: 26px;
    font-weight: 700;
    text-align: left;
    margin: 0 0 40px 0;
    text-transform: uppercase;
}

.ansambl-tv-film-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.ansambl-tv-film-grid p {
    padding-bottom: 0px;
}

.ansambl-tv-film-grid ul {
    margin-left: 20px;
}

.ansambl-tv-film-grid ul li {
    padding-bottom: 16px !important;
    line-height: 1.3;
}

.ansambl-column-title {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 20px 0;
    text-transform: uppercase;
}

.ansambl-column-content {
    font-size: 18px;
    line-height: 1.6;
}

.ansambl-column-content p,
.ansambl-column-content ul,
.ansambl-column-content ol {
    margin-bottom: 1em;
}

/* ========================================
   CAROUSELS
   ======================================== */
/* Predstave Carousel */
.predstave-carousel-section {
    padding: 120px 0;
    overflow-x: hidden;
}

.predstave-carousel-title {
    font-size: 42px;
    font-weight: 700;
    text-align: center;
    margin: 0 0 70px 0;
    line-height: 1.4;
    text-transform: uppercase;
}

.predstave-carousel-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0px;
    overflow: hidden;
}

.predstave-carousel-wrapper.no-carousel {
    justify-content: center;
}

.predstave-carousel-wrapper.no-carousel .predstave-carousel-track {
    justify-content: center;
}

.predstave-carousel-wrapper.no-carousel .predstave-carousel-item {
    flex: 0 0 auto;
    width: 100%;
    max-width: 400px;
}

.predstave-carousel {
    overflow: hidden;
    flex: 1;
    width: 100%;
}

.predstave-carousel-track {
    display: flex;
    gap: 20px;
    transition: transform 0.3s ease;
    width: fit-content;
}

.predstave-carousel-item {
    flex: 0 0 calc(33.333% - 14px);
}

.predstave-carousel-link {
    display: block;
    text-decoration: none;
    color: #000;
}

.predstave-carousel-image {
    position: relative;
    overflow: hidden;
    height: 440px;
    background-color: #f0f0f0;
}

.predstave-carousel-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.predstave-carousel-placeholder {
    width: 100%;
    height: 100%;
    background-color: #ddd;
}

.predstave-carousel-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    padding: 20px;
}

.predstave-carousel-link:hover .predstave-carousel-overlay {
    opacity: 1;
}

.predstave-carousel-name {
    font-family: 'Brule', sans-serif;
    font-size: 28px;
    font-weight: 600;
    color: #fff;
    margin: 0;
    text-align: center;
    line-height: 1.2;
}

.predstave-carousel-nav {
    display: none !important;
}

/* ========================================
   PAGINATION DOTS
   ======================================== */
.predstave-carousel-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-top: 24px;
    min-height: 20px;
    width: 100%;
}

.predstave-carousel-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ccc;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: all 0.3s ease;
}

.predstave-carousel-dot:hover {
    background-color: #999;
}

.predstave-carousel-dot.active {
    background-color: #000;
    width: 40px;
    height: 8px;
    border-radius: 20px;
}

/* ========================================
   DOTS VISIBILITY RULES
   ======================================== */

/* Sakrij dots kada je statični prikaz */
.predstave-carousel-wrapper.carousel-static .predstave-carousel-dots {
    display: none !important;
}

.predstave-carousel-wrapper:not(.carousel-active) .predstave-carousel-dots {
    display: none !important;
}

/* Sakrij dots na desktopu (>1024px) ako nema dovoljno itema */
@media only screen and (min-width: 1025px) {
    .predstave-carousel-dots[data-show-desktop="false"] {
        display: none !important;
    }
}

/* Sakrij dots na tabletu (769-1024px) ako nema dovoljno itema */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
    .predstave-carousel-dots[data-show-tablet="false"] {
        display: none !important;
    }
}

/* Sakrij dots na mobitelu (<=768px) ako nema dovoljno itema */
@media only screen and (max-width: 768px) {
    .predstave-carousel-dots[data-show-mobile="false"] {
        display: none !important;
    }
}

/* ========================================
   RESPONSIVE
   ======================================== */

/* Desktop (1025px+) - 3 itema po redu */
@media only screen and (min-width: 1025px) {
    .predstave-carousel-item {
        flex: 0 0 calc(33.333% - 14px);
    }

    .predstave-carousel-title {
        font-size: 42px;
    }
}

/* Tablet (769px - 1024px) - 2 itema po redu */
@media only screen and (min-width: 769px) and (max-width: 1024px) {
    .predstave-carousel-item {
        flex: 0 0 calc(50% - 10px);
    }

    .predstave-carousel-title {
        font-size: 36px;
    }
}

/* Mobile (≤768px) - 1 item, puna širina */
@media only screen and (max-width: 768px) {
    /* Section */
    .predstave-carousel-section {
        overflow-x: hidden;
        width: 100% !important;
    }

    /* Title */
    .predstave-carousel-title {
        font-size: 32px;
        margin-bottom: 40px;
        position: relative;
        z-index: 1;
        padding: 0 20px;
    }

    /* Wrapper - puna širina ekrana */
.predstave-carousel-wrapper {
    width: 100%;
    overflow: hidden;
}

    /* Carousel */
    .predstave-carousel {
        overflow: hidden !important;
        width: 100% !important;
    }

    /* Track - bez gapa */
.predstave-carousel-track {
    display: flex !important;
    gap: 0 !important;
    width: 100% !important;
    transition: transform 0.5s ease!important;
}

    /* Item - puna širina viewport */
.predstave-carousel-item {
    flex: 0 0 100% !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
}

    /* Image container */
    .predstave-carousel-image {
        width: 102%;
            height: 320px;
    }


.predstave-carousel-section {
    padding: 30px 0 80px 0;
}

    /* Name */
    .predstave-carousel-name {
        font-size: 20px;
    }

    /* Disable hover na mobitelu */
    .predstave-carousel-link:hover .predstave-carousel-overlay {
        opacity: 0;
    }
}

/* Very small mobile (≤400px) */
@media only screen and (max-width: 400px) {
    .predstave-carousel-title {
        font-size: 26px;
        letter-spacing: 0.5px;
    }
}


/* Ansambl Carousel */
.ansambl-carousel-section {
    padding: 60px 0 110px 0;
    background-color: #fff;
}

.ansambl-carousel-title {
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    margin: 0 0 70px 0;
    text-transform: uppercase;
}

.ansambl-carousel-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
}

.ansambl-carousel {
    overflow: hidden;
    flex: 1;
}

.ansambl-carousel-track {
    display: flex;
    gap: 20px;
    transition: transform 0.3s ease;
}

.ansambl-carousel-item {
    flex: 0 0 calc(20% - 16px);
}

.ansambl-carousel-link {
    display: block;
    text-decoration: none;
}

.ansambl-carousel-image {
    position: relative;
    width: 100%;
    padding-bottom: 100%;
    border-radius: 50%;
    overflow: hidden;
    background-color: #f5f5f5;
}

.ansambl-carousel-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ansambl-carousel-placeholder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ddd;
}

.ansambl-carousel-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
    padding: 20px;
}

.ansambl-carousel-name {
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    margin: 0;
    line-height: 1.2;
}

.ansambl-carousel-link:hover .ansambl-carousel-overlay {
    opacity: 1;
}

.ansambl-carousel-nav {
    background: none;
    border: none;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
    padding: 0;
}

.ansambl-carousel-nav:hover:not(:disabled) {
    transform: scale(1.1);
}

.ansambl-carousel-nav:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.ansambl-carousel-nav svg {
    width: 36px;
    height: 36px;
    color: #000;
}

/* ========================================
   WPB TABS CUSTOMIZATION
   ======================================== */
.wpb_wrapper.tabbed {
    width: 100%;
}

.wpb_wrapper.tabbed .wpb_tabs_nav {
    display: flex !important;
    margin-bottom: 5vw !important;
    border: none !important;
    padding: 0 !important;
    position: relative;
    flex-wrap: nowrap;
    gap: 0;
}

.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a {
    background: none !important;
    border: none !important;
    padding: 10px 30px 20px 30px !important;
    font-size: 20px;
    font-family: "Barlow";
    letter-spacing: 0.3px;
    cursor: pointer;
    position: relative !important;
    transition: transform 0.35s ease, color 0.35s ease !important;
    transform-origin: center center !important;
    color: #000 !important;
    font-weight: 600 !important;
    display: inline-block !important;
    text-decoration: none !important;
    line-height: 1.2 !important;
}

.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item:first-child a {
    padding-left: 0 !important;
}






/* Postojeći elementi trebaju position relative i inline-block */

/* Postojeći elementi */
.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a {
    transition: transform 0.2s ease !important;
}

/* Span treba position relative */
.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a span {
    position: relative !important;
}

/* Linija na span elementu */
.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a:not(.active-tab) span::after {
    content: '';
    position: absolute;
    bottom: -8px; /* Prilagodi ovo */
    left: 0;
    width: 0;
    height: 2px;
    background-color: #000;
    transition: width 0.4s ease;
}

/* Hover */
.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a:not(.active-tab):hover {
    color: #000 !important;
}

.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a:not(.active-tab):hover span::after {
    width: 100%;
}


a:hover {
    cursor: pointer !important;
}

.wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a.active-tab {
    color: #000 !important;
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 10px !important;
}

.wpb_wrapper.tabbed .wpb_tabs_nav .magic-line {
    display: none !important;
}

.wpb_wrapper.tabbed .wpb_tab {
    display: none;
    animation: fadeIn 0.3s ease !important;
}

.wpb_wrapper.tabbed .wpb_tab.visible-tab {
    display: block !important;
}

.wpb_tab .bold,
.wpb_tab strong,
.wpb_tab b {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 900 !important;
    font-size: 18px !important;
    letter-spacing: 0.5px;
}

.ds-tabs-p p {
    line-height: 2.5;
}

.wpb_row .ds-tabscjenik {
    margin-bottom: 0px !important;
}

/* ========================================
   RELATED POSTS
   ======================================== */
body .related-posts[data-style=material] .inner-wrap {
    box-shadow: none !important;
    border-radius: 0 !important;
    background: #fff !important;
}

.related-post-wrap h3.related-title:not(.nectar-blog-single-section-title) {
    margin-bottom: 30px;
    font-family: "Barlow", sans-serif !important;
}

.related-posts[data-style=material] .meta-category {
    display: none !important;
}

.masonry.material .masonry-blog-item .article-content-wrap,
.related-posts[data-style=material] .article-content-wrap {
    padding: 25px !important;
}

.blog-recent.related-posts h3.title {
    font-family: "Barlow", sans-serif !important;
    font-weight: 600 !important;
    font-size: 24px !important;
    line-height: 1.3 !important;
    margin-bottom: 20px !important;
}

body .blog-recent[data-style].columns-1 div:nth-child(1n+1),
body .blog-recent[data-style].columns-2 div:nth-child(2n+2),
body .blog-recent[data-style].columns-3 div:nth-child(3n+3),
body .blog-recent[data-style].columns-4 div:nth-child(4n+4) {
    line-height: 1.3;
}

.related-posts[data-style=material] .grav-wrap {
    left: 25px;
}

/* ========================================
   UVJETI PRODAJE STYLES
   ======================================== */
.ds-uvjeti-prodaje {
    color: #000;
    line-height: 1.4;
}

.ds-uvjeti-prodaje h1 {
    font-size: 28px !important;
    font-weight: 800;
    text-transform: uppercase;
    margin-top: 0;
    letter-spacing: 0.3px;
}

.ds-uvjeti-prodaje h2 {
    font-size: 28px !important;
    font-weight: 800;
    text-transform: uppercase;
    margin-top: 50px;
    margin-bottom: 22px;
    letter-spacing: 0.3px;
    line-height: 1.3;
}

.ds-uvjeti-prodaje h3 {
    font-size: 23px !important;
    font-weight: 600;
    margin-top: 0 !important;
    margin-bottom: 15px;
    text-transform: none;
    letter-spacing: 0.7px !important;
}

.ds-uvjeti-prodaje p {
    font-size: 18px;
    padding-bottom: 0px;
    line-height: 1.7;
    margin: 10px 0;
}

.ds-uvjeti-prodaje ul {
    margin: 12px 0;
    padding-left: 30px;
    list-style-type: disc;
}

.ds-uvjeti-prodaje ul li {
    font-size: 18px;
    margin-bottom: 6px;
    line-height: 1.5;
}

.ds-uvjeti-prodaje .sub-list {
    margin-left: 25px;
    margin-top: 8px;
    list-style-type: circle;
}

.ds-uvjeti-prodaje .sub-list li {
    margin-bottom: 6px;
    font-size: 18px;
}

.ds-uvjeti-prodaje a {
    color: #000;
    text-decoration: underline;
    font-size: 18px;
    display: inline-block;
    transition: transform 0.3s ease;
}

.ds-uvjeti-prodaje a:hover {
    transform: scale(1.03);
}

.ds-uvjeti-prodaje strong {
    font-weight: 600;
}

.ds-uvjeti-prodaje .important-notice {
    margin-top: 20px;
    margin-bottom: 20px;
}

.ds-uvjeti-prodaje .important-notice strong {
    font-size: 18px;
    font-weight: 700;
}

.ds-uvjeti-prodaje .section {
    margin-bottom: 35px;
}

.ds-uvjeti-prodaje .subsection {
    margin-bottom: 25px;
}

.ds-uvjeti-prodaje .section:first-of-type h3:first-child {
    margin-top: 0;
}

.ds-uvjeti-prodaje h2 + p {
    margin-top: 0;
}

/* Sjednice Kazalisnog Vijeca */
.ds-sjednice-kazalisnog-vijeca .ds-uvjeti-prodaje h2 {
    margin-top: 70px;
    margin-bottom: 20px;
}

.ds-sjednice-kazalisnog-vijeca .ds-uvjeti-prodaje .section p {
    margin-bottom: 16px;
}

/* ========================================
   GENERAL LINKS
   ======================================== */
.wpb_wrapper a[href^="mailto:"],
.wpb_wrapper p a {
    color: #000000 !important;
    text-decoration: underline !important;
    text-decoration-thickness: 1px !important;
    text-underline-offset: 3px !important;
    transition: transform 0.3s ease, text-decoration-thickness 0.3s ease !important;
    display: inline-block !important;
    transform-origin: center center !important;
    letter-spacing: 0.3px;
}

.wpb_wrapper a[href^="mailto:"]:hover,
.wpb_wrapper p a:hover {
    transform: scale(1.03) !important;
    text-decoration-thickness: 2px !important;
    color: #000000 !important;
}

/* ========================================
   ANIMATIONS
   ======================================== */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========================================
   DESKTOP MEDIA QUERIES (1000px+)
   ======================================== */
@media only screen and (min-width: 1000px) {
    body #header-outer .icon-salient-search:before,
    body.material #header-outer .icon-salient-search:before {
        font-size: 32px;
    }



a.ds-btn-buy {
    margin-left: 1px;
}

a.btn-buy {
    margin-left: 1px;
}


    .slide-out-widget-area-toggle > div {
        transform: scale(1.4) !important;
    }

    .ds-footermenu {
        display: flex !important;
        justify-content: flex-end !important;
    }

    .ds-footermenu .menu {
        display: flex !important;
    }

    .ds-footermenu .menu li {
        margin-right: 26px !important;
    }

    .ds-footermenu .menu li:last-child {
        margin-right: 0 !important;
    }

    .ansambl-carousel-wrapper {
        width: 110%;
        margin-left: -5%;
    }

    body.material #header-outer:not([data-format=left-header]) #top nav>.buttons>li {
        margin: 0 36px;
    }

    #search-outer #search #close {
        margin-top: -20px;
    }

    .side-widget-open nav > ul:not(.buttons) {
        display: none !important;
    }

}

#slide-out-widget-area .inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto !important;
    min-height: 100vh; /* Koristiti punu visinu ekrana */
    padding: 0; /* Ukloniti postojeći padding */
}

@supports (min-height: 100dvh) {
    #slide-out-widget-area .inner {
        min-height: 100dvh;
    }
}



#search-btn, .mobile-search {
    opacity: 1 !important;
    visibility: visible !important;
    transition: opacity 0.4s ease !important;
}

/* Kada je canvas otvoren - desktop i mobilni */
#header-outer.side-widget-open #search-btn,
#header-outer.side-widget-open .mobile-search,
body.side-widget-open #search-btn,
body.side-widget-open .mobile-search {
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.2s ease !important;
}


/* Ako postoji padding-top koji se dodaje inline, možeš ga overridati */
#slide-out-widget-area .inner-wrap {
    padding-top: 0 !important;
    min-height: 100vh;
}

@supports (min-height: 100dvh) {
    #slide-out-widget-area .inner-wrap {
        min-height: 100dvh;
    }
}

/* Centrirati stavke menija */
#slide-out-widget-area .off-canvas-menu-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0 6% !important;
}




/* ========================================
   TABLET/MOBILE MEDIA QUERIES (999px-)
   ======================================== */
@media only screen and (max-width: 1200px) {
    .ansambl-carousel-item {
        flex: 0 0 calc(33.333% - 14px);
    }
}

@media only screen and (max-width: 999px) {
    .slide-out-widget-area-toggle > div {
        transform: scale(1.3) !important;
        margin-top: -10px;

    }

@media only screen and (max-width: 690px) {
    body .row #error-404 h1, body #ajax-content-wrap #error-404 h1 {
        margin-top: 100px;
    }
}



    .related-posts[data-style=material] .post-featured-img img {
        width: 100% !important;
    }

a.ds-btn-buy {
    margin-left: 2px;
}



#slide-out-widget-area.fullscreen-alt .inner .off-canvas-menu-container .menu li, #slide-out-widget-area.fullscreen-alt .menuwrapper li {
    margin: 0 0 0px 0;
}




body #slide-out-widget-area.fullscreen-alt .inner .off-canvas-menu-container li a {
        line-height: 16px !important;
        font-size: 26px !important;
    }

    #header-outer .mobile-search .icon-salient-search {
        font-size: 22px !important;
    }

    .ansambl-single-container {
        max-width: 100% !important;
        padding: 0 22px !important;
    }

    .ascend .related-post-wrap h3.related-title,
    .material .related-post-wrap h3.related-title {
        padding-top: 15%;
    }

    body #slide-out-widget-area.fullscreen-alt .off-canvas-social-links {
        margin-top: 32px !important;
    }

    .material #search-outer #search #close a span {
        font-size: 25px !important;
        height: 25px !important;
        line-height: 25px !important;
        top: 6px;
        overflow: visible !important;
    }

    body.material #search-outer #search form input[type="text"][name] {
        font-size: 24px !important;
    }

    .material #search-outer #search,
    .material #header-outer #search-outer #search {
        padding: 60px 0px 80px 0px;
    }

    #slide-out-widget-area .off-canvas-social-links {
        justify-content: center !important;
    }

    #slide-out-widget-area .off-canvas-menu-container.mobile-only {
        display: none !important;
    }

    /* WPB Tabs Mobile */
    .wpb_tab .wpb_column:not([class*=vc_col-xs]) {
        margin-bottom: 0px;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav {
        border: none !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 0 !important;
        margin-bottom: 30px !important;
    }

    .wpb_tab .wpb_text_column p strong {
        display: block !important;
        margin-bottom: -10px !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav::before,
    .wpb_wrapper.tabbed .wpb_tabs_nav::after,
    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a::before {
        display: none !important;
        content: none !important;
    }

    .wpb_wrapper.tabbed[data-style*="minimal"] .wpb_tabs_nav,
    .wpb_wrapper.tabbed[data-style*="minimal"] .wpb_tabs_nav .tab-item a {
        border: 0 !important;
        box-shadow: none !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a {
        padding: 10px 20px 16px 20px !important;
        font-size: 17px !important;
        transform-origin: center center !important;
    }

    .tabbed[data-style*="minimal"][data-color-scheme="extra-color-1"] > ul li a:after {
        display: none !important;
    }

    /* Uvjeti prodaje mobile */
    .ds-uvjeti-prodaje h2 {
        font-size: 24px !important;
        font-weight: 800;
        line-height: 1.3;
    }

    .ds-uvjeti-prodaje .sub-list {
        margin-left: 0px;
        margin-top: 8px;
        list-style-type: circle;
    }

    .ds-uvjeti-prodaje h3 {
        padding-bottom: 0px !important;
        margin-top: 20px !important;
        margin-bottom: 15px;
    }
}

@media only screen and (max-width: 968px) {
    .ansambl-content-grid {
        grid-template-columns: 1fr;
    }

    .ansambl-tv-film-grid {
        grid-template-columns: 1fr;
    }

    .ansambl-tab-button {
        padding: 12px 20px;
        font-size: 17px;
    }

    .predstave-carousel-item {
        flex: 0 0 calc(50% - 10px);
    }
}

@media only screen and (max-width: 768px) {
    /* Ansambl Carousel Mobile */
    .ansambl-carousel-wrapper {
        position: relative;
        padding: 0 50px;
    }

    .ansambl-carousel {
        overflow: hidden;
        width: 100%;
    }

    .ansambl-carousel-track {
        display: flex;
        align-items: center;
        transition: transform 0.3s ease;
        gap: 0 !important;
    }

    .ansambl-carousel-item {
        flex: 0 0 100%;
        opacity: 1;
        display: block !important;
    }

    .ansambl-carousel-link {
        display: block;
        width: 90%;
        margin: 0 auto;
    }

    .ansambl-carousel-nav {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        width: 40px;
        height: 40px;
        z-index: 10;
    }

    .ansambl-carousel-prev {
        left: 0;
    }

    .ansambl-carousel-next {
        right: 0;
    }

    .ansambl-carousel-nav svg,
    .ansambl-carousel-nav img {
        width: 30px;
        height: 30px;
    }

    .ansambl-carousel-title,
    .predstave-carousel-title {
        font-size: 24px;
        margin-bottom: 30px;
    }

    .ansambl-carousel-overlay {
        opacity: 1;
    }

    .ansambl-carousel-name {
        font-size: 20px !important;
        padding: 0 40px;
        transform: translateY(0);
        opacity: 1;
    }

    .ansambl-tv-film-grid {
        gap: 14px !important;
    }
}

@media only screen and (max-width: 600px) {
    .ansambl-title {
        font-size: 32px;
        padding: 8% 0;
    }

    .ansambl-content-grid {
        gap: 40px;
    }

    .ansambl-tab-buttons {
        flex-direction: column;
    }

    .ansambl-tab-button {
        width: 100%;
        text-align: left;
        padding: 15px;
        margin-bottom: -10px !important;
        position: relative; /* DODANO */
    }

    .ansambl-tab-button:first-child {
        padding-left: 15px;
    }

    /* ISPRAVLJENO - ukloni ::after za sve buttone po defaultu */
    .ansambl-tab-button::after {
        display: none !important;
    }

    /* Active state - vertikalna linija SAMO za active tab */
    .ansambl-tab-button.active {
        text-decoration: none;
        position: relative;
        padding-left: 20px;
    }

    .ansambl-tab-button.active::after {
        content: '';
        display: block !important; /* Force display samo za active */
        position: absolute;
        width: 3px;
        height: 50%;
        background-color: #000;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
    }

    /* Ukloni tap highlight */
    .ansambl-tab-button {
        -webkit-tap-highlight-color: transparent;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        user-select: none;
    }

    .ansambl-section-title {
        font-size: 24px;
    }

    .predstave-carousel-item {
        flex: 0 0 100%;
    }

    .predstave-carousel-name {
        font-size: 40px;
    }

    .predstave-carousel-overlay {
        opacity: 1;
    }

    .predstave-carousel-dots[data-show-mobile="false"] {
        display: none;
    }

    /* WPB Tabs Mobile Column Layout */
    .wpb_wrapper.tabbed .wpb_tabs_nav {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0 !important;
        margin-bottom: 50px !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a.active-tab {
        color: #000 !important;
        text-decoration: none !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item {
        margin-bottom: -10px !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a {
        width: 100% !important;
        text-align: left !important;
        padding: 15px !important;
        border: 0 !important;
        box-shadow: none !important;
        position: relative !important;
        text-decoration: none !important;
        transform: none !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item:first-child a {
        padding-left: 15px !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a.active-tab {
        padding-left: 234x !important;
    }

    .wpb_wrapper.tabbed .wpb_tabs_nav .tab-item a.active-tab::after {
        content: '' !important;
        position: absolute !important;
        width: 3px !important;
        height: 54% !important;
        background-color: #000 !important;
        left: 0 !important;
        top: 54% !important;
        transform: translateY(-50%) !important;
        display: block !important;
    }

    /* Predstave carousel mobile only */
    .predstave-carousel-item,
    .ds_ansambl-carousel-item {
        opacity: 1 !important;
        transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    }
}

@media only screen and (max-width: 480px) {
    .ansambl-carousel-wrapper {
        padding: 0 40px;
    }

    .predstave-carousel-wrapper {
        gap: 0px;
        width: 118%;
        margin-left: -9% !important;
    }

    .ansambl-carousel-track,
    .predstave-carousel-track {
        gap: 15px;
    }
}

/* Predstave Carousel Fade Effect - Desktop/Tablet Only */
@media only screen and (min-width: 601px) {
    .predstave-carousel-item {
        opacity: 1;
        transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    opacity 0.3s ease-out;
    }

    .is-transitioning .predstave-carousel-item {
        transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    opacity 0.2s ease-out;
    }

    .predstave-carousel-dots[data-show-desktop="false"] {
        display: none;
    }
}


.search-post-item .post-featured-img {
    background-size: contain !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}




.dani_satire-template-default .main-content{
    padding-bottom: clamp(60px, 10vw, 100px) !important;
    padding-top: clamp(10px, 10vw, 120px) !important;
}


/* CPT dani satire*/

/* ========================================
   iOS Safe Area Fix - Off-canvas menu
   Problem: Na iOS-u, status bar (gore) i home indicator (dolje)
   nasljeđuju boju od html/body elementa, ne od overlay-a.
   Rješenje: Postaviti html/body pozadinu na crvenu kada je menu otvoren.
   ======================================== */

/* iOS Safari - html i body element (za status bar i home indicator) */
/* Klasu ocm-open dodaje JavaScript kad se otvori menu */
/* VAŽNO: viewport-fit=cover mora biti u meta tagu! */
html.ocm-open,
body.material-ocm-open {
    background-color: #CA162B !important;
}

/* iOS Safari Scroll Lock */
body.ios-scroll-locked {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
    touch-action: none;
    -webkit-overflow-scrolling: none;
    overscroll-behavior: none;
}
html.ios-scroll-locked {
    overflow: hidden !important;
}

/* ========================================
   FIX: Off-canvas menu za Dani satire stranice
   Forsira istu crvenu pozadinu i bijele elemente kao na ostalim stranicama
   Problem: Dani satire stranice nemaju transparent header pa Salient koristi bijelu pozadinu
   ======================================== */

/* POZADINA - crvena za sve off-canvas elemente */
body.dani_satire-template-default #slide-out-widget-area-bg,
body.dani_satire-template-default #slide-out-widget-area-bg.fullscreen-alt,
body.dani_satire-template-default #slide-out-widget-area-bg.fullscreen-alt .bg-inner,
body.dani_satire-template-default #slide-out-widget-area-bg.fullscreen,
body.dani_satire-template-default #slide-out-widget-area,
body.dani_satire-template-default.material #slide-out-widget-area-bg.slide-out-from-right {
    background-color: #CA162B !important;
    background: #CA162B !important;
}

/* HEADER WRAPPER u off-canvas - crvena pozadina */
/* VAŽNO: .side-widget-open se dodaje na #header-outer, NE na body! */
/* .ocm-closing drži crvenu pozadinu još 0.5s nakon zatvaranja */
body.dani_satire-template-default #header-outer.side-widget-open,
body.dani_satire-template-default #header-outer.ocm-closing,
body.dani_satire-template-default.material-ocm-open #header-outer {
    background-color: #CA162B !important;
}

/* LOGO - bijeli kada je off-canvas otvoren */
body.dani_satire-template-default #header-outer.side-widget-open #logo img,
body.dani_satire-template-default #header-outer.ocm-closing #logo img,
body.dani_satire-template-default.material-ocm-open #header-outer #logo img {
    filter: brightness(0) invert(1) !important;
}

/* Bijeli tekst i linkovi */
body.dani_satire-template-default #slide-out-widget-area,
body.dani_satire-template-default #slide-out-widget-area a,
body.dani_satire-template-default #slide-out-widget-area .off-canvas-menu-container li a,
body.dani_satire-template-default #slide-out-widget-area .menu li a,
body.dani_satire-template-default #slide-out-widget-area .widget a {
    color: #fff !important;
}

/* X gumb (hamburger) - bijeli SAMO kada je meni otvoren */
/* VAŽNO: .side-widget-open se dodaje na #header-outer, NE na body! */
/* .ocm-closing je prijelazna klasa koja drži bijele ikone još 0.5s nakon zatvaranja */
body.dani_satire-template-default #header-outer.side-widget-open:not(.transparent) .slide-out-widget-area-toggle #hamburger g,
body.dani_satire-template-default #header-outer.side-widget-open .slide-out-widget-area-toggle #hamburger g,
body.dani_satire-template-default #header-outer.ocm-closing .slide-out-widget-area-toggle #hamburger g,
body.dani_satire-template-default.material-ocm-open .slide-out-widget-area-toggle #hamburger g,
body.dani_satire-template-default .slide-out-widget-area-toggle a.open #hamburger g {
    stroke: #fff !important;
}

/* Close linije - bijele SAMO kada je meni otvoren */
/* VAŽNO: .side-widget-open se dodaje na #header-outer, NE na body! */
body.dani_satire-template-default #header-outer.side-widget-open:not(.transparent) .slide-out-widget-area-toggle .close-line,
body.dani_satire-template-default #header-outer.side-widget-open .slide-out-widget-area-toggle .close-line,
body.dani_satire-template-default #header-outer.side-widget-open .slide-out-widget-area-toggle a .close-line,
body.dani_satire-template-default #header-outer.ocm-closing .slide-out-widget-area-toggle .close-line,
body.dani_satire-template-default #header-outer.ocm-closing .slide-out-widget-area-toggle a .close-line,
body.dani_satire-template-default.material-ocm-open .slide-out-widget-area-toggle .close-line,
body.dani_satire-template-default #slide-out-widget-area .slide_out_area_close .close-line {
    background-color: #fff !important;
}

/* Bijeli close icon */
body.dani_satire-template-default #slide-out-widget-area .slide_out_area_close .icon-default-style {
    color: #fff !important;
}

/* Social links bijeli */
body.dani_satire-template-default #slide-out-widget-area .off-canvas-social-links a {
    color: #fff !important;
}

/* Lines button (hamburger lines) - bijele SAMO kada je meni otvoren */
/* VAŽNO: .side-widget-open se dodaje na #header-outer, NE na body! */
body.dani_satire-template-default #header-outer.side-widget-open .lines-button .lines,
body.dani_satire-template-default #header-outer.side-widget-open .lines-button .lines:before,
body.dani_satire-template-default #header-outer.side-widget-open .lines-button .lines:after,
body.dani_satire-template-default #header-outer.ocm-closing .lines-button .lines,
body.dani_satire-template-default #header-outer.ocm-closing .lines-button .lines:before,
body.dani_satire-template-default #header-outer.ocm-closing .lines-button .lines:after {
    background-color: #fff !important;
}

/* ========================================
   Search ikona - bijela kada je meni otvoren
   Override Salient's high-specificity selectors
   ======================================== */

/* Mobile search - maksimalna specifičnost za override Salient-a */
body.material.dani_satire-template-default #header-outer.side-widget-open:not([data-permanent-transparent="1"]) #top .mobile-search .nectar-icon.icon-salient-search,
body.material.dani_satire-template-default #header-outer.ocm-closing:not([data-permanent-transparent="1"]) #top .mobile-search .nectar-icon.icon-salient-search,
body.material.dani_satire-template-default #header-outer.side-widget-open #top .mobile-search .nectar-icon.icon-salient-search,
body.material.dani_satire-template-default #header-outer.ocm-closing #top .mobile-search .nectar-icon.icon-salient-search,
body.dani_satire-template-default #header-outer.side-widget-open:not([data-permanent-transparent="1"]) #top .mobile-search .nectar-icon.icon-salient-search,
body.dani_satire-template-default #header-outer.ocm-closing:not([data-permanent-transparent="1"]) #top .mobile-search .nectar-icon.icon-salient-search,
body.dani_satire-template-default #header-outer.side-widget-open #top .mobile-search .icon-salient-search,
body.dani_satire-template-default #header-outer.ocm-closing #top .mobile-search .icon-salient-search,
body.dani_satire-template-default #header-outer.side-widget-open .mobile-search .icon-salient-search,
body.dani_satire-template-default #header-outer.ocm-closing .mobile-search .icon-salient-search,
body.dani_satire-template-default #header-outer.side-widget-open .mobile-search .nectar-icon,
body.dani_satire-template-default #header-outer.ocm-closing .mobile-search .nectar-icon {
    color: #fff !important;
}

/* Desktop search button */
body.dani_satire-template-default #header-outer.side-widget-open #top nav ul #search-btn a span,
body.dani_satire-template-default #header-outer.ocm-closing #top nav ul #search-btn a span,
body.dani_satire-template-default #header-outer.side-widget-open #search-btn a span.icon-salient-search,
body.dani_satire-template-default #header-outer.ocm-closing #search-btn a span.icon-salient-search {
    color: #fff !important;
}

/* ========================================
   FADE TRANSITION za off-canvas menu
   Brza, glatka 200ms cubic-bezier animacija
   ======================================== */

/* Header pozadina - tranzicija samo za zatvaranje */
/* Otvaranje je instant, zatvaranje ima smooth fade */
body.dani_satire-template-default #header-outer {
    transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Kada se otvara - INSTANT promjena (bez tranzicije) */
body.dani_satire-template-default #header-outer.side-widget-open:not(.ocm-closing) {
    transition: none !important;
}

/* Kada se zatvara - smooth fade (sa tranzicijom) */
body.dani_satire-template-default #header-outer.ocm-closing,
body.dani_satire-template-default #header-outer.side-widget-closed {
    transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Logo - instant na otvaranje, smooth na zatvaranje */
body.dani_satire-template-default #header-outer #logo img {
    transition: filter 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
body.dani_satire-template-default #header-outer.side-widget-open:not(.ocm-closing) #logo img {
    transition: none !important;
}

/* Hamburger SVG stroke */
body.dani_satire-template-default #header-outer .slide-out-widget-area-toggle #hamburger g {
    transition: stroke 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
body.dani_satire-template-default #header-outer.side-widget-open:not(.ocm-closing) .slide-out-widget-area-toggle #hamburger g {
    transition: none !important;
}

/* Search ikona */
body.dani_satire-template-default #header-outer .mobile-search .nectar-icon,
body.dani_satire-template-default #header-outer .mobile-search .icon-salient-search,
body.dani_satire-template-default #header-outer #search-btn a span {
    transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
body.dani_satire-template-default #header-outer.side-widget-open:not(.ocm-closing) .mobile-search .nectar-icon,
body.dani_satire-template-default #header-outer.side-widget-open:not(.ocm-closing) .mobile-search .icon-salient-search,
body.dani_satire-template-default #header-outer.side-widget-open:not(.ocm-closing) #search-btn a span {
    transition: none !important;
}

/* Close lines */
body.dani_satire-template-default #header-outer .slide-out-widget-area-toggle .close-line {
    transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Hamburger lines */
body.dani_satire-template-default #header-outer .lines-button .lines,
body.dani_satire-template-default #header-outer .lines-button .lines:before,
body.dani_satire-template-default #header-outer .lines-button .lines:after {
    transition: background-color 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Desktop navigacija - ULAZNICE, RASPORED itd. */
body.dani_satire-template-default #header-outer #top nav > ul > li > a {
    transition: color 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
body.dani_satire-template-default #header-outer.side-widget-open:not(.ocm-closing) #top nav > ul > li > a {
    transition: none !important;
}

/* Desktop nav linkovi - bijeli kada je meni otvoren */
body.dani_satire-template-default #header-outer.side-widget-open #top nav > ul > li > a,
body.dani_satire-template-default #header-outer.ocm-closing #top nav > ul > li > a {
    color: #fff !important;
}

/* Desktop nav hidden class - sakrij nav za 500ms tijekom zatvaranja */
@media only screen and (min-width: 1000px) {
    body.dani_satire-template-default #header-outer #top nav.nav-hidden {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* Isključi tranzicije headera tijekom zatvaranja - desktop i mobile */
body.dani_satire-template-default #header-outer.ocm-closing {
    transition: none !important;
}
body.dani_satire-template-default #header-outer.ocm-closing #logo img {
    transition: none !important;
}
body.dani_satire-template-default #header-outer.ocm-closing .slide-out-widget-area-toggle #hamburger g {
    transition: none !important;
}
body.dani_satire-template-default #header-outer.ocm-closing .mobile-search .nectar-icon,
body.dani_satire-template-default #header-outer.ocm-closing .mobile-search .icon-salient-search {
    transition: none !important;
}
body.dani_satire-template-default #header-outer.ocm-closing .slide-out-widget-area-toggle .close-line {
    transition: none !important;
}
body.dani_satire-template-default #header-outer.ocm-closing .lines-button .lines,
body.dani_satire-template-default #header-outer.ocm-closing .lines-button .lines:before,
body.dani_satire-template-default #header-outer.ocm-closing .lines-button .lines:after {
    transition: none !important;
}
body.dani_satire-template-default #header-outer.ocm-closing #top nav > ul > li > a {
    transition: none !important;
}

@media only screen and (min-width: 1000px) {





.dani_satire-template-default .wpb_wrapper.tabbed .wpb_tab.visible-tab {
    display: block !important;
    width: 150%;
    z-index: 99999 !important;
}


}



.ds-dani-satire-header-txt {
    font-family: 'Brule', sans-serif;
    font-weight: 600 !important;
    letter-spacing: 3px;
    margin: 0 auto;
}


.ds-dani-satire-header-date p{
    letter-spacing: 8px !important;
}


.ds-dani-satire-main-page .wpb_wrapper.tabbed .wpb_tabs_nav {
    justify-content: center;
}









/* Skriveni tabovi - uvijek vidljivi inicijalno */
.wpb_tab.hidden-tab-visible-content {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    left: 0 !important;
}

/* Kada je neki drugi tab aktivan */
.wpb_wrapper.tabbed .wpb_tab {
    display: none !important;
}

.wpb_wrapper.tabbed .wpb_tab.visible-tab,
.wpb_wrapper.tabbed .wpb_tab.active-tab {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
}

/* Override Salient tema stilove */
.wpb_wrapper.tabbed .wpb_tab[style*="display: block"] {
    display: block !important;
}

/* Ukloni padding za skrivene tabove */
.tabbed .wpb_tab.hidden-tab-visible-content {
    padding-top: 0;
    margin-bottom: 20px;
}

.wpb_content_element .wpb_tabs_nav li.ui-tabs-active, .wpb_content_element .wpb_tabs_nav li:hover, .wpb_content_element.wpb_tabs .wpb_tour_tabs_wrapper .wpb_tab {
    background-color: transparent !important;
}


 .wpb_tab .wpb_content_element {
    margin-bottom: 0px;
}




.page-id-16091 .dskr-image img {
    object-fit: contain;
}

.page-id-16227 .dskr-image img {
    object-fit: contain;
}


.page-id-16225 .dskr-image img {
    object-fit: contain;
}


.page-id-16216 .dskr-image img {
    object-fit: contain;
}


.page-id-16205 .dskr-image img {
    object-fit: contain;
}


.page-id-16089 .dskr-image img {
    object-fit: contain;
}



.page-id-16071 .dskr-image img {
    object-fit: contain;
}



a img {
    display: block;
}


#page-header-bg[data-post-hs="default_minimal"] .inner-wrap > a:not(:hover) {
    display: none;
}


.ds-kerempuh-button-hover{
        transition: transform 0.3s ease, box-shadow 0.3s ease;
}


.ds-kerempuh-button-hover:hover{
      transform: scale(1.05);
}



.ds-full-width-section{
      width: 100% !important;
}


/* Full-width sekcija koja probija container */
.ds-full-width-section {
    width: calc(100vw - (100vw - 100%)) !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: calc(-50vw + (100vw - 100%) / 2) !important;
    margin-right: calc(-50vw + (100vw - 100%) / 2) !important;
    max-width: none !important;
}

/* Osiguravamo da inner row zadrži full width */
.ds-full-width-section .row_col_wrap_12_inner {
    max-width: none !important;
    width: 100% !important;
}

/* Opciono - ako želite da sadržaj unutra bude ograničen na određenu širinu */
.ds-full-width-section .row_col_wrap_12_inner > .wpb_column {
    max-width: 1200px; /* prilagodite prema potrebi */
    margin: 0 auto;
    padding: 0 15px; /* dodaje malo prostora sa strane na manjim ekranima */
}

/* Za mobile uređaje - sprječava horizontalni scroll */
@media (max-width: 768px) {
    body {
        overflow-x: hidden;
    }

    .ds-full-width-section {
        width: calc(100vw - (100vw - 100%)) !important;
        margin-left: calc(-50vw + (100vw - 100%) / 2) !important;
        margin-right: calc(-50vw + (100vw - 100%) / 2) !important;
        left: 50% !important;
        right: 50% !important;
    }
}


/* Full-width galerija - osnovno pozicioniranje */
.ds-full-width-galerija {
    width: calc(100vw - (100vw - 100%)) !important;
    position: relative !important;
    left: 50% !important;
    right: 50% !important;
    margin-left: calc(-50vw + (100vw - 100%) / 2) !important;
    margin-right: calc(-50vw + (100vw - 100%) / 2) !important;
    max-width: none !important;
}

/* Reset za sve child elemente galerije */
.ds-full-width-galerija > * {
    max-width: none !important;
    width: 100% !important;
}

/* Reset za inner row galerije */
.ds-full-width-galerija .row_col_wrap_12_inner {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Forsiraj punu širinu za kolonu galerije */
.ds-full-width-galerija .wpb_column.vc_col-sm-12 {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

/* Reset za wrapper elemente galerije */
.ds-full-width-galerija .vc_column-inner,
.ds-full-width-galerija .wpb_wrapper {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Galerija komponente full width */
.ds-full-width-galerija .wpb_gallery,
.ds-full-width-galerija .wpb_gallery_slidesflickity_static_height_style,
.ds-full-width-galerija .nectar-flickity {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Viewport galerije */
.ds-full-width-galerija .nectar-flickity .flickity-viewport {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
}

/* Child kolone u galeriji */
.ds-full-width-galerija .child_column {
    float: none !important;
    clear: both !important;
    display: block !important;
    width: 100% !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
}


.nectar-flickity[data-controls*=arrows_overlaid] .next:after, .nectar-flickity[data-controls*=arrows_overlaid] .previous:after{
    background-color: transparent !important;
}




/* Pozicioniranje strelica u gornjem desnom kutu */
.ds-full-width-galerija .flickity-prev-next-button {
    top: -17% !important;
    transform: translateY(0) !important;
    width: 26px !important;
    height: 26px !important;
    background: transparent !important;
    border: none !important;
    transition: transform 0.3s ease !important;
}

/* Lijeva strelica (previous) - pozicija - POVEĆAN RAZMAK */
.ds-full-width-galerija .flickity-prev-next-button.previous {
    left: auto !important;
    right: 110px !important;
}

/* Desna strelica (next) - pozicija */
.ds-full-width-galerija .flickity-prev-next-button.next {
    right: 50px !important;
}

/* Uklanja ::before pseudo element */
.ds-full-width-galerija .flickity-prev-next-button:before {
    display: none !important;
    content: none !important;
}

/* Sakrij postojeći SVG */
.ds-full-width-galerija .flickity-prev-next-button svg {
    display: none !important;
}

/* Dodaj custom SVG preko ::after pseudo elementa */
.ds-full-width-galerija .flickity-prev-next-button::after {
    content: '' !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    background-image: url('./img/kerempuh-gallery-right.svg') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    transition: transform 0.3s ease !important;
    transform-origin: center center !important; /* VAŽNO za jednako ponašanje */
}

/* Lijeva strelica - obrni desnu strelicu */
.ds-full-width-galerija .flickity-prev-next-button.previous::after {
    transform: scaleX(-1) !important;
}

/* Hover efekt - zoom 1.05 - POPRAVLJENO */
.ds-full-width-galerija .flickity-prev-next-button:hover {
    transform: translateY(0) scale(1.05) !important;
}

/* Hover za ::after element */
.ds-full-width-galerija .flickity-prev-next-button:hover::after {
    transform: scale(1) !important; /* Desna strelica */
}

.ds-full-width-galerija .flickity-prev-next-button.previous:hover::after {
    transform: scaleX(-1) !important; /* Lijeva strelica zadržava flip */
}

/* Disabled stanje */
.ds-full-width-galerija .flickity-prev-next-button:disabled {
    opacity: 0.3 !important;
    cursor: not-allowed !important;
}

/* Resetuj hover za disabled */
.ds-full-width-galerija .flickity-prev-next-button:disabled:hover {
    transform: translateY(0) scale(1) !important;
}



/* MOBILNI PRIKAZ - MATEMATIČKI TOČNO CENTRIRANO */
@media (max-width: 768px) {
    .ds-full-width-galerija .flickity-prev-next-button {
        top: -20% !important;
        width: 26px !important;
        height: 26px !important;
        margin-left: -10px !important;
    }

    /* Lijeva strelica - točno izračunato */
    .ds-full-width-galerija .flickity-prev-next-button.previous {
        position: absolute !important;
        left: calc(50% - 43px) !important; /* 50% - (26px širina strelice + 17px razmak) */
        right: auto !important;
        transform: none !important;
    }

    /* Desna strelica - točno izračunato */
    .ds-full-width-galerija .flickity-prev-next-button.next {
        position: absolute !important;
        left: calc(50% + 17px) !important; /* 50% + 17px razmak */
        right: auto !important;
        transform: none !important;
    }

    /* Hover efekt */
    .ds-full-width-galerija .flickity-prev-next-button:hover {
        transform: scale(1.05) !important;
    }
}



/* Dodaj u CSS */
.predstave-carousel {
    scroll-snap-type: x mandatory;
}

.predstave-carousel-item {
    scroll-snap-align: center;
}


/* Za touch uređaje - zoom efekt na tap */
@media (hover: none) and (pointer: coarse) {
    .dskr-button,
    .dskc-button,
    .ds-kerempuh-button,
    .novosti-button {
        /* Brza tranzicija samo za transform */
        transition: transform 0.15s ease !important;
        /* Ukloni sve druge tranzicije */
        transition-property: transform !important;
        text-align: center !important;
    }

    /* Zoom efekt na tap */
    .dskr-button:active,
    .dskc-button:active,
    .ds-kerempuh-button:active,
    .novosti-button:active {
        transform: scale(1.05);
    }
}



/* ===================================
   Alignment klase za dates carousel
   =================================== */

/* Malo datuma - centriraj */
.dates-carousel-track.dates-few-items {
    justify-content: center;
}

.dates-carousel-track.dates-few-items .date-item {
    text-align: center;
}

/* Puno datuma - lijevo poravnaj */
.dates-carousel-track.dates-many-items {
    justify-content: flex-start;
}

.dates-carousel-track.dates-many-items .date-item {
    text-align: left;
}

/* ===================================
   Kerempuh u gostima stilovi za single template
   =================================== */
.dates-section .kerempuh-gostima {
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    color: #000;
    line-height: 1.2;
}

/* Alignment za kerempuh-gostima ovisno o layout-u */
.dates-carousel-track.dates-few-items .kerempuh-gostima {
    text-align: center;
}

.dates-carousel-track.dates-many-items .kerempuh-gostima {
    text-align: left;
}

/* Mobile responsive */
@media (max-width: 768px) {

.dates-carousel-track.dates-many-items.few-items .kerempuh-gostima {
    text-align: center !important;
}
}


body #header-outer[data-lhe=animated_underline] #top nav>ul>li:not([class*=button_])>a .menu-title-text:after {
    bottom: -8px !important;
}





@media only screen and (max-width: 600px) {
@media (hover: hover) and (pointer: fine) {
  a:hover {
    text-decoration: underline;
    /* Resetuj sve ostale hover efekte */
    background: inherit !important;
    color: inherit !important;
    transform: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
  }
}
}





.twentytwenty-wrapper {
    padding: 0px !important;
}





/* 1. Sakrij crvenu liniju i strelice */
.twentytwenty-left-arrow,
.twentytwenty-right-arrow,
.twentytwenty-horizontal .twentytwenty-handle::before,
.twentytwenty-horizontal .twentytwenty-handle::after {
    display: none !important;
}

/* 2. Handle postane tvoja ikona */
.twentytwenty-handle {
    background: url('/wp-content/themes/salient-child/img/drag.png') no-repeat center center !important;
    background-size: 84px 55px !important;
    width: 114px !important;
    height: 55px !important;
    border: none !important;
    box-shadow: none !important;
    top: 8vh !important;
    margin-left: 60px !important;
    transform: translate(-50%, -50%) !important;
}



/* Off-canvas mobilni meni - samo glavne stavke velikim slovima */
#slide-out-widget-area .menu > li > a {
  text-transform: uppercase !important;
  letter-spacing: 1px; /* opcionalno za čišći izgled */
}


/* Off-canvas submenu item hover underline animacija */
.off-canvas-menu-container ul.sub-menu li > a {
  position: relative !important;
}

.off-canvas-menu-container ul.sub-menu li > a::after {
  content: "" !important;
  position: absolute !important;
  width: 0px !important;
  height: 3px !important;
  bottom: 0px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  background-color: rgb(255, 255, 255) !important;
  transition: width 0.3s, left 0.3s, transform 0.3s !important;
}

.off-canvas-menu-container ul.sub-menu li > a:hover::after {
  width: 100% !important;
}



/* Koristi postojeće selektore da premjestiš back na dno */
/* Samo za razmak, bez flex-a */
body #slide-out-widget-area .menu.subview .subviewopen > .sub-menu > .back.moved {
    margin-top: 100px !important;
    margin-bottom: 20px !important;
}



body #slide-out-widget-area .menu.subview .subviewopen > .sub-menu > .back.moved a::before {
    content: '' !important;
    display: inline-block !important;
    width: 24px !important;
    height: 44px !important;
    background-image: url(img/ds-menu-left.png) !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    margin-right: 40px !important;
    margin-left: 0px;
    vertical-align: middle !important;
    margin-top: 8px !important;
}

/* Osiguraj da je link prikazan kao flex za bolje poravnanje */
body #slide-out-widget-area .menu.subview .subviewopen > .sub-menu > .back.moved a {
    display: flex !important;
    align-items: center !important;
}


/* Ovo je radilo, držite se toga */
body #slide-out-widget-area ul.sub-menu {
    min-width: 10000px !important;
}






/***********************
 * CUSTOM HAMBURGER MENU *
 * SMANJENA VELIČINA + CENTRIRANI X *
 ***********************/

/* ==================================
   1. SAKRIJ SALIENT ELEMENTE
   ================================== */
.slide-out-widget-area-toggle .screen-reader-text,
.slide-out-widget-area-toggle .lines-button,
.slide-out-widget-area-toggle .lines,
.slide-out-widget-area-toggle .close-wrap,
.slide-out-widget-area-toggle .close-line {
    display: none !important;
}

/* ==================================
   2. KONTEJNER SETUP
   ================================== */
.slide-out-widget-area-toggle {
    position: relative;
}

.slide-out-widget-area-toggle a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    width: 44px !important;
    height: 44px !important;
}

.custom-hamburger-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    position: absolute !important;

}

/* ==================================
   3. SVG VELIČINA - 15% MANJA
   ================================== */
.Header__toggle-svg,
.custom-hamburger-svg,
#hamburger {
    max-width: 50px !important;
    max-height: 40px !important;
    display: block !important;
}



body.material #header-outer[data-full-width=true]:not([data-format=left-header]) #top nav>.buttons {
    margin-top: 4px;
}


/* ==================================
   4. HAMBURGER ANIMACIJA
   ================================== */
#hamburger path {
    transform-origin: 20px 20px; /* Centar 40x40 viewBox */
    transition: transform .35s cubic-bezier(0.52,0.01,0.16,1),
                opacity .25s ease;
}

/* Početno stanje */
#hamburger #top-line,
#hamburger #middle-line,
#hamburger #bottom-line {
    transform: none;
    opacity: 1;
}

/* ==================================
   5. X STANJE - SAVRŠENO CENTRIRANI X
   ================================== */
/* Top linija - pomakni na centar i rotiraj */
.slide-out-widget-area-toggle a.open #hamburger #top-line,
body.material-ocm-open .slide-out-widget-area-toggle #hamburger #top-line {
    transform: translateX(-5px) rotate(45deg) scale(0.7);  /* Sa Y=12 na Y=20 */
    vector-effect: non-scaling-stroke;
    stroke-width: 2px !important;

}

/* Middle linija - sakrij */
.slide-out-widget-area-toggle a.open #hamburger #middle-line,
body.material-ocm-open .slide-out-widget-area-toggle #hamburger #middle-line {
    opacity: 0;
    transform: scaleX(0);
}

.slide-out-widget-area-toggle a.open #hamburger #bottom-line,
body.material-ocm-open .slide-out-widget-area-toggle #hamburger #bottom-line {
  /* tvoja postojeća transformacija */
  transform: translateX(-5px) rotate(-45deg) scale(0.7);

  /* osiguraj da debljina ne “smršavi” zbog scale */
  vector-effect: non-scaling-stroke;

  /* deblji potez samo u X stanju (prilagodi vrijednost po želji) */
  stroke-width: 2px !important;
}



/* ==================================
   7. MOBILE RESPONSIVE
   ================================== */
@media (max-width: 999px) {
    /* Salient navigacija fixevi */
    #header-outer #top nav {
        display: block !important;
    }

    #header-outer #top nav > ul.sf-menu {
        display: none !important;
    }

    body #header-outer .icon-salient-search:before,
    body.material #header-outer .icon-salient-search:before {
        font-size: 26px !important;
    }

    #header-outer #top nav > ul.buttons.sf-menu {
        display: flex !important;
        align-items: center;
        justify-content: flex-end;
        gap: 12px;
    }

    #header-outer #top nav > ul.buttons.sf-menu > li {
        display: flex !important;
        align-items: center;
        margin-right: 10px !important;
        margin-top: 4px !important;
    }

    /* Sakrij Salient mobile elemente */
    .nectar-mobile-only.mobile-header,
    .mobile-search,
    .slide-out-widget-area-toggle.mobile-icon {
        display: none !important;
    }

    /* Search button pozicija */
    #search-btn {
        position: fixed !important;
        top: 12px !important;
        right: 60px !important;
        z-index: 100 !important; /* PROMJENA: smanjen */
    }

    #search-btn a {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        padding: 10px 12px !important;
    }

    /* Hamburger pozicija */
    #header-outer .slide-out-widget-area-toggle {
        position: fixed !important;
        top: 12px !important;
        right: 12px !important;
        z-index: 101 !important; /* PROMJENA: ostaje 101 */
        opacity: 1 !important;
        visibility: visible !important;
        transition: opacity 0.3s ease, visibility 0.3s ease; /* DODANO */

    }



    /* Malo veće dimenzije na mobilnom */
    .slide-out-widget-area-toggle a {
        width: 60px !important;
        height: 56px !important;
        padding: 0 !important;
        pointer-events: auto !important;
    }

    .Header__toggle-svg,
    .custom-hamburger-svg,
    #hamburger {
        width: 60px !important;
        height: 56px !important;
        margin-top: 2px;
        min-width: 30px !important;
        min-height: 30px !important;
    }

    .Header__toggle-svg,
    .custom-hamburger-svg,
    #hamburger {
        max-width: 36px !important;
        max-height: 34px !important;
        display: block !important;
    }

    /* ===== DODAJ OVO NA KRAJ ===== */

    /* Search overlay kad je otvoren */
    #search-outer.material-open {
        z-index: 10000 !important;
    }

    #search-outer.material-open #search {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 10000 !important;
    }

    /* Close button mora biti klikabilan */
    #search-outer #close {
        position: relative;
        z-index: 10002 !important;
    }

    #search-outer #close a {
        padding: 20px !important;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
    }

    /* Sakrij hamburger i search button kada je search otvoren */
    #header-outer.material-search-open .slide-out-widget-area-toggle,
    #header-outer.material-search-open #search-btn {
        pointer-events: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }
}






/* ==================================
   8. BOJE PO HEADER STATEOVIMA
   ================================== */
/* Transparent header - bijele linije */
#header-outer.transparent:not(.dark-slide) .slide-out-widget-area-toggle #hamburger g {
    stroke: #fff !important;
}

/* Transparent + dark-slide - crne linije */
#header-outer.transparent.dark-slide .slide-out-widget-area-toggle #hamburger g {
    stroke: #000 !important;
}

/* Solid header - crne linije */
#header-outer:not(.transparent) .slide-out-widget-area-toggle #hamburger g {
    stroke: #000 !important;
}

/* Canvas otvoren - X uvijek bijel */
.slide-out-widget-area-toggle a.open #hamburger g,
body.material-ocm-open .slide-out-widget-area-toggle #hamburger g {
    stroke: #fff !important;
}

/* ==================================
   9. OVERRIDE SVE SALIENT STILOVE
   ================================== */
/* Nuclear opcija - forsirati preko svega */
.slide-out-widget-area-toggle svg,
.slide-out-widget-area-toggle svg.Header__toggle-svg,
#header-outer .slide-out-widget-area-toggle svg#hamburger {
    width: 60px !important;
    height: 56px !important;
    transform: none !important;
}





/* =========================================================
   HOVER EFEKTI
   ========================================================= */

/* --- (1) ZATVORENO: "draw from left" za SVE TRI linije (sporije, sa staggerom) --- */
@keyframes ds-draw {
  from { stroke-dasharray: 60; stroke-dashoffset: 60; }
  to   { stroke-dasharray: 60; stroke-dashoffset: 0; }
}

.slide-out-widget-area-toggle a:not(.open):hover #hamburger #top-line {
  animation: ds-draw .85s cubic-bezier(.22,.61,.36,1)   0s   1 both;
}
.slide-out-widget-area-toggle a:not(.open):hover #hamburger #middle-line {
  animation: ds-draw .85s cubic-bezier(.22,.61,.36,1)  .10s  1 both;
}
.slide-out-widget-area-toggle a:not(.open):hover #hamburger #bottom-line {
  animation: ds-draw .85s cubic-bezier(.22,.61,.36,1)  .20s  1 both;
}


/* priprema (ako već nemaš) */
.slide-out-widget-area-toggle .custom-hamburger-wrapper{
  transform-origin: 50% 50%;
  transform-box: fill-box;
  transition: transform .45s cubic-bezier(.22,.61,.36,1);
  --hover-lift: -2px; /* podešavanje "dizanja" na hover; probaj -2px do -3px */
}

/* već imaš ovo (rotacija 90° kad je open + rot-ready + hover) */
.slide-out-widget-area-toggle a.open.rot-ready:hover .custom-hamburger-wrapper{
  transform: rotate(90deg);
}

/* NOVO: kad JS doda .hover-lift, povuci malo gore uz zadržavanje rotacije */
.slide-out-widget-area-toggle a.open.rot-ready:hover .custom-hamburger-wrapper.hover-lift{
  transform: rotate(90deg) translateY(var(--hover-lift)) !important;
}


/* glatki lift za cijeli gumb */
.slide-out-widget-area-toggle a {
  transition: transform .25s cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}

/* kad je otvoreno + "armed" (rot-ready) + hover → podigni za -4px */
.slide-out-widget-area-toggle a.open.rot-ready:hover {
    transform: translateY(-2px);
}


/* Zelena pozadina SAMO kada canvas NIJE otvoren */
.page-id-13494 #header-outer[data-full-width="true"]:not(.side-widget-open) header > .container {
    background: #fff; /* ili koja god boja */
}

/* Eksplicitno ukloni pozadinu kada JE canvas otvoren */
.page-id-13494 #header-outer[data-full-width="true"].side-widget-open header > .container {
    background: transparent !important;
    background-color: transparent !important;
}


#header-space {
    height: auto !important;
}





@media only screen and (min-width: 1000px) {
  /* Padding SAMO za transparent header BEZ dark-slide klase */
  /* VAŽNO: Salient uklanja .dark-slide kad je canvas otvoren i stavlja .temp-removed-dark-slide */
  #header-outer.transparent:not(.dark-slide):not(.temp-removed-dark-slide) #top {
    padding-top: 25px;
  }

  /* Ukloni padding ako je transparent UMJETNO dodan (canvas na non-transparent stranicama) */
  body.transparent-header-temp #header-outer #top {
    padding-top: 0 !important;
  }

  /* Ukloni padding kada je header fiksiran/smanjen */
  #header-outer.scrolled-down #top,
  #header-outer.small-nav #top,
  #header-outer.fixed-menu #top {
    padding-top: 0;
  }
}



.duration {
    text-transform: uppercase;
}


.ds-duration {
    text-transform: uppercase !important;
}


.ds-nl-button-padding {
    padding-left: 22px !important;
    padding-right: 22px !important;
    min-width: 140px !important;
    min-height: 52px !important;
    text-align: center !important;
}



body.material .nectar-button.large {
    min-width: 140px !important;
    min-height: 52px !important;
    text-align: center !important;
    padding: 15px 22px !important;
}



body.material .nectar-button.large {
    line-height: 22px;
}


.dskr-content {
    margin-top: -10px;
}





@media only screen and (max-width: 999px) {
body.material .nectar-button.large {
    padding: 8px 16px !important;
    min-width: 120px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}
}



body.search #page-header-bg {
    height: 250px;
    margin-top: 13vh;
}



body.search #page-header-bg {
    height: 250px !important;
    margin-top: 140px !important;
}






@media only screen and (max-width: 999px) {
body.search #page-header-bg {
    height: 250px !important;
    margin-top: 80px !important;
}
body.search #page-header-bg h1 {
    margin-top: 20px;
}

    body.material #search-outer, body.material #header-outer #search-outer {
        padding-top: 140px;
    }
.results-shown #search-outer .nectar-ajax-search-results {
min-height: 100vh;

}
}




#search-outer.material-open .close-line1,.material-ocm-open.slide_out_area_close .close-line1,.slide-out-widget-area-toggle .open .close-line1 {
    animation-name:crossRight;
    animation-delay:0.10s;
}

#search-outer.material-open .close-line2,.material-ocm-open.slide_out_area_close .close-line2,.slide-out-widget-area-toggle .open .close-line2 {
    animation-name:crossLeft;
    animation-delay:0.20s;
}


    body.material #search-outer #search #search-box input[type="text"] {
        font-family: "Barlow" !important;
    }




#search-outer .nectar-ajax-search-results .inner {
    max-height: calc(100vh - 225px);
    padding-bottom: 30px;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;

    /* Sakrij scrollbar */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE/Edge */
}

/* Sakrij scrollbar za Chrome, Safari, Opera */
#search-outer .nectar-ajax-search-results .inner::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}


/* Blokiraj scroll na iOS-u ako sadržaj stane */
#slide-out-widget-area.fullscreen-alt .inner-wrap {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: auto !important; /* NE touch! */
    overscroll-behavior: none !important;
}

/* Dodatna zaštita za iOS */
#slide-out-widget-area.fullscreen-alt .inner {
    overflow: visible !important;
    -webkit-overflow-scrolling: auto !important;
}



#error-404 .nectar-button {
    min-width: 170px !important; /* Prilagodi po želji */
}



.row .col.section-title {
    margin-top: 50px;
}



/* ==================================
   SAFARI FIX – vidljivost ikona nakon zatvaranja menija/pretrage
   ================================== */

/* 1. Safari repaint (bez mijenjanja transformacija menija) */
#header-outer #search-btn,
#header-outer .slide-out-widget-area-toggle {
  -webkit-transform: translateZ(0); /* Forsira repaint */
  transform: translateZ(0); /* Standardni property */
  backface-visibility: hidden;
}

/* ========================================
   SKIP TO CONTENT LINK - ACCESSIBILITY
   ======================================== */
/* Skip to content link - accessibility */
.skip-to-content {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    z-index: 100000;
    background: #000;
    color: #fff;
    padding: 8px 16px;
    text-decoration: none;
    font-size: 14px;
}

.skip-to-content:focus {
    position: fixed;
    top: 10px;
    left: 10px;
    width: auto;
    height: auto;
    overflow: visible;
    outline: 2px solid #fff;
    outline-offset: 2px;
}