/*---------------------------------------------------------------POČETNA---------------------------------------------------------------*/
/*@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville&display=swap');*/

@font-face {
    font-family: 'BookAntiqua';
    src: url('../Datoteke/Fonts/bookantiqua.ttf') format('woff2'), url('../Datoteke/Fonts/bookantiqua.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Commercial Script BT Regular';
    src: url('../Datoteke/Fonts/commercialscriptbt_regular.ttf?v=2') format('woff2'), url('../Datoteke/Fonts/commercialscriptbt_regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'BookAntiqua', serif !important;
}
.header {
    z-index: 9999 !important;
}
/*body {*/
/*background-image:  url("/Datoteke/profil2.jpeg");*/
/*}*/
/*.product-div >div {
    background-image: url("/Datoteke/profil2.jpeg");
}*/

#privacy-title {
    font-size: 25px !important;
    color: #fff;
}

/* #privacy-typewriter {
    font-size: 18px;
    font-weight: 500;
}*/
.privacy-div {
    display: flex;
    justify-content: center;
    align-items: center;
}

input[type="text"]:focus,
input[type="date"]:focus,
input[type="password"]:focus,
input[type="number"]:focus,
textarea:focus {
    border: 2px solid #D1A845;
    outline: none;
}

/*---------------------------------------------------------------PAGER---------------------------------------------------------------*/
.page-link, .page-item {
    border-radius: 50%;
}
/*---------------------------------------------------------------HEADER---------------------------------------------------------------*/
.search-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #161615; /* Tamna pozadina kao i ostatak headera */
    padding: 20px;
    min-width: 250px;
    /*z-index: 99999;*/
    box-shadow: 0 15px 25px rgba(0,0,0,0.5); /* Jača sjena za tamnu temu */
    border: 2px solid #D1A845; /* Zlatni okvir */
}

.header-li {
    position: relative;
    /* Ako već nije, dodajte i ovdje z-index da spriječite skrivanje ispod bannera */
    /*z-index: 99999;*/
}

.search-input {
    width: 100%;
    padding: 10px 15px;
    margin-bottom: 15px;
    background-color: #fff;
    border: 1px solid #D1A845;
    color: #161615;
    font-family: 'BookAntiqua', serif !important;
    outline: none;
    transition: box-shadow 0.3s ease;
}

    .search-input:focus {
        box-shadow: 0 0 8px rgba(209, 168, 69, 0.6); /* Zlatni glow efekt kad se tipka */
    }

.search-btn {
    width: 100%;
    padding: 10px;
    cursor: pointer;
    background-color: #D1A845;
    color: #fff;
    border: 2px solid #D1A845;
    font-family: 'BookAntiqua', serif !important;
    font-size: 16px;
    font-weight: bold;
    transition: all 0.3s ease;
}

    .search-btn:hover {
        background-color: #fff;
        color: #D1A845; /* Obrnute boje na hover */
    }


.wrapper-search {
    right: 340px !important;
    top: 65px !important;
}

    .wrapper-search::before {
        right: -255px !important;
    }

.banner-outside {
    display: flex;
    justify-content: center;
}

.banner-inside {
    width: 87%;
    height: 70vh;
    /*overflow: hidden;*/
    position: relative;
}

    .banner-inside img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center 40%;
    }

.banner-text {
    position: absolute;
    font-family: 'Commercial Script BT Regular';
    top: 85%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    font-size: 6rem;
    text-shadow: 2px 2px 5px rgba(0,0,0,0.5);
}

.container {
    max-width: 1500px !important;
}

.header-top {
    justify-content: space-between;
    padding: 7px 100px !important;
}

.header-left-header-top .header-right-header-top {
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.header-left-header-top p, .header-right-header-top p {
    margin: 0px;
}

.header-left-header-top i {
    font-size: 17px;
    margin-left: 7px;
    margin-right: 5px;
}

.header-left-header-top {
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.header-right-header-top a {
    font-size: 15px;
}

#header-logo {
    width: 220px;
}
/*.header-centar-logo {
    margin: -30px 10px !important;
}*/
.header-middle-margin {
    margin-bottom: -65px;
}

.header {
    background-color: transparent !important;
    margin-bottom: 25px;
    position: relative;
    z-index: 1;
}

.header-kosarica {
    z-index: 1 !important;
}

.header-dno {
    background-color: transparent !important;
}



.middle-header-custom {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    border-bottom: none !important;
    background-color: transparent !important;
}

.sticky-header.fixed {
    background: #161615 !important;
}



/*#typewriter {
    font-weight: 500 !important;
}

    #typewriter::after {
        content: "|";
        margin-left: 3px;
    }*/


.header-list li {
    border: 2px solid #D1A845;
    width: 160px;
    text-align: center;
    padding-left: 1rem;
    transition: transform 0.7s ease, box-shadow 0.2s ease;
}

    .header-list li:hover {
        transform: scale(1.05);
        box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    }

    .header-list li a {
        color: #fff !important;
        font-family: 'BookAntiqua', serif !important;
        /*padding: 10px 55px !important;*/
        font-size: 16px;
    }



.search-icon {
    color: #fff !important;
}

.kosarica-icon {
    border: 2px solid #fff !important;
}

.pretraga-wrapper {
    border: 2px solid #D1A845 !important;
    position: absolute;
    right: 110px;
    transition: transform 0.7s ease, box-shadow 0.2s ease; /* sporiji efekt */
}

    .pretraga-wrapper:hover {
        transform: scale(1.05);
        box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    }

.search {
    /*padding: 5px 23px;*/
    width: 160px;
    text-align: center;
    height: 42.8px;
}
/*---------------------------------------------------------------ŠTO JE/PRETRAŽI/IZRADI eSPOMENIK---------------------------------------------------------------*/
.subtit-big {
    color: #D1A845 !important;
    text-transform: none !important;
    font-family: 'BookAntiqua', serif !important;
    text-align: center;
    font-size: 24px !important;
}


#opis-kratki {
    color: #fff;
    font-family: 'BookAntiqua', serif !important;
    font-size: 18px;
    text-align: center;
    padding: 10px;
}

.section-explore-big {
    background: #161615 !important;
    padding: 40px 0;
    /*border: 2px solid #D1A845;*/
}

.bottom-block-default {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

.row-section-explore {
    width: 100%;
    gap: 16.6%;
}

.me-2 {
    margin-right: 8px;
}

.ms-2 {
    margin-left: 8px;
}

.section-explore {
    border: 2px solid #D1A845;
    display: flex;
    background: #161615 !important;
    margin-top: 20px;
}

    .section-explore h2 {
        color: #fff !important;
        font-family: 'BookAntiqua', serif !important;
    }

    .section-explore:hover h2, .section.section-explore-big:hover h2 {
        text-decoration: underline;
    }

/*---------------------------------------------------------------PRIVATNOST -> DEFAULT ---------------------------------------------------------------*/

.img-icon-privacy {
    width: 55px;
    display: block;
    margin: auto;
}

.section-usluge {
    text-align: center;
}

.subtit {
    font-size: 24px !important;
    color: #fff !important;
    text-transform: none !important;
}

.section-usluge p {
    font-size: 16px !important;
}
/*---------------------------------------------------------------FOOTER---------------------------------------------------------------*/
.footer {
    background-color: transparent !important;
}

.row-footer-middle {
    margin-left: 20%;
}

.footer-middle img {
    margin-bottom: 0 !important;
}

.container-footer-bottom {
    display: flex;
    justify-content: center !important;
}

.footer-middle-custom {
    padding-top: 1rem !important;
    border-top: none !important;
    background: #161615;
}

.footerlink {
    color: #fff;
}

    .footerlink:hover {
        color: #D1A845 !important;
        text-decoration: underline;
    }

.usluge-title {
    font-size: 18px !important;
    color: #fff !important
}

.footer-container-custom {
    display: block !important; /* gasi flex */
}

    .footer-container-custom .row {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
    }

#foot-logo img {
    width: 200px;
    height: auto;
}

