/*
Theme Name: MuseD
Theme URI: https://muse-d.com
Author: MuseD
Description: Muse D Studio — custom grillz & tooth gems by Dr. Rachelle Kanaan. Collections showcase, Grillz request builder and Gems designer with photo try-on. Built as a block theme with editable header/footer and requests saved to the dashboard.
Version: 3.8.5.3
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mused
*/

/* ------------------------------------------------------------------
   WordPress glue for the Studio design (app styles: assets/css/studio.css)
   ------------------------------------------------------------------ */

/* Remove the default gaps WordPress adds between header / main / footer */
.wp-site-blocks > * + * { margin-block-start: 0 !important; }
.wp-site-blocks { padding: 0 !important; }

/* Sticky brand bar (the header template part) */
.wp-site-blocks > header.wp-block-template-part { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 50; }
.brandbar { margin: 0 !important; }
.brandbar > .in { max-width: 1180px; margin: 0 auto; }
.brandbar .wp-block-site-logo { line-height: 0; margin: 0; }
.brandbar .wp-block-site-logo img { height: var(--mused-logo-h, 84px) !important; width: auto !important; max-width: none; }

/* Header navigation styled as the Studio tabs */
.brandbar .wp-block-navigation { gap: 8px !important; }
.brandbar .wp-block-navigation .wp-block-navigation__container { gap: 8px; }
.brandbar .wp-block-navigation-item__content {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px !important;
	border-radius: 9999px; border: 1px solid color-mix(in srgb, var(--pink) 50%, transparent);
	color: var(--ink) !important; text-decoration: none !important;
	font-weight: 800; font-size: 13px; letter-spacing: .08em; text-transform: uppercase;
}
.brandbar .wp-block-navigation-item__content:hover { border-color: var(--pink); color: var(--ink) !important; }
.brandbar .wp-block-navigation-item__content[aria-current="page"],
.brandbar .current-menu-item > .wp-block-navigation-item__content { background: var(--pink); color: var(--dark) !important; border-color: var(--pink); }
@media (pointer: coarse) { .brandbar .wp-block-navigation-item__content { min-height: 48px; } }

/* Footer template part */
.studio-footer p { margin: 0; }

/* Tablet / desktop: one screen, no page scroll */
@media (min-width: 700px) and (min-height: 560px) {
	.brandbar > .in { max-width: 1400px; padding-top: max(8px, env(safe-area-inset-top)) !important; padding-bottom: 8px !important; }
	.brandbar .wp-block-site-logo img { height: var(--mused-logo-h-tab, 60px) !important; }
}
@media (max-width: 640px) { .brandbar .wp-block-site-logo img { height: var(--mused-logo-h-mob, 64px) !important; } }

/* Simple content pages (privacy, blog posts, etc.) */
.studio-page { max-width: 760px; margin: 0 auto; padding: 48px 24px 72px; }
.studio-page h1, .studio-page h2, .studio-page h3 { font-family: var(--font-head); font-weight: 500; }
.studio-page img { max-width: 100%; height: auto; border-radius: 12px; }

/* Form feedback (added by assets/js/studio.js) */
.send-msg { font-size: 14px; color: var(--lime); }
.send-msg.bad { color: var(--pink); }
.cta[disabled] { opacity: .6; cursor: progress; }
.hp-field { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Gems submit bar: name + phone fields */
.p-gbar .tbar { flex-wrap: wrap; gap: 8px; max-width: 100%; }
@media (max-width: 1000px) { .p-gbar #mName, .p-gbar #mPhone { width: 130px !important; } }
@media (max-width: 699px) {
	.p-gbar .tbar { flex: 1 1 100% !important; }
	.p-gbar #mName, .p-gbar #mPhone { flex: 1 1 140px; width: auto !important; min-width: 0; }
	.p-gbar #mSubmit { flex: 1 1 100%; }
}

/* Text colours (Appearance → Text & Fonts) */
h1, h2, h3, h4, .serif, .lp-title, .fd-name, .jm-head h3, .jm-name, .jm-modal h3, .col h3, .card h2, .card h3 { color: var(--head); }
.col h3 { color: inherit; } /* collection cards keep their own colours */

/* Top menu colours (Appearance → Text & Fonts → Top menu) */
body .lp-nav .wp-block-navigation-item__content,
body .brandbar .wp-block-navigation-item__content { color: var(--menu, var(--ink)) !important; }
body .lp-nav .wp-block-navigation-item__content:hover,
body .lp-nav .wp-block-navigation-item__content.is-active { color: var(--menu-hover, var(--pink)) !important; }
body .lp-nav .wp-block-navigation-item__content::after { background: var(--menu-hover, var(--pink)) !important; }
body .brandbar .wp-block-navigation-item__content:hover { color: var(--menu-hover, var(--pink)) !important; border-color: var(--menu-hover, var(--pink)) !important; }
body .brandbar .wp-block-navigation-item__content[aria-current="page"],
body .brandbar .current-menu-item > .wp-block-navigation-item__content { background: var(--menu-hover, var(--pink)) !important; border-color: var(--menu-hover, var(--pink)) !important; color: var(--dark) !important; }
body .lp-nav .wp-block-navigation__responsive-container-open,
body .lp-nav .wp-block-navigation__responsive-container-close { color: var(--menu, var(--ink)) !important; }
