/*
 * OP Nova 1.0 RC19
 * FINAL structured recipe layout layer.
 *
 * Namen: preglasi stare eksperimentalne structured-layout selektorje
 * brez poseganja v renderer/importer.
 */

/* ---------------------------------------------------------
   Global structured shell
   --------------------------------------------------------- */
body.op-nova-2026 .op-v2-structured-shell{
  width:100%;
  max-width:none;
  margin:0;
  overflow:visible;
}

body.op-nova-2026 .op-v2-structured-shell > .op-modern-wrap,
body.op-nova-2026 .op-v2-structured-shell .op-modern-wrap{
  width:min(1420px, calc(100% - 48px))!important;
  max-width:1420px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  padding-left:0!important;
  padding-right:0!important;
  box-sizing:border-box!important;
  overflow:visible!important;
}

body.op-nova-2026 .op-v2-structured-shell .op-modern-recipe-article{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:visible!important;
}

/* Header/intro sections must follow the same visual canvas. */
body.op-nova-2026 .op-v2-structured-shell .op-modern-heading,
body.op-nova-2026 .op-v2-structured-shell .op-modern-breadcrumb{
  width:min(970px, 100%)!important;
  max-width:970px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

body.op-nova-2026 .op-v2-structured-shell .op-modern-hero,
body.op-nova-2026 .op-v2-structured-shell .op-modern-summary,
body.op-nova-2026 .op-v2-structured-shell .op-modern-intro,
body.op-nova-2026 .op-v2-structured-shell .op-editorial-section,
body.op-nova-2026 .op-v2-structured-shell .op-author-bio{
  width:min(1180px, 100%)!important;
  max-width:1180px!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

body.op-nova-2026 .op-v2-structured-shell img{
  max-width:100%;
  height:auto;
}

/* Never let an inner renderer wrapper shrink the recipe. */
body.op-nova-2026 .op-v2-structured-shell .op-structured-recipe,
body.op-nova-2026 .op-v2-structured-shell .op-modern-content,
body.op-nova-2026 .op-v2-structured-shell .op-recipe-layout,
body.op-nova-2026 .op-v2-structured-shell .op-recipe-main{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}

/* ---------------------------------------------------------
   LARGE DESKTOP >= 1280
   Ingredients 290 | Method flexible | Sidebar 320
   --------------------------------------------------------- */
@media (min-width:1280px){
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-main-grid{
    display:grid!important;
    grid-template-columns:290px minmax(0, 1fr) 320px!important;
    column-gap:30px!important;
    row-gap:24px!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    align-items:start!important;
    overflow:visible!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-left-column{
    grid-column:1!important;
    width:290px!important;
    max-width:290px!important;
    min-width:0!important;
    position:static!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
    align-self:start!important;
    padding-right:0!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel{
    grid-column:2!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    position:static!important;
    overflow:visible!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-right-column{
    grid-column:3!important;
    display:flex!important;
    flex-direction:column!important;
    width:320px!important;
    min-width:320px!important;
    max-width:320px!important;
    gap:18px!important;
    position:static!important;
    align-self:start!important;
    overflow:visible!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-right-ad-600,
  body.op-nova-2026 .op-v2-structured-shell .op-sidebar-ad-top{
    position:static!important;
    top:auto!important;
  }
}

/* ---------------------------------------------------------
   TABLET / SMALL DESKTOP 900–1279
   Ingredients 300 | Method flexible
   Sidebar intentionally hidden.
   --------------------------------------------------------- */
@media (min-width:900px) and (max-width:1279px){
  body.op-nova-2026 .op-v2-structured-shell > .op-modern-wrap,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-wrap{
    width:min(1080px, calc(100% - 40px))!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-main-grid{
    display:grid!important;
    grid-template-columns:300px minmax(0, 1fr)!important;
    gap:24px!important;
    width:100%!important;
    max-width:none!important;
    align-items:start!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-left-column{
    grid-column:1!important;
    width:300px!important;
    max-width:300px!important;
    min-width:0!important;
    position:static!important;
    max-height:none!important;
    overflow:visible!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel{
    grid-column:2!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-right-column{
    display:none!important;
  }
}

/* ---------------------------------------------------------
   MOBILE / NARROW TABLET <= 899
   Everything in one natural column.
   --------------------------------------------------------- */
@media (max-width:899px){
  body.op-nova-2026 .op-v2-structured-shell > .op-modern-wrap,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-wrap{
    width:calc(100% - 28px)!important;
    max-width:none!important;
    padding:0!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-main-grid,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-main-grid,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-recipe-grid,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-content-grid,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-columns{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:16px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-left-column,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-left,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-center,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-main,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-left,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-right,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-column,
  body.op-nova-2026 .op-v2-structured-shell .op-ingredients-column,
  body.op-nova-2026 .op-v2-structured-shell .op-method-column,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-details,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-method{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    position:static!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-right-column{
    display:none!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-card,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-ingredients-panel,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-extra-card,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-card,
  body.op-nova-2026 .op-v2-structured-shell .op-tools-card{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    box-sizing:border-box!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel img,
  body.op-nova-2026 .op-v2-structured-shell .op-process-image,
  body.op-nova-2026 .op-v2-structured-shell .op-method-image,
  body.op-nova-2026 .op-v2-structured-shell .op-step-image,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-step img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    margin-left:0!important;
    margin-right:0!important;
    object-fit:cover!important;
  }

  body.op-nova-2026 .op-v2-structured-shell p,
  body.op-nova-2026 .op-v2-structured-shell li{
    word-break:normal!important;
    overflow-wrap:break-word!important;
    white-space:normal!important;
  }
}

/* ---------------------------------------------------------
   Cards / image continuity
   --------------------------------------------------------- */
body.op-nova-2026 .op-v2-structured-shell .op-recipe-card,
body.op-nova-2026 .op-v2-structured-shell .op-recipe-ingredients-panel,
body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel,
body.op-nova-2026 .op-v2-structured-shell .op-recipe-extra-card{
  box-sizing:border-box!important;
}

body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel img{
  display:block;
  max-width:100%;
  height:auto;
}

/* Process-image containers must never reserve a tiny fixed column. */
body.op-nova-2026 .op-v2-structured-shell .op-process-image,
body.op-nova-2026 .op-v2-structured-shell .op-method-image,
body.op-nova-2026 .op-v2-structured-shell .op-step-image{
  width:100%!important;
  max-width:100%!important;
}

/* ---------------------------------------------------------
   Share / author / comments align with content canvas
   --------------------------------------------------------- */
body.op-nova-2026 .op-v2-structured-shell .op-share--full,
body.op-nova-2026 .op-v2-structured-shell .op-author-bio,
body.op-nova-2026 .op-v2-structured-shell .op-modern-comments{
  width:min(970px,100%)!important;
  max-width:970px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* ---------------------------------------------------------
   Ad slots: don't define renderer size here, only canvas.
   --------------------------------------------------------- */
body.op-nova-2026 .op-v2-structured-shell .op-theme-slot--recipe-top,
body.op-nova-2026 .op-v2-structured-shell .op-theme-slot--recipe-bottom{
  width:min(1200px,100%)!important;
  max-width:1200px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

body.op-nova-2026 .op-v2-structured-shell .op-theme-slot--recipe-mid{
  width:100%!important;
  max-width:100%!important;
}

/* Preview sidebar placeholders remain exact. */
body.op-ad-placeholders.op-nova-2026 .op-v2-structured-shell .op-nova-ad-slot--sidebar_top{
  width:300px!important;
  min-width:300px!important;
  max-width:300px!important;
  height:250px!important;
  min-height:250px!important;
  max-height:250px!important;
}

body.op-ad-placeholders.op-nova-2026 .op-v2-structured-shell .op-nova-ad-slot--sidebar_sticky{
  width:300px!important;
  min-width:300px!important;
  max-width:300px!important;
  height:600px!important;
  min-height:600px!important;
  max-height:600px!important;
  position:static!important;
}

/* ---------------------------------------------------------
   Very small phones
   --------------------------------------------------------- */
@media (max-width:430px){
  body.op-nova-2026 .op-v2-structured-shell > .op-modern-wrap,
  body.op-nova-2026 .op-v2-structured-shell .op-modern-wrap{
    width:calc(100% - 20px)!important;
  }

  body.op-nova-2026 .op-v2-structured-shell .op-recipe-card,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-ingredients-panel,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-method-panel,
  body.op-nova-2026 .op-v2-structured-shell .op-recipe-extra-card{
    border-radius:14px!important;
  }
}