.footer-bottom-custom {
    border-top: none !important;
}

.footer .text-muted {
    font-size: 18px;
    line-height: 1.8;
    color: #fff !important;
    max-width: 320px;
    margin-top: 16px;
    font-style: italic;
    font-family: 'BookAntiqua', serif !important;
    letter-spacing: 0.3px;
}

.naslov-footer {
    color: #fff !important;
    font-size: 22px !important;
    font-family: 'BookAntiqua', serif !important;
}

.linkovi-footer ul li a {
    color: #fff !important;
}

.footer .text-muted::before {
    content: "";
    display: block;
    width: 40px;
    height: 1px;
    background-color: #D1A845;
    margin-bottom: 12px;
}


/*---------------------------------------------------------------PROFIL NA POČETNOJ---------------------------------------------------------------*/
.product-premium {
    border: 3px solid #D1A845;
}

#uspomene-title {
    display: block;
    margin: auto;
    margin-top: 35px !important;
}

    #uspomene-title h1 {
        font-weight: 500;
        font-size: 50px !important;
        color: #D1A845;
        text-align: center;
        font-family: 'Commercial Script BT Regular', serif !important;
    }

.profili-pocetna {
    margin-top: 35px !important;
}

.blok-product {
    /*min-height: 450px !important; ako budem vracao tekst ispod ovo ostavi*/
    /*min-height: 420px !important;*/
    min-height: 463px !important;
    /*border: 2px solid #00000021;*/
    /*border-radius: 15px;*/
    overflow: hidden;
    min-height: 360px;
    background: #ffffff;
    box-shadow: -1px 2px 24px 1px rgba(0,0,0,0.63);
    -webkit-box-shadow: -1px 2px 24px 1px rgba(0,0,0,0.63);
    -moz-box-shadow: -1px 2px 24px 1px rgba(0,0,0,0.63);
}

.product-image {
    width: 50%;
    max-width: 160px;
    height: 160px;
    display: block;
    margin: 50px auto -90px;
    margin-top: -30px !important;
    /*border: 2px solid #fff;*/
    /*margin: 30px auto 0;*/
}

    .product-image img {
        border: 3px solid #D1A845;
        padding: 10px;
        display: block;
        width: 100%;
        height: 150px;
        object-fit: cover;
        object-position: center top;
        box-sizing: border-box
    }

.osnovni-profil-img img,
.osnovni-profil-brdr {
    border: 1px solid #D1A845 !important;
}

.product-details {
    text-align: center;
}

.person-details {
    margin-top: 10px;
    width: 75%;
    margin: auto;
}

    .person-details p {
        margin: 0;
        font-size: 14px;
        line-height: 1.4;
        color: #666;
    }

.product-div {
    position: relative;
    transition: transform 0.7s ease, box-shadow 0.2s ease; /* sporiji efekt */
}

    .product-div:hover {
        transform: scale(1.05);
        box-shadow: 0 15px 25px rgba(0,0,0,0.2);
    }

.product-badge {
    width: 70px;
    position: absolute;
    top: 15px;
    left: 25px;
    z-index: 0;
}

    .product-badge img {
        width: 65px;
        height: auto;
    }

.product-badge-right {
    width: 70px;
    position: absolute;
    top: 15px;
    right: 25px;
    z-index: 0;
}

    .product-badge-right img {
        width: 65px;
        height: auto;
    }

.product-badge-bottom-left {
    width: 70px;
    position: absolute;
    bottom: 25px;
    left: 25px;
    z-index: 0;
}

    .product-badge-bottom-left img {
        width: 65px;
        height: auto;
    }

.product-badge-bottom-right {
    width: 70px;
    position: absolute;
    bottom: 25px;
    right: 25px;
    z-index: 0;
}

    .product-badge-bottom-right img {
        width: 65px;
        height: auto;
    }


.img-icon {
    width: 80px !important;
}

@keyframes blink {
    0%, 50%, 100% {
        opacity: 1;
    }

    25%, 75% {
        opacity: 0;
    }
}

.privacy-section {
    background: #f7f7f7;
    padding: 60px 0;
    text-align: center;
}

    .privacy-section h3 {
        font-weight: 600;
        margin-bottom: 10px;
    }

.privacy-subtitle {
    color: #fff;
    max-width: 600px;
    margin: 0 auto;
}

.privacy-item i {
    font-size: 32px;
    color: #D1A845;
    margin-bottom: 15px;
}

.privacy-item h5 {
    font-weight: 600;
    margin-bottom: 5px;
}

.privacy-item p {
    font-size: 14px;
    color: #666;
}

.img-profile {
    border: 4px solid black;
}

.pozadinska-slika {
    height: 200px;
    background-position: center;
    background-size: cover;
}

/*.pozadinska-slika1 {
    height: 150px;
    background-image: url("/Datoteke/PozadinskeSlike/close-up-the-groom-s-buttonhole-flowers-with-white-2026-01-05-06-15-24-utc.jpg");
    background-position: center;
    background-size: cover;
}*/

.profile-header-div {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 30px;
}

.profile-header-div-det {
    position: absolute;
}

.slika-div {
    position: absolute;
    left: 160px;
}

.detalji-div {
    position: relative;
    left: 217px;
    top: 25px;
}
/*---------------------------------------------------------------UNOS DATOTEKA---------------------------------------------------------------*/
.choose-theme img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 6px;
}

.theme-option {
    cursor: pointer;
    transition: 0.2s;
}

input[type="radio"]:checked + label.theme-option {
    border: 3px solid #D1A845 !important;
}

/*---------------------------------------------------------------SPOMENICI---------------------------------------------------------------*/
/* OSNOVNI paket */
.profil-paket.osnovni {
    border: 3px solid #D1A845;
    background: #fff;
    /*background: linear-gradient(145deg, #e3e0dc, #d1cbc3);*/
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    min-height: 630px;
}

    .profil-paket.osnovni:hover {
        transform: translateY(-5px);
        box-shadow: 0 15px 35px rgba(0,0,0,0.15);
    }

.naslov-profila-osnovni, .naslov-profila {
    background: #D1A845;
    border-radius: 8px;
}

    .naslov-profila-osnovni a, .naslov-profila a {
        font-weight: 900;
        font-size: 28px;
        color: #8f6915;
        text-align: center;
        display: block;
        margin-bottom: 10px;
        margin-top: 10px;
        text-shadow: 1px 1px 3px rgba(0,0,0,0.12);
    }



