/*
 * Recipe Meal Planner — Recipe Card styles
 *
 * Loaded only when "Disable default Recipe Card CSS" is NOT ticked in Settings.
 * Disable this file if you want your page builder (e.g. Divi) to supply all
 * styling for the [recipe_card] shortcode output.
 *
 * CSS custom properties used here are defined in public.css (always loaded):
 *   --rmp-green, --rmp-green-dark, --rmp-green-light
 *   --rmp-text, --rmp-text-muted, --rmp-border, --rmp-radius
 */

/* ============================================================
   Recipe Card  [recipe_card] shortcode
   ============================================================ */

.rmp-recipe-card {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    font-size: 15px;
    color: var(--rmp-text);
    line-height: 1.6;
    max-width: 860px;
    margin: 0 auto;
}
.rmp-recipe-card *,
.rmp-recipe-card *::before,
.rmp-recipe-card *::after { box-sizing: border-box; }

/* ── Title (optional) ──────────────────────────────────────── */
.rmp-rc-title {
    font-size: 26px;
    font-weight: 700;
    color: var(--rmp-green-dark);
    margin: 0 0 16px;
}

/* ── Meta bar ──────────────────────────────────────────────── */
.rmp-rc-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 20px;
    padding: 12px 16px;
    background: var(--rmp-green-light);
    border-radius: var(--rmp-radius);
    margin-bottom: 20px;
}
.rmp-rc-meta__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
}
.rmp-rc-meta__label {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--rmp-green);
}
.rmp-rc-meta__value {
    font-size: 14px;
    font-weight: 600;
    color: var(--rmp-green-dark);
}
.rmp-rc-meta__item--servings {
    border-left: 2px solid var(--rmp-border);
    padding-left: 20px;
    margin-left: 4px;
}

/* ── Description ───────────────────────────────────────────── */
.rmp-rc-description {
    margin-bottom: 20px;
    font-style: italic;
    color: var(--rmp-text-muted);
}
.rmp-rc-description p { margin: 0; }

/* ── Add to list button placement ─────────────────────────── */
.rmp-rc-add-btn { margin-bottom: 24px; }

/* ── Two-column body (ingredients + method) ────────────────── */
.rmp-rc-body {
    display: grid;
    grid-template-columns: minmax(200px, 2fr) 3fr;
    gap: 32px;
    margin-bottom: 28px;
}
@media (max-width: 640px) {
    .rmp-rc-body { grid-template-columns: 1fr; gap: 0; }
}

/* ── Section headings ──────────────────────────────────────── */
.rmp-rc-section { margin-bottom: 28px; }
.rmp-rc-section__title {
    font-size: 16px;
    font-weight: 700;
    color: var(--rmp-green-dark);
    margin: 0 0 12px;
    padding-bottom: 6px;
    border-bottom: 2px solid var(--rmp-green-light);
    text-transform: uppercase;
    letter-spacing: .05em;
}

/* ── Ingredient list ───────────────────────────────────────── */
.rmp-rc-ing-list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.rmp-rc-ing-list__header {
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--rmp-green);
    margin: 14px 0 6px;
    padding-bottom: 3px;
    border-bottom: 1px solid var(--rmp-green-light);
}
.rmp-rc-ing-list__header:first-child { margin-top: 0; }

.rmp-rc-ing-list__item {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0 6px;
    padding: 5px 0;
    border-bottom: 1px solid var(--rmp-border);
    font-size: 14px;
}
.rmp-rc-ing-list__item:last-child { border-bottom: none; }

/* Visual checkbox dot (decorative) */
.rmp-rc-ing-check {
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    border: 2px solid var(--rmp-green);
    border-radius: 3px;
    display: inline-block;
    margin-right: 4px;
    position: relative;
    top: 2px;
}

.rmp-rc-ing-qty {
    font-weight: 600;
    color: var(--rmp-green-dark);
    white-space: nowrap;
}
.rmp-rc-ing-name { flex: 1; }
.rmp-rc-ing-name a {
    color: var(--rmp-green);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.rmp-rc-ing-notes {
    color: var(--rmp-text-muted);
    font-size: 13px;
    font-style: italic;
}

/* ── Method steps ──────────────────────────────────────────── */
.rmp-rc-method__heading {
    font-size: 15px;
    font-weight: 700;
    color: var(--rmp-green-dark);
    margin: 18px 0 8px;
    padding: 0;
    border: none;
    text-transform: none;
    letter-spacing: normal;
}
.rmp-rc-method__heading:first-child { margin-top: 0; }

.rmp-rc-step-list {
    margin: 0 0 12px 20px;
    padding: 0;
}
.rmp-rc-step {
    padding: 5px 0 5px 6px;
    font-size: 14px;
    border-bottom: 1px solid var(--rmp-border);
    line-height: 1.55;
}
.rmp-rc-step:last-child { border-bottom: none; }

/* ── Notes & Nutrition ─────────────────────────────────────── */
.rmp-rc-notes__body,
.rmp-rc-nutrition__body {
    font-size: 14px;
    color: var(--rmp-text);
    line-height: 1.65;
}
.rmp-rc-notes__body a {
    color: var(--rmp-green);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.rmp-rc-nutrition__body { color: var(--rmp-text-muted); }

/* ── Add to Meal Planner picker ────────────────────────────── */
.rmp-add-to-plan-wrap { display: inline-block; }
.rmp-atp-picker {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    flex-wrap: wrap;
}
.rmp-atp-select {
    padding: 6px 10px;
    border: 1.5px solid var(--rmp-border);
    border-radius: var(--rmp-radius);
    font-size: 14px;
    flex: 1;
    min-width: 200px;
}

/* ── Print styles (shopping list page) ─────────────────────── */
@media print {
    /* Hide everything that isn't the shopping list content */
    .rmp-no-print,
    #rmp-sl-status,
    #rmp-sl-empty {
        display: none !important;
    }

    /* Remove page chrome (theme headers, nav, footers, sidebars) */
    header, footer, nav, aside,
    .site-header, .site-footer, .site-navigation,
    .main-navigation, .widget-area, #sidebar,
    .et_pb_section:not(:has(#rmp-sl-app)),
    .et_pb_row:not(:has(#rmp-sl-app)),
    .et_pb_column:not(:has(#rmp-sl-app)) {
        display: none !important;
    }

    body { background: #fff; margin: 0; }

    #rmp-sl-app {
        width: 100%;
        max-width: 100%;
        padding: 0;
        box-shadow: none;
    }

    .rmp-sl-title {
        font-size: 20pt;
        margin-bottom: 12pt;
    }

    .rmp-sl-section { margin-bottom: 14pt; break-inside: avoid; }
    .rmp-sl-section__title { font-size: 13pt; border-bottom: 1pt solid #333; padding-bottom: 3pt; margin-bottom: 6pt; }

    /* Keep checked items visible but strike through */
    .rmp-sl-item { display: flex; align-items: baseline; gap: 6pt; font-size: 11pt; padding: 3pt 0; border-bottom: .5pt solid #ddd; break-inside: avoid; }
    .rmp-sl-item.is-checked .rmp-sl-item__label { text-decoration: line-through; color: #888; }
    .rmp-sl-item__check { width: 12pt; height: 12pt; border: 1pt solid #333; flex-shrink: 0; appearance: none; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
    .rmp-sl-item__check:checked { background: #333; }
    .rmp-sl-item__remove { display: none; }
}