/* Lamari Diarios · v1.40.656 · pulido final móvil/tablet
 * Alcance: 320–1100 px. No cambia el diseño de escritorio.
 */

/* Cualquier texto o control largo debe poder encogerse sin ensanchar el viewport. */
@media(max-width:1100px){
  body :where(.kd-custom-header,.kd-strains-template-main,.kd-shorts-template-main,.kd-explore-template-main,.kd-bancoteca-template-main,.kd-directory-template-main)
  :where(a,button,span,strong,p,h1,h2,h3,label){min-width:0}
  body :where(.kd-strain-detail-tabs,.kd-company-gd-tabs,.kd-diaries-pills){max-width:100%}
}

/* 1) Cabecera: modo compacto desde tablet, no solo desde teléfono. */
@media(max-width:860px){
  .kd-custom-header .kd-topbar-inner{
    grid-template-columns:minmax(124px,1fr) max-content!important;
    column-gap:6px!important;
    padding:0 10px 0 63px!important;
  }
  .kd-custom-header .kd-lamari-topbar-brand{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    padding-left:6px!important;
    overflow:hidden!important;
  }
  .kd-custom-header .kd-lamari-logo-surface{
    flex:0 1 124px!important;
    width:124px!important;
    min-width:0!important;
    max-width:124px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
  }
  .kd-custom-header .kd-topbar-search{display:none!important}
  .kd-custom-header .kd-topbar-actions{
    grid-column:2!important;
    width:auto!important;
    min-width:0!important;
    gap:3px!important;
  }
  .kd-custom-header .kd-topbar-create-long{display:none!important}
  .kd-custom-header .kd-topbar-create-short{display:inline!important}
  .kd-custom-header .kd-topbar-create{
    min-height:39px!important;
    padding-inline:11px!important;
    font-size:12px!important;
  }
  .kd-custom-header .kd-language-switcher{
    height:36px!important;
    gap:1px!important;
    padding:2px!important;
    margin-inline:2px 4px!important;
  }
  .kd-custom-header .kd-language-option{
    width:31px!important;
    min-width:31px!important;
    height:30px!important;
    padding:0!important;
  }
  .kd-custom-header .kd-language-code{display:none!important}
  .kd-custom-header .kd-topbar-icon-button{width:36px!important;height:36px!important;flex-basis:36px!important}
  .kd-custom-header .kd-topbar-avatar{width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;max-width:38px!important;max-height:38px!important}
}
@media(max-width:520px){
  .kd-custom-header .kd-topbar-actions{gap:1px!important}
  .kd-custom-header .kd-topbar-create{padding-inline:8px!important}
}
@media(max-width:480px){
  .kd-custom-header .kd-topbar-inner{grid-template-columns:minmax(108px,1fr) max-content!important;padding-left:58px!important;padding-right:7px!important}
  .kd-custom-header .kd-lamari-logo-surface{width:108px!important;max-width:108px!important;height:38px!important;min-height:38px!important;max-height:38px!important}
  /* En móvil muy estrecho se muestra únicamente el idioma alternativo. Así el
   * selector sigue siendo funcional sin ocupar el ancho de dos banderas. */
  .kd-custom-header .kd-language-option.is-active{display:none!important}
  .kd-custom-header .kd-language-switcher{width:auto!important;min-width:35px!important;margin-right:2px!important}
}
@media(max-width:400px){
  .kd-custom-header .kd-topbar-inner{grid-template-columns:minmax(88px,1fr) max-content!important;column-gap:2px!important}
  .kd-custom-header .kd-lamari-logo-surface{width:94px!important;max-width:94px!important}
}
@media(max-width:380px){
  .kd-custom-header .kd-topbar-inner{grid-template-columns:minmax(88px,1fr) max-content!important;column-gap:2px!important;padding-left:56px!important;padding-right:5px!important}
  .kd-custom-header .kd-lamari-logo-surface{width:98px!important;max-width:98px!important;height:35px!important;min-height:35px!important;max-height:35px!important}
  .kd-custom-header .kd-topbar-create{padding-inline:6px!important;font-size:11px!important}
  .kd-custom-header .kd-topbar-icon-button{width:34px!important;height:34px!important;flex-basis:34px!important}
  .kd-custom-header .kd-topbar-avatar{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;max-width:36px!important;max-height:36px!important}
  .kd-custom-header .kd-topbar-chevron{display:none!important}
}

@media(max-width:340px){
  .kd-custom-header .kd-topbar-create-short{display:none!important}
  .kd-custom-header .kd-topbar-create{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    padding:0!important;
    justify-content:center!important;
  }
  .kd-custom-header .kd-topbar-actions{gap:0!important}
  .kd-custom-header .kd-language-switcher{margin-inline:0!important}
}

