/* ========== GRID ========== */
.gpgm-int-grid{
  display:grid;
  gap:16px;
  width:100%;
  grid-template-columns: repeat(var(--gpgm-cols, 1), 1fr);
}
.gpgm-int-grid.columns-1{--gpgm-cols:1}
.gpgm-int-grid.columns-2{--gpgm-cols:2}
.gpgm-int-grid.columns-3{--gpgm-cols:3}
.gpgm-int-grid.columns-4{--gpgm-cols:4}

/* ========== WIDGET WRAPPER (BLINDATO) ========== */
.gpgm-interviste-widget {
  /* Contenimento totale */
  position: relative !important;
  isolation: isolate !important;
  contain: layout paint style !important;
  
  /* Dimensioni sicure */
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  
  /* Box model blindato */
  box-sizing: border-box !important;
  overflow: hidden !important;
  
  /* Stacking context pulito */
  z-index: 0 !important;
  
  /* Reset margin/padding potenzialmente problematici */
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Forza il contenimento anche nei container Elementor */
.elementor-widget-container .gpgm-interviste-widget,
.e-con .gpgm-interviste-widget,
.elementor-column .gpgm-interviste-widget,
.elementor .gpgm-interviste-widget {
  width: 100% !important;
  max-width: 100% !important;
  flex: 0 1 auto !important;
  align-self: stretch !important;
  min-width: 0 !important;
}

/* ========== CARD ========== */
.gpgm-int-card{
  position:relative;
  background:#fff;
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
  display:flex; 
  flex-direction:column;
  width:100%;
  max-width:100%;
  overflow:hidden;
  z-index:0;
}

/* ========== MEDIA BOX (BLINDATO) ========== */
.gpgm-int-media{
  position:relative;
  width:100%;
  line-height:0; 
  font-size:0;
  aspect-ratio: var(--gpgm-aspect, 16/9);
  overflow:hidden;
  border-radius:12px;
  z-index:0;
  
  /* Forza il contenimento */
  contain: layout paint !important;
  min-height: 0 !important;
  flex-shrink: 0 !important;
}

/* Fallback per browser vecchi */
@supports not (aspect-ratio: 16/9) {
  .gpgm-int-media{ 
    padding-top: var(--gpgm-pt, 56.25%) !important;
    height: 0 !important;
  }
}

.gpgm-int-media-inner{
  position:absolute; 
  inset:0;
  overflow:hidden; 
  border-radius:inherit;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
}

/* Normalizza wrapper oEmbed/Elementor - REGOLE RINFORZATE */
.gpgm-int-media-inner > *,
.gpgm-int-media-inner > .wp-video,
.gpgm-int-media-inner > .wp-block-embed,
.gpgm-int-media-inner > .fluid-width-video-wrapper,
.gpgm-int-media-inner > figure{
  position:absolute !important; 
  inset:0 !important;
  margin:0 !important; 
  padding:0 !important;
  width:100% !important; 
  height:100% !important;
  max-width:100% !important; 
  max-height:100% !important;
  line-height:0 !important; 
  border-radius:inherit !important;
  overflow:hidden !important; 
  box-sizing:border-box !important;
}

/* Iframe/Video: REGOLE RINFORZATE - FIX DESKTOP */
.gpgm-int-media-inner iframe,
.gpgm-int-media-inner video{
  position:absolute !important; 
  inset:0 !important;
  width:100% !important; 
  height:100% !important;
  display:block !important;
  max-width:100% !important; 
  max-height:100% !important;
  border:0 !important; 
  outline:0 !important;
  background:#000 !important; 
  border-radius:inherit !important;
  z-index:0 !important;
  
  /* FIX DESKTOP: mantieni aspect ratio senza ritagli */
  object-fit: contain !important;
}

/* Overlay poster */
.gpgm-int-overlay{
  position:absolute; 
  inset:0; 
  z-index:1;
  border-radius:inherit;
  background-position:center; 
  background-repeat:no-repeat;
  background-size: var(--gpgm-bsize, cover);
  display:flex; 
  align-items:center; 
  justify-content:center;
  cursor:pointer !important;
}
.gpgm-int-overlay-play{
  width:64px; 
  height:64px; 
  border-radius:50%;
  background:rgba(0,0,0,.55); 
  position:relative;
}
.gpgm-int-overlay-play::after{
  content:""; 
  position:absolute; 
  left:50%; 
  top:50%;
  transform:translate(-40%,-50%);
  border-style:solid; 
  border-width:12px 0 12px 18px;
  border-color:transparent transparent transparent #fff;
}

/* ========== META / TESTI ========== */
.gpgm-int-title{ 
  margin:0 0 6px; 
  font-size:18px; 
  font-weight:700; 
  line-height:1.25; 
}
.gpgm-int-title a{ 
  color:#111; 
  text-decoration:none; 
}
.gpgm-int-title a:hover{ 
  text-decoration:underline; 
}
.gpgm-int-date{ 
  margin:0 0 8px; 
  color:#666; 
  font-size:12px; 
}
.gpgm-int-excerpt{ 
  margin:0; 
  color:#333; 
  font-size:14px; 
  line-height:1.5; 
}

.gpgm-int-meta:empty,
.gpgm-interviste-widget.no-meta .gpgm-int-meta{
  display:none !important; 
  margin:0 !important; 
  padding:0 !important;
}
.gpgm-int-meta{ 
  min-height:0 !important; 
  padding: 16px;
  box-sizing: border-box;
}
.gpgm-int-card > *:first-child{ 
  margin-top:0 !important; 
}

/* ========== MODAL ========== */
.gpgm-modal{ 
  position:fixed; 
  inset:0; 
  display:none; 
  z-index:99999; 
}
.gpgm-modal.is-open{ 
  display:block; 
}
.gpgm-modal-backdrop{ 
  position:absolute; 
  inset:0; 
  background:rgba(0,0,0,.65); 
}
.gpgm-modal-dialog{
  position:relative; 
  width:min(var(--gpgm-modal-w, 960px), 96vw);
  max-height:90vh; 
  margin:4vh auto; 
  background:#000;
  border-radius:12px; 
  box-shadow:0 20px 60px rgba(0,0,0,.4);
  padding:16px 16px 12px; 
  display:flex; 
  flex-direction:column;
}
.gpgm-modal-inner{ 
  width:100%; 
  overflow:hidden; 
}
.gpgm-modal-inner iframe, 
.gpgm-modal-inner video{
  width:100%; 
  height:auto; 
  max-height:75vh; 
  display:block;
}

/* ========== FIX PER IL BOTTONE CHIUDI MODAL ========== */
.gpgm-modal-close{
  position: absolute !important; 
  top: 8px !important; 
  right: 8px !important;
  width: 40px !important; 
  height: 40px !important; 
  border-radius: 8px !important;
  border: 0 !important; 
  background: rgba(255,255,255,.9) !important; 
  color: #000 !important;
  font-size: 24px !important; 
  font-weight: bold !important;
  line-height: 1 !important; 
  text-align: center !important; 
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  transition: background-color 0.2s ease !important;
  z-index: 100000 !important; /* Aumentato drasticamente */
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}

.gpgm-modal-close:hover{
  background: rgba(255,255,255,1) !important; 
  opacity: 1 !important;
}

/* Assicurati che l'intera area del bottone sia cliccabile */
.gpgm-modal-close::before {
  content: '' !important;
  position: absolute !important;
  top: -10px !important;
  right: -10px !important;
  bottom: -10px !important;
  left: -10px !important;
  z-index: -1 !important;
}

/* Previeni qualsiasi effetto hover che potrebbe nascondere il bottone */
.gpgm-modal-close:hover,
.gpgm-modal-close:focus,
.gpgm-modal-close:active {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

body.gpgm-modal-open{ 
  overflow:hidden; 
}

/* ========== RESPONSIVE - MOBILE FIRST ========== */

/* Tablet */
@media (max-width: 1024px) {
  .gpgm-int-grid.columns-3,
  .gpgm-int-grid.columns-4 {
    grid-template-columns: repeat(2, 1fr) !important;
    --gpgm-cols: 2;
  }
}

/* Mobile Large */
@media (max-width: 768px) {
  .gpgm-int-grid {
    grid-template-columns: 1fr !important;
    --gpgm-cols: 1;
    gap: 12px !important;
  }
  
  .gpgm-int-card {
    border-radius: 12px !important;
    margin: 0 !important;
  }
  
  .gpgm-int-media {
    border-radius: 12px !important;
  }
  
  /* For mobile, use cover to fill the container */
  .gpgm-int-media-inner iframe,
  .gpgm-int-media-inner video {
    object-fit: cover !important;
  }
  
  /* Forza il reset completo sui container mobile */
  .elementor .gpgm-interviste-widget,
  .e-con .gpgm-interviste-widget,
  .elementor-column .gpgm-interviste-widget,
  .elementor-widget-container .gpgm-interviste-widget {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
  }
  
  /* Mobile fix per il bottone close */
  .gpgm-modal-close {
    width: 44px !important;
    height: 44px !important;
    top: 10px !important;
    right: 10px !important;
    font-size: 26px !important;
    z-index: 100000 !important;
  }
}

/* Mobile Small */
@media (max-width: 480px) {
  .gpgm-int-grid {
    gap: 8px !important;
  }
  
  .gpgm-int-card {
    border-radius: 8px !important;
  }
  
  .gpgm-int-media {
    border-radius: 8px !important;
  }
  
  .gpgm-int-title {
    font-size: 16px !important;
  }
  
  .gpgm-int-meta {
    padding: 12px !important;
  }
}

/* ========== HARDENING EXTREME PER ELEMENTOR ========== */

/* Previene qualsiasi interferenza di Elementor */
.elementor-widget-gpgm_interviste_widget {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.elementor-widget-gpgm_interviste_widget .elementor-widget-container {
  overflow: visible !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Fix per i nuovi container Flex di Elementor */
.e-con > .gpgm-interviste-widget,
.e-container > .gpgm-interviste-widget {
  flex: 0 1 auto !important;
  align-self: stretch !important;
}

/* iOS/Safari: sblocca calcolo altezza in layout flex */
.elementor .gpgm-interviste-widget .gpgm-int-media,
.e-con .gpgm-interviste-widget .gpgm-int-media{ 
  min-height:1px; 
}