/* Homepage slider layout minimal styles */
/*
  Breakpoints alignés Bootstrap 5:
  - sm: 576px
  - md: 768px
  - lg: 992px
  - xl: 1200px
  - xxl: 1400px
*/

.front-slider,
.region--homepage-slider,
.region-homepage-slider,
.homepage-slider {
  width: 100%;
  margin: 0;
  padding: 0;
}

.front-slider .slide__content {
  position: relative;
  height: 450px;
}

@media (min-width: 768px) {
  .front-slider .slide__content {
    height: 550px;
  }
}

.front-slider .slide__media,
.front-slider .slide__constrained {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
}

.front-slider .slide__constrained {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-top: 0;
  z-index: 3;
  height: 100%;
}

.front-slider .slide__caption {
  max-width: min(640px, 90%);
  max-height: 100%;
  overflow: auto;
  background: none;
}

.front-slider .slide__media {
  position: absolute;
  inset: 0;
  height: 100%;
  z-index: 1;
  overflow: hidden;
}

.front-slider .slide__media a,
.front-slider .slide__media .b-link {
  display: block;
  height: 100%;
}

.front-slider .slide__media > * {
  display: block;
  height: 100%;
}

.front-slider .slide__media .media {
  position: absolute;
  inset: 0;
  height: 100% !important;
  width: 100% !important;
  padding-bottom: 0 !important;
}

.front-slider .slide__media img,
.front-slider .slide__media .media__element,
.front-slider .slide__media .b-lazy,
.front-slider .slide__media picture,
.front-slider .slide__media source {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.front-slider:empty,
.region--homepage-slider:empty,
.region-homepage-slider:empty,
.homepage-slider:empty {
  display: none;
}

/* Slick slider typography */
.front-slider .slide__caption,
.front-slider .slide__caption .slide__title,
.front-slider .slide__caption .slide__description,
.front-slider .slide__caption .slide__description .views-field .field-content,
.front-slider .slide__caption .slide__description p,
.front-slider .slide__caption .slide__link {
  color: #fff !important;
}

.front-slider .slide__caption {
  padding: 1.5rem;
  border-radius: 0.5rem;
  box-sizing: border-box;
}

.front-slider .slide__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  pointer-events: none;
}

.front-slider .slide__caption .slide__title {
  font-size: 2rem;
  text-transform: unset !important;
  font-weight: 700;
}

.front-slider .slide__caption .slide__title a {
  color: #fff !important;
  text-decoration: none;
}

.front-slider .slide__caption .slide__title a:hover,
.front-slider .slide__caption .slide__title a:focus {
  color: #fff !important;
  text-decoration: none;
}

@media (min-width: 992px) {
  .front-slider .slide__caption .slide__title {
    font-size: 2.5rem;
  }
}

.front-slider .slide__caption .slide__description,
.front-slider .slide__caption .slide__description .views-field,
.front-slider .slide__caption .slide__description .field-content,
.front-slider .slide__caption .slide__description p {
  font-size: 1.125rem;
}

@media (min-width: 992px) {
  .front-slider .slide__caption .slide__description,
  .front-slider .slide__caption .slide__description .views-field,
  .front-slider .slide__caption .slide__description .field-content,
  .front-slider .slide__caption .slide__description p {
    font-size: 1.357rem;
  }
}

/* Slick slider CTA button */
.front-slider .slide__link a {
  display: inline-block;
  padding: 0.75rem 1.2rem;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  background: #000;
  color: #fff !important;
  border: 2px solid #fff;
  border-radius: 0.375rem;
  transition: background 0.15s ease, color 0.15s ease;
}

.front-slider .slide__link a:hover,
.front-slider .slide__link a:focus {
  background: #fff;
  color: #000 !important;
  border-color: #fff;
  text-decoration: none;
}

/* Preserve right-aligned caption when Slick drops to a single slide (unslick). */
.front-slider .slick--less .slide__constrained,
.front-slider .unslick .slide__constrained {
  justify-content: flex-end;
}

.front-slider .slick--less .slide__constrained > .slide__caption,
.front-slider .unslick .slide__constrained > .slide__caption {
  position: relative;
  margin-left: auto;
  right: auto;
  left: auto;
  text-align: left;
}

