@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:ital,wght@0,400;0,500;0,600;1,400&display=swap');

/* =========================================================
   Brian's WX — Signal theme (Cassiopeia child: cassiopeia_brianswx)
   File: media/templates/site/cassiopeia_brianswx/css/user.css
   ========================================================= */

:root {
  --bwx-bg: #121214;
  --bwx-panel: #19191c;
  --bwx-raised: #222226;
  --bwx-line: #303036;
  --bwx-line2: #45454d;
  --bwx-text: #ececef;
  --bwx-text2: #bdbdc6;
  --bwx-body: #d4d4db;
  --bwx-muted: #9a9aa5;
  --bwx-acc: #ff7a5c;
  --bwx-acc2: #ff9c85;
  --bwx-head: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --bwx-sans: 'IBM Plex Sans', system-ui, sans-serif;
  --bwx-mono: 'IBM Plex Mono', ui-monospace, monospace;

  --cassiopeia-color-primary: var(--bwx-bg);
  --cassiopeia-color-link: var(--bwx-acc);
  --cassiopeia-color-hover: var(--bwx-acc2);
  --cassiopeia-font-family-body: var(--bwx-sans);
  --cassiopeia-font-family-headings: var(--bwx-head);
  --cassiopeia-font-weight-headings: 600;
  --body-bg: var(--bwx-bg);
  --body-color: var(--bwx-text);
  --bs-body-bg: var(--bwx-bg);
  --bs-body-color: var(--bwx-text);
  --bs-border-color: var(--bwx-line);
  --bs-heading-color: var(--bwx-text);
  --bs-link-color: var(--bwx-acc);
  --bs-link-hover-color: var(--bwx-acc2);
  --bs-link-color-rgb: 255, 122, 92;
  --bs-link-hover-color-rgb: 255, 156, 133;
  --bs-secondary-color: var(--bwx-muted);
  --link-color: var(--bwx-acc);
  --link-hover-color: var(--bwx-acc2);
  color-scheme: dark;
}

html, body, body.site { background: var(--bwx-bg); color: var(--bwx-text); }
body { font-family: var(--bwx-sans); font-size: 1rem; line-height: 1.65; }
a { color: var(--bwx-acc); text-underline-offset: 3px; }
a:hover, a:focus { color: var(--bwx-acc2); }
h1, h2, h3, h4, .h1, .h2, .h3 { font-family: var(--bwx-head); font-weight: 600; letter-spacing: .01em; color: var(--bwx-text); line-height: 1.1; }
h1, .h1 { font-size: clamp(2.4rem, 5vw, 4rem); }
h2, .h2 { font-size: clamp(1.6rem, 3vw, 2.1rem); }
h3, .h3 { font-size: 1.45rem; }
hr { border-color: var(--bwx-line); opacity: 1; }
::selection { background: var(--bwx-acc); color: var(--bwx-bg); }
img { max-width: 100%; height: auto; }

/* ---------- Header ---------- */
.container-header {
  background: var(--bwx-bg) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--bwx-line);
  box-shadow: none !important;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: .5rem 1.5rem;
  padding: .9rem max(1.5rem, calc((100% - 1200px) / 2));
}
.container-header > .grid-child { width: auto; max-width: none; margin: 0; padding: 0; }
.container-header .navbar-brand { display: flex; align-items: baseline; gap: .75rem; padding: 0; margin: 0; }
.container-header .brand-logo { color: var(--bwx-text); text-decoration: none; font-family: var(--bwx-head); font-weight: 700; font-size: 1.9rem; letter-spacing: .03em; text-transform: uppercase; line-height: 1; }
.container-header .brand-logo:hover { color: var(--bwx-text); }
.container-header .site-description { font-family: var(--bwx-mono); font-size: .8rem; color: var(--bwx-acc); margin: 0; }
.container-header .container-nav { padding: 0; }
.container-header .navbar { padding: 0; }
.container-header .navbar-toggler { color: var(--bwx-text); border: 1px solid var(--bwx-line2); padding: .4rem .7rem; }
.container-header .metismenu { gap: .25rem; }
.container-header .mod-menu .metismenu-item { padding: 0; font-size: .95rem; }
.container-header .metismenu > li > a,
.container-header .metismenu > li > .mm-toggler,
.container-header .metismenu > li > button { color: var(--bwx-text2); text-decoration: none; padding: .6rem .8rem; background: none; border: 0; }
.container-header .metismenu > li > a:hover,
.container-header .metismenu > li > button:hover { color: var(--bwx-text); }
.container-header .metismenu > li.active > a,
.container-header .metismenu > li.active > button,
.container-header .metismenu > li > a[aria-current] { color: var(--bwx-acc); box-shadow: inset 0 -2px 0 var(--bwx-acc); }
.container-header .metismenu > li > a::after, .container-header .metismenu > li > a::before { display: none; }
.container-header .metismenu ul.mm-collapse { background: var(--bwx-panel); border: 1px solid var(--bwx-line); box-shadow: 0 14px 30px rgba(0,0,0,.5); padding: .4rem 0; min-width: 16rem; }
.container-header .metismenu ul.mm-collapse .metismenu-item { padding: 0; }
.container-header .metismenu ul.mm-collapse a { display: block; color: var(--bwx-text2); text-decoration: none; padding: .45rem 1rem; font-size: .92rem; }
.container-header .metismenu ul.mm-collapse a:hover,
.container-header .metismenu ul.mm-collapse li.active > a { color: var(--bwx-acc); background: var(--bwx-raised); }

