﻿.ticket-site-header {
    width: 100%;
    position: relative;
    z-index: 1000;
    background: transparent;
    box-sizing: border-box;
}

.ticket-site-header,
.ticket-site-header * {
    box-sizing: border-box;
}

.ticket-header {
    width: 100%;
    padding: 5px 28px;
    display: flex;
    align-items: center;
    position: relative;
}

.ticket-header-bar {
    flex: 0 0 auto;
    float: left;
}

.ticket-logo {
    display: block;
    margin: 5px 10px 5px 0;
    text-decoration: none;
}

.ticket-logo img {
    display: block;
    width: 150px;
    height: auto;
    max-width: none;
}

.ticket-main-nav {
    margin-left: auto;
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.ticket-main-nav > a,
.ticket-nav-item > a {
    display: block;
    position: relative;
    margin: 0;
    padding: .5em .8em;

    color: #222222;
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    text-transform: uppercase;
    text-decoration: none;

    transition: color .25s ease;
    white-space: nowrap;
}

.ticket-main-nav > a:hover,
.ticket-nav-item > a:hover {
    color: #B58A3B;
    text-decoration: none;
}

.ticket-lang {
    font-size: 11px !important;
}

.ticket-nav-item {
    position: relative;
}

.ticket-arrow {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-left: 6px;
    margin-bottom: 3px;

    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;

    transform: rotate(45deg);
}

.ticket-submenu {
    position: absolute;
    top: 100%;
    left: 0;

    width: 210px;
    padding: .65em 0;

    background: #fff;
    border-radius: 4px;

    box-shadow:
        0 0 0 1px rgba(0,0,0,.1),
        0 3px 12px rgba(0,0,0,.12);

    opacity: 0;
    pointer-events: none;
    transform: scaleY(.9);
    transform-origin: top;

    transition:
        transform .25s ease,
        opacity .25s ease;

    z-index: 100;
}

.ticket-nav-item:hover > .ticket-submenu {
    opacity: 1;
    pointer-events: auto;
    transform: scaleY(1);
}

.ticket-submenu a {
    display: block;
    padding: .55em 1.4em;

    color: #353535;
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;

    text-transform: none;
    text-align: left;
    text-decoration: none;

    white-space: normal;
}

.ticket-submenu a:hover {
    color: #B58A3B;
    text-decoration: none;
}

.ticket-main-nav > .ticket-buy {
    background: #B58A3B;
    color: #fff !important;

    padding: 5px 15px;
    margin-left: 50px;

    text-decoration: none;
}

.ticket-main-nav > .ticket-buy:hover {
    background: #B58A3B;
    color: #fff !important;
}

.ticket-menu-toggle {
    display: none;
    margin-left: auto;
    width: 34px;
    height: 34px;
    padding: 5px;

    border: 0;
    background: transparent;
    cursor: pointer;
}

.ticket-menu-toggle span {
    display: block;
    width: 23px;
    height: 2px;
    margin: 5px 0;
    background: #222;
}

.ticket-mobile-menu {
    display: none;
}

.ticket-buy-mobile-header,
.ticket-mobile-close {
    display: none;
}

@media (max-width: 1100px) {

    .ticket-header {
        min-height: 62px;
        padding: 5px 5%;
    }

    .ticket-logo img {
        width: 150px;
        max-width: 150px;
    }

    .ticket-main-nav {
        display: none;
    }

    .ticket-menu-toggle {
        display: block;
    }

    .ticket-mobile-menu {
        position: fixed;
        top: 0;
        right: -300px;

        display: block;

        width: 300px;
        height: 100vh;

        padding: 70px 30px 30px;

        overflow-y: auto;

        background: #fff;

        box-shadow: none;

        transition: right .3s ease;

        z-index: 11111;
    }

    .ticket-mobile-close {
        position: absolute;
        top: 15px;
        right: 20px;

        display: block;

        width: 34px;
        height: 34px;
        padding: 0;

        border: 0;
        background: transparent;

        color: #222;
        font-size: 30px;
        line-height: 1;

        cursor: pointer;
    }

    .ticket-mobile-menu.open {
        right: 0;
        box-shadow: -6px 0 20px 5px rgba(0,0,0,.1);
    }

    .ticket-mobile-menu > a,
    .ticket-mobile-parent {
        display: block;
        width: 100%;

        padding: 10px 0;

        border: 0;
        border-bottom: 1px solid rgba(0,0,0,.08);

        background: transparent;

        color: #222;
        font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
        font-size: 13px;
        font-weight: 600;
        line-height: 1.5;

        text-align: left;
        text-transform: uppercase;
        text-decoration: none;

        cursor: pointer;
    }

    .ticket-mobile-parent {
        position: relative;
    }

    .ticket-mobile-parent span {
        position: absolute;
        right: 4px;
        top: 10px;
    }

    .ticket-mobile-submenu {
        display: none;
        padding: 5px 0 10px 12px;
    }

    .ticket-mobile-submenu.open {
        display: block;
    }

    .ticket-mobile-submenu a {
        display: block;
        padding: 7px 0;

        color: #555;
        font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
        font-size: 12px;
        font-weight: 400;

        text-transform: none;
        text-decoration: none;
    }

    .ticket-mobile-menu > .ticket-buy-mobile {
        width: 100px;

        margin: 10px 0;
        padding: 10px 15px;

        border-radius: 4px;
        border-bottom: 0;

        background: #B58A3B;
        color: #fff !important;

        text-align: center;
    }

    .ticket-mobile-language {
        margin-top: 15px;
    }
}

@media (max-width: 480px) {

    .ticket-mobile-menu {
        width: 280px;
        right: -280px;
    }

    .ticket-logo img {
        width: 135px;
    }
}

/* =========================================================
   NARODNO POZORISTE - REPERTOAR
   ========================================================= */

.np-repertoire {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px 70px;
    box-sizing: border-box;
}

.np-repertoire-card {
    min-height: 194px;
    margin-bottom: 20px;
    display: grid;
    grid-template-columns: 190px 195px minmax(0, 1fr) 220px;
    align-items: stretch;
    background: #fff;
    border: 1px solid #e4d7c4;
    box-sizing: border-box;
    overflow: hidden;
}

.np-repertoire-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #111;
    text-align: center;
}

.np-repertoire-day-number {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 43px;
    font-weight: 400;
    line-height: 1;
    margin-bottom: 16px;
}

.np-repertoire-month {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 16px;
    text-transform: uppercase;
    line-height: 1;
    margin-bottom: 12px;
}

.np-repertoire-weekday {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 12px;
    line-height: 1;
}

.np-repertoire-poster {
    width: 195px;
    height: 194px;
    overflow: hidden;
}

.np-repertoire-poster img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.np-repertoire-content {
    min-width: 0;
    padding: 33px 28px 28px 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.np-repertoire-title {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 34px;
    font-weight: 400;
    line-height: 1.15;
    color: #292929;
}

.np-repertoire-meta {
    display: flex;
    align-items: center;
    gap: 28px;
    color: #4d4d4d;
    font-size: 14px;
}

.np-repertoire-meta-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.np-repertoire-icon {
    color: #c38c33;
    font-size: 18px;
    line-height: 1;
}

.np-repertoire-action {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.np-repertoire-buy {
    min-width: 150px;
    height: 40px;
    padding: 0 20px;
    border: 1px solid #c18c36;
    background: transparent;
    color: #c18c36;
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    transition: background .2s ease, color .2s ease;
}

.np-repertoire-buy:hover {
    background: #c18c36;
    color: #fff;
}

.np-repertoire-soldout {
    min-width: 150px;
    padding: 12px 18px;
    border: 1px solid #aaa;
    color: #777;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
}

.np-repertoire-card.is-sold-out {
    opacity: .65;
}

@media (max-width: 900px) {

    .np-repertoire-card {
        grid-template-columns: 105px 140px minmax(0, 1fr);
        min-height: 150px;
    }

    .np-repertoire-poster {
        width: 140px;
        height: 150px;
    }

    .np-repertoire-action {
        grid-column: 3;
        padding: 0 20px 20px;
        justify-content: flex-start;
    }

    .np-repertoire-content {
        padding: 24px 20px 10px;
    }

    .np-repertoire-title {
        font-size: 27px;
    }

    .np-repertoire-day-number {
        font-size: 34px;
    }
}

@media (max-width: 650px) {

    .np-repertoire {
        padding: 0 14px 50px;
    }

    .np-repertoire-card {
        display: grid;
        grid-template-columns: 90px 1fr;
    }

    .np-repertoire-date {
        grid-row: 1 / span 2;
    }

    .np-repertoire-poster {
        width: 100%;
        height: 210px;
    }

    .np-repertoire-content {
        grid-column: 1 / -1;
        padding: 20px;
    }

    .np-repertoire-action {
        grid-column: 1 / -1;
        padding: 0 20px 20px;
    }

    .np-repertoire-title {
        font-size: 26px;
        margin-bottom: 24px;
    }

    .np-repertoire-meta {
        flex-wrap: wrap;
        gap: 16px 22px;
    }
}


/* =========================================================
   REPERTOAR - WORDPRESS MATCH PASS 2
   ========================================================= */

.np-repertoire {
    max-width: 1330px;
    padding-left: 0;
    padding-right: 0;
}

.np-repertoire-card {
    min-height: 172px;
    grid-template-columns: 170px 195px minmax(0, 1fr) 210px;
    margin-bottom: 18px;
}

.np-repertoire-date {
    min-height: 172px;
}

.np-repertoire-day-number {
    font-size: 38px;
    margin-bottom: 14px;
}

.np-repertoire-month {
    font-size: 14px;
    margin-bottom: 10px;
}

.np-repertoire-weekday {
    font-size: 11px;
}

.np-repertoire-poster {
    width: 195px;
    height: 172px;
}

.np-repertoire-content {
    padding: 28px 24px 24px 22px;
    justify-content: flex-start;
}

.np-repertoire-title {
    font-size: 31px;
    line-height: 1.1;
    margin-bottom: 42px;
}

.np-repertoire-meta {
    gap: 26px;
    font-size: 13px;
}

.np-repertoire-meta-item {
    gap: 9px;
}

.np-repertoire-action {
    padding: 20px 28px;
}

.np-repertoire-buy {
    min-width: 145px;
    height: 38px;
    font-size: 11px;
}


/* =========================================================
   REPERTOAR - TYPOGRAPHY + SPACING PASS 3
   ========================================================= */

.np-repertoire-card {
    min-height: 176px;
}

.np-repertoire-date {
    min-height: 176px;
}

.np-repertoire-day-number,
.np-repertoire-month,
.np-repertoire-weekday {
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 400;
}

.np-repertoire-day-number {
    font-size: 40px;
    line-height: 1;
    margin-bottom: 13px;
}

.np-repertoire-month {
    font-size: 15px;
    line-height: 1;
    margin-bottom: 10px;
}

.np-repertoire-weekday {
    font-size: 12px;
    line-height: 1.2;
}

.np-repertoire-poster {
    height: 176px;
}

.np-repertoire-content {
    padding: 27px 24px 22px 22px;
}

.np-repertoire-title {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.12;
    margin-bottom: 34px;
    color: #262626;
}

.np-repertoire-meta {
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    gap: 24px;
}

.np-repertoire-buy {
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
}


/* =========================================================
   REPERTOAR - DODATNI PODACI IZ SELFPAY
   ========================================================= */

.np-repertoire-content {
    justify-content: flex-start;
}

.np-repertoire-title {
    margin-bottom: 20px;
}

.np-repertoire-meta {
    margin-bottom: 14px;
}

.np-repertoire-description {
    max-width: 720px;
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.55;
    color: #666;
}

.np-repertoire-description p {
    margin: 0 0 6px;
}

.np-repertoire-description p:last-child {
    margin-bottom: 0;
}

.np-repertoire-description br {
    line-height: 1.35;
}


/* =========================================================
   REPERTOAR - FIXED CARD HEIGHT + CLAMPED DESCRIPTION
   ========================================================= */

.np-repertoire-card {
    height: 176px;
    min-height: 176px;
    max-height: 176px;
}

.np-repertoire-date {
    height: 176px;
    min-height: 176px;
}

.np-repertoire-poster {
    height: 176px;
}

.np-repertoire-content {
    height: 176px;
    box-sizing: border-box;
    padding: 22px 24px 18px 22px;
    overflow: hidden;
}

.np-repertoire-title {
    margin-bottom: 12px;
    font-size: 30px;
    line-height: 1.08;
}

.np-repertoire-meta {
    margin-bottom: 10px;
}

.np-repertoire-description {
    max-width: 760px;
    margin: 0;
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 13px;
    line-height: 1.45;
    color: #666;
}

.np-repertoire-description p {
    display: inline;
    margin: 0;
}

.np-repertoire-description p + p::before {
    content: " ";
}

.np-repertoire-action {
    height: 176px;
    box-sizing: border-box;
}



/* =========================================================
   NARODNO POZORISTE - PAYMENT FOOTER
   Raspored i grupisanje payment oznaka ostaju nepromenjeni.
   ========================================================= */

#copy-rights {
    background: #fff !important;
    background-image: none !important;
    min-height: 110px !important;
    border-top: 1px solid #e8ded0;
    color: #555 !important;
    padding: 18px 0 14px;
    box-sizing: border-box;
}

#copy-rights .contain {
    width: 100%;
    max-width: 1330px;
    margin: 0 auto;
    padding: 0 24px;
    box-sizing: border-box;
    text-align: center;
}

#copy-rights .payments {
    text-align: center;
}

#copy-rights .payments > div {
    vertical-align: middle;
}

#copy-rights .payments img {
    object-fit: contain;
    vertical-align: middle;
}

#copy-rights .payments p {
    margin-top: 12px !important;
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 12px;
    color: #777 !important;
}

#copy-rights .payments p span,
#copy-rights .payments p a {
    color: #777 !important;
}

#copy-rights .payments p a {
    text-decoration: none;
}

#copy-rights .payments p a:hover {
    color: #b58a3b !important;
}

/* Mobile - zadrzavamo originalni raspored i grupe */
#copy-rights .payments-mob {
    color: #555;
}

