/* ============================================================
   Rocío – Stránka /objednavka/dekujeme/
   Single-card layout + banner "Ohodnoťte nás"
   ============================================================ */

/* Container */
body.in-dekujeme #content-wrapper.container.content-wrapper {
    max-width: 1100px !important;
    margin: 40px auto 80px !important;
    padding: 0 16px !important;
}

/* Přepíšeme globální margin-top z hlavního Rocío CSS – na děkovací stránce
   nepotřebujeme tolik prostoru pod fixním navem */
body.in-dekujeme #content,
body.in-dekujeme .content,
body.in-dekujeme .content-wrapper,
body.in-dekujeme main {
    margin-top: 0 !important;
}

/* ===== Hlavička stránky ===== */

body.in-dekujeme .payment-success-icon {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 8px auto 16px !important;
}

/* Necháme zelený kroužek od Shoptetu, ale fajfku úplně skryjeme */
body.in-dekujeme div.payment-success-icon i.icon-tick {
    position: relative !important;
    color: transparent !important;
    font-size: 0 !important;
    text-indent: -9999px !important;
    overflow: visible !important;
    text-shadow: none !important;
}

/* Skryjeme původní glyph z ikonového fontu */
body.in-dekujeme div.payment-success-icon i.icon-tick::before {
    color: transparent !important;
    font-size: 0 !important;
    visibility: hidden !important;
    text-shadow: none !important;
}

/* Vlastní fajfka jako pseudo-element ::after, vycentrovaná uvnitř kruhu */
body.in-dekujeme div.payment-success-icon i.icon-tick::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 68px !important;
    height: 68px !important;
    background-image: url('https://www.rocio.cz/user/documents/upload/Ikony/Check.svg') !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    visibility: visible !important;
}

body.in-dekujeme .order-summary-heading {
    text-align: center !important;
    font-family: "Neulis Alt", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    color: #003D5B !important;
    margin: 0 0 32px !important;
    letter-spacing: -0.01em !important;
    line-height: 1.2 !important;
}

/* ===== Hlavní karta – sjednocujeme oba .recapitulation-wrapper do vizuálně jedné ===== */

/* Hlavní karta – sjednocujeme oba .recapitulation-wrapper */
body.in-dekujeme .recapitulation-wrapper {
    background: #ffffff !important;
    border: 1px solid rgba(0, 61, 91, 0.08) !important;
    box-shadow: 0 3px 14px rgba(0, 61, 91, 0.05) !important;
    padding: 32px 36px !important;
    margin: 0 !important;
    font-family: "Neulis Alt", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    color: #003D5B !important;
}

/* První karta – horní rohy zaoblené */
body.in-dekujeme .recapitulation-wrapper:first-of-type,
body.in-dekujeme .recapitulation-wrapper[data-testid="recapTable"] {
    border-radius: 16px 16px 0 0 !important;
    border-bottom: none !important;
    padding: 32px 36px 24px !important;
    margin-bottom: 0 !important;
}

/* Poslední karta – spodní rohy zaoblené, navazuje na první */
body.in-dekujeme .recapitulation-wrapper:last-of-type,
body.in-dekujeme .recapitulation-wrapper:not([data-testid]) {
    border-radius: 0 0 16px 16px !important;
    border-top: none !important;
    padding: 24px 36px 36px !important;
    text-align: center !important;
    margin-bottom: 32px !important;
}

/* ===== Číslo objednávky ===== */

body.in-dekujeme .recapitulation-wrapper .reca-number {
    text-align: center !important;
    font-size: 16px !important;
    color: #5a7080 !important;
    margin: 0 0 32px !important;
    padding: 0 0 24px !important;
    border-bottom: 1px solid rgba(0, 61, 91, 0.08) !important;
    letter-spacing: 0.01em !important;
    font-weight: 400 !important;
}

