/*
Theme Name:  Membership Manager
Theme URI:   https://example.com/membership-manager
Author:      Jeff Dale WB3ISP
Description: Dark, technical WordPress theme for the Membership Manager plugin. Built for Elementor.
Version:     1.0.0
Requires at least: 5.8
Tested up to: 6.5
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: mm-theme
Tags:        dark, one-column, full-width-template, custom-colors, custom-menu, elementor
*/

/* ═══ TOKENS ═══ */
:root {
  --mm-bg:#0d1117;--mm-bg2:#131920;--mm-bg3:#1a2332;
  --mm-border:#1e2d3d;--mm-text:#c9d1d9;--mm-muted:#6e7f8f;
  --mm-accent:#3fb950;--mm-accent2:#58a6ff;--mm-accent3:#f0883e;
  --mm-white:#f0f6fc;
  --mm-mono:'DM Mono','Courier New',monospace;
  --mm-serif:'DM Serif Display',Georgia,serif;
  --mm-sans:'DM Sans',system-ui,sans-serif;
  --mm-radius:6px;
}

/* ═══ RESET ═══ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;padding:0;background:var(--mm-bg);color:var(--mm-text);font-family:var(--mm-sans);font-size:1rem;line-height:1.7;overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;background-image:linear-gradient(var(--mm-border) 1px,transparent 1px),linear-gradient(90deg,var(--mm-border) 1px,transparent 1px);background-size:60px 60px;opacity:.22;pointer-events:none;z-index:0}
img{max-width:100%;height:auto;display:block}
a{color:var(--mm-accent2);text-decoration:none;transition:color .2s}
a:hover{color:var(--mm-white)}
h1,h2,h3,h4,h5,h6{font-family:var(--mm-serif);color:var(--mm-white);line-height:1.15;margin:0 0 1rem;font-weight:400}
p{margin:0 0 1.25rem}
code,pre{font-family:var(--mm-mono);background:var(--mm-bg2);border:1px solid var(--mm-border);border-radius:4px;font-size:.875em}
code{padding:2px 8px}
pre{padding:1.25rem;overflow-x:auto}

/* ═══ LAYOUT ═══ */
#page{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column}
#content{flex:1}
.site-main{padding:0}
.elementor-section-boxed>.elementor-container{max-width:1140px}