/* ---------- Page body ---------- */
.site-grid { padding-top: 1.5rem; }
.container-component { color: var(--bwx-text); }
.com-content-article__body { color: var(--bwx-body); font-size: 1.0625rem; }
.com-content-article__body p { margin: 0 0 1.1rem; }
.page-header h1, .page-header h2 { margin-bottom: 1rem; }
.article-info { color: var(--bwx-muted); font-family: var(--bwx-mono); font-size: .8rem; }
.card, .alert { background: var(--bwx-panel); color: var(--bwx-text); border-color: var(--bwx-line); }

/* Breadcrumbs */
.mod-breadcrumbs, .breadcrumb { background: none !important; padding: 0 !important; margin: 0 0 1rem !important; font-family: var(--bwx-mono); font-size: .8rem; color: var(--bwx-muted); }
.mod-breadcrumbs__here { display: none; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--bwx-line2); }
.breadcrumb-item.active, .breadcrumb-item a { color: var(--bwx-muted); }
.breadcrumb-item a:hover { color: var(--bwx-acc); }

/* Tables (old content too) */
.com-content-article__body table { border-color: var(--bwx-line); color: var(--bwx-body); }
.com-content-article__body td, .com-content-article__body th { border-color: var(--bwx-line); }

/* ---------- Footer ---------- */
.container-footer { background: var(--bwx-bg) !important; background-image: none !important; border-top: 1px solid var(--bwx-line); color: var(--bwx-muted); margin-top: 4rem; }
.container-footer .grid-child { padding: 1.5rem 0; }
.container-footer a { color: var(--bwx-acc); }
.bwx-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .75rem 1.5rem; width: 100%; font-size: .875rem; }
.bwx-footer .bwx-mono { font-family: var(--bwx-mono); }
.bwx-footer nav { display: flex; gap: 1.25rem; }
.back-to-top-link { background: var(--bwx-acc) !important; color: var(--bwx-bg) !important; border-radius: 0 !important; }

/* =========================================================
   Content building blocks (used inside articles)
   ========================================================= */
.bwx-eyebrow { font-family: var(--bwx-mono); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--bwx-acc); margin: 0 0 .75rem; }
.bwx-lead { font-size: 1.125rem; color: var(--bwx-text2); max-width: 46rem; }
.bwx-muted { color: var(--bwx-muted); }
.bwx-mono { font-family: var(--bwx-mono); }

.bwx-hero { display: flex; flex-wrap: wrap; gap: 2rem 3.5rem; align-items: center; margin: .5rem 0 3rem; }
.bwx-hero > * { flex: 1 1 380px; min-width: 0; }
.bwx-hero h1 { margin: 0; }
.bwx-callsign { font-family: var(--bwx-mono) !important; font-weight: 500 !important; font-size: clamp(3.5rem, 9vw, 6.5rem) !important; line-height: 1; letter-spacing: -.02em; }

.bwx-btns { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.5rem; }
.bwx-btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 1.25rem; background: var(--bwx-acc); border: 1px solid var(--bwx-acc); color: var(--bwx-bg) !important; font-weight: 600; text-decoration: none !important; }
.bwx-btn:hover { background: var(--bwx-acc2); border-color: var(--bwx-acc2); }
.bwx-btn--ghost { background: transparent; border-color: var(--bwx-line2); color: var(--bwx-text) !important; font-weight: 500; }
.bwx-btn--ghost:hover { background: transparent; border-color: var(--bwx-acc); }

.bwx-photo { display: block; width: 100%; height: auto; border: 1px solid var(--bwx-line); background: var(--bwx-raised); }

.bwx-section { margin-top: 3.5rem; }
.bwx-section-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem 1.5rem; margin-bottom: 1.5rem; }
.bwx-section-head h2 { margin: 0; }
.bwx-num { font-family: var(--bwx-mono); font-size: .9rem; color: var(--bwx-acc); margin-right: .75rem; }

