/* ============================================================================
   BOOTSTRAP 5 COMPATIBILITY FIXES FOR JANGO THEME
   
   This file contains CSS overrides needed to migrate from Bootstrap 3 to 
   Bootstrap 5. Add these rules to your theme's main CSS file or include
   this file separately.
   
   Reference: https://getbootstrap.com/docs/5.3/migration/
   ============================================================================ */

/* ============================================================================
   0. Additional Custom Overrides
   
   Glyphicons - Add BS3 glyphicon classes if still used in markup
   ============================================================================ */
   @font-face {
  font-family: 'Glyphicons Halflings';
  src: url("../assets/plugins/bootstrap/fonts/bootstrap/glyphicons-halflings-regular.eot");
  src: url("../assets/plugins/bootstrap/fonts/bootstrap/glyphicons-halflings-regular.eot?#iefix") format("embedded-opentype"), url("../assets/plugins/bootstrap/fonts/bootstrap/glyphicons-halflings-regular.woff2") format("woff2"), url("../assets/plugins/bootstrap/fonts/bootstrap/glyphicons-halflings-regular.woff") format("woff"), url("../assets/plugins/bootstrap/fonts/bootstrap/glyphicons-halflings-regular.ttf") format("truetype"), url("../assets/plugins/bootstrap/fonts/bootstrap/glyphicons-halflings-regular.svg#glyphicons_halflingsregular") format("svg"); }

.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.glyphicon-asterisk:before {
  content: "\002a"; }

.glyphicon-plus:before {
  content: "\002b"; }

.glyphicon-euro:before,
.glyphicon-eur:before {
  content: "\20ac"; }

.glyphicon-minus:before {
  content: "\2212"; }

.glyphicon-cloud:before {
  content: "\2601"; }

.glyphicon-envelope:before {
  content: "\2709"; }

.glyphicon-pencil:before {
  content: "\270f"; }

.glyphicon-glass:before {
  content: "\e001"; }

.glyphicon-music:before {
  content: "\e002"; }

.glyphicon-search:before {
  content: "\e003"; }

.glyphicon-heart:before {
  content: "\e005"; }

.glyphicon-star:before {
  content: "\e006"; }

.glyphicon-star-empty:before {
  content: "\e007"; }

.glyphicon-user:before {
  content: "\e008"; }

.glyphicon-film:before {
  content: "\e009"; }

.glyphicon-th-large:before {
  content: "\e010"; }

.glyphicon-th:before {
  content: "\e011"; }

.glyphicon-th-list:before {
  content: "\e012"; }

.glyphicon-ok:before {
  content: "\e013"; }

.glyphicon-remove:before {
  content: "\e014"; }

.glyphicon-zoom-in:before {
  content: "\e015"; }

.glyphicon-zoom-out:before {
  content: "\e016"; }

.glyphicon-off:before {
  content: "\e017"; }

.glyphicon-signal:before {
  content: "\e018"; }

.glyphicon-cog:before {
  content: "\e019"; }

.glyphicon-trash:before {
  content: "\e020"; }

.glyphicon-home:before {
  content: "\e021"; }

.glyphicon-file:before {
  content: "\e022"; }

.glyphicon-time:before {
  content: "\e023"; }

.glyphicon-road:before {
  content: "\e024"; }

.glyphicon-download-alt:before {
  content: "\e025"; }

.glyphicon-download:before {
  content: "\e026"; }

.glyphicon-upload:before {
  content: "\e027"; }

.glyphicon-inbox:before {
  content: "\e028"; }

.glyphicon-play-circle:before {
  content: "\e029"; }

.glyphicon-repeat:before {
  content: "\e030"; }

.glyphicon-refresh:before {
  content: "\e031"; }

.glyphicon-list-alt:before {
  content: "\e032"; }

.glyphicon-lock:before {
  content: "\e033"; }

.glyphicon-flag:before {
  content: "\e034"; }

.glyphicon-headphones:before {
  content: "\e035"; }

.glyphicon-volume-off:before {
  content: "\e036"; }

.glyphicon-volume-down:before {
  content: "\e037"; }

.glyphicon-volume-up:before {
  content: "\e038"; }

.glyphicon-qrcode:before {
  content: "\e039"; }

.glyphicon-barcode:before {
  content: "\e040"; }

.glyphicon-tag:before {
  content: "\e041"; }

.glyphicon-tags:before {
  content: "\e042"; }

