nav[class^="navbar navbar-default"] div[class="container container-fluid"]
{
  width:auto !important;
}
li[class="show_hiddenlogo"] a[id="link365"]
{    
  margin-left: -45px;
}


/*member profile page > map navigation buttons css*/
html{font-size:16px;}

button[class="gm-control-active"][title="Move left"]{left:31px !important;;}
gmp-internal-camera-control[class="gmnoprint"] menu{top:-6px !important;}

/*end member profile page > map navigation buttons css*/


/**********Basic information form design css start***********/
@media (min-width: 768px) {
    #info-form-14 .col-sm-9, #info-form-15 .col-sm-9 {
        column-count: 2;
    }
}
@media (min-width: 992px) {
    #info-form-14 .col-sm-9, #info-form-15 .col-sm-9 {
        column-count: 4;
    }
}

.panel-title a > i.fa-warning{float:right !important;}


.check-style{
border: 1px solid green;
color: yellow;
background-color: red;
}



/*progress bar*/

.account-form-box .progress-container,
.member-connect-page-body .progress-container{
  width: 100%;
  background-color: #f0f0f0;
  height: 10px;
  position: relative;
  border-radius: 5px;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
}

.account-form-box .progress-bar,
.member-connect-page-body .progress-bar{
  height: 10px;
  position: absolute;
  border-radius: 25px;
  width: 0%;
  background-color: #080056;
  transition: width 0.5s ease-in-out;
}

.account-form-box .progress-text,
.member-connect-page-body .progress-text{
  text-align: center;
  margin-top: 12px;
  font-weight: bold;
  color: #333;
  font-size: 14px;
}
.account-menu-tabs .nav-tabs {
  padding-bottom: 15px;
}
.panel-heading{padding:0 !important;}
.panel-heading a {padding:10px 15px !important; display:block;}

.show-form {
  display: block !important;
  animation: show-form 0.5s ease-in-out forwards;
}
#accordion1 .panel-collapse {
	padding: 15px !important;
}
@keyframes show-form {
  from {
    opacity:0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.member-connect-page-body .form-group .radio {
  float: none;
}

.form-navigation-fixed {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  margin-top: 10px;
}
.member-connect-page-body .form-navigation-fixed {
  justify-content: flex-start;
}
#accordion1 .glyphicon {
    float: right;
}
div#step14 .col-sm-9 {
    width: 100% !important;
}
div#step14 .col-sm-3 label {
    
  text-align:left !important;
}
.nav-button {
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 25px;
  font-size: 14px;
  cursor: pointer;
  transition: background-color 0.3s ease;
  padding: 1rem 2rem;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.nav-button:hover:not(.disable-button) {
  background-color: #0056b3;
}

.disable-button {
  background-color: #ccc;
  color: #666;
  cursor: not-allowed;
}



/*nav tabbssss*/
.nav-tabs>li {
  padding: 0 5px;
}

.nav-tabs>li a {
  border-radius: 20px !important;
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
 
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
  background-color: #080056;
  color: white;
  box-shadow: none !important;
  border-top: none !important;
}

/*form input */
.form-control {
  border-radius: 15px !important;
  transition: border-color 0.3s ease-in-out, box-shadow 0.2s ease-in-out;
}

.input-group-addon {
  background-color: unset;
  padding-right: 5px !important;
}


/**********Basic information form desing css end***********/

button[class*="favorite fa fa-thumbs-up"]{
  display:none;
}


/********** search result page member profile logo hide and section full width ***********/

@media (min-width: 480px) {
  .member_results .img_section {
    display: none;
  }

  .member_results .mid_section {
    width: 100%;
  }
}

div[id="div2"][role="tabpanel"][aria-labelledby="t2 div2"]{
  padding-bottom : 25px;
}
/* ------------------  end  ------------------- */

.nav > li > a {
    padding: 10px 10px !important;
  
}

@media only screen and (max-width: 767px) {
    .header #link382 {
        margin: 0px !important;
        margin-bottom: 13px !important;
    }
    .tpad.slogan, #link381 {
        display: none;
    }
}

#link382, #link383 {
    padding: 5px 8px !important;
}

@media (min-width: 1100px) and (max-width: 1200px) {
    .navbar-default .navbar-nav > li > a {
        font-size: 14px !important;
    }
    .homepage_settings {
        padding: 60px 7px 90px 20px;
    }
}

@media (max-width: 1200px) {
    #link382 img {
        display: none;
    }
}

@media (max-width: 1200px) {
    #link382 img {
        display: inline-block !important;
    }
}

.header #link383, .header #link382 {
    padding: 5px 10px;
    margin: 8px;
}

.header .navbar {
    margin-bottom: 0px;
    padding-top: 5px;
}

.mobile_website_logo {
    top: 12px !important;
    right: auto;
}

#member_sidebar_toggle {
    display: none !important;
}

.user_sidebar > img {
    left: 2px !important;
}

/* ----------- Footer CSS ----------*/

.footer .row {
    margin-left: 26px;
    margin-right: -4px;
}

.scrollup {
    bottom: 12px !important;
}

.customm td {
    border: 1px solid white !important;
}

.well, .module {
    padding: 20px;
}

.member-search-description {
    margin-top: 10px !important;
}

.author-snapshot .btn:not(.send-message-button-solo):not(.modal .btn),
.author-snapshot span.author-phone {
    margin: 10px 0 !important;
}

.pic {
    box-shadow: none;
}

.fr-view .froala-table td img:first-of-type {
    margin: 0 auto;
}

/* ----------- Button Styling ----------*/

.btn-info {
    background-color: #167af2; /* White background */
    color: #FFFFFF; /* Black text */
    font-family: 'Montserrat', sans-serif; /* Montserrat font */
    font-weight: bold; /* Bold text */
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active,
.btn-info:active:focus,
.btn-info:active:hover {
    background-color: #e1e6fc; /* Light Lavender Mist background on hover */
    color: #000000;
}

#link382.btn_get_listed {
  background-color: #ffffff; /* white background */
  color: #000000 !important; /* black text */
  font-family: 'Montserrat', sans-serif; /* Montserrat font */
  font-weight: bold; /* Bold text */
  border: none;
}

#link382.btn_get_listed:hover {
  background-color: #f2f2f2; /* slightly off-white background */
  color: #000000 !important; /* black text */
  font-family: 'Montserrat', sans-serif; /* Montserrat font */
  font-weight: bold; /* Bold text */
}

#link383.btn-info {
  background-color: #167af2; /* blue background */
  color: white !important; /* white text */
  font-family: 'Montserrat', sans-serif; /* Montserrat font */
  font-weight: bold; /* Bold text */
  border: none;
}

#link383.btn-info:hover {
  background-color: #0056b3; /* slightly darker blue background */
  color: white !important; /* white text */
  font-family: 'Montserrat', sans-serif; /* Montserrat font */
  font-weight: bold; /* Bold text */
}


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap');

.navbar-default .navbar-nav > li > a {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    font-size: 16px;
}

/* Style for the down-pointing arrow */

.navbar-nav > li > a .caret {
    margin-left: 5px;
    border-top: 5px solid #fff;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    display: inline-block;
    width: 0;
    height: 0;
    vertical-align: middle;
}

/* Adjust arrow color on hover */

.navbar-nav > li > a:hover .caret {
    border-top-color: #E93F3B;
}

/* Account Menu Dropdown */

.account-menu {
    position: relative;
}

.account-menu .dropdown-menu {
    position: absolute;
    top: 0;
    left: 100%;
    min-width: 180px;
    background-color: #fff;
    border: 1px solid #ddd;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
    display: none;
}

.account-menu:hover .dropdown-menu {
    display: block;
}

footer {
    position: relative;
    background: #0d1829 !important;
    width: 100%;
    bottom: 0;
    left: 0;
}
footer .bottom-details {
    width: 100%;
    background: #0d1829 !important;
}

.homepage-section-1 {
  background: #0d1829;
}

.homepage-section-3 {
  background: #0d1829;
}

.homepage-section-4 {
  background: #0d1829;
}

.homepage-section-7 {
  background: #0d1829;
}

.homepage-section-10 {
  background: #0d1829;
}

.coverPhoto.center-block.img-rounded.tmargin {
    width: 100%;
    height: 400px;
    border-radius: 30px !important;
}


/* Final override: remove hero row padding across all breakpoints */
#first_container .homepage_settings {
  padding: 0 !important;
  margin: 0 !important;
}

/* If your inner column added spacing, neutralize it too */
#first_container .homepage_settings > .col-md-12 {
  padding: 0 !important;
  margin: 0 !important;
}

/* The title block is empty; make sure it isn't adding space */
#first_container .homepage_title.primary-hero-content {
  margin: 0 !important;
  padding: 0 !important;
}

/* Optional: collapse the empty clearfix divs inside the hero */
#first_container .homepage_settings .clearfix {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  clear: none !important;
}


/* Kill any header/nav bottom line on desktop */
.header,
.header .navbar,
.navbar,
.navbar-default,
#website-nav {
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* Some BD themes draw a 1px line with a pseudo element */
.header::after,
.navbar::after,
.navbar-default::after,
#website-nav::after {
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Ensure the first content block doesn't add its own top border */
#first_container,
#first_container .container,
.row-fluid.row.homepage_settings {
  border-top: 0 !important;
  box-shadow: none !important;
}

/* Keep hero spacing collapsed (from earlier fix) */
#first_container .homepage_settings { padding: 0 !important; margin: 0 !important; }
#first_container .homepage_settings > .col-md-12 { padding: 0 !important; margin: 0 !important; }
#first_container .homepage_title.primary-hero-content { margin: 0 !important; padding: 0 !important; }
#first_container .homepage_settings .clearfix { display: none !important; height: 0 !important; margin: 0 !important; padding: 0 !important; line-height: 0 !important; clear: none !important; }

/* Container: Uses Flexbox to align items side-by-side */
.state-intro-container {
    display: flex;
    flex-wrap: wrap;       /* Allows items to wrap on smaller screens */
    gap: 40px;             /* Adds space between the text and the map */
    align-items: center;   /* Vertically centers the map with the text */
    width: 100%;
    margin-bottom: 30px;
}

/* Text Column */
.state-intro-text {
    flex: 1 1 500px;       /* Takes up available space, but wraps if under 500px wide */
    min-width: 300px;      /* Ensures text never gets too squashed */
}

.state-intro-text h2 {
    margin-top: 0;
    color: #ffffff;        /* Matches your dark theme */
    font-size: 28px;
}

.state-intro-text p {
    font-size: 18px;
    line-height: 1.6;
    color: #ffffff;
    margin-bottom: 20px;
}

/* Map Column */
.state-intro-map {
    flex: 1 1 400px;       /* Takes up space but wraps if squeezed */
    display: flex;
    justify-content: center;
}

/* Mobile Responsive Rule */
@media (max-width: 768px) {
    .state-intro-container {
        flex-direction: column-reverse; /* Stacks map ON TOP of text for mobile users */
        gap: 20px;
    }
    
    .state-intro-text, .state-intro-map {
        flex: 1 1 100%;    /* Forces full width on mobile */
        width: 100%;
    }
}

/* --- GLOBAL DARK MODE --- */

/* 1. Force Background on Main Containers */
body, 
html, 
#first_container, 
.content-container, 
.body-content {
    background-color: #0d1829 !important;
    color: #ffffff !important;
}

/* 2. Ensure Headings are White */
h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important;
}

/* 3. Fix "White Box" Widgets (Wells, Modules, Panels) */
.well, 
.module, 
.panel, 
.panel-default, 
.list-group-item {
    background-color: #0d1829 !important;
    border-color: #0d1829 !important;
    color: #ffffff !important;
}

/* 4. Fix Links (so they are visible on dark background) */
a, a:hover, a:focus {
    color: #167af2;
}

/* --- Member profile breadcrumbs: alignment + spacing --- */
.breadcrumb,
.breadcrumbs,
ol.breadcrumb,
ul.breadcrumb {
  padding-left: 18px !important;
  padding-right: 18px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 1200px;
  box-sizing: border-box !important;
}
/* Glossary pages — match site navy instead of page-level black */
body:has(.glossary-wrapper),
.glossary-wrapper {
  background: #0d1829 !important;
}

/* Blog editor backend fix — scoped to #blog_article_fields
   Fixes white-on-white in Froala editor on /account/blog/edit */
#blog_article_fields .fr-wrapper,#blog_article_fields .fr-element,#blog_article_fields .fr-view{background:#ffffff !important;color:#0F1B2D !important;}
#blog_article_fields .fr-element p,#blog_article_fields .fr-element li,#blog_article_fields .fr-element span,#blog_article_fields .fr-element div,#blog_article_fields .fr-element td,#blog_article_fields .fr-element th{color:#0F1B2D !important;}
#blog_article_fields .fr-element a{color:#4F7CF0 !important;}
#blog_article_fields .fr-element a:hover{color:#2A56C6 !important;}
#blog_article_fields .fr-element strong,#blog_article_fields .fr-element b,#blog_article_fields .fr-element em,#blog_article_fields .fr-element i,#blog_article_fields .fr-element h1,#blog_article_fields .fr-element h2,#blog_article_fields .fr-element h3,#blog_article_fields .fr-element h4,#blog_article_fields .fr-element h5,#blog_article_fields .fr-element h6{color:#0F1B2D !important;}
#blog_article_fields .fr-placeholder{color:#6B6358 !important;}
#blog_article_fields .CodeMirror,#blog_article_fields .CodeMirror-scroll{background:#ffffff !important;color:#0F1B2D !important;}
#blog_article_fields .CodeMirror-gutters{background:#F7F4ED !important;border-right:1px solid #D9D2C2 !important;}
#blog_article_fields .CodeMirror-linenumber{color:#6B6358 !important;}
#blog_article_fields .CodeMirror pre,#blog_article_fields .CodeMirror pre *{color:#0F1B2D !important;}
#blog_article_fields .CodeMirror-cursor{border-left:2px solid #0F1B2D !important;}
#blog_article_fields .fr-toolbar{border-bottom:1px solid #D9D2C2 !important;}
#blog_article_fields .fr-element blockquote{color:#2B3648 !important;border-left:3px solid #4F7CF0 !important;padding-left:12px;}

/* ============================================
   BLOG POST DESIGN SYSTEM REDESIGN
   Scoped to .post-detail-body (blog post detail pages only).
   Safe to load globally — every selector starts with
   .post-detail-body or body:has(.post-detail-body).
============================================ */

