/* LEGACY — loaded ONLY by app/CoreModule/Presenters/templates/@layoutIFrame.latte
   (IFramePresenter, the standalone iframe widget). It is NOT linked from the main
   frontend @layout.latte, nor from the admin or portal layouts.
   => Anything you add here affects the iframe widget ONLY. For the main frontend use
   Tailwind (www/css/output.css) or www/css/refactor/*.css. See #724. */

.my-auto { margin-block: auto !important; }

.mx-auto { margin-inline: auto !important; }

.mt-0 { margin-top: 0 !important; }
.mt-p { margin-top: 1.5em !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 10px !important; }
.mb-p { margin-bottom: 1.5em !important; }

.mw-60 { max-width: 600px !important; }

/* Product detail - Game */
.game {
    display: flex;
    flex-direction: column-reverse;
    column-gap: 2em; }

.game__img { margin-bottom: 2em; }
.game__tab {
    max-width: fit-content;
    font-size: 14px;
}

.game__tab-content { padding-inline: 17px; }

.game__price {
    display: grid;
    align-items: center;
    justify-items: center;
    padding: 20px;
    border-radius: 30px;
    margin-bottom: 1.5em;
    background: #FCEAFE;

    .quantity {
        width: 172px;
        margin-bottom: 1em;
    }

    .button.secondary {
        transition-property: -moz-filter, -ms-filter, -o-filter, -webkit-filter, filter;
        transition-duration: 0.3s;
    }

    .button.secondary:hover {
        filter: invert(1);
    }
}

.game__price--vat {
    margin-left: 36px;
    margin-block: 0.5em;
    font-size: 20px;
    font-weight: 500;
    color: black;
}

.price--vat__small,
.price--vat__label {
    font-size: 12px;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.5);
}

.game__price-wrap--sm { display: block; }
.game__price-wrap--md { display: none; }


/* Basket */
.cart-img {  border-radius: 5px; }

.col--remove { padding-left: 10px; }
.order__remove,
.order__total {
    padding-top: 53px;
}


.quantity-input {
    width: 100px;
    display: flex;
    align-items: center;
    padding: 0.5em !important;
    border: 1px solid #000;
    background: #fff;
}

table .quantity-input {
    margin-left: 32px;
    margin-top: 45px;
}

.quantity__decrement,
.quantity__increment {
    border: none;
    background: #fff;
}

.quantity__decrement:hover,
.quantity__increment:hover,
.quantity__decrement:focus,
.quantity__increment:focus  {
    color: #0199a3;
    transition: color 0.2s ease-out;
}

.quantity__input[type='number'] {
    padding: 0 !important;
    border: none !important;
    font-size: 13px !important;
}

/* Chrome, Safari, Edge, Opera */
.quantity__input::-webkit-outer-spin-button,
.quantity__input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
.quantity__input[type=number] {
    -moz-appearance: textfield;
    text-align: center;
}

/* Basket - delivery */
.delivery-method__cols {
    display: grid;

    .description {
        margin: 5px 50px 5px 0;
    }
}

.delivery-method__cols-overview {
    padding: 20px;
    border-radius: 30px;
    margin-bottom: 1.5em;
    border: 1px solid rgba(0, 0, 0, 0.15);
}

.delivery-method__cols-overview-bg { background: rgba(255, 255, 255, 0.5); }

.delivery-method__cart-item {
    display: grid;
    justify-content: space-between;
    gap: 1em;
    grid-template-columns: 50px auto 1fr 60px;
    margin-bottom: 1em;
}

.delivery-method__cart-item--delivery {
    grid-template-columns: auto 60px;
}

.delivery-method__cart-item .quantity,
.delivery-method__cart-item .total {
    text-align: end;
}

.delivery-method__total {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.delivery-method__total h3 { display: inline !important; }
.collapse__a {
    font-size: 18px;
    font-weight: bolder;
}

.delivery-method__disclaimer {
    max-width: 480px;
    margin-left: auto;
}

.delivery-method__total-price {
    font-size: 16px !important;
    text-transform: none !important;
}

section.thankYou,
section.thankYou h1 {
    text-align: center;
}

.order--height {
    /*                  header  footer  bottom footer padding */
    height: calc(100vh - 150px - 316px - 64px)
}

/* Eshop */
.product-box__bottom {
    align-items: center;
    justify-content: space-between;
}

.product-box__price {
    font-size: 24px;
}

.flip-x::before {
    transform: scaleX(-1);
}


/* The .modal-cookie-consent block that used to live here was removed in #724.
   The cookie dialog markup (PopUp/popUp.latte) is included only from the main
   frontend @layout.latte, which never loads this file — so the rules were dead.
   The dialog is styled by Bootstrap + Tailwind utilities since #720. */


/* Media queries  */

@media (min-width: 560px) {
    .game__price {
        grid-template-columns: 1fr 1fr;

        .price--vat {
            grid-column: 1 / -1;
            grid-row: 1;
        }
    }
}

@media (min-width: 767px) {

    /* Product detail - Game */
    .game { flex-direction: row; }
    .game__img {
        margin-top: 40px;
        margin-bottom: 0;
    }
    .game__tab { font-size: 16px; }


    .game__price-wrap--sm { display: none; }
    .game__price-wrap--md {
        display: block;

        .game__input-wrap { margin-top: -25px }
        .game__price {
            padding-top: 30px;
            padding-bottom: 25px;
        }
        .game__price--vat {
            margin-left: 20px;
            margin-bottom: 10px;
        }
    }

    .game__price {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: center;
    }

    .game__price .quantity {
        width: 150px;
        padding-bottom: 24px;
    }

    .game__price--vat {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 5px;
    }

    /* Basket */
    .order__quantity {
        width: 160px;
        margin-left: 0;
    }
}

@media (max-width: 850px) {
    .md-hidden { display: none !important; }
    .navigationActions { display: inline-block !important; }
    .navigationActions__btn-sec {display: none !important;}
    .navigationActions__cart {
        display: inline-block !important;
        position: absolute;
        top: 25px;
        right: 25px;
    }
}

@media (min-width: 850px) {
    .order--height {
        /*                  header  footer  bottom footer padding */
        min-height: calc(100vh - 150px - 268px - 64px)
    }

    .navigationActions__cart { display: inline-block !important; }
}

@media (min-width: 960px) {
    /* Originální cssko */
    form fieldset p { min-width: 360px; }

    /* Basket - delivery */
    .delivery-method__cols {
        grid-template-columns: 1fr 1fr;
        gap: 100px;
    }

    .delivery-method__cols-overview {
        max-width: 800px;
        margin-inline: auto;
        margin-top: 1.5em;
    }
}

@media (min-width: 1200px) {
    .game__price--vat {
        width: auto;
        display: inline-block;
        font-size: 24px;
    }
}
