/*
Theme Name: Cherum Demo Store
Theme URI: https://cherum.io/woocommerce
Description: Child theme of Twenty Twenty-Five for the Cherum Pay demo store. Palette, type and spacing live in theme.json; block-level rules for WooCommerce live below.
Author: Cherum
Template: twentytwentyfive
Version: 0.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cherum-demo
*/

/* ---- Product card (CD, 02.09) ---- */
.wc-block-grid__products,.wp-block-woocommerce-product-template{gap:var(--wp--preset--spacing--40)}
.wc-block-grid__product,.wc-block-product-template__item{background:var(--wp--preset--color--paper);
  border:1px solid var(--wp--preset--color--line);border-radius:14px;padding:0;overflow:hidden;
  display:flex;flex-direction:column}
.wc-block-grid__product-image img,.wp-block-woocommerce-product-image img{width:100%;height:auto;
  aspect-ratio:1;object-fit:cover;display:block;border-radius:0}
.wc-block-grid__product-title,.wp-block-post-title{font-family:var(--wp--preset--font-family--display);
  font-size:1.0625rem;font-weight:500;letter-spacing:-0.01em;margin:14px 16px 0;line-height:1.25}
.wc-block-grid__product-price,.wp-block-woocommerce-product-price{margin:6px 16px 0;
  font-family:var(--wp--preset--font-family--mono);font-size:0.875rem;color:var(--wp--preset--color--ink-2)}
.wc-block-grid__product-add-to-cart,.wp-block-button{margin:14px 16px 16px}
.wc-block-grid__product-add-to-cart .wp-block-button__link{width:100%;justify-content:center}
/* hover: one change only — the frame. A lift or a shadow makes a placeholder card look cheaper than it is. */
.wc-block-grid__product:hover,.wc-block-product-template__item:hover{border-color:var(--wp--preset--color--ink-2)}
.added_to_cart{display:block;margin:8px 16px 0;font-size:0.875rem;color:var(--wp--preset--color--accent)}

/* ---- Checkout: our payment method (CD, 02.09) ---- */
.wc-block-components-radio-control__option{padding:14px 16px 14px 3.5em;border:1px solid var(--wp--preset--color--line);
  border-radius:12px;margin-bottom:10px;background:var(--wp--preset--color--paper)}
.wc-block-components-radio-control__option--checked-option-highlighted{border-color:var(--wp--preset--color--accent);
  box-shadow:inset 0 0 0 1px var(--wp--preset--color--accent)}
.wc-block-components-payment-method-icons img{height:22px;width:auto}
.wc-block-components-order-summary__content{font-family:var(--wp--preset--font-family--mono);font-size:0.875rem}
.wc-block-components-totals-item__value{font-family:var(--wp--preset--font-family--mono);font-weight:600}

/* ---- Demo ribbon above the header (CD, 02.09) ---- */
.cd-demo{background:var(--wp--preset--color--ink);color:var(--wp--preset--color--paper);
  font-size:0.8125rem;text-align:center;padding:7px 16px;letter-spacing:.01em;margin-top:0}
.cd-demo a{color:inherit}

/* ---- Engineering fixes after the live check (CC, 02.09) ----
   Woo's responsive grid formula gave two 578px columns inside the 1180px wide
   container; three is what the card was designed for. Below 900px Woo's own
   responsive columns stay (two on a phone read well). */
@media (min-width:900px){.wc-block-product-template.columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---- First screen: hero, category tiles, card badge (CD, 02.09) ---- */
.cd-hero{border-bottom:1px solid var(--wp--preset--color--line);overflow:hidden}
.cd-hero__in{align-items:center;gap:var(--wp--preset--spacing--50)}
.cd-hero h1{max-width:16ch}
.cd-hero__sub{font-size:1.0625rem;color:var(--wp--preset--color--ink-2);max-width:46ch;margin-top:.6rem}
.cd-hero .wp-block-buttons{margin-top:var(--wp--preset--spacing--40)}
/* three plates overlapping, the middle one larger, the right one leaving the frame — an edge, not a border */
.cd-hero__art{position:relative;min-height:380px}
.cd-hero__plate img{display:block;border-radius:14px;border:1px solid var(--wp--preset--color--line)}
.cd-hero__plate{position:absolute;margin:0}
.cd-hero__plate--a{width:46%;left:0;top:8%;z-index:2}
.cd-hero__plate--b{width:56%;left:30%;top:0;z-index:3}
.cd-hero__plate--c{width:44%;left:74%;top:46%;z-index:1}
@media(max-width:900px){
  .cd-hero__art{min-height:0;display:flex;gap:10px}
  .cd-hero__plate{position:static;width:33.333%}
  .cd-hero__plate--b{width:33.333%}
}
.cd-cats{gap:var(--wp--preset--spacing--30);margin-block:var(--wp--preset--spacing--50)}
.cd-cat{padding:var(--wp--preset--spacing--40);border-radius:16px;min-height:150px;
  display:flex;flex-direction:column;justify-content:flex-end}
.cd-cat h3{margin:0;font-size:1.375rem}
.cd-cat p{margin:.35rem 0 0;color:var(--wp--preset--color--ink-2);font-size:.875rem}
.cd-cat__go a{text-decoration:none;font-weight:600;color:var(--wp--preset--color--accent)}
.cd-cat--wear{background:#efe6da}
.cd-cat--home-table{background:#e7ece4}
.cd-cat--bits{background:#efe8ee}
@media(max-width:700px){.cd-cat{min-height:112px}}
.wc-block-product-template__item,.wp-block-woocommerce-product-template>li,.wc-block-product-template>li{position:relative}
.cd-badge{position:absolute;top:12px;left:12px;z-index:2;pointer-events:none;font-size:.75rem;line-height:1;
  padding:6px 10px;border-radius:999px;background:var(--wp--preset--color--paper);
  border:1px solid var(--wp--preset--color--line);color:var(--wp--preset--color--ink-2)}
.cd-badge--wear{background:#efe6da}
.cd-badge--home-table{background:#e7ece4}
.cd-badge--bits{background:#efe8ee}