#copy-rights .payments-mob img {
    max-width: 70px;
    max-height: 55px;
    object-fit: contain;
}

#copy-rights .payments-mob p,
#copy-rights .payments-mob p span,
#copy-rights .payments-mob p a {
    color: #777 !important;
}

@media screen and (max-width: 600px) {

    #copy-rights {
        padding: 20px 0;
    }

    #copy-rights .contain {
        padding: 0 16px;
    }
}


/* =========================================================
   PAYMENT FOOTER - COMPACT PASS
   ========================================================= */

#copy-rights {
    min-height: 90px !important;
    padding: 10px 0 8px !important;
}

#copy-rights .contain {
    max-width: 1330px;
}

#copy-rights .payments > div {
    margin-top: 0 !important;
    padding-top: 2px;
    padding-bottom: 2px;
}

#copy-rights .payments p {
    margin-top: 6px !important;
    margin-bottom: 0 !important;
    line-height: 1.3;
}


/* =========================================================
   PAYMENT FOOTER - DARK VERSION
   ========================================================= */

#copy-rights {
    background: #1f1f1f !important;
    background-image: none !important;
    border-top: 1px solid #2f2f2f;
    color: #d6d6d6 !important;
}

#copy-rights .payments p,
#copy-rights .payments p span,
#copy-rights .payments p a,
#copy-rights .payments-mob p,
#copy-rights .payments-mob p span,
#copy-rights .payments-mob p a {
    color: #d6d6d6 !important;
}

#copy-rights .payments p a:hover,
#copy-rights .payments-mob p a:hover {
    color: #b58a3b !important;
}


/* =========================================================
   PAYMENT FOOTER - BRAND GOLD
   ========================================================= */

#copy-rights {
    background: #B58A3B !important;
    background-image: none !important;
    border-top: 1px solid #A97E31;
    color: #fff !important;
}

#copy-rights .payments p,
#copy-rights .payments p span,
#copy-rights .payments p a,
#copy-rights .payments-mob p,
#copy-rights .payments-mob p span,
#copy-rights .payments-mob p a {
    color: #fff !important;
}

#copy-rights .payments p a:hover,
#copy-rights .payments-mob p a:hover {
    color: #f3e7cf !important;
}


/* =========================================================
   PAYMENT FOOTER - MUTED GOLD
   ========================================================= */

#copy-rights {
    background: #504d4d !important;
    background-image: none !important;
    border-top: 1px solid #504d4d;
    color: #fff !important;
}

#copy-rights .payments p,
#copy-rights .payments p span,
#copy-rights .payments p a,
#copy-rights .payments-mob p,
#copy-rights .payments-mob p span,
#copy-rights .payments-mob p a {
    color: #f3ede3 !important;
}

#copy-rights .payments p a:hover,
#copy-rights .payments-mob p a:hover {
    color: #fff !important;
}


/* =========================================================
   SHOW OFFER - PAGE LAYOUT ALIGNMENT
   ========================================================= */

/* Naslov stranice */
.banner {
    min-height: 0 !important;
    height: auto !important;
    padding: 62px 20px 48px !important;
    margin: 0 !important;
    background: #fff !important;
}

.banner h1 {
    margin: 0 !important;
    padding: 0 !important;
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 38px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    color: #1f1f1f !important;
    text-align: center;
}

.banner .red-separator {
    width: 58px !important;
    height: 2px !important;
    margin: 18px auto 0 !important;
    background: #B58A3B !important;
}

/* Zona repertoara */
.banner + .d-flex {
    min-height: 0 !important;
    padding: 0 0 64px !important;
    margin: 0 !important;
    align-items: flex-start !important;
}

.np-repertoire {
    margin-top: 0 !important;
}

/* Manje praznog prostora pre footera kada nema mnogo predstava */
#copy-rights {
    margin-top: 0 !important;
}

@media (max-width: 768px) {

    .banner {
        padding: 40px 16px 34px !important;
    }

    .banner h1 {
        font-size: 31px !important;
    }

    .banner + .d-flex {
        padding-bottom: 42px !important;
    }
}


/* =========================================================
   STICKY FOOTER
   Kratak sadrzaj -> footer na dnu viewporta
   Dug sadrzaj   -> footer ide posle sadrzaja
   ========================================================= */

html,
body {
    min-height: 100%;
}

body.layout-fixed.aside-collapsed-text {
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
}

body.layout-fixed.aside-collapsed-text > .ticket-site-header {
    flex: 0 0 auto;
}

body.layout-fixed.aside-collapsed-text > .ticket-site-header + div {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
}

body.layout-fixed.aside-collapsed-text > .ticket-site-header + div > section {
    flex: 1 0 auto;
}

/* Footer ostaje normalan deo dokumenta */
#copy-rights {
    flex-shrink: 0;
}


/* =========================================================
   STICKY FOOTER - FINAL FIX
   ========================================================= */

html {
    min-height: 100%;
}

body.layout-fixed.aside-collapsed-text {
    min-height: 100vh !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

body.layout-fixed.aside-collapsed-text > .ticket-site-header {
    flex: 0 0 auto !important;
}

body.layout-fixed.aside-collapsed-text > .ticket-site-header + div {
    flex: 1 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
}

body.layout-fixed.aside-collapsed-text > .ticket-site-header + div > section {
    flex: 1 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100%;
}

/*
   Ako je sadrzaj kratak, auto margina gura footer do dna.
   Ako je sadrzaj dugacak, footer normalno ide nakon sadrzaja.
*/
body.layout-fixed.aside-collapsed-text #copy-rights {
    margin-top: auto !important;
    flex: 0 0 auto !important;
}


/* =========================================================
   PAGE SHELL / STICKY FOOTER - FINAL
   ========================================================= */

html,
body {
    min-height: 100%;
}

body.layout-fixed.aside-collapsed-text {
    min-height: 100vh !important;
    display: flex !important;
    flex-direction: column !important;
}

.ticket-site-header {
    flex: 0 0 auto !important;
}

.ticket-page-shell {
    flex: 1 0 auto !important;
    width: 100%;
    display: flex !important;
    flex-direction: column !important;
}

.ticket-page-content {
    flex: 1 0 auto !important;
    width: 100%;
    display: flex !important;
    flex-direction: column !important;
}

.ticket-repertoire-section {
    flex: 0 0 auto;
}

.ticket-page-content > #copy-rights {
    margin-top: auto !important;
    flex: 0 0 auto !important;
}


/* =========================================================
   SHOW SEATS - RIGHT PANEL
   Ne diramo levi deo / mapu sedista
   ========================================================= */

.seats-page-wrapper {
    background: #fff !important;
}

/* Samo desna strana */
.seats-page-wrapper > .seats-right {
    padding: 46px 48px 42px !important;
    box-sizing: border-box;
    background: #fff !important;
}

/* Glavni wrapper detalja */
.seats-right .movie-container {
    width: 100% !important;
    max-width: 680px;
    margin: 0 auto;
    align-items: stretch !important;
}

/* Naslov predstave */
.seats-right .movie-container > h1 {
    margin: 0 0 8px !important;
    padding: 0 !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 34px !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;

    color: #252525 !important;
    text-align: left !important;
    text-transform: none !important;
}

.seats-right .movie-container > h1 b {
    font-weight: 400 !important;
}

/* Stari dekorativni divider smanjujemo */
.seats-right .divider {
    width: 100% !important;
    margin: 22px 0 26px !important;
    opacity: .65;
}

.seats-right .divider img {
    display: block;
    width: 100% !important;
    max-height: 28px;
    object-fit: contain;
}

/* Opis */
.seats-right .description-list-container {
    width: 100%;
    padding: 0 0 26px !important;

    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.65;
    color: #555;
}

.seats-right .description-list-container p {
    margin: 0 0 10px !important;
    color: #555 !important;
}

.seats-right .description-list-container p:last-child {
    margin-bottom: 0 !important;
}

.seats-right .description-list-container h1,
.seats-right .description-list-container h2,
.seats-right .description-list-container h3,
.seats-right .description-list-container h4 {
    margin-top: 0;
    color: #333;
}

/* Cenovnik */
.seats-right .top-flex-container {
    width: 100%;
    margin-top: 0 !important;
    padding: 22px 0 !important;

    border-top: 1px solid #e4d7c4 !important;
    border-bottom: 1px solid #e4d7c4 !important;

    align-items: stretch !important;
}

/* CENOVNIK */
.seats-right .top-flex-container > h4 {
    margin: 0 0 18px !important;

    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: .04em;
    color: #333;

    text-align: left;
}

/* Lista cena */
.seats-right .ticket-types {
    width: 100% !important;
}

.seats-right .ticket-types > div {
    width: 100%;
    min-height: 34px;
    padding: 5px 0;

    border-bottom: 1px solid #f0ebe4;

    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 14px;
    color: #555;
}

.seats-right .ticket-types > div:last-child {
    border-bottom: 0;
}

.seats-right #seating-tipe {
    color: #444;
}

.seats-right .ticket-types small {
    font-size: 14px;
    color: #555;
}

/* Responsive desni panel */
@media (max-width: 900px) {

    .seats-page-wrapper > .seats-right {
        padding: 32px 24px !important;
    }

    .seats-right .movie-container {
        max-width: none;
    }

    .seats-right .movie-container > h1 {
        font-size: 28px !important;
    }
}


/* =========================================================
   SHOW SEATS - RIGHT PANEL POLISH
   ========================================================= */

.seats-page-wrapper > .seats-right {
    padding-top: 28px !important;
    padding-bottom: 32px !important;
}

.seats-right .movie-container {
    max-width: 700px;
}

/* Naslov predstave */
.seats-right .movie-container > h1 {
    margin-bottom: 6px !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 31px !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;

    color: #252525 !important;
    text-align: left !important;
}

.seats-right .movie-container > h1 b {
    font-weight: 400 !important;
}

/* Datum/vreme koje vec postoji ispod naslova */
.seats-right .movie-container h1 + * {
    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
}

/* Dekorativna linija */
.seats-right .divider {
    margin: 18px 0 22px !important;
    opacity: .45;
}

.seats-right .divider img {
    max-height: 20px;
}

/* Opis predstave */
.seats-right .description-list-container {
    padding-bottom: 22px !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
    color: #5c5c5c !important;
}

.seats-right .description-list-container p {
    color: #5c5c5c !important;
    margin-bottom: 8px !important;
}

.seats-right .description-list-container strong,
.seats-right .description-list-container b {
    color: #333 !important;
    font-weight: 600;
}

/* Cenovnik */
.seats-right .top-flex-container {
    padding: 18px 0 !important;
    border-top: 1px solid #e4d7c4 !important;
    border-bottom: 1px solid #e4d7c4 !important;
}

.seats-right .top-flex-container > h4 {
    margin-bottom: 14px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: .05em;
    color: #2f2f2f !important;
}

.seats-right .ticket-types > div {
    min-height: 30px;
    padding: 4px 0 !important;
    border-bottom: 1px solid #f2ece4;
}

.seats-right .ticket-types > div:last-child {
    border-bottom: 0;
}

.seats-right #seating-tipe,
.seats-right .ticket-types small {
    font-size: 13px !important;
    color: #555 !important;
}

/* Responsive */
@media (max-width: 900px) {

    .seats-page-wrapper > .seats-right {
        padding: 24px 20px 28px !important;
    }

    .seats-right .movie-container > h1 {
        font-size: 27px !important;
    }
}


/* =========================================================
   SHOW SEATS - DETAIL DIVIDER
   ========================================================= */

.seats-right .np-detail-divider {
    width: 58px;
    height: 2px;
    margin: 18px 0 24px;
    background: #B58A3B;
}


/* =========================================================
   NARODNO POZORISTE - TERMS OF USE
   ========================================================= */

.np-terms-page {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 62px 32px 80px;
    box-sizing: border-box;

    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    color: #555;
}

/* Glavni naslov */
.np-terms-page > h3 {
    margin: 0 0 48px;
    padding: 0;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 40px;
    font-weight: 400;
    line-height: 1.15;
    color: #252525;
}

/* Zlatna linija ispod glavnog naslova */
.np-terms-page > h3::after {
    content: "";
    display: block;
    width: 58px;
    height: 2px;
    margin-top: 18px;
    background: #B58A3B;
}

/* Naslovi sekcija */
.np-terms-page h5 {
    margin: 34px 0 10px;
    padding: 0;

    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.35;
    color: #333;
}

/* Prvi naslov sekcije */
.np-terms-page > h3 + h5 {
    margin-top: 0;
}

/* Tekst */
.np-terms-page p {
    margin: 0;
    padding: 0;

    font-size: 15px;
    font-weight: 400;
    line-height: 1.75;
    color: #5d5d5d;
}

/* Stari br elementi su koristili veliki razmak.
   Sada ih drzimo pod kontrolom. */
.np-terms-page > br {
    display: none;
}

/* Liste */
.np-terms-page ul {
    margin: 10px 0 20px;
    padding-left: 20px;
    list-style: none;
}

.np-terms-page li {
    position: relative;
    margin-bottom: 7px;
    padding-left: 18px;

    font-size: 15px;
    line-height: 1.7;
    color: #5d5d5d;
}

.np-terms-page li::before {
    content: "•";
    position: absolute;
    left: 0;
    color: #B58A3B;
}

/* Linkovi */
.np-terms-page a {
    color: #9A722C;
    text-decoration: none;
}

.np-terms-page a:hover {
    text-decoration: underline;
}

/* Suptilna podela izmedju vecih celina */
.np-terms-page h5:not(:first-of-type) {
    padding-top: 4px;
}

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

    .np-terms-page {
        padding: 40px 20px 60px;
    }

    .np-terms-page > h3 {
        margin-bottom: 36px;
        font-size: 32px;
    }

    .np-terms-page h5 {
        margin-top: 28px;
        font-size: 18px;
    }

    .np-terms-page p,
    .np-terms-page li {
        font-size: 14px;
        line-height: 1.7;
    }
}


/* =========================================================
   PAGE SCROLL FIX
   ========================================================= */

html {
    height: auto !important;
    min-height: 100%;
    overflow-y: auto !important;
}

