@import url('https://fonts.googleapis.com/css2?family=Google+Sans:ital,opsz,wght@0,17..18,400..700;1,17..18,400..700&family=Jost:ital,wght@0,100..900;1,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Sawarabi+Gothic&family=Science+Gothic:wght@100..900&display=swap');

.theme--dark {
    --bg-color: #FFF !important;
    --bg-second-color: #d1d1d1 !important;
    --header-background: #ffffff !important;
    --main-font-color: #000000 !important;
    --secondary-font-color: #989898 !important;
    --accent-color: #CCCCCC !important;
    --accent-color-semi: #eaeaea !important;
    --no-media-color: #d9d9d9 !important;
    --order-input-border-color: rgb(173 173 173 / 20%);
    --order-input-text-color: var(--main-font-color);

    --ff-1: Montserrat, sans-serif;
    --ff-2: Google Sans, sans-serif;
}

.sections-block, .sections-block--content {
    color: var(--bg-color) !important;
    background: var(--main-font-color) !important;
}

body {
    font-family:  var(--ff-2) !important;
}

.header h1 {
    font-family: Jost, sans-serif !important;
    color: var(--main-font-color) !important;
    font-weight: 700 !important;
}
.desktop-header h1 {
    font-family: Jost, sans-serif !important;
    color: var(--bg-color) !important;
    font-weight: 600 !important;
}
.footer-restaurant-name {
    font-family: Jost, sans-serif !important;
    font-weight: 600 !important;
    line-height: 1.0 !important;
}


.rest-desc {
    font-family: var(--ff-1) !important;
    font-size: 1rem !important;
    line-height: 1.5 !important;
}
@media (min-width: 768px) {
    .desktop-header-content .rest-desc {
        font-family: var(--ff-1) !important;
        color: var(--accent-color) !important;
        line-height: 1.6 !important;
    }
}
.section-title,
.text-block .text-content .title,
.layer-cart h1,
.record-name,
.details-block h2,
h2,
.mod-name,
.variant-selector-title strong,
.cart-preview-container strong,
.input-group label,
.price,
.total-value,
.total-label,
.final-value,
.final-label {
    color: var(--main-font-color) !important;
    font-family: var(--ff-2) !important;
}

.section-subtitle,
.record .weight,
.record .description,
.record .from,
.card .description,
.text-block .text,
.cart-wd,
.address,
.docs-container li a,
.text-block .text,
.layer-cart .name,
.details-block .description,
.delivery-info-block {
    font-family: var(--ff-2) !important;
}

nav.nav .nav-item.active {
    background-color: var(--bg-color) !important;
    color:  var(--main-font-color) !important;
}
.filters-block .title {
    font-weight: 800;
}
.filters-block .title,
.filters-block li {
    font-family: var(--ff-2) !important;
    color:  var(--main-font-color) !important;
}
.phone-btn {
    border: 1px solid  var(--main-font-color) !important;
}
.desktop-header-content .phone-btn {
    border-color: var(--bg-color) !important;
    color: var(--bg-color) !important;
    font-family: var(--ff-1) !important;
    font-weight: 400 !important;
    padding: 12px 20px !important;
    opacity: .9 !important;
    background: transparent !important;
    transition: all .25s ease-in-out;
}
.desktop-header-content .phone-btn:hover {
    background: rgba(0, 0, 0, 0.5) !important;
    opacity: 1 !important;
}
.record-name {
    font-size: 1.25rem !important;
}
.cart-wd {
    color: var(--main-font-color) !important;
    font-weight: 400 !important;
    box-shadow: hsl(0deg 0% 21% / 46%) 0px 8px 9px 0px, hsl(0deg 0% 21% / 14%) 0px 0px 90px 0px !important;
}
.order-buttons,
.order-buttons .add-button {
    color: var(--main-font-color) !important;
}
.close-button,
.screen-close-button {
    color: var(--bg-color) !important;
    background: var(--main-font-color) !important;
}

.card .media-block .label {
    color: var(--main-font-color) !important;
}
.price-button {
    color: var(--main-font-color) !important;
    border-radius: 5px !important;
    box-shadow: 0 4px 10px 0 rgb(0 0 0 / 18%) !important;
}
.nutritional > div {
    border-radius: 5px !important;
    padding: 0.2rem 0.5rem !important;
    border: 1px solid #00000014 !important;
}
.favorite--active svg {
    color: #333 !important;
}

.order-form-content .item:not(.item--selected) {
    color: var(--main-font-color) !important;
}
.order-form-content .item--selected {
    background: #2a2a2a !important;
    color: var(--bg-color) !important;
}
.order-form-content .button--primary {
    color: var(--main-font-color) !important;
    box-shadow: 0 4px 10px 0 rgb(0 0 0 / 18%) !important;
}

.edit-details-block-content ul li.option--selected span {
    color: var(--main-font-color) !important;
}

/*.edit-details-block-content li.mod.option--selected > div.fs-90,*/
.edit-details-block-content li.mod > div:last-child {
    font-family: var(--ff-2) !important;
    color: var(--main-font-color) !important;
    font-weight: 300;
    font-size: 1rem;
}

@media (max-width: 524px) {
    .edit-details-container .close-button {
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: .75rem;
        margin: -.75rem .75rem .75rem .75rem;
    }
}

.section-title {
    font-size: 30px !important;
}
.text-block .title {
    font-size: 30px !important;
}
.text-block .text {
    font-family: var(--ff-1) !important;
    text-shadow: none !important;
}
.text-block .slider .gr {
    background: none !important;
}

@media (max-width: 524px) {
    .main {
        gap: 1px !important;
    }
    .main .content {
        margin-bottom: 24px !important;
    }
}

@media (min-width: 768px) {
    .record-name {
        cursor: pointer !important;
        overflow-wrap: break-word !important;
        line-height: 1.01 !important;
    }
}
