/**
 * Compatibility for project-specific components and legacy markup that can be
 * emitted by Drupal block configuration or custom modules.
 */
/* Legacy page wrappers: preserve responsive containers used directly inside a row. */
.main-container > .row > .container {
  width: 100% !important;
  max-width: 100% !important;
  margin-right: auto !important;
  margin-left: auto !important;
}

@media (min-width: 576px) {
  .main-container > .row > .container { max-width: 540px !important; }
}

@media (min-width: 768px) {
  .main-container > .row > .container { max-width: 720px !important; }
}

@media (min-width: 992px) {
  .main-container > .row > .container { max-width: 960px !important; }
}

@media (min-width: 1200px) {
  .main-container > .row > .container { max-width: 1140px !important; }
}

@media (min-width: 1400px) {
  .main-container > .row > .container { max-width: 1320px !important; }
}

.sc-icon,
.glyphicon {
  display: inline-block;
  font-style: normal;
  line-height: 1;
  vertical-align: -0.125em;
}

.sc-icon-calendar::before,
.glyphicon-calendar::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3.5' width='12' height='11' rx='1.5'/%3E%3Cpath d='M5 1v4M11 1v4M2 7h12'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3.5' width='12' height='11' rx='1.5'/%3E%3Cpath d='M5 1v4M11 1v4M2 7h12'/%3E%3C/svg%3E") center / contain no-repeat;
}

.sc-icon-camera::before,
.glyphicon-camera::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1.5' y='4.5' width='13' height='9' rx='1.5'/%3E%3Cpath d='M5 4.5l1-2h4l1 2'/%3E%3Ccircle cx='8' cy='9' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='1.5' y='4.5' width='13' height='9' rx='1.5'/%3E%3Cpath d='M5 4.5l1-2h4l1 2'/%3E%3Ccircle cx='8' cy='9' r='2.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Bootstrap 5 article sidebars must not retain the old 480/528px view widths. */
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) {
  min-width: 0;
  overflow: hidden;
}

.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1,
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 .view,
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 .view-content,
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 .item-list,
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 ul,
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 li {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 .view-content.row {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 img,
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 .views-field-field-image,
.path-node .main-container :where(.sidebar-secondary, aside.col-md-3) #block-views-block-te-puede-interesar-block-1 .views-field-title {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}

.modal-close-image,
.modal-close-text {
  margin-left: auto;
  border: 0;
  background: transparent;
}

.modal-close-image {
  padding: 0;
}

/* Keep the news ticker to one line while Slick is loading or unavailable. */
#block-bloquepreheader .autoplay:not(.slick-initialized),
#block-bloquepreheader .autoplay-mobile:not(.slick-initialized) {
  display: flex;
  flex-wrap: nowrap;
  max-width: 100%;
  height: 35px;
  overflow: hidden;
  white-space: nowrap;
}

#block-bloquepreheader .autoplay:not(.slick-initialized) > .item,
#block-bloquepreheader .autoplay-mobile:not(.slick-initialized) > .item {
  flex: 0 0 auto;
}

/* Bootstrap 3 classes can still arrive from stored Drupal block markup. */
.hidden {
  display: none !important;
}

@media (max-width: 575.98px) {
  .col-xs-1 { flex: 0 0 auto; width: 8.33333333%; }
  .col-xs-2 { flex: 0 0 auto; width: 16.66666667%; }
  .col-xs-3 { flex: 0 0 auto; width: 25%; }
  .col-xs-4 { flex: 0 0 auto; width: 33.33333333%; }
  .col-xs-5 { flex: 0 0 auto; width: 41.66666667%; }
  .col-xs-6 { flex: 0 0 auto; width: 50%; }
  .col-xs-7 { flex: 0 0 auto; width: 58.33333333%; }
  .col-xs-8 { flex: 0 0 auto; width: 66.66666667%; }
  .col-xs-9 { flex: 0 0 auto; width: 75%; }
  .col-xs-10 { flex: 0 0 auto; width: 83.33333333%; }
  .col-xs-11 { flex: 0 0 auto; width: 91.66666667%; }
  .col-xs-12 { flex: 0 0 auto; width: 100%; }
}

