/* Samostatna finalni verze CSS pro Shoptet */

body,
button,
input,
select,
textarea {
    font-family: "Avenir Next", sans-serif !important;
}

/* Obrazky v hlavnim menu */
#header #navigation .menu-level-1 > li > a {
    position: relative !important;
    padding-left: 35px !important;
}

/* Ikony pro jednotlive kategorie */
#header #navigation .menu-level-1 > li.menu-item-1835 > a::before {
    content: "" !important;
    position: absolute !important;
    left: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 20px !important;
    height: 20px !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* Pece o plet */
.menu-item-1835 > a::before {
    background-image: url("https://www.mysense.cz/user/documents/upload/Banner/discount.svg") !important;
}

/* Fonty */
body {
    font-weight: 400 !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600 !important;
}

.btn,
button {
    font-weight: 500 !important;
}

.listingControls a.btn,
.listingControls button.btn {
    background: #222222 !important;
    color: #ffffff !important;
    border-color: #222222 !important;
}

.listingControls a.btn:hover,
.listingControls button.btn:hover {
    background: #ff2470 !important;
    color: #ffffff !important;
    border-color: #ff2470 !important;
}

.listingControls .goToTop__button,
.listingControls .goToTop__button::before,
.listingControls .goToTop__button:hover,
.listingControls .goToTop__button:hover::before {
    color: #ffffff !important;
}

.content form .btn,
.content.narrow .btn {
    line-height: normal !important;
}

.cart-content.checkout-box-wrapper h2.h4 {
    text-transform: none !important;
    letter-spacing: 0 !important;
    line-height: 1.3 !important;
}

.price {
    font-weight: 600 !important;
}

#header #navigation ul.menu-level-1 > li > a b {
    font-weight: 500 !important;
}

.flags .flag {
    font-weight: 700;
    font-size: 0.8em;
    text-transform: none;
}

.categories a {
    font-weight: 700;
}

/* Hlavicka a navigace */
.top-navigation-tools {
    display: none;
}

.top-navigation-contacts {
    display: none !important;
}

#header {
    background-color: #151515;
}

#header.fixed-menu {
    background: #151515;
}

#header .top-nav-button-login {
    color: #fff;
}

#header .navigation-buttons .btn,
#header .top-nav-button-login {
    color: #fff !important;
}

#header #navigation ul.menu-level-1 > li > a {
    text-transform: none;
    color: #fff;
    font-size: 16px;
}

.top-navigation-bar .nav-part .top-navigation-menu > ul li a {
    text-transform: none !important;
}

.top-navigation-bar {
    background: white;
}

.top-navigation-bar .container {
    width: calc(100% - 64px) !important;
    max-width: 1920px !important;
}

/* Responzivni navigace */
@media (min-width: 768px) {
    #header .container.navigation-wrapper {
        width: calc(100% - 64px) !important;
        max-width: 1920px !important;
    }

    #header #navigation {
        width: 100% !important;
        max-width: 100% !important;
    }

    #navigation {
        float: none !important;
    }

    #header #navigation .navigation-in {
        display: flex !important;
        align-items: center !important;
    }

    #header #navigation ul.menu-level-1 {
        flex: 1 1 auto !important;
    }

    #header .menu-helper:after {
        background-image: url("https://www.mysense.cz/user/documents/upload/Ikonky/vectorpaint.svg") !important;
    }

    #navigation .navigation-in {
        position: relative;
        background-color: #151515;
    }
}

@media (max-width: 1200px) {
    .top-navigation-bar .container {
        width: calc(100% - 24px) !important;
    }

    #header #navigation {
        width: auto !important;
    }

    .top-navigation-bar .nav-part .responsive-tools a[data-target="navigation"]:before {
        background-image: url("https://www.mysense.cz/user/documents/upload/Ikonky/vectorpaint.svg") !important;
    }

    #header #navigation ul.menu-level-1 > li > a {
        color: #222 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        min-height: 44px !important;
        padding-right: 12px !important;
    }

    #header #navigation .submenu-arrow {
        display: inline-block !important;
        flex: 0 0 auto !important;
        margin-left: 8px !important;
    }
}

