/*
Theme Name: Brainrot
Theme URI: https://brainrotcentral.com
Description: Neo-brutalist storefront theme for Brainrot Central. Child of Twenty Twenty-Five.
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.7
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: brainrot
*/

:root {
	--brc-ink: #121212;
	--brc-border: 3px solid var(--brc-ink);
	--brc-shadow: 6px 6px 0 var(--brc-ink);
	--brc-shadow-sm: 4px 4px 0 var(--brc-ink);
}

::selection { background: #D4FF3A; color: #121212; }

/* ---------- Buttons: press-down effect ---------- */
.wp-element-button,
.wp-block-button__link {
	transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.wp-element-button:hover,
.wp-block-button__link:hover {
	transform: translate(2px, 2px);
	box-shadow: 2px 2px 0 var(--brc-ink) !important;
}
.wp-element-button:active,
.wp-block-button__link:active {
	transform: translate(4px, 4px);
	box-shadow: none !important;
}
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: #fff;
	border: var(--brc-border);
	color: var(--brc-ink);
	box-shadow: var(--brc-shadow-sm);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: #D4FF3A; }

/* ---------- Announcement bar ---------- */
.brc-announce p { margin: 0; letter-spacing: .04em; }
.brc-announce strong { color: #D4FF3A; }

/* ---------- Header ---------- */
header.wp-block-template-part { position: sticky; top: 0; z-index: 50; }
.admin-bar header.wp-block-template-part { top: 32px; }
@media (max-width: 782px) { .admin-bar header.wp-block-template-part { top: 0; } }
.brc-header { border-bottom: var(--brc-border); }
.brc-header .wp-block-navigation-item__content:hover { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 6px; text-decoration-color: #FF3D8B; }
.brc-header .wc-block-mini-cart__badge { background: #FF3D8B; color: #121212; font-weight: 800; border: 2px solid #121212; }

/* ---------- Hero ---------- */
.brc-hero { border-bottom: var(--brc-border); position: relative; overflow: hidden; }
.brc-hero h1 { text-transform: uppercase; letter-spacing: -0.04em; line-height: .92; }
.brc-hero .brc-highlight {
	background: #FF3D8B;
	border: var(--brc-border);
	padding: 0 .15em;
	display: inline-block;
	transform: rotate(-2deg);
	box-shadow: var(--brc-shadow-sm);
}
.brc-sticker {
	display: inline-block;
	border: var(--brc-border);
	border-radius: 999px;
	background: #fff;
	padding: .35rem .9rem;
	font-weight: 700;
	box-shadow: var(--brc-shadow-sm);
	transform: rotate(-3deg);
}
.brc-hero-card {
	border: var(--brc-border);
	border-radius: 20px;
	box-shadow: 10px 10px 0 var(--brc-ink);
	transform: rotate(2deg);
	aspect-ratio: 1 / 1;
	display: flex !important;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
}
.brc-hero-card .brc-emoji { font-size: clamp(4rem, 12vw, 8rem); line-height: 1; margin: 0; }
.brc-hero-card .brc-stat { font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; text-transform: uppercase; }

/* ---------- Marquee ticker ---------- */
.brc-marquee {
	overflow: hidden;
	border-bottom: var(--brc-border);
	white-space: nowrap;
}
.brc-marquee p {
	display: inline-block;
	white-space: nowrap;
	text-wrap: nowrap; /* parent theme sets text-wrap: pretty, which overrides white-space */
	max-width: none !important;
	margin: 0;
	padding-left: 100%;
	animation: brc-scroll 38s linear infinite;
	font-family: "Bricolage Grotesque", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: .02em;
}
@keyframes brc-scroll { from { transform: translateX(0); } to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) {
	.brc-marquee p { animation: none; padding-left: 0; }
}

/* ---------- Section headings ---------- */
.brc-kicker {
	display: inline-block;
	background: #121212;
	color: #D4FF3A;
	padding: .2rem .7rem;
	border-radius: 6px;
	font-weight: 700;
	font-size: .8rem;
	letter-spacing: .1em;
	text-transform: uppercase;
	margin-bottom: 0 !important;
}

/* ---------- Product cards ---------- */
.wc-block-product-template .wc-block-product,
.wc-block-grid__product,
ul.products li.product {
	background: #fff;
	border: var(--brc-border);
	border-radius: 16px;
	box-shadow: var(--brc-shadow);
	padding: .85rem !important;
	transition: transform .15s ease, box-shadow .15s ease;
}
.wc-block-product-template .wc-block-product:hover,
ul.products li.product:hover {
	transform: translate(-3px, -3px) rotate(-.6deg);
	box-shadow: 10px 10px 0 var(--brc-ink);
}
.wc-block-product-template .wc-block-components-product-image img,
.wc-block-product-template .wc-block-components-product-image {
	border-radius: 10px;
	border: 2px solid var(--brc-ink);
	overflow: hidden;
}
.wc-block-product-template .wp-block-post-title { font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; }
.wc-block-product-template .wp-block-post-title a { text-decoration: none; }
.wc-block-components-product-price { font-weight: 800; }
.wc-block-components-product-sale-badge,
.onsale {
	background: #FF3D8B !important;
	color: #121212 !important;
	border: 2px solid #121212 !important;
	border-radius: 999px !important;
	font-weight: 800 !important;
}

/* Empty-state for the product grid */
.brc-empty {
	border: 3px dashed var(--brc-ink);
	border-radius: 20px;
	background: #fff;
}

/* ---------- Category tiles ---------- */
.brc-cat {
	border: var(--brc-border);
	border-radius: 18px;
	box-shadow: var(--brc-shadow);
	transition: transform .15s ease, box-shadow .15s ease;
	position: relative;
	min-height: 220px;
}
.brc-cat:hover { transform: translate(-3px, -3px) rotate(1deg); box-shadow: 10px 10px 0 var(--brc-ink); }
.brc-cat .brc-emoji { font-size: 3.5rem; line-height: 1; margin: 0; }
.brc-cat h3 a { text-decoration: none; }
.brc-cat h3 a::after { content: ""; position: absolute; inset: 0; }
.brc-cat .brc-arrow { font-weight: 800; margin: 0; }

/* ---------- Perks strip ---------- */
.brc-perk {
	border: var(--brc-border);
	border-radius: 16px;
	background: #fff;
	box-shadow: var(--brc-shadow-sm);
}
.brc-perk .brc-emoji { font-size: 2rem; line-height: 1; margin: 0; }

/* ---------- CTA band ---------- */
.brc-cta { border-top: var(--brc-border); border-bottom: var(--brc-border); }
.brc-cta h2 { text-transform: uppercase; letter-spacing: -0.03em; }

/* ---------- Footer ---------- */
.brc-footer a { color: inherit; text-decoration: none; }
.brc-footer a:hover { color: #D4FF3A; text-decoration: underline; }
.brc-footer .brc-footer-title { color: #D4FF3A; text-transform: uppercase; letter-spacing: .08em; font-size: .85rem; }
.brc-footer .brc-bigword {
	font-family: "Bricolage Grotesque", sans-serif;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: -0.05em;
	line-height: .8;
	color: #D4FF3A;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
}

/* ---------- Content pages (About, FAQ, policies) ---------- */
.brc-page-title {
	text-transform: uppercase;
	letter-spacing: -0.03em;
}
.brc-lead { font-weight: 600; }
.brc-muted { color: #5C5A55; }
.entry-content h2.wp-block-heading,
.wp-block-post-content h2.wp-block-heading { margin-top: 2.25rem; }
.wp-block-post-content h3.wp-block-heading {
	margin-top: 1.75rem;
	padding-left: .75rem;
	border-left: 6px solid #D4FF3A;
}

/* ---------- WooCommerce forms / notices ---------- */
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input,
.wc-blocks-components-select .wc-blocks-components-select__select,
.wc-block-components-textarea {
	border: 2px solid var(--brc-ink) !important;
	border-radius: 10px !important;
}
.wc-block-components-notice-banner { border: 2px solid var(--brc-ink); border-radius: 12px; }
.wc-block-cart .wc-block-cart__totals-title,
.wc-block-components-title { font-family: "Bricolage Grotesque", sans-serif; font-weight: 800; }