/* Header layout formerly provided by Bootstrap 3 col-xs-* classes. */
@media (max-width: 767.98px) {
  header#navbar,
  header#navbar > .container,
  header#navbar > .container-fluid {
    width: 100% !important;
    max-width: none !important;
  }

  header#navbar > .container,
  header#navbar > .container-fluid {
    display: block !important;
  }

  header#navbar .region-headernew {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  header#navbar #block-bloquepreheader {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
    overflow: hidden;
  }

  header#navbar #block-bloquepreheader .container.mobile {
    width: 100% !important;
    max-width: none !important;
    padding: 0 12px !important;
  }

  header#navbar #block-bloquepreheader .container.mobile > .row {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    margin: 0 !important;
  }

  header#navbar #block-bloquepreheader .title-container {
    flex: 0 0 25% !important;
    width: 25% !important;
    max-width: 25% !important;
  }

  header#navbar #block-bloquepreheader .carousel-container {
    flex: 0 0 75% !important;
    width: 75% !important;
    max-width: 75% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  header#navbar #block-bloquepreheader .slick-list {
    min-width: 0;
    overflow: hidden !important;
  }

  header#navbar #block-branding {
    grid-column: 1;
    grid-row: 2;
    width: auto !important;
    margin: 0 !important;
    padding: 8px 0 8px 15px !important;
  }

  header#navbar #block-botonenvivo {
    grid-column: 2;
    grid-row: 2;
    justify-self: center;
    width: auto !important;
    margin: 0 !important;
    padding: 0 8px !important;
  }

  header#navbar #block-colombia-subtheme-main-menu {
    display: none !important;
  }

  header#navbar #block-botonesadicionales {
    grid-column: 3;
    grid-row: 2;
    justify-self: end;
    width: auto !important;
    margin: 0 !important;
    padding: 0 15px 0 0 !important;
    float: none !important;
  }

  header#navbar #block-botonesadicionales .botones {
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
  }

  header#navbar #block-botonesadicionales .open-mn-seg {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* The navbar template has nested legacy .row wrappers; keep them full width. */
header#navbar > .container,
header#navbar > .container-fluid {
  display: block !important;
}

header#navbar > .container > .row:first-child,
header#navbar > .container-fluid > .row:first-child,
header#navbar .region-headernew {
  width: 100% !important;
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* Desktop header: one compact container row below the full-width ticker. */
@media (min-width: 992px) {
  header#navbar .region-headernew {
    --sc-header-container-width: 960px;
    display: grid !important;
    grid-template-columns: 170px minmax(130px, auto) minmax(0, 1fr) 48px !important;
    grid-template-rows: minmax(70px, auto) !important;
    align-items: center !important;
    column-gap: 16px !important;
    position: relative !important;
    box-sizing: border-box !important;
    min-height: 105px !important;
    padding: 35px max(12px, calc((100% - var(--sc-header-container-width)) / 2)) 0 !important;
  }

  header#navbar .region-headernew > #block-bloquepreheader {
    position: absolute !important;
    inset: 0 0 auto 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: 35px !important;
    margin: 0 !important;
  }

  header#navbar #block-branding,
  header#navbar #block-botonenvivo,
  header#navbar #block-colombia-subtheme-main-menu,
  header#navbar #block-botonesadicionales {
    grid-row: 1 !important;
    align-self: center !important;
    width: auto !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    float: none !important;
  }

  header#navbar #block-branding {
    grid-column: 1 !important;
    padding: 0 !important;
  }

  header#navbar #block-botonenvivo {
    grid-column: 2 !important;
    justify-self: start !important;
    padding: 0 !important;
  }

  header#navbar #block-colombia-subtheme-main-menu {
    grid-column: 3 !important;
    width: 100% !important;
    padding: 0 !important;
  }

  header#navbar #block-colombia-subtheme-main-menu .navbar-nav {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: clamp(10px, 1.4vw, 24px) !important;
    width: 100% !important;
    margin: 0 !important;
  }

  header#navbar #block-colombia-subtheme-main-menu .navbar-nav > li {
    flex: 0 1 auto !important;
    margin-top: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
  }

  header#navbar #block-colombia-subtheme-main-menu .navbar-nav > li.first {
    margin-left: 0 !important;
  }

  header#navbar #block-colombia-subtheme-main-menu .navbar-nav a {
    padding-right: 0 !important;
    white-space: nowrap !important;
  }

  header#navbar #block-botonesadicionales {
    grid-column: 4 !important;
    justify-self: end !important;
    padding: 0 !important;
  }

  header#navbar #block-botonesadicionales .botones {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    position: static !important;
    inset: auto !important;
    margin: 0 !important;
  }
}

@media (min-width: 1200px) {
  header#navbar .region-headernew {
    --sc-header-container-width: 1140px;
  }
}

