/*
Theme Name: MJMI Base
Theme URI: https://hnmjmi.com
Author: MJMI Studio
Author URI: https://hnmjmi.com
Description: Custom theme for hnmjmi.com — luxury smoking accessories store. Gallery-noir design system (ink, espresso, paper white, brass accent) with configurable colors & fonts via Customizer. Full WooCommerce support, Elementor-ready shell, sticky header with live cart badge.
Version: 1.4.2
Requires at least: 6.0
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: mjmi
Tags: e-commerce, custom-colors, custom-logo, custom-menu, translation-ready
*/

/* =====================================================
   1. TOKENS (defaults; Customizer overrides via inline CSS)
   ===================================================== */
:root{
  --mjmi-ink:#1C1613;
  --mjmi-espresso:#241C15;
  --mjmi-accent:#B98A44;
  --mjmi-accent-light:#D9B878;
  --mjmi-paper:#F5F1EA;
  --mjmi-plate:#FDFCF9;
  --mjmi-line:#E5DCCF;
  --mjmi-muted:#8A8177;
  --mjmi-cream:#F5F1EA;
  --mjmi-cream-muted:#B9AE9F;
  --mjmi-display:'Bodoni Moda',Georgia,serif;
  --mjmi-body:'Inter',system-ui,sans-serif;
}

/* =====================================================
   2. BASE
   ===================================================== */
*{box-sizing:border-box}
body{margin:0;font-family:var(--mjmi-body);color:var(--mjmi-ink);background:var(--mjmi-paper);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--mjmi-display);font-weight:600;line-height:1.15;margin:0 0 .5em}
.mjmi-container{max-width:1200px;margin:0 auto;padding:0 24px}
.mjmi-eyebrow{font-size:11px;font-weight:600;letter-spacing:3.5px;text-transform:uppercase;color:var(--mjmi-accent)}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* =====================================================
   3. ANNOUNCEMENT BAR
   ===================================================== */
