/* Bearbell theme: small additions on top of theme.json */

/* Eyebrow / tagline labels */
.is-style-eyebrow {
	font-family: var(--wp--preset--font-family--dm-sans) !important;
	font-size: var(--wp--preset--font-size--x-small) !important;
	font-weight: 700 !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	line-height: 1.4 !important;
	color: var(--wp--preset--color--eyebrow);
}

/* Pink italic emphasis inside headings: select a word and press Ctrl/Cmd+I */
h1 em, h2 em, h3 em, .wp-block-post-title em,
h1 .bb-pink, h2 .bb-pink { color: var(--wp--preset--color--bb-pink); }

/* Quick answer box (answer-first sections for search and AI answers) */
.is-style-answer-box {
	background: var(--wp--preset--color--surface);
	border-radius: 14px;
	padding: var(--wp--preset--spacing--40) !important;
}
.is-style-answer-box > :first-child { margin-top: 0; }

/* Pink tick list */
ul.is-style-checks { list-style: none; padding-left: 0; }
ul.is-style-checks li { position: relative; padding-left: 1.9em; margin-bottom: 0.5em; }
ul.is-style-checks li::before {
	content: ""; position: absolute; left: 0; top: 0.3em; width: 1.1em; height: 1.1em;
	background: var(--wp--preset--color--bb-pink);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* FAQ (details) */
.wp-block-details summary {
	font-family: var(--wp--preset--font-family--dm-serif-display);
	font-size: var(--wp--preset--font-size--large);
	cursor: pointer; list-style: none; position: relative; padding-right: 2rem;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after {
	content: "+"; position: absolute; right: 0; top: 0;
	font-family: var(--wp--preset--font-family--dm-sans); color: var(--wp--preset--color--bb-pink);
}
.wp-block-details[open] summary::after { content: "–"; }

/* Article cards */
.bb-card { border-radius: 14px; overflow: hidden; height: 100%; }
.bb-card .wp-block-post-featured-image { border-radius: 0; margin: 0; }
.bb-card .wp-block-post-featured-image img { aspect-ratio: 3 / 2; object-fit: cover; }

/* Glossary term anchors sit below a sticky header */
.bb-glossary-term { scroll-margin-top: 6rem; }

/* Header */
.bb-header { position: sticky; top: 0; z-index: 50; }
.admin-bar .bb-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .bb-header { top: 46px; } }

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

/* Section styles: re-map the colour roles so everything inside a section
   (eyebrows, cards, links, quotes) stays readable whichever global style is active */
[class*="is-style-section-plum"], [class*="is-style-section-blackberry"] {
	--wp--preset--color--base: #211B23;
	--wp--preset--color--surface: #47313F;
	--wp--preset--color--contrast: #F6F6F6;
	--wp--preset--color--eyebrow: #E9C8CE;
	--wp--preset--color--muted: #D7A4B4;
	--wp--preset--color--link: #E9C8CE;
	--wp--preset--color--border: #765365;
}
[class*="is-style-section-blackberry"] { --wp--preset--color--surface: #211B23; }
[class*="is-style-section-porcelain"], [class*="is-style-section-white"] {
	--wp--preset--color--base: #FFFFFF;
	--wp--preset--color--surface: #FFFFFF;
	--wp--preset--color--contrast: #211B23;
	--wp--preset--color--eyebrow: #765365;
	--wp--preset--color--muted: #765365;
	--wp--preset--color--link: #47313F;
	--wp--preset--color--border: #E9C8CE;
}
[class*="is-style-section-white"] { --wp--preset--color--surface: #F1E5DF; --wp--preset--color--link: #D12764; }


/* Accessibility helper (social icon labels, skip links) */
.screen-reader-text { border:0; clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute !important; width:1px; word-wrap:normal !important; }
.screen-reader-text:focus { background:#F6F6F6; color:#211B23; clip:auto !important; clip-path:none; display:block; height:auto; left:5px; padding:12px 20px; top:5px; width:auto; z-index:100000; }

/* Footer rule */
.wp-block-separator.is-style-wide { border-top: 1px solid var(--wp--preset--color--border); border-bottom: 0; background: none !important; opacity: 1; }

.bb-card { padding: 0 !important; }
.has-text-align-center { text-align: center; }
.has-text-align-left { text-align: left; }
.has-text-align-right { text-align: right; }

/* Pull quote */
.wp-block-pullquote { padding: var(--wp--preset--spacing--50) 0 !important; }
.wp-block-pullquote cite {
	font-family: var(--wp--preset--font-family--dm-sans); font-style: normal; font-size: var(--wp--preset--font-size--x-small);
	font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--eyebrow);
}

/* No gaps between header, main and footer */
.wp-site-blocks > * + * { margin-block-start: 0; }

/* No side rules on quotes (brand: no vertical lines) */
.wp-block-quote { border-left: 0 !important; padding-left: 0 !important; }

/* ===== v1.1 components ===== */

/* Pills (editable labels such as "Most popular") */
p.is-style-pill, p.is-style-pill-blush, p.is-style-pill-mauve {
	display: inline-block; width: auto; max-width: max-content; border-radius: 999px; padding: 0.3em 0.95em;
	font-size: 0.7rem !important; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; line-height: 1.4;
	background: var(--wp--preset--color--bb-pink); color: var(--wp--preset--color--bb-offwhite);
}
p.is-style-pill-blush { background: var(--wp--preset--color--bb-blush); color: var(--wp--preset--color--bb-plum); }
p.is-style-pill-mauve { background: var(--wp--preset--color--bb-smoky); color: var(--wp--preset--color--bb-offwhite); }

/* Cards */
.is-style-card-highlight { box-shadow: inset 0 0 0 2px var(--wp--preset--color--bb-pink); border-radius: 14px; }
.bb-offer { position: relative; }
.bb-offer > .bb-offer__pill { position: absolute; top: -0.85rem; left: 1rem; margin: 0 !important; }
.bb-price { font-family: var(--wp--preset--font-family--dm-serif-display); font-size: var(--wp--preset--font-size--x-large) !important; line-height: 1.1; }

/* Icon block */
.bb-icon { display: flex; line-height: 0; }
.bb-icon.aligncenter { justify-content: center; }
.bb-icon.alignright { justify-content: flex-end; }
.bb-icon.has-icon-background .bb-svg { box-sizing: content-box; padding: calc(var(--bb-icon-size, 32px) * 0.45); border-radius: 999px; background: var(--wp--preset--color--surface); }
.bb-svg { flex: none; }

/* Icon list */
ul.bb-icon-list { list-style: none; padding-left: 0; margin-left: 0; }
.bb-icon-list__item { display: flex; gap: 0.65em; align-items: flex-start; margin-bottom: 0.55em; }
.bb-icon-list__icon { flex: none; line-height: 0; margin-top: 0.2em; }
.bb-icon-list__text { flex: 1; }

/* MailerLite sign-up */
.bb-ml-form { display: flex; flex-direction: column; gap: 0.75rem; }
.bb-ml-fields { display: flex; flex-direction: column; gap: 0.6rem; }
.bb-ml.is-layout-inline .bb-ml-fields { flex-direction: row; flex-wrap: wrap; }
.bb-ml.is-layout-inline .bb-ml-field { flex: 1 1 12rem; }
.bb-ml-field input {
	width: 100%; font: inherit; font-size: 1rem; padding: 0.8rem 1.2rem; border-radius: 999px;
	border: 1px solid var(--wp--preset--color--bb-dusty-rose); background: #fff; color: var(--wp--preset--color--bb-plum);
}
.bb-ml-field input::placeholder { color: var(--wp--preset--color--bb-smoky); }
.bb-ml-field input:focus { outline: 2px solid var(--wp--preset--color--bb-pink); outline-offset: 1px; }
.bb-ml-submit { cursor: pointer; border: 0; text-align: center; }
.bb-ml-submit[disabled] { opacity: 0.7; }
.bb-ml-groups { border: 0; padding: 0; margin: 0.25rem 0 0; display: flex; flex-direction: column; gap: 0.45rem; }
.bb-ml-groups legend { font-size: var(--wp--preset--font-size--x-small); font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: var(--wp--preset--color--eyebrow); margin-bottom: 0.4rem; padding: 0; }
.bb-ml-check { display: flex; gap: 0.6rem; align-items: center; font-size: 0.95rem; cursor: pointer; }
.bb-ml-check input { width: 1.15rem; height: 1.15rem; accent-color: var(--wp--preset--color--bb-pink); flex: none; }
.bb-ml-consent { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); margin: 0; }
.bb-ml-error { color: var(--wp--preset--color--bb-pink); font-weight: 500; margin: 0; }
.bb-ml-success { font-family: var(--wp--preset--font-family--dm-serif-display); font-size: var(--wp--preset--font-size--large); }
.bb-ml-notice { border: 2px dashed var(--wp--preset--color--bb-pink); border-radius: 14px; padding: 1rem 1.25rem; font-size: 0.9rem; }

/* Article byline */
.bb-post-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); }
.bb-post-meta .bb-svg { margin-right: -0.1rem; }
.bb-sep { opacity: 0.7; }