body.layout-fixed.aside-collapsed-text {
    height: auto !important;
    min-height: 100vh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.ticket-page-shell {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

.ticket-page-content {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
}

.np-terms-page {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}


/* =========================================================
   NARODNO POZORISTE - PAGE HERO
   WordPress struktura: tekst levo / fotografija desno
   ========================================================= */

.np-page-hero {
    width: 100%;
    background: #f7f6f3;
}

.np-page-hero-inner {
    width: 100%;
    min-height: 330px;

    display: grid;
    grid-template-columns: 1fr 1fr;
}

/* Leva polovina */
.np-page-hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    padding: 55px 7vw;
    box-sizing: border-box;
}

.np-page-hero-copy h1 {
    margin: 0;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 46px;
    font-weight: 400;
    line-height: 1.05;

    color: #272727;
}

.np-page-hero-divider {
    width: 60px;
    height: 2px;

    margin: 22px 0 20px;

    background: #b58a3b;
}

.np-page-hero-copy p {
    margin: 0;

    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 17px;
    line-height: 1.5;

    color: #555;
}

/* Desna polovina */
.np-page-hero-image {
    min-height: 330px;

    background-image:
        url("https://testsajt.narodnopozoristenis.rs/wp-content/uploads/2026/06/ChatGPT-Image-11.-%D1%98%D1%83%D0%BD-2026.-10_54_58-e1781169687451.png");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Stari ShowOffer banner vise ne prikazujemo */
.np-page-hero + .banner {
    display: none !important;
}

@media (max-width: 800px) {

    .np-page-hero-inner {
        grid-template-columns: 1fr;
    }

    .np-page-hero-copy {
        min-height: 220px;
        padding: 42px 24px;
    }

    .np-page-hero-copy h1 {
        font-size: 35px;
    }

    .np-page-hero-image {
        min-height: 230px;
    }
}



/* =========================================================
   SHOW OFFER HERO - WORDPRESS MATCH
   Header ostaje netaknut, hero ulazi ispod njega
   ========================================================= */

.np-page-hero {
    width: 100%;
    margin-top: -92px;
    padding-top: 92px;

    background: #faf8f3 !important;
    border-bottom: 1px solid #e6ded2;

    box-sizing: border-box;
}

/* WordPress odnos kolona: .79fr / 1.21fr */
.np-page-hero-inner {
    width: 100%;
    min-height: 415px;

    display: grid;
    grid-template-columns: .79fr 1.21fr;

    margin: 0;
}

/* leva kolona */
.np-page-hero-copy {
    min-height: 415px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    padding: 70px 40px 60px 80px;

    background: #faf8f3;

    box-sizing: border-box;
}

.np-page-hero-copy h1 {
    margin: 0;

    font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
    font-size: 54px;
    font-weight: 600;
    line-height: 1.05;

    color: #000;
}

.np-page-hero-divider {
    width: 60px;
    height: 2px;

    margin: 38px 0 32px;

    background: #b58a3b;
}

.np-page-hero-copy p {
    margin: 0;

    font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.35;

    color: #222;
}

/* desna kolona - isto kao WordPress */
.np-page-hero-image {
    min-height: 415px;

    background-image:
        linear-gradient(
            90deg,
            rgb(250,247,240) 0%,
            rgba(250,248,243,0) 100%
        ),
        url("https://testsajt.narodnopozoristenis.rs/wp-content/uploads/2026/06/ChatGPT-Image-11.-%D1%98%D1%83%D0%BD-2026.-10_54_58-e1781169687451.png");

    background-position:
        50% 50%,
        100% 100%;

    background-size:
        cover,
        cover;

    background-repeat:
        no-repeat,
        no-repeat;
}

/* Header ostaje iznad hero sekcije */
.ticket-site-header {
    position: relative;
    z-index: 1000;
    background: transparent !important;
}

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

    .np-page-hero {
        margin-top: 0;
        padding-top: 0;
    }

    .np-page-hero-inner {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .np-page-hero-copy {
        min-height: 260px;
        padding: 50px 24px;
    }

    .np-page-hero-copy h1 {
        font-size: 38px;
    }

    .np-page-hero-copy p {
        font-size: 20px;
    }

    .np-page-hero-image {
        min-height: 250px;
    }
}


/* Razmak izmedju hero sekcije i repertoara */
.np-page-hero + .ticket-repertoire-section,
.np-page-hero + .d-flex,
.ticket-repertoire-section {
    padding-top: 34px !important;
}


/* Razmak izmedju hero sekcije i repertoara */
.np-page-hero + .ticket-repertoire-section,
.np-page-hero + .d-flex,
.ticket-repertoire-section {
    padding-top: 34px !important;
}


/* =========================================================
   RAZMAK ISPOD HERO SEKCIJE
   ========================================================= */

.np-repertoire {
    margin-top: 36px !important;
}


/* WordPress-style language flag */
.ticket-lang {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.ticket-lang-flag {
    display: block;
    width: 16px;
    height: 11px;
}


.ticket-lang {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.ticket-lang-flag {
    display: block;
    width: 16px !important;
    height: 11px !important;
    object-fit: cover;
}


/* =========================================================
   NARODNO POZORISTE - FOOTER COLOR
   ========================================================= */

footer,
.ticket-footer,
.footer,
#footer {
    background-color: #504d4d !important;
    border-color: #504d4d !important;
}



/* =========================================================
   SHOW SEATS - DESKTOP LAYOUT
   Sedista levo, detalji desno, bez vertikalnog scroll-a
   ========================================================= */

body {
    overflow-x: hidden;
}

/* cela ShowSeats zona */
.seats-page-wrapper {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 1fr);
    width: 100%;
    min-height: 0;
    gap: 0;
    align-items: stretch;
}

/* LEVA STRANA - NE DIRAMO FUNKCIONALNOST SEDISTA */
.seats-left {
    width: 100% !important;
    min-width: 0 !important;

    display: flex;
    align-items: flex-start;
    justify-content: center;

    overflow: hidden !important;

    box-sizing: border-box;
}

/* SVG / mapa mora stati u dostupnu visinu */
.seats-left #svg-object,
.seats-left object,
.seats-left svg {
    display: block;
    max-width: 100% !important;
    max-height: calc(100vh - 155px) !important;
}

/* DESNA STRANA */
.seats-right {
    width: 100% !important;
    min-width: 0 !important;

    padding: 18px 28px 24px;

    overflow-y: auto;
    overflow-x: hidden;

    box-sizing: border-box;
}

/* desktop - cela zona staje u viewport */
@media (min-width: 1101px) {

    .seats-page-wrapper {
        height: calc(100vh - 135px);
        max-height: calc(100vh - 135px);
        overflow: hidden;
    }

    .seats-left {
        height: 100%;
        max-height: 100%;
    }

    .seats-right {
        height: 100%;
        max-height: 100%;
    }
}

/* =========================================================
   MANJI EKRANI
   Desna strana prelazi ispod sedista
   ========================================================= */

@media (max-width: 1100px) {

    .seats-page-wrapper {
        display: flex !important;
        flex-direction: column;
        height: auto;
        max-height: none;
        overflow: visible;
    }

    .seats-left {
        width: 100% !important;
        overflow: visible !important;
    }

    .seats-left #svg-object,
    .seats-left object,
    .seats-left svg {
        max-height: none !important;
        width: 100%;
        height: auto;
    }

    .seats-right {
        width: 100% !important;
        height: auto;
        max-height: none;
        overflow: visible;

        padding: 28px 20px 40px;
    }
}


/* =========================================================
   SHOW SEATS - FINAL DESKTOP POSITION FIX
   Sedista gore + legenda vidljiva
   ========================================================= */

@media (min-width: 1101px) {

    .seats-page-wrapper {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(420px, 1fr);

        width: 100%;
        height: calc(100vh - 135px);
        max-height: calc(100vh - 135px);

        overflow: hidden;
        align-items: start !important;
    }

    .seats-left {
        width: 100% !important;
        height: 100% !important;
        max-height: 100% !important;

        display: flex !important;
        flex-direction: column !important;

        align-items: stretch !important;
        justify-content: flex-start !important;

        overflow: hidden !important;

        box-sizing: border-box;
    }

    /* mapa krece skroz od vrha */
    .seats-left #svg-object,
    .seats-left object {
        display: block !important;

        width: 100% !important;
        height: auto !important;

        max-width: 100% !important;
        max-height: calc(100vh - 190px) !important;

        margin: 0 auto !important;
    }

    /*
       Ako je SVG direktno u DOM-u, isto pravilo.
       Ne diramo elemente sedista unutar SVG-a.
    */
    .seats-left > svg {
        display: block !important;

        width: 100% !important;
        height: auto !important;

        max-width: 100% !important;
        max-height: calc(100vh - 190px) !important;

        margin: 0 auto !important;
    }

    /* legenda ostaje ispod mape i mora biti vidljiva */
    .seats-left .legend,
    .seats-left .seat-legend,
    .seats-left .seats-legend {
        flex: 0 0 auto !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .seats-right {
        height: 100% !important;
        max-height: 100% !important;

        overflow-y: auto !important;
        overflow-x: hidden !important;
    }
}


/* manji ekrani - desni panel ide ispod */
@media (max-width: 1100px) {

    .seats-page-wrapper {
        display: flex !important;
        flex-direction: column !important;

        height: auto !important;
        max-height: none !important;

        overflow: visible !important;
    }

    .seats-left {
        height: auto !important;
        max-height: none !important;

        display: block !important;

        overflow: visible !important;
    }

    .seats-left #svg-object,
    .seats-left object,
    .seats-left > svg {
        width: 100% !important;
        height: auto !important;

        max-height: none !important;

        margin: 0 auto !important;
    }

    .seats-right {
        width: 100% !important;
        height: auto !important;
        max-height: none !important;

        overflow: visible !important;
    }
}


/* =========================================================
   SHOW SEATS - POZORISNI DESNI PANEL
   Samo vizuelne izmene desne strane
   ========================================================= */

.seats-right {
    background: #faf8f3 !important;
    color: #222;
    padding: 26px 42px 34px !important;
}


/* ---------------------------------------------------------
   NASLOV PREDSTAVE
   --------------------------------------------------------- */

.seats-right .movie-container {
    margin: 0 0 26px;
}

.seats-right .movie-container h1 {
    margin: 0 !important;
    text-align: left !important;

    font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif !important;
    font-size: 38px !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;

    letter-spacing: -.02em;
    color: #181818 !important;
}

.seats-right .movie-container h1 b {
    font-weight: 600 !important;
}


/* datum / meta informacije ispod naslova */
.seats-right .movie-container p,
.seats-right .movie-container small {
    font-family: "Source Sans 3", Arial, sans-serif;
    color: #777;
}


/* zlatna linija */
.seats-right .np-detail-divider {
    width: 58px !important;
    height: 2px !important;

    margin: 18px 0 22px !important;

    background: #b58a3b !important;
}


/* ---------------------------------------------------------
   OPIS PREDSTAVE
   --------------------------------------------------------- */

.seats-right .description-list-container {
    max-width: 760px;

    margin: 0 0 30px;
    padding: 0 !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.65;

    color: #555;
}

.seats-right .description-list-container p {
    margin: 0 0 10px;
}


/* ---------------------------------------------------------
   SEKCIJE: CENOVNIK / KORPA
   --------------------------------------------------------- */

.seats-right .top-flex-container {
    margin-top: 24px;
    padding-top: 22px;

    border-top: 1px solid #e6ded2;
}

.seats-right .top-flex-container h4,
.seats-right h4 {
    position: relative;

    margin: 0 0 18px !important;
    padding: 0 0 12px !important;

    font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    line-height: 1.1;

    color: #222 !important;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.seats-right .top-flex-container h4::after,
.seats-right h4::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: 0;

    width: 34px;
    height: 1px;

    background: #b58a3b;
}


/* ---------------------------------------------------------
   CENOVNIK
   --------------------------------------------------------- */

.seats-right .ticket-types {
    width: 100%;

    background: rgba(255,255,255,.56);

    border: 1px solid #e6ded2;

    padding: 6px 20px;

    box-sizing: border-box;
}

.seats-right .ticket-types > div {
    min-height: 42px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 8px 0;

    border-bottom: 1px solid rgba(181,138,59,.16);

    box-sizing: border-box;
}

.seats-right .ticket-types > div:last-child {
    border-bottom: 0;
}

.seats-right .ticket-types,
.seats-right .ticket-types * {
    font-family: "Source Sans 3", Arial, sans-serif;
}

.seats-right .ticket-types span,
.seats-right .ticket-types label,
.seats-right .ticket-types p {
    color: #444;
}


/* tabele ako se cenovnik renderuje kao table */
.seats-right table {
    width: 100%;

    border-collapse: collapse;

    background: rgba(255,255,255,.56);
    border: 1px solid #e6ded2;
}

.seats-right table td,
.seats-right table th {
    padding: 11px 16px !important;

    border: 0 !important;
    border-bottom: 1px solid #eee7dc !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 13px;
}

.seats-right table tr:last-child td {
    border-bottom: 0 !important;
}

.seats-right table td:last-child,
.seats-right table th:last-child {
    text-align: right;
}


/* ---------------------------------------------------------
   KORPA / IZABRANA SEDISTA
   --------------------------------------------------------- */

.seats-right .cart,
.seats-right .basket,
.seats-right .shopping-cart,
.seats-right .selected-seats,
.seats-right #selected-seats {
    margin-top: 24px;

    padding: 20px 22px;

    background: #fff;

    border: 1px solid #e6ded2;
    border-left: 3px solid #b58a3b;

    box-sizing: border-box;
}


/* redovi u korpi */
.seats-right .cart > div,
.seats-right .basket > div,
.seats-right .selected-seats > div {
    padding: 9px 0;

    border-bottom: 1px solid #eee7dc;
}

.seats-right .cart > div:last-child,
.seats-right .basket > div:last-child,
.seats-right .selected-seats > div:last-child {
    border-bottom: 0;
}


/* ---------------------------------------------------------
   UKUPNO / CENA
   --------------------------------------------------------- */

.seats-right .total,
.seats-right .total-price,
.seats-right .grand-total {
    margin-top: 18px;
    padding-top: 16px;

    border-top: 1px solid #b58a3b;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 22px !important;
    font-weight: 600;

    color: #222;
}


/* ---------------------------------------------------------
   DUGMAD
   --------------------------------------------------------- */

.seats-right button,
.seats-right .btn,
.seats-right input[type="button"],
.seats-right input[type="submit"] {
    min-height: 42px;

    border-radius: 0 !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    letter-spacing: .025em;
    text-transform: uppercase;

    transition:
        background-color .2s ease,
        color .2s ease,
        border-color .2s ease;
}


/* glavno placanje */
.seats-right #pay-btn-div button,
.seats-right #pay-btn-div .btn,
.seats-right #pay-btn-div input {
    width: 100%;

    margin-top: 18px;
    padding: 12px 22px !important;

    background: #b58a3b !important;
    border: 1px solid #b58a3b !important;

    color: #fff !important;

    box-shadow: none !important;
}

.seats-right #pay-btn-div button:hover,
.seats-right #pay-btn-div .btn:hover,
.seats-right #pay-btn-div input:hover {
    background: #94702f !important;
    border-color: #94702f !important;
}