.glyphicon-book:before {
  content: "\e043"; }

.glyphicon-bookmark:before {
  content: "\e044"; }

.glyphicon-print:before {
  content: "\e045"; }

.glyphicon-camera:before {
  content: "\e046"; }

.glyphicon-font:before {
  content: "\e047"; }

.glyphicon-bold:before {
  content: "\e048"; }

.glyphicon-italic:before {
  content: "\e049"; }

.glyphicon-text-height:before {
  content: "\e050"; }

.glyphicon-text-width:before {
  content: "\e051"; }

.glyphicon-align-left:before {
  content: "\e052"; }

.glyphicon-align-center:before {
  content: "\e053"; }

.glyphicon-align-right:before {
  content: "\e054"; }

.glyphicon-align-justify:before {
  content: "\e055"; }

.glyphicon-list:before {
  content: "\e056"; }

.glyphicon-indent-left:before {
  content: "\e057"; }

.glyphicon-indent-right:before {
  content: "\e058"; }

.glyphicon-facetime-video:before {
  content: "\e059"; }

.glyphicon-picture:before {
  content: "\e060"; }

.glyphicon-map-marker:before {
  content: "\e062"; }

.glyphicon-adjust:before {
  content: "\e063"; }

.glyphicon-tint:before {
  content: "\e064"; }

.glyphicon-edit:before {
  content: "\e065"; }

.glyphicon-share:before {
  content: "\e066"; }

.glyphicon-check:before {
  content: "\e067"; }

.glyphicon-move:before {
  content: "\e068"; }

.glyphicon-step-backward:before {
  content: "\e069"; }

.glyphicon-fast-backward:before {
  content: "\e070"; }

.glyphicon-backward:before {
  content: "\e071"; }

.glyphicon-play:before {
  content: "\e072"; }

.glyphicon-pause:before {
  content: "\e073"; }

.glyphicon-stop:before {
  content: "\e074"; }

.glyphicon-forward:before {
  content: "\e075"; }

.glyphicon-fast-forward:before {
  content: "\e076"; }

.glyphicon-step-forward:before {
  content: "\e077"; }

.glyphicon-eject:before {
  content: "\e078"; }

.glyphicon-chevron-left:before {
  content: "\e079"; }

.glyphicon-chevron-right:before {
  content: "\e080"; }

.glyphicon-plus-sign:before {
  content: "\e081"; }

.glyphicon-minus-sign:before {
  content: "\e082"; }

.glyphicon-remove-sign:before {
  content: "\e083"; }

.glyphicon-ok-sign:before {
  content: "\e084"; }

.glyphicon-question-sign:before {
  content: "\e085"; }

.glyphicon-info-sign:before {
  content: "\e086"; }

.glyphicon-screenshot:before {
  content: "\e087"; }

.glyphicon-remove-circle:before {
  content: "\e088"; }

.glyphicon-ok-circle:before {
  content: "\e089"; }

.glyphicon-ban-circle:before {
  content: "\e090"; }

.glyphicon-arrow-left:before {
  content: "\e091"; }

.glyphicon-arrow-right:before {
  content: "\e092"; }

.glyphicon-arrow-up:before {
  content: "\e093"; }

.glyphicon-arrow-down:before {
  content: "\e094"; }

.glyphicon-share-alt:before {
  content: "\e095"; }

.glyphicon-resize-full:before {
  content: "\e096"; }

.glyphicon-resize-small:before {
  content: "\e097"; }

.glyphicon-exclamation-sign:before {
  content: "\e101"; }

.glyphicon-gift:before {
  content: "\e102"; }

.glyphicon-leaf:before {
  content: "\e103"; }

.glyphicon-fire:before {
  content: "\e104"; }

.glyphicon-eye-open:before {
  content: "\e105"; }

.glyphicon-eye-close:before {
  content: "\e106"; }

.glyphicon-warning-sign:before {
  content: "\e107"; }

.glyphicon-plane:before {
  content: "\e108"; }

.glyphicon-calendar:before {
  content: "\e109"; }

.glyphicon-random:before {
  content: "\e110"; }

.glyphicon-comment:before {
  content: "\e111"; }

.glyphicon-magnet:before {
  content: "\e112"; }

.glyphicon-chevron-up:before {
  content: "\e113"; }

.glyphicon-chevron-down:before {
  content: "\e114"; }

.glyphicon-retweet:before {
  content: "\e115"; }

