/**
 * Owl Carousel 1.x -> 2.x control markup compatibility.
 *
 * css/style.css was compiled against the Owl 1.x DOM that owlcarousel 8.x-1.0-beta1
 * shipped (owl 1.3.3, bundled inside the module). Drupal 11 moved the library to
 * owlcarousel2 / Owl 2.3.4, which renders different elements, so every arrow rule in
 * style.css became orphaned:
 *
 *   Owl 1.x                      Owl 2.x
 *   .owl-controls                .owl-nav  +  .owl-dots
 *   .owl-controls .owl-buttons   (gone, buttons are direct children of .owl-nav)
 *   .owl-wrapper-outer           .owl-stage-outer
 *   .owl-page                    .owl-dot
 *
 * Consequences seen on meesi.pt before this file: .owl-nav stayed in normal flow
 * directly under the slides, so the banner block grew ~34px and the two buttons landed
 * on top of the search field underneath it (hit-testing at the button centre returned
 * the INPUT, so the arrows could not be clicked at all). The buttons also rendered the
 * raw navText ("prev" / "seguinte") at 5px wide, because font-size:0 and the chevron
 * :before lived only in the orphaned rules.
 *
 * These are the declarations from scss/components/home-page.scss and
 * scss/components/page.scss, re-targeted at the Owl 2.x markup, values unchanged.
 * Nothing here restyles the slides themselves.
 *
 * Loaded after css/style.css and after owl.theme.default.css (see
 * pee_bootstrap_sass.libraries.yml), and always more specific than the Owl defaults,
 * so no !important is needed except where the original rules already used it.
 *
 * Added 2026-10-16; see docs/webserver/2026-10-16-meesi-migration-repair-plan.md
 */

/* ------------------------------------------------------------------ banner --- */

/* Was .view-id-homepage_banner .owl-controls */
.view-id-homepage_banner .owl-nav,
.view-id-homepage_banner .owl-dots {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
  height: fit-content;
  width: 100%;
  margin-top: 0;
  /* Full-width strip over the slides: keep it click-through so banner links stay
     reachable, and hand pointer events back to the buttons. */
  pointer-events: none;
}

/* Was .page-node-41 .view-id-homepage_banner .owl-controls */
.page-node-41 .view-id-homepage_banner .owl-nav,
.page-node-41 .view-id-homepage_banner .owl-dots {
  bottom: 0.3125rem;
}

/* Was .view-id-homepage_banner .owl-controls .owl-page span (dots are disabled in the
   view today; kept so re-enabling them does not fall back to Owl's grey). */
.view-id-homepage_banner .owl-dots .owl-dot span {
  background: #FFE8BE;
}

/*
 * Was .view-id-homepage_banner .owl-controls .owl-next / .owl-prev
 *
 * The clickable box has to be sized here. Under Owl 1.x it came from owl.theme.css
 * `.owl-buttons div { padding: 3px 9px }`, and the chevron :before was positioned against
 * that box. Owl 2.x has no equivalent rule, and font-size:0 leaves the button empty, so
 * each arrow measured 0x0: clipped against the right edge with no hit area at all. The
 * width/height/padding below are the tap target only -- the glyph stays centred because
 * :before is centred too.
 *
 * owl.carousel.css resets these buttons with `.owl-carousel .owl-nav button.owl-prev {
 * padding: 0 !important }`, specificity 0-3-1, so the sizing lives in its own rule that
 * names the button element (0-3-1, later in the cascade) and keeps the !important.
 */
.view-id-homepage_banner .owl-nav .owl-prev,
.view-id-homepage_banner .owl-nav .owl-next {
  font-size: 0 !important;
  background: none !important;
  position: relative;
  pointer-events: auto;
}

.view-id-homepage_banner .owl-nav button.owl-prev,
.view-id-homepage_banner .owl-nav button.owl-next {
  box-sizing: content-box;
  width: 0.9375rem;
  height: 1.5625rem;
  padding: 0.625rem !important;
}

/* Clear the floated arrows so .owl-nav takes their height. Without this the nav collapses
   to 0px and, because it is centred with translate(-50%,-50%), the arrows hang ~22px low. */
.view-id-homepage_banner .owl-nav::after {
  content: '';
  display: table;
  clear: both;
}

/* Was ... .owl-next:before, ... .owl-prev:before */
.view-id-homepage_banner .owl-nav .owl-next:before,
.view-id-homepage_banner .owl-nav .owl-prev:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 1.5625rem;
  width: 0.9375rem;
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

/* Was .view-id-homepage_banner .owl-controls .owl-prev */
.view-id-homepage_banner .owl-nav .owl-prev {
  float: left;
}

.view-id-homepage_banner .owl-nav .owl-prev:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='17.273' viewBox='0 0 10 17.273'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%23ffe8be;%7D%3C/style%3E%3C/defs%3E%3Cg transform='translate(10 17.273) rotate(180)'%3E%3Cg transform='translate(0 0)'%3E%3Cpath class='a' d='M.909,17.273A.909.909,0,0,1,.284,15.7L7.768,8.637.284,1.57A.909.909,0,0,1,1.534.248L9.716,7.976a.91.91,0,0,1,0,1.322L1.534,17.025A.907.907,0,0,1,.909,17.273Z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

/* Was .view-id-homepage_banner .owl-controls .owl-next */
.view-id-homepage_banner .owl-nav .owl-next {
  float: right;
}

.view-id-homepage_banner .owl-nav .owl-next:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='17.273' viewBox='0 0 10 17.273'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%23ffe8be;%7D%3C/style%3E%3C/defs%3E%3Cg transform='translate(0 0)'%3E%3Cpath class='a' d='M.909,17.273A.909.909,0,0,1,.284,15.7L7.768,8.637.284,1.57A.909.909,0,0,1,1.534.248L9.716,7.976a.91.91,0,0,1,0,1.322L1.534,17.025A.907.907,0,0,1,.909,17.273Z'/%3E%3C/g%3E%3C/svg%3E");
}

/* -------------------------------------------------- chapters grid (home) --- */

/* Was #block-... .owl-wrapper-outer { order: 2 } */
#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-stage-outer {
  order: 2;
}

/* Was #block-... .owl-slider-wrapper .owl-controls */
#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav {
  order: 1;
  text-align: right;
  margin-bottom: 4.0625rem;
  margin-top: 0;
  display: block;
  /* Was .owl-controls .owl-buttons { margin-right: 1.5625rem }; that wrapper no longer
     exists in 2.x, so the same inset belongs on the nav itself. */
  margin-right: 1.5625rem;
}

@media (max-width: 479px) {
  #block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav {
    display: none;
  }
}

/* Was .owl-controls .owl-prev / .owl-next */
#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-prev {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/themes/custom/pee_bootstrap_sass/images/icons/carousel-left-hover.svg");
  margin-right: 0.9375rem;
}

#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-next {
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/themes/custom/pee_bootstrap_sass/images/icons/carousel-right-hover.svg");
  margin-left: 0.9375rem;
}

#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-prev,
#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-next {
  color: #b3b3b380;
  background-color: transparent;
  background-size: 40%;
  border: 1px solid #FDB940;
  padding: 20px 20px !important; /* owl.carousel.css resets nav buttons with padding:0 !important */
  transition: .3s background-color ease-out, .3s border ease-out;
}

#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-prev:hover,
#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-prev:focus,
#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-next:hover,
#block-views-block-chapters-home-block-block-1 .owl-slider-wrapper .owl-nav .owl-next:focus {
  border-color: #fdb9400f;
  background-color: #fdb94038;
}