@media (min-width: 1400px) {
  header#navbar .region-headernew {
    --sc-header-container-width: 1320px;
  }
}

/* Mobile slide-out menu: keep every control inside the viewport. */
@media (max-width: 767.98px) {
  header#navbar .contentmenu {
    position: fixed !important;
    inset: var(--drupal-displace-offset-top, 0px) 0 auto auto !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: calc(100dvh - var(--drupal-displace-offset-top, 0px)) !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
  }

  header#navbar .contentmenu,
  header#navbar .contentmenu *,
  header#navbar .contentmenu *::before,
  header#navbar .contentmenu *::after {
    box-sizing: border-box;
  }

  header#navbar .contentmenu .menu-content,
  header#navbar .contentmenu .search,
  header#navbar .contentmenu .body-search,
  header#navbar .contentmenu .enlaces {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  header#navbar .contentmenu .logo-search {
    width: 100% !important;
    padding: 28px 18px 20px !important;
  }

  header#navbar .contentmenu .logo-search > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
  }

  header#navbar .contentmenu .logo-search > .row > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 0 !important;
  }

  header#navbar .contentmenu .logo-search .btn {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
  }

  header#navbar .contentmenu .logo-search .col-4 .btn {
    justify-content: flex-end !important;
  }

  header#navbar .contentmenu .logo-search img {
    display: block;
    max-width: 100% !important;
    height: auto !important;
  }

  header#navbar .contentmenu #block-exposedformsearch-senalpage-1 {
    width: 100% !important;
    margin: 0 !important;
    padding: 24px 18px 18px !important;
  }

  header#navbar .contentmenu #views-exposed-form-buscador {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 48px !important;
    align-items: center !important;
    column-gap: 8px !important;
    width: 100% !important;
    margin: 0 !important;
  }

  header#navbar .contentmenu #views-exposed-form-buscador::after {
    grid-column: 1 / -1;
    width: 100% !important;
    margin: 10px 0 0 !important;
  }

  header#navbar .contentmenu #views-exposed-form-buscador .form-item,
  header#navbar .contentmenu #views-exposed-form-buscador .form-actions {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  header#navbar .contentmenu #views-exposed-form-buscador .form-control {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  header#navbar .contentmenu #edit-submit-search {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: static !important;
    width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 10px !important;
  }

  header#navbar .contentmenu #edit-submit-search img {
    display: block !important;
    width: 26px !important;
    height: 26px !important;
    margin: 0 !important;
    object-fit: contain;
  }

  header#navbar .contentmenu .body-search {
    padding: 16px 28px 28px !important;
  }

  header#navbar .contentmenu .button-envivo,
  header#navbar .contentmenu .button-envivo a {
    width: 100% !important;
  }

  header#navbar .contentmenu .button-envivo a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    max-width: 310px !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 10px 24px !important;
    text-align: center !important;
  }

  header#navbar .contentmenu .button-envivo a span {
    position: static !important;
  }

  header#navbar .contentmenu .iconos-redes {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 14px !important;
    width: 100% !important;
    margin: 0 0 24px !important;
  }

  header#navbar .contentmenu .iconos-redes .title-siguenos-redes,
  header#navbar .contentmenu .iconos-redes a,
  header#navbar .contentmenu .iconos-redes .first-element {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  header#navbar .contentmenu .iconos-redes img {
    display: block !important;
    max-width: 36px !important;
    height: auto !important;
  }

  header#navbar .contentmenu .otros_fila {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px 16px !important;
    width: 100% !important;
  }
}

/* Keep the complete mobile menu above page heroes and other positioned content. */
@media (max-width: 767.98px) {
  header#navbar .contentmenu.active {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    transform: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    background: #f5f5f0 !important;
    isolation: isolate;
    z-index: 2147483000 !important;
  }

  header#navbar .contentmenu.active .menu-content {
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
    width: 100% !important;
    min-height: 100% !important;
    height: auto !important;
    overflow: visible !important;
    background: #f5f5f0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 1 !important;
  }

  header#navbar .contentmenu.active .search,
  header#navbar .contentmenu.active .body-search,
  header#navbar .contentmenu.active .enlaces,
  header#navbar .contentmenu.active .main-menu,
  header#navbar .contentmenu.active .iconos-redes {
    display: block !important;
    position: relative !important;
    float: none !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 2 !important;
  }

  header#navbar .contentmenu.active .body-search {
    flex: 1 0 auto !important;
    background: #f5f5f0 !important;
  }

  header#navbar .contentmenu.active .iconos-redes {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
  }
}