.glyphicon-shopping-cart:before {
  content: "\e116"; }

.glyphicon-folder-close:before {
  content: "\e117"; }

.glyphicon-folder-open:before {
  content: "\e118"; }

.glyphicon-resize-vertical:before {
  content: "\e119"; }

.glyphicon-resize-horizontal:before {
  content: "\e120"; }

.glyphicon-hdd:before {
  content: "\e121"; }

.glyphicon-bullhorn:before {
  content: "\e122"; }

.glyphicon-bell:before {
  content: "\e123"; }

.glyphicon-certificate:before {
  content: "\e124"; }

.glyphicon-thumbs-up:before {
  content: "\e125"; }

.glyphicon-thumbs-down:before {
  content: "\e126"; }

.glyphicon-hand-right:before {
  content: "\e127"; }

.glyphicon-hand-left:before {
  content: "\e128"; }

.glyphicon-hand-up:before {
  content: "\e129"; }

.glyphicon-hand-down:before {
  content: "\e130"; }

.glyphicon-circle-arrow-right:before {
  content: "\e131"; }

.glyphicon-circle-arrow-left:before {
  content: "\e132"; }

.glyphicon-circle-arrow-up:before {
  content: "\e133"; }

.glyphicon-circle-arrow-down:before {
  content: "\e134"; }

.glyphicon-globe:before {
  content: "\e135"; }

.glyphicon-wrench:before {
  content: "\e136"; }

.glyphicon-tasks:before {
  content: "\e137"; }

.glyphicon-filter:before {
  content: "\e138"; }

.glyphicon-briefcase:before {
  content: "\e139"; }

.glyphicon-fullscreen:before {
  content: "\e140"; }

.glyphicon-dashboard:before {
  content: "\e141"; }

.glyphicon-paperclip:before {
  content: "\e142"; }

.glyphicon-heart-empty:before {
  content: "\e143"; }

.glyphicon-link:before {
  content: "\e144"; }

.glyphicon-phone:before {
  content: "\e145"; }

.glyphicon-pushpin:before {
  content: "\e146"; }

.glyphicon-usd:before {
  content: "\e148"; }

.glyphicon-gbp:before {
  content: "\e149"; }

.glyphicon-sort:before {
  content: "\e150"; }

.glyphicon-sort-by-alphabet:before {
  content: "\e151"; }

.glyphicon-sort-by-alphabet-alt:before {
  content: "\e152"; }

.glyphicon-sort-by-order:before {
  content: "\e153"; }

.glyphicon-sort-by-order-alt:before {
  content: "\e154"; }

.glyphicon-sort-by-attributes:before {
  content: "\e155"; }

.glyphicon-sort-by-attributes-alt:before {
  content: "\e156"; }

.glyphicon-unchecked:before {
  content: "\e157"; }

.glyphicon-expand:before {
  content: "\e158"; }

.glyphicon-collapse-down:before {
  content: "\e159"; }

.glyphicon-collapse-up:before {
  content: "\e160"; }

.glyphicon-log-in:before {
  content: "\e161"; }

.glyphicon-flash:before {
  content: "\e162"; }

.glyphicon-log-out:before {
  content: "\e163"; }

.glyphicon-new-window:before {
  content: "\e164"; }

.glyphicon-record:before {
  content: "\e165"; }

.glyphicon-save:before {
  content: "\e166"; }

.glyphicon-open:before {
  content: "\e167"; }

.glyphicon-saved:before {
  content: "\e168"; }

.glyphicon-import:before {
  content: "\e169"; }

.glyphicon-export:before {
  content: "\e170"; }

.glyphicon-send:before {
  content: "\e171"; }

.glyphicon-floppy-disk:before {
  content: "\e172"; }

.glyphicon-floppy-saved:before {
  content: "\e173"; }

.glyphicon-floppy-remove:before {
  content: "\e174"; }

.glyphicon-floppy-save:before {
  content: "\e175"; }

.glyphicon-floppy-open:before {
  content: "\e176"; }

.glyphicon-credit-card:before {
  content: "\e177"; }

.glyphicon-transfer:before {
  content: "\e178"; }

.glyphicon-cutlery:before {
  content: "\e179"; }

.glyphicon-header:before {
  content: "\e180"; }

.glyphicon-compressed:before {
  content: "\e181"; }

.glyphicon-earphone:before {
  content: "\e182"; }

.glyphicon-phone-alt:before {
  content: "\e183"; }

