/* Hide theme's post title and empty thumbnail wrapper on recipe pages */
h1.page-title,
.entry-header,
.post-thumbnail:empty {
    display: none !important;
}

/* Recipe Display - All styles namespaced to .recipe-display */

.recipe-display {
    max-width: 900px;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif;
    color: #1a1a1a;
    line-height: 1.6;
}

/* Intro / Outro */
.recipe-display__intro,
.recipe-display__outro {
    margin-bottom: 1.5em;
    font-size: 1.05em;
    line-height: 1.7;
}

.recipe-display__outro {
    margin-top: 2em;
    margin-bottom: 0;
}

/* Jump to Recipe */
.recipe-display__jump {
    display: inline-block;
    margin-bottom: 2em;
    padding: 0.6em 1.4em;
    background: #2c6e49;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
    font-size: 0.9em;
    font-weight: 600;
    letter-spacing: 0.02em;
    transition: background 0.2s;
}

.recipe-display__jump:hover {
    background: #1b4d34;
    color: #fff;
}

/* Recipe Card */
.recipe-display__card {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 16px;
    padding: 2.5em;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
}

/* Header */
.recipe-display__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1em;
    margin-bottom: 0.5em;
}

.recipe-display__title {
    margin: 0;
    font-size: 2em;
    font-weight: 700;
    line-height: 1.2;
    color: #1a1a1a;
}

/* Print button */
.recipe-display__print {
    flex-shrink: 0;
    padding: 0.5em 1.2em;
    background: transparent;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 0.85em;
    font-weight: 500;
    color: #555;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
}

.recipe-display__print:hover {
    border-color: #888;
    color: #1a1a1a;
}

/* Byline */
.recipe-display__byline {
    display: flex;
    align-items: center;
    gap: 0.8em;
    margin-bottom: 1em;
    font-size: 0.9em;
    color: #666;
}

.recipe-display__author {
    font-weight: 500;
}

.recipe-display__byline .recipe-display__date::before {
    content: "|";
    margin-right: 0.8em;
    color: #ccc;
}

/* Description */
.recipe-display__description {
    margin: 0 0 1.5em;
    font-size: 1em;
    color: #444;
    line-height: 1.6;
}

/* Hero Image */
.recipe-display__image {
    margin: 0 0 1.5em;
    padding: 0;
}

.recipe-display__image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
    object-fit: cover;
}

/* Meta Bar */
.recipe-display__meta {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1em;
    list-style: none;
    margin: 0 0 1.5em;
    padding: 1.2em;
    background: #f8f9fa;
    border-radius: 10px;
}

.recipe-display__meta li {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.2em;
}

.recipe-display__meta-label {
    font-size: 0.75em;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #888;
}

.recipe-display__meta-value {
    font-size: 1em;
    font-weight: 600;
    color: #1a1a1a;
}

/* Chips */
.recipe-display__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    margin-bottom: 2em;
}

.recipe-display__chip {
    display: inline-block;
    padding: 0.3em 0.8em;
    border-radius: 20px;
    font-size: 0.8em;
    font-weight: 500;
    line-height: 1.4;
}

.recipe-display__chip--diet {
    background: #e8f5e9;
    color: #2e7d32;
}

.recipe-display__chip--keyword {
    background: #f0f0f0;
    color: #555;
}

/* Body Grid: Ingredients + Instructions */
.recipe-display__body {
    display: grid;
    grid-template-columns: 1fr 1.25fr;
    gap: 2.5em;
    margin-bottom: 2em;
}

/* Ingredients */
.recipe-display__ingredients h3,
.recipe-display__instructions h3 {
    margin: 0 0 0.8em;
    font-size: 1.3em;
    font-weight: 700;
    color: #1a1a1a;
    border-bottom: 2px solid #2c6e49;
    padding-bottom: 0.4em;
}

.recipe-display .recipe-display__ingredient-list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.recipe-display .recipe-display__ingredient-list li {
    padding: 0.4em 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
    list-style: none !important;
    background: none !important;
    margin: 0 !important;
}

.recipe-display .recipe-display__ingredient-list li::before {
    display: none !important;
    content: none !important;
}

.recipe-display .recipe-display__ingredient-list li::marker {
    display: none !important;
    content: none !important;
    font-size: 0 !important;
}

.recipe-display .recipe-display__ingredient-list li:last-child {
    border-bottom: none !important;
}

.recipe-display .recipe-display__ingredient-list label {
    display: flex !important;
    align-items: flex-start !important;
    gap: 0.6em !important;
    cursor: pointer !important;
    line-height: 1.5 !important;
}

.recipe-display .recipe-display__checkbox {
    margin-top: 0.3em !important;
    flex-shrink: 0 !important;
    width: 16px !important;
    height: 16px !important;
    accent-color: #2c6e49 !important;
}