/* sekundarna dugmad */
.seats-right button:not(#pay-btn),
.seats-right .btn-default {
    box-shadow: none;
}


/* ---------------------------------------------------------
   MOBILNI / MANJI EKRANI
   --------------------------------------------------------- */

@media (max-width: 1100px) {

    .seats-right {
        padding: 32px 24px 44px !important;
    }

    .seats-right .movie-container h1 {
        font-size: 34px !important;
    }
}

@media (max-width: 600px) {

    .seats-right {
        padding: 28px 18px 40px !important;
    }

    .seats-right .movie-container h1 {
        font-size: 30px !important;
    }

    .seats-right .ticket-types {
        padding-left: 14px;
        padding-right: 14px;
    }
}


/* =========================================================
   SHOW SEATS - THEATRE DETAIL PANEL
   ========================================================= */

.seats-right {
    background: #faf8f3 !important;
    padding: 30px 42px 36px !important;
    color: #222;
}


/* NASLOV PREDSTAVE */

.seats-right .movie-container {
    margin-bottom: 18px;
}

.seats-right .movie-container h1 {
    margin: 0 !important;
    text-align: left !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 40px !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;

    color: #1f1f1f !important;
    text-transform: none !important;
}

.seats-right .movie-container h1 b {
    font-weight: 600 !important;
}

.seats-right .movie-container p,
.seats-right .movie-container small {
    font-family: "Source Sans 3", Arial, sans-serif;
    color: #6f6f6f;
}


/* MALA ZLATNA LINIJA ISPOD NASLOVA */

.seats-right .np-detail-divider {
    width: 58px !important;
    height: 2px !important;

    margin: 16px 0 20px !important;

    background: #b58a3b !important;
}


/* OPIS */

.seats-right .description-list-container {
    margin-bottom: 24px !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 14px;
    line-height: 1.65;

    color: #555;
}


/* =========================================================
   UKRASNA KRIVA LINIJA
   koristi postojeci divider.png
   ========================================================= */

.seats-right .theatre-ornament {
    width: 100%;
    height: 42px;

    margin: 18px 0 24px;

    background-image:
        url("/Content/Terminal/NarodnoPozoriste/images/divider.png");

    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;

    opacity: .72;
}


/* CENOVNIK */

.seats-right .top-flex-container {
    margin-top: 0 !important;
    padding-top: 0 !important;

    border-top: 0 !important;
}

.seats-right .top-flex-container h4,
.seats-right h4 {
    margin: 0 0 18px !important;
    padding: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;

    color: #2a2a2a !important;
    text-align: left;
    text-transform: uppercase;

    letter-spacing: .03em;
}


/* ukloni prethodne male underline pseudo elemente */
.seats-right .top-flex-container h4::after,
.seats-right h4::after {
    display: none !important;
}


/* tabela cenovnika */

.seats-right .ticket-types {
    width: 100%;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
}

.seats-right .ticket-types > div {
    display: flex;
    align-items: center;
    justify-content: space-between;

    min-height: 40px;
    padding: 8px 4px !important;

    border-bottom: 1px solid #e6ded2;
}

.seats-right .ticket-types > div:last-child {
    border-bottom: 0;
}

.seats-right .ticket-types,
.seats-right .ticket-types * {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 13px;
    color: #444;
}


/* ako cenovnik koristi TABLE */

.seats-right table {
    width: 100%;

    border: 0 !important;
    border-collapse: collapse;

    background: transparent !important;
}

.seats-right table td,
.seats-right table th {
    padding: 9px 4px !important;

    border: 0 !important;
    border-bottom: 1px solid #e6ded2 !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 13px;

    background: transparent !important;
}

.seats-right table tr:last-child td {
    border-bottom: 0 !important;
}

.seats-right table td:last-child {
    text-align: right;
    font-weight: 500;
}


/* =========================================================
   KORPA
   ========================================================= */

.seats-right .cart,
.seats-right .basket,
.seats-right .shopping-cart,
.seats-right .selected-seats,
.seats-right #selected-seats {
    margin-top: 20px;

    padding: 20px 22px;

    background: rgba(255,255,255,.55);

    border: 1px solid #e6ded2;
    border-left: 3px solid #b58a3b;

    box-shadow: none !important;
}


/* naslov korpe */

.seats-right .cart h4,
.seats-right .basket h4,
.seats-right .shopping-cart h4,
.seats-right .selected-seats h4 {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 23px !important;
}


/* redovi u korpi */

.seats-right .cart > div,
.seats-right .basket > div,
.seats-right .shopping-cart > div,
.seats-right .selected-seats > div {
    padding: 8px 0;

    border-bottom: 1px solid #eee7dc;
}

.seats-right .cart > div:last-child,
.seats-right .basket > div:last-child,
.seats-right .shopping-cart > div:last-child,
.seats-right .selected-seats > div:last-child {
    border-bottom: 0;
}


/* UKUPNO */

.seats-right .total,
.seats-right .total-price,
.seats-right .grand-total {
    margin-top: 16px;
    padding-top: 14px;

    border-top: 1px solid #b58a3b;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 24px !important;
    font-weight: 600;

    color: #222;
}


/* GLAVNO DUGME */

.seats-right #pay-btn-div button,
.seats-right #pay-btn-div .btn,
.seats-right #pay-btn-div input {
    width: 100%;

    margin-top: 18px;
    padding: 13px 24px !important;

    background: #b58a3b !important;
    border: 1px solid #b58a3b !important;

    border-radius: 0 !important;

    color: #fff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .04em;

    box-shadow: none !important;
}

.seats-right #pay-btn-div button:hover,
.seats-right #pay-btn-div .btn:hover,
.seats-right #pay-btn-div input:hover {
    background: #94702f !important;
    border-color: #94702f !important;
}


/* MOBILE */

@media (max-width: 1100px) {

    .seats-right {
        padding: 30px 24px 44px !important;
    }

    .seats-right .movie-container h1 {
        font-size: 34px !important;
    }

    .seats-right .theatre-ornament {
        height: 34px;
        margin: 16px 0 20px;
    }
}


/* Veca pozorisna dekorativna linija */
.seats-right .theatre-ornament {
    width: 82% !important;
    height: 58px !important;

    margin: 24px auto 30px !important;

    background-size: 100% auto !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    opacity: .72;
}


/* =========================================================
   SHOW SEATS - KOMPAKTNI POZORISNI PANEL
   ========================================================= */

.seats-right {
    padding: 24px 38px 28px !important;
}


/* NASLOV */

.seats-right .movie-container {
    margin: 0 0 10px !important;
}

.seats-right .movie-container h1 {
    margin-bottom: 4px !important;
}


/* mala zlatna linija ispod naslova */

.seats-right .np-detail-divider {
    margin: 12px 0 14px !important;
}


/* opis */

.seats-right .description-list-container {
    margin: 0 0 8px !important;
}


/* =========================================================
   UKRASNA LINIJA - SIRA, ALI NISKA
   ========================================================= */

.seats-right .theatre-ornament {
    width: 76% !important;
    height: 26px !important;

    margin: 10px auto 18px !important;

    background-size: 100% auto !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;

    opacity: .66 !important;
}


/* =========================================================
   CENOVNIK
   ========================================================= */

.seats-right .top-flex-container {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

.seats-right h4,
.seats-right .top-flex-container h4 {
    margin: 0 0 10px !important;
    padding: 0 !important;

    font-size: 22px !important;
    line-height: 1.1 !important;
}


/* cenovnik bez velike kartice */

.seats-right .ticket-types {
    margin: 0 0 12px !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;
}

.seats-right .ticket-types > div {
    min-height: 32px !important;
    padding: 5px 2px !important;

    border-bottom: 1px solid #e6ded2 !important;
}


/* =========================================================
   SVE TABELE DESNO - CENOVNIK I KORPA
   ========================================================= */

.seats-right table {
    margin: 0 !important;

    width: 100% !important;

    background: transparent !important;
    border: 0 !important;
}

.seats-right table th {
    padding: 6px 8px !important;

    font-size: 12px !important;
    font-weight: 600 !important;

    color: #4b4339 !important;

    background: rgba(181,138,59,.055) !important;

    border-bottom: 1px solid rgba(181,138,59,.28) !important;
}

.seats-right table td {
    padding: 6px 8px !important;

    font-size: 12px !important;

    border-bottom: 1px solid #eee8de !important;
}

.seats-right table tr:last-child td {
    border-bottom: 0 !important;
}


/* =========================================================
   KORPA
   ========================================================= */

.seats-right .cart,
.seats-right .basket,
.seats-right .shopping-cart,
.seats-right .selected-seats,
.seats-right #selected-seats {
    margin: 14px 0 0 !important;
    padding: 14px 16px !important;

    background: rgba(255,255,255,.45) !important;

    border: 1px solid #e6ded2 !important;
    border-left: 2px solid #b58a3b !important;

    box-shadow: none !important;
}


/* naslov KORPA */

.seats-right .cart h4,
.seats-right .basket h4,
.seats-right .shopping-cart h4,
.seats-right .selected-seats h4 {
    margin-bottom: 8px !important;

    font-size: 21px !important;
}


/* =========================================================
   UKUPNA CENA
   ========================================================= */

.seats-right .total,
.seats-right .total-price,
.seats-right .grand-total {
    margin: 10px 0 0 !important;
    padding: 10px 0 0 !important;

    border-top: 1px solid #b58a3b !important;

    font-size: 21px !important;
}


/* ako je ukupna cena samo strong/b element ispod tabele */

.seats-right table + strong,
.seats-right table + b {
    display: block;

    margin-top: 10px;

    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 20px;

    color: #222;
}


/* =========================================================
   DUGME ZA PLACANJE
   ========================================================= */

.seats-right #pay-btn-div {
    margin-top: 14px !important;
    padding-top: 0 !important;
}

.seats-right #pay-btn-div button,
.seats-right #pay-btn-div .btn,
.seats-right #pay-btn-div input {
    width: auto !important;

    min-width: 190px;

    margin: 0 !important;
    padding: 11px 22px !important;
}


/* ukloni nepotrebne velike praznine */

.seats-right > div {
    min-height: 0 !important;
}


/* =========================================================
   INIT PAYMENT - NARODNO POZORISTE
   ========================================================= */

body {
    background: #faf8f3;
}


/* glavna payment zona */

.payment-init-wrapper,
.init-payment-wrapper,
.payment-page-wrapper {
    width: min(1100px, calc(100% - 48px));
    margin: 36px auto 60px;

    padding: 34px 38px;

    background: #fff;

    border: 1px solid #e6ded2;

    box-sizing: border-box;
}


/* naslov */

.payment-init-wrapper h1,
.payment-init-wrapper h2,
.init-payment-wrapper h1,
.init-payment-wrapper h2,
.payment-page-wrapper h1,
.payment-page-wrapper h2 {
    margin: 0 0 10px;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-weight: 600 !important;

    color: #222 !important;

    text-align: left !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}


/* naslov tipa INICIJALIZACIJA PLAĆANJA */

.payment-init-wrapper .page-title,
.init-payment-wrapper .page-title,
.payment-page-wrapper .page-title {
    font-size: 34px !important;
}


/* zlatna linija */

.payment-init-wrapper .divider,
.init-payment-wrapper .divider,
.payment-page-wrapper .divider {
    width: 58px !important;
    height: 2px !important;

    margin: 14px 0 26px !important;

    background: #b58a3b !important;

    border: 0 !important;
}


/* dve kolone */

.payment-init-wrapper .row,
.init-payment-wrapper .row,
.payment-page-wrapper .row {
    margin-left: -10px;
    margin-right: -10px;
}


/* kartice */

.payment-init-wrapper .panel,
.payment-init-wrapper .card,
.init-payment-wrapper .panel,
.init-payment-wrapper .card,
.payment-page-wrapper .panel,
.payment-page-wrapper .card {
    background: #faf8f3 !important;

    border: 1px solid #e6ded2 !important;
    border-radius: 0 !important;

    box-shadow: none !important;
}


/* header kartice */

.payment-init-wrapper .panel-heading,
.init-payment-wrapper .panel-heading,
.payment-page-wrapper .panel-heading {
    background: transparent !important;

    border-bottom: 1px solid #e6ded2 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;

    color: #222 !important;
}


/* redovi podataka */

.payment-init-wrapper .panel-body,
.init-payment-wrapper .panel-body,
.payment-page-wrapper .panel-body {
    padding: 0 !important;
}

.payment-init-wrapper .panel-body > div,
.init-payment-wrapper .panel-body > div,
.payment-page-wrapper .panel-body > div {
    padding: 10px 16px;

    border-bottom: 1px solid #eee7dc;
}

.payment-init-wrapper .panel-body > div:last-child,
.init-payment-wrapper .panel-body > div:last-child,
.payment-page-wrapper .panel-body > div:last-child {
    border-bottom: 0;
}


/* label-e */

.payment-init-wrapper label,
.init-payment-wrapper label,
.payment-page-wrapper label {
    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 13px !important;

    color: #555 !important;
}


