/* OpenClaw TASK-20260501-003 Gate A: WPRM split handle marker. */
:root{--shinra-split-wprm:1;}

/* === OpenClaw Gate B4: WPRM palette cleanup migrated from shinra-custom.css === */
/* WPRM recipe cards: align with homepage palette and keep plugin defaults from leaking. */
.wprm-recipe-template-meadow,
.wprm-recipe,
.wprm-recipe-container,
.wprm-recipe-block-container,
[class*="wprm-recipe-"][class*="-container"],
[class*="wprm-recipe-"][class*="-block"] {
    border-color: var(--shinra-hinoki) !important;
    color: var(--shinra-ink) !important;
}
.wprm-recipe-template-meadow,
.wprm-recipe-container,
.wprm-recipe-block-container,
.wprm-recipe-block-container-columns {
    background: var(--shinra-washi) !important;
}
.wprm-recipe-name,
.wprm-recipe-header,
.wprm-recipe-group-name {
    font-family: var(--shinra-serif) !important;
    color: var(--shinra-ink) !important;
}
.wprm-recipe-meta-container,
.wprm-recipe-meta-container *,
.wprm-recipe-ingredient,
.wprm-recipe-instruction-text,
.wprm-recipe-notes-container {
    font-family: var(--shinra-sans) !important;
}
.wprm-recipe-jump-link,
.wprm-recipe-print-link,
.wprm-recipe-template-snippet-basic-buttons a,
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section {
    background: var(--shinra-seal) !important;
    border-color: var(--shinra-seal) !important;
    color: #ffffff !important;
}
.wprm-recipe-jump-link:hover,
.wprm-recipe-print-link:hover,
.wprm-recipe-template-snippet-basic-buttons a:hover,
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section:hover {
    background: var(--shinra-matcha) !important;
    border-color: var(--shinra-matcha) !important;
    color: #ffffff !important;
}


/* === END OpenClaw Gate B4 WPRM palette cleanup === */

/* === OpenClaw Gate B3: WPRM CSS migrated from shinra-custom.css === */
/* ══ WPRM 食譜卡片 ═══════════════════════════════════════ */
.wprm-recipe-block-container {
    border-radius: 0 !important;
    border: 1px solid #DACDB8 !important;
}
.wprm-recipe-block-container-columns {
    background-color: #FAFAF8 !important;
}
/* WPRM 標題底色 */
.wprm-recipe-block-container-columns .wprm-recipe-name {
    color: #22201D !important;
    font-family: 'Noto Serif TC', serif !important;
}
/* Jump/Print 按鈕容器 */
.wprm-recipe-snippet-container {
    border-radius: 0 !important;
}


/* ══ WPRM 全站方角 ══ */
.wprm-recipe-block-container,
.wprm-recipe-block-container-columns,
.wprm-recipe-image img,
.wprm-recipe-badge,
.wprm-recipe-navigation,
.wprm-recipe-navigation-item,
.wprm-recipe-navigation-item-icon-container,
.wprm-toggle-container,
.wprm-toggle,
.wprm-ingredient-group,
[class*="wprm-recipe-"][class*="-container"],
[class*="wprm-recipe-"][class*="-block"],
.wprm-recipe-template-meadow .wprm-recipe-block-container,
.wprm-recipe-template-meadow .wprm-recipe-navigation-item,
.wprm-recipe-template-meadow .wprm-recipe-navigation-item-icon-container {
    border-radius: 0 !important;
}

/* ── WPRM metadata badges 移除分隔線 ── */
.wprm-recipe-metadata {
    border-right: none !important;
    border-left: none !important;
    border-bottom: none !important;
    border-top: none !important;
    padding-right: 8px !important;
    padding-left: 8px !important;
}

/* ── WPRM navigation 置中並排 ── */
.wprm-recipe-jump-to-section,
[class*="wprm-recipe-jump-to-section"],
.wprm-recipe-navigation {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
}

.wprm-recipe-jump-to-section-item,
.wprm-recipe-navigation-item {
    flex-shrink: 0 !important;
}

/* ── WPRM pill badge 移除邊框 ── */
.wprm-recipe-block-container-pills,
.wprm-recipe-meta-container-pill,
.wprm-recipe-meta-container-pill .wprm-recipe-block-container {
    border: none !important;
    box-shadow: none !important;
}

/* ── WPRM metadata badges 強制無框線 ── */
.wprm-recipe-metadata,
.wprm-recipe-metadata-container,
.wprm-recipe-metadata-container > *,
.wprm-recipe-block-container-column,
.wprm-recipe-block-container-columns .wprm-recipe-block-container-column {
    border: none !important;
    border-right: none !important;
    border-left: none !important;
    border-top: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* ── WPRM 導航按鈕等寬 ── */
.wprm-recipe-jump-to-section-item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    text-align: center !important;
}


