/**
 * Styles for the time-boxed promotion (announcement bar, promo block,
 * limited-series mention). Only enqueued while the promotion is active.
 *
 * @package VinsTappe_Custom
 */

/* Site-wide announcement bar */
.vinstappe-promo-topbar {
    padding: 0.6em 1em;
    background: #4a6b18;
    color: #fff;
    font-size: 0.9rem;
    line-height: 1.4;
    text-align: center;
}

.vinstappe-promo-topbar p {
    margin: 0;
    color: inherit;
}

.vinstappe-promo-topbar a {
    margin-left: 0.4em;
    color: #fff !important; /* the theme forces its orange on links */
    font-weight: 700;
    text-decoration: underline;
    white-space: nowrap;
}

.vinstappe-promo-topbar a:hover,
.vinstappe-promo-topbar a:focus {
    color: #f6e7bd !important;
}

/* Limited series mention on the product page */
.vinstappe-limited-series {
    margin: 0.5em 0 0.25em;
    padding: 0.4em 0.75em;
    background: #fbefe9;
    border-left: 3px solid #a8442a;
    border-radius: 2px;
    color: #7a2e1a;
    font-weight: 700;
}

.vinstappe-limited-series-note {
    margin: 0 0 1em;
    color: #6b6b6b;
    font-size: 0.85em;
}

/* Promo block ([vinstappe_promo]) */
.vinstappe-promo-block {
    margin: 1.5em 0;
    padding: 1.5em;
    background: #f6f1e7;
    border: 1px solid #d9c9a3;
    border-radius: 6px;
    color: #5a4326;
}

.vinstappe-promo-block__title {
    margin: 0 0 0.6em;
}

.vinstappe-promo-block__rules {
    margin: 0 0 0.8em 1.2em;
    padding: 0;
    font-weight: 600;
}

.vinstappe-promo-block__share {
    margin: 0 0 1.2em;
    padding: 0.7em 1em;
    background: #fff;
    border-left: 4px solid #9b1c31;
    font-weight: 600;
}

.vinstappe-promo-block__examples {
    width: 100%;
    margin: 0 0 1em;
    border-collapse: collapse;
    background: #fff;
}

.vinstappe-promo-block__examples caption {
    padding: 0.4em 0;
    font-weight: 700;
    text-align: left;
}

.vinstappe-promo-block__examples th,
.vinstappe-promo-block__examples td {
    padding: 0.5em 0.8em;
    border: 1px solid #e0d7c4;
    text-align: left;
}

.vinstappe-promo-block__examples thead th {
    background: #efe6d2;
}

/* The theme greys table text; keep it readable. */
.vinstappe-promo-block .vinstappe-promo-block__examples th,
.vinstappe-promo-block .vinstappe-promo-block__examples td,
.vinstappe-promo-block .vinstappe-promo-block__examples caption {
    color: #3d2f1a !important;
}

.vinstappe-promo-block__fine {
    margin: 0 0 1.2em;
    font-size: 0.85em;
    font-style: italic;
    color: #6b6b6b;
}

.vinstappe-promo-block__magnum {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
    align-items: center;
    padding-top: 1.2em;
    border-top: 1px solid #d9c9a3;
}

.vinstappe-promo-block__image {
    flex: 0 0 200px;
    max-width: 100%;
}

.vinstappe-promo-block__image img {
    width: 100%;
    height: auto;
}

.vinstappe-promo-block__magnum-body {
    flex: 1 1 260px;
}

.vinstappe-promo-block__badge {
    display: inline-block;
    margin: 0 0 0.4em;
    padding: 0.15em 0.7em;
    background: #a8442a;
    border-radius: 3px;
    color: #fff;
    font-size: 0.8em;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.vinstappe-promo-block__price {
    font-size: 1.4em;
    font-weight: 700;
}

.vinstappe-promo-block__stock {
    color: #7a2e1a;
    font-weight: 600;
}

.vinstappe-promo-block__cta {
    display: inline-block;
    padding: 0.65em 1.4em;
    background: #4a6b18;
    border-radius: 3px;
    color: #fff !important; /* the theme forces its orange on links */
    font-weight: 700;
    text-decoration: none;
}

.vinstappe-promo-block__cta:hover,
.vinstappe-promo-block__cta:focus {
    background: #3a5512;
    color: #fff !important;
}

@media (max-width: 600px) {
    .vinstappe-promo-topbar {
        font-size: 0.8rem;
    }

    .vinstappe-promo-block {
        padding: 1em 0.8em;
    }

    .vinstappe-promo-block__examples th,
    .vinstappe-promo-block__examples td {
        padding: 0.45em 0.35em;
        font-size: 0.78rem;
        line-height: 1.3;
        /* the theme breaks words anywhere: keep whole words in the cells */
        word-break: normal !important;
        overflow-wrap: normal !important;
        hyphens: none !important;
    }
}