body.in-dekujeme .recapitulation-wrapper .reca-number strong {
    color: #003D5B !important;
    font-weight: 700 !important;
    font-size: 22px !important;
    margin-left: 6px !important;
    letter-spacing: -0.01em !important;
}

/* ===== Sekce "Platba a doručení" ===== */

body.in-dekujeme .co-box.co-payment-method {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 0 28px !important;
}

body.in-dekujeme .co-box.co-payment-method h4.order-payment {
    font-family: "Neulis Alt", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: #AC8B63 !important;
    margin: 0 0 22px !important;
    padding: 0 0 14px !important;
    border-bottom: 1px solid #D3C5AB !important;
    text-align: center !important;
}

/* H4 default mívá ikony – přepíšeme */
body.in-dekujeme .co-box.co-payment-method h4.order-payment::before,
body.in-dekujeme .co-box.co-payment-method h4.order-payment::after {
    content: none !important;
    display: none !important;
}

/* Vnitřní Bootstrap row – necháme natural flow + plná šířka */
body.in-dekujeme .co-box.co-payment-method .row,
body.in-dekujeme .co-box.co-payment-method .reca-row-centered {
    margin: 0 !important;
    display: block !important;
    width: 100% !important;
}

body.in-dekujeme .co-box.co-payment-method .col-lg-12 {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    float: none !important;
    display: block !important;
}

/* Tabulka s rekapitulací – key/value rows roztažené přes celou šířku */
body.in-dekujeme .recapitulation-table,
body.in-dekujeme table.recapitulation-table,
body.in-dekujeme table.table.recapitulation-table {
    width: 100% !important;
    max-width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
    table-layout: fixed !important;
    display: table !important;
}

body.in-dekujeme .recapitulation-table tbody {
    display: table-row-group !important;
    width: 100% !important;
}

body.in-dekujeme .recapitulation-table tr {
    border: none !important;
    display: table-row !important;
    width: 100% !important;
}

body.in-dekujeme .recapitulation-table tr + tr th,
body.in-dekujeme .recapitulation-table tr + tr td {
    border-top: 1px solid rgba(0, 61, 91, 0.08) !important;
}

body.in-dekujeme .recapitulation-table th,
body.in-dekujeme .recapitulation-table td {
    padding: 14px 0 !important;
    font-size: 15px !important;
    border: none !important;
    vertical-align: middle !important;
    display: table-cell !important;
}

body.in-dekujeme .recapitulation-table th {
    text-align: left !important;
    font-weight: 400 !important;
    color: #5a7080 !important;
    width: 50% !important;
    white-space: nowrap !important;
}

body.in-dekujeme .recapitulation-table th .row-header-label {
    font-weight: 400 !important;
    color: #5a7080 !important;
}

body.in-dekujeme .recapitulation-table td {
    text-align: right !important;
    color: #003D5B !important;
    font-weight: 600 !important;
    width: 50% !important;
}

/* ===== Sekce "Obsah objednávky" ===== */

body.in-dekujeme .co-order {
    margin: 0 !important;
}

body.in-dekujeme .co-order > h4 {
    font-family: "Neulis Alt", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    color: #AC8B63 !important;
    margin: 0 0 22px !important;
    padding: 0 0 14px !important;
    border-bottom: 1px solid #D3C5AB !important;
    text-align: center !important;
}

body.in-dekujeme .co-order .cart-table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
    table-layout: auto !important;
}

body.in-dekujeme .co-order .cart-table tr {
    border: none !important;
    border-top: 1px solid rgba(0, 61, 91, 0.08) !important;
}

body.in-dekujeme .co-order .cart-table tr:first-child {
    border-top: none !important;
}

body.in-dekujeme .co-order .cart-table td {
    padding: 14px 0 !important;
    font-size: 14px !important;
    color: #003D5B !important;
    vertical-align: middle !important;
    border: none !important;
}

/* Obrázek produktu */
body.in-dekujeme .co-order .cart-table .cart-p-image {
    width: 120px !important;
    padding: 18px 24px 18px 0 !important;
}