.glyphicon-tower:before {
  content: "\e184"; }

.glyphicon-stats:before {
  content: "\e185"; }

.glyphicon-sd-video:before {
  content: "\e186"; }

.glyphicon-hd-video:before {
  content: "\e187"; }

.glyphicon-subtitles:before {
  content: "\e188"; }

.glyphicon-sound-stereo:before {
  content: "\e189"; }

.glyphicon-sound-dolby:before {
  content: "\e190"; }

.glyphicon-sound-5-1:before {
  content: "\e191"; }

.glyphicon-sound-6-1:before {
  content: "\e192"; }

.glyphicon-sound-7-1:before {
  content: "\e193"; }

.glyphicon-copyright-mark:before {
  content: "\e194"; }

.glyphicon-registration-mark:before {
  content: "\e195"; }

.glyphicon-cloud-download:before {
  content: "\e197"; }

.glyphicon-cloud-upload:before {
  content: "\e198"; }

.glyphicon-tree-conifer:before {
  content: "\e199"; }

.glyphicon-tree-deciduous:before {
  content: "\e200"; }

.glyphicon-cd:before {
  content: "\e201"; }

.glyphicon-save-file:before {
  content: "\e202"; }

.glyphicon-open-file:before {
  content: "\e203"; }

.glyphicon-level-up:before {
  content: "\e204"; }

.glyphicon-copy:before {
  content: "\e205"; }

.glyphicon-paste:before {
  content: "\e206"; }

.glyphicon-alert:before {
  content: "\e209"; }

.glyphicon-equalizer:before {
  content: "\e210"; }

.glyphicon-king:before {
  content: "\e211"; }

.glyphicon-queen:before {
  content: "\e212"; }

.glyphicon-pawn:before {
  content: "\e213"; }

.glyphicon-bishop:before {
  content: "\e214"; }

.glyphicon-knight:before {
  content: "\e215"; }

.glyphicon-baby-formula:before {
  content: "\e216"; }

.glyphicon-tent:before {
  content: "\26fa"; }

.glyphicon-blackboard:before {
  content: "\e218"; }

.glyphicon-bed:before {
  content: "\e219"; }

.glyphicon-apple:before {
  content: "\f8ff"; }

.glyphicon-erase:before {
  content: "\e221"; }

.glyphicon-hourglass:before {
  content: "\231b"; }

.glyphicon-lamp:before {
  content: "\e223"; }

.glyphicon-duplicate:before {
  content: "\e224"; }

.glyphicon-piggy-bank:before {
  content: "\e225"; }

.glyphicon-scissors:before {
  content: "\e226"; }

.glyphicon-bitcoin:before {
  content: "\e227"; }

.glyphicon-btc:before {
  content: "\e227"; }

.glyphicon-xbt:before {
  content: "\e227"; }

.glyphicon-yen:before {
  content: "\00a5"; }

.glyphicon-jpy:before {
  content: "\00a5"; }

.glyphicon-ruble:before {
  content: "\20bd"; }

.glyphicon-rub:before {
  content: "\20bd"; }

.glyphicon-scale:before {
  content: "\e230"; }

.glyphicon-ice-lolly:before {
  content: "\e231"; }

.glyphicon-ice-lolly-tasted:before {
  content: "\e232"; }

.glyphicon-education:before {
  content: "\e233"; }

.glyphicon-option-horizontal:before {
  content: "\e234"; }

.glyphicon-option-vertical:before {
  content: "\e235"; }

.glyphicon-menu-hamburger:before {
  content: "\e236"; }

.glyphicon-modal-window:before {
  content: "\e237"; }

.glyphicon-oil:before {
  content: "\e238"; }

.glyphicon-grain:before {
  content: "\e239"; }

.glyphicon-sunglasses:before {
  content: "\e240"; }

.glyphicon-text-size:before {
  content: "\e241"; }

.glyphicon-text-color:before {
  content: "\e242"; }

.glyphicon-text-background:before {
  content: "\e243"; }

.glyphicon-object-align-top:before {
  content: "\e244"; }

.glyphicon-object-align-bottom:before {
  content: "\e245"; }

.glyphicon-object-align-horizontal:before {
  content: "\e246"; }

.glyphicon-object-align-left:before {
  content: "\e247"; }

.glyphicon-object-align-vertical:before {
  content: "\e248"; }

.glyphicon-object-align-right:before {
  content: "\e249"; }

