/* ============================================================================
   LOOM UI — site-wide reusable layer
   Loaded on EVERY page (functions.php child_enqueue_styles). Holds the chrome
   (sticky nav + footer) and the cross-cutting primitives the redesign reuses:
   layout container, eyebrows, serif/mono utilities, amber CTAs.

   Extracted from loom-home.css so the homepage and every other surface share
   one definition (the markup is already shared via inc/loom-chrome.php). The
   chrome is self-contained — it does NOT assume a .lh-root ancestor — because
   off the homepage it renders directly inside Kadence's #inner-wrap.

   Consumes the canonical tokens in loom-tokens.css (:root). Enterprise
   primitives (usage meter, donut gauge, status pills, app-shell) will be added
   here during the foundation so Phase F is a skin pass.
   ============================================================================ */

/* Self-contained box model for the chrome (no .lh-root reset off-homepage). */
.lh-nav, .lh-nav *,
.lh-footer, .lh-footer * { box-sizing: border-box; }

/* ============================ UTILITIES ============================ */
.lh-wrap{max-width:var(--lh-maxw);margin:0 auto;padding-left:32px;padding-right:32px}
.lh-eyebrow{font-family:var(--font-mono);font-size:11.5px;letter-spacing:3.5px;text-transform:uppercase;color:var(--lh-amber);margin-bottom:18px}
.lh-serif{font-family:var(--font-serif);font-weight:500}
.lh-mono{font-family:var(--font-mono)}

/* ============================ NAV ============================ */
.lh-nav{
  position:sticky;top:0;z-index:50;
  padding:18px 0;
  background:var(--lh-ink);
  border-bottom:1px solid rgba(255,255,255,.07);
  font-family:var(--font-sans);
}
/* Homepage only: frosted translucent nav over the hero (nav sits inside
   .lh-root there). Everywhere else the nav is solid navy so it never washes
   out against a light/paper page behind it. */