/* 2026-04-27 OpenClaw: keep WPRM jump/TOC navigation separate from article TOC red links. */
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
.wprm-recipe-template-snippet-basic-buttons a,
.wprm-recipe-jump-link,
.wprm-recipe-print-link {
    background: var(--shinra-matcha, #6F7C65) !important;
    border-color: var(--shinra-matcha, #6F7C65) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section:hover,
.wprm-recipe-template-snippet-basic-buttons a:hover,
.wprm-recipe-jump-link:hover,
.wprm-recipe-print-link:hover {
    background: var(--shinra-seal, #973226) !important;
    border-color: var(--shinra-seal, #973226) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
.wprm-recipe-jump-to-section-container,
.wprm-recipe-jump-to-section-container *,
.wprm-recipe-navigation,
.wprm-recipe-navigation * {
    -webkit-text-fill-color: currentColor;
}

/* 2026-04-27 OpenClaw: WPRM servings pill matcha background + washi text; WPRM TOC icons washi. */
.wprm-recipe-details-container-pills,
.wprm-recipe-details-container-pills .wprm-recipe-meta-container-pill,
.wprm-recipe-details-container-pills .wprm-recipe-servings-container,
.wprm-recipe-meta-container-pill .wprm-recipe-servings-container {
    background: var(--shinra-matcha, #6F7C65) !important;
    border-color: var(--shinra-matcha, #6F7C65) !important;
    color: var(--shinra-washi, #FAFAF8) !important;
    -webkit-text-fill-color: var(--shinra-washi, #FAFAF8) !important;
}
.wprm-recipe-details-container-pills .wprm-recipe-servings-container *,
.wprm-recipe-meta-container-pill .wprm-recipe-servings-container *,
.wprm-recipe-servings-label,
.wprm-recipe-servings,
.wprm-recipe-servings-unit,
.wprm-recipe-servings-with-unit {
    color: var(--shinra-washi, #FAFAF8) !important;
    -webkit-text-fill-color: var(--shinra-washi, #FAFAF8) !important;
}
.wprm-recipe-jump-to-section-container .wprm-recipe-icon,
.wprm-recipe-jump-to-section-container .wprm-recipe-icon *,
.wprm-recipe-jump-to-section-container .wprm-recipe-icon svg,
.wprm-recipe-jump-to-section-container .wprm-recipe-icon svg *,
.wprm-recipe-navigation .wprm-recipe-icon,
.wprm-recipe-navigation .wprm-recipe-icon *,
.wprm-recipe-navigation .wprm-recipe-icon svg,
.wprm-recipe-navigation .wprm-recipe-icon svg * {
    color: var(--shinra-washi, #FAFAF8) !important;
    fill: var(--shinra-washi, #FAFAF8) !important;
    stroke: var(--shinra-washi, #FAFAF8) !important;
    -webkit-text-fill-color: var(--shinra-washi, #FAFAF8) !important;
}

/* 2026-04-27 OpenClaw: constrain WPRM servings pill and hide empty-looking pill artifacts. */
.wprm-recipe-details-container-pills {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0 !important;
    background: transparent !important;
    border: 0 !important;
    color: inherit !important;
    -webkit-text-fill-color: initial !important;
}
.wprm-recipe-details-container-pills .wprm-recipe-meta-container-pill {
    display: inline-flex !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: max-content !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}
.wprm-recipe-details-container-pills .wprm-recipe-meta-container-pill:empty,
.wprm-recipe-details-container-pills .wprm-recipe-meta-container-pill:not(:has(.wprm-recipe-servings-container)) {
    display: none !important;
}
.wprm-recipe-details-container-pills .wprm-recipe-servings-container,
.wprm-recipe-meta-container-pill .wprm-recipe-servings-container {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: max-content !important;
    margin: 0 auto !important;
    padding: 6px 16px !important;
    background: var(--shinra-matcha, #6F7C65) !important;
    border: 1px solid var(--shinra-matcha, #6F7C65) !important;
    color: var(--shinra-washi, #FAFAF8) !important;
    -webkit-text-fill-color: var(--shinra-washi, #FAFAF8) !important;
}
.wprm-recipe-details-container-pills .wprm-recipe-servings-container::before,
.wprm-recipe-details-container-pills .wprm-recipe-servings-container::after,
.wprm-recipe-meta-container-pill .wprm-recipe-servings-container::before,
.wprm-recipe-meta-container-pill .wprm-recipe-servings-container::after {
    display: none !important;
    content: none !important;
}

/* 2026-04-27 OpenClaw: WPRM recipe TOC as four equal columns in one row. */
.wprm-recipe-jump-to-section-container,
.wprm-recipe-jump-to-section-container-scroll,
.wprm-recipe-navigation {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 4px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    justify-content: stretch !important;
    align-items: stretch !important;
    --wprm-jump-to-section-alignment: stretch !important;
}
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
.wprm-recipe-navigation a.wprm-recipe-navigation-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 108px !important;
    margin: 0 !important;
    padding: 12px 6px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    white-space: normal !important;
    background: var(--shinra-matcha, #6F7C65) !important;
    border: 0 !important;
    color: var(--shinra-washi, #FAFAF8) !important;
    -webkit-text-fill-color: var(--shinra-washi, #FAFAF8) !important;
}
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section .wprm-recipe-icon,
.wprm-recipe-navigation a.wprm-recipe-navigation-item .wprm-recipe-icon {
    display: block !important;
    margin: 0 0 8px !important;
    line-height: 1 !important;
}
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section .wprm-recipe-icon svg,
.wprm-recipe-navigation a.wprm-recipe-navigation-item .wprm-recipe-icon svg {
    width: 32px !important;
    height: 32px !important;
    max-width: 32px !important;
    max-height: 32px !important;
}
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section span:not(.wprm-recipe-icon),
.wprm-recipe-navigation a.wprm-recipe-navigation-item span:not(.wprm-recipe-icon) {
    display: block !important;
    max-width: 100% !important;
    overflow-wrap: anywhere !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    letter-spacing: .5px !important;
}
@media (max-width: 560px) {
    .wprm-recipe-jump-to-section-container,
    .wprm-recipe-jump-to-section-container-scroll,
    .wprm-recipe-navigation {
        gap: 3px !important;
    }
    .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
    .wprm-recipe-navigation a.wprm-recipe-navigation-item {
        min-height: 86px !important;
        padding: 9px 3px !important;
    }
    .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section .wprm-recipe-icon,
    .wprm-recipe-navigation a.wprm-recipe-navigation-item .wprm-recipe-icon {
        margin-bottom: 6px !important;
    }
    .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section .wprm-recipe-icon svg,
    .wprm-recipe-navigation a.wprm-recipe-navigation-item .wprm-recipe-icon svg {
        width: 26px !important;
        height: 26px !important;
        max-width: 26px !important;
        max-height: 26px !important;
    }
    .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section span:not(.wprm-recipe-icon),
    .wprm-recipe-navigation a.wprm-recipe-navigation-item span:not(.wprm-recipe-icon) {
        font-size: 10px !important;
        line-height: 1.25 !important;
        letter-spacing: .2px !important;
    }
}

/* 2026-04-27 OpenClaw: WPRM four TOC buttons spread out and centered inside columns. */
.wprm-recipe-jump-to-section-container,
.wprm-recipe-jump-to-section-container-scroll,
.wprm-recipe-navigation {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    justify-items: center !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    overflow: visible !important;
}
.wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
.wprm-recipe-navigation a.wprm-recipe-navigation-item {
    justify-self: center !important;
    align-self: center !important;
    width: 92% !important;
    max-width: 118px !important;
    min-width: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
}
@media (max-width: 560px) {
    .wprm-recipe-jump-to-section-container,
    .wprm-recipe-jump-to-section-container-scroll,
    .wprm-recipe-navigation {
        gap: 6px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
    .wprm-recipe-navigation a.wprm-recipe-navigation-item {
        width: 94% !important;
        max-width: none !important;
    }
}

/* 2026-04-27 OpenClaw: center the whole WPRM TOC button group, not only each button. */
.wprm-layout-container .wprm-recipe-jump-to-section-container,
.wprm-layout-container .wprm-recipe-jump-to-section-container-scroll,
.wprm-layout-container .wprm-recipe-navigation {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    justify-content: center !important;
    justify-items: center !important;
    align-items: center !important;
    gap: 10px !important;
    overflow: visible !important;
    transform: none !important;
}
.wprm-layout-container .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
.wprm-layout-container .wprm-recipe-navigation a.wprm-recipe-navigation-item {
    width: 100% !important;
    max-width: 92px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}
@media (max-width: 560px) {
    .wprm-layout-container .wprm-recipe-jump-to-section-container,
    .wprm-layout-container .wprm-recipe-jump-to-section-container-scroll,
    .wprm-layout-container .wprm-recipe-navigation {
        width: min(100%, 390px) !important;
        max-width: 390px !important;
        gap: 8px !important;
    }
    .wprm-layout-container .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
    .wprm-layout-container .wprm-recipe-navigation a.wprm-recipe-navigation-item {
        max-width: 82px !important;
    }
}
@media (max-width: 380px) {
    .wprm-layout-container .wprm-recipe-jump-to-section-container,
    .wprm-layout-container .wprm-recipe-jump-to-section-container-scroll,
    .wprm-layout-container .wprm-recipe-navigation {
        width: 100% !important;
        gap: 5px !important;
    }
    .wprm-layout-container .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
    .wprm-layout-container .wprm-recipe-navigation a.wprm-recipe-navigation-item {
        max-width: 74px !important;
    }
}

/* 2026-04-27 OpenClaw: center WPRM TOC groups with 3 or 4 buttons. */
.wprm-layout-container .wprm-recipe-jump-to-section-container,
.wprm-layout-container .wprm-recipe-jump-to-section-container-scroll,
.wprm-layout-container .wprm-recipe-navigation {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 430px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible !important;
}
.wprm-layout-container .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
.wprm-layout-container .wprm-recipe-navigation a.wprm-recipe-navigation-item {
    flex: 0 1 92px !important;
    width: 92px !important;
    max-width: 92px !important;
    min-width: 0 !important;
    margin: 0 !important;
}
@media (max-width: 560px) {
    .wprm-layout-container .wprm-recipe-jump-to-section-container,
    .wprm-layout-container .wprm-recipe-jump-to-section-container-scroll,
    .wprm-layout-container .wprm-recipe-navigation {
        gap: 8px !important;
        max-width: 390px !important;
    }
    .wprm-layout-container .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
    .wprm-layout-container .wprm-recipe-navigation a.wprm-recipe-navigation-item {
        flex-basis: 82px !important;
        width: 82px !important;
        max-width: 82px !important;
    }
}
@media (max-width: 380px) {
    .wprm-layout-container .wprm-recipe-jump-to-section-container,
    .wprm-layout-container .wprm-recipe-jump-to-section-container-scroll,
    .wprm-layout-container .wprm-recipe-navigation {
        gap: 5px !important;
    }
    .wprm-layout-container .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section,
    .wprm-layout-container .wprm-recipe-navigation a.wprm-recipe-navigation-item {
        flex-basis: 74px !important;
        width: 74px !important;
        max-width: 74px !important;
    }
}


/* === END OpenClaw Gate B3 WPRM CSS === */

/* === OpenClaw Gate B6b: residual WPRM CSS migrated from shinra-custom.css === */
/* ══════════════════════════════════════════════════════════
   V3.9 手機版食譜4顆按鈕 → 置中一行
   ══════════════════════════════════════════════════════════ */
.wprm-recipe-template-snippet-basic-buttons {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 2px !important;
    width: 100% !important;
}

/* 按鈕等寬縮放，手機上文字縮小以塞進一行 */
.wprm-recipe-template-snippet-basic-buttons a {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    text-align: center !important;
    justify-content: center !important;
    padding: 6px 4px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* icon 縮小一點 */
.wprm-recipe-template-snippet-basic-buttons .wprm-recipe-icon svg {
    width: 13px !important;
    height: 13px !important;
}

@media (max-width: 400px) {
    .wprm-recipe-template-snippet-basic-buttons a {
        font-size: 11px !important;
        padding: 6px 2px !important;
    }
    /* icon 隱藏，只保留文字，省空間 */
    .wprm-recipe-template-snippet-basic-buttons .wprm-recipe-icon {
        display: none !important;
    }
}
/* ══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   V4.0 手機版食譜章節導覽 → 2×2 grid，備註回到上排
   ══════════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .wprm-recipe-jump-to-section-container {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
        justify-items: center !important;
    }

    .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }
}
/* ══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   V4.1 手機版導覽列突破容器 padding，拉全寬放四顆
   ══════════════════════════════════════════════════════════ */
@media (max-width: 600px) {
    .wprm-recipe-jump-to-section-container {
        /* 突破兩側 40px padding */
        margin-left: -24px !important;
        margin-right: -24px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
        gap: 4px !important;
    }

    /* icon 縮小讓每顆更窄 */
    .wprm-recipe-jump-to-section-container .wprm-recipe-jump-to-section-icon svg {
        width: 28px !important;
        height: 28px !important;
    }

    /* 文字縮小 */
    .wprm-recipe-jump-to-section-container a.wprm-recipe-jump-to-section {
        font-size: 11px !important;
    }
}
/* ══════════════════════════════════════════════════════════ */

/* ══════════════════════════════════════════════════════════
   V4.2 WPRM 容器左右 padding 40 → 30px
   ══════════════════════════════════════════════════════════ */
.wprm-layout-container.wprm-padding-40 {
    padding-left: 30px !important;
    padding-right: 30px !important;
}
/* ══════════════════════════════════════════════════════════ */
/* === END === OpenClaw Gate B6b: residual WPRM CSS migrated from shinra-custom.css === === */