/*
 * Secondary-page brand palette
 * Keep every customer-facing page on the same red / white / black system as the storefront.
 */
:root {
    --yellow: #ffffff;
    --black: #251f1b;
    --white: #ffffff;
    --red: #b52f25;
    --accent: #b52f25;
    --pink: #b52f25;
    --shadow: rgba(37, 31, 27, 0.14);
    --brand-red: #b52f25;
    --brand-red-dark: #8f211b;
    --brand-black: #251f1b;
    --brand-white: #ffffff;
    --brand-line: rgba(37, 31, 27, 0.22);
    --brand-shadow: rgba(37, 31, 27, 0.14);
}

html,
body,
.reservation-page,
.b2b-page,
.origin-page,
.recipe-page,
.entry-page {
    background: var(--brand-white) !important;
    color: var(--brand-black);
}

body {
    cursor: auto;
}

a {
    text-decoration-color: currentColor;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
    outline: 3px solid rgba(181, 47, 37, 0.32) !important;
    outline-offset: 3px;
}

/* Shared navigation */
.site-header,
.reservation-header,
.entry-header,
.nav-header,
.recipe-header {
    background: var(--brand-white) !important;
    color: var(--brand-black) !important;
    border-color: var(--brand-black) !important;
    box-shadow: 0 8px 0 rgba(37, 31, 27, 0.08) !important;
}

.site-header__brand,
.site-header__nav a,
.site-header__phone,
.site-header__cart,
.reservation-logo-link,
.reservation-nav a,
.entry-header nav a,
.nav-logo,
.recipe-header a.recipe-home-link {
    color: var(--brand-black) !important;
}

.site-header__nav a:hover,
.site-header__nav a:focus-visible,
.site-header__nav a[aria-current="page"],
.reservation-nav a:hover,
.reservation-nav a:focus-visible,
.entry-header nav a:first-child,
.entry-header nav a:hover,
.entry-header nav a:focus-visible {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
}

