/* Made by Ai 26.10.28 02:13
 * Плашка на сайте. Классы с префиксом st_cookie.
 * [hidden] с !important: темы часто задают display у блоков и иначе плашка мигает до скрипта.
 */

.st_cookie,
.st_cookie *,
.st_cookie *::before,
.st_cookie *::after {
    box-sizing: border-box;
}

.st_cookie[hidden],
.st_cookie [hidden] {
    display: none !important;
}

.st_cookie {
    position: fixed;
    z-index: 10000;
    margin: 0;
}

.st_cookie .st_cookie__box {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    margin: 0;
    /* Made by Ai 26.10.28 03:36 */
    padding: 10px 15px;
    font-family: sans-serif;
    font-size: 15px;
    line-height: 1.45;
}

.st_cookie .st_cookie__copy {
    max-width: 100%;
    min-width: 0;
}

.st_cookie .st_cookie__text {
    margin: 0;
    overflow-wrap: break-word;
    white-space: normal;
    text-align: left;
}

/* Переносы из поля текста — только внутри фразы. Иначе перевод строки перед ссылкой в разметке роняет «Подробнее» на следующую строку. */
.st_cookie .st_cookie__text_body {
    white-space: pre-line;
}

/* Пробел перед «подробнее», только когда есть и фраза, и ссылка. */
.st_cookie__text_body:not([hidden]) + .st_cookie__link:not([hidden])::before {
    content: "\00a0";
}

/* Made by Ai 26.10.28 03:19. Ссылка — продолжение фразы, не отдельный блок. */
.st_cookie .st_cookie__link {
    display: inline;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    vertical-align: baseline;
    text-decoration: underline;
    text-underline-offset: 2px;
    overflow-wrap: break-word;
}

.st_cookie .st_cookie__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.st_cookie .st_cookie__btn {
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    /* Made by Ai 26.10.28 03:36 */
    padding: 5px 10px;
    border: 1px solid transparent;
    border-radius: 0;
    font: inherit;
    font-weight: bold;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
}

.st_cookie .st_cookie__btn:focus-visible,
.st_cookie .st_cookie__link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

.st_cookie .st_cookie__btn:hover {
    opacity: 0.8;
}

/* Положение карточки. Проценты у fixed считаются от окна, у образца в админке — от рамки. */
.st_cookie--y_bottom {
    bottom: calc(12px + env(safe-area-inset-bottom));
}

.st_cookie--y_top {
    top: calc(12px + env(safe-area-inset-top));
}

.st_cookie--w_max {
    width: min(640px, calc(100% - 24px));
}

.st_cookie--w_max.st_cookie--x_left {
    left: 12px;
    right: auto;
    transform: none;
}

.st_cookie--w_max.st_cookie--x_right {
    left: auto;
    right: 12px;
    transform: none;
}

.st_cookie--w_max.st_cookie--x_center {
    left: 50%;
    right: auto;
    transform: translateX(-50%);
}

.st_cookie--w_full.st_cookie--x_left,
.st_cookie--w_full.st_cookie--x_center,
.st_cookie--w_full.st_cookie--x_right {
    left: 0;
    right: 0;
    width: auto;
    transform: none;
}

.st_cookie--w_full.st_cookie--y_bottom {
    bottom: 0;
}

.st_cookie--w_full.st_cookie--y_top {
    top: 0;
}

.st_cookie--w_full .st_cookie__box {
    border-radius: 0;
}

.st_cookie--w_full.st_cookie--y_bottom .st_cookie__box {
    padding-bottom: calc(10px + env(safe-area-inset-bottom));
}

.st_cookie--w_full.st_cookie--y_top .st_cookie__box {
    padding-top: calc(10px + env(safe-area-inset-top));
}

.st_cookie--x_left .st_cookie__box {
    justify-content: flex-start;
    text-align: left;
}

.st_cookie--x_center .st_cookie__box {
    justify-content: center;
    text-align: center;
}

.st_cookie--x_right .st_cookie__box {
    justify-content: flex-end;
    text-align: right;
}

.st_cookie--x_center .st_cookie__text {
    text-align: center;
}

.st_cookie--x_right .st_cookie__text {
    text-align: right;
}

/* Тулбар WordPress: 32px, на узкой админке 46px. Плашка не залезает под него. */
.st_cookie--under_admin_bar.st_cookie--y_top {
    top: calc(32px + 12px + env(safe-area-inset-top));
}

.st_cookie--under_admin_bar.st_cookie--w_full.st_cookie--y_top {
    top: 32px;
}

/* Made by Ai 26.10.28 02:56. Форма сайта: радиус 5px, тень как у подвала, кнопки без скругления. */

.st_cookie--style_light .st_cookie__box,
.st_cookie--style_dark .st_cookie__box,
.st_cookie--style_accent .st_cookie__box,
.st_cookie--style_firm_green .st_cookie__box,
.st_cookie--style_firm_yellow .st_cookie__box,
.st_cookie--style_firm_blue .st_cookie__box {
    border-radius: 5px;
    box-shadow: 0 0 3px 0 #00000024;
}

.st_cookie--style_light .st_cookie__box {
    background: #ffffff;
    color: #434343;
    border: 1px solid #e3e3e3;
}

.st_cookie--style_light .st_cookie__link {
    color: #409ee9;
}

.st_cookie--style_light .st_cookie__btn--accept {
    background: #90af5d;
    border-color: #90af5d;
    color: #ffffff;
}