body.in-dekujeme .co-order .cart-table .cart-p-image img {
    width: 100px !important;
    height: 100px !important;
    border-radius: 14px !important;
    object-fit: cover !important;
    border: 1px solid rgba(0, 61, 91, 0.06) !important;
    background: #f5f3ef !important;
    display: block !important;
}

/* Název produktu */
body.in-dekujeme .co-order .cart-table .p-name {
    text-align: left !important;
    padding-right: 16px !important;
}

body.in-dekujeme .co-order .cart-table .p-name span {
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #003D5B !important;
    line-height: 1.4 !important;
}

/* Množství */
body.in-dekujeme .co-order .cart-table .p-quantity {
    text-align: right !important;
    white-space: nowrap !important;
    font-size: 13px !important;
    color: #5a7080 !important;
    padding: 14px 12px !important;
}

body.in-dekujeme .co-order .cart-table .p-quantity strong {
    color: #003D5B !important;
    font-weight: 600 !important;
}

body.in-dekujeme .co-order .cart-table .p-quantity span {
    color: rgba(0, 61, 91, 0.3) !important;
    margin: 0 4px !important;
}

/* Cena (poslední sloupec) */
body.in-dekujeme .co-order .cart-table .p-price {
    text-align: right !important;
    font-weight: 600 !important;
    color: #003D5B !important;
    font-size: 14px !important;
    white-space: nowrap !important;
}

/* ===== Spodní karta – Děkujeme ===== */

body.in-dekujeme .recapitulation-wrapper:last-of-type .order-summary-item.total {
    font-size: 14px !important;
    color: #5a7080 !important;
    margin: 0 0 8px !important;
}

body.in-dekujeme .recapitulation-wrapper:last-of-type .order-summary-item.summary-thx {
    font-family: "Neulis Alt", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #003D5B !important;
    margin: 0 0 22px !important;
    letter-spacing: -0.01em !important;
}

body.in-dekujeme .order-complete-links {
    margin: 0 !important;
}

body.in-dekujeme .order-complete-links p {
    margin: 0 !important;
}

body.in-dekujeme .order-complete-links .btn,
body.in-dekujeme .order-complete-links .btn.btn-primary,
body.in-dekujeme .order-complete-links .btn.btn-conversion {
    display: inline-block !important;
    padding: 12px 28px !important;
    background: #003D5B !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 999px !important;
    font-family: "Neulis Alt", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: background 0.2s ease !important;
}

