/*
 * Lamari Diarios Core 1.40.707
 * CEPAS · cierre responsive del hero y control "Ampliar fotografía".
 *
 * Objetivos:
 * 1) En tablet, texto e imagen ocupan columnas físicas distintas: nunca se solapan.
 * 2) En móvil, imagen, texto y banner se apilan sin capas absolutas cruzadas.
 * 3) El control de ampliación es hijo directo del hero y permanece visible en
 *    toda CEPAS que tenga fotografía, independientemente del origen de la imagen.
 */

/* El control ya no vive dentro del contenedor recortable de la imagen. */
.kd-strain-detail-app .kd-strain-premium-hero > .kd-strain-photo-zoom {
  z-index:30 !important;
  display:inline-flex !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:none !important;
  animation:none !important;
  transition:background .18s ease,border-color .18s ease !important;
}

@media (min-width:700px) and (max-width:1100px) {
  /* Grid real: el media deja de ocupar todo el hero por debajo del copy. */
  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-hero,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-hero,
  .kd-strain-detail-app .kd-strain-premium-hero {
    display:grid !important;
    grid-template-columns:minmax(0,58%) minmax(0,42%) !important;
    grid-template-rows:auto auto !important;
    height:auto !important;
    min-height:466px !important;
    max-height:none !important;
    align-items:stretch !important;
  }

  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-media,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-media,
  .kd-strain-detail-app .kd-strain-premium-media {
    position:relative !important;
    inset:auto !important;
    grid-column:2 !important;
    grid-row:1 !important;
    width:100% !important;
    height:100% !important;
    min-height:390px !important;
    max-height:none !important;
    overflow:hidden !important;
    z-index:2 !important;
    background:#0a1810 !important;
  }

  /* En tablet la columna de imagen no necesita ningún degradado cruzando el texto. */
  .kd-strain-detail-app .kd-strain-premium-media:before,
  .kd-strain-detail-app .kd-strain-premium-media:after,
  .kd-strain-detail-app .kd-strain-premium-media-backdrop {
    display:none !important;
    content:none !important;
  }

  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-media > img.kd-strain-premium-photo,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-media > img.kd-strain-premium-photo,
  .kd-strain-detail-app .kd-strain-premium-media > img.kd-strain-premium-photo {
    position:absolute !important;
    inset:14px 12px !important;
    width:calc(100% - 24px) !important;
    height:calc(100% - 28px) !important;
    min-width:0 !important;
    min-height:0 !important;
    max-width:calc(100% - 24px) !important;
    max-height:calc(100% - 28px) !important;
    object-fit:contain !important;
    object-position:center center !important;
    z-index:3 !important;
  }

  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-copy,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-copy,
  .kd-strain-detail-app .kd-strain-premium-copy {
    position:relative !important;
    grid-column:1 !important;
    grid-row:1 !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:390px !important;
    max-width:none !important;
    padding:34px 26px 30px 34px !important;
    overflow:visible !important;
    z-index:5 !important;
    box-sizing:border-box !important;
  }

  /* El banner forma una segunda fila y deja de cubrir texto o fotografía. */
  body.kd-strains-page .kd-strain-detail-app .kd-strain-breeder-banner,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-breeder-banner,
  .kd-strain-detail-app .kd-strain-breeder-banner,
  .kd-strain-detail-app .kd-strain-breeder-banner.has-origin {
    position:relative !important;
    inset:auto !important;
    grid-column:1 / -1 !important;
    grid-row:2 !important;
    width:100% !important;
    min-height:66px !important;
    height:auto !important;
    z-index:8 !important;
  }

  .kd-strain-detail-app .kd-strain-premium-hero > .kd-strain-photo-zoom {
    right:14px !important;
    bottom:82px !important;
    width:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    padding:0 !important;
    justify-content:center !important;
    border-radius:999px !important;
  }
  .kd-strain-detail-app .kd-strain-premium-hero > .kd-strain-photo-zoom span {display:none !important;}
}

@media (max-width:699px) {
  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-hero,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-hero,
  .kd-strain-detail-app .kd-strain-premium-hero {
    display:flex !important;
    flex-direction:column !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
  }

  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-media,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-media,
  .kd-strain-detail-app .kd-strain-premium-media {
    position:relative !important;
    inset:auto !important;
    order:-3 !important;
    width:100% !important;
    height:260px !important;
    min-height:260px !important;
    max-height:260px !important;
    flex:0 0 260px !important;
    overflow:hidden !important;
    z-index:2 !important;
  }

  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-media > img.kd-strain-premium-photo,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-media > img.kd-strain-premium-photo,
  .kd-strain-detail-app .kd-strain-premium-media > img.kd-strain-premium-photo {
    position:absolute !important;
    inset:8px 9px !important;
    width:calc(100% - 18px) !important;
    height:calc(100% - 16px) !important;
    max-width:calc(100% - 18px) !important;
    max-height:calc(100% - 16px) !important;
    object-fit:contain !important;
    object-position:center center !important;
    z-index:3 !important;
  }

  body.kd-strains-page .kd-strain-detail-app .kd-strain-premium-copy,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-premium-copy,
  .kd-strain-detail-app .kd-strain-premium-copy {
    position:relative !important;
    order:-2 !important;
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    padding:28px 20px 26px !important;
    z-index:5 !important;
    box-sizing:border-box !important;
  }

  body.kd-strains-page .kd-strain-detail-app .kd-strain-breeder-banner,
  body.kd-standalone-strains-template .kd-strain-detail-app .kd-strain-breeder-banner,
  .kd-strain-detail-app .kd-strain-breeder-banner,
  .kd-strain-detail-app .kd-strain-breeder-banner.has-origin {
    position:relative !important;
    inset:auto !important;
    order:-1 !important;
    width:100% !important;
    z-index:8 !important;
  }

  .kd-strain-detail-app .kd-strain-premium-hero > .kd-strain-photo-zoom {
    top:210px !important;
    right:14px !important;
    bottom:auto !important;
    left:auto !important;
    width:42px !important;
    min-width:42px !important;
    min-height:42px !important;
    padding:0 !important;
    justify-content:center !important;
    border-radius:999px !important;
  }
  .kd-strain-detail-app .kd-strain-premium-hero > .kd-strain-photo-zoom span {display:none !important;}
}

/* Escritorio: al mover el enlace fuera de media mantenemos su posición visual. */
@media (min-width:1101px) {
  .kd-strain-detail-app .kd-strain-premium-hero > .kd-strain-photo-zoom {
    right:20px !important;
    bottom:90px !important;
  }
}