.mjmi-ann{background:var(--mjmi-espresso);color:#D9CFC0;text-align:center;padding:12px 40px;font-size:11px;font-weight:600;letter-spacing:2.2px;text-transform:uppercase}
.mjmi-ann a{color:var(--mjmi-accent-light);text-decoration:none}

/* =====================================================
   4. HEADER
   ===================================================== */
.mjmi-header{position:sticky;top:0;z-index:9999;background:var(--mjmi-plate);border-bottom:1px solid var(--mjmi-line)}
.mjmi-header.is-scrolled{box-shadow:0 6px 24px rgba(28,22,19,.07)}
.mjmi-header-in{max-width:1280px;margin:0 auto;padding:16px 32px;display:flex;align-items:center;gap:24px}
.mjmi-h-slot{display:flex;align-items:center;gap:8px;min-width:0}
.mjmi-h-left{flex:0 0 auto}
.mjmi-h-center{flex:1 1 auto;justify-content:center;min-width:0}
.mjmi-h-right{flex:0 0 auto;margin-left:auto;justify-content:flex-end}
.mjmi-h-slot>.mjmi-w{display:flex;align-items:center;gap:8px;min-width:0}
.mjmi-logo{display:flex;flex-direction:column;gap:2px;text-decoration:none}
.mjmi-logo img{max-height:var(--mjmi-logo-h,44px);width:auto;height:auto;display:block}
.mjmi-logo .mjmi-wordmark{font-family:var(--mjmi-display);font-weight:600;font-size:26px;letter-spacing:6px;color:var(--mjmi-ink);line-height:1}
.mjmi-logo .mjmi-tagline{font-size:8.5px;font-weight:600;letter-spacing:3.4px;color:var(--mjmi-accent);text-transform:uppercase}
.mjmi-nav{display:flex;align-items:center;gap:22px;flex-wrap:nowrap;min-width:0}
.mjmi-nav ul{display:flex;align-items:center;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:nowrap;white-space:nowrap}
.mjmi-nav a{font-size:14px;font-weight:500;color:#57504A;text-decoration:none;padding:6px 0;border-bottom:2px solid transparent;transition:.15s;white-space:nowrap}
.mjmi-nav a:hover,.mjmi-nav .current-menu-item>a{color:var(--mjmi-ink);border-bottom-color:var(--mjmi-accent)}
.mjmi-acts{display:flex;align-items:center;gap:12px}
.mjmi-acts a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;background:var(--mjmi-paper);color:var(--mjmi-ink);position:relative;text-decoration:none}
.mjmi-acts svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.mjmi-acts-inherit a{background:transparent;color:inherit}

/* =====================================================
   Widget areas (v1.3.0) — replaces slot system
   ===================================================== */
.mjmi-w-title{display:block;font-size:10.5px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--mjmi-muted);margin-bottom:6px}
.mjmi-fmenu ul{list-style:none;margin:0;padding:0}
.mjmi-fmenu li{padding:5.5px 0;font-size:13.5px}
.mjmi-fmenu a{text-decoration:none;color:inherit;opacity:.85}
.mjmi-fmenu a:hover{opacity:1}
.mjmi-f-contact{font-size:12.5px;line-height:2;white-space:pre-line}
.mjmi-f-contact a{color:var(--mjmi-accent-light);text-decoration:underline}
.mjmi-f-news p{font-size:13.5px;line-height:1.7;margin:0 0 14px;color:#B9AE9F}
.mjmi-f-form{display:flex;gap:10px;flex-wrap:wrap}
.mjmi-f-form input{flex:1;min-width:0;padding:12px 16px;border:1px solid #3A362F;border-radius:999px;background:#2A221B;color:#fff;font-size:13px;outline:none;font-family:var(--mjmi-body)}
.mjmi-f-form button{white-space:nowrap;background:var(--mjmi-accent);color:#1C1613;border-radius:999px;padding:12px 24px;font-size:13px;font-weight:600;border:0;cursor:pointer;font-family:var(--mjmi-body)}
.mjmi-f-form button:hover{background:var(--mjmi-accent-light)}
/* v1.4.1: mailto fallback line under the newsletter form */
.mjmi-f-news-alt{font-size:11px;line-height:1.7;color:#8A8177;margin:10px 0 0}
.mjmi-f-news-alt a{color:var(--mjmi-accent-light);text-decoration:underline}
.mjmi-f-news-alt a:hover{color:#fff}
.mjmi-text-w{font-size:13.5px;line-height:1.8;color:#B9AE9F}
.mjmi-text-w p{margin:0 0 10px}
.mjmi-social{display:flex;flex-wrap:wrap;gap:12px}
.mjmi-social a{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:999px;background:rgba(255,255,255,.06);color:#B9AE9F;text-decoration:none;transition:.15s}
.mjmi-social a:hover{background:var(--mjmi-accent);color:#1C1613}
.mjmi-social svg{width:16px;height:16px}
/* v1.4.0: Payment icons widget (footer, under contact block) */
.mjmi-pay{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mjmi-pay img{display:block;border-radius:4px}
.mjmi-social-ink a{background:#1C1A18;color:#B9AE9F;border:1px solid rgba(255,255,255,.1)}
.mjmi-cart-btn{background:var(--mjmi-ink)!important;color:var(--mjmi-cream)!important}
.mjmi-cart-count{position:absolute;top:-6px;right:-8px;min-width:16px;height:16px;border-radius:999px;background:var(--mjmi-accent);color:#fff;font-size:9.5px;font-weight:700;line-height:16px;text-align:center;padding:0 4px;display:none}
.mjmi-cart-count.is-on{display:block}
.mjmi-burger{display:none;cursor:pointer;background:none;border:0;padding:6px}
.mjmi-burger svg{width:24px;height:24px;stroke:var(--mjmi-ink);stroke-width:1.8;fill:none;stroke-linecap:round}
.mjmi-m{display:none}
#mjmi-nav-toggle:checked ~ .mjmi-m{display:block;background:var(--mjmi-plate);border-bottom:1px solid var(--mjmi-line)}
.mjmi-m a{display:block;padding:14px 24px;font-size:15px;font-weight:500;color:var(--mjmi-ink);text-decoration:none;border-top:1px solid var(--mjmi-paper)}
@media (max-width:960px){
  .mjmi-nav{display:none}
  .mjmi-burger{display:inline-flex}
  .mjmi-h-center{flex:1 1 auto;justify-content:flex-end}
}

/* =====================================================
   5. SHELL / FRONT PAGE FALLBACK
   ===================================================== */
.mjmi-page-full{width:100%}
.mjmi-entry{max-width:820px;margin:0 auto;padding:56px 24px}
.mjmi-entry h1{font-size:40px}
.mjmi-entry h2{font-size:28px;margin-top:1.4em}
.mjmi-entry p,.mjmi-entry li{font-size:15.5px;line-height:1.8;color:#4A443C}
.mjmi-entry a{color:var(--mjmi-ink);font-weight:600}
.mjmi-admin-tip{max-width:820px;margin:60px auto;padding:32px;background:var(--mjmi-plate);border:1px dashed var(--mjmi-accent);border-radius:6px;font-size:14px;line-height:1.8}
.mjmi-admin-tip strong{font-family:var(--mjmi-display);font-size:20px;display:block;margin-bottom:8px}

/* =====================================================
   6. BUTTONS
   ===================================================== */
.mjmi-btn{display:inline-block;padding:15px 32px;border-radius:999px;font-size:15px;font-weight:600;text-decoration:none;cursor:pointer;border:0;transition:.15s;font-family:var(--mjmi-body)}
.mjmi-btn-accent{background:var(--mjmi-accent);color:#fff}
.mjmi-btn-accent:hover{background:var(--mjmi-accent-light);color:var(--mjmi-ink)}
.mjmi-btn-ink{background:var(--mjmi-ink);color:var(--mjmi-cream)}
.mjmi-btn-ink:hover{background:var(--mjmi-espresso)}
.mjmi-btn-ghost{background:transparent;color:var(--mjmi-ink);border:1px solid var(--mjmi-ink)}
.mjmi-btn-ghost:hover{background:var(--mjmi-ink);color:var(--mjmi-cream)}

/* =====================================================
   7. WOOCOMMERCE
   ===================================================== */
.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(4,1fr);gap:22px;list-style:none;margin:0 0 32px;padding:0}
/* v1.1.2 FIX: WooCommerce core clearfix pseudo-elements (::before/::after) become
   empty grid items when ul.products is forced to display:grid — ::before occupied
   the first cell of row 1, ::after added a phantom cell after the last product.
   Remove them and neutralize legacy first/last float helpers. */
.woocommerce ul.products::before,.woocommerce ul.products::after,
.woocommerce-page ul.products::before,.woocommerce-page ul.products::after{content:none!important;display:none!important}
.woocommerce ul.products li.product.first,.woocommerce ul.products li.product.last,
.woocommerce-page ul.products li.product.first,.woocommerce-page ul.products li.product.last{margin:0!important;clear:none!important;float:none!important}
/* Subcategory tiles (if "show subcategories" is enabled) join the same grid */
.woocommerce ul.products li.product-category{background:var(--mjmi-plate);border:1px solid var(--mjmi-line);border-radius:2px;padding:0;margin:0!important;width:100%!important;float:none!important}
.woocommerce ul.products li.product-category h2{font-family:var(--mjmi-body);font-size:14.5px;font-weight:600;color:var(--mjmi-ink);padding:14px 18px;margin:0}
.woocommerce ul.products li.product-category img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#fff;margin:0}
@media (max-width:960px){.woocommerce ul.products{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.woocommerce ul.products{grid-template-columns:1fr}}
.woocommerce ul.products li.product{background:var(--mjmi-plate);border:1px solid var(--mjmi-line);border-radius:2px;padding:0;margin:0!important;width:100%!important;float:none!important;display:flex;flex-direction:column}
.woocommerce ul.products li.product .woocommerce-loop-product__link{display:flex;flex-direction:column;flex:1;text-decoration:none;padding-bottom:16px}
.woocommerce ul.products li.product img{width:100%;aspect-ratio:1/1;object-fit:cover;background:#fff;margin:0}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--mjmi-body);font-size:14.5px;font-weight:600;color:var(--mjmi-ink);padding:14px 18px 2px}
.woocommerce ul.products li.product .price{font-family:var(--mjmi-display);font-size:17px;font-weight:600;color:var(--mjmi-ink);padding:0 18px}
.woocommerce ul.products li.product .button{margin:12px 18px 0;background:transparent;border:1px solid var(--mjmi-ink);color:var(--mjmi-ink);border-radius:999px;font-weight:600;padding:10px 20px;text-align:center}
.woocommerce ul.products li.product .button:hover{background:var(--mjmi-ink);color:var(--mjmi-cream)}
.woocommerce ul.products li.product .onsale{background:var(--mjmi-accent);color:#fff;font-weight:700;border-radius:999px;padding:5px 12px;font-size:11px;letter-spacing:1px;top:12px;left:12px;margin:0}
.woocommerce .woocommerce-result-count,.woocommerce .woocommerce-ordering{font-size:13px;color:var(--mjmi-muted)}
.woocommerce .woocommerce-ordering select{border:1px solid var(--mjmi-line);border-radius:999px;padding:9px 14px;background:var(--mjmi-paper);font-family:var(--mjmi-body);font-size:13px}
.mjmi-shop-head{background:var(--mjmi-espresso);padding:56px 24px;text-align:center}
.mjmi-shop-head h1{color:var(--mjmi-cream);font-size:42px;margin:0 0 8px}
.mjmi-shop-head p{color:var(--mjmi-cream-muted);margin:0;font-size:15px}
.woocommerce-pagination ul{display:flex;gap:8px;justify-content:center;list-style:none;padding:0}
.woocommerce-pagination a,.woocommerce-pagination span{display:inline-block;min-width:40px;height:40px;line-height:40px;border-radius:999px;border:1px solid var(--mjmi-line);background:var(--mjmi-plate);text-align:center;text-decoration:none;color:var(--mjmi-ink);font-size:14px}
.woocommerce-pagination .current{background:var(--mjmi-ink);color:var(--mjmi-cream);border-color:var(--mjmi-ink)}
.woocommerce div.product .product_title{font-size:36px}
.woocommerce div.product p.price{font-family:var(--mjmi-display);font-size:26px;color:var(--mjmi-ink)}
.woocommerce div.product form.cart .button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{background:var(--mjmi-accent)!important;color:#fff!important;border-radius:999px!important;font-weight:600!important;padding:14px 30px!important;border:0;font-family:var(--mjmi-body)!important}
.woocommerce a.button:hover,.woocommerce button.button:hover{background:var(--mjmi-accent-light)!important;color:var(--mjmi-ink)!important}
.woocommerce .woocommerce-message{border-top-color:var(--mjmi-accent);background:var(--mjmi-plate)}
.woocommerce .woocommerce-info{border-top-color:var(--mjmi-accent)}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{border:1px solid var(--mjmi-line);border-radius:8px;padding:12px;background:#fff;font-family:var(--mjmi-body)}
.select2-container--default .select2-selection--single{border:1px solid var(--mjmi-line)!important;border-radius:8px!important;height:44px!important;padding-top:6px}

/* =====================================================
   8. FOOTER (v1.3.0 — widget areas)
   ===================================================== */
.mjmi-footer{background:var(--mjmi-ink);color:#B9AE9F;margin-top:0}
.mjmi-footer a{color:#B9AE9F;text-decoration:none;transition:.15s}
.mjmi-footer a:hover{color:var(--mjmi-accent-light)}
.mjmi-footer-in{max-width:1280px;margin:0 auto;padding:64px 32px 28px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1.3fr;gap:48px;align-items:start}
.mjmi-f-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.mjmi-f-col h4{font-family:var(--mjmi-display);font-size:17px;color:#fff;margin:0 0 8px;font-weight:600}
.mjmi-f-col-1 .mjmi-logo .mjmi-wordmark{font-family:var(--mjmi-display);font-weight:600;font-size:26px;color:#fff;letter-spacing:6px;line-height:1;display:block;margin-bottom:6px}
.mjmi-f-col-1 .mjmi-logo .mjmi-tagline{font-size:8.5px;font-weight:600;letter-spacing:3.4px;color:var(--mjmi-accent);text-transform:uppercase;display:block;margin-bottom:14px}
/* v1.4.0: cap raised 60→120px so the widget's own size setting is never clipped here. */
/* v1.4.2: anchor the footer brand link to the column's left edge; logo width is now the
   primary dimension (set by the widget), so we stop constraining max-height here. */
.mjmi-f-col-1 .mjmi-logo{align-items:flex-start;align-self:flex-start;text-align:left;justify-content:flex-start;width:auto}
.mjmi-f-col-1 .mjmi-logo img{max-height:none;width:auto;height:auto;display:block;margin-bottom:14px;object-fit:contain}
.mjmi-footer ul{list-style:none;margin:0;padding:0}
.mjmi-footer li{padding:5.5px 0;font-size:13.5px}
@media (max-width:900px){.mjmi-footer-in{grid-template-columns:1fr 1fr;padding-bottom:24px}}
@media (max-width:560px){.mjmi-footer-in{grid-template-columns:1fr;gap:32px;padding-bottom:20px}}
/* v1.3.0: the bottom strip is part of the same footer block — no gap between columns and copyright. */
.mjmi-f-bot{border-top:1px solid rgba(255,255,255,.1);background:var(--mjmi-ink)}
.mjmi-f-bot-in{max-width:1280px;margin:0 auto;padding:18px 32px 22px;text-align:center}
.mjmi-f-bot p{margin:0 0 6px;font-size:11.5px;line-height:1.8;color:#7C756B}
.mjmi-f-bot .mjmi-fine{font-size:10.5px;line-height:1.8;color:#5C5248}
.mjmi-copyright-w{display:block}

/* Elementor pages: no default bottom padding gap */
.elementor-page .mjmi-site-main{padding:0!important}

/* =====================================================
   9. SHOP LAYOUT (v1.1) — filter rail + grid
   ===================================================== */
.mjmi-shop-layout{display:grid;grid-template-columns:264px 1fr;gap:40px;padding-top:40px;padding-bottom:72px;align-items:start}
@media (max-width:960px){.mjmi-shop-layout{grid-template-columns:1fr}}
.mjmi-shop-filters{position:sticky;top:110px;display:flex;flex-direction:column;gap:0}
@media (max-width:960px){.mjmi-shop-filters{position:static}}
.mjmi-fgroup{background:var(--mjmi-plate);border:1px solid var(--mjmi-line);border-radius:2px;padding:20px 22px;margin-bottom:16px}
.mjmi-fgroup h4{font-family:var(--mjmi-body);font-size:11.5px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:#57504A;margin:0 0 14px}
.mjmi-chips{display:flex;flex-wrap:wrap;gap:8px}
.mjmi-chip{display:inline-block;background:var(--mjmi-paper);border:1px solid var(--mjmi-line);border-radius:999px;padding:6px 14px;font-size:12px;color:var(--mjmi-ink);text-decoration:none}
.mjmi-chip:hover{border-color:var(--mjmi-accent);color:var(--mjmi-accent)}
.mjmi-chip-none{background:transparent;color:var(--mjmi-muted)}
.mjmi-catfilter{list-style:none;margin:0;padding:0}
.mjmi-catfilter li{margin:0}
.mjmi-catfilter a{display:flex;justify-content:space-between;align-items:center;padding:8px 2px;font-size:14px;color:#4A443C;text-decoration:none;border-bottom:1px solid var(--mjmi-paper)}
.mjmi-catfilter li:last-child a{border-bottom:0}
.mjmi-catfilter a:hover{color:var(--mjmi-ink)}
.mjmi-catfilter a.is-active{color:var(--mjmi-accent);font-weight:600}
.mjmi-catcount{font-size:11.5px;color:var(--mjmi-muted);background:var(--mjmi-paper);border-radius:999px;padding:2px 9px}
.mjmi-pricerow{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.mjmi-pricerow input{width:100%;padding:10px 12px;border:1px solid var(--mjmi-line);border-radius:8px;font-family:var(--mjmi-body);font-size:13px;background:#fff}
.mjmi-priceapply{width:100%;text-align:center;padding:11px 0!important;font-size:13.5px}
.mjmi-filter-help{font-size:12.5px;line-height:1.7;color:var(--mjmi-muted);background:var(--mjmi-paper);border:1px dashed var(--mjmi-line)}
.mjmi-widgets .widget{margin-bottom:0}
.mjmi-widgets select,.mjmi-widgets input[type=number]{border:1px solid var(--mjmi-line);border-radius:8px;padding:8px 10px;width:100%;font-family:var(--mjmi-body);font-size:13px}
.mjmi-widgets .widget-title{font-family:var(--mjmi-body);font-size:11.5px;font-weight:600;letter-spacing:2.5px;text-transform:uppercase;color:#57504A;margin:0 0 14px}
.mjmi-shop-toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;background:var(--mjmi-plate);border:1px solid var(--mjmi-line);border-radius:2px;padding:14px 20px;margin-bottom:26px}
.mjmi-shop-toolbar .woocommerce-result-count{margin:0;font-size:13px}
.mjmi-sortform{display:flex;align-items:center;gap:10px;font-size:13px;color:#57504A}
.mjmi-sortform select{padding:9px 14px;border:1px solid var(--mjmi-line);border-radius:999px;background:var(--mjmi-paper);font-family:var(--mjmi-body);font-size:13px;color:var(--mjmi-ink);outline:none;cursor:pointer}
.mjmi-has-shop-sidebar .woocommerce ul.products{grid-template-columns:repeat(3,1fr)}