/* Table of contents */
.bb-toc { border: 1px solid var(--wp--preset--color--border); border-radius: 14px; padding: 1.1rem 1.5rem; }
.bb-toc__title { display: flex; align-items: center; gap: 0.4rem; margin: 0 0 0.4rem; }
.bb-toc ol { margin: 0; padding-left: 1.3rem; }
.bb-toc li { margin: 0.2rem 0; }
.bb-toc li.is-level-3 { margin-left: 1rem; list-style-type: lower-alpha; }
.bb-toc a { text-decoration: none; color: inherit; }
.bb-toc a:hover { color: var(--wp--preset--color--bb-pink); text-decoration: underline; }
h2[id], h3[id] { scroll-margin-top: 6rem; }

/* Share */
.bb-share { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; padding: 0.9rem 0; border-top: 1px solid var(--wp--preset--color--border); border-bottom: 1px solid var(--wp--preset--color--border); }
.bb-share__label { display: inline-flex; align-items: center; gap: 0.4rem; font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--muted); margin-right: 0.25rem; }
.bb-share__btn { display: inline-flex; align-items: center; gap: 0.35rem; font: inherit; font-size: 0.85rem; font-weight: 500; padding: 0.35rem 0.95rem; border-radius: 999px; border: 0; cursor: pointer;
	background: var(--wp--preset--color--surface); color: var(--wp--preset--color--contrast) !important; text-decoration: none !important; }