.lh-root .lh-nav{
  background:rgba(10,26,40,.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.lh-nav-inner{
  max-width:var(--lh-maxw);margin:0 auto;padding:0 32px;
  display:flex;align-items:center;justify-content:space-between;
}
.lh-nav-left{display:flex;align-items:center;gap:36px}
.lh-logo-img{height:26px;width:auto;display:block}
.lh-logo-img--footer{height:24px}
.lh-nav-tag{font-family:var(--font-mono);font-size:10.5px;letter-spacing:3px;color:var(--lh-text-dim);text-transform:uppercase;padding-top:3px}
.lh-nav-links{display:flex;align-items:center;gap:28px;font-size:14.5px;font-weight:500}
.lh-nav-links a{color:var(--lh-text-muted);text-decoration:none;transition:color .15s}
.lh-nav-links a:hover{color:#fff}
.lh-nav-btn{display:flex;align-items:center;gap:8px;color:var(--lh-text)!important;border:1px solid rgba(255,255,255,.18);padding:9px 18px;border-radius:8px;font-weight:600;transition:border-color .15s}
.lh-nav-btn:hover{border-color:rgba(255,255,255,.5)}
/* mobile hamburger toggle (hidden on desktop) */
.lh-nav-toggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:38px;padding:0 9px;background:none;border:1px solid rgba(255,255,255,.18);border-radius:8px;cursor:pointer}
.lh-nav-toggle span{display:block;height:2px;width:100%;background:var(--lh-text-soft);border-radius:2px;transition:transform .2s ease,opacity .2s ease,background .15s ease}
/* override Kadence's green button hover with the logo's light blue */
.lh-nav-toggle:hover,.lh-nav-toggle:focus{background:none!important;border-color:var(--lh-blue-light)!important;color:var(--lh-blue-light)!important}
.lh-nav-toggle:hover span,.lh-nav-toggle:focus span{background:var(--lh-blue-light)}
.lh-nav--open .lh-nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.lh-nav--open .lh-nav-toggle span:nth-child(2){opacity:0}
.lh-nav--open .lh-nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Account dropdown (logged-in) */
.lh-nav-account{position:relative}
.lh-nav-account-btn{display:flex;align-items:center;gap:9px;background:none;border:0;cursor:pointer;color:var(--lh-text);font-family:var(--font-sans);font-size:14.5px;font-weight:500;padding:6px 4px}
.lh-nav-account-btn:hover{color:#fff}
.lh-nav-avatar{width:26px;height:26px;flex:none;border-radius:50%;background:var(--lh-slate);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;color:#fff}
.lh-nav-caret{font-size:10px;color:var(--lh-text-muted);transition:transform .15s}
.lh-nav-account.is-open .lh-nav-caret{transform:rotate(180deg)}
.lh-nav-menu{position:absolute;top:calc(100% + 10px);right:0;min-width:184px;background:var(--lh-panel);border:1px solid rgba(255,255,255,.1);border-radius:12px;box-shadow:0 20px 50px -20px rgba(0,0,0,.7);padding:6px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .15s,transform .15s,visibility .15s;z-index:60}
.lh-nav-account.is-open .lh-nav-menu{opacity:1;visibility:visible;transform:translateY(0)}
.lh-nav-menu a{display:block;padding:10px 14px;border-radius:8px;color:var(--lh-text-soft);text-decoration:none;font-size:14px;font-weight:500;transition:background .12s,color .12s}
.lh-nav-menu a:hover{background:rgba(255,255,255,.06);color:#fff}
.lh-nav-menu-logout{color:var(--lh-text-muted)!important;border-top:1px solid rgba(255,255,255,.07);margin-top:4px;padding-top:11px!important}
.lh-nav-menu-logout:hover{color:var(--lh-red)!important}
/* Enterprise account-menu variants */
.lh-nav-menu-action{color:var(--lh-teal)!important;font-weight:600!important}
.lh-nav-menu-action:hover{background:rgba(130,207,213,.12)!important;color:var(--lh-teal)!important}
.lh-nav-menu-note{display:block;padding:10px 14px;font-size:12.5px;color:var(--lh-text-dim);font-style:italic;cursor:default}

/* ============================ AMBER CTA ============================
   Reusable primary call-to-action (homepage report CTAs, and any new surface). */
.lh-btn-amber{display:inline-flex;align-items:center;gap:9px;background:var(--lh-amber);color:#10202E;text-decoration:none;border-radius:10px;padding:16px 30px;font-size:15.5px;font-weight:700;font-family:var(--font-sans);transition:transform .15s ease}
.lh-btn-amber:hover,.lh-btn-amber:focus{transform:translateY(-1px);color:#10202E!important;background:#EFA94D}
.lh-btn-amber-lg{display:inline-flex;align-items:center;gap:10px;background:var(--lh-amber);color:#10202E;text-decoration:none;border-radius:11px;padding:18px 38px;font-size:17px;font-weight:700;font-family:var(--font-sans);box-shadow:0 18px 40px -16px var(--lh-amber);transition:transform .15s ease}
.lh-btn-amber-lg:hover,.lh-btn-amber-lg:focus{transform:translateY(-2px);color:#10202E!important;background:#EFA94D}

/* ============================ FOOTER ============================ */
.lh-footer{border-top:1px solid rgba(255,255,255,.07);background:var(--lh-ink);padding:56px 0 40px;font-family:var(--font-sans)}
.lh-footer-top{display:flex;align-items:flex-start;justify-content:space-between;gap:40px;flex-wrap:wrap;padding-bottom:36px;border-bottom:1px solid rgba(255,255,255,.07)}
.lh-footer-about{max-width:380px}
.lh-footer-about p{font-size:13px;line-height:1.6;color:#7E92A6;margin:14px 0 0}
.lh-footer-cols{display:flex;gap:60px;flex-wrap:wrap}
.lh-fcol{display:flex;flex-direction:column;gap:12px}
.lh-fcol .h{font-family:var(--font-mono);font-size:10px;letter-spacing:2px;color:#56697D;text-transform:uppercase;margin-bottom:2px}
.lh-fcol a{font-size:14px;color:var(--lh-text-muted);text-decoration:none}
.lh-fcol a:hover{color:#fff}
.lh-disclaimer{font-size:11.5px;line-height:1.6;color:#56697D;margin:24px 0 0;max-width:880px}
.lh-copy{font-family:var(--font-mono);font-size:11px;color:#56697D;margin-top:20px;letter-spacing:.5px}

/* ============================ RESPONSIVE (chrome) ============================ */
@media(max-width:900px){
  .lh-nav{padding:16px 0}
  .lh-nav-inner{padding:0 20px}
  .lh-nav-tag{display:none}
  /* collapse the links into a click-to-reveal dropdown */
  .lh-nav-toggle{display:flex}
  .lh-nav-links{
    display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;
    background:rgba(10,26,40,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid rgba(255,255,255,.08);padding:6px 20px 16px;
  }
  .lh-nav--open .lh-nav-links{display:flex}
  .lh-nav-links a{padding:13px 2px;width:100%;font-size:15.5px}
  .lh-nav-links .lh-nav-btn{margin-top:10px;justify-content:center;padding:12px 18px}
  /* account dropdown: render inline inside the collapsed menu */
  .lh-nav-account{width:100%}
  .lh-nav-account-btn{width:100%;justify-content:flex-start;padding:13px 2px;font-size:15.5px}
  .lh-nav-menu{position:static;min-width:0;box-shadow:none;border:0;background:rgba(255,255,255,.03);padding:4px;margin-top:6px}
}

/* ── Inline report-title editor (enterprise Reports table + report cover) ───── */
.loom-titlew-display{display:inline-flex;align-items:center;gap:6px}
.loom-titlew-form{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.loom-titlew-edit{background:none;border:0;cursor:pointer;padding:2px 5px;border-radius:5px;line-height:1;font-size:13px;opacity:.5;transition:opacity .12s,color .12s}
.loom-titlew:hover .loom-titlew-edit,.loom-titlew-edit:focus{opacity:1}
.loom-titlew-input{font:inherit;padding:6px 10px;border-radius:8px;min-width:210px}
.loom-titlew-input:focus{outline:0}
.loom-titlew-save,.loom-titlew-cancel{font:inherit;font-size:13px;padding:6px 12px;border-radius:8px;cursor:pointer;border:0;line-height:1.2}
.loom-titlew-save{font-weight:600}
/* Dark context: the enterprise Reports table */
.le-rt .loom-titlew-text{color:var(--lh-text);text-decoration:none;font-weight:500}
.le-rt .loom-titlew-text:hover{color:#fff;text-decoration:underline}
.le-rt .loom-titlew:not(.has-title) .loom-titlew-text{color:var(--lh-text-muted)}
.le-rt .loom-titlew-edit{color:var(--lh-text-dim)}
.le-rt .loom-titlew-edit:hover{color:var(--lh-teal)}
.le-rt .loom-titlew-input{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.2);color:var(--lh-text)}
.le-rt .loom-titlew-input:focus{border-color:var(--lh-teal);box-shadow:0 0 0 3px rgba(130,207,213,.18)}
.le-rt .loom-titlew-save{background:var(--lh-teal);color:#06222F}
.le-rt .loom-titlew-cancel{background:transparent;color:var(--lh-text-dim)}
/* Light context: the report cover */
.lr-cover .loom-titlew--cover{display:block}
.lr-cover .loom-titlew--cover .loom-titlew-display{align-items:flex-start;gap:10px}
.lr-cover .loom-titlew-edit{color:rgba(234,240,246,.5);font-size:15px}
.lr-cover .loom-titlew-edit:hover{color:var(--lh-amber)}
.lr-cover-sub{font-size:15px;color:rgba(234,240,246,.62);margin:3px 0 0}
.lr-cover .loom-titlew-form{margin-top:12px}
.lr-cover .loom-titlew-input{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);color:#fff;min-width:min(360px,80vw)}
.lr-cover .loom-titlew-input::placeholder{color:rgba(234,240,246,.45)}
.lr-cover .loom-titlew-input:focus{border-color:var(--lh-teal);box-shadow:0 0 0 3px rgba(130,207,213,.18)}
.lr-cover .loom-titlew-save{background:var(--lh-amber);color:#10202E}
.lr-cover .loom-titlew-cancel{background:transparent;color:rgba(234,240,246,.62)}