@media (min-width: 1024px) {
  .front-slider .slick--less .slide__constrained > .slide__caption,
  .front-slider .unslick .slide__constrained > .slide__caption {
    max-width: 45%;
    position: relative;
    right: 0;
    left: auto;
    width: 100%;
  }
}

/* Homepage specific styling & theme color variables */
:root {
  --nm-black: #231f1e;
  --nm-green: #00a650;
  --nm-red: #ef1923;
  --nm-black-rgb: 35,31,30;
  --nm-green-rgb: 0,166,80;
  --nm-red-rgb: 239,25,35;
}

/* Rows wrapper */
.front-rows { display: block; }
.front-row { padding: 3.5rem 0; position:relative; z-index:0; }
.front-row .region-inner { max-width: 1320px; margin:0 auto; }

/* Nouvelle alternance: blanc, rouge, blanc, vert, blanc */
.front-row-1 { background:#fff; color: var(--nm-black); }
.front-row-2 { background: var(--nm-green); color:#fff; }
.front-row-3 { background:#fff; color: var(--nm-black); }
.front-row-4 { background: var(--nm-red); color:#fff; }
.front-row-5 { background:#fff; color: var(--nm-black); }

/* Optional subtle separators */
.front-row + .front-row { position:relative; }
.front-row + .front-row:before { content:""; position:absolute; top:0; left:0; right:0; height:4px; background: linear-gradient(to right, var(--nm-red), var(--nm-green)); opacity:.3; }

/* Accessibility: ensure links are visible */
.front-row a { font-weight:600; text-decoration: none; }
.front-row-2 a { color:#fff; }
.front-row-4 a { color:#fff; }
.front-row a:hover, .front-row a:focus { text-decoration: underline; }

/* Utility classes */
.bg-flag-gradient { background: linear-gradient(90deg, var(--nm-green) 0%, var(--nm-red) 100%); }
.text-flag-green { color: var(--nm-green); }
.text-flag-red { color: var(--nm-red); }
.text-flag-black { color: var(--nm-black); }

/* Region specific overrides if needed */
.region--homepage-slider .view { margin:0; }

@media (max-width: 767px) {
  .front-row { padding: 2.25rem 0; }
}

/* Blazy grid cards on homepage rows */
.front-row .item-list--blazy-grid .blazy {
  margin: 0;
  padding: 0;
}

.front-row .item-list--blazy-grid .blazy > li.grid {
  list-style: none;
  margin: 0;
  padding: 0.75rem;
}

.front-row .item-list--blazy-grid .grid__content {
  background: #fff;
  color: var(--nm-black);
  padding: 1rem;
  height: 100%;
}

.front-row .item-list--blazy-grid .grid__content a {
  color: var(--nm-black);
}

.front-row .item-list--blazy-grid .grid__content h2,
.front-row .item-list--blazy-grid .grid__content h2 a {
  color: var(--nm-black);
}

#block-nasyonmatinik-views-block-accueil-mise-en-avant-block-1 .grid__content {
  text-align: center;
}

/* ------------------------------------------------------------------
  TODO: Removed broad contextual pointer-events override that blocked
  admin interactivity. If needed, reintroduce a narrower, scoped fix
  that does not affect the admin toolbar or global page controls.

  Narrow contextual-links fix
  ----------------------------
  The previous global approach was too broad and could interfere with
  the admin toolbar. Apply a narrow rule limited to contextual wrappers
  that appear inside Views output (common selectors like
  `.views-element-container`, `.view`, `.views-row`). This makes those
  wrappers non-interactive so they don't capture clicks on the underlying
  content, but re-enables interaction only for the trigger and the
  contextual-links themselves. Avoid using `!important` so this has less
  risk of clashing with other global UI rules.

  Test: verify the contextual trigger/button remains operable and that
  links/images in the view are clickable. If your theme uses other
  structures for contextual wrappers, we can extend selectors conservatively.
*/
.views-element-container .contextual,
.view .contextual,
.views-row .contextual,
.views-element-container .contextual-links-wrapper {
  pointer-events: none; /* don't let wrapper block underlying content */
}

/* Re-enable only for the actual trigger and the contextual-links so the
  menu remains usable. Keep z-index local and moderate. */
.views-element-container .contextual .trigger,
.views-element-container .contextual .contextual-links-trigger,
.views-element-container .contextual .contextual-links,
.views-element-container .contextual .contextual-links a {
  pointer-events: auto;
  z-index: 1400;
}