/* ═══ HEADER ═══ */
#masthead{position:sticky;top:0;z-index:9999;background:rgba(13,17,23,.93);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--mm-border);height:64px;display:flex;align-items:center}
.site-header-inner{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1200px;margin:0 auto;padding:0 2rem}
.site-branding{display:flex;align-items:center;gap:12px;text-decoration:none}
.signal-bars{display:flex;gap:3px;align-items:flex-end;height:20px}
.signal-bars .bar{width:3px;background:var(--mm-accent);border-radius:2px;animation:sigpulse 1.8s ease-in-out infinite}
.signal-bars .bar:nth-child(1){height:5px;animation-delay:0s}
.signal-bars .bar:nth-child(2){height:9px;animation-delay:.2s}
.signal-bars .bar:nth-child(3){height:14px;animation-delay:.4s}
.signal-bars .bar:nth-child(4){height:19px;animation-delay:.6s}
.signal-bars .bar:nth-child(5){height:14px;animation-delay:.8s}
.signal-bars .bar:nth-child(6){height:9px;animation-delay:1s}
@keyframes sigpulse{0%,100%{opacity:.25}50%{opacity:1}}
.site-title-text{font-family:var(--mm-mono);font-size:.85rem;color:var(--mm-accent);letter-spacing:.06em;font-weight:500}
.main-navigation{display:flex;align-items:center;gap:2rem}
.main-navigation ul{list-style:none;margin:0;padding:0;display:flex;gap:2rem}
.main-navigation ul li a{color:var(--mm-muted);font-size:.875rem;font-weight:500;letter-spacing:.02em;text-decoration:none;transition:color .2s}
.main-navigation ul li a:hover,.main-navigation ul li.current-menu-item>a{color:var(--mm-white)}
.nav-cta{font-family:var(--mm-mono)!important;font-size:.8rem!important;background:var(--mm-accent)!important;color:#0d1117!important;padding:8px 18px!important;border-radius:var(--mm-radius)!important;font-weight:500!important;letter-spacing:.04em!important;transition:all .2s!important;white-space:nowrap}
.nav-cta:hover{background:#4fca60!important;transform:translateY(-1px);box-shadow:0 4px 16px rgba(63,185,80,.3)}
.menu-toggle{display:none;background:none;border:1px solid var(--mm-border);color:var(--mm-text);padding:6px 10px;border-radius:4px;cursor:pointer;font-size:1.1rem}

/* ═══ FOOTER ═══ */
#colophon{background:var(--mm-bg2);border-top:1px solid var(--mm-border);padding:2.5rem 2rem}
.site-footer-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem}
.footer-copy{font-family:var(--mm-mono);font-size:.78rem;color:var(--mm-muted);margin:0}
.footer-copy a{color:var(--mm-accent2)}
.footer-copy a:hover{color:var(--mm-white)}
.footer-signal{font-family:var(--mm-mono);font-size:.68rem;color:rgba(63,185,80,.22);letter-spacing:.2em;text-transform:uppercase}

/* ═══ ELEMENTOR INTEGRATION ═══ */
.elementor-section,.elementor-container,.elementor-widget-wrap{position:relative;z-index:1}
.elementor-widget-heading .elementor-heading-title{font-family:var(--mm-serif);color:var(--mm-white)}
.elementor-widget-text-editor{color:var(--mm-text);font-family:var(--mm-sans)}
.elementor-button{font-family:var(--mm-mono)!important;letter-spacing:.04em!important;font-weight:500!important;border-radius:var(--mm-radius)!important;transition:all .2s!important}
.elementor-button:hover{transform:translateY(-2px)!important}

/* ═══ MM UTILITY CLASSES (apply in Elementor > CSS Classes) ═══ */
.mm-eyebrow{font-family:var(--mm-mono);font-size:.72rem;color:var(--mm-accent2);letter-spacing:.16em;text-transform:uppercase;display:block;margin-bottom:.75rem}
.mm-eyebrow-green{font-family:var(--mm-mono);font-size:.72rem;color:var(--mm-accent);letter-spacing:.16em;text-transform:uppercase;display:block;margin-bottom:.75rem}
.mm-version-badge{display:inline-block;font-family:var(--mm-mono);font-size:.75rem;color:var(--mm-accent);background:rgba(63,185,80,.1);border:1px solid rgba(63,185,80,.25);padding:5px 16px;border-radius:20px;letter-spacing:.1em}
.mm-feature-card{background:var(--mm-bg2);border:1px solid var(--mm-border);border-radius:var(--mm-radius);padding:2rem;transition:background .2s,border-color .2s,transform .2s}
.mm-feature-card:hover{background:var(--mm-bg3);border-color:#2a3d52;transform:translateY(-3px)}
.mm-status-card{background:var(--mm-bg2);border:1px solid var(--mm-border);border-radius:var(--mm-radius);padding:1.25rem 1.5rem;transition:border-color .2s}
.mm-status-card:hover{border-color:#2a3d52}
.mm-status-name{font-family:var(--mm-mono);font-size:.82rem;color:var(--mm-white);font-weight:500;margin-bottom:4px}
.mm-status-desc{font-size:.82rem;color:var(--mm-muted);line-height:1.5}
.mm-role-card{background:var(--mm-bg);border:1px solid var(--mm-border);border-radius:var(--mm-radius);padding:1.75rem;position:relative;overflow:hidden;transition:border-color .2s}
.mm-role-card:hover{border-color:#2a3d52}
.mm-role-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px}
.mm-role-card.admin::before{background:var(--mm-accent3)}
.mm-role-card.manager::before{background:var(--mm-accent2)}
.mm-role-card.member::before{background:var(--mm-accent)}
.mm-role-name{font-family:var(--mm-mono);font-size:.78rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem}
.mm-role-card.admin .mm-role-name{color:var(--mm-accent3)}
.mm-role-card.manager .mm-role-name{color:var(--mm-accent2)}
.mm-role-card.member .mm-role-name{color:var(--mm-accent)}
.mm-role-cap{display:flex;align-items:center;gap:8px;font-size:.82rem;color:var(--mm-muted);padding:6px 0;border-bottom:1px solid rgba(255,255,255,.04)}
.mm-role-cap:last-child{border-bottom:none}
.mm-cap-yes{color:var(--mm-accent);font-size:.8rem}
.mm-cap-no{color:#3a4a5a;font-size:.8rem}
.mm-cap-partial{color:var(--mm-accent2);font-size:.8rem}
.mm-shortcode-item{background:var(--mm-bg2);border:1px solid var(--mm-border);border-radius:var(--mm-radius);padding:1.25rem 1.5rem;transition:border-color .2s;margin-bottom:1rem}
.mm-shortcode-item:hover{border-color:#2a3d52}
.mm-shortcode-code{font-family:var(--mm-mono);font-size:.85rem;color:var(--mm-accent2);background:rgba(88,166,255,.08);border:1px solid rgba(88,166,255,.15);padding:4px 12px;border-radius:4px;display:inline-block;margin-bottom:.6rem}
.mm-shortcode-desc{font-size:.875rem;color:var(--mm-muted);line-height:1.6;margin:0}
.mm-version-block{background:var(--mm-bg2);border:1px solid var(--mm-border);border-radius:var(--mm-radius);overflow:hidden;margin-bottom:1rem}
.mm-version-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;padding:.9rem 1.5rem;background:var(--mm-bg3);border-bottom:1px solid var(--mm-border)}
.mm-version-num{font-family:var(--mm-mono);font-size:.9rem;color:var(--mm-accent);font-weight:500}
.mm-version-date{font-family:var(--mm-mono);font-size:.75rem;color:var(--mm-muted)}
.mm-version-latest{font-family:var(--mm-mono);font-size:.68rem;background:rgba(63,185,80,.15);color:var(--mm-accent);border:1px solid rgba(63,185,80,.3);padding:2px 10px;border-radius:20px;letter-spacing:.05em}
.mm-version-changes{padding:1.1rem 1.5rem;list-style:none;margin:0;display:flex;flex-direction:column;gap:8px}
.mm-version-changes li{font-size:.875rem;color:var(--mm-text);display:flex;align-items:flex-start;gap:10px;line-height:1.55}
.mm-change-tag{font-family:var(--mm-mono);font-size:.65rem;font-weight:500;padding:2px 8px;border-radius:3px;flex-shrink:0;margin-top:2px;text-transform:uppercase;letter-spacing:.05em}
.mm-tag-added{background:rgba(63,185,80,.15);color:var(--mm-accent)}
.mm-tag-fixed{background:rgba(248,81,73,.15);color:#f85149}
.mm-tag-changed{background:rgba(88,166,255,.15);color:var(--mm-accent2)}
.mm-stat-num{font-family:var(--mm-mono);font-size:2rem;color:var(--mm-white);display:block;line-height:1.1;margin-bottom:4px}
.mm-stat-label{font-size:.72rem;color:var(--mm-muted);letter-spacing:.1em;text-transform:uppercase}
.mm-bg-dark{background-color:var(--mm-bg)}
.mm-bg-dark2{background-color:var(--mm-bg2)}
.mm-bg-dark3{background-color:var(--mm-bg3)}
.mm-border-top{border-top:1px solid var(--mm-border)}
.mm-border-bottom{border-bottom:1px solid var(--mm-border)}
.mm-callsign-strip{font-family:var(--mm-mono);font-size:.7rem;color:rgba(63,185,80,.22);letter-spacing:.28em;text-align:center;padding:.85rem 0;border-top:1px solid var(--mm-border);border-bottom:1px solid var(--mm-border);background:var(--mm-bg2);overflow:hidden;white-space:nowrap;text-transform:uppercase}
.mm-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}
.mm-reveal.mm-visible{opacity:1;transform:translateY(0)}
.mm-cta-wrap{position:relative;overflow:hidden}
.mm-cta-wrap::before{content:'';position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(63,185,80,.07) 0%,transparent 65%);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:0}
.mm-download-info{font-family:var(--mm-mono);font-size:.72rem;color:var(--mm-muted);letter-spacing:.05em;margin-top:.75rem;display:block;text-align:center}

/* ═══ RESPONSIVE ═══ */
@media(max-width:768px){
  .main-navigation ul{display:none}
  .menu-toggle{display:block}
  .main-navigation.toggled ul{display:flex;flex-direction:column;position:absolute;top:64px;left:0;right:0;background:var(--mm-bg2);border-bottom:1px solid var(--mm-border);padding:1.5rem 2rem;gap:1rem;z-index:9998}
  .site-footer-inner{flex-direction:column;text-align:center}
}