.paket-naslov {
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 15px;
    color: #333;
}

.plan-features.basic li::before {
    content: "✔";
    position: absolute;
    left: 0;
    color: #D1A845;
    font-size: 16px;
    line-height: 1;
}



.cijena-profil {
    position: absolute;
    bottom: 70px;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 22px;
    font-weight: 700;
    color: #D1A845;
    font-family: 'Book Antiqua', serif !important;
    margin-top: 0;
}

.old-price {
    text-decoration: line-through;
    color: #999;
    margin-right: 10px;
}


.profil-paket {
    border-radius: 12px;
    padding: 25px;
    min-height: 500px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    background-color: #fff;
}

    .profil-paket.osnovni:hover {
        transform: translateY(-5px);
        box-shadow: 0 12px 30px rgba(0,0,0,0.15);
    }

    .profil-paket.premium {
        border: 3px solid #D1A845;
        box-shadow: 0 12px 35px rgba(0,0,0,0.2);
    }

        .profil-paket.premium:hover {
            transform: translateY(-8px);
            box-shadow: 0 20px 45px rgba(0,0,0,0.25);
        }

.product-title a {
    font-family: 'Commercial Script BT Regular';
    font-weight: 500;
    font-size: 33px;
    color: #8f6915;
    text-decoration: none;
    text-align: center;
    display: block;
    margin-bottom: 15px;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.15);
}

    .product-title a:hover {
        color: #D1A845;
    }

.paket-naslov {
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 15px;
    color: #333;
}


.old-price {
    text-decoration: line-through;
    color: #999;
    margin-right: 10px;
}

.modal-content {
    border-radius: 9px;
}

.checkbox-dodatno {
    margin-right: 10px;
}

    .checkbox-dodatno:hover, .cijena-stavka-dodatno:hover, .naziv-stavka-dodatno:hover {
        cursor: pointer;
    }
/*---------------------------------------------------------------SPOMENIK DETALJNO---------------------------------------------------------------*/
.svice {
    display: flex;
    justify-content: center;
    align-content: space-around
}

.svijeca {
    display: flex;
    flex-direction: column;
    margin-right: 120px;
    margin-top: 14px !important;
}

.flowers {
    display: flex;
    justify-content: end;
    align-items: center;
    flex-direction: column;
}

.black-flowers {
    /*filter: grayscale(100%);*/
    opacity: 0.3;
}

/*.main-background {
    background: #F4F5F7;
}*/

.sort-menu-trigger {
    min-width: 180px !important;
}

.breadcrumb-nav {
    border-bottom: none;
    border-top: none;
}

.toolbox .pagination {
    margin-right: auto;
}

.bg-div {
    height: 400px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

    .bg-div img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.profilna-det {
    position: relative;
    top: -60px;
    z-index: 2;
    width: 250px !important;
    height: 250px !important;
    border: 5px solid #fff;
    overflow: hidden;
}

    .profilna-det .profile-image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top; /* fokus na gornji dio, korisno za lica */
        display: block;
    }

.profile-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 25px;
    margin-top: -80px;
    position: relative;
    z-index: 2;
    text-align: left;
}

.profile-text {
    max-width: 400px;
}

.profil-detaljno-godine {
    font-style: italic;
    margin-top: 8px;
    color: #b3b3b3 !important;
    font-size: 2rem;
}

.link-profil-det {
    color: #D1A845 !important;
    border-bottom-color: #D1A845 !important;
}

.profile-name {
    font-family: 'Commercial Script BT Regular', serif !important;
    color: #fff;
    margin: 0;
    font-weight: 500 !important;
    font-size: 58px !important;
    line-height: 58px !important;
}

.subtitle-det {
    text-align: left;
    font-size: 40px;
    margin-bottom: 10px;
    color: #fff;
}

    .subtitle-det::after {
        content: "";
        display: block;
        height: 2px;
        background-color: #282d3b;
        width: 100%;
        margin-top: 5px;
    }

.description-det {
    font-size: 16px;
    line-height: 1.5;
    color: #b3b3b3;
}

.profile-years-div {
    font-style: italic;
    color: #777;
    font-size: 16px;
}

.profile-years-osnovni-div, .profile-years-div {
    color: #D1A845;
    font-size: 17px;
    margin-top: -15px;
    margin-left: 12px;
    font-style: italic;
}

.py-osnovno {
    /*margin-top: -27px;*/
    margin-top: -20px;
}

.product-title-osnovni {
    font-size: 30px !important;
    line-height: 1.1;
}

.profil-paket {
    min-height: 500px;
    position: relative;
    border: 3px solid #D1A845 !important;
}
/*---------------------------------------------------------------O NAMA---------------------------------------------------------------*/
.page-header-bg h1 {
    font-family: 'BookAntiqua', serif !important;
}

.breadcrumb {
    border-bottom: 1px solid #fff;
    display: flex;
    justify-content: center;
}

    .breadcrumb li, .breadcrumb li a {
        color: #fff !important;
        font-family: 'Book Antiqua', serif !important;
        font-size: 13px;
    }

        .breadcrumb li:before {
            color: #fff !important;
        }

.onama-paragraph {
    color: #fff !important;
    text-align: center;
}

.onama-title {
    font-size: 20px;
    font-weight: 600;
    font-size: 28px;
    color: #D1A845;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: none !important;
    font-family: 'Book Antiqua', serif !important;
    text-transform: none !important;
}

    .onama-title::after {
        content: "";
        display: block;
        height: 2px;
        width: 60px;
        background-color: #282d3b;
        margin: 0 auto;
        margin-top: 5px;
    }

.onama-section p, .company-section p {
    font-family: 'Book Antiqua', serif !important;
    font-weight: 400;
    font-size: 17px;
    line-height: 1.8;
    color: #b3b3b3;
}

/*---------------------------------------------------------------KONTAKT---------------------------------------------------------------*/
.kontakt-color {
    color: #fff !important;
    font-family: 'Book Antiqua', serif !important;
}

.kontakt-label {
    color: #fff !important;
    font-family: 'Book Antiqua', serif !important;
}

.kontakt-info {
    background-color: #fff !important;
    border-radius: 5px !important;
}

    .kontakt-info:before {
        color: #D1A845;
        font-size: 22px;
    }

.contact-info p, .contact-info a {
    color: #fff;
}

#kontaktMsg-div {
    background-color: #0ec90ea1;
    width: 25%;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 21px;
    margin-right: auto;
    margin-left: auto;
}

    #kontaktMsg-div > p {
        color: #fff;
        font-weight: 700;
        text-align: center;
        margin: 0;
    }

#kontaktMsg-div-greska {
    background-color: #c90e0ea1;
    width: 25%;
    height: 33px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 21px;
    margin-right: auto;
    margin-left: auto;
}

    #kontaktMsg-div-greska > p {
        color: #fff;
        font-weight: 700;
        text-align: center;
        margin: 0;
    }

