/* cbcq-footer.css — Costco Quote footer v2 (dark-navy). Themes CBC's OWN footer markup
   (.footerDisclaimer / .footerLeftDiv / .footerRightDiv + the Site Map & Language presentation
   tables) so it drops straight into their _Footer partial. Everything is namespaced under
   .cbcq-footer so it cannot collide with the host page. T1 costcoquote.com only. Build-to-HOLD.
   Toggle .cbcq-footer--grey on the root for the light-grey treatment. */


.cbcq-footer{
  /* dark navy theme */
  --bg:#0f2438; --redbar:#D32E2F;            /* CBC brand red (BRAND-GUIDELINES-NOTES §2) */
  --ink:#dbe4ee; --head:#ffffff; --link:#a9cdf0; --link-hover:#ffffff;
  --legal:#aebccb; --filing:#9fb0c2;
  --panel:rgba(255,255,255,.06); --panel-bd:rgba(255,255,255,.18); --rule:rgba(255,255,255,.16);
  background:var(--bg); color:var(--ink);
  font-family:"Costco Sans Micro", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  font-size:15px; line-height:1.55;
}
.cbcq-footer a{ color:var(--link); text-decoration:none; }
.cbcq-footer a:hover{ color:var(--link-hover) !important; text-decoration:underline; }
.cbcq-footer a:focus-visible,
.cbcq-footer button:focus-visible{ outline:2px solid var(--link-hover); outline-offset:2px; border-radius:2px; }

/* full-bleed dividers, edge to edge (Joe #4) — both are direct children of <footer>, outside .cbcq-inner */
.cbcq-redbar{ height:6px; width:100%; background:var(--redbar); }
.cbcq-bottomrule{ height:1px; width:100%; background:var(--rule); }

.cbcq-inner{ max-width:1180px; margin:0 auto; padding:26px 22px 30px; }

/* ---- top row: legal-links + copyright/NPN (left), then a full-width contact row ---- */
.cbcq-footer .footerDisclaimer{ display:block; }
.cbcq-footer .footerLeftDiv{ font-size:14px; color:var(--legal); }
.cbcq-footer .footerLeftDiv a{ color:var(--link); }
.cbcq-footer .footerLeftDiv > span{ color:var(--legal); }

/* contact — cohesive dark panels + light text + icon (Joe #1 → option B), full-width 3-up row */
.cbcq-footer .footerRightDiv{ display:flex; flex-flow:row wrap; gap:10px; margin-top:18px; }
.cbcq-footer .footerRightDiv a{
  flex:1 1 290px; display:flex; align-items:center; gap:12px; min-height:48px; padding:9px 14px;
  background:var(--panel); border:1px solid var(--panel-bd); border-radius:10px;
  color:var(--ink); line-height:1.3;
}
.cbcq-footer .footerRightDiv a:hover{ background:rgba(255,255,255,.11); text-decoration:none; color:var(--link-hover); }
.cbcq-footer .footerRightDiv a svg{ flex:0 0 20px; width:20px; height:20px; fill:none; stroke:var(--link); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.cbcq-footer .footerRightDiv a strong{ color:var(--head); font-weight:700; }
.cbcq-footer .footerRightDiv a span{ display:block; }
.cbcq-footer .footerRightDiv a small{ display:block; color:var(--legal); font-size:12px; }

/* real headings — h2 section labels (title-case, weight-contrast, sized >= column heads) + h3 column heads */
.cbcq-footer .cbcq-h{ margin:28px 0 14px; padding-top:20px; border-top:1px solid var(--rule); font-size:16px; font-weight:700; color:var(--head); }
.cbcq-footer .cbcq-colh{ margin:0 0 8px; font-size:15px; font-weight:700; color:var(--head); }

/* Site Map + Language presentation tables (CBC uses role=presentation, td width=25%) */
.cbcq-footer table{ width:100%; border-collapse:collapse; }
.cbcq-footer table td{ vertical-align:top; padding:0 16px 0 0; }
.cbcq-footer table p{ margin:0 0 7px; }
.cbcq-footer table a:hover{ color:var(--link-hover); }
.cbcq-footer .iframePopSmall{ color:var(--link); }

/* "More Languages…" toggle is a real <button> styled as a link */
.cbcq-footer .cbcq-more{ display:inline-block; margin-top:12px; padding:0; background:none; border:0; font:inherit; font-weight:700; color:var(--link); cursor:pointer; }
.cbcq-footer .cbcq-more:hover{ color:var(--link-hover); text-decoration:underline; }
.cbcq-footer #visToggle-element{ margin-top:8px; }

/* regulated legal block */
.cbcq-footer .cbcq-legal{ margin-top:26px; padding-top:18px; border-top:1px solid var(--rule); color:var(--legal); font-size:12.5px; line-height:1.6; }
.cbcq-footer .cbcq-legal p{ margin:0 0 10px; }
.cbcq-footer .cbcq-legal a{ color:var(--link); }
.cbcq-footer .cbcq-legal strong{ color:var(--ink); }
.cbcq-footer .cbcq-filing{ color:var(--filing); }

/* suppress legacy bits that ride along in the source */
.cbcq-footer #scrollToTopBTN{ display:none !important; }
.cbcq-footer #pnlLanguageAssistance{ display:none; }

/* responsive: collapse the fixed 25% tables + stack the top row */
@media (max-width:860px){
  .cbcq-footer table, .cbcq-footer table tbody, .cbcq-footer table tr{ display:block; }
  .cbcq-footer table td{ display:block; width:100% !important; padding:0 0 16px; }
}
@media (max-width:520px){
  .cbcq-footer .footerRightDiv{ width:100%; }
  .cbcq-inner{ padding:22px 16px 26px; }
}

/* ---- light-grey treatment (the other option Joe offered) ---- */
.cbcq-footer--grey{
  --bg:#f3f3f3; --ink:#26303b; --head:#0f2438; --link:#006ed5; --link-hover:#0f2438;
  --legal:#46505b; --filing:#5a636d;
  --panel:#ffffff; --panel-bd:#d6dce3; --rule:#d7dde4; --redbar:#D32E2F;
}