/*
Theme Name: NutriLabels
Theme URI: https://nutrilabels.com
Description: NutriLabels brand child theme of Twenty Twenty-Five. The design system (colors, type, spacing, buttons, card and section styles) lives in theme.json and styles/*.json so every page is built from native blocks with no page-level CSS.
Author: NutriLabels
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nutrilabels
*/

/* Everything visual is in theme.json. The few rules below are structural: things block
   styles cannot express (sticky header stacking, label image sizing, mobile stacking). */

.is-position-sticky { z-index: 50; }
.is-style-footer .wp-block-image img { height: auto; }
.wp-block-details.is-style-faq summary { padding-right: 4px; }
.wp-block-navigation .wp-block-navigation__responsive-container-open { color: var(--wp--preset--color--navy); }
.wc-block-mini-cart__button { padding: 0 6px; }

/* Label galleries: keep every label the same visual height without cropping. */
.is-style-frame img { max-width: 100%; object-fit: contain; }

@media (max-width: 720px) {
  .is-style-label-card { transform: none !important; margin-top: 24px; }
}

/* ---- Block style variations: the parts theme.json cannot express (sizes, pseudo-elements,
   hover states). Colours and type for the same styles live in styles/*.json. ---- */

/* Buttons */
.wp-block-button.is-style-navy .wp-block-button__link:hover,
.wp-block-button.is-style-navy .wp-block-button__link:focus { background: var(--wp--preset--color--navy-deep); border-color: var(--wp--preset--color--navy-deep); color: #fff; }
.wp-block-button.is-style-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-ghost .wp-block-button__link:focus { background: var(--wp--preset--color--navy-tint); color: var(--wp--preset--color--navy); }
.wp-block-button.is-style-ghost-light .wp-block-button__link:hover,
.wp-block-button.is-style-ghost-light .wp-block-button__link:focus { background: rgba(255,255,255,.12); border-color: #fff; color: #fff; }

/* Paragraph styles */
p.is-style-eyebrow { width: fit-content; }
p.is-style-number { width: 44px; height: 44px; flex: 0 0 44px; display: inline-flex; align-items: center; justify-content: center; margin: 0; }
p.is-style-badge { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); width: max-content; white-space: nowrap; margin: 0; }

/* Check list */
ul.is-style-checks { list-style: none; padding-left: 0; }
ul.is-style-checks li { position: relative; padding-left: 28px; margin-bottom: 9px; }
ul.is-style-checks li::before { content: ''; position: absolute; left: 0; top: .42em; width: 16px; height: 16px; border-radius: 50%;
  background: var(--wp--preset--color--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.3l2.6 2.6L12 5.6' fill='none' stroke='%2300224A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat; }

/* Compare table */
.wp-block-table.is-style-compare table { border-collapse: separate; border-spacing: 0; border: 1px solid var(--wp--preset--color--line); border-radius: 14px; overflow: hidden; background: #fff; box-shadow: var(--wp--preset--shadow--card); }
.wp-block-table.is-style-compare thead th { background: var(--wp--preset--color--navy); color: #fff; font-family: var(--wp--preset--font-family--montserrat); font-weight: 800; font-size: .85rem; text-transform: uppercase; letter-spacing: .06em; padding: 16px 18px; border: 0; text-align: left; }
.wp-block-table.is-style-compare td { padding: 14px 18px; border: 0; border-top: 1px solid var(--wp--preset--color--line); vertical-align: top; }
.wp-block-table.is-style-compare tbody td:first-child { font-weight: 700; color: var(--wp--preset--color--navy); }
.wp-block-table.is-style-compare tbody tr:nth-child(even) td { background: var(--wp--preset--color--bg-soft); }

/* FAQ item (Details block) */
.wp-block-details.is-style-faq summary { font-family: var(--wp--preset--font-family--montserrat); font-weight: 700; font-size: 1.02rem; color: var(--wp--preset--color--navy); list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 16px; cursor: pointer; }
.wp-block-details.is-style-faq summary::-webkit-details-marker { display: none; }
.wp-block-details.is-style-faq summary::after { content: '+'; flex: 0 0 28px; height: 28px; border-radius: 50%; background: var(--wp--preset--color--green-tint); color: var(--wp--preset--color--green-dark); display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.1rem; }
.wp-block-details.is-style-faq[open] summary::after { content: '\2013'; }
.wp-block-details.is-style-faq > :not(summary) { color: var(--wp--preset--color--muted); margin-top: 10px; margin-bottom: 0; }