#btn-posalji-upit, .btn-close-modal {
    background-color: #D1A845;
    color: #fff;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    #btn-posalji-upit a, .btn-close-modal a {
        color: #fff;
        text-decoration: none;
        font-family: 'Book Antiqua', serif !important;
    }

}

#btn-posalji-upit:hover {
    background-color: #D1A845;
}

.form-control {
    border-radius: 5px;
}
/*---------------------------------------------------------------PONUDA USLUGA---------------------------------------------------------------*/

.plan-features {
    /* Ensures padding and border are included in the element's total width and height */
    box-sizing: border-box;
    /* Prevents the block from being wider than the screen */
    max-width: 100%;
    /* Breaks long words onto the next line if they exceed the container limits */
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* --- KARTICE --- */
.ponuda-icon {
    max-width: 500px;
    margin: 0 auto;
    padding: 30px;
    border-radius: 20px;
    border: none;
    transition: all 0.3s ease;
    height: 100%;
    position: relative;
}

.btn-kreiraj-profil {
    position: absolute;
    bottom: 42px;
    text-align: center;
    height: 34px;
    width: 172px;
    left: 147px;
    border-radius: 7px;
    align-items: center;
    margin-top: 0px;
    padding-top: 7px;
    background-color: #D1A845;
    color: #4a3d2f !important;
    font-weight: 600;
    border: none;
    font-family: 'Book Antiqua', serif !important;
}

    .btn-kreiraj-profil:hover {
        background-color: #D1A845 !important;
        color: #8f6915 !important;
    }

.row.row-sm {
    justify-content: center; /* centrira sve stupce u redu */
}


.ponuda-icon:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 40px rgba(0,0,0,0.18);
}

/* --- PREMIUM KARTICA --- */
.premium {
    /*background: linear-gradient(145deg, #f9e7c1, #f5d58c) !important;*/
    background: #fff;
}

/* --- NASLOVI --- */
.naslov-profila,
.naslov-profila-osnovni {
    margin-top: 2rem;
    margin-bottom: 2rem !important;
    text-align: center;
}

    .naslov-profila > a,
    .naslov-profila-osnovni > a {
        font-weight: 900;
        font-size: 30px;
        letter-spacing: 1px;
        color: #4a3d2f !important;
        transition: color 0.3s ease;
        font-family: 'Book Antiqua', serif !important;
    }

        .naslov-profila > a:hover,
        .naslov-profila-osnovni > a:hover {
            color: #8a6b3f !important;
        }

/* --- PODNASLOVI --- */
.paket-naslov {
    text-align: center;
    font-size: 14px;
    letter-spacing: 1.5px;
    color: #7a6c5c;
    margin-bottom: 15px;
}
/* --- FEATURES LISTA --- */
.plan-features, .plan-features-dodatno {
    text-align: left;
    margin-top: 18px;
    margin: 0 auto 20px;
    padding-left: 0;
    list-style: none;
    font-size: 15px;
    max-width: 320px;
    color: #4b4438;
}

.plan-features-dodatno {
    margin-left: 14px !important;
}


    .plan-features li, .plan-features-dodatno li {
        position: relative;
        padding-left: 25px;
        margin-bottom: 10px;
        font-weight: 500;
        font-family: 'Book Antiqua', serif !important;
    }

        .plan-features li:hover {
            transform: scale(1.15);
            cursor: pointer;
        }

        .plan-features li::before {
            content: "✔";
            position: absolute;
            left: 0;
            color: #b4925b; /* elegantna zlatna */
            font-size: 16px;
            line-height: 1;
        }

/* --- CIJENA --- */
/*.cijena-profil {
    margin-top: 25px;
    text-align: center;
    font-family: 'Book Antiqua', serif !important;
}*/

.cijena-profil .old-price {
    display: block;
    opacity: 0.5;
    font-size: 15px;
    text-decoration: line-through;
    color: #8c7a66;
    font-family: 'Book Antiqua', serif !important;
}

.cijena-profil .product-price {
    font-size: 28px;
    font-weight: 800;
    color: #D1A845;
    font-family: 'Book Antiqua', serif !important;
}

/* --- RESPONSIVE --- */
/*@media (max-width: 768px) {
    .ponuda-icon {
        padding: 25px;
    }

    .naslov-profila > a,
    .naslov-profila-osnovni > a {
        font-size: 24px;
    }
}*/
.paket-dodatni-opis {
    position: absolute;
    bottom: 10px;
    left: 10px;
    font-size: 12px;
}

.cijena-stavka-dodatno {
    color: #D1A845;
}

.modal-title {
    font-size: 22px;
    color: #D1A845;
}

.modal-body p {
    font-size: 15px;
}


/*---------------------------------------------------------------LOGIN---------------------------------------------------------------*/
.login-box {
    padding: 35px 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);
    margin-top: 20px;
    background: #fff;
}

.title-prijava {
    color: #D1A845 !important;
    font-size: 28px;
    font-weight: 600;
    margin-bottom: 20px;
    font-family: 'Book Antiqua', sans-serif !important;
}

.prijava-p {
    font-size: 16px;
    color: #161615 !important;
    margin-bottom: 20px;
}

.login-label {
    font-size: 14px;
    color: #161615 !important;
}
/* Smanjeni gumb za prijavu */
.btn-login-smanjen {
    padding: 8px 30px !important;
    font-size: 14px !important;
    min-width: auto !important;
    border-radius: 5px;
    font-family: 'Book Antiqua', sans-serif !important;
}

.login-box .form-control {
    background-color: #fafafa;
    color: #333;
    border: none;
}
/*-----------------------------------------------------------------------------------------------------------------------------------*/



/*---------------------------------------------------------------ARTIKAL DETALJNO---------------------------------------------------------------*/
.podaci-label {
    color: #fff !important;
}

.accordion-title-custom {
    display: block;
    padding: 14px 18px;
    background: #D1A845;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.25s ease;
    position: relative;
    margin-bottom: 20px;
    font-family: 'Book Antiqua', serif !important;
}

.bookAntiqua {
    font-family: 'Book Antiqua', serif !important;
}

/* hover efekt */
.accordion-title-custom:hover {
    background: #fff;
    color: #D1A845;
}

/* kad je otvoren accordion */
.accordion-title-custom[aria-expanded="true"] {
    background: #c1c1c178;
    color: #D1A845;
}

/* mala strelica desno */
.accordion-title-custom::after {
    content: "+";
    position: absolute;
    right: 18px;
    font-size: 20px;
    transition: transform 0.25s ease;
}

/* promjena u minus kad je otvoreno */
.accordion-title-custom[aria-expanded="true"]::after {
    content: "−";
}


.product-main {
    margin-bottom: 0px !important;
}

.subtitle-artikal {
    display: inline-block; /* širina se automatski prilagođava tekstu */
    border-top: 2px solid #fff; /* linija iznad teksta */
    border-bottom: 2px solid #fff; /* linija ispod teksta */
    padding: 10px 15px; /* malo paddinga sa strane */
    margin: 10px 0; /* razmak od ostalih elemenata */
}

.plan-checkbox-list {
    margin-top: 15px;
}

