/* ==========================================================================
   DailyCoin — New header (desktop + mobile off-canvas menu)
   Added 2026-06-26. Ported from the standalone prototype (header-redesign.html).

   Scope: this file owns the NEW .site-header / .top-strip / .mobile-panel
   markup that now lives in framework/modules/header/templates/types/header-type1.php.

   It also explicitly hides the two pieces of the old header system that
   would otherwise render alongside it:
     - .mkd-mobile-header   (the old "mobile header reused as desktop header
                              via CSS" hack, framework/modules/header/templates/types/mobile-header.php)
     - .top-bar.mkd-top-bar (the old utility strip, templates/parts/header-top.php)

   ROLLBACK: removing the two wp_enqueue_style/script calls for this file's
   handle in functions.php (search "header-redesign") fully reverts the
   visual change without touching any other CSS/PHP.
   ========================================================================== */

.mkd-mobile-header,
.top-bar.mkd-top-bar {
  display: none !important;
}

:root{
    --bg:#0a0d13;
    --bg-elevated:#10141d;
    --bg-elevated-2:#161b27;
    --border:rgba(255,255,255,0.08);
    --text:#f4f5f8;
    --text-dim:#8d93a3;
    --accent:#f7be23;
    --accent-dim:#b9911c;
    --radius:10px;
    --header-h:76px;
    --header-h-compact:60px;
    --topstrip-h:34px;
}
.site-header,.site-header *{box-sizing:border-box;}
.site-header a,.top-strip a,.mobile-panel a{color:inherit;text-decoration:none;}
.site-header ul,.top-strip ul,.mobile-panel ul{list-style:none;margin:0;padding:0;}
.site-header button,.mobile-panel button{font-family:inherit;}