.recipe-display .recipe-display__checkbox:checked + span {
    text-decoration: line-through !important;
    opacity: 0.5 !important;
}

/* Instructions */
.recipe-display .recipe-display__step-list {
    margin: 0 !important;
    padding: 0 0 0 1.5em !important;
    list-style: decimal !important;
    counter-reset: none !important;
}

.recipe-display .recipe-display__step-list li {
    padding: 0.6em 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
    cursor: pointer !important;
    transition: opacity 0.2s !important;
    background: none !important;
}

.recipe-display .recipe-display__step-list li::before {
    display: none !important;
    content: none !important;
}

.recipe-display .recipe-display__step-list li::marker {
    content: normal !important;
}

.recipe-display__step:last-child {
    border-bottom: none;
}

.recipe-display__step p {
    margin: 0;
    line-height: 1.7;
}

.recipe-display__step--done {
    opacity: 0.4;
}

/* Nutrition Facts */
.recipe-display__nutrition {
    margin-top: 2em;
    padding-top: 2em;
    border-top: 1px solid #e0e0e0;
}

.recipe-display__nutrition h3 {
    margin: 0 0 0.3em;
    font-size: 1.5em;
    font-weight: 900;
    color: #1a1a1a;
    border-bottom: none;
    padding-bottom: 0;
}

.recipe-display__serving-size {
    display: block;
    margin-bottom: 0.8em;
    font-size: 0.9em;
    color: #666;
}

.recipe-display__nutrition-list {
    margin: 0;
    padding: 0;
    border-top: 8px solid #1a1a1a;
}

.recipe-display__nutrition-item {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    padding: 0.4em 0;
    border-bottom: 1px solid #ddd;
}

.recipe-display__nutrition-item dt {
    font-weight: 700;
    font-size: 0.95em;
}

.recipe-display__nutrition-item dd {
    margin: 0;
    font-size: 0.95em;
}

.recipe-display__nutrition-item--sub {
    padding-left: 1.5em;
}

.recipe-display__nutrition-item--sub dt {
    font-weight: 400;
}

/* First item (Calories) gets extra emphasis */
.recipe-display__nutrition-item:first-child {
    border-bottom: 4px solid #1a1a1a;
    padding-bottom: 0.5em;
}

.recipe-display__nutrition-item:first-child dt,
.recipe-display__nutrition-item:first-child dd {
    font-size: 1.1em;
    font-weight: 900;
}

/* ---- Responsive ---- */
@media (max-width: 768px) {
    .recipe-display__card {
        padding: 1.5em;
        border-radius: 10px;
    }

    .recipe-display__header {
        flex-direction: column;
        gap: 0.8em;
    }

    .recipe-display__title {
        font-size: 1.5em;
    }

    .recipe-display__meta {
        grid-template-columns: repeat(2, 1fr);
    }

    .recipe-display__body {
        grid-template-columns: 1fr;
        gap: 2em;
    }

    .recipe-display__image img {
        border-radius: 8px;
    }
}

@media (max-width: 480px) {
    .recipe-display__meta {
        grid-template-columns: 1fr 1fr;
        gap: 0.8em;
        padding: 1em;
    }

    .recipe-display__card {
        padding: 1.2em;
    }
}

/* ---- Print ---- */
@media print {
    /* Hide non-essential content */
    .recipe-display__intro,
    .recipe-display__outro,
    .recipe-display__jump,
    .recipe-display__actions,
    .recipe-display__checkbox,
    .recipe-display__byline {
        display: none !important;
    }

    /* Hide common site chrome */
    header,
    footer,
    nav,
    .sidebar,
    .widget-area,
    .comments-area,
    #comments,
    .site-header,
    .site-footer,
    .site-navigation,
    .wp-block-navigation {
        display: none !important;
    }

    /* Clean card for print */
    .recipe-display__card {
        border: none;
        box-shadow: none;
        padding: 0;
        border-radius: 0;
    }

    .recipe-display {
        max-width: 100%;
    }

    .recipe-display__image img {
        max-height: 300px;
        object-fit: cover;
        border-radius: 0;
    }

    /* Prevent page breaks inside sections */
    .recipe-display__ingredients,
    .recipe-display__instructions,
    .recipe-display__nutrition {
        break-inside: avoid;
    }

    .recipe-display__step {
        break-inside: avoid;
    }

    /* Ensure ingredient text is visible (undo checkbox strikethrough) */
    .recipe-display__checkbox:checked + span {
        text-decoration: none;
        opacity: 1;
    }

    /* Body goes single column for print */
    .recipe-display__body {
        grid-template-columns: 1fr;
    }
}