.plan-item {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    font-size: 15px;
    cursor: default;
}

    .plan-item input[type="checkbox"] {
        transform: scale(1.1);
        cursor: default;
    }

    .plan-item span {
        color: #555;
    }

.details-span {
    font-size: 12px;
    cursor: pointer;
    text-decoration: underline;
}

    .details-span:hover {
        color: #D1A845;
    }

.input-style:hover {
    cursor: pointer;
}



.price-text {
    font-size: 21px;
    color: #FFF;
}

.product-price {
    color: #D1A845 !important;
}

.spomenik-card {
    width: 390px; /* širina okvira */
    height: 400px; /* visina okvira */
    border-radius: 10px; /* blago zaobljeni kutovi */
    overflow: hidden; /* da slika ne izlazi van okvira */
    background-color: #fff; /* pozadina ako slika nedostaje */
}

    .spomenik-card img {
        width: 100%;
        height: 100%;
        object-fit: cover; /* slika popunjava okvir bez istezanja */
    }

.plan-header {
    border-bottom: 2px solid #eee;
    padding-bottom: 10px;
}

.plan-title {
    font-size: 3.5rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
}


.dodaj-ikona {
    justify-content: flex-end !important;
    border-bottom: 2px solid #eee;
    padding-bottom: 20px;
}


.autocompletePretraga {
    position: relative;
}

.listaArtikli {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    z-index: 9999;
    max-height: 250px;
    overflow-y: auto;
}

    .listaArtikli .redak {
        padding: 10px 15px;
        border-bottom: 1px solid #f0f0f0;
        cursor: pointer;
    }

        .listaArtikli .redak:last-child {
            border-bottom: none;
        }

        .listaArtikli .redak:hover {
            background-color: #f5f5f5;
        }

        .listaArtikli .redak a {
            color: #333;
            text-decoration: none;
            font-size: 14px;
            display: block;
        }

            .listaArtikli .redak a:hover {
                color: #000;
            }

/*---------------------------------------------------------------PROFIL DETALJNO---------------------------------------------------------------*/

.profile-image-wrapper {
    margin: auto;
    width: 170px;
}

.share-profil-det {
    gap: 5px;
}

.profile-container {
    position: relative; /* roditelj za apsolutno pozicioniranje anđela */
}

.profile-description {
    min-width: 100%;
    padding-left: 100px;
    padding-right: 100px;
    text-align: center;
}

.sjecanja-div {
    width: 1200px;
}
/*---------------------------------------ANĐEL---------------------------------------*/
/* animacija lebdenja gore-dolje */
@keyframes floatUpDown {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }
    /* koliko ide gore */
    100% {
        transform: translateY(0px);
    }
}

@keyframes slideInLeft {
    0% {
        transform: translateX(-50px);
        opacity: 0;
    }

    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideInLeftPreText {
    0% {
        transform: translateX(-80px);
        opacity: 0;
    }

    100% {
        transform: translateX(-60px);
        opacity: 1;
    }
}

/* Wrapper za anđela i tekst */
.angel-wrapper {
    position: absolute;
    top: -30px;
    left: -24%;
    width: 400px;
    z-index: 10;
    display: inline-block; /* ili inline-flex ako koristiš flex */
    animation: floatUpDown 3s ease-in-out infinite;
}

    .angel-wrapper:hover {
        cursor: pointer;
        animation-play-state: paused; /* pauzira animaciju na hover */
    }
/* Slika anđela */
.angel-image {
    position: absolute;
    top: -20px;
    left: 2%;
    width: 120px;
    height: 120px;
    z-index: 10;
}
/* Tekst anđela */
.angel-text {
    margin-top: 20px;
    margin-left: 94px;
    background: rgba(255, 255, 255, 0.8);
    padding: 5px 20px;
    border-radius: 8px;
    font-size: 1.3rem;
    line-height: 1.2rem;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    display: none;
}

/*.angel-pretext img {
    width: 100px;*/ /* ili po želji */
/*height: auto;
}*/

/* Oblacić iznad anđela */
.angel-pretext {
    position: absolute;
    bottom: -6px;
    left: 33%;
    transform: translateX(-50%); /* centriranje */
    width: 140px;
    z-index: 20;
    animation: slideInLeftPreText 0.8s ease forwards;
}

    .angel-pretext img {
        width: 50%;
        height: auto;
        display: block;
    }

    .angel-pretext.show {
        display: none;
    }

.angel-text.show {
    display: block;
    animation: slideInLeft 0.8s ease forwards;
}


.memmory-wrapper {
    position: absolute;
    top: 60px;
    left: -18%;
    width: 300px;
    z-index: 10;
}

.music-wrapper {
    position: fixed;
    top: 166px;
    left: 20px;
    z-index: 10000;
}

    .music-wrapper .btn-play {
        background: none;
        border: 1px solid #333;
        color: #b3b3b3;
        padding: 6px 12px;
        font-size: 13px;
        border-radius: 4px;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 6px;
        transition: all 0.2s ease;
    }

        .music-wrapper .btn-play:hover {
            background: #f0f0f0; /* lagani hover efekt */
        }

        .music-wrapper .btn-play i {
            font-size: 18px;
        }



.gallery-grid {
    display: grid;
    grid-template-columns: repeat(8, 1fr); /* 6 po redu */
    gap: 12px;
}

.gal-item {
    position: relative;
}

    .gal-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        border-radius: 6px;
    }

.upload-photo-btn, .upload-video-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    font-size: 13px;
    color: #8f6915;
    border: 1px dashed #c0b17b;
    border-radius: 6px;
    background-color: #fff8eb;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .upload-photo-btn i, .upload-video-btn i {
        font-size: 14px;
        opacity: 0.8;
    }

    .upload-photo-btn:hover, .upload-video-btn:hover {
        background-color: #f7f3ed;
        border-color: #8f6915;
        color: #6f520f;
    }

    .upload-photo-btn input[type="file"],
    .upload-video-btn input[type="file"] {
        display: none;
    }


.video-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.message {
    background-color: #faf8f2;
}

.text-muted {
    font-size: 0.85rem;
}

.book-memory {
    /*background: #f8f4ec;*/
    padding: 30px;
    border-radius: 8px;
    font-family: 'Book Antiqua', serif !important;
}

    /* naslov */
    .book-memory h4 {
        color: #fff;
        font-family: 'Commercial Script BT Regular', serif !important;
        font-size: 25px;
        text-align: center;
        margin-bottom: 25px;
        font-weight: 500;
        letter-spacing: 1px;
    }

    /* pojedina poruka = stranica */
    .book-memory .message {
        /*background: #fffdf8; --> STARO; AKO NE BUDE VALJALO PROZIRNA POZADINA*/
        background: #c1c1c178;
        padding: 25px;
        margin-bottom: 25px;
        border-left: 4px solid #c9b79c;
        box-shadow: 0 4px 8px rgba(0,0,0,0.05);
        position: relative;
    }

        /* lagani papir efekt */
        .book-memory .message::before {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(to bottom, rgba(0,0,0,0.02), transparent);
            pointer-events: none;
        }

        /* ime i datum */
        .book-memory .message strong {
            color: #fff !important;
            font-size: 18px;
            font-weight: 600;
        }

        .book-memory .message span {
            font-size: 14px;
            color: #fff !important;
            margin-left: 10px;
        }

        /* tekst poruke */
        .book-memory .message p {
            color: #fff !important;
            margin-top: 10px;
            font-size: 16px;
            line-height: 1.6;
            font-weight: 600;
        }

    /* forma */
    .book-memory form {
        background: #c1c1c178;
        padding: 25px;
        border: 2px solid #e2d8c8;
        border-radius: 5px;
    }