/* Page-level cream background (only on blog post pages) */
body:has(.post-detail-body){background:#F7F4ED !important;}
body:has(.post-detail-body) .feature-post,
body:has(.post-detail-body) .feature-blog{background:transparent !important;}

/* CSS variables for the blog post — locally scoped */
.post-detail-body{
  --bp-bg: #F7F4ED;
  --bp-bg-deep: #EDE8DC;
  --bp-ink: #0F1B2D;
  --bp-ink-2: #2B3648;
  --bp-muted: #6B6358;
  --bp-line: #D9D2C2;
  --bp-line-2: #C8C0AE;
  --bp-paper: #FFFFFF;
  --bp-accent: #FFD43B;
  --bp-blue: #4F7CF0;
  --bp-blue-bg: #E8EFFF;
  --bp-radius: 14px;
  --bp-radius-sm: 8px;
  --bp-shadow: 0 1px 0 rgba(15,27,45,0.04), 0 8px 24px -12px rgba(15,27,45,0.12);
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif !important;
  color: var(--bp-ink) !important;
  background: var(--bp-bg) !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: clamp(24px, 4vw, 56px) clamp(20px, 4vw, 40px) !important;
  line-height: 1.6 !important;
}

/* Title block */
.post-detail-body .post-title{
  text-align: left !important;
  margin: 0 0 32px !important;
  padding: 0 !important;
  background: transparent !important;
  height: auto !important;
  max-width: 820px !important;
}
.post-detail-body .post-title h1,
.post-detail-body .post-title .hero_h1{
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: clamp(32px, 4.4vw, 52px) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.025em !important;
  color: var(--bp-ink) !important;
  margin: 0 !important;
  font-variation-settings: "SOFT" 50, "opsz" 144 !important;
  text-align: left !important;
}

/* Byline / posted-by row — restyled as design-system meta strip */
.post-detail-body .posted-by-snippet,
.post-detail-body .posted-by-row,
.post-detail-body .posted-by-row--meta{
  background: transparent !important;
  padding: 16px 0 !important;
  border-top: 1px solid var(--bp-line) !important;
  border-bottom: 1px solid var(--bp-line) !important;
  margin: 0 0 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
}
.post-detail-body .posted-by-meta-left{
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  letter-spacing: 0.04em !important;
  color: var(--bp-muted) !important;
  text-transform: uppercase !important;
}
.post-detail-body .posted-by-snippet-posted,
.post-detail-body .posted-by-snippet-date{
  color: var(--bp-muted) !important;
  font-family: inherit !important;
  font-size: inherit !important;
}
.post-detail-body .posted-by-snippet-posted strong,
.post-detail-body .posted-by-snippet-posted b{
  color: var(--bp-ink) !important;
  font-weight: 700 !important;
}
.post-detail-body .posted-by-snippet a{
  color: var(--bp-blue) !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

/* Share buttons — restyle as design-system pill buttons */
.post-detail-body .posted-by-print-wrap,
.post-detail-body .post-share-buttons,
.post-detail-body .share_buttons{
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}
.post-detail-body .posted-by-print-wrap a,
.post-detail-body .posted-by-print-wrap button,
.post-detail-body .post-share-buttons a,
.post-detail-body .share_buttons a{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 14px !important;
  background: var(--bp-paper) !important;
  border: 1px solid var(--bp-line) !important;
  border-radius: 100px !important;
  color: var(--bp-ink) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: all 0.15s ease !important;
}
.post-detail-body .posted-by-print-wrap a:hover,
.post-detail-body .posted-by-print-wrap button:hover,
.post-detail-body .post-share-buttons a:hover{
  border-color: var(--bp-ink) !important;
  background: var(--bp-bg) !important;
  transform: translateY(-1px) !important;
}

/* Hero image (post featured image) */
.post-detail-body .post-body img:first-of-type,
.post-detail-body img.post-featured-image,
.post-detail-body .post-image img{
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: var(--bp-radius) !important;
  border: 1px solid var(--bp-line) !important;
  margin: 0 0 32px !important;
  display: block !important;
  box-shadow: var(--bp-shadow) !important;
}

/* Post body — typography */
.post-detail-body .post-body{
  max-width: 760px !important;
  margin: 0 auto !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: var(--bp-ink-2) !important;
}
.post-detail-body .post-body p{
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: var(--bp-ink-2) !important;
  margin: 0 0 18px !important;
}
.post-detail-body .post-body p strong,
.post-detail-body .post-body p b{
  color: var(--bp-ink) !important;
  font-weight: 600 !important;
}
.post-detail-body .post-body p em,
.post-detail-body .post-body p i{
  font-style: italic !important;
  color: var(--bp-ink-2) !important;
}

/* Headings inside post body */
.post-detail-body .post-body h2{
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: clamp(24px, 2.8vw, 32px) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  color: var(--bp-ink) !important;
  margin: 44px 0 16px !important;
  font-variation-settings: "SOFT" 50, "opsz" 144 !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
}
.post-detail-body .post-body h3{
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: clamp(20px, 2vw, 24px) !important;
  line-height: 1.3 !important;
  letter-spacing: -0.015em !important;
  color: var(--bp-ink) !important;
  margin: 32px 0 12px !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
}
.post-detail-body .post-body h4,
.post-detail-body .post-body h5,
.post-detail-body .post-body h6{
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 600 !important;
  color: var(--bp-ink) !important;
  background: transparent !important;
}

/* Links inside post body */
.post-detail-body .post-body a{
  color: var(--bp-blue) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--bp-blue-bg) !important;
  transition: border-color 0.15s ease !important;
  font-weight: 500 !important;
}
.post-detail-body .post-body a:hover{
  border-bottom-color: var(--bp-blue) !important;
}

/* Lists */
.post-detail-body .post-body ul,
.post-detail-body .post-body ol{
  margin: 0 0 18px !important;
  padding-left: 24px !important;
}
.post-detail-body .post-body ul li,
.post-detail-body .post-body ol li{
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: var(--bp-ink-2) !important;
  margin: 0 0 8px !important;
  padding-left: 4px !important;
}
.post-detail-body .post-body ul li strong,
.post-detail-body .post-body ol li strong{
  color: var(--bp-ink) !important;
  font-weight: 600 !important;
}

/* Blockquotes — design-system pull quote */
.post-detail-body .post-body blockquote{
  font-family: 'Fraunces', Georgia, serif !important;
  font-style: italic !important;
  font-size: clamp(20px, 2.2vw, 24px) !important;
  line-height: 1.4 !important;
  color: var(--bp-ink) !important;
  background: transparent !important;
  border: none !important;
  border-left: 4px solid var(--bp-accent) !important;
  padding: 8px 0 8px 22px !important;
  margin: 28px 0 !important;
  font-variation-settings: "SOFT" 100, "WONK" 1, "opsz" 144 !important;
}

/* Code blocks (rare but supported) */
.post-detail-body .post-body code,
.post-detail-body .post-body pre{
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 14px !important;
  background: var(--bp-bg-deep) !important;
  color: var(--bp-ink) !important;
  border-radius: var(--bp-radius-sm) !important;
  padding: 2px 6px !important;
}
.post-detail-body .post-body pre{
  padding: 16px 20px !important;
  margin: 20px 0 !important;
  overflow-x: auto !important;
  border: 1px solid var(--bp-line) !important;
}

/* Images inside the body (not the first/hero one) */
.post-detail-body .post-body img{
  max-width: 100% !important;
  height: auto !important;
  border-radius: var(--bp-radius-sm) !important;
  margin: 20px 0 !important;
  display: block !important;
}

/* HR / dividers */
.post-detail-body .post-body hr{
  border: none !important;
  border-top: 1px solid var(--bp-line) !important;
  margin: 32px 0 !important;
}

/* Tags / category pill at bottom of body */
.post-detail-body .post-tags,
.post-detail-body .post-categories,
.post-detail-body .tag,
.post-detail-body .label{
  display: inline-block !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 10.5px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--bp-blue) !important;
  background: var(--bp-blue-bg) !important;
  padding: 4px 10px !important;
  border-radius: 100px !important;
  margin: 0 6px 6px 0 !important;
  text-decoration: none !important;
}

/* Comments container — restyle as design-system card */
.post-detail-body ~ .comments_container,
.feature-post .comments_container,
body:has(.post-detail-body) .comments_container{
  max-width: 820px !important;
  margin: 48px auto !important;
  padding: 28px 32px !important;
  background: var(--bp-paper) !important;
  border: 1px solid var(--bp-line) !important;
  border-radius: var(--bp-radius) !important;
  box-shadow: var(--bp-shadow) !important;
}
body:has(.post-detail-body) .comments_container h2,
body:has(.post-detail-body) .comments_container h3,
body:has(.post-detail-body) .comments_container .comment-header,
body:has(.post-detail-body) .comments_container .leave-comment-header{
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: clamp(22px, 2.4vw, 28px) !important;
  color: var(--bp-ink) !important;
  margin: 0 0 16px !important;
  background: transparent !important;
}
body:has(.post-detail-body) .comments_container input[type=text],
body:has(.post-detail-body) .comments_container textarea{
  background: var(--bp-bg) !important;
  border: 1px solid var(--bp-line) !important;
  border-radius: var(--bp-radius-sm) !important;
  color: var(--bp-ink) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14.5px !important;
  padding: 11px 14px !important;
}
body:has(.post-detail-body) .comments_container input[type=text]:focus,
body:has(.post-detail-body) .comments_container textarea:focus{
  border-color: var(--bp-ink) !important;
  background: var(--bp-paper) !important;
  outline: none !important;
}
body:has(.post-detail-body) .comments_container button,
body:has(.post-detail-body) .comments_container input[type=submit],
body:has(.post-detail-body) .comments_container .btn{
  background: var(--bp-ink) !important;
  color: var(--bp-paper) !important;
  border: 1px solid var(--bp-ink) !important;
  border-radius: var(--bp-radius-sm) !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  padding: 10px 22px !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
}
body:has(.post-detail-body) .comments_container button:hover,
body:has(.post-detail-body) .comments_container input[type=submit]:hover,
body:has(.post-detail-body) .comments_container .btn:hover{
  background: var(--bp-blue) !important;
  border-color: var(--bp-blue) !important;
  transform: translateY(-1px) !important;
}

/* Breadcrumb (if BD renders one) */
body:has(.post-detail-body) .breadcrumb,
body:has(.post-detail-body) [class*="breadcrumb"]{
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.04em !important;
  color: var(--bp-muted) !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 0 20px !important;
  text-transform: uppercase !important;
}
body:has(.post-detail-body) .breadcrumb a,
body:has(.post-detail-body) [class*="breadcrumb"] a{
  color: var(--bp-muted) !important;
  text-decoration: none !important;
}
body:has(.post-detail-body) .breadcrumb a:hover{
  color: var(--bp-ink) !important;
}

/* Mobile refinements */
@media (max-width: 700px){
  .post-detail-body{padding: 20px 16px !important;}
  .post-detail-body .posted-by-snippet,
  .post-detail-body .posted-by-row{
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .post-detail-body .post-body{font-size: 16px !important;}
  .post-detail-body .post-body p,
  .post-detail-body .post-body ul li,
  .post-detail-body .post-body ol li{font-size: 16px !important;}
  body:has(.post-detail-body) .comments_container{
    margin: 32px 16px !important;
    padding: 20px 18px !important;
  }
}


/* Blog post — page wrapper background fix (override the global navy) */
html:has(.post-detail-body),
body:has(.post-detail-body){background:#F7F4ED !important;}
body:has(.post-detail-body) #first_container,
body:has(.post-detail-body) #first_container.content-container,
body:has(.post-detail-body) #first_container.fr-view{background:#F7F4ED !important;}
body:has(.post-detail-body) .container,
body:has(.post-detail-body) .content_w_sidebar,
body:has(.post-detail-body) .feature-post,
body:has(.post-detail-body) .feature-blog{background:transparent !important;}


/* ============================================
   BLOG POST POLISH: real wrapper classes + sidebar cleanup
   ============================================ */

/* The actual body wrapper is .the-post-description (not .post-body).
   Mirror typography & spacing onto it. */
.post-detail-body .the-post-description,
.post-detail-body #post-content{
  max-width: 760px !important;
  margin: 0 auto !important;
  font-family: 'DM Sans', sans-serif !important;
  color: #2B3648 !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
}
.post-detail-body .the-post-description p,
.post-detail-body #post-content p{
  font-family: 'DM Sans', sans-serif !important;
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: #2B3648 !important;
  margin: 0 0 18px !important;
  opacity: 1 !important;
  -webkit-text-fill-color: #2B3648 !important;
  text-shadow: none !important;
}
.post-detail-body .the-post-description p strong,
.post-detail-body .the-post-description p b,
.post-detail-body #post-content p strong,
.post-detail-body #post-content p b{
  color: #0F1B2D !important;
  font-weight: 600 !important;
  -webkit-text-fill-color: #0F1B2D !important;
}
.post-detail-body .the-post-description h2,
.post-detail-body #post-content h2{
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: clamp(24px, 2.8vw, 32px) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
  color: #0F1B2D !important;
  -webkit-text-fill-color: #0F1B2D !important;
  margin: 44px 0 16px !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
}
.post-detail-body .the-post-description h3,
.post-detail-body #post-content h3{
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 500 !important;
  font-size: clamp(20px, 2vw, 24px) !important;
  line-height: 1.3 !important;
  color: #0F1B2D !important;
  -webkit-text-fill-color: #0F1B2D !important;
  margin: 32px 0 12px !important;
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
}
.post-detail-body .the-post-description a,
.post-detail-body #post-content a{
  color: #4F7CF0 !important;
  text-decoration: none !important;
  border-bottom: 1px solid #E8EFFF !important;
  font-weight: 500 !important;
}
.post-detail-body .the-post-description a:hover,
.post-detail-body #post-content a:hover{
  border-bottom-color: #4F7CF0 !important;
}
.post-detail-body .the-post-description ul li,
.post-detail-body .the-post-description ol li,
.post-detail-body #post-content ul li,
.post-detail-body #post-content ol li{
  font-size: 17px !important;
  line-height: 1.7 !important;
  color: #2B3648 !important;
  margin: 0 0 8px !important;
  -webkit-text-fill-color: #2B3648 !important;
}
.post-detail-body .the-post-description blockquote,
.post-detail-body #post-content blockquote{
  font-family: 'Fraunces', Georgia, serif !important;
  font-style: italic !important;
  font-size: clamp(20px, 2.2vw, 24px) !important;
  line-height: 1.4 !important;
  color: #0F1B2D !important;
  background: transparent !important;
  border: none !important;
  border-left: 4px solid #FFD43B !important;
  padding: 8px 0 8px 22px !important;
  margin: 28px 0 !important;
}
.post-detail-body .the-post-description img,
.post-detail-body #post-content img{
  max-width: 100% !important;
  height: auto !important;
  border-radius: 8px !important;
  margin: 20px 0 !important;
  display: block !important;
}
/* First image (hero) gets bigger radius + border */
.post-detail-body .the-post-description img:first-of-type,
.post-detail-body #post-content img:first-of-type{
  border-radius: 14px !important;
  border: 1px solid #D9D2C2 !important;
  box-shadow: 0 1px 0 rgba(15,27,45,0.04), 0 8px 24px -12px rgba(15,27,45,0.12) !important;
  margin: 0 0 32px !important;
}

/* Hide the sidebar messaging error widget on blog posts —
   it's not relevant to readers and only appears when author views own post */
body:has(.post-detail-body) .col-md-3.col-md-pull-9,
body:has(.post-detail-body) .feature-post > .col-md-3,
body:has(.post-detail-body) .content_w_sidebar > .col-md-3{
  display: none !important;
}
body:has(.post-detail-body) .col-md-9.col-md-push-3.post-detail-body{
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  float: none !important;
}

