/*
Theme Name: MJ LIVE Commerce
Theme URI: https://mjlive.cc/
Author: MJ LIVE
Author URI: https://mjlive.cc/
Description: Mobile-first WooCommerce theme for MJ LIVE professional streaming equipment.
Version: 1.0.23
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 8.1
Text Domain: mjlive-commerce
*/

/*
 * MJ LIVE Gold Studio design system.
 * Loaded after the component styles so every WooCommerce surface receives
 * the same premium black-and-gold treatment without altering shop content.
 */
:root {
  --mj-primary: #c99a3d;
  --mj-primary-dark: #9b6c1f;
  --mj-primary-light: #241c0f;
  --mj-accent: #e6c66c;
  --mj-ink: #f6f0e2;
  --mj-bg: #070705;
  --mj-surface: #11100d;
  --mj-surface-raised: #181611;
  --mj-text: #f6f0e2;
  --mj-text-secondary: #b7ab93;
  --mj-border: #3a2f1b;
  --mj-danger: #c66b4f;
  --mj-success: #83a96c;
  --mj-gold-gradient: linear-gradient(135deg, #f0d684 0%, #c99a3d 48%, #a87520 100%);
  --mj-dark-gradient: linear-gradient(145deg, #191711 0%, #0c0b08 62%, #151107 100%);
  --mj-shadow: 0 18px 48px rgb(0 0 0 / 34%), 0 0 0 1px rgb(229 197 106 / 4%);
}

html { background: #070705; }
body {
  color: var(--mj-text);
  background:
    radial-gradient(circle at 8% 0%, rgb(185 132 38 / 9%), transparent 30rem),
    linear-gradient(180deg, #0d0c09 0%, #070705 34rem, #0a0907 100%);
}
::selection { color: #100e09; background: var(--mj-accent); }
a:hover { color: var(--mj-accent); }
:focus-visible { outline-color: color-mix(in srgb, var(--mj-accent) 72%, transparent); }

.mj-main,
.mj-home-main { color: var(--mj-text); }
.mj-content-surface,
.mj-home-section,
.mj-post-card,
.mj-empty-state {
  color: var(--mj-text);
  background: linear-gradient(145deg, #15130f, #0e0d0a);
  border-color: var(--mj-border);
  box-shadow: var(--mj-shadow);
}
.mj-page-header h1,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 { color: var(--mj-ink); }
.mj-page-description,
.entry-content p,
.entry-content li { color: var(--mj-text-secondary); }

.mj-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  color: #171107;
  background: var(--mj-gold-gradient);
  border-color: #e1bd62;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 38%), 0 7px 20px rgb(168 112 25 / 23%);
  text-shadow: 0 1px 0 rgb(255 255 255 / 20%);
}
.mj-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
  color: #0c0904;
  background: linear-gradient(135deg, #f6df93, #d5a94d 52%, #b88022);
  border-color: #f0d684;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 48%), 0 10px 28px rgb(185 132 38 / 34%);
}
.mj-button--light,
.mj-button--light:hover { color: #171107; background: var(--mj-gold-gradient); border-color: #e1bd62; }
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.wp-block-button__link,
.wc-block-components-button,
.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link {
  color: #171107;
  background: var(--mj-gold-gradient);
  border: 1px solid #e1bd62;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 38%), 0 7px 20px rgb(168 112 25 / 23%);
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover,
.wp-block-button__link:hover,
.wc-block-components-button:hover,
.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link:hover {
  color: #0c0904;
  background: linear-gradient(135deg, #f6df93, #d5a94d 52%, #b88022);
  border-color: #f0d684;
}
.woocommerce button.button:disabled,
.woocommerce button.button:disabled[disabled] { color: #625842; background: #2d281e; border-color: #4a402d; }
.mj-text-link,
.mj-section-header > a,
.mj-footer__link { color: var(--mj-accent); }
.mj-text-link:hover,
.mj-section-header > a:hover,
.mj-footer__link:hover { color: #ffe7a3; }

/* Header and navigation */
.mj-site-header {
  color: #f8edcf;
  background:
    linear-gradient(90deg, rgb(221 177 77 / 4%), transparent 34%, rgb(221 177 77 / 4%)),
    linear-gradient(180deg, #14130f 0%, #090908 100%);
  border-bottom: 1px solid #503d1d;
  box-shadow: 0 8px 30px rgb(0 0 0 / 46%);
}
.mj-topbar { color: #cdbf9f; background: #080806; border-bottom-color: rgb(229 197 106 / 18%); }
.mj-topbar__brand { color: var(--mj-accent); }
.mj-topbar a { color: #cfc2a5; }
.mj-topbar a:hover { color: #ffe7a3; }
.mj-logo,
.mj-logo:hover { color: var(--mj-accent); }
.mj-logo__official {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.mj-logo__official-mark,
.mj-logo__official-wordmark,
.woocommerce .mj-logo__official-mark,
.woocommerce .mj-logo__official-wordmark {
  display: block;
  width: auto;
  max-width: none;
  object-fit: contain;
  filter: drop-shadow(0 0 8px rgb(255 226 105 / 14%));
}
.mj-logo__official-mark,
.woocommerce .mj-logo__official-mark { height: 54px; }
.mj-logo__official-wordmark,
.woocommerce .mj-logo__official-wordmark { height: 23px; }
.mj-logo__mark {
  display: grid;
  width: 56px;
  height: 56px;
  flex: 0 0 56px;
  place-items: center;
  color: var(--mj-accent);
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.mj-logo__emblem {
  width: 100%;
  height: 100%;
  overflow: visible;
  filter: drop-shadow(0 0 8px rgb(229 197 106 / 18%));
}
.mj-logo__hex-outer { stroke-width: 3.4; }
.mj-logo__hex-inner { stroke-width: 1.4; opacity: .78; }
.mj-logo__monogram { stroke-width: 3.5; }
.mj-logo__wordmark {
  display: flex;
  min-width: 0;
  flex-direction: column;
  line-height: 1;
}
.mj-logo__wordmark strong {
  color: var(--mj-accent);
  background: linear-gradient(180deg, #f5dc8b, #c99433 72%);
  background-clip: text;
  font-size: 1.38rem;
  font-weight: 950;
  letter-spacing: .075em;
  white-space: nowrap;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.mj-logo__wordmark small {
  margin-top: 6px;
  color: #c9b985;
  font-size: .61rem;
  font-weight: 750;
  letter-spacing: .08em;
  white-space: nowrap;
}
.mj-logo--footer .mj-logo__mark {
  width: 50px;
  height: 50px;
  flex-basis: 50px;
}
.mj-product-search {
  background: #16140f;
  border: 1px solid #765925;
  box-shadow: inset 0 1px 10px rgb(0 0 0 / 36%), 0 5px 18px rgb(0 0 0 / 32%);
}
.mj-product-search__field { color: #f5ecd8; background: #11100d; }
.mj-product-search__field::placeholder { color: #827967; }
.mj-product-search__button { color: #171107; background: var(--mj-gold-gradient); }
.mj-product-search__button:hover { background: linear-gradient(135deg, #f6df93, #bd872b); }
.mj-hot-searches { color: #a89d86; }
.mj-hot-searches a:hover { color: var(--mj-accent); }
.mj-header-cart { color: var(--mj-accent); }
.mj-header-cart:hover { color: #ffe7a3; background: rgb(229 197 106 / 9%); }
.mj-cart-count { color: #120e07; background: var(--mj-accent); border-color: #161109; }
.mj-primary-nav { color: #e8ddc6; background: #0b0a08; border-color: #2e2618; }
.mj-primary-menu a::after { background: var(--mj-gold-gradient); box-shadow: 0 0 12px rgb(229 197 106 / 34%); }
.mj-primary-menu a:hover,
.mj-primary-menu .current-menu-item > a { color: var(--mj-accent); }
.mj-menu-toggle { color: var(--mj-accent); }
.mj-search-overlay { background: rgb(0 0 0 / 82%); }
.mj-search-overlay__panel { color: var(--mj-text); background: #14120e; border: 1px solid #5a441f; }
.mj-search-overlay__close { color: var(--mj-accent); }

/* Homepage hero and discovery */
.mj-home-hero { padding-top: 18px; }
.mj-hero-card {
  min-height: 430px;
  color: #fff8e7;
  background-image:
    linear-gradient(90deg, rgb(4 4 3 / 88%) 0%, rgb(7 6 4 / 72%) 38%, rgb(7 6 4 / 10%) 75%),
    url("assets/images/mjlive-gold-studio-hero-brand.jpg");
  background-position: center;
  background-size: cover;
  border: 1px solid #5d451d;
  box-shadow: 0 22px 54px rgb(0 0 0 / 46%), inset 0 0 0 1px rgb(229 197 106 / 5%);
}
.mj-hero-card.has-image::after { background: linear-gradient(90deg, rgb(3 3 2 / 88%), rgb(6 5 3 / 18%) 76%); }
.mj-hero-card__content { min-height: 430px; }
.mj-hero-card h1 { color: #f0ce72; text-shadow: 0 3px 22px rgb(0 0 0 / 72%); }
.mj-hero-card p { color: #e6dcc6; text-shadow: 0 2px 10px rgb(0 0 0 / 72%); }
.mj-eyebrow { color: var(--mj-accent); }
.mj-promo-card {
  color: #f7edd8;
  border: 1px solid #4c3a1e;
  box-shadow: var(--mj-shadow);
}
.mj-promo-card--audio {
  background: radial-gradient(circle at 82% 18%, rgb(229 197 106 / 16%), transparent 28%), linear-gradient(145deg, #242017, #0f0e0b 68%);
}
.mj-promo-card--service {
  background: radial-gradient(circle at 82% 18%, rgb(229 197 106 / 18%), transparent 26%), linear-gradient(145deg, #3b2b13, #12100a 70%);
}
.mj-promo-card span { color: var(--mj-accent); }
.mj-promo-card small { color: #b9ac91; }
.mj-shortcuts__track { background: #3a2f1b; border-color: #3a2f1b; box-shadow: var(--mj-shadow); }
.mj-shortcut { color: #e8dcc4; background: #11100d; }
.mj-shortcut:hover { color: var(--mj-accent); background: #1a160e; }
.mj-shortcut__icon { color: var(--mj-accent); background: #241c0f; border: 1px solid #493719; }
.mj-section-header h2 { color: #f0d17a; }
.mj-section-header p { color: var(--mj-text-secondary); }
.mj-category-card { color: #e8deca; }
.mj-category-card:hover { color: var(--mj-accent); background: #1a160e; border-color: #6a4d1e; }
.mj-category-card__image {
  background: radial-gradient(circle, #292114, #11100d 72%);
  border: 1px solid #40331d;
  box-shadow: inset 0 0 20px rgb(229 197 106 / 5%);
}
.mj-category-card__image img { filter: sepia(.72) saturate(.72) hue-rotate(350deg) brightness(.92) contrast(1.04); }
.mj-category-card small { color: #958a76; }
.mj-trust-section {
  color: #f8edcf;
  background: linear-gradient(112deg, #2c2212, #11100d 58%, #20180d);
  border: 1px solid #5d451d;
}
.mj-trust-section__heading { background: rgb(229 197 106 / 5%); }
.mj-trust-section__heading p { color: #b8aa8e; }
.mj-trust-item > span { color: var(--mj-accent); background: rgb(229 197 106 / 9%); }
.mj-products-coming { color: var(--mj-text-secondary); background: var(--mj-dark-gradient); border-color: #5d451d; }
.mj-products-coming > span { color: var(--mj-accent); background: #211a0f; }
.mj-products-coming h3 { color: #eadab8; }
.mj-store-card { color: var(--mj-text); background: var(--mj-dark-gradient); border-color: var(--mj-border); }
.mj-store-card__icon { color: var(--mj-accent); background: #241c0f; border: 1px solid #4f3b1b; }
.mj-service-card { color: #fff3d8; background: linear-gradient(145deg, #3e2d14, #16130c 68%); border: 1px solid #684c1e; }
.mj-service-card p { color: #c9bda5; }
.mj-service-card .mj-button { color: #171107; background: var(--mj-gold-gradient); border-color: #e1bd62; }

/* Product cards and shop archives */
.woocommerce ul.products li.product,
ul.products.mj-product-grid li.product {
  color: var(--mj-text);
  background: linear-gradient(160deg, #171510, #0d0c09);
  border-color: #3a2f1b;
  box-shadow: 0 8px 24px rgb(0 0 0 / 18%);
}
.woocommerce ul.products li.product:hover { border-color: #b8892e; box-shadow: 0 18px 36px rgb(0 0 0 / 42%), 0 0 22px rgb(185 132 38 / 10%); }
.woocommerce ul.products li.product a img { background: radial-gradient(circle, #27231b, #11100d 72%); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { color: #eee4d0; }
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price,
.woocommerce .woocommerce-Price-amount { color: var(--mj-accent); }
.woocommerce ul.products li.product .price del { color: #827968; }
.woocommerce ul.products li.product .button {
  color: #171107;
  background: var(--mj-gold-gradient);
  border-color: #d7ae51;
}
.woocommerce ul.products li.product .button:hover { color: #0c0904; background: linear-gradient(135deg, #f6df93, #bc8528); border-color: #f0d684; }
.mj-badge { color: #171107; background: var(--mj-gold-gradient); }
.mj-badge--featured { color: #f7ead0; background: #5b4521; }
.mj-badge--new { color: #eaf4df; background: #536a3f; }
.mj-badge--muted { color: #e5dcc9; background: #554f43; }
.mj-product-card__meta { color: #9e927c; }
.woocommerce .woocommerce-breadcrumb,
.woocommerce .woocommerce-breadcrumb a,
.woocommerce .woocommerce-result-count,
.term-description { color: var(--mj-text-secondary); }
.woocommerce-products-header { color: var(--mj-text); background: var(--mj-dark-gradient); border-color: var(--mj-border); box-shadow: var(--mj-shadow); }
.woocommerce .woocommerce-ordering select,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container--default .select2-selection--single,
.woocommerce .quantity .qty,
.woocommerce-cart table.cart td.actions .coupon .input-text {
  color: #eee4d0;
  background: #11100d;
  border-color: #55431f;
}
.woocommerce .woocommerce-ordering select option,
.woocommerce form .form-row select option { color: #eee4d0; background: #11100d; }
.select2-container--default .select2-selection--single .select2-selection__rendered { color: #eee4d0; }
.select2-dropdown { color: #eee4d0; background: #14120e; border-color: #55431f; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { color: #171107; background: var(--mj-accent); }
input[type="checkbox"],
input[type="radio"] { accent-color: var(--mj-primary); }
.mj-main input::placeholder,
.mj-main textarea::placeholder { color: #817764; }
.entry-content input:not([type="submit"]):not([type="button"]),
.entry-content textarea,
.entry-content select {
  color: #eee4d0;
  background: #11100d;
  border: 1px solid #55431f;
}
.woocommerce nav.woocommerce-pagination ul { border-color: var(--mj-border); }
.woocommerce nav.woocommerce-pagination ul li { border-color: var(--mj-border); }
.woocommerce nav.woocommerce-pagination ul li span.current { color: #171107; background: var(--mj-gold-gradient); }
.woocommerce-info,
.woocommerce-message,
.woocommerce-error { color: var(--mj-text); background: #15130f; border-color: var(--mj-border); border-top-color: var(--mj-primary); }
.woocommerce-message { border-top-color: var(--mj-success); }
.woocommerce-error { border-top-color: var(--mj-danger); }

/* Product detail */
.single-product div.product { color: var(--mj-text); background: var(--mj-dark-gradient); border-color: var(--mj-border); box-shadow: var(--mj-shadow); }
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper { background: #f2eee5; border-color: #5a4929; }
.woocommerce div.product div.images img { background: #f2eee5; }
.woocommerce div.product div.images .flex-control-thumbs img { background: #f2eee5; }
.woocommerce div.product .product_title { color: #f3e8cf; }
.woocommerce div.product p.price,
.woocommerce div.product span.price { background: linear-gradient(90deg, #2a2112, #14120d); border: 1px solid #4c3919; }
.woocommerce-product-details__short-description,
.woocommerce div.product .product_meta { color: var(--mj-text-secondary); }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--mj-text-secondary); }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--mj-accent); border-bottom-color: var(--mj-accent); }
.woocommerce div.product .woocommerce-tabs .panel { color: #c8bda8; }

/* Cart, checkout and account */
.woocommerce table.shop_table { color: var(--mj-text); background: #11100d; border-color: var(--mj-border); }
.woocommerce table.shop_table th { color: #c6b99e; background: #1c1811; }
.woocommerce table.shop_table th,
.woocommerce table.shop_table td { border-top-color: var(--mj-border); }
.woocommerce-cart table.cart img { background: #f2eee5; border-color: #5a4929; }
.woocommerce .cart-collaterals .cart_totals,
.woocommerce-checkout #customer_details,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout #order_review,
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
  color: var(--mj-text);
  background: var(--mj-dark-gradient);
  border-color: var(--mj-border);
  box-shadow: var(--mj-shadow);
}
.woocommerce form .form-row label { color: #ded2bb; }
.woocommerce-checkout #payment { color: var(--mj-text); background: #201a10; }
.woocommerce-checkout #payment div.payment_box { color: #d1c4ab; background: #12100c; }
.woocommerce-checkout #payment div.payment_box::before { border-bottom-color: #12100c; }
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a,
.woocommerce-account .woocommerce-MyAccount-navigation a:hover { color: var(--mj-accent); background: #281f10; }

/* WooCommerce blocks and WordPress content */
.wc-block-grid__product,
.wc-block-components-sidebar,
.wc-block-components-main,
.wc-block-components-totals-wrapper,
.wc-block-components-order-summary,
.wc-block-components-checkout-step {
  color: var(--mj-text);
  background: #11100d;
  border-color: var(--mj-border);
}
.wc-block-grid__product-title,
.wc-block-components-product-name,
.wc-block-components-title,
.wp-block-heading { color: #f1e5cb; }
.wc-block-grid__product-price,
.wc-block-components-product-price,
.wc-block-components-totals-item__value { color: var(--mj-accent); }
.wc-block-components-text-input input,
.wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input {
  color: #eee4d0;
  background: #11100d;
  border-color: #55431f;
}
.wp-block-table table,
.entry-content table { color: var(--mj-text); background: #11100d; border-color: var(--mj-border); }
.wp-block-table th,
.wp-block-table td,
.entry-content th,
.entry-content td { border-color: var(--mj-border); }
.entry-content blockquote { color: #d4c7ac; background: #17140e; border-left: 4px solid var(--mj-primary); }
.entry-content code,
.entry-content pre { color: #ebd69f; background: #090806; border: 1px solid #392d19; }

/* Footer and mobile chrome */
.mj-footer { color: #d7ccb6; background: linear-gradient(180deg, #11100d, #080806); border-top: 1px solid #47371d; }
.mj-footer h2 { color: var(--mj-accent); }
.mj-footer p,
.mj-footer-menu a { color: #a99e88; }
.mj-footer-menu a:hover,
.mj-footer__link:hover { color: #ffe8a5; }
.mj-footer__bottom { color: #817765; background: #050504; border-color: rgb(229 197 106 / 10%); }
.mj-mobile-nav { color: #a89d87; background: rgb(12 11 8 / 97%); border-color: #47371d; box-shadow: 0 -8px 24px rgb(0 0 0 / 42%); }
.mj-mobile-nav__item:hover,
.mj-mobile-nav__item:focus { color: var(--mj-accent); }

@media (max-width: 767px) {
	.mj-logo { gap: 4px; }
	.mj-logo__official { gap: 5px; }
	.mj-logo__official-mark,
	.woocommerce .mj-logo__official-mark { height: 31px; }
	.mj-logo__official-wordmark,
	.woocommerce .mj-logo__official-wordmark { height: 13px; }
	.mj-logo__mark { width: 30px; height: 30px; flex-basis: 30px; }
	.mj-logo__wordmark strong { font-size: .77rem; letter-spacing: .035em; }
	.mj-logo__wordmark small { display: none; }
  .mj-primary-nav.is-open { color: #e8ddc6; background: rgb(0 0 0 / 76%); }
  .mj-primary-nav.is-open .mj-container { background: #11100d; border: 1px solid #4e3c1f; }
  .mj-primary-nav.is-open .mj-primary-menu a:hover { color: var(--mj-accent); background: #241c0f; }
  .mj-hero-card {
    min-height: 300px;
    background-image:
      linear-gradient(90deg, rgb(4 4 3 / 92%) 0%, rgb(7 6 4 / 74%) 58%, rgb(7 6 4 / 28%) 100%),
      url("assets/images/mjlive-gold-studio-hero-brand.jpg");
    background-position: 66% center;
  }
  .mj-hero-card__content { min-height: 300px; }
  .mj-shortcuts__track { background: #11100d; border-bottom: 1px solid #352a18; }
  .mj-home-section { border-color: #2f2718; }
  .woocommerce .woocommerce-ordering { background: #0e0d0a; border-color: var(--mj-border); }
  .woocommerce table.shop_table_responsive tr,
  .woocommerce-page table.shop_table_responsive tr { background: #11100d; border-color: var(--mj-border); }
}