.btn-sjecanje {
    border: none;
    text-decoration: underline;
    background: none;
    font-size: 16px;
    color: #b3b3b3;
}

    .btn-sjecanje:hover {
        cursor: pointer;
    }

.sjecanje-label {
    color: #fff;
    font-size: 14px;
}

.video-item video {
    width: 100%;
    height: 250px; /* postavi željenu visinu */
    object-fit: cover; /* ili contain ako ne želiš rezanje */
}

.tab-spomenik {
    border-bottom: none !important;
}
/*------------------OBITELJSKO STABLO-----------------*/
/*.tree-container {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    width: 100%;
    padding: 10px 0;
    box-sizing: border-box;
}

.generation {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    margin: 0 40px;
    gap: 200px;
}

.generation-2, .generation-3 {
    margin-top: 100px;
}

.generation-left .generation-right {
    gap: 150px;
}

.person {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 120px;
    padding: 10px;
    box-sizing: border-box;
    text-align: center;
    border: 2px solid #767f84;
    border-radius: 10px;
}

.tree-profile-pic {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 8px;
}

    .tree-profile-pic img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.person,
.generation {
    position: relative;
}
*/

/*---------------------------------------------------------------SVIJEĆA---------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Ubuntu:400,400i,700,700i');

header, footer {
    display: block;
}

a, a:link, a:visited {
    text-decoration: none;
}

img {
    border: 0;
}

ul {
    list-style: none;
}

.center {
    width: 585px;
    margin: 20px auto 0;
}

.holder {
    margin: 6rem auto 0;
    width: 50px;
    height: 90px;
    position: relative;
}

    .holder *, .holder *:before, .holder *:after {
        position: absolute;
        content: "";
    }

.candle {
    bottom: 0;
    width: 35px;
    height: 62.5px;
    border-radius: 75px / 20px;
    box-shadow: inset 7.5px -5px 15px 0 rgba(0, 0, 0, 0.2), inset -7.5px 0 15px 0 rgba(0, 0, 0, 0.1);
    /*background: linear-gradient(to bottom, #ffe5d9, #ffc2b3, #ffa78f, #ff8a6f);*/
    background: linear-gradient(to bottom, #c3460d, #d75e40, #cb664a, #521b0f);
}

    .candle:after {
        width: 17px;
        height: 5px;
        left: 50%;
        transform: translateX(-50%);
        border-radius: 50%;
        top: 7px;
        box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
        background: radial-gradient(rgba(0, 0, 0, 0.6), transparent 45%);
    }

.thread {
    width: 3px;
    height: 11px;
    top: -0.5px;
    left: 50%;
    z-index: 1;
    border-radius: 20% 20% 0 0;
    transform: translateX(-50%);
    background: #121212;
    background: linear-gradient(#d6994a, #4b232c, #121212, black, #e8bb31 90%);
}

.flame {
    width: 10.5px;
    height: 40px;
    left: 50%;
    transform-origin: 50% 100%;
    transform: translateX(-50%);
    bottom: 100%;
    border-radius: 60% 60% 25% 25%;
    background: rgba(255, 255, 255, 1);
    background: linear-gradient(white 80%, transparent);
    animation: moveFlame 6s linear infinite, enlargeFlame 5s linear infinite;
}
/*.flame:before {
        width: 80%;
        height: 100%;
        border-radius: inherit;
        box-shadow: 0 0 6px rgba(247,93,0,.5), 0 -3px 3px rgba(247,128,0,.8);
    }*/

@keyframes moveFlame {
    0% {
        transform: translateX(-50%) rotate(-1deg);
    }

    50% {
        transform: translateX(-48%) rotate(2deg);
    }

    100% {
        transform: translateX(-50%) rotate(-1deg);
    }
}


@keyframes enlargeFlame {
    0%, 100% {
        height: 40px;
    }

    50% {
        height: 50px;
    }
}


.glow {
    width: 5.5px;
    height: 30px;
    border-radius: 25% 25% 17.5% 17.5%;
    left: 50%;
    top: -24px;
    transform: translateX(-50%);
    background: rgba(255, 180, 80, .6);
    box-shadow: 0 -20px 20px rgba(255,140,0,.8), 0 20px 25px rgba(255,80,0,.6);
}

    .glow:before {
        width: 35%;
        height: 30%;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.35);
    }

.blinking-glow {
    width: 30px;
    height: 90px;
    left: 50%;
    top: -27.5%;
    transform: translateX(-50%);
    border-radius: 50%;
    background: #ff6000;
    filter: blur(30px);
    animation: blinkIt .1s infinite;
}

@keyframes blinkIt {
    50% {
        opacity: .8;
    }
}

.candle-off .flame,
.candle-off .glow,
.candle-off .blinking-glow {
    display: none; /* sakrijemo sve efekte */
}

.candle-off .thread {
    background: #666;
}

/*BTN UPALI SVIJECU*/
#toggleCandle {
    display: block;
    margin: 2rem auto 0;
    padding: 5px 13px;
    font-size: 1.4rem;
    letter-spacing: 0.5px;
    color: #fff;
    background: linear-gradient(145deg, #2a2a2a, #1c1c1c);
    border: 1px solid #3b3b3b;
    border-radius: 16px;
    box-shadow: inset 0 1px 1px rgba(255,255,255,0.05), inset 0 -2px 4px rgba(0,0,0,0.6), 0 6px 14px rgba(0,0,0,0.45);
    cursor: pointer;
    transition: all 0.25s ease;
}

    #toggleCandle:hover {
        color: #f2ead3;
        border-color: #6f5a2f;
        box-shadow: inset 0 1px 2px rgba(255,255,255,0.08), 0 0 14px rgba(201, 169, 87, 0.25);
    }

.candle-num {
    margin-top: 10px;
}

#toggleFlowers {
    display: block;
    margin: 2rem auto 0;
    padding: 5px 13px;
    font-size: 1.4rem;
    letter-spacing: 0.5px;
    color: #fff;
    background: linear-gradient(145deg, #2a2a2a, #1c1c1c);
    border: 1px solid #3b3b3b;
    border-radius: 16px;
    box-shadow: inset 0 1px 1px rgba(255,255,255,0.05), inset 0 -2px 4px rgba(0,0,0,0.6), 0 6px 14px rgba(0,0,0,0.45);
    cursor: pointer;
    transition: all 0.25s ease;
}

    #toggleFlowers:hover {
        color: #f2ead3;
        border-color: #6f5a2f;
        box-shadow: inset 0 1px 2px rgba(255,255,255,0.08), 0 0 14px rgba(201, 169, 87, 0.25);
    }