.bb-share__btn:hover { background: var(--wp--preset--color--bb-pink); color: var(--wp--preset--color--bb-offwhite) !important; }

/* Health note */
.bb-health-note { display: flex; gap: 0.8rem; align-items: flex-start; }
.bb-health-note > .bb-icon { margin-top: 0.2rem; }

/* Author box */
.bb-author .wp-block-avatar img, .bb-author .wp-block-image img { border-radius: 14px; }

/* Comparison tables */
.wp-block-table[class*="is-style-comparison"] table { border-collapse: separate; border-spacing: 0; width: 100%; }
.wp-block-table[class*="is-style-comparison"] th, .wp-block-table[class*="is-style-comparison"] td { border: 0; border-bottom: 1px solid var(--wp--preset--color--border); padding: 0.75rem 0.6rem; text-align: center; vertical-align: middle; }
.wp-block-table[class*="is-style-comparison"] thead th, .wp-block-table[class*="is-style-comparison"] thead td { font-family: var(--wp--preset--font-family--dm-serif-display); font-weight: 400; font-size: var(--wp--preset--font-size--large); border-bottom: 0; }
.wp-block-table[class*="is-style-comparison"] th:first-child, .wp-block-table[class*="is-style-comparison"] td:first-child { text-align: left; }
.wp-block-table[class*="is-style-comparison"] thead { border: 0; }
.wp-block-table[class*="is-style-comparison"] tfoot { border: 0; }
.wp-block-table[class*="is-style-comparison"] tfoot td { border-bottom: 0; font-weight: 700; }
.wp-block-table.is-style-comparison-col-2 tr > :nth-child(2),
.wp-block-table.is-style-comparison-col-3 tr > :nth-child(3),
.wp-block-table.is-style-comparison-col-4 tr > :nth-child(4) { background: var(--wp--preset--color--surface); }
.wp-block-table.is-style-comparison-col-2 thead tr > :nth-child(2),
.wp-block-table.is-style-comparison-col-3 thead tr > :nth-child(3),
.wp-block-table.is-style-comparison-col-4 thead tr > :nth-child(4) { border-radius: 14px 14px 0 0; }
.wp-block-table.is-style-comparison-col-2 table > :last-child tr:last-child > :nth-child(2),
.wp-block-table.is-style-comparison-col-3 table > :last-child tr:last-child > :nth-child(3),
.wp-block-table.is-style-comparison-col-4 table > :last-child tr:last-child > :nth-child(4) { border-radius: 0 0 14px 14px; }
.bb-mark { display: inline-flex; line-height: 0; vertical-align: middle; }
.bb-mark--yes { color: var(--wp--preset--color--bb-pink); }
.bb-mark--no { color: var(--wp--preset--color--muted); opacity: 0.75; }
@media (max-width: 600px) { .wp-block-table[class*="is-style-comparison"] { overflow-x: auto; } .wp-block-table[class*="is-style-comparison"] table { min-width: 520px; } }