@media (max-width: 1366px) {
    #header .menu-helper {
        right: 16px !important;
        margin-top: 21px;
    }

    #header #navigation > .navigation-in > .menu-level-1 > li.splitted {
        display: none !important;
    }
}

/* Layout */

.content-wrapper-in #content p a {
    text-decoration: underline !important;
}

.content-wrapper-in #content p a:hover {
    color: #000000 !important;
    text-decoration: underline !important;
}

.content-wrapper.before-carousel .container {
    padding: 0 !important;
}

/* Tlacitka do kosiku */
.products-block.products .product .btn {
    background-color: white !important;
    color: #ff2470 !important;
    border: 2px solid #ff2470 !important;
}

.products-block.products .product .p {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.products-block.products .product .p-in {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.products-block.products .product .p-in-in {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
}

.products-block.products .product {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.products-block.products .product a.image {
    display: flex !important;
    align-items: flex-end;
    justify-content: center;
    height: 280px !important;
    min-height: 280px !important;
    max-height: 280px !important;
}

.products-block.products .product a.image img {
    display: block;
    width: auto !important;
    max-width: 100%;
    max-height: 260px !important;
    object-fit: contain !important;
    margin: 0 auto;
}

.products-block.products .product .p .name {
    display: -webkit-box;
    overflow: hidden;
    line-height: 1.25;
    max-height: 3.75em;
    min-height: 3.75em;
    height: 3.75em;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-overflow: ellipsis;
    align-self: stretch;
    word-break: break-word;
}

.products-block.products .product .ratings-wrapper {
    margin-top: 14px;
}

.products-block.products .product .p-bottom {
    margin-top: auto;
}

.products-block.products .product .p-bottom > div {
    display: flex;
    flex-direction: column;
    align-items: center;
}

@media (max-width: 767px) {
    .products-block.products .product {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .products-block.products .product a.image {
        height: 180px !important;
        min-height: 180px !important;
        max-height: 180px !important;
    }

    .products-block.products .product a.image img {
        max-height: 170px !important;
    }

    .products-block.products .product .p .name {
        max-height: 3.5em;
        min-height: 3.5em;
        height: 3.5em;
        -webkit-line-clamp: 2;
    }
}

.products-block.products .product .btn:hover {
    background-color: #ff2470 !important;
    color: white !important;
}

.product-top .add-to-cart button.add-to-cart-button {
    background-color: #ff2470 !important;
    color: white !important;
    border: 2px solid #ff2470 !important;
}

.product-top .add-to-cart button.add-to-cart-button:hover {
    background-color: #d91e5b !important;
    color: white !important;
    border: 2px solid #d91e5b !important;
}

/* Ceny a dalsi prvky */
.product-top .price-line .price-final {
    color: #292b32 !important;
}

.products .product .prices .price-final strong {
    color: #292b32 !important;
}

.product-top .social-buttons-wrapper .link-icons {
    display: none;
}

.flag.flag-new {
    color: #1b281d !important;
}

.p-image-wrapper .flags-extra .flag.flag.flag-discount,
.flags-extra .flag.flag.flag-discount {
    background: #f62b76 !important;
}

.flags-extra .flag.flag-discount .price-standard span {
    display: none;
}

.flag.flag-action {
    color: white !important;
}

.flags-extra .flag.flag-discount .price-save {
    font-size: 1.2em;
}

.products-block.products .product .flags.flags-extra .flag {
    width: 55px;
    height: 55px;
}

.subcategories {
    display: none;
}

.pageElement__heading {
    display: none;
}

@media only screen and (min-width: 768px) {
    .category-header .listSorting .listSorting__controls li button.listSorting__control--current {
        background-color: #000000;
    }
}

@media only screen and (max-width: 767px) {
    .category-header {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    .category-header .listSorting,
    .category-header .listItemsTotal,
    #filters-wrapper,
    .filters-wrapper,
    .filters-unveil-button-wrapper {
        width: 100% !important;
    }

    .category-header .listSorting .listSorting__controls {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 8px !important;
        padding-bottom: 4px !important;
        margin: 0 !important;
    }

    .category-header .listSorting .listSorting__controls li {
        flex: 0 0 auto !important;
    }

    .category-header .listSorting .listSorting__controls li button {
        white-space: nowrap !important;
    }

    .filters-unveil-button-wrapper .unveil-button {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
    }
}

#header .search fieldset button {
    background: #ff2e77 !important;
}

#header .search fieldset button:hover {
    background: #fa76a4 !important;
}

.top-navigation-bar .msg-part .text {
    text-transform: none;
}

@media only screen and (max-width: 767px) {
    .top-navigation-bar .msg-part .site-msg {
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: auto !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        min-height: 0 !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        z-index: 10001 !important;
    }

    .top-navigation-bar .msg-part .site-msg .container {
        padding: 0 !important;
    }

    .top-navigation-bar .msg-part .text {
        font-size: 12px !important;
        line-height: 1.35 !important;
        padding-right: 18px !important;
    }

    .top-navigation-bar .msg-part .close {
        right: 10px !important;
    }

    #header {
        margin-top: 0 !important;
    }

    .site-msg.information.hello-bar-moved {
        position: relative !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 10px 14px !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        z-index: auto !important;
    }

    .site-msg.information.hello-bar-moved .container {
        width: 100% !important;
        padding: 0 7px !important;
    }

    .site-msg.information.hello-bar-moved .text {
        font-size: 12px !important;
        line-height: 1.35 !important;
        text-align: center !important;
    }
}

footer {
    background: #151515 !important;
}

footer ul li a {
    color: #ffffff !important;
}

footer h3 {
    color: #ffffff !important;
}

/* Banner radius */
.body-banners .col-sm-4 > .banner-wrapper > img,
.body-banners .col-sm-8 > .banner-wrapper > img {
    border-radius: 8px !important;
}

/* Homepage bannery a benefity */
@media (max-width: 767px) {
    .next-to-carousel-banners,
    .id-1 .next-to-carousel-banners {
        position: relative !important;
        display: flex !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        gap: 10px !important;
        width: auto !important;
        max-width: none !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 26px 16px 12px 16px !important;
        margin: 12px 0 0 !important;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }

    .next-to-carousel-banners::-webkit-scrollbar,
    .id-1 .next-to-carousel-banners::-webkit-scrollbar {
        display: none;
    }

    .next-to-carousel-banners .banner-wrapper,
    .id-1 .next-to-carousel-banners .banner-wrapper {
        flex: 0 0 58% !important;
        min-width: 58% !important;
        max-width: 58% !important;
        scroll-snap-align: start;
    }

    .next-to-carousel-banners .banner-wrapper a,
    .id-1 .next-to-carousel-banners .banner-wrapper a {
        display: block;
        text-decoration: none;
    }

    .next-to-carousel-banners .banner-wrapper img,
    .id-1 .next-to-carousel-banners .banner-wrapper img {
        display: block;
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        border-radius: 18px !important;
    }

    .next-to-carousel-banners .banner-wrapper a .extended-banner-texts,
    .id-1 .next-to-carousel-banners .banner-wrapper a .extended-banner-texts {
        display: flex;
        justify-content: center;
        padding-top: 14px !important;
    }

    .next-to-carousel-banners .banner-wrapper .extended-banner-text,
    .id-1 .next-to-carousel-banners .banner-wrapper .extended-banner-text {
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
    }
}

@media (min-width: 768px) {
    .id-1 .next-to-carousel-banners {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 8px;
    }

    .id-1 .next-to-carousel-banners .banner-wrapper {
        flex: 1 1 0;
        min-width: 0;
    }

    .id-1 .next-to-carousel-banners .banner-wrapper img {
        display: block;
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
    }

    .id-1 .next-to-carousel-banners .banner-wrapper a {
        text-decoration: none;
    }

    .id-1 .next-to-carousel-banners .banner-wrapper a .extended-banner-texts {
        display: flex;
        justify-content: center;
    }

    .id-1 .before-carousel .row {
        margin: 0;
    }

    .id-1 .before-carousel .row.banners-row.has-benefit-between {
        display: flex;
        flex-wrap: wrap;
    }

    .id-1 .before-carousel .row.banners-row.has-benefit-between > .col-sm-4,
    .id-1 .before-carousel .row.banners-row.has-benefit-between > .col-sm-8,
    .id-1 .before-carousel .row.banners-row.has-benefit-between > .position--benefitHomepage {
        float: none;
    }

    .id-1 .before-carousel .row.banners-row.has-benefit-between > .col-sm-8 {
        order: 1;
        width: 100%;
    }

    .id-1 .before-carousel .row.banners-row.has-benefit-between > .position--benefitHomepage {
        order: 2;
        width: 100%;
        max-width: 1440px;
        margin: 12px auto;
    }

    .id-1 .before-carousel .row.banners-row.has-benefit-between > .col-sm-4 {
        order: 3;
        width: 100%;
    }

    .id-1 .before-carousel .row .col-sm-8 {
        padding: 0 !important;
        margin: 0 !important;
    }

    .id-1 .homepage-box.welcome-wrapper {
        background-image: url(/user/documents/upload/o-nas-01.webp);
        background-repeat: no-repeat;
        background-position: right center;
        background-size: contain;
        background-color: #f5f5f5 !important;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .id-1 .before-carousel .row.banners-row.has-benefit-between > .position--benefitHomepage {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .id-1 .before-carousel .row.banners-row.has-benefit-between > .position--benefitHomepage > .benefitBanner__item {
        flex: 0 0 50%;
        max-width: 50%;
        display: flex;
        justify-content: center;
    }
}

.product-top .p-detail-info .p-short-description {
    font-weight: unset;
}

.product-top .p-image-wrapper {
    position: relative;
}

.product-top .p-image-wrapper .p-image-badges {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.product-top .p-image-wrapper .p-image-badges .flag-action {
    margin: 0;
}

footer .pageElement__heading {
    display: block;
}

#header .menu-helper.visible,
#header .menu-helper {
    right: 0 !important;
}

.homepage-box.welcome-wrapper {
    text-align: left !important;
    padding: 40px 15px !important;
}

.homepage-box.welcome-wrapper .welcome {
    max-width: 60%;
    text-align: left;
    margin-left: 0;
}

.homepage-box.welcome-wrapper .welcome .h1 {
    font-size: 30px;
    font-weight: 700;
    text-align: left;
    margin-bottom: 25px;
    padding: 0;
    line-height: 1.3;
}

.homepage-box.welcome-wrapper p {
    line-height: 1.5em;
}

@media (max-width: 768px) {
    .homepage-box.welcome-wrapper .welcome {
        max-width: 100%;
    }

    .homepage-box.welcome-wrapper {
        background-image: none !important;
        padding: 30px 15px !important;
    }

    .homepage-box.welcome-wrapper .welcome .h1 {
        font-size: 20px;
    }
}

.extended-banner-texts {
    padding-top: 8px !important;
}

span.extended-banner-text {
    padding-top: 12px !important;
    font-weight: 600 !important;
}

@media (min-width: 768px) {
    .benefitBanner.position--benefitHomepage.is-in-banners-row {
        justify-content: center !important;
    }

    .benefitBanner__item {
        position: relative;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        padding: 20px 12px !important;
    }

    .benefitBanner__item:not(:last-child)::after {
        content: "";
        position: absolute;
        right: 0;
        top: 50%;
        width: 1px;
        height: 70px;
        background: #e8e8e8;
        transform: translateY(-50%);
    }

    .benefitBanner__picture {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        margin-bottom: 20px !important;
        margin-right: 0 !important;
    }

    .benefitBanner .benefitBanner__item .benefitBanner__picture img {
        display: block;
        margin: 0 auto;
        transform: scale(1.5);
        transform-origin: center;
    }

    .benefitBanner__title {
        font-size: 16px !important;
        margin-bottom: 4px !important;
    }

    .benefitBanner__data {
        font-size: 14px !important;
    }
}

@media (max-width: 767px) {
    .body-banners .col-sm-4 > .banner-wrapper > img,
    .body-banners .col-sm-8 > .banner-wrapper > img,
    .body-banners .col-sm-12 > .banner-wrapper > img {
        border-radius: 8px !important;
    }
}

.footer-banners .slick-list a img {
    filter: none;
}

footer .custom-footer > div.newsletter button:hover {
    background: #fa76a4 !important;
}