.bwx-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); border-top: 1px solid var(--bwx-line); border-bottom: 1px solid var(--bwx-line); margin: 3rem 0; }
.bwx-strip > div { padding: 1.25rem 1.25rem 1.25rem 0; }
.bwx-strip strong { display: block; font-family: var(--bwx-mono); font-weight: 400; font-size: 1.35rem; color: var(--bwx-acc); line-height: 1.3; }
.bwx-strip span { font-size: .875rem; color: var(--bwx-muted); }

.bwx-cols { display: flex; flex-wrap: wrap; gap: 3rem 4rem; margin-top: 3.5rem; }
.bwx-cols > * { flex: 1 1 400px; min-width: 0; }
.bwx-cols--main > :first-child { flex: 999 1 520px; }
.bwx-cols--main > :last-child { flex: 1 1 300px; }

.bwx-rows { list-style: none; padding: 0 !important; margin: 0 0 1rem; border-top: 1px solid var(--bwx-line); }
.bwx-rows li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem 1rem; padding: .8rem 0; border-bottom: 1px solid var(--bwx-line); color: var(--bwx-text); }
.bwx-rows li > :first-child { font-weight: 600; }
.bwx-rows .bwx-meta { font-family: var(--bwx-mono); font-size: .85rem; color: var(--bwx-muted); font-weight: 400; }
.bwx-rows--stack li { display: block; }
.bwx-rows--stack small { display: block; color: var(--bwx-muted); font-size: .85rem; font-weight: 400; }
.bwx-rows a { text-decoration: none; }

.bwx-tag { font-family: var(--bwx-mono); font-size: .78rem; color: var(--bwx-acc); }

.bwx-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.5rem; }
.bwx-card { position: relative; display: flex; flex-direction: column; background: var(--bwx-panel); border: 1px solid var(--bwx-line); transition: border-color .15s; }
.bwx-card:hover { border-color: var(--bwx-line2); }
.bwx-card img, .bwx-card .bwx-noimg { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-bottom: 1px solid var(--bwx-line); background: var(--bwx-raised); }
.bwx-card-body { padding: 1rem 1.1rem 1.25rem; display: flex; flex-direction: column; gap: .35rem; }
.bwx-card h3 { margin: 0; font-size: 1.55rem; }
.bwx-card h3 a { color: var(--bwx-text); text-decoration: none; }
.bwx-card h3 a::after { content: ""; position: absolute; inset: 0; }
.bwx-card:hover h3 a { color: var(--bwx-acc); }
.bwx-card p { margin: 0 !important; color: var(--bwx-muted); font-size: .95rem; line-height: 1.5; }

.bwx-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .75rem; }
.bwx-gallery img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border: 1px solid var(--bwx-line); }

.bwx-panel { background: var(--bwx-panel); border: 1px solid var(--bwx-line); padding: 1.5rem; }
.bwx-panel > :last-child { margin-bottom: 0; }

.bwx-spec { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); border-top: 1px solid var(--bwx-line); border-bottom: 1px solid var(--bwx-line); margin: 2rem 0; }
.bwx-spec > div { padding: 1rem 1rem 1rem 0; }
.bwx-spec dt { font-family: var(--bwx-mono); font-size: .75rem; font-weight: 400; color: var(--bwx-muted); text-transform: uppercase; letter-spacing: .06em; }
.bwx-spec dd { margin: .1rem 0 0; font-family: var(--bwx-mono); font-size: 1.5rem; color: var(--bwx-acc); }

.bwx-article { max-width: 44rem; }
.bwx-article h2 { margin: 2.25rem 0 .6rem; }
.bwx-article h2:first-child { margin-top: 0; }
.bwx-aside h2 { font-family: var(--bwx-mono); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: var(--bwx-acc); font-weight: 500; margin: 0 0 .75rem; }
.bwx-aside > div + div { margin-top: 2rem; }

.bwx-table { width: 100%; border-collapse: collapse; }
.bwx-table th { text-align: left; font-family: var(--bwx-mono); font-size: .75rem; font-weight: 400; color: var(--bwx-muted); text-transform: uppercase; letter-spacing: .06em; padding: 0 1rem .6rem 0; border-bottom: 1px solid var(--bwx-line2); }
.bwx-table td { padding: .7rem 1rem .7rem 0; border-bottom: 1px solid var(--bwx-line); color: var(--bwx-text); }
.bwx-table td:first-child { font-family: var(--bwx-mono); color: var(--bwx-acc); white-space: nowrap; }
.bwx-scroll { overflow-x: auto; }