body.in-dekujeme .order-complete-links .btn:hover,
body.in-dekujeme .order-complete-links .btn.btn-primary:hover,
body.in-dekujeme .order-complete-links .btn.btn-conversion:hover {
    background: #07283b !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* ============================================================
   BANNER "Ohodnoťte nás" – vkládá se přes JS za h1
   ============================================================ */

.rc-tb {
    opacity: 1;
    transform: translateY(0);
    max-width: 100%;
    margin: 0 auto 24px;
    padding: 20px 24px;
    background: linear-gradient(135deg, #003D5B 0%, #07283b 100%);
    border-radius: 14px;
    box-shadow: 0 4px 20px rgba(0, 61, 91, 0.12);
    color: #ffffff;
    font-family: "Neulis Alt", "Helvetica Neue", Helvetica, Arial, sans-serif;
    display: flex;
    align-items: center;
    gap: 18px;
    position: relative;
    box-sizing: border-box;
}

.rc-tb.rc-tb--out {
    opacity: 0;
    transform: translateY(-8px);
    pointer-events: none;
    margin: 0 auto !important;
    max-height: 0 !important;
    padding: 0 24px !important;
    overflow: hidden !important;
    transition: opacity 0.4s ease, transform 0.4s ease, max-height 0.4s ease, padding 0.4s ease, margin 0.4s ease;
}

.rc-tb__x {
    position: absolute;
    top: 8px;
    right: 12px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-size: 14px;
    line-height: 22px;
    text-align: center;
    cursor: pointer;
    border: none;
    padding: 0;
    font-family: inherit;
    transition: background 0.2s ease;
}

.rc-tb__x:hover {
    background: rgba(255, 255, 255, 0.22);
}

.rc-tb__ico {
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #AC8B63;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rc-tb__ico svg {
    width: 22px;
    height: 22px;
    display: block;
}

.rc-tb__txt {
    flex: 1;
    min-width: 0;
}

.rc-tb__t {
    font-size: 15px;
    font-weight: 600;
    margin: 0 0 4px;
    color: #ffffff;
    line-height: 1.3;
}

.rc-tb__s {
    font-size: 13px;
    color: rgba(255, 255, 255, 0.75);
    margin: 0;
    line-height: 1.5;
}

.rc-tb__btn {
    flex: 0 0 auto;
    background: #AC8B63;
    color: #ffffff !important;
    padding: 11px 22px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none !important;
    white-space: nowrap;
    transition: background 0.2s ease, transform 0.15s ease;
    border: none;
    cursor: pointer;
    font-family: inherit;
    line-height: 1;
}

.rc-tb__btn:hover {
    background: #c9a376;
    text-decoration: none !important;
    transform: translateY(-1px);
}

/* ============================================================
   Mobil
   ============================================================ */
@media (max-width: 600px) {
    /* Karty – menší padding na mobilu */
    body.in-dekujeme .recapitulation-wrapper,
    body.in-dekujeme .recapitulation-wrapper:first-of-type,
    body.in-dekujeme .recapitulation-wrapper:last-of-type {
        padding: 24px 18px !important;
    }

    /* Nadpis */
    body.in-dekujeme .order-summary-heading {
        font-size: 26px !important;
    }

    /* Větší ikona fajfky na mobilu (sjednocujeme s PC verzí) */
    body.in-dekujeme div.payment-success-icon i.icon-tick::after {
        width: 32px !important;
        height: 32px !important;
    }

    /* Obsah objednávky – kompaktní mobile layout */
    body.in-dekujeme .co-order .cart-table .cart-p-image {
        width: 80px !important;
        padding: 14px 14px 14px 0 !important;
    }

    body.in-dekujeme .co-order .cart-table .cart-p-image img {
        width: 64px !important;
        height: 64px !important;
        border-radius: 10px !important;
    }

    body.in-dekujeme .co-order .cart-table .p-name {
        padding: 14px 8px 14px 0 !important;
    }

    body.in-dekujeme .co-order .cart-table .p-name span {
        font-size: 13px !important;
    }

    body.in-dekujeme .co-order .cart-table .p-quantity {
        padding: 14px 8px !important;
        font-size: 12px !important;
    }

    body.in-dekujeme .co-order .cart-table .p-price {
        padding: 14px 0 14px 8px !important;
        font-size: 13px !important;
    }

    /* Tabulka platby – menší font na mobilu */
    body.in-dekujeme .recapitulation-table th,
    body.in-dekujeme .recapitulation-table td {
        font-size: 13px !important;
        padding: 12px 0 !important;
    }

    /* Číslo objednávky – menší font na mobilu */
    body.in-dekujeme .recapitulation-wrapper .reca-number strong {
        font-size: 18px !important;
    }

    /* Section labels – menší na mobilu */
    body.in-dekujeme .co-box.co-payment-method h4.order-payment,
    body.in-dekujeme .co-order > h4 {
        font-size: 12px !important;
        letter-spacing: 0.16em !important;
    }

    /* Banner stack */
    .rc-tb {
        flex-direction: column;
        text-align: center;
        gap: 14px;
        padding: 24px 20px;
    }

    .rc-tb__btn {
        width: 100%;
        box-sizing: border-box;
        padding: 13px 22px;
    }
}