/* INPUT POLJA */

.payment-init-wrapper input[type="text"],
.payment-init-wrapper input[type="email"],
.init-payment-wrapper input[type="text"],
.init-payment-wrapper input[type="email"],
.payment-page-wrapper input[type="text"],
.payment-page-wrapper input[type="email"] {
    width: 100%;

    padding: 10px 2px !important;

    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #cfc7ba !important;

    border-radius: 0 !important;

    box-shadow: none !important;
    outline: none !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 14px;

    color: #222;
}

.payment-init-wrapper input:focus,
.init-payment-wrapper input:focus,
.payment-page-wrapper input:focus {
    border-bottom-color: #b58a3b !important;
}


/* ukupna cena */

.payment-init-wrapper .total,
.payment-init-wrapper .total-price,
.init-payment-wrapper .total,
.init-payment-wrapper .total-price,
.payment-page-wrapper .total,
.payment-page-wrapper .total-price {
    margin-top: 22px;

    padding-top: 18px;

    border-top: 1px solid #b58a3b;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 25px !important;
    font-weight: 600 !important;

    color: #222 !important;

    text-align: right;
}


/* checkbox i uslovi */

.payment-init-wrapper .terms,
.init-payment-wrapper .terms,
.payment-page-wrapper .terms {
    margin: 18px 0;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 13px;

    color: #555;
}

.payment-init-wrapper a,
.init-payment-wrapper a,
.payment-page-wrapper a {
    color: #b58a3b !important;
}


/* dugme placanja */

.payment-init-wrapper button,
.payment-init-wrapper input[type="submit"],
.init-payment-wrapper button,
.init-payment-wrapper input[type="submit"],
.payment-page-wrapper button,
.payment-page-wrapper input[type="submit"] {
    min-width: 260px;

    padding: 13px 28px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #fff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .04em;

    box-shadow: none !important;
}

.payment-init-wrapper button:hover,
.payment-init-wrapper input[type="submit"]:hover,
.init-payment-wrapper button:hover,
.init-payment-wrapper input[type="submit"]:hover,
.payment-page-wrapper button:hover,
.payment-page-wrapper input[type="submit"]:hover {
    background: #94702f !important;
    border-color: #94702f !important;
}


/* disabled dugme */

.payment-init-wrapper button:disabled,
.payment-init-wrapper input[type="submit"]:disabled,
.init-payment-wrapper button:disabled,
.init-payment-wrapper input[type="submit"]:disabled,
.payment-page-wrapper button:disabled,
.payment-page-wrapper input[type="submit"]:disabled {
    background: #d6d0c7 !important;
    border-color: #d6d0c7 !important;

    color: #888 !important;

    cursor: not-allowed;
}


/* countdown */

.payment-init-wrapper .countdown,
.init-payment-wrapper .countdown,
.payment-page-wrapper .countdown {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 12px;

    color: #777;

    text-align: right;
}


/* mobile */

@media (max-width: 800px) {

    .payment-init-wrapper,
    .init-payment-wrapper,
    .payment-page-wrapper {
        width: calc(100% - 28px);

        margin: 22px auto 40px;

        padding: 24px 18px;
    }

    .payment-init-wrapper button,
    .payment-init-wrapper input[type="submit"],
    .init-payment-wrapper button,
    .init-payment-wrapper input[type="submit"],
    .payment-page-wrapper button,
    .payment-page-wrapper input[type="submit"] {
        width: 100%;
        min-width: 0;
    }
}


/* =========================================================
   INIT PAYMENT - NARODNO POZORISTE FINAL
   ========================================================= */

.init-payment-mobile {
    width: min(1120px, calc(100% - 48px)) !important;
    max-width: 1120px !important;

    margin: 34px auto 60px !important;
    padding: 0 !important;
}

.init-payment-row {
    margin: 0 !important;
    padding: 30px 32px 28px !important;

    background: #faf8f3 !important;

    border: 1px solid #e6ded2 !important;
    box-shadow: none !important;

    box-sizing: border-box;
}


/* =========================================================
   GLAVNI NASLOV
   ========================================================= */

.init-payment-row .reflection-text {
    margin: 0 0 24px !important;
    padding: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 34px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;

    letter-spacing: .04em !important;
    text-transform: uppercase;

    color: #222 !important;

    text-align: center;
}


/* diskretna zlatna linija ispod naslova */

.init-payment-row .reflection-text::after {
    content: "";

    display: block;

    width: 58px;
    height: 2px;

    margin: 14px auto 0;

    background: #b58a3b;
}


/* =========================================================
   OBE KOLONE
   ========================================================= */

.init-payment-row > .row {
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.init-payment-row .col-md-6 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}


/* =========================================================
   PAYMENT / CUSTOMER KARTICE
   ========================================================= */

.init-payment-row .collection {
    margin: 0 !important;
    padding: 0 !important;

    list-style: none;

    background: #fff !important;

    border: 1px solid #e6ded2 !important;
    border-radius: 0 !important;

    box-shadow: none !important;
}


/* naslov kartice */

.init-payment-row .collection-header {
    padding: 15px 18px 12px !important;

    background: #fff !important;

    border: 0 !important;
    border-bottom: 1px solid #e6ded2 !important;
}

.init-payment-row .collection-header h5 {
    margin: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;

    color: #222 !important;
}


/* redovi */

.init-payment-row .collection-item {
    min-height: 44px;

    padding: 11px 18px !important;

    background: #fff !important;

    border: 0 !important;
    border-bottom: 1px solid #eee8de !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 13px !important;

    color: #555 !important;

    box-sizing: border-box;
}

.init-payment-row .collection-item:last-child {
    border-bottom: 0 !important;
}


/* vrednosti desno */

.init-payment-row .secondary-content {
    color: #8e6b2f !important;

    font-weight: 500 !important;

    text-align: right;
}


/* =========================================================
   CUSTOMER INPUTI
   ========================================================= */

.init-payment-row .customer-input {
    display: block;

    width: 100% !important;

    margin-top: 7px !important;
    padding: 7px 2px 8px !important;

    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #cfc7ba !important;

    border-radius: 0 !important;

    outline: none !important;
    box-shadow: none !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 14px !important;

    color: #222 !important;

    box-sizing: border-box;
}

.init-payment-row .customer-input:focus {
    border-bottom-color: #b58a3b !important;
}


/* =========================================================
   TAX / UKUPNO
   ========================================================= */

.init-payment-row .tax-data {
    width: 100% !important;

    margin-top: 18px !important;
    padding: 16px 18px !important;

    background: rgba(255,255,255,.62) !important;

    border: 1px solid #e6ded2 !important;

    box-sizing: border-box;
}

.init-payment-row .tax-data > div {
    padding: 5px 0;
}

.init-payment-row .total-amount {
    margin-top: 8px !important;
    padding-top: 10px !important;

    border-top: 1px solid #b58a3b !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;

    color: #222 !important;
}


/* =========================================================
   USLOVI KORISCENJA
   ========================================================= */

.init-payment-row #agreeWithTermsOfUse {
    width: 16px;
    height: 16px;

    margin-right: 8px;

    accent-color: #b58a3b;
}

.init-payment-row #agreeWithTermsOfUseLabel {
    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 13px !important;

    color: #555 !important;
}

.init-payment-row #agreeWithTermsOfUseLabel a {
    color: #b58a3b !important;
    text-decoration: none;
}

.init-payment-row #agreeWithTermsOfUseLabel a:hover {
    text-decoration: underline;
}


/* =========================================================
   DUGME ZA PLACANJE
   ========================================================= */

.init-payment-row .process-msu-button {
    min-width: 280px !important;

    margin-top: 16px !important;
    padding: 13px 28px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #fff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .05em;

    box-shadow: none !important;

    transition:
        background-color .2s ease,
        border-color .2s ease;
}

.init-payment-row .process-msu-button:hover:not(:disabled) {
    background: #94702f !important;
    border-color: #94702f !important;
}

.init-payment-row .process-msu-button:disabled {
    background: #d6d0c7 !important;
    border-color: #d6d0c7 !important;

    color: #888 !important;

    cursor: not-allowed;
}


/* =========================================================
   COUNTDOWN
   ========================================================= */

.init-payment-row {
    position: relative;
}

.init-payment-row [id*="timer"],
.init-payment-row [class*="timer"] {
    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;

    color: #777 !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .init-payment-mobile {
        width: calc(100% - 24px) !important;

        margin: 20px auto 40px !important;
    }

    .init-payment-row {
        padding: 22px 16px 24px !important;
    }

    .init-payment-row .reflection-text {
        font-size: 28px !important;
    }

    .init-payment-row .col-md-6 {
        margin-bottom: 16px;
    }

    .init-payment-row .process-msu-button {
        width: 100% !important;
        min-width: 0 !important;
    }
}


/* =========================================================
   INIT PAYMENT - FINAL POLISH
   ========================================================= */

.init-payment-mobile {
    width: min(1080px, calc(100% - 48px)) !important;
    margin: 30px auto 54px !important;
}


/* GLAVNI PANEL */

.init-payment-row {
    padding: 26px 28px 24px !important;

    background: #fbf9f5 !important;

    border: 1px solid #e4dccf !important;

    box-shadow:
        0 10px 30px rgba(58,43,24,.035) !important;
}


/* NASLOV */

.init-payment-row .reflection-text {
    margin-bottom: 20px !important;

    font-size: 32px !important;
    letter-spacing: .055em !important;
}

.init-payment-row .reflection-text::after {
    width: 54px;
    margin-top: 12px;
}


/* TIMER */

.init-payment-row [id*="timer"],
.init-payment-row [class*="timer"] {
    font-size: 11px !important;
    color: #80776b !important;
}


/* =========================================================
   DVE GLAVNE KARTICE
   ========================================================= */

.init-payment-row .collection {
    background: rgba(255,255,255,.72) !important;

    border: 1px solid #dfd5c6 !important;

    min-height: 232px;

    box-shadow: none !important;
}

.init-payment-row .collection-header {
    padding: 14px 18px 11px !important;

    background: transparent !important;

    border-bottom: 1px solid #e6ded2 !important;
}

.init-payment-row .collection-header h5 {
    font-size: 22px !important;
    line-height: 1.15 !important;
}


/* REDOVI */

.init-payment-row .collection-item {
    min-height: 42px;

    padding: 10px 18px !important;

    background: transparent !important;

    border-bottom: 1px solid #eee7dc !important;

    font-size: 13px !important;
}

.init-payment-row .collection-item:last-child {
    border-bottom: 0 !important;
}

.init-payment-row .secondary-content {
    color: #9a722f !important;
}


/* INPUTI */

.init-payment-row .customer-input {
    margin-top: 5px !important;
    padding: 6px 1px 7px !important;

    border-bottom: 1px solid #cfc5b7 !important;
}

.init-payment-row .customer-input:focus {
    border-bottom-color: #b58a3b !important;
}


/* =========================================================
   DONJI SUMMARY BLOK
   ========================================================= */

.init-payment-row .tax-data {
    margin-top: 18px !important;

    padding: 14px 18px !important;

    background: rgba(255,255,255,.58) !important;

    border: 1px solid #dfd5c6 !important;
}


/* ukupno naglašenije */

.init-payment-row .total-amount {
    margin-top: 0 !important;
    padding-top: 0 !important;

    border-top: 0 !important;

    font-size: 22px !important;
    line-height: 1.25 !important;
}

.init-payment-row .total-amount strong,
.init-payment-row .total-amount b {
    color: #1f1f1f !important;
}


/* zlatna linija unutar summary dela */

.init-payment-row .tax-data::before {
    content: "";

    display: block;

    width: 58px;
    height: 1px;

    margin-bottom: 10px;

    background: #b58a3b;
}


/* =========================================================
   TERMS + DUGME KAO JEDNA CELINA
   ========================================================= */

.init-payment-row #agreeWithTermsOfUseLabel {
    font-size: 12px !important;
    color: #5e574f !important;
}

.init-payment-row #agreeWithTermsOfUseLabel a {
    color: #9a722f !important;
    font-weight: 600;
}

.init-payment-row #agreeWithTermsOfUse {
    width: 15px;
    height: 15px;

    margin-right: 7px;
}


/* payment button */

.init-payment-row .process-msu-button {
    min-width: 320px !important;

    margin-top: 14px !important;
    padding: 12px 28px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;

    color: #fff !important;

    letter-spacing: .055em;

    box-shadow: none !important;
}

.init-payment-row .process-msu-button:hover:not(:disabled) {
    background: #95702f !important;
    border-color: #95702f !important;
}

.init-payment-row .process-msu-button:disabled {
    background: #d7d1c8 !important;
    border-color: #d7d1c8 !important;

    color: #817970 !important;
}


/* =========================================================
   BOLE PORAVNANJE DONJEG DELA
   ========================================================= */

.init-payment-row .py-3.col-md-12 {
    margin-top: 4px !important;
    padding-top: 0 !important;
}

.init-payment-row .col-md-12.d-flex.justify-content-center {
    margin-top: 14px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .init-payment-mobile {
        width: calc(100% - 22px) !important;
        margin: 18px auto 36px !important;
    }

    .init-payment-row {
        padding: 20px 14px 22px !important;
    }

    .init-payment-row .reflection-text {
        font-size: 27px !important;
    }

    .init-payment-row .collection {
        min-height: 0;
    }

    .init-payment-row .process-msu-button {
        width: 100% !important;
        min-width: 0 !important;
    }
}


/* =========================================================
   INIT PAYMENT - DONJI DEO PORAVNANJE
   ========================================================= */

/* SUMMARY BLOK */

.init-payment-row .tax-data {
    width: 100% !important;

    margin: 18px 0 0 !important;
    padding: 16px 18px 14px !important;

    background: rgba(255,255,255,.58) !important;

    border: 1px solid #dfd5c6 !important;

    box-sizing: border-box;
}

/* ukloni staru/predugu crticu */
.init-payment-row .tax-data::before {
    display: none !important;
}

/* UKUPAN IZNOS */

.init-payment-row .total-amount {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;

    color: #222 !important;
}

/* kratka zlatna crta samo kao akcenat */

