/* =========================================================
   DR. GUT — WOOCOMMERCE NOTICE STYLES
========================================================= */

:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) {
    position: relative;
    box-sizing: border-box;

    width: calc(100% - 40px);
    max-width: 1280px;

    margin: 20px auto 24px !important;
    padding: 18px 24px 18px 58px !important;

    overflow-wrap: anywhere;

    color: #4b3a33 !important;
    background: #fffaf4 !important;

    border: 1px solid #eadfd4 !important;
    border-left-width: 4px !important;
    border-radius: 14px !important;

    box-shadow: 0 4px 14px rgba(75, 58, 51, 0.07);

    font-family: inherit;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.55;

    text-align: center;
    list-style: none !important;
}

.woocommerce-message,
.woocommerce-error,
.woocommerce-info {
    border-top: 1px solid #eadfd4 !important;
}

/* SUCCESS */
.woocommerce-message {
    border-left-color: #8cab2f !important;
}

/* ERROR */
.woocommerce-error {
    border-left-color: #c74343 !important;
}

/* INFO */
.woocommerce-info {
    border-left-color: #ff8a1f !important;
}

/* ICONS */
:where(.woocommerce-message, .woocommerce-error, .woocommerce-info)::before {
    position: absolute !important;

    top: 50% !important;
    left: 20px !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    width: 28px;
    height: 28px;

    margin: 0 !important;

    color: #ffffff !important;
    border-radius: 50%;

    font-family: inherit;
    font-size: 0.875rem;
    font-style: normal;
    font-weight: 700;
    line-height: 1;

    transform: translateY(-50%) !important;
}

.woocommerce-message::before {
    content: "✓" !important;
    background: #8cab2f !important;
}

.woocommerce-error::before {
    content: "!" !important;
    background: #c74343 !important;
}

.woocommerce-info::before {
    content: "i" !important;
    background: #ff8a1f !important;
}

/* ERROR LISTS */
ul.woocommerce-error {
    list-style: none outside !important;
}

ul.woocommerce-error > li {
    margin: 0;
    padding: 0;
}

ul.woocommerce-error > li + li {
    margin-top: 0.5rem;
}

/* LINKS */
:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) a:not(.button) {
    color: #68311f !important;
    font-weight: 600;

    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.15em;
}

:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) a:not(.button):hover {
    color: #4f2316 !important;
}

/* BUTTONS */
:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) :where(.button, button) {
    box-sizing: border-box;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    float: none !important;

    min-height: 42px;

    margin: 14px 0 0 !important;
    padding: 10px 20px !important;

    color: #ffffff !important;
    background: #68311f !important;

    border: 0 !important;
    border-radius: 999px !important;

    box-shadow: none !important;

    font-family: inherit;
    font-size: 0.9375rem !important;
    font-weight: 600 !important;
    line-height: 1.2;

    text-decoration: none !important;
    cursor: pointer;

    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}

:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) :where(.button, button):hover,
:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) :where(.button, button):focus {
    color: #ffffff !important;
    background: #4f2316 !important;

    transform: translateY(-1px);
}

/* FOCUS */
:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) a:focus-visible,
:where(.woocommerce-message, .woocommerce-error, .woocommerce-info) button:focus-visible {
    outline: 3px solid #ff8a1f;
    outline-offset: 3px;
}

/* TABLET */
@media (max-width: 1024px) {
    :where(.woocommerce-message, .woocommerce-error, .woocommerce-info) {
        width: calc(100% - 32px);

        margin: 16px auto 22px !important;
        padding: 17px 22px 17px 56px !important;
    }
}

/* MOBILE */
@media (max-width: 767px) {
    :where(.woocommerce-message, .woocommerce-error, .woocommerce-info) {
        width: calc(100% - 24px);

        margin: 12px auto 18px !important;
        padding: 15px 16px 15px 50px !important;

        border-radius: 12px !important;

        font-size: 0.875rem;
        line-height: 1.5;

        text-align: left;
    }

    :where(.woocommerce-message, .woocommerce-error, .woocommerce-info)::before {
        top: 50% !important;
        left: 14px !important;

        width: 24px;
        height: 24px;

        font-size: 0.75rem;

        transform: translateY(-50%) !important;
    }

    :where(.woocommerce-message, .woocommerce-error, .woocommerce-info) :where(.button, button) {
        display: flex;

        width: 100%;
        min-height: 44px;

        margin: 14px 0 0 !important;
        padding: 11px 16px !important;

        text-align: center;
    }
}

/* SMALL MOBILE */
@media (max-width: 380px) {
    :where(.woocommerce-message, .woocommerce-error, .woocommerce-info) {
        width: calc(100% - 20px);

        margin-left: auto !important;
        margin-right: auto !important;

        padding: 14px 14px 14px 46px !important;

        font-size: 0.8125rem;
    }

    :where(.woocommerce-message, .woocommerce-error, .woocommerce-info)::before {
        left: 12px !important;

        width: 22px;
        height: 22px;

        font-size: 0.6875rem;
    }
}