/* ============ TOP UTILITY STRIP ============ */
.top-strip{
    height:var(--topstrip-h);
    background:#05060a;
    border-bottom:1px solid var(--border);
    display:flex;align-items:center;
    overflow:hidden;
    transition:height .25s ease, opacity .25s ease;
    font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
.top-strip__inner{
    max-width:1320px;width:100%;margin:0 auto;padding:0 24px;
    display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.top-strip__links{display:flex;align-items:center;gap:20px;}
.top-strip__links a{
    font-size:12.5px;color:var(--text-dim);letter-spacing:.2px;
    transition:color .15s ease;white-space:nowrap;
}
.top-strip__links a:hover{color:var(--accent);}
.top-strip__right{display:flex;align-items:center;gap:18px;}
.lang-toggle{
    display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--text-dim);
    cursor:pointer;transition:color .15s ease;
}
.lang-toggle:hover{color:var(--text);}
.lang-flag{width:16px;height:16px;border-radius:50%;overflow:hidden;display:inline-flex;font-size:11px;align-items:center;justify-content:center;background:#c60b1e;color:#fff;}
.social-row{display:flex;align-items:center;gap:14px;}
.social-row a{
    width:16px;height:16px;display:flex;align-items:center;justify-content:center;
    color:var(--text-dim);transition:color .15s ease,transform .15s ease;
}
.social-row a:hover{color:var(--accent);transform:translateY(-1px);}
.social-row svg{width:100%;height:100%;}

body.is-stuck .top-strip{height:0;opacity:0;border-bottom-color:transparent;}

/* ============ MAIN HEADER ============ */
.site-header{
    position:sticky;top:0;z-index:1000;
    background:rgba(10,13,19,.72);
    backdrop-filter:blur(14px) saturate(140%);
    -webkit-backdrop-filter:blur(14px) saturate(140%);
    border-bottom:1px solid transparent;
    transition:border-color .25s ease, box-shadow .25s ease;
    font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
body.is-stuck .site-header{
    border-bottom-color:var(--border);
    box-shadow:0 12px 30px -10px rgba(0,0,0,.55);
}
.header-inner{
    max-width:1320px;margin:0 auto;padding:0 24px;
    height:var(--header-h);
    display:flex;align-items:center;gap:32px;
    transition:height .25s ease;
}
body.is-stuck .header-inner{height:var(--header-h-compact);}

.site-header .logo,.mobile-panel .logo{display:flex;align-items:center;flex-shrink:0;}
.site-header .logo svg,.mobile-panel .logo svg{height:28px;width:auto;display:block;transition:height .25s ease;}
body.is-stuck .site-header .logo svg{height:23px;}

/* ---- Primary nav ---- */
.primary-nav{flex:1;display:flex;align-items:center;height:100%;}
.primary-nav>ul{display:flex;align-items:center;height:100%;gap:4px;}
.primary-nav>ul>li{position:relative;height:100%;display:flex;align-items:center;}
.nav-link{
    display:flex;align-items:center;gap:6px;height:100%;padding:0 14px;
    font-size:14px;font-weight:600;letter-spacing:.2px;color:var(--text);
    position:relative;cursor:pointer;white-space:nowrap;
}
.nav-link::after{
    content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;
    background:var(--accent);transform:scaleX(0);transform-origin:left;
    transition:transform .2s ease;
}
.nav-link:hover{color:var(--accent);}
.nav-link:hover::after,
li.is-open .nav-link::after{transform:scaleX(1);}
.nav-link .chev{width:9px;height:9px;flex-shrink:0;transition:transform .2s ease;opacity:.6;}
li.is-open .nav-link .chev{transform:rotate(180deg);opacity:1;}

/* dropdown / mega panel */
.mega{
    position:absolute;top:100%;left:0;min-width:220px;
    background:var(--bg-elevated);border:1px solid var(--border);
    border-radius:var(--radius);padding:14px;
    box-shadow:0 24px 48px -16px rgba(0,0,0,.6);
    display:flex;gap:28px;
    opacity:0;visibility:hidden;transform:translateY(6px);
    transition:opacity .16s ease, transform .16s ease, visibility .16s ease;
    margin-top:10px;
}
li.is-open .mega{opacity:1;visibility:visible;transform:translateY(0);}
.mega-col{min-width:170px;}
.mega-col h4{
    margin:0 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.6px;
    color:var(--text-dim);font-weight:700;
}
.mega-col a{
    display:flex;align-items:center;justify-content:space-between;gap:8px;
    padding:7px 8px;margin:0 -8px;border-radius:7px;
    font-size:13.5px;color:var(--text);transition:background .15s ease,color .15s ease;
}
.mega-col a:hover{background:var(--bg-elevated-2);color:var(--accent);}
.mega-col a .tag{font-size:10.5px;color:var(--text-dim);background:var(--bg-elevated-2);padding:2px 6px;border-radius:5px;}
.mega-col a:hover .tag{color:var(--accent);}

/* ---- right side actions ---- */
.header-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}

.search-wrap{position:relative;}
.icon-btn{
    width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    background:transparent;border:1px solid var(--border);color:var(--text);cursor:pointer;
    transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.icon-btn:hover{background:var(--bg-elevated-2);border-color:rgba(255,255,255,.18);color:var(--accent);}
.icon-btn svg{width:16px;height:16px;}

.search-panel{
    position:absolute;top:calc(100% + 10px);right:0;width:320px;
    background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);
    padding:10px;box-shadow:0 24px 48px -16px rgba(0,0,0,.6);
    opacity:0;visibility:hidden;transform:translateY(6px);
    transition:opacity .16s ease, transform .16s ease, visibility .16s ease;
}
.search-panel.is-open{opacity:1;visibility:visible;transform:translateY(0);}
.search-panel form{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:0 10px;}
.search-panel input{
    flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:14px;padding:10px 0;
}
.search-panel input::placeholder{color:var(--text-dim);}
.search-panel svg{width:15px;height:15px;color:var(--text-dim);flex-shrink:0;}

.subscribe-btn{
    display:flex;align-items:center;gap:8px;
    background:var(--accent);color:#16140a;font-weight:700;font-size:13.5px;
    padding:10px 18px;border-radius:999px;border:none;cursor:pointer;white-space:nowrap;
    transition:filter .15s ease, transform .15s ease;
}
.subscribe-btn:hover{filter:brightness(1.08);transform:translateY(-1px);}
.subscribe-btn svg{width:14px;height:14px;}

.burger{
    display:none;width:38px;height:38px;border-radius:50%;border:1px solid var(--border);
    background:transparent;cursor:pointer;align-items:center;justify-content:center;flex-shrink:0;
}
.burger span{display:block;width:16px;height:1.5px;background:var(--text);position:relative;}
.burger span::before,.burger span::after{
    content:"";position:absolute;left:0;width:16px;height:1.5px;background:var(--text);transition:transform .2s ease;
}
.burger span::before{top:-5px;}
.burger span::after{top:5px;}

/* ============ MOBILE OFF-CANVAS MENU ============ */
.mobile-overlay{
    position:fixed;inset:0;background:rgba(2,3,6,.6);backdrop-filter:blur(2px);
    z-index:1100;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease;
}
.mobile-overlay.is-open{opacity:1;visibility:visible;}

.mobile-panel{
    position:fixed;top:0;right:0;height:100%;width:min(86vw,380px);
    background:var(--bg-elevated);z-index:1101;
    transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);
    display:flex;flex-direction:column;
    border-left:1px solid var(--border);
    font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--text);
}
.mobile-panel.is-open{transform:translateX(0);}