.glyphicon-triangle-right:before {
  content: "\e250"; }

.glyphicon-triangle-left:before {
  content: "\e251"; }

.glyphicon-triangle-bottom:before {
  content: "\e252"; }

.glyphicon-triangle-top:before {
  content: "\e253"; }

.glyphicon-console:before {
  content: "\e254"; }

.glyphicon-superscript:before {
  content: "\e255"; }

.glyphicon-subscript:before {
  content: "\e256"; }

.glyphicon-menu-left:before {
  content: "\e257"; }

.glyphicon-menu-right:before {
  content: "\e258"; }

.glyphicon-menu-down:before {
  content: "\e259"; }

.glyphicon-menu-up:before {
  content: "\e260"; }


/* ============================================================================
   1. CRITICAL: Navigation Menu Layout Fix
   
   Bootstrap 5 changed .navbar-nav to use:
     display: flex;
     flex-direction: column;  <-- This breaks horizontal menu layouts
   
   The Jango theme's mega menu expects horizontal items using float: left.
   This CSS override forces the menu back to horizontal layout.
   ============================================================================ */

.c-mega-menu > .nav.navbar-nav > li {
  display: block !important;
  float: left;
  white-space: nowrap;
  height: auto;
  line-height: normal;
}

.c-mega-menu > .nav.navbar-nav > li > a {
  display: flex;
  align-items: center;  /* Center anchor content vertically */
}

.c-mega-menu > .nav.navbar-nav > li.c-search-toggler-wrapper {
  margin-left: auto;  /* Push search icon to the right */
  display: flex;
  align-items: center;  /* Center search icon vertically */
}
.nav > li > a:hover, .nav > li > a:focus {
    text-decoration: none;
}

/* ============================================================================
   2. Parallax Section Overflow Fix
   
   The parallax background image in the "Profinity Difference" section was
   overflowing and overlapping the "Our Products" section below it.
   Adding overflow: hidden and position: relative keeps it in its own
   stacking context.
   ============================================================================ */

.c-content-feature-4 {
  overflow: hidden;
  position: relative;
}

.c-content-feature-4 .c-content-area {
  position: relative;
  z-index: 2;
}

/* ============================================================================
   3. Form Classes
   
   Bootstrap 5 removed/renamed several form utility classes:
   - .form-group → use .mb-3 or custom spacing
   - .has-feedback → removed entirely
   - .input-lg → changed to .form-control-lg
   - .hidden → changed to .d-none
   
   Note: These changes are typically in the search form template or via
   drupal form_alter hooks. Update the HTML markup as needed.
   ============================================================================ */

/* If form-group is still used in markup, provide spacing equivalent */
.form-group {
  margin-bottom: 1rem;
}

/* Remove has-feedback styling if still applied */
.has-feedback {
  /* Bootstrap 5 deprecated this - no direct replacement needed */
}

.webform-container-inline > div {
    display: block;
}

legend {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: 20px;
  font-size: 21px;
  line-height: inherit;
  color: #34495e;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
}

.has-feedback {
    position: relative;
}

.form-control-feedback {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    pointer-events: none;
}

.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

.panel-body {
    padding: 15px;
}

.form-control
{
    margin-top: 4px;
}

/* ============================================================================
   4. Utility Class Transitions
   
   Bootstrap 5 renamed several utility classes for RTL support and consistency:
   
   Old (BS3)          New (BS5)
   ---                         ---
   .hidden            .d-none
   .col-xs-*          .col-*
   .text-left         .text-start
   .text-right        .text-end
   .text-center       .text-center (unchanged)
   .btn-default       .btn-secondary
   .input-lg          .form-control-lg
   .input-sm          .form-control-sm
   
   Update these in your HTML/Twig templates.
   ============================================================================ */

/* Provide fallback for .hidden if still in markup */
.hidden {
  display: none !important;
}

/* BS3 base text alignment classes → BS5 uses text-start / text-end */
.text-left  { text-align: left !important; }
.text-right { text-align: right !important; }

/* BS3 xs text alignment (no breakpoint — apply at all sizes) */
.text-xs-left   { text-align: left !important; }
.text-xs-right  { text-align: right !important; }
.text-xs-center { text-align: center !important; }

/* BS3 sm text alignment (>= 576px) */
@media (min-width: 576px) {
  .text-sm-left   { text-align: left !important; }
  .text-sm-right  { text-align: right !important; }
  .text-sm-center { text-align: center !important; }
}