.site-header__phone,
.site-header__cart,
.site-header__nav a,
.reservation-nav a,
.entry-header nav a {
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.site-header__reserve,
.site-header__nav a[aria-current="page"],
.entry-header nav a:first-child {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border-color: var(--brand-black) !important;
}

.site-header__cart span,
.nav-cart-count {
    color: var(--brand-red) !important;
    background: var(--brand-white) !important;
    border-color: var(--brand-red) !important;
}

/* Reservation */
.reservation-kicker,
.reservation-copy h1,
.reservation-current-notice strong,
.reservation-form-head h2,
.reservation-shop-panel h2,
.reservation-shop-panel dt {
    color: var(--brand-red-dark) !important;
}

.reservation-lead,
.reservation-current-notice,
.reservation-form-head p,
.reservation-field label,
.reservation-footer {
    color: var(--brand-black) !important;
}

.reservation-proof-row span,
.reservation-food-frame,
.reservation-current-notice,
.reservation-form-panel,
.reservation-shop-panel,
.reservation-field input,
.reservation-field select,
.reservation-field textarea,
.reservation-phone,
.reservation-status,
.reservation-map-link {
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.reservation-field label span,
.reservation-submit {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border-color: var(--brand-black) !important;
}

.reservation-field input:focus,
.reservation-field select:focus,
.reservation-field textarea:focus {
    border-color: var(--brand-red) !important;
    box-shadow: 0 0 0 4px rgba(181, 47, 37, 0.14) !important;
}

.reservation-map-link {
    color: var(--brand-red-dark) !important;
}

.reservation-status.is-success,
.reservation-status.is-error {
    color: var(--brand-black) !important;
    background: var(--brand-white) !important;
    border-left: 7px solid var(--brand-red) !important;
}

/* Business */
.b2b-hero__copy h1,
.b2b-section-head h2,
.b2b-contact-copy h2,
.b2b-card h3,
.b2b-condition-card h3,
.b2b-flow-list strong,
.b2b-spec-list dt {
    color: var(--brand-red-dark) !important;
}

.b2b-lead,
.b2b-card p,
.b2b-contact-copy p,
.b2b-condition-card p,
.b2b-photo-frame figcaption {
    color: var(--brand-black) !important;
}

.b2b-proof-row span,
.b2b-secondary-link,
.b2b-photo-frame,
.b2b-photo-frame figcaption,
.b2b-section,
.b2b-contact-section,
.b2b-card,
.b2b-condition-card,
.b2b-flow-list li {
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.b2b-primary-link,
.b2b-statement {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border-color: var(--brand-black) !important;
}

.b2b-secondary-link {
    color: var(--brand-black) !important;
}

/* Origin */
.origin-hero__copy h1,
.origin-section-head h2,
.origin-product__copy h2,
.origin-fact-card h3,
.origin-evidence-card h3,
.origin-official-list dt,
.origin-official-list a {
    color: var(--brand-red-dark) !important;
}

.origin-lead,
.origin-context-copy p,
.origin-product__copy p,
.origin-section-lead,
.origin-fact-card p,
.origin-evidence-card p,
.origin-logo-card figcaption,
.origin-photo-frame figcaption {
    color: var(--brand-black) !important;
}

.origin-proof-row span,
.origin-secondary-link,
.origin-logo-card,
.origin-photo-frame,
.origin-food-frame,
.origin-logo-card figcaption,
.origin-photo-frame figcaption,
.origin-section,
.origin-fact-card,
.origin-evidence-card,
.origin-evidence-card img,
.origin-product {
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.origin-primary-link,
.origin-statement {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border-color: var(--brand-black) !important;
}

.origin-statement h2,
.origin-statement p {
    color: var(--brand-white) !important;
}

.origin-statement__mark {
    color: var(--brand-red) !important;
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

/* Organic entry pages */
.entry-page {
    --entry-red: var(--brand-red);
    --entry-red-dark: var(--brand-red-dark);
    --entry-red-soft: var(--brand-white);
    --entry-ink: var(--brand-black);
    --entry-muted: var(--brand-black);
    --entry-line: var(--brand-black);
    --entry-white: var(--brand-white);
}

.entry-hero,
.entry-offer,
.entry-assurance span,
.entry-story,
.entry-faq,
.entry-faq details {
    background: var(--brand-white) !important;
}

.entry-hero,
.entry-offer,
.entry-hero-media img {
    border-color: var(--brand-black) !important;
}

.entry-offer.is-featured,
.entry-proof-strip,
.entry-button {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border-color: var(--brand-red) !important;
}

.entry-offer.is-featured .entry-button {
    color: var(--brand-red-dark) !important;
    background: var(--brand-white) !important;
}

/* Recipe */
.recipe-page h1,
.recipe-page h2,
.recipe-page h3,
.recipe-lead,
.recipe-toc a,
.recipe-note,
.recipe-faq dt {
    color: var(--brand-black) !important;
}

.recipe-page h2,
.recipe-page strong {
    color: var(--brand-red-dark) !important;
}

.recipe-page h2,
.recipe-note {
    border-color: var(--brand-red) !important;
}

.recipe-toc,
.recipe-note {
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.recipe-cta {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border: 3px solid var(--brand-black);
    box-shadow: 5px 5px 0 var(--brand-shadow) !important;
}

/* FAQ, press and policy pages */
.comic-section,
.comic-panel,
.faq-item,
.faq-body {
    color: var(--brand-black) !important;
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.panel-number,
.faq-button {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border-color: var(--brand-black) !important;
}

.comic-panel h1,
.comic-panel h2,
.comic-panel strong,
.comic-panel a {
    color: var(--brand-red-dark) !important;
}

.comic-panel > nav,
.comic-panel > div[style*="background"] {
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.comic-panel > div[style*="background"] {
    box-shadow: inset 6px 0 0 var(--brand-red);
}

/* Legal, account and post-purchase pages */
.legal-content,
.intro,
.contact-section,
.login-container,
.tab-container,
.form-container,
.profile-card,
.profile-sidebar,
.profile-main,
.order-card,
.modal-content,
.success-container,
.success-content,
.order-info,
.next-steps,
.bank-transfer-panel,
.info-card {
    color: var(--brand-black) !important;
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.legal-header,
.legal-footer,
.profile-header,
.orders-header,
.info-section h3,
.legal-section h2 {
    border-color: var(--brand-red) !important;
}

.page-title,
.legal-section h2,
.contact-section h2,
.site-title,
.profile-header .page-title,
.orders-header .page-title,
.success-title,
.section-title,
.order-number strong {
    color: var(--brand-red-dark) !important;
}

.tab-button.active,
.submit-button,
.btn-primary,
.button-primary,
.back-button,
#search-address-btn,
#register-button {
    color: var(--brand-white) !important;
    background: var(--brand-red) !important;
    border-color: var(--brand-black) !important;
}

.tab-button,
.back-link,
.next-link,
.button-secondary,
.btn-secondary {
    color: var(--brand-black) !important;
    background: var(--brand-white) !important;
    border-color: var(--brand-black) !important;
}

.profile-nav .nav-item:hover,
.profile-nav .nav-item.active,
.payment-info,
.info-message,
.delete-warning {
    color: var(--brand-black) !important;
    background: var(--brand-white) !important;
    border-color: var(--brand-red) !important;
}

.form-group input:focus,
.form-group select:focus,
.profile-form input:focus,
.profile-form select:focus {
    border-color: var(--brand-red) !important;
    box-shadow: 0 0 0 4px rgba(181, 47, 37, 0.14) !important;
}

.checkmark-circle-bg,
.checkmark-check {
    stroke: var(--brand-red) !important;
}

.recipe-footer,
.reservation-footer,
.origin-footer,
.entry-footer {
    color: var(--brand-white) !important;
    background: var(--brand-black) !important;
}

.recipe-footer a,
.reservation-footer a,
.origin-footer a,
.entry-footer a {
    color: var(--brand-white) !important;
}

@media (max-width: 720px) {
    .comic-section {
        padding: 72px 14px 40px;
    }

    .comic-panel {
        padding: 28px 18px;
    }

    .site-header__reserve,
    .b2b-primary-link,
    .b2b-secondary-link,
    .origin-primary-link,
    .origin-secondary-link {
        min-height: 48px;
    }
}