.st_cookie--style_light .st_cookie__btn--decline {
    background: transparent;
    border-color: #ccc;
    color: #525252;
}

.st_cookie--style_dark .st_cookie__box {
    background: #525252;
    color: #ffffff;
    border: 1px solid #525252;
}

.st_cookie--style_dark .st_cookie__link {
    color: #ffffff;
}

.st_cookie--style_dark .st_cookie__btn--accept {
    background: #ffffff;
    border-color: #ffffff;
    color: #525252;
}

.st_cookie--style_dark .st_cookie__btn--decline {
    background: transparent;
    border-color: #ffffff;
    color: #ffffff;
}

.st_cookie--style_accent .st_cookie__box {
    background: #fffbf6;
    color: #434343;
    border: 1px solid #d4a155;
}

.st_cookie--style_accent .st_cookie__link {
    color: #409ee9;
}

.st_cookie--style_accent .st_cookie__btn--accept {
    background: #d4a155;
    border-color: #d4a155;
    color: #ffffff;
}

.st_cookie--style_accent .st_cookie__btn--decline {
    background: transparent;
    border-color: #d4a155;
    color: #434343;
}

.st_cookie--style_firm_green .st_cookie__box {
    background: #90af5d;
    color: #ffffff;
    border: 1px solid #90af5d;
}

.st_cookie--style_firm_yellow .st_cookie__box {
    background: #d4a155;
    color: #ffffff;
    border: 1px solid #d4a155;
}

.st_cookie--style_firm_blue .st_cookie__box {
    background: #658cab;
    color: #ffffff;
    border: 1px solid #658cab;
}

.st_cookie--style_firm_green .st_cookie__link,
.st_cookie--style_firm_yellow .st_cookie__link,
.st_cookie--style_firm_blue .st_cookie__link {
    color: #ffffff;
}

.st_cookie--style_firm_green .st_cookie__btn--accept,
.st_cookie--style_firm_yellow .st_cookie__btn--accept,
.st_cookie--style_firm_blue .st_cookie__btn--accept {
    background: #ffffff;
    border-color: #ffffff;
    color: #434343;
}

.st_cookie--style_firm_green .st_cookie__btn--decline,
.st_cookie--style_firm_yellow .st_cookie__btn--decline,
.st_cookie--style_firm_blue .st_cookie__btn--decline {
    background: transparent;
    border-color: #ffffff;
    color: #ffffff;
}

/* Фон на витрине подменяет тема: inline background-color на .js__random_color. Здесь запасной цвет и то, что скрипт не трогает: белый текст, обводка как у логотипа, тень как у кнопки генератора. */
.st_cookie--style_random .st_cookie__box {
    background: rgb(110 130 150);
    color: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 5px;
    box-shadow: 0 0 2px 0 #4b4b4b;
}

.st_cookie--style_random .st_cookie__text,
.st_cookie--style_random .st_cookie__link,
.st_cookie--style_random .st_cookie__btn--decline {
    text-shadow: 1px 1px 2px #5d5d5d;
}

.st_cookie--style_random .st_cookie__link {
    color: #ffffff;
}

.st_cookie--style_random .st_cookie__btn--accept {
    background: #ffffff;
    border-color: #ffffff;
    color: #434343;
    text-shadow: none;
}

.st_cookie--style_random .st_cookie__btn--decline {
    background: transparent;
    border-color: #ffffff;
    color: #ffffff;
}

.st_cookie--w_full .st_cookie__box {
    border-radius: 0;
}

/* Выезд только у живой плашки, образец в админке не прячется. */
#st_cookie_banner:not([hidden]):not(.st_cookie--ready) {
    pointer-events: none;
}

#st_cookie_banner:not([hidden]).st_cookie--y_bottom .st_cookie__box {
    animation: st_cookie_in_bottom 0.4s ease 1s both;
}

#st_cookie_banner:not([hidden]).st_cookie--y_top .st_cookie__box {
    animation: st_cookie_in_top 0.4s ease 1s both;
}

@keyframes st_cookie_in_bottom {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes st_cookie_in_top {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    #st_cookie_banner:not([hidden]).st_cookie--y_bottom .st_cookie__box,
    #st_cookie_banner:not([hidden]).st_cookie--y_top .st_cookie__box {
        animation: none;
    }
}

@media screen and (max-width: 782px) {
    .st_cookie--under_admin_bar.st_cookie--y_top {
        top: calc(46px + 12px + env(safe-area-inset-top));
    }

    .st_cookie--under_admin_bar.st_cookie--w_full.st_cookie--y_top {
        top: 46px;
    }
}

@media (max-width: 640px) {
    .st_cookie--w_max.st_cookie--x_left,
    .st_cookie--w_max.st_cookie--x_center,
    .st_cookie--w_max.st_cookie--x_right {
        left: 8px;
        right: 8px;
        width: auto;
        transform: none;
    }

    .st_cookie .st_cookie__box {
        flex-direction: column;
        align-items: stretch;
        text-align: left;
    }

    .st_cookie--x_left .st_cookie__text,
    .st_cookie--x_right .st_cookie__text {
        text-align: left;
    }

    .st_cookie--x_center .st_cookie__text {
        text-align: center;
    }

    .st_cookie .st_cookie__actions {
        width: 100%;
        flex-direction: column;
    }

    .st_cookie .st_cookie__btn {
        width: 100%;
        white-space: normal;
    }

    .st_cookie--w_full .st_cookie__box {
        padding-left: 15px;
        padding-right: 15px;
    }
}