/* BS3 md text alignment (>= 768px) */
@media (min-width: 768px) {
  .text-md-left   { text-align: left !important; }
  .text-md-right  { text-align: right !important; }
  .text-md-center { text-align: center !important; }
}

/* BS3 lg text alignment (>= 992px) */
@media (min-width: 992px) {
  .text-lg-left   { text-align: left !important; }
  .text-lg-right  { text-align: right !important; }
  .text-lg-center { text-align: center !important; }
}

/* BS3 xl text alignment (>= 1200px) */
@media (min-width: 1200px) {
  .text-xl-left   { text-align: left !important; }
  .text-xl-right  { text-align: right !important; }
  .text-xl-center { text-align: center !important; }
}

/* ============================================================================
   5. Navigation Dropdown Menu Compatibility
   
   Ensure dropdown menus render correctly with Bootstrap 5's flexbox system
   ============================================================================ */

.c-mega-menu .navbar-nav .dropdown-menu {
  min-width: auto;
  position: absolute;
  top: 100%;
  left: 0;
}

.c-mega-menu .navbar-nav .dropdown-menu.c-menu-type-classic {
  display: none;
  position: absolute;
  z-index: 1000;
}

.c-mega-menu .navbar-nav .tbm-item--has-dropdown > a {
  position: relative;
}

.c-mega-menu .navbar-nav .tbm-item--has-dropdown:hover > .dropdown-menu {
  display: block;
}

/* ============================================================================
   6. Button Styling Overrides
   
   Bootstrap 5 changed button default styling. Ensure theme buttons
   maintain their intended appearance.
   ============================================================================ */