.init-payment-row .total-amount::before {
    content: "";

    display: block;

    width: 48px;
    height: 1px;

    margin-right: 14px;

    flex: 0 0 48px;

    background: #b58a3b;
}


/* =========================================================
   TERMS - CENTRIRANO
   ========================================================= */

/* spoljasnji wrapper za checkbox */
.init-payment-row .col-md-12.d-flex.justify-content-center {
    width: 100% !important;

    margin: 18px 0 0 !important;
    padding: 0 !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* unutrasnji wrapper */
.init-payment-row .col-md-12.d-flex.justify-content-center > div {
    width: 100% !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* checkbox + tekst zajedno */
.init-payment-row #agreeWithTermsOfUse {
    width: 16px !important;
    height: 16px !important;

    margin: 0 8px 0 0 !important;

    vertical-align: middle;
}

.init-payment-row #agreeWithTermsOfUseLabel {
    margin: 0 !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.4 !important;

    color: #555 !important;
}

/* wrapper gde su checkbox i label */
.init-payment-row #agreeWithTermsOfUseLabel,
.init-payment-row #agreeWithTermsOfUse {
    display: inline-block !important;
}

/* ovaj konkretni red iz view-a */
.init-payment-row .w-100.d-flex.justify-content-start.align-items-start.text-left {
    width: auto !important;

    display: flex !important;
    flex-direction: row !important;

    justify-content: center !important;
    align-items: center !important;

    margin: 0 auto !important;

    text-align: center !important;
}


/* =========================================================
   DUGME - NOVI RED, PO SREDINI
   ========================================================= */

.init-payment-row .process-msu-button {
    display: block !important;

    width: 320px !important;
    max-width: 100% !important;

    min-width: 0 !important;

    margin: 16px auto 0 !important;

    padding: 13px 28px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #fff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .05em;

    box-shadow: none !important;
}

/* disabled */

.init-payment-row .process-msu-button:disabled {
    background: #d8d2c9 !important;
    border-color: #d8d2c9 !important;

    color: #817970 !important;
}


/* MOBILE */

@media (max-width: 600px) {

    .init-payment-row .process-msu-button {
        width: 100% !important;
    }

    .init-payment-row .w-100.d-flex.justify-content-start.align-items-start.text-left {
        width: 100% !important;
    }
}


/* =========================================================
   NARODNO POZORISTE - SECURITY PAYMENT PAGE
   Samo payment stranica ovog templejta
   ========================================================= */

.pay-content-wrapper {
    width: min(1080px, calc(100% - 48px));
    margin: 28px auto 60px;
    padding: 0;

    font-family: "Source Sans 3", Arial, sans-serif;
    color: #292621;
}


/* GLAVNI WRAPPER */

.pay-content-wrapper .main-wrapper-pay {
    width: 100%;
    margin: 0;
    padding: 28px 32px 32px;

    background: #fbf9f5;

    border: 1px solid #e4dccf;

    box-sizing: border-box;
}


/* GLAVNI NASLOV */

.pay-content-wrapper .main-wrapper-pay > h4,
.pay-content-wrapper .main-wrapper-pay > h5,
.pay-content-wrapper .new-card h4,
.pay-content-wrapper .new-card h5 {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-weight: 600 !important;

    color: #222 !important;
}


/* gornji naslov */

.pay-content-wrapper .main-wrapper-pay > h4,
.pay-content-wrapper .main-wrapper-pay > h5 {
    margin: 0 0 8px !important;

    font-size: 31px !important;
    line-height: 1.1 !important;

    text-transform: none !important;
}


/* diskretna linija ispod glavnog naslova */

.pay-content-wrapper .main-wrapper-pay > h4::after,
.pay-content-wrapper .main-wrapper-pay > h5::after {
    content: "";

    display: block;

    width: 56px;
    height: 2px;

    margin-top: 12px;

    background: #b58a3b;
}


/* COUNTDOWN */

.pay-content-wrapper #countdown {
    margin-bottom: 14px;

    font-size: 11px !important;

    color: #766e64;

    text-align: right;
}


/* =========================================================
   INFO NAPOMENE
   Uklanjamo stari crveno-crni gradient
   ========================================================= */

.pay-content-wrapper .text-background-pay {
    margin: 16px 0 !important;
    padding: 14px 17px !important;

    background: rgba(181,138,59,.055) !important;
    background-image: none !important;

    border: 1px solid #e3d7c5 !important;
    border-left: 3px solid #b58a3b !important;

    color: #554d43 !important;

    box-shadow: none !important;
}

.pay-content-wrapper .pay-note {
    margin: 0 !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.55 !important;

    color: #554d43 !important;
}


/* =========================================================
   "NOVA KARTICA"
   ========================================================= */

.pay-content-wrapper .new-card {
    margin: 20px 0 12px !important;
    padding: 0 0 10px !important;

    border-bottom: 1px solid #ded4c5 !important;
}

.pay-content-wrapper .new-card h4,
.pay-content-wrapper .new-card h5 {
    margin: 0 !important;

    font-size: 24px !important;
}


/* =========================================================
   FORMA + DETALJI TRANSAKCIJE
   ========================================================= */

.pay-content-wrapper .payment-page-format {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(320px, .85fr);
    gap: 42px;

    align-items: start;

    margin-top: 18px;
}


/* FORMA */

.pay-content-wrapper .pay-details {
    width: 100%;
    margin: 0;
}


/* INPUT BLOKOVI */

.pay-content-wrapper .field-wrapper {
    margin-bottom: 15px;
}


/* LABEL */

.pay-content-wrapper .field-wrapper label {
    display: block;

    margin-bottom: 5px;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 12px;
    font-weight: 500;

    color: #625b52;
}


/* INPUT */

.pay-content-wrapper .pay-input {
    width: 100% !important;
    height: 41px !important;

    padding: 7px 10px !important;

    background: rgba(255,255,255,.72) !important;

    border: 1px solid #d8cfc2 !important;
    border-radius: 0 !important;

    color: #222 !important;

    box-shadow: none !important;
    outline: none !important;

    box-sizing: border-box;
}

.pay-content-wrapper .pay-input:focus {
    border-color: #b58a3b !important;

    box-shadow: 0 0 0 2px rgba(181,138,59,.08) !important;
}


/* EXPIRY SELECTS */

.pay-content-wrapper .expiry-wrapper {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.pay-content-wrapper .expiry-ddl {
    width: 100% !important;
    height: 41px !important;

    padding: 6px 9px !important;

    background-color: rgba(255,255,255,.72) !important;

    border: 1px solid #d8cfc2 !important;
    border-radius: 0 !important;

    color: #333;

    box-shadow: none !important;
}


/* ERROR */

.pay-content-wrapper .error-label {
    margin: 4px 0 0 !important;

    font-size: 11px !important;

    color: #a63a2f !important;
}


/* =========================================================
   DETALJI TRANSAKCIJE
   ========================================================= */

.pay-content-wrapper .payment-page-format > .transaction-details {
    padding: 18px 20px;

    background: rgba(255,255,255,.62);

    border: 1px solid #e0d7ca;
    border-top: 2px solid #b58a3b;

    box-sizing: border-box;
}

.pay-content-wrapper .payment-page-format > .transaction-details h4,
.pay-content-wrapper .payment-page-format > .transaction-details h5 {
    margin: 0 0 14px;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;

    color: #222 !important;
}


/* REDOVI TRANSAKCIJE */

.pay-content-wrapper .tran-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center;

    gap: 20px;

    padding: 8px 0;

    border-bottom: 1px solid #eee7dd;

    font-size: 13px;
}

.pay-content-wrapper .tran-item > span:first-child {
    color: #655e55;
}

.pay-content-wrapper .tran-item > span:last-child {
    color: #292621;

    text-align: right;
}


/* ZA UPLATU */

.pay-content-wrapper .tran-item.top-devider {
    margin-top: 6px;
    padding-top: 13px;

    border-top: 1px solid #b58a3b;
    border-bottom: 0;
}

.pay-content-wrapper .payment-amount {
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 23px !important;
    font-weight: 600 !important;

    color: #222 !important;
}


/* =========================================================
   BUTTONI
   ========================================================= */

.pay-content-wrapper .pay-buttons-wrapper {
    display: flex !important;

    gap: 10px;

    margin-top: 20px;
}


/* ODUSTANI */

.pay-content-wrapper .cancel-pay-btn {
    min-width: 130px;

    padding: 11px 22px !important;

    background: transparent !important;

    border: 1px solid #9b9185 !important;
    border-radius: 0 !important;

    color: #625b52 !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .04em;

    box-shadow: none !important;
}

.pay-content-wrapper .cancel-pay-btn:hover {
    background: #f0ece5 !important;

    border-color: #81776b !important;
}


/* PLATI */

.pay-content-wrapper .pay-btn {
    min-width: 150px;

    padding: 11px 24px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #fff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .04em;

    box-shadow: none !important;
}

.pay-content-wrapper .pay-btn:hover {
    background: #94702f !important;
    border-color: #94702f !important;
}


/* =========================================================
   DONJA NAPOMENA
   ========================================================= */

.pay-content-wrapper .text-background-pay:last-of-type {
    margin-top: 24px !important;

    background: #f7f3ec !important;

    border-left-width: 2px !important;
}


/* =========================================================
   PAYMENT ALREADY PROCESSED / CANCELLED
   ========================================================= */

.pay-content-wrapper center {
    padding-top: 70px !important;
    padding-bottom: 70px !important;
}

.pay-content-wrapper #Back {
    margin-top: 18px;

    padding: 11px 22px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #fff !important;

    box-shadow: none !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 800px) {

    .pay-content-wrapper {
        width: calc(100% - 24px);

        margin: 18px auto 40px;
    }

    .pay-content-wrapper .main-wrapper-pay {
        padding: 22px 16px 26px;
    }

    .pay-content-wrapper .payment-page-format {
        grid-template-columns: 1fr !important;
        gap: 22px;
    }

    .pay-content-wrapper .pay-buttons-wrapper {
        flex-direction: column;
    }

    .pay-content-wrapper .cancel-pay-btn,
    .pay-content-wrapper .pay-btn {
        width: 100%;
    }
}


/* =========================================================
   NARODNO POZORISTE - PAYMENT RESULT
   Success / Cancel
   ========================================================= */

.np-payment-result {
    width: min(1120px, calc(100% - 48px)) !important;
    max-width: 1120px !important;

    margin: 30px auto 60px !important;
    padding: 0 !important;
}

.np-payment-result > .col-md-12 {
    width: 100% !important;
    padding: 0 !important;
}


/* GLAVNI PANEL */

.np-payment-result > .col-md-12 > .row {
    margin: 0 !important;
    padding: 30px 30px 26px !important;

    background: #fbf9f5 !important;

    border: 1px solid #e4dccf !important;

    box-shadow:
        0 10px 30px rgba(58,43,24,.035);

    box-sizing: border-box;
}


/* =========================================================
   GLAVNA PORUKA
   ========================================================= */

.np-payment-result .reflection-text {
    max-width: 900px;

    margin: 0 auto 28px !important;
    padding: 0 20px !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 29px !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;

    letter-spacing: .04em !important;

    color: #222 !important;

    text-align: center !important;
}

.np-payment-result .reflection-text::after {
    content: "";

    display: block;

    width: 58px;
    height: 2px;

    margin: 14px auto 0;

    background: #b58a3b;
}


/* SUCCESS / ERROR IKONICE */

.np-payment-result .reflection-text .text-success {
    color: #4f8b63 !important;
}

.np-payment-result .reflection-text .text-danger {
    color: #a95145 !important;
}


/* =========================================================
   TRI KOLONE
   ========================================================= */

.np-payment-result .reflection-text + .row {
    display: flex !important;
    align-items: flex-start;

    margin: 0 -10px !important;
    padding: 0 !important;
}

.np-payment-result .reflection-text + .row > .col-md-4 {
    padding: 0 10px !important;
}


/* unutrasnji bootstrap wrapper */

.np-payment-result .col-md-4 > .col-md-12 {
    width: 100% !important;
    padding: 0 !important;
}


/* =========================================================
   KARTICE
   ========================================================= */

.np-payment-result .collection {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    background: rgba(255,255,255,.72) !important;

    border: 1px solid #dfd5c6 !important;
    border-radius: 0 !important;

    list-style: none;

    box-shadow: none !important;
}


/* NASLOVI KARTICA */

.np-payment-result .collection-header {
    padding: 14px 17px 11px !important;

    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #e6ded2 !important;
}

.np-payment-result .collection-header h5 {
    margin: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 23px !important;
    font-weight: 600 !important;

    color: #28241f !important;
}


/* REDOVI */

.np-payment-result .collection-item {
    min-height: 41px;

    padding: 9px 16px !important;

    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #eee7dc !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;
    line-height: 1.45;

    color: #5a544c !important;

    box-sizing: border-box;
}

.np-payment-result .collection-item:last-child {
    border-bottom: 0 !important;
}


/* VREDNOSTI */

.np-payment-result .secondary-content {
    color: #292621 !important;

    font-weight: 600 !important;

    text-align: right;
}


/* =========================================================
   ARTIKLI / KARTE
   ========================================================= */

.np-payment-result .article-mapping {
    padding: 10px 5px !important;

    border-bottom: 1px dashed #ded4c7 !important;
}

.np-payment-result .article-mapping:last-child {
    border-bottom: 0 !important;
}

.np-payment-result .text-style {
    margin: 3px 0 !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 12px !important;

    color: #625b52 !important;
}

.np-payment-result .text-style b {
    color: #292621;
}


/* =========================================================
   CANCEL NAPOMENA
   ========================================================= */

.np-payment-result .not-debited-note {
    margin: 14px 0 0 !important;
    padding: 12px 15px !important;

    background: rgba(169,81,69,.045);

    border-left: 2px solid #a95145;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 12px;
    line-height: 1.5;

    color: #65564f;
}


/* ukloni staru sivu debelu separator liniju */

.np-payment-result .w-100[style*="border-bottom"] {
    border-bottom: 1px solid #e2d8ca !important;
    opacity: 1 !important;
}


/* =========================================================
   DUGMAD
   ========================================================= */