/* 2) Hero de Cepas: el contenido manda la altura en tablet. El banner del breeder
 * pasa a flujo normal para que un título/linaje largo nunca quede recortado. */
@media(min-width:700px) and (max-width:1100px){
  body.kd-strains-page .kd-strain-premium-hero,
  body.kd-standalone-strains-template .kd-strain-premium-hero,
  .kd-strain-detail-app .kd-strain-premium-hero{
    height:auto!important;
    min-height:474px!important;
    max-height:none!important;
    align-items:stretch!important;
    padding-bottom:0!important;
  }
  .kd-strain-premium-copy{
    height:auto!important;
    min-height:400px!important;
    padding-bottom:28px!important;
  }
  .kd-strain-premium-media{min-height:400px!important}
  .kd-strain-premium-media>img.kd-strain-premium-photo{
    bottom:16px!important;
    height:calc(100% - 32px)!important;
    max-height:430px!important;
  }
  .kd-strain-photo-zoom{bottom:18px!important}
  .kd-strain-breeder-banner,
  .kd-strain-breeder-banner.has-origin{
    position:relative!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    grid-column:1/-1!important;
    width:100%!important;
    min-height:74px!important;
    box-sizing:border-box!important;
  }
}
@media(min-width:700px) and (max-width:850px){
  .kd-strain-premium-copy{min-height:0!important}
  .kd-strain-premium-media{min-height:300px!important}
  .kd-strain-premium-media>img.kd-strain-premium-photo{position:relative!important;inset:auto!important;width:100%!important;height:300px!important;max-height:300px!important;object-fit:contain!important}
  .kd-strain-photo-zoom{bottom:16px!important}
  .kd-strain-breeder-banner,
  .kd-strain-breeder-banner.has-origin{grid-template-columns:minmax(0,1fr) auto!important;gap:10px 14px!important;padding:15px 18px!important}
  .kd-strain-breeder-lineage{grid-column:1/-1!important;grid-row:2!important;padding:10px 0 0!important;border-top:1px solid rgba(255,255,255,.09)!important;border-left:0!important}
  .kd-strain-breeder-lineage strong{white-space:normal!important}
  .kd-strain-breeder-origin{display:none!important}
}

/* 3) Shorts: en móvil los chips vuelven a ser un carril táctil horizontal. No
 * crean 4–6 filas antes del contenido y todos siguen accesibles con swipe. */
@media(max-width:860px){
  html body.kd-shorts-page nav.kd-short-filters,
  html body.kd-standalone-shorts-template nav.kd-short-filters,
  .kd-short-directory-panel nav.kd-short-filters{
    display:flex!important;
    flex-wrap:nowrap!important;
    justify-content:flex-start!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
    overscroll-behavior-inline:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:x proximity!important;
    scrollbar-width:none!important;
    padding:10px!important;
  }
  .kd-short-directory-panel nav.kd-short-filters::-webkit-scrollbar{display:none!important}
  .kd-short-directory-panel .kd-short-chip,
  .kd-short-directory-panel .kd-short-week-menu{
    flex:0 0 auto!important;
    scroll-snap-align:start!important;
  }
  .kd-short-directory-panel .kd-short-chip,
  .kd-short-directory-panel .kd-short-week-menu>summary{
    min-height:40px!important;
    padding-inline:13px!important;
    font-size:12px!important;
    white-space:nowrap!important;
  }
  .kd-short-week-menu-list{position:fixed!important;left:12px!important;right:12px!important;width:auto!important;max-width:calc(100vw - 24px)!important}
}

/* 4) Catálogos de Inicio y Diarios: una sola tarjeta cuando realmente no caben
 * dos columnas (320–379 px). En 390 px y superiores se conservan dos. */
@media(max-width:379px){
  body.kd-explore-home-page .kd-explore-grid,
  body.kultivator-diaries-directory .kd-diaries-grid,
  body.kd-standalone-directory-template .kd-diaries-grid{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  body.kd-explore-home-page .kd-explore-card h3,
  body.kultivator-diaries-directory .kd-diaries-card h3,
  body.kd-standalone-directory-template .kd-diaries-card h3{
    font-size:14px!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }
}

/* 5) Navegación horizontal: nada debe quedar cortado en fichas largas. */
@media(max-width:900px){
  .kd-strain-detail-tabs,
  .kd-company-gd-tabs,
  .kd-diaries-pills{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    flex-wrap:nowrap!important;
    overscroll-behavior-inline:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  .kd-strain-detail-tabs::-webkit-scrollbar,
  .kd-company-gd-tabs::-webkit-scrollbar,
  .kd-diaries-pills::-webkit-scrollbar{display:none!important}
  .kd-strain-detail-tabs>a,
  .kd-company-gd-tabs>a,
  .kd-diaries-pills>a{flex:0 0 auto!important;white-space:nowrap!important}
}