/* My Story chapters */
.bb-chapter { border-bottom: 1px solid var(--wp--preset--color--border); padding: 0.9rem 0; }
.bb-chapter:last-child { border-bottom: 0; }
.bb-numeral { font-family: var(--wp--preset--font-family--dm-serif-display); font-style: italic; color: var(--wp--preset--color--bb-pink); font-size: var(--wp--preset--font-size--x-large) !important; line-height: 1 !important; min-width: 2.5rem; }

/* Step number badge */
.bb-step-num { display: flex !important; width: 2rem; height: 2rem; border-radius: 999px; align-items: center; justify-content: center; background: var(--wp--preset--color--bb-pink); color: var(--wp--preset--color--bb-offwhite); font-weight: 700; font-size: 0.9rem !important; margin-left: auto !important; margin-right: auto !important; }

/* Video placeholder area for Plot Twist episodes */
.bb-video .wp-block-embed, .bb-video figure { margin: 0; }
.bb-video iframe { border-radius: 14px; }

.bb-muted { color: var(--wp--preset--color--muted); }
body:not(.editor-styles-wrapper) .bb-editor-hint { display: none; }
[class*="is-style-comparison"] tfoot a { display: inline-block; background: var(--wp--preset--color--bb-pink); color: var(--wp--preset--color--bb-offwhite) !important; text-decoration: none !important; border-radius: 999px; padding: 0.45rem 1rem; font-size: 0.85rem; font-weight: 700; white-space: nowrap; }
[class*="is-style-comparison"] tfoot a:hover { background: #A81E50; }

/* v1.1 fixes */
.bb-offer > .bb-offer__pill + * { margin-top: 0 !important; }
.bb-header .wp-block-site-title, .bb-header .wp-block-button__link { white-space: nowrap; }
.bb-header .wp-block-navigation { flex-shrink: 1; min-width: 0; }
.bb-video-wrap { background: var(--wp--preset--color--surface); border-radius: 14px; min-height: 240px; overflow: hidden; }
.bb-video-wrap:has(iframe) { background: none; min-height: 0; }
.bb-ml.is-layout-stacked .bb-ml-submit { width: 100%; }
.page-template-blank main, body.page-template-blank .wp-site-blocks > main { padding: 1.25rem var(--wp--preset--spacing--30); }

/* v1.2 page templates */
.bb-title-band .wp-block-post-title { margin-bottom: 0.4rem; }
.bb-band-subtitle { color: var(--wp--preset--color--eyebrow); }
.bb-band-subtitle .wp-block-post-excerpt__more-text { display: none; }
.bb-text-updated { margin-bottom: var(--wp--preset--spacing--40); }