.np-payment-result .ok-btn {
    margin: 24px 0 0 !important;
    padding: 0 !important;
}

.np-payment-result .ok-btn .col-md-12 {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    flex-wrap: wrap;

    gap: 9px !important;

    padding: 0 !important;
}


/* sva result dugmad */

.np-payment-result .cream-button,
.np-payment-result #Back {
    min-width: 125px;

    margin: 0 !important;
    padding: 11px 19px !important;

    background: transparent !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #8d692c !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .04em;

    box-shadow: none !important;
}

.np-payment-result .cream-button:hover,
.np-payment-result #Back:hover {
    background: #b58a3b !important;

    color: #fff !important;
}


/* OK kao glavno dugme */

.np-payment-result .ok-btn button:first-child {
    background: #b58a3b !important;
    color: #fff !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 800px) {

    .np-payment-result {
        width: calc(100% - 24px) !important;

        margin: 20px auto 40px !important;
    }

    .np-payment-result > .col-md-12 > .row {
        padding: 22px 15px 24px !important;
    }

    .np-payment-result .reflection-text {
        font-size: 25px !important;
    }

    .np-payment-result .reflection-text + .row {
        display: block !important;

        margin: 0 !important;
    }

    .np-payment-result .reflection-text + .row > .col-md-4 {
        width: 100% !important;

        margin-bottom: 14px;

        padding: 0 !important;
    }

    .np-payment-result .ok-btn .col-md-12 {
        flex-direction: column;
    }

    .np-payment-result .cream-button,
    .np-payment-result #Back {
        width: 100%;
    }
}


/* =========================================================
   NARODNO - SUCCESS PAGE BUTTONS FINAL
   ========================================================= */

.np-payment-result .ok-btn {
    margin: 34px 0 8px !important;
    padding: 0 !important;
}

.np-payment-result .ok-btn .col-md-12 {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    flex-wrap: wrap !important;

    gap: 12px !important;

    padding: 0 !important;
}

/* sva tri dugmeta */
.np-payment-result .ok-btn button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 170px !important;
    min-height: 42px !important;

    margin: 0 !important;
    padding: 11px 20px !important;

    border-radius: 0 !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .04em;

    box-shadow: none !important;
}

/* OK - glavno */
.np-payment-result .ok-btn button:first-child {
    background: #b58a3b !important;
    border: 1px solid #b58a3b !important;

    color: #fff !important;
}

/* stampanje - sekundarna */
.np-payment-result .ok-btn button:not(:first-child) {
    background: transparent !important;
    border: 1px solid #b58a3b !important;

    color: #8b682c !important;
}

.np-payment-result .ok-btn button:not(:first-child):hover {
    background: #b58a3b !important;
    color: #fff !important;
}

@media (max-width: 700px) {
    .np-payment-result .ok-btn button {
        width: 100% !important;
    }
}


/* =========================================================
   NARODNO - PAYMENT ALREADY PROCESSED
   ========================================================= */

.np-already-processed {
    width: min(980px, calc(100% - 48px)) !important;
    max-width: 980px !important;

    margin: 32px auto 60px !important;
    padding: 0 !important;
}

.np-already-processed > .col-md-12 {
    width: 100% !important;
    padding: 0 !important;
}


/* GLAVNI PANEL */

.np-already-processed > .col-md-12 > .row {
    margin: 0 !important;
    padding: 34px 32px 30px !important;

    background: #fbf9f5 !important;

    border: 1px solid #e4dccf !important;

    box-shadow: 0 10px 30px rgba(58,43,24,.035);

    box-sizing: border-box;
}


/* NASLOV */

.np-already-processed .reflection-text {
    max-width: 760px;

    margin: 0 auto 30px !important;
    padding: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 30px !important;
    font-weight: 600 !important;
    line-height: 1.12 !important;

    letter-spacing: .04em !important;

    color: #222 !important;

    text-align: center !important;
    text-transform: none !important;
}

.np-already-processed .reflection-text::after {
    content: "";

    display: block;

    width: 58px;
    height: 2px;

    margin: 14px auto 0;

    background: #b58a3b;
}


/* DVE KOLONE */

.np-already-processed .reflection-text + .row {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 22px;

    margin: 0 !important;
    padding: 0 !important;
}

.np-already-processed .reflection-text + .row > div {
    width: 100% !important;
    padding: 0 !important;
}


/* KARTICE */

.np-already-processed .collection {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    background: rgba(255,255,255,.72) !important;

    border: 1px solid #dfd5c6 !important;
    border-radius: 0 !important;

    list-style: none;

    box-shadow: none !important;
}

.np-already-processed .collection-header {
    padding: 14px 17px 11px !important;

    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #e6ded2 !important;
}

.np-already-processed .collection-header h5 {
    margin: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 23px !important;
    font-weight: 600 !important;

    color: #28241f !important;
}


/* REDOVI */

.np-already-processed .collection-item {
    min-height: 43px;

    padding: 10px 16px !important;

    background: transparent !important;

    border: 0 !important;
    border-bottom: 1px solid #eee7dc !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 13px !important;

    color: #5a544c !important;
}

.np-already-processed .collection-item:last-child {
    border-bottom: 0 !important;
}

.np-already-processed .secondary-content {
    color: #292621 !important;

    font-weight: 600 !important;
    text-align: right;
}


/* STATUS USPEŠNO */

.np-already-processed .text-success {
    color: #4f8b63 !important;
}


/* DUGME NAZAD */

.np-already-processed .ok-btn {
    margin: 30px 0 0 !important;
    padding: 0 !important;
}

.np-already-processed .ok-btn .col-md-12 {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    padding: 0 !important;
}

.np-already-processed #Back,
.np-already-processed .cream-button {
    min-width: 240px !important;
    min-height: 42px !important;

    margin: 0 !important;
    padding: 11px 24px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #fff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;

    text-transform: uppercase;
    letter-spacing: .04em;

    box-shadow: none !important;
}

.np-already-processed #Back:hover,
.np-already-processed .cream-button:hover {
    background: #94702f !important;
    border-color: #94702f !important;
}


/* MOBILE */

@media (max-width: 700px) {

    .np-already-processed {
        width: calc(100% - 24px) !important;

        margin: 20px auto 40px !important;
    }

    .np-already-processed > .col-md-12 > .row {
        padding: 24px 16px !important;
    }

    .np-already-processed .reflection-text {
        font-size: 25px !important;
    }

    .np-already-processed .reflection-text + .row {
        grid-template-columns: 1fr !important;
    }

    .np-already-processed #Back,
    .np-already-processed .cream-button {
        width: 100% !important;
    }
}


/* =========================================================
   NARODNO POZORISTE
   PAYMENT ALREADY PROCESSED - FINAL
   ========================================================= */

.np-already-processed-page {
    width: 100%;
    padding: 46px 24px 72px;
    background: #faf8f3;
    box-sizing: border-box;
}

.np-already-processed-card {
    width: min(960px, 100%);
    margin: 0 auto;
    padding: 46px 48px 42px;

    background: #fffdf9;

    border: 1px solid #e5dccf;

    box-shadow:
        0 18px 55px rgba(57, 42, 23, .055);

    box-sizing: border-box;
}


/* =========================================================
   TITLE
   ========================================================= */

.np-already-processed-title {
    max-width: 760px;

    margin: 0 auto 36px;

    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: 38px;
    font-weight: 600;
    line-height: 1.08;

    letter-spacing: .01em;

    color: #26221d;

    text-align: center;
}

.np-already-processed-title::after {
    content: "";

    display: block;

    width: 58px;
    height: 2px;

    margin: 17px auto 0;

    background: #b58a3b;
}


/* =========================================================
   TWO CARDS
   ========================================================= */

.np-already-processed-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;

    gap: 24px;
}

.np-already-processed-column {
    min-width: 0;
}


/* old Materialize collection reset */

.np-already-processed-page .collection {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;

    background: #fff !important;

    border: 1px solid #e4dbce !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    list-style: none;
}


/* CARD HEADER */

.np-already-processed-page .collection-header {
    padding: 17px 20px 14px !important;

    background: #fbf8f2 !important;

    border: 0 !important;
    border-bottom: 1px solid #e6ded2 !important;
}

.np-already-processed-page .collection-header h5 {
    margin: 0 !important;

    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-size: 25px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;

    color: #2c2823 !important;
}


/* CARD ROWS */

.np-already-processed-page .collection-item {
    min-height: 48px;

    padding: 13px 19px !important;

    background: #fff !important;

    border: 0 !important;
    border-bottom: 1px solid #eee8df !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.45;

    color: #72695e !important;

    box-sizing: border-box;
}

.np-already-processed-page .collection-item:last-child {
    border-bottom: 0 !important;
}


/* VALUE */

.np-already-processed-page .secondary-content {
    float: right;

    max-width: 58%;

    color: #2a2722 !important;

    font-weight: 600 !important;

    text-align: right;
}


/* PAYMENT STATUS - zadrzavamo boju koju view daje */

.np-already-processed-page .collection-item .secondary-content[style] {
    font-weight: 700 !important;
}


/* =========================================================
   ACTION
   ========================================================= */

.np-already-processed-actions {
    margin-top: 34px;
}

.np-already-processed-actions-inner {
    display: flex;

    justify-content: center;
    align-items: center;
}

.np-already-processed-back {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    min-width: 230px;
    min-height: 44px;

    padding: 11px 26px;

    background: #b58a3b;

    border: 1px solid #b58a3b;
    border-radius: 0;

    color: #fff;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .045em;

    cursor: pointer;

    box-shadow: none;

    transition:
        background .2s ease,
        border-color .2s ease;
}

.np-already-processed-back:hover,
.np-already-processed-back:focus {
    background: #94702f;
    border-color: #94702f;

    color: #fff;

    outline: none;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 760px) {

    .np-already-processed-page {
        padding: 24px 12px 48px;
    }

    .np-already-processed-card {
        padding: 30px 18px 28px;
    }

    .np-already-processed-title {
        margin-bottom: 28px;

        font-size: 30px;
    }

    .np-already-processed-grid {
        grid-template-columns: 1fr;

        gap: 16px;
    }

    .np-already-processed-page .secondary-content {
        max-width: 55%;
    }

    .np-already-processed-back {
        width: 100%;
    }
}


/* =========================================================
   NARODNO - MSU SUCCESS BUTTONS FINAL
   ========================================================= */

.np-success-actions {
    width: 100%;
    margin: 38px 0 10px !important;
    padding: 0 !important;
}

.np-success-actions-inner {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    flex-wrap: wrap !important;

    gap: 14px !important;

    width: 100%;
    padding: 0 !important;
}

.np-success-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 185px !important;
    min-height: 44px !important;

    margin: 0 !important;
    padding: 11px 22px !important;

    border-radius: 0 !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;

    text-transform: uppercase !important;
    letter-spacing: .045em !important;

    box-shadow: none !important;
    cursor: pointer !important;
}


/* OK */

.np-success-btn-primary {
    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;

    color: #fff !important;
}

.np-success-btn-primary:hover,
.np-success-btn-primary:focus {
    background: #94702f !important;
    border-color: #94702f !important;

    color: #fff !important;
}


/* STAMPA */

.np-success-btn-secondary {
    background: #fffdf9 !important;

    border: 1px solid #b58a3b !important;

    color: #8a672b !important;
}

.np-success-btn-secondary:hover,
.np-success-btn-secondary:focus {
    background: #b58a3b !important;

    color: #fff !important;
}


/* ako unutra postoji span ili drugi element sa starim white stilom */

.np-success-btn-secondary *,
.np-success-btn-secondary span {
    color: #8a672b !important;
}

.np-success-btn-secondary:hover *,
.np-success-btn-secondary:hover span,
.np-success-btn-secondary:focus *,
.np-success-btn-secondary:focus span {
    color: #fff !important;
}

.np-success-btn-primary *,
.np-success-btn-primary span {
    color: #fff !important;
}


@media (max-width: 720px) {

    .np-success-actions-inner {
        flex-direction: column !important;
        gap: 10px !important;
    }

    .np-success-btn {
        width: 100% !important;
        max-width: 360px !important;
    }
}


/* =========================================================
   NARODNO - INIT PAYMENT VALIDATION
   ========================================================= */

.init-payment-row .np-field-error {
    display: none;

    margin-top: 6px;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 11px;
    line-height: 1.3;

    color: #a64f43;
}

.init-payment-row .np-field-error.is-visible {
    display: block;
}

.init-payment-row .customer-input.np-input-invalid {
    border-bottom-color: #a64f43 !important;

    box-shadow: 0 1px 0 #a64f43 !important;
}


/* =========================================================
   NARODNO - PAYMENT COUNTDOWN
   ========================================================= */

.np-payment-countdown {
    display: flex !important;
    flex-direction: row !important;

    align-items: baseline !important;
    justify-content: flex-end !important;

    gap: 8px !important;

    margin: 0 10px 18px 0 !important;
}

.np-payment-countdown-label,
.np-payment-countdown-value {
    margin: 0 !important;
    padding: 0 !important;

    line-height: 1.25 !important;
}

.np-payment-countdown-label {
    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 11px !important;

    color: #61594f;
}

.np-payment-countdown-value {
    min-width: 38px;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 12px !important;
    font-weight: 600;

    color: #8a672b;
}


/* =========================================================
   NARODNO - MSU CANCEL BUTTON FINAL
   ========================================================= */

.np-cancel-actions {
    width: 100%;
    margin: 34px 0 10px !important;
    padding: 0 !important;
}

.np-cancel-actions-inner {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    width: 100%;
    padding: 0 !important;
}

.np-cancel-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 185px !important;
    min-height: 44px !important;

    margin: 0 !important;
    padding: 11px 24px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #fff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;

    text-transform: uppercase !important;
    letter-spacing: .045em !important;

    box-shadow: none !important;
    cursor: pointer !important;
}

.np-cancel-btn *,
.np-cancel-btn span {
    color: #fff !important;
}

.np-cancel-btn:hover,
.np-cancel-btn:focus {
    background: #94702f !important;
    border-color: #94702f !important;

    color: #fff !important;
}

@media (max-width: 720px) {
    .np-cancel-btn {
        width: 100% !important;
        max-width: 360px !important;
    }
}