.mobile-panel__head{
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:18px 18px;border-bottom:1px solid var(--border);flex-shrink:0;
}
.mobile-panel__head .logo svg{height:22px;}
.mobile-close{
    width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:transparent;
    display:flex;align-items:center;justify-content:center;color:var(--text);cursor:pointer;
}
.mobile-close svg{width:14px;height:14px;}

.mobile-search{padding:14px 18px;border-bottom:1px solid var(--border);flex-shrink:0;}
.mobile-search form{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:0 12px;}
.mobile-search input{flex:1;background:transparent;border:none;outline:none;color:var(--text);font-size:14px;padding:11px 0;}
.mobile-search input::placeholder{color:var(--text-dim);}
.mobile-search svg{width:15px;height:15px;color:var(--text-dim);}

.mobile-nav{flex:1;overflow-y:auto;padding:8px 8px 0;}
.mobile-nav>ul>li{border-bottom:1px solid var(--border);}
.mobile-row{
    display:flex;align-items:center;justify-content:space-between;gap:10px;
    padding:15px 10px;font-size:15px;font-weight:600;cursor:pointer;
}
.mobile-row .chev{width:10px;height:10px;color:var(--text-dim);transition:transform .2s ease;flex-shrink:0;}
li.is-expanded > .mobile-row .chev{transform:rotate(180deg);}
.mobile-sub{
    max-height:0;overflow:hidden;transition:max-height .25s ease;
    padding-left:10px;
}
li.is-expanded > .mobile-sub{max-height:1000px;}
.mobile-sub a, .mobile-sub .mobile-row{
    display:block;font-size:14px;font-weight:500;color:var(--text-dim);padding:11px 10px;
}
.mobile-sub a:hover{color:var(--accent);}
.mobile-sub .mobile-sub{padding-left:14px;}
.mobile-sub .mobile-sub a, .mobile-sub .mobile-sub .mobile-row{font-size:13.5px;}

.mobile-panel__foot{padding:16px 18px 22px;border-top:1px solid var(--border);flex-shrink:0;}
.mobile-secondary{display:flex;flex-wrap:wrap;gap:10px 16px;margin-bottom:16px;}
.mobile-secondary a{font-size:12.5px;color:var(--text-dim);}
.mobile-secondary a:hover{color:var(--accent);}
.mobile-panel__foot .social-row{margin-bottom:16px;}
.mobile-panel__foot .social-row a{width:18px;height:18px;}
.mobile-subscribe{width:100%;justify-content:center;}

/* ============ RESPONSIVE ============ */
@media (max-width:980px){
    .primary-nav,.header-actions .subscribe-btn,.header-actions .icon-btn[data-search],.top-strip__links{display:none;}
    .burger{display:flex;}
    .header-inner{gap:16px;}
    .top-strip__inner{justify-content:flex-end;}
}
@media (min-width:981px){
    .mobile-overlay,.mobile-panel{display:none;}
}