/*
.btn {
  display: inline-block;
  font-weight: 500;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  user-select: none;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
              border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
*/
/* Note: Replace .btn-default with .btn-secondary in markup */
.btn-secondary {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn-secondary:hover {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
}


/* ============================================================================
   8. Flexbox Utility Classes
   
   If using flex utilities, ensure they're compatible with BS5 naming
   ============================================================================ */

.d-flex {
  display: flex !important;
}

.d-none {
  display: none !important;
}

.d-block {
  display: block !important;
}

.d-inline-block {
  display: inline-block !important;
}

/* ============================================================================
   END OF BOOTSTRAP 5 COMPATIBILITY FIXES
   ============================================================================ */

/* ============================================================================
   BOOTSTRAP 5 CUSTOM CSS OVERRIDES FOR JANGO SUBTHEME
   
   Additional custom CSS to ensure Jango theme elements render correctly
   with Bootstrap 5. These are refinements to the main Bootstrap 5 
   compatibility file.
   ============================================================================ */

/* ============================================================================
   1. Mega Menu Refinements
   
   Fine-tune the mega menu layout for Bootstrap 5 compatibility
   ============================================================================ */


.c-mega-menu {
  flex: 1 0 auto;
  margin-left: auto;
}

.c-mega-menu > .nav.navbar-nav {
  align-items: center;
  height: auto;
  display: block;
  @media (min-width: 992px) {
    display: flex;
    flex-direction: row;
  }
}

.c-mega-menu > .nav.navbar-nav > li {
  position: relative;
}

.nav > li > a {
    padding: 10px 15px;
}
/*
.c-mega-menu > .nav.navbar-nav > li > a {
  display: block;
  padding: 0;
  margin: 0;
}
*/
/* Ensure dropdown toggle works */
.c-mega-menu > .nav.navbar-nav > li.tbm-item--has-dropdown > a::after {
  content: '';
  display: inline-block;
}

/* ============================================================================
   2. Search Form Compatibility
   
   Bootstrap 5 removed .form-group and .input-lg classes.
   Apply equivalent styling via custom classes.
   ============================================================================ */

.c-quick-search {
  margin-bottom: 1rem;  /* Replaces .form-group spacing */
}

.form-search.input-lg {
  /* input-lg → form-control-lg in BS5 */
  padding: 0.75rem 1rem;
  font-size: 1.25rem;
  line-height: 1.5;
  border-radius: 0.3rem;
}

.form-control-lg {
  padding: 0.75rem 1rem;
  font-size: 1.25rem;
  line-height: 1.5;
  border-radius: 0.3rem;
}

/* Ensure has-feedback styling is suppressed */
.form-group.has-feedback::after {
  display: none !important;
}

.c-layout-header .c-navbar .c-mega-menu > .nav.navbar-nav > li > .c-btn-icon {
    margin: 0 !important;
}

/* ============================================================================
   3. Button Refinements
   
   Ensure custom button classes work with Bootstrap 5 button system
   ============================================================================ */

.btn.btn-default {
  /* Fallback for old BS3 class - map to btn-secondary */
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
}

.btn.btn-default:hover {
  color: #fff;
  background-color: #5a6268;
  border-color: #545b62;
}

.btn.btn-md {
  /* btn-md was never a Bootstrap standard - provide sizing */
  padding: 0.5rem 1rem;
  font-size: 0.95rem;
}

.c-btn-uppercase {
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.btn {
    font-family: SoehneBuch, Arial, Helvetica;
}
.btn-block {
    display: block;
    width: 100%;
}

/* ============================================================================
   4. Grid/alignment Refinements
   
   Ensure footer, etc... grid layout works correctly
   ============================================================================ */

#footer .c-layout-footer .c-nav li {
    text-align: left;
}

.col-xs-6 {
    width: 50%;
}

/* ============================================================================
   5. Display and Visibility Utilities
   
   Bootstrap 5 uses .d-* naming for display utilities
   ============================================================================ */

.hidden,
.d-none {
  display: none !important;
}

.visible {
  visibility: visible !important;
}

.d-inline {
  display: inline !important;
}

.d-block {
  display: block !important;
}

.d-grid {
  display: grid !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: flex !important;
}

.d-inline-flex {
  display: inline-flex !important;
}

/* ============================================================================
   6. Responsive Utilities
   
   Ensure responsive behavior works with Bootstrap 5 breakpoints
   ============================================================================ */

@media (max-width: 575.98px) {
  .d-sm-none {
    display: none !important;
  }
  
  .d-sm-block {
    display: block !important;
  }
  
  .d-sm-flex {
    display: flex !important;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .d-sm-none {
    display: none !important;
  }
  
  .d-sm-block {
    display: block !important;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .d-md-none {
    display: none !important;
  }
  
  .d-md-block {
    display: block !important;
  }
  
  .d-md-flex {
    display: flex !important;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .d-lg-none {
    display: none !important;
  }
  
  .d-lg-block {
    display: block !important;
  }
  
  .d-lg-flex {
    display: flex !important;
  }
}

@media (min-width: 1200px) {
  .d-xl-none {
    display: none !important;
  }
  
  .d-xl-block {
    display: block !important;
  }
  
  .d-xl-flex {
    display: flex !important;
  }
}

/* ============================================================================
   7. Spacing Utilities
   
   Bootstrap 5 refined margin/padding utilities
   ============================================================================ */

.mb-3 {
  margin-bottom: 1rem !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mt-0 {
  margin-top: 0 !important;
}

.p-0 {
  padding: 0 !important;
}

/* ============================================================================
   8. Typography and Text Utilities
   
   Ensure text utilities are compatible
   ============================================================================ */
/*don't use BS5 bolder*/
b, strong {
    font-weight: bold;
}

/* ============================================================================
   9. Color Utility Updates
   
   Provide color classes for common Bootstrap 5 color names
   ============================================================================ */
/* the drupal sites should not be using BS colors unless they are redefined in individual site css */

/* ============================================================================
   10. Column Offset Classes (Bootstrap 3 → Bootstrap 5)
   
   Bootstrap 3 offset classes (.col-xs-offset-*, .col-sm-offset-*,
   .col-md-offset-*, .col-lg-offset-*) were removed in Bootstrap 5.
   Bootstrap 5 uses .offset-* instead. These rules restore the BS3 names,
   using Bootstrap 5 breakpoints:
     xs: no media query (all sizes)
     sm: >= 576px
     md: >= 768px
     lg: >= 992px
     xl: >= 1200px
   ============================================================================ */

/* xs offsets (no breakpoint — apply at all sizes) */
.col-xs-offset-0  { margin-left: 0 !important; }
.col-xs-offset-1  { margin-left: 8.33333333% !important; }
.col-xs-offset-2  { margin-left: 16.66666667% !important; }
.col-xs-offset-3  { margin-left: 25% !important; }
.col-xs-offset-4  { margin-left: 33.33333333% !important; }
.col-xs-offset-5  { margin-left: 41.66666667% !important; }
.col-xs-offset-6  { margin-left: 50% !important; }
.col-xs-offset-7  { margin-left: 58.33333333% !important; }
.col-xs-offset-8  { margin-left: 66.66666667% !important; }
.col-xs-offset-9  { margin-left: 75% !important; }
.col-xs-offset-10 { margin-left: 83.33333333% !important; }
.col-xs-offset-11 { margin-left: 91.66666667% !important; }

/* sm offsets (>= 576px) */
@media (min-width: 576px) {
  .col-sm-offset-0  { margin-left: 0 !important; }
  .col-sm-offset-1  { margin-left: 8.33333333% !important; }
  .col-sm-offset-2  { margin-left: 16.66666667% !important; }
  .col-sm-offset-3  { margin-left: 25% !important; }
  .col-sm-offset-4  { margin-left: 33.33333333% !important; }
  .col-sm-offset-5  { margin-left: 41.66666667% !important; }
  .col-sm-offset-6  { margin-left: 50% !important; }
  .col-sm-offset-7  { margin-left: 58.33333333% !important; }
  .col-sm-offset-8  { margin-left: 66.66666667% !important; }
  .col-sm-offset-9  { margin-left: 75% !important; }
  .col-sm-offset-10 { margin-left: 83.33333333% !important; }
  .col-sm-offset-11 { margin-left: 91.66666667% !important; }
}

/* md offsets (>= 768px) */
@media (min-width: 768px) {
  .col-md-offset-0  { margin-left: 0 !important; }
  .col-md-offset-1  { margin-left: 8.33333333% !important; }
  .col-md-offset-2  { margin-left: 16.66666667% !important; }
  .col-md-offset-3  { margin-left: 25% !important; }
  .col-md-offset-4  { margin-left: 33.33333333% !important; }
  .col-md-offset-5  { margin-left: 41.66666667% !important; }
  .col-md-offset-6  { margin-left: 50% !important; }
  .col-md-offset-7  { margin-left: 58.33333333% !important; }
  .col-md-offset-8  { margin-left: 66.66666667% !important; }
  .col-md-offset-9  { margin-left: 75% !important; }
  .col-md-offset-10 { margin-left: 83.33333333% !important; }
  .col-md-offset-11 { margin-left: 91.66666667% !important; }
}

/* lg offsets (>= 992px) */
@media (min-width: 992px) {
  .col-lg-offset-0  { margin-left: 0 !important; }
  .col-lg-offset-1  { margin-left: 8.33333333% !important; }
  .col-lg-offset-2  { margin-left: 16.66666667% !important; }
  .col-lg-offset-3  { margin-left: 25% !important; }
  .col-lg-offset-4  { margin-left: 33.33333333% !important; }
  .col-lg-offset-5  { margin-left: 41.66666667% !important; }
  .col-lg-offset-6  { margin-left: 50% !important; }
  .col-lg-offset-7  { margin-left: 58.33333333% !important; }
  .col-lg-offset-8  { margin-left: 66.66666667% !important; }
  .col-lg-offset-9  { margin-left: 75% !important; }
  .col-lg-offset-10 { margin-left: 83.33333333% !important; }
  .col-lg-offset-11 { margin-left: 91.66666667% !important; }
}

/* xl offsets (>= 1200px) */
@media (min-width: 1200px) {
  .col-xl-offset-0  { margin-left: 0 !important; }
  .col-xl-offset-1  { margin-left: 8.33333333% !important; }
  .col-xl-offset-2  { margin-left: 16.66666667% !important; }
  .col-xl-offset-3  { margin-left: 25% !important; }
  .col-xl-offset-4  { margin-left: 33.33333333% !important; }
  .col-xl-offset-5  { margin-left: 41.66666667% !important; }
  .col-xl-offset-6  { margin-left: 50% !important; }
  .col-xl-offset-7  { margin-left: 58.33333333% !important; }
  .col-xl-offset-8  { margin-left: 66.66666667% !important; }
  .col-xl-offset-9  { margin-left: 75% !important; }
  .col-xl-offset-10 { margin-left: 83.33333333% !important; }
  .col-xl-offset-11 { margin-left: 91.66666667% !important; }
}

/* ============================================================================
   11. Misc Utility Updates
   
   Provide classes from bs3 no longer present in bs5
   ============================================================================ */
.clearfix:before, .clearfix:after {
    content: " ";
    display: table;
}
/* BS3 container clearfix*/
.container:before, .container:after {
    content: " ";
    display: table;
}



/* ============================================================================
   END OF CUSTOM BOOTSTRAP 5 OVERRIDES
   ============================================================================ */