/* NARODNO - CUSTOMER VALIDATION */

.init-payment-row .np-validation-message {
    margin-top: 6px !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.35;

    color: #a94f43;
}

.init-payment-row .customer-input.np-input-invalid {
    border-bottom: 1px solid #a94f43 !important;
    box-shadow: 0 1px 0 #a94f43 !important;
}


/* =========================================================
   NARODNO - CANCEL RESULT BUTTON ABSOLUTE FINAL FIX
   ========================================================= */

/* napravi pravi razmak od poruke iznad */
.np-payment-result .not-debited-note {
    margin-bottom: 0 !important;
}

.np-payment-result .ok-btn {
    width: 100% !important;

    margin: 38px 0 8px !important;
    padding: 0 !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    float: none !important;
    clear: both !important;
}

.np-payment-result .ok-btn > .col-md-12,
.np-payment-result .ok-btn .text-center {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    float: none !important;
}

/* samo dugme na cancel strani */
.np-payment-result .ok-btn #Back,
.np-payment-result .ok-btn .cream-button {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;

    width: auto !important;
    min-width: 200px !important;
    height: 44px !important;
    min-height: 44px !important;

    margin: 0 auto !important;
    padding: 0 28px !important;

    background: #b58a3b !important;

    border: 1px solid #b58a3b !important;
    border-radius: 0 !important;

    color: #ffffff !important;

    font-family: "Source Sans 3", Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1 !important;

    text-align: center !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;

    box-shadow: none !important;

    float: none !important;
}

/* ako postoji span sa starim inline white / drugim pravilima */
.np-payment-result .ok-btn #Back span,
.np-payment-result .ok-btn .cream-button span {
    display: inline !important;

    background: transparent !important;
    color: #ffffff !important;

    font: inherit !important;
    line-height: inherit !important;
}

.np-payment-result .ok-btn #Back:hover,
.np-payment-result .ok-btn .cream-button:hover {
    background: #94702f !important;
    border-color: #94702f !important;
    color: #ffffff !important;
}

@media (max-width: 720px) {
    .np-payment-result .ok-btn #Back,
    .np-payment-result .ok-btn .cream-button {
        width: 100% !important;
        max-width: 340px !important;
    }
}


/* CANCEL - dodatni razmak iznad OK dugmeta */
.np-cancel-actions {
    margin-top: 52px !important;
}

/* fallback ako view jos koristi stari ok-btn wrapper */
.np-payment-result .not-debited-note + .ok-btn,
.np-payment-result .ok-btn {
    margin-top: 52px !important;
}


/* INIT PAYMENT - validacija kupca */

.init-payment-row .np-validation-message {
    display: none;

    margin: 7px 0 1px !important;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.35;

    color: #ad4e43;
}

.init-payment-row .customer-input.np-input-invalid {
    border-bottom: 1px solid #ad4e43 !important;
    box-shadow: 0 1px 0 #ad4e43 !important;
}


/* =========================================================
   PAYMENT RESULT - FINAL ACTION SPACING
   ========================================================= */

/* SUCCESS - odvoji sva 3 dugmeta od kartica iznad */
.np-success-actions {
    margin-top: 48px !important;
    margin-bottom: 12px !important;
}


/* fallback ako negde jos postoji stari wrapper */
.np-payment-result .ok-btn {
    margin-top: 48px !important;
    margin-bottom: 12px !important;
}


/* CANCEL - odvoji OK od poruke iznad */
.np-cancel-actions {
    margin-top: 48px !important;
    margin-bottom: 12px !important;
}


/* dodatno obezbedi da prethodni elementi ne guraju dugme nazad */
.np-payment-result .not-debited-note {
    margin-bottom: 0 !important;
}


/* =========================================================
   PAYMENT RESULT ACTION ROW - REAL FINAL FIX
   ========================================================= */

/*
   Success: parent sa tri kartice mora dozvoliti novi red.
*/
.np-payment-result .reflection-text + .row {
    display: flex !important;
    flex-wrap: wrap !important;
}

/* tri kartice ostaju po 1/3 */
.np-payment-result .reflection-text + .row > .col-md-4 {
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
}

/*
   Success actions postaju zaseban CETVRTI element,
   ali zauzimaju ceo sledeci red.
*/
.np-payment-result .np-success-actions {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;

    display: block !important;

    clear: both !important;
    float: none !important;

    margin: 0 !important;
    padding: 52px 0 10px !important;
    box-sizing: border-box !important;
}

.np-payment-result .np-success-actions-inner {
    width: 100% !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    gap: 14px !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* =========================================================
   CANCEL
   ========================================================= */

.np-payment-result .ok-btn {
    width: 100% !important;

    display: block !important;

    clear: both !important;
    float: none !important;

    margin: 0 !important;
    padding: 52px 0 10px !important;

    box-sizing: border-box !important;
}

.np-payment-result .ok-btn > .col-md-12 {
    width: 100% !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    float: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/* mobile */
@media (max-width: 800px) {

    .np-payment-result .reflection-text + .row > .col-md-4 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .np-payment-result .np-success-actions {
        padding-top: 32px !important;
    }

    .np-payment-result .ok-btn {
        padding-top: 32px !important;
    }
}


/* =========================================================
   NARODNO POZORISTE - PAYMENT HEADER
   ========================================================= */

.payment-site-header {
    background: #fff !important;
    border-bottom: 1px solid #e7dfd3;
}

.payment-header {
    min-height: 82px;

    display: flex;
    align-items: center;

    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.payment-header .ticket-logo {
    margin-right: auto;
}

.payment-header-status {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    margin-left: auto;

    font-family: "Source Sans 3", Arial, sans-serif;
    font-size: 12px;
    font-weight: 600;

    color: #625a50;

    letter-spacing: .02em;
}

.payment-header-status-dot {
    display: block;

    width: 7px;
    height: 7px;

    border-radius: 50%;

    background: #b58a3b;
}

@media (max-width: 600px) {

    .payment-header {
        min-height: 68px;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .payment-header .ticket-logo img {
        width: 125px !important;
    }

    .payment-header-status {
        font-size: 11px;
    }
}


/* =========================================================
   PAYMENT FOOTER - HORIZONTALNI RASPORED KARTICA
   ========================================================= */

#copy-rights .contain {
    width: 100% !important;
    max-width: 1180px !important;
    margin: 0 auto !important;
}

#copy-rights .payments {
    width: 100% !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;

    justify-content: center !important;
    align-items: center !important;

    gap: 12px 18px !important;

    text-align: center !important;
}

#copy-rights .payments > div {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#copy-rights .payments > div img {
    display: block !important;
    width: auto !important;
    max-width: 70px !important;
    max-height: 60px !important;

    object-fit: contain !important;
}

#copy-rights .payments > p {
    flex: 0 0 100% !important;
    width: 100% !important;

    margin: 10px 0 0 !important;

    text-align: center !important;
}


/* Desktop koristi .payments, ne mobile kopiju */
#copy-rights .payments-mob {
    display: none !important;
}


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

    #copy-rights .payments {
        display: none !important;
    }

    #copy-rights .payments-mob {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;

        justify-content: center !important;
        align-items: center !important;

        gap: 10px 14px !important;
    }

    #copy-rights .payments-mob .mob-payment {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: auto !important;
        margin: 0 !important;
    }

    #copy-rights .payments-mob br {
        display: none !important;
    }

    #copy-rights .payments-mob img {
        width: auto !important;
        max-width: 64px !important;
        max-height: 48px !important;

        object-fit: contain !important;
    }

    #copy-rights .payments-mob p {
        flex: 0 0 100% !important;
        width: 100% !important;

        text-align: center !important;
    }
}


/* =========================================================
   PAYMENT FOOTER - DONJA TRAKA
   Desktop: Powered by levo, autorska prava u sredini, uslovi desno.
   Tablet i mobile: uslovi, autorska prava i Powered by jedno ispod drugog.
   ========================================================= */

#copy-rights .contain {
    position: relative !important;
}

#copy-rights .footer-text {
    margin-top: 4px;

    font-family: "sourcesanspro", "Source Sans Pro", Arial, sans-serif;
    font-size: 12px;
    line-height: 1.3;
    color: #f3ede3;
    text-align: center;
}

#copy-rights .footer-text a {
    color: #f3ede3 !important;
    font-weight: 600;
    text-decoration: none;
}

#copy-rights .footer-terms {
    cursor: pointer;
}

#copy-rights .footer-text a:hover,
#copy-rights .footer-terms:hover {
    color: #fff !important;
    text-decoration: underline !important;
}

#copy-rights .payments-mob .footer-row {
    display: block;
}

@media (min-width: 901px) {

    #copy-rights {
        padding-bottom: 14px !important;
    }

    #copy-rights .payments > p {
        margin-top: 14px !important;
        padding-top: 10px !important;
        border-top: 1px solid rgba(243, 237, 227, .18);

        font-size: 12px !important;
        line-height: 1.3 !important;
    }

    #copy-rights .footer-text {
        position: absolute;
        left: 24px;
        bottom: 0;
        margin-top: 0;
    }

    #copy-rights .payments > p .footer-terms {
        position: absolute;
        right: 24px;
        bottom: 0;
    }
}

@media (min-width: 701px) and (max-width: 900px) {

    #copy-rights .payments > p {
        display: flex !important;
        flex-direction: column;
        align-items: center;
    }

    #copy-rights .payments > p .footer-terms {
        order: -1;
    }
}


/* =========================================================
   NARODNO - MOBILE REPERTOIRE FINAL FIX
   Desktop fixed-height pravila ne smeju da odseku CTA na telefonu
   ========================================================= */

@media (max-width: 650px) {

    .np-repertoire-card {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;

        grid-template-columns: 90px minmax(0, 1fr) !important;
    }

    .np-repertoire-date {
        height: auto !important;
        min-height: 210px !important;
        max-height: none !important;

        grid-row: 1 / span 2 !important;
    }

    .np-repertoire-poster {
        width: 100% !important;
        height: 210px !important;
        min-height: 210px !important;
        max-height: none !important;
    }

    .np-repertoire-content {
        grid-column: 1 / -1 !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        padding: 20px !important;

        overflow: visible !important;
    }

    .np-repertoire-action {
        grid-column: 1 / -1 !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        padding: 0 20px 22px !important;

        display: flex !important;
        justify-content: stretch !important;
        align-items: center !important;

        overflow: visible !important;
        position: relative !important;
        z-index: 5 !important;
    }

    .np-repertoire-buy {
        display: block !important;

        width: 100% !important;
        min-width: 0 !important;
        height: 44px !important;

        position: relative !important;
        z-index: 6 !important;

        pointer-events: auto !important;
        cursor: pointer !important;
    }
}


/* =========================================================
   NARODNO - MOBILE POLISH
   ========================================================= */

@media (max-width: 1100px) {

    /* Header CTA */
    .ticket-header .ticket-buy-mobile-header {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        height: 34px !important;
        padding: 0 13px !important;
        margin-left: auto !important;
        margin-right: 10px !important;

        background-color: #b58a3b !important;
        border: 1px solid #b58a3b !important;
        border-radius: 0 !important;

        color: #fff !important;
        font-size: 10px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
        letter-spacing: .04em !important;

        text-decoration: none !important;
        white-space: nowrap !important;
    }

    .ticket-menu-toggle {
        margin-left: 0 !important;
    }
}

@media (max-width: 650px) {

    /* Repertoire card */
    .np-repertoire {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .np-repertoire-card {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto auto auto !important;

        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin-bottom: 20px !important;

        overflow: hidden !important;
    }

    /* Datum ide horizontalno iznad slike */
    .np-repertoire-date {
        grid-column: 1 !important;
        grid-row: auto !important;

        height: auto !important;
        min-height: 0 !important;

        padding: 14px 18px !important;

        display: flex !important;
        flex-direction: row !important;
        align-items: baseline !important;
        justify-content: flex-start !important;

        gap: 8px !important;

        border-bottom: 1px solid #e6ded2 !important;
    }

    .np-repertoire-day-number {
        margin: 0 !important;

        font-size: 29px !important;
        line-height: 1 !important;
    }

    .np-repertoire-month {
        margin: 0 !important;

        font-size: 12px !important;
        line-height: 1 !important;

        white-space: nowrap !important;
    }

    .np-repertoire-weekday {
        margin: 0 0 0 3px !important;

        font-size: 11px !important;
        line-height: 1 !important;

        color: #777 !important;
    }


    /* Poster */
    .np-repertoire-poster {
        grid-column: 1 !important;
        grid-row: auto !important;

        width: 100% !important;
        height: 220px !important;
        min-height: 220px !important;

        overflow: hidden !important;
    }

    .np-repertoire-poster img {
        width: 100% !important;
        height: 100% !important;

        object-fit: cover !important;
        object-position: center !important;
    }


    /* Tekst */
    .np-repertoire-content {
        grid-column: 1 !important;
        grid-row: auto !important;

        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        padding: 20px 18px 14px !important;

        overflow: visible !important;
    }

    .np-repertoire-title {
        margin: 0 0 14px !important;

        font-size: 27px !important;
        line-height: 1.08 !important;
    }

    .np-repertoire-meta {
        margin: 0 !important;

        gap: 12px 18px !important;
    }


    /* Kupovina */
    .np-repertoire-action {
        grid-column: 1 !important;
        grid-row: auto !important;

        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;

        padding: 0 18px 20px !important;

        display: block !important;
    }

    .np-repertoire-buy {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        height: 44px !important;
        min-width: 0 !important;

        background: #b58a3b !important;
        border-color: #b58a3b !important;

        color: #fff !important;

        font-size: 12px !important;
        font-weight: 600 !important;

        cursor: pointer !important;
        pointer-events: auto !important;
    }
}

@media (max-width: 390px) {

    .ticket-logo img {
        width: 120px !important;
    }

    .ticket-header .ticket-buy-mobile-header {
        height: 32px !important;
        padding: 0 9px !important;
        margin-right: 6px !important;
        font-size: 9px !important;
    }

    .np-repertoire-poster {
        height: 195px !important;
        min-height: 195px !important;
    }
}