/*---------------------------------------------------------------MOJ PROFIL--------------------------------------------------------------*/
.moj-racun {
    color: #fff !important;
}

.oko-prikazi-lozinku {
    font-size: 19px;
    margin-top: 10px;
}

    .oko-prikazi-lozinku:hover {
        cursor: pointer;
        color: #D1A845;
    }

.tab-content-user {
    display: none;
}

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

.sidebar .list li.active a {
    font-weight: bold;
    /*color: #C89532;*/
    color: #D1A845;
}

.list-check {
    list-style: none;
    padding: 0;
    margin: 0 0 1.5rem 0;
}

.title-photo-video {
    margin-top: 50px;
}

.list-check li {
    position: relative;
    padding: 0.5rem 1rem 0.5rem 2rem;
    margin-bottom: 0.5rem;
    background: #f9f9f9;
    border-radius: 6px;
    transition: background 0.2s;
}

    /* mala “check” ikona */
    .list-check li::before {
        content: "✓";
        position: absolute;
        left: 0.5rem;
        top: 50%;
        transform: translateY(-50%);
        color: #8f6915; /* tamno zlatna boja */
        font-weight: bold;
    }

    /* hover efekt */
    .list-check li:hover {
        background: #f0e5c5; /* lagano svjetlija boja */
        cursor: default;
    }

.gal-item {
    position: relative;
}

.gal-settings {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    outline: none;
    font-size: 20px;
}

/* menu default skriven */
.gal-menu {
    position: absolute;
    top: 25px;
    right: 0;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    list-style: none;
    padding: 5px 0;
    margin: 0;
    min-width: 180px;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
    display: none;
    z-index: 10;
}

.gal-settings:focus-within .gal-menu {
    display: block;
}

.gal-menu li {
    padding: 8px 14px;
    font-size: 14px;
    white-space: nowrap;
}

    .gal-menu li:hover {
        background: #f5f5f5;
    }

.gal-menu .danger {
    color: #c0392b;
}

.textarea-div {
    max-width: 50%;
}

.service-intro {
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 15px;
}

.service-list {
    font-size: 15px;
    padding-left: 20px;
    margin-bottom: 15px;
}

.service-item {
    margin-bottom: 8px;
}

.service-price {
    font-weight: bold;
    color: #8f6915;
}

.service-note {
    font-size: 15px;
    line-height: 1.5;
}
/*---------------------------------------------------------------KREIRAJ SPOMENIK---------------------------------------------------------------*/
.create-div {
    border: 2px solid #00000021 !important;
    border-radius: 12px !important;
    padding: 25px !important;
}

/*---------------------------------------------------------------WHATSAP GUMB PRATEĆI---------------------------------------------------------------*/
#wa-container {
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 9999;
}

.wa-button {
    position: relative;
    width: 55px;
    height: 55px;
    background-color: #D1A845;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.4);
}

    .wa-button img {
        position: absolute;
        width: 45px;
        height: 45px;
    }

    .wa-button .wa-text {
        position: absolute;
        color: #fff;
        width: 152px;
        font-size: 20px;
        left: 67px;
    }
/* X gumb */
#wa-close {
    position: absolute;
    top: -8px;
    right: -8px;
    width: 22px;
    height: 22px;
    border: none;
    border-radius: 50%;
    background: #000;
    color: #fff;
    font-size: 14px;
    cursor: pointer;
}

/* hover efekt */
.wa-button:hover {
    transform: scale(1.1);
}

/*---------------------------------------------------------------KOŠARICA---------------------------------------------------------------*/
.naslov-kosarica a {
    font-family: 'Book Antiqua', serif !important;
    font-size: 18px;
    color: #888888 !important;
}

.total-row td {
    border-top: 1px solid #ddd;
    padding-top: 8px;
}

.price-col {
    text-align: right;
}
/*---------------------------------------------------------------ODABIR PROFILA-------------------------------------------------------*/
.odaberi-div {
    display: inline-block;
    transition: transform 0.7s ease, box-shadow 0.2s ease;
    cursor: pointer;
}

    .odaberi-div:hover {
        transform: scale(1.05);
    }

.odabir-profil {
    border: 2px solid #D1a845;
    border-radius: 12px;
    padding: 25px;
    min-height: 340px;
    max-height: 340px;
}

.odabir-ime a {
    color: #fff !important;
    font-family: 'Book Antiqua', serif !important;
    font-size: 18px;
}

.btn-kolicina {
    background: #D1A845;
    color: #fff;
    border: none;
    width: 26px;
    height: 26px;
    border-radius: 4px;
    font-size: 16px;
    cursor: pointer;
    line-height: 1;
    transition: background 0.2s ease;
}

    .btn-kolicina:hover {
        background: #b8902e;
    }

.kolicina-val {
    display: inline-block;
    min-width: 24px;
    text-align: center;
    font-size: 15px;
    color: #767F84;
    vertical-align: middle;
    margin: 0 4px;
}

.kosarica-nova-tablica {
    width: 100%;
    background: #F5F5F5;
    border-collapse: collapse;
    color: #333;
}

    .kosarica-nova-tablica thead tr,
    .kosarica-nova-tablica tbody tr,
    .kosarica-nova-tablica tfoot tr {
        border-bottom: 1px solid #ddd;
        margin: 0 5%;
    }

    .kosarica-nova-tablica th,
    .kosarica-nova-tablica td {
        padding: 12px 8px;
        font-size: 14px;
    }

.kosarica-nova-header th {
    font-size: 13px;
    color: #555;
    font-weight: 600;
}

.kn-naziv {
    width: 40%;
    text-align: left;
}

.kn-kolicina {
    width: 20%;
    text-align: center;
}

.kn-cijena {
    width: 13%;
    text-align: right;
}

.kn-ukupno {
    width: 17%;
    text-align: right;
}

.kn-akcija {
    width: 10%;
    text-align: center;
}

.kosarica-nova-tablica .fa-trash {
    cursor: pointer;
    font-size: 1.1rem;
    color: #999;
    transition: color 0.2s;
}

    .kosarica-nova-tablica .fa-trash:hover {
        color: #c0392b;
    }

.kn-ukupno-red td {
    padding-top: 16px;
    font-size: 15px;
}
/*---------------------------------------------------------------KOŠARICA -> KRAJ---------------------------------------------------------------*/
/*---------------------------------------------------------------SHOP---------------------------------------------------------------*/
.naziv-artikla {
    color: #fff !important;
    font-family: 'Book Antiqua', serif !important;
}

.dodaj-u-kosaricu {
    display: block;
    background: #D1A845;
    color: #fff !important;
    border: none;
    padding: 12px 20px;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s ease;
    width: 100%;
    text-align: center;
}

    .dodaj-u-kosaricu:hover {
        background: #c1c1c178;
    }
/*---------------------------------------------------------------SHOP -> KRAJ---------------------------------------------------------------*/
.product-default .product-title,
.product-default .product-title a,
a.product-title-osnovni,
a.profile-title-premium {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
}

.osnovni-profil-brdr .product-details {
    height: 115px;
    overflow: hidden;
}