/* Breadcrumb at top — make readable on cream (was light text on navy) */
body:has(.post-detail-body) .breadcrumb,
body:has(.post-detail-body) [class*="breadcrumb"],
body:has(.post-detail-body) .breadcrumb-container,
body:has(.post-detail-body) #breadcrumb{
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.04em !important;
  color: #6B6358 !important;
  background: transparent !important;
  padding: 16px 0 !important;
  margin: 0 0 8px !important;
  text-transform: uppercase !important;
}
body:has(.post-detail-body) .breadcrumb a,
body:has(.post-detail-body) [class*="breadcrumb"] a{
  color: #6B6358 !important;
  text-decoration: none !important;
}
body:has(.post-detail-body) .breadcrumb a:hover{ color: #0F1B2D !important; }

/* Mobile alignment */
@media (max-width: 700px){
  .post-detail-body .the-post-description,
  .post-detail-body #post-content{ font-size: 16px !important; }
  .post-detail-body .the-post-description p,
  .post-detail-body .the-post-description ul li,
  .post-detail-body .the-post-description ol li,
  .post-detail-body #post-content p,
  .post-detail-body #post-content ul li,
  .post-detail-body #post-content ol li{ font-size: 16px !important; }
}


/* ============================================
   BLOG POST: v5 fixes
   - Content width matches menu (1200px)
   - Breadcrumb aligned with title (centered, max 1200px)
   - Reduced top spacing
   - Posted-by-snippet unified (no internal borders, single meta strip)
   ============================================ */

/* Widen content container to match menu width */
.post-detail-body{
  max-width: 1200px !important;
  padding-top: clamp(8px, 1.5vw, 18px) !important;
  padding-bottom: clamp(20px, 3vw, 40px) !important;
}

/* Reduce title block top margin so it sits closer to breadcrumb */
.post-detail-body .post-title{
  margin: 0 0 24px !important;
  max-width: none !important;
}

/* Breadcrumb: align with the title block (center within page, match content width) */
body:has(.post-detail-body) .breadcrumb,
body:has(.post-detail-body) ol.breadcrumb{
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 18px clamp(20px, 4vw, 40px) 4px !important;
  background: transparent !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.04em !important;
  color: #6B6358 !important;
  text-transform: uppercase !important;
  list-style: none !important;
  display: block !important;
}
body:has(.post-detail-body) .breadcrumb li,
body:has(.post-detail-body) ol.breadcrumb li{
  display: inline !important;
  color: #6B6358 !important;
  background: transparent !important;
}
body:has(.post-detail-body) .breadcrumb a,
body:has(.post-detail-body) ol.breadcrumb a{
  color: #6B6358 !important;
  text-decoration: none !important;
  border: none !important;
  font-weight: 600 !important;
}
body:has(.post-detail-body) .breadcrumb a:hover{ color: #0F1B2D !important; }

/* Posted-by-snippet — unify into single bordered meta strip */
.post-detail-body .posted-by-snippet{
  background: transparent !important;
  border-top: 1px solid #D9D2C2 !important;
  border-bottom: 1px solid #D9D2C2 !important;
  padding: 14px 0 !important;
  margin: 0 0 32px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px 24px !important;
}
/* Strip ALL internal borders from sub-rows */
.post-detail-body .posted-by-snippet .posted-by-row,
.post-detail-body .posted-by-snippet .posted-by-row--meta,
.post-detail-body .posted-by-snippet .posted-by-row--readtime,
.post-detail-body .posted-by-snippet .posted-by-row--actions{
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 0 0 auto !important;
  width: auto !important;
}
/* Meta row (posted / date / by author) — sits on the left */
.post-detail-body .posted-by-snippet .posted-by-row--meta{
  flex: 1 1 auto !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  letter-spacing: 0.04em !important;
  color: #6B6358 !important;
  text-transform: uppercase !important;
  flex-wrap: wrap !important;
}
.post-detail-body .posted-by-snippet .posted-by-row--meta strong,
.post-detail-body .posted-by-snippet .posted-by-row--meta b{
  color: #0F1B2D !important;
  font-weight: 700 !important;
}
.post-detail-body .posted-by-snippet .posted-by-row--meta a{
  color: #4F7CF0 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  border: none !important;
}
/* Read time — keep but inline with everything else */
.post-detail-body .posted-by-snippet .posted-by-row--readtime{
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  letter-spacing: 0.04em !important;
  color: #6B6358 !important;
  text-transform: uppercase !important;
  font-style: normal !important;
}
.post-detail-body .posted-by-snippet .posted-by-row--readtime *{
  font-style: normal !important;
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
}
/* Hide any avatar/image inside meta (it's empty/broken) */
.post-detail-body .posted-by-snippet .posted-by-row--meta img:not(.posted-by-print-wrap img){
  display: none !important;
}
/* Print button — tighter */
.post-detail-body .posted-by-snippet .print-btn{
  padding: 6px 14px !important;
  margin: 0 !important;
  border-radius: 100px !important;
  border: 1px solid #D9D2C2 !important;
  background: #ffffff !important;
  color: #0F1B2D !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  float: none !important;
  border-bottom: 1px solid #D9D2C2 !important;
}

/* Mobile: stack meta strip vertically */
@media (max-width: 700px){
  .post-detail-body .posted-by-snippet{
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }
}


/* ============================================
   BLOG POST: v6 width alignment
   Force breadcrumb + title + body to align at same left edge.
   Use compound selectors to beat earlier rules.
   ============================================ */

/* Force post-detail-body to match menu container width */
.col-md-9.post-detail-body,
div.post-detail-body,
.post-detail-body.page-body{
  max-width: 1200px !important;
  width: auto !important;
  float: none !important;
  padding-left: clamp(20px, 4vw, 40px) !important;
  padding-right: clamp(20px, 4vw, 40px) !important;
}

/* Title block: full width (left-aligned with breadcrumb) */
.post-detail-body .post-title,
.post-detail-body div.post-title,
.post-detail-body > .post-title{
  max-width: none !important;
  width: 100% !important;
  margin: 0 0 24px !important;
  padding: 0 !important;
  text-align: left !important;
}
.post-detail-body .post-title h1,
.post-detail-body .post-title .hero_h1,
.post-detail-body div.post-title h1{
  max-width: 900px !important;
  text-align: left !important;
}

/* Posted-by-snippet: full width of content area (not narrow centered) */
.post-detail-body .posted-by-snippet,
.post-detail-body div.posted-by-snippet,
.post-detail-body > .posted-by-snippet{
  max-width: none !important;
  width: 100% !important;
}

/* #post-content and .the-post-description: full container width */
.post-detail-body #post-content,
.post-detail-body div#post-content,
.post-detail-body .the-post-description,
.post-detail-body div.the-post-description{
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* But constrain paragraphs/lists for readability — narrower than container */
.post-detail-body #post-content > p,
.post-detail-body #post-content > ul,
.post-detail-body #post-content > ol,
.post-detail-body #post-content > blockquote,
.post-detail-body .the-post-description > p,
.post-detail-body .the-post-description > ul,
.post-detail-body .the-post-description > ol,
.post-detail-body .the-post-description > blockquote{
  max-width: 760px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* H2/H3 + images can be wider — sit at full content width up to a cap */
.post-detail-body #post-content > h2,
.post-detail-body #post-content > h3,
.post-detail-body .the-post-description > h2,
.post-detail-body .the-post-description > h3{
  max-width: 900px !important;
  margin-left: 0 !important;
}
.post-detail-body #post-content > img,
.post-detail-body #post-content > p > img,
.post-detail-body .the-post-description > img,
.post-detail-body .the-post-description > p > img{
  max-width: 100% !important;
  width: auto !important;
}

/* Breadcrumb: match the post-detail-body inner content edge */
body:has(.post-detail-body) .breadcrumb,
body:has(.post-detail-body) ol.breadcrumb{
  max-width: 1200px !important;
  padding: 18px clamp(20px, 4vw, 40px) 4px !important;
  margin: 0 auto !important;
}


/* ============================================
   BLOG POST: v7 final width alignment
   Use body:has() prefix to beat earlier same-specificity rules.
   ============================================ */

body:has(.post-detail-body) .col-md-9.col-md-push-3.post-detail-body,
body:has(.post-detail-body) div.col-md-9.post-detail-body,
body:has(.post-detail-body) .post-detail-body{
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  float: none !important;
  padding-left: clamp(20px, 4vw, 40px) !important;
  padding-right: clamp(20px, 4vw, 40px) !important;
}

body:has(.post-detail-body) .post-detail-body .post-title,
body:has(.post-detail-body) .post-detail-body div.post-title{
  max-width: none !important;
  width: 100% !important;
  margin: 0 0 24px !important;
}
body:has(.post-detail-body) .post-detail-body .post-title h1{
  max-width: 900px !important;
}

body:has(.post-detail-body) .post-detail-body .the-post-description,
body:has(.post-detail-body) .post-detail-body #post-content,
body:has(.post-detail-body) .post-detail-body .post-body{
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
}

body:has(.post-detail-body) .post-detail-body .posted-by-snippet{
  max-width: none !important;
  width: 100% !important;
}

/* Constrain only the reading text for line-length comfort */
body:has(.post-detail-body) .post-detail-body #post-content > p,
body:has(.post-detail-body) .post-detail-body #post-content > ul,
body:has(.post-detail-body) .post-detail-body #post-content > ol,
body:has(.post-detail-body) .post-detail-body #post-content > blockquote,
body:has(.post-detail-body) .post-detail-body .the-post-description > p,
body:has(.post-detail-body) .post-detail-body .the-post-description > ul,
body:has(.post-detail-body) .post-detail-body .the-post-description > ol,
body:has(.post-detail-body) .post-detail-body .the-post-description > blockquote{
  max-width: 760px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body:has(.post-detail-body) .post-detail-body #post-content > h2,
body:has(.post-detail-body) .post-detail-body #post-content > h3,
body:has(.post-detail-body) .post-detail-body .the-post-description > h2,
body:has(.post-detail-body) .post-detail-body .the-post-description > h3{
  max-width: 900px !important;
  margin-left: 0 !important;
}

/* Comments container also widens to 1100 within new wider container */
body:has(.post-detail-body) .comments_container{
  max-width: 900px !important;
  margin: 48px auto !important;
}


/* ============================================
   BLOG POST: v8 polish
   (1) Fix cream sliver above navbar — revert html/body to navy, keep #first_container cream
   (2) Comments container aligned with body content (no center-shift)
   (3) Paragraphs wider — fill content area
   (4) Author headshot in meta strip
   ============================================ */

/* (1) Revert html/body to navy so the 26px navbar offset shows navy.
   #first_container stays cream and covers the full content area. */
html:has(.post-detail-body){background:#0F1B2D !important;}
body:has(.post-detail-body){background:#0F1B2D !important;}
body:has(.post-detail-body) #first_container,
body:has(.post-detail-body) #first_container.content-container,
body:has(.post-detail-body) #first_container.fr-view{
  background:#F7F4ED !important;
}

/* (2) Comments container — align with body content left edge */
body:has(.post-detail-body) .comments_container{
  max-width: 1120px !important;
  margin: 48px auto !important;
}

/* (3) Paragraphs/lists/blockquotes — wider for less right-side whitespace */
body:has(.post-detail-body) .post-detail-body #post-content > p,
body:has(.post-detail-body) .post-detail-body #post-content > ul,
body:has(.post-detail-body) .post-detail-body #post-content > ol,
body:has(.post-detail-body) .post-detail-body #post-content > blockquote,
body:has(.post-detail-body) .post-detail-body .the-post-description > p,
body:has(.post-detail-body) .post-detail-body .the-post-description > ul,
body:has(.post-detail-body) .post-detail-body .the-post-description > ol,
body:has(.post-detail-body) .post-detail-body .the-post-description > blockquote{
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body:has(.post-detail-body) .post-detail-body #post-content > h2,
body:has(.post-detail-body) .post-detail-body #post-content > h3,
body:has(.post-detail-body) .post-detail-body .the-post-description > h2,
body:has(.post-detail-body) .post-detail-body .the-post-description > h3{
  max-width: none !important;
}

/* (4) Author headshot — inject via pseudo-element on the meta row.
   For now hardcoded to Ryan's photo; a JS hook can override per-author. */
.post-detail-body .posted-by-snippet .posted-by-row--meta::before{
  content: '' !important;
  display: inline-block !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background-image: url('https://www.3plhub.co/pictures/profile/pimage-19-316-photo.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
  border: 1px solid #D9D2C2 !important;
  flex-shrink: 0 !important;
  margin-right: 4px !important;
}
/* Make sure the avatar shows even when meta row is flex */
.post-detail-body .posted-by-snippet .posted-by-row--meta{
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}


/* ============================================
   BLOG POST: v9 meta strip + hero polish
   - Border-left/right were navy (BD default) → unify all 4 sides
   - "BY" was white (BD default) → muted
   - Read-time was light grey (BD default) → muted
   - Print button restyled to match Share buttons
   - Add printer icon
   - Hero image wrapper (.alert-secondary) — remove grey frame
   - Tighten header spacing
   ============================================ */

/* Meta box — uniform border + radius */
.post-detail-body .posted-by-snippet{
  border: 1px solid #D9D2C2 !important;
  border-radius: 10px !important;
  padding: 12px 18px !important;
  background: transparent !important;
  gap: 16px 20px !important;
}

/* Tighten meta row layout */
.post-detail-body .posted-by-snippet .posted-by-row--meta{
  gap: 12px !important;
}
.post-detail-body .posted-by-snippet .posted-by-row--meta::before{
  margin-right: 4px !important;
  width: 34px !important;
  height: 34px !important;
}

/* "BY" and "by" word — override BD white default */
.post-detail-body .posted-by-snippet .posted-by-snippet-category,
.post-detail-body .posted-by-snippet .posted-by-snippet-category *:not(a),
.post-detail-body .posted-by-snippet span.inline-block.posted-by-snippet-category{
  color: #6B6358 !important;
  -webkit-text-fill-color: #6B6358 !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  background: transparent !important;
}
/* Author name link stays blue */
.post-detail-body .posted-by-snippet .posted-by-snippet-category a,
.post-detail-body .posted-by-snippet .posted-by-row--meta a{
  color: #4F7CF0 !important;
  -webkit-text-fill-color: #4F7CF0 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  border: none !important;
}

/* Estimated read time — fix light-grey BD default */
.post-detail-body .posted-by-snippet .posted-by-row--readtime,
.post-detail-body .posted-by-snippet .posted-by-row--readtime *{
  color: #6B6358 !important;
  -webkit-text-fill-color: #6B6358 !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11.5px !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  font-style: normal !important;
  font-weight: 500 !important;
}
.post-detail-body .posted-by-snippet .posted-by-row--readtime strong{
  font-weight: 700 !important;
  color: #0F1B2D !important;
  -webkit-text-fill-color: #0F1B2D !important;
}

/* Print button — match Share button style (solid ink, rounded sq corners, with icon) */
.post-detail-body .posted-by-snippet .print-btn,
.post-detail-body .posted-by-snippet a.print-btn,
.post-detail-body .posted-by-snippet .btn.print-btn{
  background: #0F1B2D !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid #0F1B2D !important;
  border-bottom: 1px solid #0F1B2D !important;
  border-radius: 4px !important;
  padding: 8px 14px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  font-style: normal !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  float: none !important;
  margin: 0 !important;
  line-height: 1 !important;
}
.post-detail-body .posted-by-snippet .print-btn::before{
  content: '' !important;
  display: inline-block !important;
  width: 14px !important;
  height: 14px !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 6 2 18 2 18 9'/><path d='M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2'/><rect x='6' y='14' width='12' height='8'/></svg>") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
.post-detail-body .posted-by-snippet .print-btn:hover{
  background: #2B3648 !important;
  border-color: #2B3648 !important;
}

/* Hero image wrapper — kill BD's grey alert-secondary frame */
.post-detail-body .alert-secondary,
.post-detail-body div.alert-secondary,
.post-detail-body .alert-secondary.btn-block,
.post-detail-body .btn-block.alert-secondary{
  background: transparent !important;
  background-color: transparent !important;
  padding: 0 !important;
  border: none !important;
  margin: 0 0 32px !important;
  color: inherit !important;
}

/* Tighten header spacing */
.post-detail-body .post-title{
  margin: 0 0 18px !important;
}
.post-detail-body{
  padding-top: clamp(6px, 1vw, 14px) !important;
}

/* Site-wide alignment — align page content with header */
.h3h-inner,
#first_container > .container,
.hero_section_container > .container,
.h3f-wrap {
  max-width: 1240px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
}

/* Billing page: panel was white but text is light - make panel transparent so it inherits the dark dashboard and text is legible (moved from widget 228 CSS field 2026-07-08; that field renders as a style block before the doctype) */
.tab-content.billing-information { background: transparent !important; }

/* ============================================================
   3PL HUB GLOSSARY - CONSOLIDATED STANDARD (added 2026-07-14)
   Gold headings + sky-blue links + full component styles.
   Higher-specificity heading rule overrides the glossary widget's blue.
   ============================================================ */
.glossary-card .glossary-heading, .glossary-wrapper .glossary-heading{ color:#f9ca48 !important; font-size:32px !important; font-family:'Poppins',sans-serif; font-weight:800; line-height:1.2; letter-spacing:-0.02em; margin:48px 0 16px; }
.glossary-heading:first-child{ margin-top:0 !important; }
.glossary-subheading{ font-family:'Poppins',sans-serif; font-weight:800; font-size:18px; letter-spacing:-0.01em; color:#ffffff; margin:24px 0 12px; }
.glossary-card p, .glossary-card li{ color:#E6E6F0; font-size:17px; line-height:1.75; }
.glossary-card a{ color:#38BDF8 !important; text-decoration:underline; font-weight:600; transition:opacity .2s ease; }
.glossary-card a:hover{ opacity:.8; text-decoration:none; }
.glossary-definition{ color:#E6E6F0; }
.glossary-updated{ color:#9CA3AF; font-size:14px; margin-top:32px; }
.glossary-intro-split{ display:grid; grid-template-columns:1fr 360px; gap:32px; align-items:start; margin:18px 0 26px; }
.glossary-intro-media{ margin:0; }
.glossary-intro-media img{ width:100%; height:auto; border-radius:16px; border:1px solid rgba(255,255,255,0.08); background:#0f0f17; display:block; }
.glossary-key-takeaways{ list-style:none; padding-left:0; margin:0; display:grid; gap:12px; }
.glossary-key-takeaways li{ margin:0; padding:14px 16px; background:#0f0f17; border:1px solid rgba(255,255,255,0.08); border-left:4px solid #f9ca48; border-radius:12px; color:#E6E6F0; }
.glossary-key-takeaways strong{ color:#f9ca48; }
.glossary-code-card{ background:#0f0f17; border:1px solid rgba(255,255,255,0.08); border-radius:16px; padding:24px; margin:20px 0; transition:border-color .25s ease, box-shadow .25s ease; }
.glossary-code-card:hover{ border-color:#f9ca48; box-shadow:0 0 0 1px rgba(249,202,72,0.3), 0 15px 40px rgba(0,0,0,0.5); }
.glossary-code-card h3, .glossary-code-card strong{ color:#ffffff !important; }
.glossary-code-card p{ margin:0 0 8px; color:#E6E6F0; font-size:16px; line-height:1.65; }
.glossary-code-card ul{ margin:0; }
.glossary-code-card a{ color:#38BDF8 !important; }
@media (max-width:900px){ .glossary-intro-split{ grid-template-columns:1fr; } .glossary-intro-media{ order:-1; max-width:520px; } }
@media (max-width:768px){ .glossary-card .glossary-heading, .glossary-wrapper .glossary-heading{ font-size:26px !important; margin:32px 0 12px; } .glossary-card p, .glossary-card li{ font-size:16px; } }

/* ================================================================
   3PL HUB — CHECKOUT RESKIN  (all /checkout/* plan pages)
   Scope: everything is scoped under .checkout-page-body (or the
   .pagehead.checkout-title hero), which ONLY exists on checkout
   pages, so this is safe to append to global website_css.
   Pairs with the checkout enhancer script in website_footer,
   which injects .h3c-aside (plan summary) and .h3c-faq (mini FAQ).
   ================================================================ */

/* ---- layout ----
   NOTE: BD's checkout template renders TWO .checkout-page-body divs:
   one holding the .pagehead hero, a second holding the .well form.
   The enhancer tags the form container with .h3c-grid; grid rules
   live on that class so nothing breaks if JS is absent. ---- */
.checkout-page-body {
  float: none !important;
  width: 100% !important;
  max-width: 1140px;
  margin: 0 auto !important;
  padding: 0 24px !important;
}
.checkout-page-body::before,
.checkout-page-body::after { content: none !important; }
.checkout-page-body > .clearfix { display: none; }

.checkout-page-body.h3c-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 340px;
  column-gap: 36px;
  align-items: start;
  padding-bottom: 72px !important;
}
.checkout-page-body > .pagehead.checkout-title {
  text-align: center;
  padding: 34px 0 22px !important;
  margin: 0 !important;
  background: transparent !important;
}
.h3c-grid > .well {
  grid-column: 1;
  grid-row: 1;
}
.h3c-grid > .h3c-aside {
  grid-column: 2;
  grid-row: 1;
}


@media (max-width: 900px) {
  .checkout-page-body.h3c-grid {
    display: flex;
    flex-direction: column;
    padding: 0 16px 56px !important;
  }
  .h3c-grid > .h3c-aside {
    order: -1;
    position: static !important;
    margin: 0 0 24px;
  }
}

/* ---- hero / pagehead ---- */
.checkout-page-body .checkout-title h1 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  font-size: clamp(1.7rem, 3.2vw, 2.4rem) !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}
.h3c-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(249,202,72,0.12);
  border: 1px solid rgba(249,202,72,0.35);
  color: #F9CA48;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 20px;
  margin-bottom: 14px;
}
.h3c-sub {
  color: rgba(255,255,255,0.6);
  font-size: 15px;
  margin-top: 10px;
}
.h3c-back {
  display: inline-block;
  margin-top: 12px;
  color: rgba(255,255,255,0.55);
  font-size: 13px;
  text-decoration: none;
}
.h3c-back:hover { color: #ffffff; text-decoration: none; }

/* ---- the form card ---- */
.checkout-page-body .well.h3c-card {
  background: #101d31 !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 16px !important;
  box-shadow: 0 24px 60px -30px rgba(0,0,0,0.6) !important;
  padding: 34px 34px 30px !important;
  margin-bottom: 0 !important;
}
@media (max-width: 900px) {
  .checkout-page-body .well.h3c-card { padding: 24px 18px !important; }
}

/* section titles ("Enter Email...", "Select a Payment Option", ...) */
.checkout-page-body .account-menu-title {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em;
  padding-bottom: 12px;
  margin: 26px 0 20px !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}
.checkout-page-body .account-menu-title::before {
  content: '';
  flex: none;
  width: 4px;
  height: 18px;
  border-radius: 2px;
  background: linear-gradient(180deg, #167af2, #F9CA48);
}
.checkout-page-body #emailContainer .account-menu-title:first-of-type { margin-top: 0 !important; }

/* ---- labels & helper text ---- */
.checkout-page-body label,
.checkout-page-body .vertical-label,
.checkout-page-body .card_number_text,
.checkout-page-body .security_code_text {
  color: rgba(255,255,255,0.88) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
}
.checkout-page-body .help-block,
.checkout-page-body .text-muted,
.checkout-page-body small,
.checkout-page-body .company_optional_text {
  color: rgba(255,255,255,0.55) !important;
  font-size: 12.5px !important;
}
.checkout-page-body .required,
.checkout-page-body label .req,
.checkout-page-body label span[style*="red"] { color: #ff8f8f !important; }

/* ---- inputs / selects ---- */
.checkout-page-body input.form-control,
.checkout-page-body select.form-control,
.checkout-page-body input[type=text],
.checkout-page-body input[type=email],
.checkout-page-body input[type=password],
.checkout-page-body select {
  background: #ffffff !important;
  color: #0f1b2d !important;
  border: 1.5px solid transparent !important;
  border-radius: 9px !important;
  min-height: 44px;
  font-size: 14.5px !important;
  box-shadow: inset 0 1px 2px rgba(13,24,41,0.12) !important;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.checkout-page-body input.form-control:focus,
.checkout-page-body select.form-control:focus,
.checkout-page-body input:focus,
.checkout-page-body select:focus {
  border-color: #167af2 !important;
  box-shadow: 0 0 0 3px rgba(22,122,242,0.35) !important;
  outline: none !important;
}
.checkout-page-body ::placeholder { color: #8a94a6 !important; opacity: 1; }

/* password eye toggle */
.checkout-page-body #togglePassword {
  background: transparent !important;
  border: none !important;
  color: #55627a !important;
}

/* validation errors */
.checkout-page-body .has-error .form-control { border-color: #ff5b49 !important; }
.checkout-page-body .has-error label,
.checkout-page-body .help-block.with-errors,
.checkout-page-body .errors,
.checkout-page-body .fv-help-block {
  color: #ff8f8f !important;
}

/* ---- radio (billing term) ---- */
.checkout-page-body .yearly_billing label,
.checkout-page-body .one_time_setup_fee {
  color: rgba(255,255,255,0.85) !important;
  font-weight: 600 !important;
}
.checkout-page-body input[type=radio],
.checkout-page-body input[type=checkbox] {
  accent-color: #167af2;
  width: 16px;
  height: 16px;
}

/* ---- promo code + order summary ---- */
.checkout-page-body .promo-code-module {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 18px 20px;
  margin: 18px 0;
}
.checkout-page-body .promo-code-module label { font-size: 13px !important; }
.checkout-page-body .promo-code-module .btn {
  background: rgba(255,255,255,0.12) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,0.2) !important;
  border-radius: 8px !important;
  font-weight: 600;
}
.checkout-page-body .promo-code-module .btn:hover {
  background: rgba(255,255,255,0.2) !important;
}
.checkout-page-body .promo-code-module table,
.checkout-page-body .promo-code-module td,
.checkout-page-body .promo-code-module th {
  color: rgba(255,255,255,0.85) !important;
  border-color: rgba(255,255,255,0.1) !important;
}

/* ---- credit card row (hosted iframe sits on white strip) ---- */
.checkout-page-body .input-credit-card-field {
  background: #ffffff;
  border-radius: 9px;
  padding: 6px 10px;
  box-shadow: inset 0 1px 2px rgba(13,24,41,0.12);
}

/* ---- consent / terms box ---- */
.checkout-page-body .signup-consent-box {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  padding: 18px 20px !important;
  margin-top: 22px;
}
.checkout-page-body .signup-consent-box,
.checkout-page-body .signup-consent-box label,
.checkout-page-body .signup-consent-box p {
  color: rgba(255,255,255,0.75) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.55;
}
.checkout-page-body .signup-consent-box a { color: #7db8f7 !important; }

/* ---- buttons ---- */
.checkout-page-body .btn-success,
.checkout-page-body #nextToCheckout,
.checkout-page-body .form-actions .btn {
  background: linear-gradient(180deg, #3b7bf0, #2f6bed) !important;
  border: none !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  padding: 14px 22px !important;
  box-shadow: 0 10px 24px -10px rgba(47,107,237,0.7) !important;
  transition: transform 0.15s, box-shadow 0.15s, filter 0.15s;
}
.checkout-page-body .btn-success:hover,
.checkout-page-body #nextToCheckout:hover,
.checkout-page-body .form-actions .btn:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  color: #ffffff !important;
}
.checkout-page-body .form-actions .btn[disabled],
.checkout-page-body .form-actions .btn.disabled {
  background: rgba(255,255,255,0.14) !important;
  color: rgba(255,255,255,0.5) !important;
  box-shadow: none !important;
  transform: none;
  cursor: not-allowed;
}
.checkout-page-body .form-actions { margin-top: 20px; }

/* secure line under the pay button (added by enhancer) */
.h3c-secure {
  text-align: center;
  color: rgba(255,255,255,0.5);
  font-size: 12.5px;
  margin-top: 12px;
}

/* logged-in username notice + back link */
.checkout-page-body .displayUserName,
.checkout-page-body .alert-success {
  background: rgba(43,209,126,0.1) !important;
  border: 1px solid rgba(43,209,126,0.35) !important;
  color: #7fe0ae !important;
  border-radius: 10px !important;
}
.checkout-page-body .goBack {
  color: rgba(255,255,255,0.55) !important;
  font-size: 13px;
}
.checkout-page-body .goBack:hover { color: #ffffff !important; }

/* ================================================================
   PLAN SUMMARY ASIDE  (.h3c-aside — injected by enhancer)
   ================================================================ */
.h3c-aside {
  position: sticky;
  top: 96px;
  background: linear-gradient(160deg, #14253e, #101d31) !important;
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 16px;
  padding: 26px 26px 22px;
  box-shadow: 0 24px 60px -30px rgba(0,0,0,0.6);
}
.h3c-aside-eyebrow {
  color: #F9CA48;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.h3c-aside-name {
  color: #ffffff;
  font-size: 21px;
  font-weight: 700;
  margin: 0 0 4px;
}
.h3c-aside-price {
  color: #ffffff;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.01em;
  margin: 10px 0 2px;
}
.h3c-aside-price span {
  font-size: 14px;
  font-weight: 600;
  color: rgba(255,255,255,0.55);
}
.h3c-aside-note {
  color: rgba(255,255,255,0.55);
  font-size: 12.5px;
  margin-bottom: 16px;
}
.h3c-aside-divider {
  border: none;
  border-top: 1px solid rgba(255,255,255,0.1);
  margin: 16px 0;
}
.h3c-aside-label {
  color: rgba(255,255,255,0.5);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.h3c-aside ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.h3c-aside ul li {
  position: relative;
  padding: 5px 0 5px 26px;
  color: rgba(255,255,255,0.82);
  font-size: 13.5px;
  line-height: 1.45;
}
.h3c-aside ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: rgba(43,209,126,0.15);
  border: 1px solid rgba(43,209,126,0.5);
}
.h3c-aside ul li::after {
  content: '';
  position: absolute;
  left: 4.5px;
  top: 11.5px;
  width: 7px;
  height: 4.5px;
  border-left: 2px solid #2BD17E;
  border-bottom: 2px solid #2BD17E;
  transform: rotate(-45deg);
}
.h3c-trust {
  margin-top: 18px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 14px 16px;
}
.h3c-trust div {
  color: rgba(255,255,255,0.65);
  font-size: 12.5px;
  padding: 3px 0;
}
.h3c-trust div strong { color: rgba(255,255,255,0.85); }

/* ================================================================
   MINI FAQ  (.h3c-faq — injected by enhancer)
   ================================================================ */
.h3c-faq {
  max-width: 1140px;
  margin: 48px auto 0;
  padding: 0 24px 72px;
}
.h3c-faq-title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  margin: 0 0 22px;
}
.h3c-faq-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media (max-width: 760px) {
  .h3c-faq-grid { grid-template-columns: 1fr; }
}
.h3c-faq details {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 0 18px;
  transition: background 0.15s;
}
.h3c-faq details[open] { background: rgba(255,255,255,0.05); }
.h3c-faq summary {
  list-style: none;
  cursor: pointer;
  color: #ffffff;
  font-size: 14.5px;
  font-weight: 600;
  padding: 15px 26px 15px 0;
  position: relative;
  outline: none;
}
.h3c-faq summary::-webkit-details-marker { display: none; }
.h3c-faq summary::after {
  content: '+';
  position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(-50%);
  color: #F9CA48;
  font-size: 19px;
  font-weight: 600;
}
.h3c-faq details[open] summary::after { content: '–'; }
.h3c-faq details p {
  color: rgba(255,255,255,0.68) !important;
  font-size: 13.5px;
  line-height: 1.6;
  margin: 0;
  padding: 0 0 16px;
}

/* Lead Status: make "Accepted" badge green (added 2026-08-31) */
.label.label-success {
    background-color: #28a745 !important;
    color: #fff !important;
}

/* ===== Publish Content dashboard buttons (added 2026-08-31) ===== */
/* #first_container prefix needed to out-rank the '#first_container *' white-space rule */
#first_container .dashboard-publish-content .panel-body { display: flex !important; flex-wrap: wrap; gap: 12px; }
#first_container .dashboard-publish-content .panel-body > [class*="col-"] { width: auto !important; flex: 1 1 auto; padding: 0 !important; }
#first_container .dashboard-publish-content .panel-body a.alert.btn-default.btn-block {
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px;
    margin-bottom: 0 !important;
    height: 100%;
}
/* Blog Article button: restore a pencil icon + verb label (its visible text is CSS-injected) */
#first_container .dashboard-publish-content a[href="/account/blog/add"] { text-indent: 0 !important; font-size: 0 !important; }
#first_container .dashboard-publish-content a[href="/account/blog/add"]::before {
    content: "";
    font: normal normal normal 14px/1 FontAwesome;
    color: rgb(77,163,255);
}
#first_container .dashboard-publish-content a[href="/account/blog/add"]::after {
    content: "Write Blog Post" !important;
    display: inline !important;
    font-size: 13.5px !important;
    text-indent: 0 !important;
    text-align: left !important;
    white-space: nowrap !important;
}


/* Publish Content: icon box refinement (added 2026-08-31) */
#first_container .dashboard-publish-content .panel-body a i { width: 18px !important; min-width: 18px !important; margin-right: 0 !important; text-align: center !important; }
#first_container .dashboard-publish-content .panel-body a.alert.btn-default.btn-block { gap: 8px !important; column-gap: 8px !important; }

/* Dropdown option readability (added 2026-08-31): options inherited the theme's light text color, unreadable on the native white dropdown popup */
select option {
    color: #363848 !important;
    background-color: #ffffff !important;
}

/* Member logo fit (added 2026-08-31): non-square logos were cropped by object-fit cover; contain shows the whole logo letterboxed on white */
img.ph-avatar.ph-avatar,
.ph-profile-page .ph-hero-dark img.ph-avatar.ph-avatar {
    object-fit: contain !important;
    background-color: #ffffff !important;
    padding: 8px !important;
    box-sizing: border-box !important;
}

/* Empty-state restyle (added 2026-08-31): the "Publish Your First ..." box was a white panel with invisible white heading text and a washed-out button. Applies to all account features (reviews, locations, classifieds, events, jobs). */
.first-post {
    background-color: transparent !important;
    border: 2px dashed rgba(77,163,255,0.35) !important;
    border-radius: 10px !important;
    padding: 44px 30px !important;
    text-align: center !important;
}
.first-post .first-post-inner {
    display: block !important;
    color: rgb(224,230,237) !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    margin-bottom: 18px !important;
}
.first-post .publish-post-button {
    display: inline-block !important;
    width: auto !important;
    float: none !important;
    font-weight: 600 !important;
    padding: 10px 24px !important;
}
#first_container .member_accounts a.publish-post-button.publish-post-button {
    color: #ffffff !important;
}

/* Blog empty-state button (added 2026-08-31): the blog Add button's visible text is CSS-injected; restyle it to match the other empty states */
#first_container .first-post a.publish-post-button[href="/account/blog/add"] {
    display: inline-block !important;
    width: auto !important;
    text-indent: 0 !important;
    font-size: 0 !important;
    padding: 12px 26px !important;
    line-height: 1 !important;
}
#first_container .first-post a.publish-post-button[href="/account/blog/add"]::after {
    content: "Write Blog Post" !important;
    color: #ffffff !important;
    font-size: 13.5px !important;
    display: inline !important;
    font-weight: 600 !important;
    text-indent: 0 !important;
    line-height: 1 !important;
}

/* ===== Blog post typography (added 2026-08-31) =====
   The theme's global reset removes list indents. These rules style the blog
   EDITOR (.fr-box .fr-element) and PUBLISHED posts (.the-post-description)
   the same way, so posts render correctly without inline styles. */
.fr-box .fr-element ul, .the-post-description ul {
    list-style: disc !important;
    padding-left: 28px !important;
    margin: 0 0 18px 0 !important;
}
.fr-box .fr-element ol, .the-post-description ol {
    list-style: decimal !important;
    padding-left: 28px !important;
    margin: 0 0 18px 0 !important;
}
.fr-box .fr-element li, .the-post-description li {
    display: list-item !important;
    margin: 0 0 8px 0 !important;
    line-height: 1.7 !important;
}
.fr-box .fr-element ul ul, .the-post-description ul ul {
    list-style: circle !important;
    margin: 8px 0 0 0 !important;
}
.fr-box .fr-element ol ol, .the-post-description ol ol {
    margin: 8px 0 0 0 !important;
}
.the-post-description li {
    font-size: 17px !important;
}
.the-post-description blockquote {
    border-left: 3px solid rgb(22,122,242) !important;
    padding: 4px 0 4px 16px !important;
    margin: 0 0 18px 0 !important;
}
.the-post-description img {
    max-width: 100% !important;
    height: auto !important;
}
.the-post-description table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 0 18px 0 !important;
}
.the-post-description table td, .the-post-description table th {
    border: 1px solid rgba(0,0,0,0.15) !important;
    padding: 8px 10px !important;
}

/* Homepage blog card images (added 2026-08-31): cards were 341x210 (16:11-ish) while blog banners are 1200x640 (15:8), so background-size cover cropped the sides. Match the box to the image ratio so nothing crops. */
.hp11-blog .slickBlogArticles .pic.pic {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 15 / 8 !important;
}

/* 3PL Hub - Careers band on member profiles (paste raw into BD Custom CSS) */
.jh-v2-jobs-band{background:#fff;padding:56px 0;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.jh-v2-jobs-band.is-grey{background:#f8fafc}
.jh-v2-jobs{max-width:1240px;margin:0 auto;padding:0 26px;font-family:Poppins,sans-serif;color:#0f1419}
.jh-v2-jobs__head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px}
.jh-v2-jobs__kicker{margin:0 0 8px!important;font-size:11px!important;font-weight:700!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:#167af2!important}
.ph-profile-page .jh-v2-jobs-band .jh-v2-jobs__head h2,.jh-v2-jobs__head h2{margin:0!important;font-size:32px!important;font-weight:700!important;line-height:1.15!important;color:#0f1419!important;text-align:left!important}
.jh-v2-jobs__sub{margin:10px 0 0!important;font-size:16px!important;line-height:1.5!important;color:#4b5563!important;max-width:640px}
.jh-v2-jobs__all{flex:0 0 auto;display:inline-block;padding:12px 20px;border-radius:999px;background:#1a73e8;color:#fff!important;font-weight:600;font-size:15px;text-decoration:none!important;white-space:nowrap}
.jh-v2-jobs__all:hover{background:#1557b0}
.jh-v2-jobs__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.jh-v2-job{display:flex;flex-direction:column;gap:8px;padding:18px 20px;border:1px solid #e5e7eb;border-radius:14px;background:#fff;text-decoration:none!important;color:#0f1419!important;transition:border-color .15s,box-shadow .15s}
.jh-v2-job:hover{border-color:#1a73e8;box-shadow:0 6px 20px rgba(26,115,232,.12)}
.jh-v2-job__title{font-size:17px;font-weight:600;line-height:1.3}
.jh-v2-job__meta{font-size:14px;color:#4b5563;line-height:1.4}
.jh-v2-job__foot{display:flex;justify-content:space-between;gap:10px;margin-top:auto;padding-top:8px;font-size:13px;color:#6b7280}
@media (max-width:900px){.jh-v2-jobs__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.jh-v2-jobs__head{flex-direction:column;align-items:flex-start}.ph-profile-page .jh-v2-jobs-band .jh-v2-jobs__head h2,.jh-v2-jobs__head h2{font-size:26px}}
@media (max-width:560px){.jh-v2-jobs__grid{grid-template-columns:1fr}.jh-v2-jobs-band{padding:40px 0}.jh-v2-jobs{padding:0 18px}}


/* ============================================================
   3PL Hub | Member dashboard: /account/contact
   Sticky save bar + form quick wins
   Paste raw into BD: Design Settings > Custom CSS (no <style> tags)
   All classes use the bc- prefix. Scoped to .user-session .account-form-box
   so nothing leaks onto public pages.
   ============================================================ */

/* ---------- 1. Sticky save bar ---------- */
.user-session .account-form-box .bc-sv-bar{
  position:sticky;
  top:72px;                       /* height of the sticky site header */
  z-index:50;
  display:flex;
  align-items:center;
  gap:16px;
  margin:-24px -24px 20px;        /* bleed to the box edge (box padding is 24px) */
  padding:12px 20px;
  background:rgba(13,24,41,.96);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  border-bottom:1px solid rgba(255,255,255,.08);
  border-radius:0 12px 0 0;
}
.user-session .account-form-box .bc-sv-progress{
  flex:1 1 auto;
  min-width:0;
}
.user-session .account-form-box .bc-sv-progress-track{
  height:8px;
  border-radius:8px;
  background:rgba(255,255,255,.08);
  overflow:hidden;
}
.user-session .account-form-box .bc-sv-progress-fill{
  height:100%;
  width:0%;
  border-radius:8px;
  background:linear-gradient(90deg,#167af2,#f9ca48);
  transition:width .4s ease;
}
.user-session .account-form-box .bc-sv-progress-label{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-top:6px;
  font-size:13px;
  font-weight:600;
  color:rgba(255,255,255,.85) !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.user-session .account-form-box .bc-sv-progress-label span{
  color:rgba(255,255,255,.85) !important;
}
.user-session .account-form-box .bc-sv-status{
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  color:rgba(255,255,255,.6) !important;
  display:flex;
  align-items:center;
  gap:6px;
}
.user-session .account-form-box .bc-sv-status::before{
  content:"";
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.35);
}
.user-session .account-form-box .bc-sv-bar.is-dirty .bc-sv-status{color:#f9ca48 !important;}
.user-session .account-form-box .bc-sv-bar.is-dirty .bc-sv-status::before{background:#f9ca48;}
.user-session .account-form-box .bc-sv-bar.is-saving .bc-sv-status{color:#7dc4ff !important;}
.user-session .account-form-box .bc-sv-bar.is-saving .bc-sv-status::before{background:#7dc4ff;animation:bc-sv-pulse 1s infinite;}
.user-session .account-form-box .bc-sv-bar.is-saved .bc-sv-status{color:#5fd39a !important;}
.user-session .account-form-box .bc-sv-bar.is-saved .bc-sv-status::before{background:#5fd39a;}
.user-session .account-form-box .bc-sv-bar.is-error .bc-sv-status{color:#f87171 !important;}
.user-session .account-form-box .bc-sv-bar.is-error .bc-sv-status::before{background:#f87171;}
@keyframes bc-sv-pulse{0%,100%{opacity:1}50%{opacity:.3}}

.user-session .account-form-box .bc-sv-save{
  flex:0 0 auto;
  appearance:none;
  border:0;
  border-radius:999px;
  padding:12px 26px;
  min-height:44px;
  background:#167af2;
  color:#fff;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(0,0,0,.25);
  transition:background .2s,transform .15s;
}
.user-session .account-form-box .bc-sv-save:hover{background:#1a86ff;transform:translateY(-1px);}
.user-session .account-form-box .bc-sv-save:focus-visible{outline:3px solid #f9ca48;outline-offset:2px;}
.user-session .account-form-box .bc-sv-save[disabled]{opacity:.6;cursor:progress;transform:none;}

/* Hide the platform's own progress bar (the sticky bar replaces it) */
.user-session .account-form-box > #myform > .progress-container{display:none !important;}

/* ---------- 2. Incomplete-section indicator (was invisible) ---------- */
/* The platform adds .panel-warning + an empty .fa-warning icon to sections
   with missing required fields; both were overridden. Make it visible. */
.user-session .account-form-box .panel.panel-warning .panel-heading::before{background:#f96825 !important;}
.user-session .account-form-box .panel-title a > i.fa-warning{
  float:none !important;
  display:inline-flex;
  align-items:center;
  margin-left:auto;
  margin-right:12px;
  font-family:inherit;
  font-style:normal;
  font-size:11px;
  letter-spacing:.04em;
  color:#f9ca48;
  order:1;
}
.user-session .account-form-box .panel-title a > i.fa-warning::before{
  content:"Incomplete" !important;
  font-family:inherit;
}
.user-session .account-form-box .panel-title a > .toggle-icon{order:2;}

/* ---------- 3. Readability: bring form text up to a legible size ---------- */
.user-session .account-form-box label{font-size:14px !important;}
.user-session .account-form-box .form-control,
.user-session .account-form-box input[type="text"],
.user-session .account-form-box input[type="email"],
.user-session .account-form-box input[type="url"],
.user-session .account-form-box input[type="tel"],
.user-session .account-form-box input[type="number"],
.user-session .account-form-box textarea{font-size:15px !important;padding:9px 12px !important;}
.user-session .account-form-box select.form-control{font-size:15px !important;height:40px !important;padding:6px 12px !important;}
.user-session .account-form-box .checkbox label,
.user-session .account-form-box .radio label{font-size:14px !important;color:rgba(255,255,255,.85) !important;}
.user-session .account-form-box .help-block{font-size:13px !important;color:rgba(255,255,255,.62) !important;}   /* was .4: 3.5:1, failed AA */
.user-session .account-form-box .form-control::placeholder{color:rgba(255,255,255,.5) !important;}              /* was .3: 2.7:1 */
.user-session .account-form-box .panel-title a{font-size:14px !important;}

/* Bigger, easier hit targets for radios and checkboxes */
.user-session .account-form-box input[type="radio"],
.user-session .account-form-box input[type="checkbox"]{
  width:18px;height:18px;
  accent-color:#167af2;
  vertical-align:-3px;
  margin-right:6px;
  cursor:pointer;
}
.user-session .account-form-box .radio label,
.user-session .account-form-box .checkbox label{
  display:inline-flex !important;
  align-items:center;
  min-height:32px;
  padding:4px 10px 4px 2px;
  cursor:pointer;
}

/* Visible keyboard focus on every control (platform set outline:none) */
.user-session .account-form-box input:focus-visible,
.user-session .account-form-box select:focus-visible,
.user-session .account-form-box textarea:focus-visible,
.user-session .account-form-box .nav-button:focus-visible,
.user-session .account-form-box .panel-title a:focus-visible{
  outline:3px solid #f9ca48 !important;
  outline-offset:2px !important;
}

/* Back/Next buttons: white on #007bff is 4.0:1, use brand blue and bolder text */
.user-session .account-form-box .nav-button{background-color:#167af2;font-weight:700;font-size:15px;min-height:44px;}
.user-session .account-form-box .nav-button:hover:not(.disable-button){background-color:#0f5fc2;}
.user-session .account-form-box .disable-button{background-color:rgba(255,255,255,.08);color:rgba(255,255,255,.4);box-shadow:none;}

/* ---------- 4. Mobile ---------- */
@media (max-width:767px){
  .user-session .account-form-box .bc-sv-bar{
    top:60px;                     /* header is shorter on mobile; adjust if yours differs */
    flex-wrap:wrap;
    gap:10px;
    margin:-24px -24px 16px;
    padding:10px 14px;
    border-radius:0;
  }
  .user-session .account-form-box .bc-sv-progress{flex:1 1 100%;order:3;}
  .user-session .account-form-box .bc-sv-status{order:1;flex:1 1 auto;}
  .user-session .account-form-box .bc-sv-save{order:2;padding:10px 20px;}
}

/* ============================================================
   v2 additions: section eyebrows, sub-headings, hints, list pickers,
   hidden fields, landmarks, logged-in chrome tweaks
   ============================================================ */
.bc-ac-hide{display:none !important;}
.bc-ac-sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

.user-session .account-form-box .bc-ac-eyebrow{
  margin:0 0 18px;
  padding:10px 14px;
  font-size:14px;
  line-height:1.4;
  color:rgba(255,255,255,.8) !important;
  background:rgba(22,122,242,.10);
  border-left:3px solid #4da3ff;
  border-radius:0 8px 8px 0;
}
.user-session .account-form-box .bc-ac-sub{
  margin:26px 0 12px;
  padding-bottom:8px;
  font-size:13px !important;
  font-weight:700 !important;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#f9ca48 !important;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.user-session .account-form-box .bc-ac-sub:first-of-type{margin-top:4px;}
.user-session .account-form-box .bc-ac-hint{
  display:block;
  margin-top:6px;
  font-size:13px;
  line-height:1.45;
  color:rgba(255,255,255,.62) !important;
}
.user-session .account-form-box .bc-ac-count{
  margin-left:auto;
  margin-right:12px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  color:#0d1829;
  background:#f9ca48;
  border-radius:999px;
  padding:3px 9px;
  text-transform:none;
}
.user-session .account-form-box .bc-ac-count:empty{display:none;}

/* Yes/No rows: tighter, no asterisk, label reads as a question */
.user-session .account-form-box .bc-ac-yesno{margin-bottom:10px !important;}
.user-session .account-form-box .bc-ac-yesno .radio-inline{margin-right:6px;}

/* List picker (Connections, Verticals, Certifications) */
.user-session .account-form-box .bc-ac-pick{display:block !important;width:100% !important;float:none !important;flex:none !important;column-count:auto !important;}
.user-session .account-form-box .bc-ac-pick-group{margin-bottom:28px !important;}
.user-session .account-form-box .bc-ac-pick-group > .col-sm-3{width:100% !important;float:none !important;text-align:left !important;padding:0 !important;}
.user-session .account-form-box .bc-ac-pick-group > .col-sm-3 label{font-size:15px !important;font-weight:700 !important;color:#fff !important;margin-bottom:10px !important;}
.user-session .account-form-box .bc-ac-pick{clear:both;padding:0 !important;}
.user-session .account-form-box .bc-ac-pick-ui{display:block;width:100%;margin-bottom:12px;float:none;}
.user-session .account-form-box .bc-ac-pick-group{margin-left:0 !important;margin-right:0 !important;}
.user-session .account-form-box .bc-ac-pick-list .checkbox label{min-width:0;}
.user-session .account-form-box .bc-ac-pick-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;}
.user-session .account-form-box .bc-ac-pick-search{
  flex:1 1 220px;
  min-width:0;
  background:#0d1829;
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  color:#fff;
  font-size:15px;
  padding:9px 12px;
}
.user-session .account-form-box .bc-ac-pick-search::placeholder{color:rgba(255,255,255,.5);}
.user-session .account-form-box .bc-ac-pick-toggle{
  flex:0 0 auto;
  appearance:none;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.14);
  border-radius:8px;
  color:rgba(255,255,255,.85);
  font-size:13px;
  font-weight:600;
  padding:9px 14px;
  min-height:40px;
  cursor:pointer;
}
.user-session .account-form-box .bc-ac-pick-toggle[aria-pressed="true"]{background:rgba(22,122,242,.2);border-color:#4da3ff;color:#fff;}
.user-session .account-form-box .bc-ac-pick-count{margin-top:6px;font-size:13px;color:rgba(255,255,255,.62) !important;}
.user-session .account-form-box .bc-ac-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.user-session .account-form-box .bc-ac-chip{
  appearance:none;
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:rgba(249,202,72,.14);
  border:1px solid rgba(249,202,72,.45);
  color:#fff;
  border-radius:999px;
  font-size:13px;
  font-weight:600;
  padding:5px 10px;
  cursor:pointer;
  min-height:30px;
}
.user-session .account-form-box .bc-ac-chip span{font-size:15px;line-height:1;color:#f9ca48;}
.user-session .account-form-box .bc-ac-chip:hover{background:rgba(249,104,37,.2);border-color:#f96825;}
.user-session .account-form-box .bc-ac-pick-list{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr));
  gap:0 12px;
  max-height:380px;
  overflow-y:auto;
  overflow-x:hidden;
  width:100%;
  float:none;
  clear:both;
  padding:6px 4px 6px 0;
  border-top:1px solid rgba(255,255,255,.08);
}
.user-session .account-form-box .bc-ac-pick-list .checkbox{margin:0 !important;width:auto !important;float:none !important;}
.user-session .account-form-box .bc-ac-pick-list .checkbox label{width:100%;}
.user-session .account-form-box .bc-ac-pick-search:focus-visible,
.user-session .account-form-box .bc-ac-pick-toggle:focus-visible,
.user-session .account-form-box .bc-ac-chip:focus-visible{outline:3px solid #f9ca48 !important;outline-offset:2px;}

@media (max-width:767px){
  .user-session .account-form-box .bc-ac-pick-list{grid-template-columns:1fr;max-height:320px;}
}

/* Divider above Back / Save and continue (replaces the platform's empty title row) */
.user-session .account-form-box .form-navigation-fixed{border-top:1px solid rgba(255,255,255,.1);padding-top:16px;margin-top:20px;}

/* (5) Blog post page: full-width content column to match header bar; tighter title gap; author photo fix. Sep 12, 2026 */
.row.content_w_sidebar.feature-blog > .col-md-9.post-detail-body.page-body { padding-left: 0 !important; padding-right: 0 !important; padding-top: 0 !important; max-width: none !important; width: calc(100% - 30px) !important; margin-left: 15px !important; margin-right: 15px !important; }
.feature-blog .post-title .col-md-12 { padding-left: 0 !important; padding-right: 0 !important; margin-top: 0 !important; }
body:has(.post-detail-body) .post-detail-body .posted-by-snippet .posted-by-row--meta::before { background-image: url('/pictures/profile/pimage-19-465-photo.webp') !important; }
body:has(.post-detail-body) .comments_container { max-width: 1192px !important; }

/* (6) Blog post: author line (bigger headshot, name before date), breadcrumb alignment, smaller hero. Sep 12, 2026 */
body:has(.post-detail-body) .post-detail-body .posted-by-snippet .posted-by-row--meta::before { width: 56px !important; height: 56px !important; }
body:has(.post-detail-body) .posted-by-row--meta { align-items: center !important; gap: 14px !important; }
body:has(.post-detail-body) .posted-by-meta-left { display: inline-flex !important; align-items: center !important; gap: 6px !important; }
body:has(.post-detail-body) .posted-by-snippet-category { order: -1 !important; margin-right: 4px !important; }
body:has(.post-detail-body) .breadcrumb.breadcrumb { padding-left: 0 !important; }
html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary img { max-width: 760px !important; width: 100% !important; height: auto !important; margin: 0 auto !important; display: block !important; }



/* ============================================
   (7) Blog post byline: two-row layout beside the headshot.
   Row 1: BY RYAN BENNETT · POSTED 11 SEP 2026
   Row 2: estimated read time
   Share/Print buttons right-aligned, centered across both rows.
   Sep 13, 2026
   ============================================ */

/* The strip becomes a 3-column grid: [headshot] [two text rows] [buttons] */
body:has(.post-detail-body) .post-detail-body .posted-by-snippet{
  display: grid !important;
  grid-template-columns: auto 1fr auto !important;
  align-items: center !important;
  column-gap: 14px !important;
  row-gap: 4px !important;
  padding: 14px 0 !important;
  border-top: 1px solid var(--bp-line) !important;
  border-bottom: 1px solid var(--bp-line) !important;
  margin: 0 0 32px !important;
}

/* Headshot moves onto the strip itself so it spans both text rows */
body:has(.post-detail-body) .post-detail-body .posted-by-snippet::before{
  content: '' !important;
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  background-image: url('/pictures/profile/pimage-19-465-photo.webp') !important;
  background-size: cover !important;
  background-position: center !important;
  border: 1px solid #D9D2C2 !important;
}

/* The old per-row headshot goes away */
body:has(.post-detail-body) .post-detail-body .posted-by-snippet .posted-by-row--meta::before{
  display: none !important;
  content: none !important;
}

/* Row 1: name then date, aligned left, no borders of its own */
body:has(.post-detail-body) .post-detail-body .posted-by-row--meta{
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body:has(.post-detail-body) .posted-by-meta-left{
  justify-content: flex-start !important;
}

/* Separator dot between the name and "Posted" */
body:has(.post-detail-body) .posted-by-snippet-posted::before{
  content: '·' !important;
  margin-right: 6px !important;
  color: var(--bp-muted) !important;
}

/* Row 2: read time, tucked under row 1 */
body:has(.post-detail-body) .post-detail-body .posted-by-row--readtime{
  grid-column: 2 !important;
  grid-row: 2 !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Buttons: right side, vertically centered across both rows */
body:has(.post-detail-body) .post-detail-body .posted-by-row--actions{
  grid-column: 3 !important;
  grid-row: 1 / span 2 !important;
  justify-self: end !important;
  align-self: center !important;
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Phones: buttons drop to their own row under the text */
@media (max-width: 640px){
  body:has(.post-detail-body) .post-detail-body .posted-by-row--actions{
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    justify-self: start !important;
    margin-top: 10px !important;
  }
}



/* (7b) Byline strip: breathing room on the sides */
body:has(.post-detail-body) .post-detail-body .posted-by-snippet{
  padding: 14px 18px !important;
}


/* ============================================
   (8) Blog post: readable rate-card table, bigger tag
   pills, on-brand comment box. Sep 14, 2026
   ============================================ */

/* Rate-card table: dark text on the body rows (a platform
   skin rule forces white, so this needs !important) */
body:has(.post-detail-body) .post-body table td{
  color: #2B3648 !important;
}
body:has(.post-detail-body) .post-body table tbody tr:nth-child(even) td{
  background: #F7F4ED !important;
}

/* Tag pills: bigger, light blue, readable, icon visible */
body:has(.post-detail-body) .post-detail-body .tags a{
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  text-transform: none !important;
  color: #0E5FC4 !important;
  background: rgba(22, 122, 242, 0.10) !important;
  border: 1px solid rgba(22, 122, 242, 0.25) !important;
  padding: 7px 14px !important;
  border-radius: 100px !important;
  margin: 0 8px 8px 0 !important;
  text-decoration: none !important;
}
body:has(.post-detail-body) .post-detail-body .tags a::before,
body:has(.post-detail-body) .post-detail-body .tags a i{
  color: #167AF2 !important;
  opacity: 1 !important;
  margin-right: 2px !important;
}
body:has(.post-detail-body) .post-detail-body .tags a:hover{
  background: rgba(22, 122, 242, 0.18) !important;
  color: #0E5FC4 !important;
}

/* Comment area: white card, cream input well, brand buttons */
body:has(.post-detail-body) .comments_container{
  background: #FFFFFF !important;
  border: 1px solid #E4DFD3 !important;
  border-radius: 14px !important;
  padding: 28px !important;
}
body:has(.post-detail-body) .comments_container h2#post-comments{
  font-family: 'Poppins', sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #080056 !important;
  margin: 0 0 6px !important;
}
body:has(.post-detail-body) .comments_container .write_comment_container.alert{
  background: #F7F4ED !important;
  border: 1px solid #E4DFD3 !important;
  border-radius: 10px !important;
}
body:has(.post-detail-body) .comments_container textarea,
body:has(.post-detail-body) .comments_container input[type="text"]{
  background: #FFFFFF !important;
  border: 1px solid #D9D2C2 !important;
  border-radius: 8px !important;
  color: #2B3648 !important;
}
body:has(.post-detail-body) .comments_container .btn{
  border-radius: 100px !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
}
body:has(.post-detail-body) .comments_container .btn:not(.follow-comments){
  background: #167AF2 !important;
  border-color: #167AF2 !important;
  color: #FFFFFF !important;
}
body:has(.post-detail-body) .comments_container .follow-comments{
  background: transparent !important;
  border: 1px solid #167AF2 !important;
  color: #167AF2 !important;
}


/* ============================================
   (9) Blog post hero: shorter cinematic banner.
   400px on desktop, 220px on phones, cropped
   with object-fit so the full width still shows.
   Sep 14, 2026
   ============================================ */

html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary img.center-block{
  width: 100% !important;
  max-width: 100% !important;
  height: 400px !important;
  max-height: 400px !important;
  object-fit: cover !important;
  object-position: center 22% !important;
  border-radius: 16px !important;
}

@media (max-width: 767px){
  html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary img.center-block{
    height: 220px !important;
    max-height: 220px !important;
  }
}

/* ============================================
   (10) Blog post: tighten the gaps around the hero.
   Title-to-hero ~19px, hero-to-byline ~32px.
   Sep 14, 2026
   ============================================ */

html body:has(.post-detail-body) .post-detail-body .post-title{
  margin-bottom: 8px !important;
}
html body:has(.post-detail-body) .post-detail-body .post-title hr{
  margin: 10px 0 0 !important;
}
html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary{
  font-size: 0 !important;
  line-height: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
}
html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary img.center-block{
  margin: 0 !important;
}
html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary + br{
  display: none !important;
}

/* ============================================
   (10) Blog post: tighten the gaps around the hero.
   Title-to-hero ~19px, hero-to-byline ~32px.
   Sep 14, 2026
   ============================================ */

html body:has(.post-detail-body) .post-detail-body .post-title{
  margin-bottom: 8px !important;
}
html body:has(.post-detail-body) .post-detail-body .post-title hr{
  margin: 10px 0 0 !important;
}
html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary{
  font-size: 0 !important;
  line-height: 0 !important;
  margin-bottom: 0 !important;
  padding: 0 !important;
}
html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary img.center-block{
  margin: 0 !important;
}
html body:has(.post-detail-body) .post-detail-body .post-body .alert-secondary + br{
  display: none !important;
}

/* (11) Tags: remove the icon overlapping the text */
html body:has(.post-detail-body) .post-detail-body .tags a::before{
  display: none !important;
  content: none !important;
}
/* Follow Comments: blue text instead of white */
html body:has(.post-detail-body) .comments_container .follow-comments,
html body:has(.post-detail-body) .comments_container .follow-comments *{
  color: #167AF2 !important;
}

/* ============================================================
   3PL HUB CLASSIFIEDS RESKIN (Sep 2026)
   Scope: html.bcx (set by the classifieds enhancer in website_footer,
   and optionally by the one-line head snippet for a flash-free load).
   Prefix: bcx-. Inert on every other page.
   Paste raw into Design Settings > Custom CSS (Additional CSS).
   ============================================================ */

html.bcx #first_container{
--bcx-navy:#0d1829; --bcx-navy2:#0a1322; --bcx-ink:#10203a; --bcx-muted:#5b6b82;
--bcx-blue:#1f6bff; --bcx-blue-d:#1554d6; --bcx-cyan:#2fd4de; --bcx-yellow:#ffd43b;
--bcx-line:rgba(255,255,255,.12); --bcx-panel:rgba(255,255,255,.05); --bcx-card:#ffffff; --bcx-cardline:#e3eaf4;
font-family:'Montserrat',system-ui,-apple-system,'Segoe UI',sans-serif;
}

/* ---------- page shell: 1240 content box aligned to header/footer ---------- */
html.bcx #first_container > .container{max-width:1240px!important;width:auto!important;margin:0 auto!important;padding:0 clamp(18px,4vw,26px)!important}
html.bcx #first_container .content_w_sidebar.feature-search{margin:0!important;display:block}
html.bcx #first_container .content_w_sidebar > .col-md-9{width:100%!important;left:auto!important;right:auto!important;padding:0!important;float:none!important}
html.bcx #first_container .content_w_sidebar > .col-md-3.col-md-pull-9{display:none!important}
html.bcx #first_container .bcx-hide{display:none!important}
html.bcx #first_container .views{display:none!important}
html.bcx #first_container .content_w_sidebar > .col-md-9 > hr{display:none!important}
html.bcx #first_container .bcx-wrap{max-width:1240px;margin:0 auto}
html.bcx #first_container .bcx-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
html.bcx #first_container a{text-decoration:none!important}
html.bcx #first_container a:focus-visible,html.bcx #first_container button:focus-visible,html.bcx #first_container summary:focus-visible{outline:3px solid var(--bcx-cyan);outline-offset:3px}

/* ---------- shared type ---------- */
html.bcx #first_container .bcx-eyebrow{font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--bcx-cyan)!important;-webkit-text-fill-color:var(--bcx-cyan)!important;margin:0 0 14px}
html.bcx #first_container h2.bcx-h2{font-size:clamp(24px,3vw,34px);font-weight:800;line-height:1.15;color:#fff!important;-webkit-text-fill-color:#fff!important;margin:0;text-wrap:balance}
html.bcx #first_container p.bcx-sub{color:#b9c6da!important;-webkit-text-fill-color:#b9c6da!important;font-size:16.5px;line-height:1.6;max-width:680px;margin:12px 0 0}
html.bcx #first_container .bcx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:15px;border-radius:10px;padding:14px 26px;line-height:1.2;transition:.15s;border:0;cursor:pointer;font-family:inherit}
html.bcx #first_container .bcx-btn-yellow{background:var(--bcx-yellow)!important;color:var(--bcx-navy)!important;-webkit-text-fill-color:var(--bcx-navy)!important}
html.bcx #first_container .bcx-btn-yellow:hover{background:#ffdf6b!important}
html.bcx #first_container .bcx-btn-blue{background:var(--bcx-blue)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html.bcx #first_container .bcx-btn-blue:hover{background:var(--bcx-blue-d)!important}
html.bcx #first_container .bcx-btn-ghost{border:2px solid rgba(255,255,255,.35);color:#fff!important;-webkit-text-fill-color:#fff!important;background:transparent!important}
html.bcx #first_container .bcx-btn-ghost:hover{border-color:var(--bcx-cyan);color:var(--bcx-cyan)!important;-webkit-text-fill-color:var(--bcx-cyan)!important}

/* ---------- hero ---------- */
html.bcx #first_container .bcx-hero{padding:30px 0 40px;border-bottom:1px solid var(--bcx-line);margin-bottom:44px;background:transparent!important}
html.bcx #first_container .bcx-hero .bcx-wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:40px;align-items:center}
html.bcx #first_container .bcx-hero h1{font-size:clamp(30px,4vw,48px)!important;font-weight:900!important;line-height:1.08!important;color:#fff!important;-webkit-text-fill-color:#fff!important;margin:0!important;padding:0!important;text-wrap:balance}
html.bcx #first_container .bcx-hero p.bcx-lede{margin:18px 0 24px;color:#b9c6da!important;-webkit-text-fill-color:#b9c6da!important;font-size:17px;line-height:1.65;max-width:560px}
html.bcx #first_container .bcx-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
html.bcx #first_container .bcx-assure{margin:18px 0 0;padding:0;list-style:none;font-size:13.5px;color:#a9b8cf!important;-webkit-text-fill-color:#a9b8cf!important;display:flex;gap:18px;flex-wrap:wrap}
html.bcx #first_container .bcx-assure li::before{content:"✓ ";color:var(--bcx-cyan);font-weight:800}
html.bcx #first_container .bcx-hero-side{display:grid;gap:12px}
html.bcx #first_container .bcx-step{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:start;background:var(--bcx-panel);border:1px solid var(--bcx-line);border-radius:14px;padding:16px 18px}
html.bcx #first_container .bcx-step .bcx-num{width:40px;height:40px;border-radius:10px;background:rgba(47,212,222,.14);color:var(--bcx-cyan)!important;-webkit-text-fill-color:var(--bcx-cyan)!important;font-weight:800;font-size:17px;display:flex;align-items:center;justify-content:center}
html.bcx #first_container .bcx-step strong{display:block;color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:15.5px;margin-bottom:3px}
html.bcx #first_container .bcx-step span{color:#a9b8cf!important;-webkit-text-fill-color:#a9b8cf!important;font-size:14px;line-height:1.5}

/* ---------- category tiles ---------- */
html.bcx #first_container .bcx-cats,html.bcx #first_container .bcx-faq{background:transparent!important}
html.bcx #first_container .bcx-cats{margin-bottom:48px}
html.bcx #first_container .bcx-cats-head{display:flex;align-items:end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:22px}
html.bcx #first_container .bcx-grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
html.bcx #first_container .bcx-tile{background:var(--bcx-panel);border:1px solid var(--bcx-line);border-radius:16px;padding:22px 20px 18px;display:flex;flex-direction:column;gap:12px;transition:.15s;position:relative}
html.bcx #first_container .bcx-tile:hover{border-color:rgba(47,212,222,.55);background:rgba(255,255,255,.08)}
html.bcx #first_container .bcx-tile .bcx-ico{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(31,107,255,.18)}
html.bcx #first_container .bcx-tile .bcx-ico svg{width:26px;height:26px;stroke:var(--bcx-cyan);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
html.bcx #first_container .bcx-tile h3{font-size:19px!important;font-weight:800!important;color:#fff!important;-webkit-text-fill-color:#fff!important;margin:0!important;line-height:1.2}
html.bcx #first_container .bcx-tile h3 a{color:#fff!important;-webkit-text-fill-color:#fff!important}
html.bcx #first_container .bcx-tile h3 a::after{content:"";position:absolute;inset:0}
html.bcx #first_container .bcx-tile p{color:#a9b8cf!important;-webkit-text-fill-color:#a9b8cf!important;font-size:14px;line-height:1.55;margin:0}
html.bcx #first_container .bcx-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto;padding-top:6px;position:relative;z-index:1}
html.bcx #first_container .bcx-chips a{font-size:12.5px;font-weight:600;color:#dbe4f2!important;-webkit-text-fill-color:#dbe4f2!important;background:rgba(255,255,255,.07);border:1px solid var(--bcx-line);border-radius:999px;padding:5px 10px;line-height:1.2;transition:.15s}
html.bcx #first_container .bcx-chips a:hover{border-color:var(--bcx-cyan);color:var(--bcx-cyan)!important;-webkit-text-fill-color:var(--bcx-cyan)!important}
html.bcx #first_container .bcx-chips a.bcx-more{background:transparent;border-style:dashed}

/* ---------- filters bar (BD's own search form, re-homed) ---------- */
html.bcx #first_container .bcx-filters{background:var(--bcx-panel);border:1px solid var(--bcx-line);border-radius:16px;padding:18px 20px;margin-bottom:22px}
html.bcx #first_container .bcx-filters .module{margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
html.bcx #first_container .bcx-filters .module > h3{font-size:13px!important;font-weight:700!important;letter-spacing:.14em;text-transform:uppercase;color:var(--bcx-cyan)!important;-webkit-text-fill-color:var(--bcx-cyan)!important;margin:0 0 12px!important;padding:0!important}
html.bcx #first_container .bcx-filters form.website-search{display:grid;grid-template-columns:1fr 1fr 1.1fr minmax(230px,.9fr) auto;gap:14px;align-items:end}
html.bcx #first_container .bcx-filters form.website-search > *{margin:0!important}
html.bcx #first_container .bcx-filters .input-group{display:flex!important;width:100%}
html.bcx #first_container .bcx-filters .input-group-addon{background:#fff!important;border:1px solid #d5deea!important;border-right:0!important;border-radius:10px 0 0 10px!important;color:var(--bcx-muted)!important;-webkit-text-fill-color:var(--bcx-muted)!important;padding:0 12px!important;display:flex;align-items:center}
html.bcx #first_container .bcx-filters .input_wrapper{flex:1;display:block}
html.bcx #first_container .bcx-filters input.form-control,html.bcx #first_container .bcx-filters .input_wrapper input{width:100%!important;height:46px!important;border:1px solid #d5deea!important;border-left:0!important;border-radius:0 10px 10px 0!important;background:#fff!important;color:var(--bcx-ink)!important;-webkit-text-fill-color:var(--bcx-ink)!important;font-size:14.5px!important;font-family:inherit!important;box-shadow:none!important;padding:0 12px!important}
html.bcx #first_container .bcx-filters input::placeholder{color:#7b8aa3!important;-webkit-text-fill-color:#7b8aa3!important;opacity:1}
html.bcx #first_container .bcx-filters .bootstrap-select{width:100%!important}
html.bcx #first_container .bcx-filters .bootstrap-select > .dropdown-toggle{height:46px!important;border:1px solid #d5deea!important;border-radius:10px!important;background:#fff!important;color:var(--bcx-ink)!important;-webkit-text-fill-color:var(--bcx-ink)!important;font-size:14.5px!important;font-family:inherit!important;box-shadow:none!important;padding:0 34px 0 12px!important;display:flex;align-items:center}
html.bcx #first_container .bcx-filters .bootstrap-select .dropdown-menu{border-radius:12px;border:1px solid #d5deea;box-shadow:0 14px 40px rgba(0,0,0,.25)}
html.bcx #first_container .bcx-filters .bootstrap-select .dropdown-menu li a{color:var(--bcx-ink)!important;-webkit-text-fill-color:var(--bcx-ink)!important;font-size:14px;padding:8px 14px}
html.bcx #first_container .bcx-filters .bootstrap-select .dropdown-menu li.selected a,html.bcx #first_container .bcx-filters .bootstrap-select .dropdown-menu li a:hover{background:#eef3fb!important}
html.bcx #first_container .bcx-filters .form-group.hpad{padding:0 12px 0 6px!important;min-width:0}
html.bcx #first_container .bcx-filters .bcx-lbl{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#a9b8cf!important;-webkit-text-fill-color:#a9b8cf!important;margin:0 0 8px}
html.bcx #first_container .bcx-filters .classifieds_slider{margin:0 0 6px!important}
html.bcx #first_container .bcx-filters .ui-rangeSlider-bar{background:var(--bcx-cyan)!important}
html.bcx #first_container .bcx-filters .ui-rangeSlider-label{color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:12px}
html.bcx #first_container .bcx-filters .ui-rangeSlider-container{background:rgba(255,255,255,.18)!important;border-radius:999px}
html.bcx #first_container .bcx-filters button.btn-primary{height:46px!important;border-radius:10px!important;background:var(--bcx-blue)!important;border:0!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-weight:700!important;font-size:15px!important;font-family:inherit!important;padding:0 22px!important;white-space:nowrap;box-shadow:none!important}
html.bcx #first_container .bcx-filters button.btn-primary:hover{background:var(--bcx-blue-d)!important}

/* ---------- listings ---------- */
html.bcx #first_container .bcx-list-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:0 0 18px}
html.bcx #first_container .bcx-count{font-size:14px;color:#a9b8cf!important;-webkit-text-fill-color:#a9b8cf!important;font-weight:600}
html.bcx #first_container .bcx-count a{color:var(--bcx-cyan)!important;-webkit-text-fill-color:var(--bcx-cyan)!important;font-weight:700}
html.bcx #first_container .grid-container{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0 0 28px!important;padding:0!important}
html.bcx #first_container .grid-container > hr,html.bcx #first_container .grid-container .clearfix:empty{display:none!important}
html.bcx #first_container .grid-container .search_result{background:var(--bcx-card)!important;border:1px solid var(--bcx-cardline);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;margin:0!important;padding:0!important;min-width:0;transition:.15s;color:var(--bcx-ink)!important;-webkit-text-fill-color:var(--bcx-ink)!important}
html.bcx #first_container .grid-container .search_result:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.35)}
html.bcx #first_container .grid_element{display:flex;flex-direction:column;height:100%;padding:0!important;margin:0!important}
/* BD's original blocks, re-ordered with CSS order */
html.bcx #first_container .grid_element > .col-xs-8.nolpad{order:3;width:100%!important;float:none!important;padding:0 20px!important}
html.bcx #first_container .grid_element > .col-xs-8.nolpad span{font-size:12.5px;color:var(--bcx-muted)!important;-webkit-text-fill-color:var(--bcx-muted)!important;font-weight:600}
html.bcx #first_container .grid_element > .col-xs-4.norpad{order:2;width:auto!important;float:none!important;position:absolute;top:12px;right:12px;padding:0!important;z-index:2}
html.bcx #first_container .grid_element > .col-xs-4.norpad .postItem{display:none!important}
html.bcx #first_container .grid_element button.favorite{background:rgba(13,24,41,.75)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border:0!important;border-radius:999px!important;font-size:11px!important;font-weight:700!important;padding:6px 10px!important;letter-spacing:.06em;line-height:1!important;box-shadow:none!important;font-family:inherit!important}
html.bcx #first_container .grid_element button.favorite span{color:inherit!important;-webkit-text-fill-color:inherit!important}
html.bcx #first_container .grid_element > .clearfix{display:none!important}
html.bcx #first_container .grid_element .img_section{order:1;width:100%!important;float:none!important;position:relative;padding:0!important;margin:0!important}
html.bcx #first_container .grid_element .img_section .btn-sm.bg-primary{position:absolute;left:12px;top:12px;z-index:2;background:transparent!important;padding:0!important;display:flex;gap:6px;line-height:1!important}
html.bcx #first_container .grid_element .img_section .btn-sm.bg-primary .pull-left{display:none!important}
html.bcx #first_container .grid_element .img_section .btn-sm.bg-primary .pull-left.bcx-cond{display:inline-block!important;float:none!important;background:#fff!important;color:var(--bcx-ink)!important;-webkit-text-fill-color:var(--bcx-ink)!important;border-radius:999px;padding:6px 10px;font-size:11.5px;font-weight:700}
html.bcx #first_container .grid_element .img_section .badge{float:none!important;background:var(--bcx-yellow)!important;color:var(--bcx-navy)!important;-webkit-text-fill-color:var(--bcx-navy)!important;border-radius:999px!important;padding:6px 10px!important;font-size:11.5px!important;font-weight:800!important;letter-spacing:.02em;line-height:1!important;text-transform:uppercase}
html.bcx #first_container .grid_element .img_section .btn-sm .clearfix{display:none!important}
html.bcx #first_container .grid_element .alert-secondary{margin:0!important;padding:0!important;border:0!important;background:#eef3fb!important;border-radius:0!important;aspect-ratio:16/10;overflow:hidden;display:block}
html.bcx #first_container .grid_element .alert-secondary a{display:block;height:100%}
html.bcx #first_container .grid_element img.search_result_image{width:100%!important;height:100%!important;object-fit:cover;object-position:center;margin:0!important;max-width:none!important;border-radius:0!important}
html.bcx #first_container .grid_element .bg-secondary.font-lg{background:transparent!important;padding:4px 0 0!important;text-align:left!important;margin:0!important;font-size:24px!important;font-weight:800!important;color:var(--bcx-ink)!important;-webkit-text-fill-color:var(--bcx-ink)!important;line-height:1.1;letter-spacing:-.01em}
html.bcx #first_container .grid_element .mid_section{order:4;width:100%!important;float:none!important;padding:16px 20px 20px!important;margin:0!important;display:flex;flex-direction:column;flex:1;gap:10px}
html.bcx #first_container .grid_element .mid_section a.h3{display:block;font-size:18.5px!important;font-weight:800!important;line-height:1.3!important;color:var(--bcx-ink)!important;-webkit-text-fill-color:var(--bcx-ink)!important;margin:0!important;padding:0!important}
html.bcx #first_container .grid_element .mid_section a.h3:hover{color:var(--bcx-blue-d)!important;-webkit-text-fill-color:var(--bcx-blue-d)!important}
html.bcx #first_container .grid_element .mid_section .clearfix{display:none!important}
html.bcx #first_container .grid_element .post-location-snippet{margin:0!important;padding:0!important;font-size:13.5px!important;color:var(--bcx-muted)!important;-webkit-text-fill-color:var(--bcx-muted)!important;line-height:1.5;display:flex;gap:6px;align-items:flex-start}
html.bcx #first_container .grid_element .post-location-snippet i.fa{color:var(--bcx-blue)!important;-webkit-text-fill-color:var(--bcx-blue)!important;margin-top:3px}
html.bcx #first_container .grid_element .post-location-snippet .bcx-more-loc{color:var(--bcx-blue-d)!important;-webkit-text-fill-color:var(--bcx-blue-d)!important;font-weight:700;cursor:help;white-space:nowrap}
html.bcx #first_container .grid_element .mid_section p{margin:0!important;padding:0!important;font-size:14.5px;line-height:1.6;color:#33415a!important;-webkit-text-fill-color:#33415a!important}
html.bcx #first_container .grid_element .mid_section p a.inline-block{display:none!important}
html.bcx #first_container .grid_element .mid_section .row-fluid.bpad{display:block!important;padding:0!important;margin:auto 0 0!important;visibility:visible!important}
html.bcx #first_container .grid_element .mid_section .row-fluid.bpad .clearfix{display:none!important}
html.bcx #first_container .grid_element .mid_section a.btn-success{display:inline-flex!important;align-items:center;justify-content:center;width:100%!important;float:none!important;background:var(--bcx-blue)!important;border:0!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-weight:700!important;font-size:14.5px!important;border-radius:10px!important;padding:12px 18px!important;margin:6px 0 0!important;box-shadow:none!important;text-shadow:none!important;font-family:inherit!important}
html.bcx #first_container .grid_element .mid_section a.btn-success:hover{background:var(--bcx-blue-d)!important}
html.bcx #first_container .grid_element .mid_section .nolpad.hidden-sm,html.bcx #first_container .grid_element > .col-xs-8.nolpad{display:none!important}
html.bcx #first_container .grid_element .bcx-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
html.bcx #first_container .grid_element .bcx-meta .bcx-posted{font-size:12.5px;color:var(--bcx-muted)!important;-webkit-text-fill-color:var(--bcx-muted)!important;font-weight:600}
html.bcx #first_container .grid_element .bcx-meta a{display:inline-block;font-size:12px!important;font-weight:700!important;color:var(--bcx-blue-d)!important;-webkit-text-fill-color:var(--bcx-blue-d)!important;background:#eef3fb;border-radius:999px;padding:5px 10px;line-height:1.2}

/* empty-state filler cards */
html.bcx #first_container .bcx-post-card{border:2px dashed rgba(255,255,255,.28);border-radius:16px;padding:28px 24px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px;min-height:320px;background:var(--bcx-panel)}
html.bcx #first_container .bcx-post-card h3{font-size:20px!important;font-weight:800!important;color:#fff!important;-webkit-text-fill-color:#fff!important;margin:0!important;line-height:1.25}
html.bcx #first_container .bcx-post-card p{color:#a9b8cf!important;-webkit-text-fill-color:#a9b8cf!important;font-size:14.5px;line-height:1.55;margin:0}
html.bcx #first_container .bcx-post-card .bcx-ico{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(255,212,59,.16)}
html.bcx #first_container .bcx-post-card .bcx-ico svg{width:26px;height:26px;stroke:var(--bcx-yellow);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* map + pagination */
html.bcx #first_container .map_container{display:none!important}
html.bcx #first_container .post-pagination-block{margin:0}
html.bcx #first_container .post-pagination-block .pagination{margin:0 0 28px}
html.bcx #first_container .post-pagination-block .pagination:empty{display:none}
html.bcx #first_container .post-pagination-block .pagination > li > a,html.bcx #first_container .post-pagination-block .pagination > li > span{background:var(--bcx-panel)!important;border:1px solid var(--bcx-line)!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border-radius:8px!important;margin:0 3px}
html.bcx #first_container .post-pagination-block .pagination > li.active > a,html.bcx #first_container .post-pagination-block .pagination > li.active > span{background:var(--bcx-blue)!important;border-color:var(--bcx-blue)!important}

/* ---------- CTA band ---------- */
html.bcx #first_container .bcx-cta{border:1px solid rgba(255,212,59,.35);background:linear-gradient(135deg,rgba(255,212,59,.12),rgba(31,107,255,.12))!important;border-radius:18px;padding:32px clamp(20px,4vw,40px);display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;margin:20px 0 56px}
html.bcx #first_container .bcx-cta h2.bcx-h2{font-size:clamp(22px,2.6vw,30px)}
html.bcx #first_container .bcx-cta p.bcx-sub{font-size:15.5px;margin-top:8px}
html.bcx #first_container .bcx-cta .bcx-actions{justify-content:flex-end}

/* ---------- FAQ ---------- */
html.bcx #first_container .bcx-faq{margin:0 0 60px}
html.bcx #first_container .bcx-faq .bcx-faq-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:40px;align-items:start}
html.bcx #first_container .bcx-faq details{border-top:1px solid var(--bcx-line);padding:4px 0}
html.bcx #first_container .bcx-faq details:last-child{border-bottom:1px solid var(--bcx-line)}
html.bcx #first_container .bcx-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-size:16.5px;font-weight:700;color:#fff!important;-webkit-text-fill-color:#fff!important}
html.bcx #first_container .bcx-faq summary::-webkit-details-marker{display:none}
html.bcx #first_container .bcx-faq summary::after{content:"+";font-size:24px;font-weight:400;color:var(--bcx-cyan);flex:0 0 auto;line-height:1;transition:.2s}
html.bcx #first_container .bcx-faq details[open] summary::after{transform:rotate(45deg)}
html.bcx #first_container .bcx-faq details p{margin:0 0 16px;color:#b9c6da!important;-webkit-text-fill-color:#b9c6da!important;font-size:15px;line-height:1.65;max-width:620px}
html.bcx #first_container .bcx-faq details p a{color:var(--bcx-cyan)!important;-webkit-text-fill-color:var(--bcx-cyan)!important;font-weight:700}

/* ---------- responsive ---------- */
@media (max-width:1100px){
html.bcx #first_container .bcx-filters form.website-search{grid-template-columns:1fr 1fr 1fr;grid-auto-rows:auto}
html.bcx #first_container .bcx-filters form.website-search > .form-group.nobmargin{grid-column:3}
html.bcx #first_container .grid-container{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
html.bcx #first_container .bcx-hero .bcx-wrap{grid-template-columns:1fr;gap:26px}
html.bcx #first_container .bcx-grid4{grid-template-columns:repeat(2,minmax(0,1fr))}
html.bcx #first_container .bcx-cta{grid-template-columns:1fr}
html.bcx #first_container .bcx-cta .bcx-actions{justify-content:flex-start}
html.bcx #first_container .bcx-faq .bcx-faq-grid{grid-template-columns:1fr;gap:20px}
}
@media (max-width:640px){
html.bcx #first_container .bcx-hero{padding:22px 0 30px;margin-bottom:32px}
html.bcx #first_container .bcx-grid4{grid-template-columns:1fr}
html.bcx #first_container .bcx-filters form.website-search{grid-template-columns:1fr}
html.bcx #first_container .bcx-filters form.website-search > .form-group.nobmargin{grid-column:auto}
html.bcx #first_container .bcx-filters button.btn-primary{width:100%}
html.bcx #first_container .grid-container{grid-template-columns:1fr}
html.bcx #first_container .bcx-actions .bcx-btn{width:100%}
html.bcx #first_container .bcx-post-card{min-height:0}
}
/* 3PL Hub glossary: approved title treatment, 22 October 2026 */
#hgl-entry .hgl-hero .hgl-hero-grid>header{display:flex;flex-direction:column;align-items:stretch;padding-top:26px}
#hgl-entry .hgl-hero .hgl-hero-grid>header>h1{order:1;position:relative}
#hgl-entry .hgl-hero .hgl-hero-grid>header>h1::after{content:"";display:block;width:180px;max-width:65%;height:14px;margin-top:8px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 14'%3E%3Cpath d='M3 10 Q87 -2 177 7' fill='none' stroke='%23FFC000' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") left center/contain no-repeat}
#hgl-entry .hgl-hero .hgl-hero-grid>header>.hgl-meta{order:2}
#hgl-entry .hgl-hero .hgl-hero-grid>header>p.hgl-kicker{order:3;display:grid;grid-template-columns:155px minmax(0,1fr);gap:13px;max-width:430px;margin:8px 0 0!important;padding:0!important;font:400 12px/1.8 Poppins,Arial,sans-serif!important;letter-spacing:0!important;text-transform:capitalize!important;color:#9eb4d2!important}
#hgl-entry .hgl-hero .hgl-hero-grid>header>p.hgl-kicker::before{content:"Category";text-transform:none}
@media(max-width:680px){#hgl-entry .hgl-hero .hgl-hero-grid>header{padding-top:0}#hgl-entry .hgl-hero .hgl-hero-grid>header>p.hgl-kicker{grid-template-columns:150px minmax(0,1fr);gap:10px}#hgl-entry .hgl-hero .hgl-hero-grid>header>h1::after{width:150px;margin-top:7px}}

#hgl-entry .hgl-hero .hgl-hero-grid>header>p.hgl-kicker{text-transform:lowercase!important}
/* Sitewide: remove duplicate shortlist banner above the main footer. */
.hf2-root .hf2-ctaband{display:none!important}
/* Member facility weekday controls — 2026-10-24 */
body.lhux [role="group"][aria-labelledby="bc-ac-l-facility_operating_days--"]{display:flex!important;flex-wrap:wrap;gap:8px 16px;align-items:center}
body.lhux [role="group"][aria-labelledby="bc-ac-l-facility_operating_days--"] .checkbox{margin:0!important;flex:0 0 auto;padding:0!important}
body.lhux [role="group"][aria-labelledby="bc-ac-l-facility_operating_days--"] .checkbox label{display:flex!important;align-items:center;gap:8px;min-height:40px;margin:0!important;padding:4px 8px!important}
body.lhux [role="group"][aria-labelledby="bc-ac-l-facility_operating_days--"] input[type="checkbox"]{position:static!important;margin:0!important;min-height:18px;width:18px;flex:0 0 18px}
body.lhux [role="group"][aria-labelledby="bc-ac-l-facility_operating_days--"] .help-block{flex-basis:100%;margin-top:0!important}
/* Member facility weekday controls — native form fallback — 2026-10-24 */
body.lhux #step3 .col-sm-9:has(input[name="facility_operating_days[]"]){display:flex!important;flex-wrap:wrap;gap:8px 16px;align-items:center}
body.lhux #step3 .col-sm-9:has(input[name="facility_operating_days[]"]) .checkbox{margin:0!important;flex:0 0 auto;padding:0!important}
body.lhux #step3 .col-sm-9:has(input[name="facility_operating_days[]"]) .checkbox label{display:flex!important;align-items:center;gap:8px;min-height:40px;margin:0!important;padding:4px 8px!important}
body.lhux #step3 .col-sm-9:has(input[name="facility_operating_days[]"]) input[type="checkbox"]{position:static!important;margin:0!important;min-height:18px;width:18px;flex:0 0 18px}
body.lhux #step3 .col-sm-9:has(input[name="facility_operating_days[]"]) .help-block{flex-basis:100%;margin-top:0!important}