.bwx-stations { list-style: none; padding: 0 !important; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); border-top: 1px solid var(--bwx-line); border-left: 1px solid var(--bwx-line); }
.bwx-stations li { padding: .85rem 1rem; border-right: 1px solid var(--bwx-line); border-bottom: 1px solid var(--bwx-line); color: var(--bwx-text); font-weight: 600; }
.bwx-stations li b { display: block; font-family: var(--bwx-mono); font-weight: 400; font-size: 1.35rem; color: var(--bwx-acc); }
.bwx-stations li a { font-size: .8rem; font-weight: 400; margin-left: .35rem; }

.bwx-listen { display: flex; flex-wrap: wrap; gap: 2rem 3rem; align-items: center; justify-content: space-between; background: var(--bwx-panel); border: 1px solid var(--bwx-line); padding: clamp(1.5rem, 4vw, 2.5rem); margin-bottom: 1rem; }
.bwx-listen > div { flex: 1 1 420px; min-width: 0; }
.bwx-listen h1 { margin: 0; font-size: clamp(2.2rem, 4.5vw, 3.6rem); }
.bwx-listen .bwx-btn { min-height: 56px; font-size: 1.1rem; padding: 0 1.75rem; }
.bwx-live { display: inline-flex; align-items: center; gap: .6rem; }
.bwx-live::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--bwx-acc); }

.bwx-tower { list-style: none; margin: 0; padding: 0 0 0 1.75rem !important; border-left: 2px solid var(--bwx-line2); }
.bwx-tower li { position: relative; padding-bottom: 1.1rem; color: var(--bwx-text); font-weight: 600; }
.bwx-tower li:last-child { padding-bottom: 0; }
.bwx-tower li::before { content: ""; position: absolute; left: calc(-1.75rem - 7px); top: .5rem; width: 12px; height: 12px; border-radius: 50%; background: var(--bwx-acc); }
.bwx-tower small { display: block; font-family: var(--bwx-mono); font-weight: 400; font-size: .82rem; color: var(--bwx-muted); }

.bwx-gauges { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; }
.bwx-gauges--wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); }
.bwx-gauge { margin: 0; background: var(--bwx-panel); border: 1px solid var(--bwx-line); padding: .85rem; display: flex; flex-direction: column; }
.bwx-gauge figcaption { font-size: .875rem; color: var(--bwx-text2); margin-bottom: .6rem; }
.bwx-gauge img { display: block; max-width: 100%; height: auto; margin: auto; }

.bwx-status { display: inline-block; font-family: var(--bwx-mono); font-size: .75rem; padding: .1rem .5rem; border: 1px solid var(--bwx-line2); color: var(--bwx-text2); }

@media (max-width: 575.98px) {
  .container-header { padding-inline: 1rem; }
  .bwx-strip > div, .bwx-spec > div { padding-right: .75rem; }
}


/* =========================================================
   Older pages: tame inline styles left over from the old editor
   ========================================================= */
.com-content-article__body [style*="font-family"] { font-family: inherit !important; }
.com-content-article__body span[style*="font-size"] { font-size: inherit !important; }
.com-content-article__body [style*="color: #000000"], .com-content-article__body [style*="color: rgb(0, 0, 0)"],
.com-content-article__body [style*="color: #000"], .com-content-article__body [style*="color:#000"] { color: inherit !important; }
.com-content-article__body [style*="background-color: #ffff00"] { background: transparent !important; color: var(--bwx-acc) !important; }
.com-content-article__body a[style], .com-content-article__body a span[style], .com-content-article__body span[style*="color: #ff0000"] { color: var(--bwx-acc) !important; }
.com-content-article__body center { text-align: left; }

/* Simple Image Gallery (jw_sig) */
ul.sigFreeContainer { display: flex; flex-wrap: wrap; gap: .5rem; padding: 0 !important; margin: 0 !important; }
ul.sigFreeContainer li.sigFreeThumb { margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
ul.sigFreeContainer a.sigFreeLink { display: block; border: 1px solid var(--bwx-line) !important; background: var(--bwx-raised) !important; padding: 0 !important; box-shadow: none !important; border-radius: 0 !important; }
ul.sigFreeContainer a.sigFreeLink:hover { border-color: var(--bwx-acc) !important; }
.sigFreeContainer img.sigFreeImg { background-size: cover !important; border: 0 !important; }

/* Stacked link lists */
.bwx-rows--stack li > a { font-weight: 600; }

/* No breadcrumbs on the homepage */
.itemid-101 .mod-breadcrumbs__wrapper, .itemid-101 nav[aria-label="Breadcrumbs"] { display: none; }