:root{
  --calda-blue:#1b3545;
  --calda-red:#c8102e;
}

/* Hide the old top bars + mojo mobile drawer trigger so we only have ONE top nav */
.pagebody .userbar{ display:none !important; }
.pagebody header.head .menu-btn{ display:none !important; }
.pagebody .menu-drawer{ display:none !important; }
.pagebody #site-menu{ display:none !important; }

/* =========================
   TOP NAV
========================= */
.pagebody .calda-navbar{
  background:var(--calda-blue);
  border-bottom:4px solid var(--calda-red);
  position:relative;
  z-index:9999;
}

.pagebody .calda-navbar-inner{
  max-width:1140px;
  margin:0 auto;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

/* CALDA Newsroom button */
.pagebody .calda-navbar-brand{
  font-family:"Noto Sans", Arial, sans-serif;
  font-size:1.15rem;
  font-weight:800;
  color:#fff !important;
  text-decoration:none !important;
  white-space:nowrap;

  background:var(--calda-red);
  border:2px solid #0b0b0b;
  padding:8px 14px;
  border-radius:12px;

  box-shadow:0 6px 0 #0b0b0b;
  transition:transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.pagebody .calda-navbar-brand:hover{
  background:#b70f29;
  transform:translateY(3px);
  box-shadow:0 3px 0 #0b0b0b;
}
.pagebody .calda-navbar-brand:active{
  transform:translateY(6px);
  box-shadow:0 0 0 #0b0b0b;
}

/* Right side links */
.pagebody .calda-nav{
  list-style:none !important;
  display:flex;
  align-items:center;              /* ✅ vertical alignment baseline fix */
  justify-content:flex-end;
  gap:10px;
  margin:0 !important;
  padding:0 !important;
  flex-wrap:wrap;
}

.pagebody .calda-nav-item{
  position:relative;
  display:flex;
  align-items:center;              /* ✅ forces each li to align */
}

/* ✅ HARD normalize: anchor + button look identical */
.pagebody .calda-nav-link,
.pagebody .calda-dropdown-toggle{
  font-family:"Noto Sans", Arial, sans-serif;
  font-size:1.12rem;
  font-weight:700;

  /* ✅ same box model */
  display:inline-flex;
  align-items:center;
  justify-content:center;

  height:40px;                     /* ✅ consistent height across items */
  line-height:40px;                /* ✅ fixes “Register slightly higher” */
  padding:0 12px;

  color:#fff !important;
  text-decoration:none !important;

  border-radius:12px;
  background:transparent !important;
  border:0 !important;
  cursor:pointer;

  vertical-align:middle;           /* ✅ extra insurance */
  margin:0;
}

/* No green hover — CALDA-only */
.pagebody .calda-nav-link:hover,
.pagebody .calda-dropdown-toggle:hover,
.pagebody .calda-nav-link:focus,
.pagebody .calda-dropdown-toggle:focus{
  color:#fff !important;
  background:rgba(255,255,255,.10) !important;
  text-decoration:none !important;
  outline:none;
}

/* Dropdown caret */
.pagebody .calda-dropdown-toggle::after{
  content:" ▾";
  margin-left:6px;
  font-size:.95em;
}

/* Dropdown */
.pagebody .calda-dropdown-menu{
  position:absolute;
  top:100%;
  left:0;
  min-width:280px;
  max-width:380px;
  background:#fff;
  color:#000;
  border:2px solid #0b0b0b;
  border-radius:12px;
  padding:6px 0;
  box-shadow:0 8px 0 #0b0b0b;
  display:none;
  z-index:100000;
}

/* bridge so hover doesn’t disappear */
.pagebody .calda-dropdown-menu::before{
  content:"";
  position:absolute;
  top:-12px;
  left:0;
  width:100%;
  height:12px;
}

/* Desktop hover open */
@media (min-width:769px){
  .pagebody .calda-dropdown:hover .calda-dropdown-menu{ display:block; }
}

/* Mobile click open */
@media (max-width:768px){
  .pagebody .calda-dropdown.open .calda-dropdown-menu{ display:block; }
}

/* Reset portal menu markup in dropdown */
.pagebody .calda-dropdown-menu *{
  float:none !important;
  position:static !important;
  width:auto !important;
  height:auto !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.pagebody .calda-dropdown-menu ul{
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
  display:block !important;
}
.pagebody .calda-dropdown-menu li{ display:block !important; width:100% !important; }
.pagebody .calda-dropdown-menu img{ display:none !important; }

.pagebody .calda-dropdown-menu a{
  display:block !important;
  padding:10px 16px !important;
  color:#000 !important;
  text-decoration:none !important;
  font-family:"Noto Sans", Arial, sans-serif;
  font-weight:600;
  white-space:nowrap;
  line-height:1.25;               /* dropdown lines normal */
}
.pagebody .calda-dropdown-menu a:hover{
  background:#f3f4f6 !important;
  color:var(--calda-blue) !important;
}
.pagebody .calda-dropdown-menu ul ul a{ padding-left:30px !important; }
.pagebody .calda-dropdown-menu > ul > li + li{
  border-top:1px solid rgba(0,0,0,.08);
}

/* ✅ Register fallback logic:
   If mojoPortal RegisterLink renders an <a> before it, hide fallback. */
.pagebody .calda-register-fallback{ display:inline-flex; }
.pagebody .calda-nav-item a.calda-nav-link + a.calda-register-fallback{ display:none; }

/* =========================
   CENTER THE HEADER LOGO
========================= */
/* Center the whole header row */
.pagebody header.head .container.flex-xs-children{
  justify-content:center !important;
}

/* Make logo block center and not get pushed left by any floats */
.pagebody header.head .site-logo{
  display:block;
  margin:0 auto;
}
.pagebody header.head .site-logo-img{
  display:block;
  margin:0 auto;
}

/* ============================================================
   NEWSROOM: CUPE-LIKE LIST (mojoPortal blog/post list)
   This version is aggressive and catches more mojoPortal markup.
   ============================================================ */

:root{
  --ink:#1b3545;
  --red:#c8102e;
  --line:rgba(0,0,0,.12);
  --muted:rgba(0,0,0,.70);
}

/* Keep newsroom background normal */
body.pagebody { background:#fff; }

/* Make page title feel like CUPE */
.pagebody .page-title,
.pagebody h1.page-title,
.pagebody h1{
  color: var(--ink);
  font-weight: 800;
  letter-spacing: .2px;
}

/* Catch common “post list” containers in mojoPortal */
.pagebody .bloglist,
.pagebody .blog-post-list,
.pagebody .blogroll,
.pagebody .postlist,
.pagebody .scoutblogpostlist,
.pagebody .modulecontent{
  background: transparent !important;
}

/* Catch common “post item” wrappers (div OR li OR table rows) */
.pagebody .blogitem,
.pagebody .blog-post,
.pagebody .blogpost,
.pagebody .post,
.pagebody .scout-post,
.pagebody .scout-post-item,
.pagebody .bloglist li,
.pagebody .bloglist .item,
.pagebody .scoutblogpostlist li,
.pagebody .scoutblogpostlist .item,
.pagebody .modulecontent li{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px 16px;
  margin:0 0 12px;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}

/* Titles */
.pagebody .blogitem h2,
.pagebody .blog-post h2,
.pagebody .blogpost h2,
.pagebody .scout-post h2,
.pagebody .scout-post-item h2,
.pagebody .post h2,
.pagebody .bloglist h2{
  margin:0 0 6px;
  font-size:1.2rem;
  line-height:1.25;
  font-weight:800;
}

.pagebody .blogitem h2 a,
.pagebody .blog-post h2 a,
.pagebody .blogpost h2 a,
.pagebody .scout-post h2 a,
.pagebody .scout-post-item h2 a,
.pagebody .post h2 a,
.pagebody .bloglist h2 a{
  color: var(--ink);
  text-decoration:none;
}

.pagebody .blogitem h2 a:hover,
.pagebody .blog-post h2 a:hover,
.pagebody .blogpost h2 a:hover,
.pagebody .scout-post h2 a:hover,
.pagebody .scout-post-item h2 a:hover,
.pagebody .post h2 a:hover,
.pagebody .bloglist h2 a:hover{
  color: var(--red);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* Meta line (date/category/tags) */
.pagebody .postmetadata,
.pagebody .meta,
.pagebody .post-meta,
.pagebody .scout-meta{
  margin:0 0 8px;
  color: var(--muted);
  font-size:.95rem;
}

/* Make tag/category links look like pills */
.pagebody .postmetadata a,
.pagebody .meta a,
.pagebody .post-meta a{
  display:inline-block;
  margin-left:6px;
  padding:2px 8px;
  border:1px solid var(--line);
  border-radius:999px;
  text-decoration:none;
  color: var(--ink);
  background:#fff;
}
.pagebody .postmetadata a:hover,
.pagebody .meta a:hover,
.pagebody .post-meta a:hover{
  border-color: rgba(200,16,46,.35);
  color: var(--red);
}

/* Excerpts */
.pagebody .postbody,
.pagebody .excerpt,
.pagebody .summary{
  color: rgba(0,0,0,.82);
  font-size:1rem;
  line-height:1.45;
}

/* Images/thumbnails inside posts */
.pagebody .blogitem img,
.pagebody .blog-post img,
.pagebody .blogpost img,
.pagebody .scout-post img,
.pagebody .scout-post-item img,
.pagebody .post img{
  max-width:130px;
  border-radius:10px;
  height:auto;
}

/* Try to force thumbnail-left layout if there’s an image */
@media (min-width: 769px){
  .pagebody .blogitem,
  .pagebody .blog-post,
  .pagebody .blogpost,
  .pagebody .scout-post,
  .pagebody .scout-post-item,
  .pagebody .post{
    display:flex;
    gap:14px;
    align-items:flex-start;
  }
  .pagebody .blogitem img,
  .pagebody .blog-post img,
  .pagebody .blogpost img,
  .pagebody .scout-post img,
  .pagebody .scout-post-item img,
  .pagebody .post img{
    flex:0 0 130px;
    object-fit:cover;
  }
}

/* Mobile: stack */
@media (max-width: 768px){
  .pagebody .blogitem,
  .pagebody .blog-post,
  .pagebody .blogpost,
  .pagebody .scout-post,
  .pagebody .scout-post-item,
  .pagebody .post{
    display:block !important;
  }
  .pagebody .blogitem img,
  .pagebody .blog-post img,
  .pagebody .blogpost img,
  .pagebody .scout-post img,
  .pagebody .scout-post-item img,
  .pagebody .post img{
    max-width:100%;
    width:100%;
    margin:0 0 10px;
  }
}