/*---------------------------------------------------------------LAPTOPI---------------------------------------------------------------*/
@media (min-width: 1024px) and (max-width: 1440px) {
    .banner-text {
        font-size: 42px;
    }
}
/*---------------------------------------------------------------TABLETI---------------------------------------------------------------*/
@media (min-width: 768px) and (max-width: 1024px) {
    .header-middle-margin {
        margin-bottom: 0;
    }

    .btn-kreiraj-profil {
        left: 50%;
        transform: translateX(-50%);
    }

    .generation-2 {
        gap: 0;
    }

    .banner-text {
        font-size: 29px;
    }

    .sjecanja-div {
        width: 960px;
    }
}
/*---------------------------------------------------------------MOBITELI---------------------------------------------------------------*/
@media(max-width: 700px) {
    .pretrazi-div {
        width: auto;
        /*width: 155px;*/
    }

    .odabir-profil {
        min-height: 248px;
        max-height: 248px;
    }

    .wa-text {
        display: none !important;
    }

    .section-explore-big {
        padding: 0px !important;
    }

    #header-logo {
        margin-left: 30px;
        height: 90px;
    }

    .ponuda-icon {
        padding: 25px;
    }

    .naslov-profila > a,
    .naslov-profila-osnovni > a {
        font-size: 24px;
    }

    .header-top {
        padding: 10px !important;
    }

    .icon-menu {
        color: #fff;
    }

    .header-middle-margin {
        margin-bottom: 0;
    }

    .home-banner {
        height: auto;
    }

        .home-banner img {
            height: auto;
            object-fit: contain;
        }

        .home-banner:first-child {
            padding: 0 !important;
        }

    .secion-col {
        display: flex;
    }



    /*.section-usluge h2 {
        font-size: 15px !important;
    }*/

    .subtit-big {
        font-size: 20px !important;
    }

    .subtit {
        font-size: 10px !important;
    }

    .mobile-link {
        font-size: 18px;
    }

    .social-icon-mobile {
        width: 20px;
        margin-left: 10px;
    }

        .social-icon-mobile > i {
            font-size: 20px;
        }

    .footer .text-muted {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

        .footer .text-muted::before {
            margin-left: auto;
            margin-right: auto;
        }

    #foot-logo {
        display: flex;
        justify-content: center;
    }

    .ponuda-icon {
        width: 100%;
        margin: auto;
    }

    .secion-col-privacy {
        margin-bottom: 15px;
    }

    .section-usluge {
        text-align: center !important;
        margin-top: 10px;
        flex: 1;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        margin-left: 27px;
        margin-right: 27px;
    }

    .section-explore-bottom {
        margin-left: 27px;
        margin-right: 27px;
    }

    .privacy-div {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: 100%;
        text-align: center;
    }

    .img-icon-privacy {
        height: 40px !important;
        /*margin: 20px 0 !important;*/
        width: auto !important;
    }

    /*SVJEĆA*/

    .center {
        width: 90%; /* centriranje i prilagodba širine */
        margin: 20px auto 0;
    }

    .holder {
        width: 35px;
        height: 60px;
        margin: 4rem auto 0;
    }

    .candle {
        width: 35px;
        height: 60px; /* proporcionalno smanjeno */
        border-radius: 52.5px / 14px;
        box-shadow: inset 5px -3px 10px 0 rgba(0,0,0,0.2), inset -5px 0 10px 0 rgba(0,0,0,0.1);
    }

        .candle:after {
            width: 12px;
            height: 3px;
            top: 4px;
        }

    .thread {
        width: 2px;
        height: 7px;
        top: -0.3px;
        border-radius: 13% 13% 0 0;
    }

    .flame {
        width: 7px;
        height: 20px !important;
        border-radius: 40% 57% 9% 7%;
    }

    .glow {
        width: 3.5px;
        height: 20px;
        border-radius: 17% 17% 11% 11%;
        top: -15px;
        box-shadow: 0 -12px 10px 0 #dc8a0c, 0 12px 15px 0 #dc8a0c, inset 1px 0 0.5px rgba(0,133,255,0.6), inset -1px 0 0.5px rgba(0,133,255,0.6);
    }

        .glow:before {
            width: 25%;
            height: 20%;
        }

    .blinking-glow {
        width: 20px;
        height: 60px;
        top: -30%;
        filter: blur(20px);
    }



    .memmory-wrapper {
        left: 0 !important;
        top: 15%;
    }

    .video-grid {
        grid-template-columns: 1fr;
    }

    .textarea-div {
        max-width: 100%;
    }

    .profile-header {
        display: block;
    }

    .profile-text {
        text-align: center;
    }

    .profile-years-osnovni-div {
        font-size: 10px !important;
    }

    .div-ponuda {
        margin-bottom: 50px;
    }

    .product-title a {
        font-size: 20px !important;
    }

    .product-title-osnovni {
        font-size: 35px !important;
    }

    .music-wrapper {
        top: auto;
        right: auto;
        bottom: 20px;
        left: 20px;
    }

        .music-wrapper .btn-play {
            padding: 8px 10px;
            font-size: 14px;
        }

    /*FAMILY TREE*/
    .generation-2 {
        gap: 600px;
        margin-left: 240px;
    }

    .detalji-div {
        position: relative;
        left: 12px;
        top: 25px;
    }

    .slika-div {
        left: 15px;
    }

    .angel-pretext {
        display: none;
    }

    .angel-wrapper {
        left: 0;
        top: 94px;
    }

    .memmory-wrapper {
        display: none;
    }

    .banner-text {
        width: 100%;
        text-align: center;
        font-size: 25px;
    }

    #opis-kratki {
        font-size: 16px;
    }

    .btn-kreiraj-profil {
        left: 50%;
        transform: translateX(-50%);
    }

    .detailed-description {
        padding: 0 !important;
    }

    .sjecanja-div {
        width: 410px;
    }

    .gallery-grid {
        grid-template-columns: repeat(4, 1fr);
    }

    .plan-features, .plan-features-dodatno {
        max-width: 100%; /* Poništava fiksnu širinu od 320px na mobitelima */
        width: 100%;
        padding-left: 0;
        margin-left: 0;
    }

    .profil-paket {
        padding: 25px 15px; /* Smanjuje lijevi/desni padding na 15px da tekst dobije mjesta */
    }

    .plan-features li, .plan-features-dodatno li {
        word-break: normal; /* Vraća prelamanje riječi na normalno */
        overflow-wrap: normal;
        padding-left: 20px; /* Smanjuje razmak između teksta i kvačice samo malo */
    }
    /* ------------------------------------- */
    .description-det {
        font-size: 14px !important;
    }

    .angel-image {
        width: 90px;
        height: 90px;
    }

    .pozadinska-slika {
        height: 105px;
    }

    .blok-product {
        min-height: 250px !important;
        max-height: 250px !important;
    }
    .osnovni-profil-img {
        height: 100px;
    }
    
    .osnovni-profil-brdr .product-details {
        height: 54px;
        overflow: hidden;
    }
}


/*QR KOD PLOČIUCA*/
.qr-plocica-link {
    display: block;
    max-width: 800px;
    margin: 0 auto;
}

.qr-plocica-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 18px;
}