/*
  Theme Name:   Jannah Child
  Theme URI:    http://jannah.tielabs.com/
  Description:  Jannah Child Theme
  Author:       TieLabs
  Author URI:   https://tielabs.com
  Template:     jannah
  Version:      1.0.6
  Text Domain:  jannah-child
*/

/* =========================
   Nastavenia
   ========================= */
:root{
  --three-left: 20%;
  --three-right: 20%;
  --three-gap: 20px;
  --edge-pull: 0px;
  --three-top-gap: 30px;
}

/* hlavný content nech zaberá šírku kontajnera */
.page-template-page-three-columns .threecol-page-wrap > .container > .main-content,
.page-template-page-three-columns-php .threecol-page-wrap > .container > .main-content{
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  box-sizing: border-box;
}

@media (min-width: 992px){
  .threecol-page-wrap,
  .threecol-page-wrap > .container,
  .threecol-page-wrap .main-content,
  .threecol-page-wrap .threecol-row,
  .threecol-page-wrap .sidebar{
    overflow: visible;
  }
}

/* ===== Desktop layout ===== */
.page-template-page-three-columns .threecol-row,
.page-template-page-three-columns-php .threecol-row{
  display: grid !important;
  grid-template-columns:
    minmax(240px, var(--three-left))
    minmax(0, calc(100% - var(--three-left) - var(--three-right) - (2 * var(--three-gap)) + (2 * var(--edge-pull))))
    minmax(240px, var(--three-right));
  grid-template-areas: "primary content secondary";
  column-gap: var(--three-gap);
  align-items: start !important;
  margin-left: calc(-1 * var(--edge-pull)) !important;
  margin-right: calc(-1 * var(--edge-pull)) !important;
}

.page-template-page-three-columns .threecol-row.no-primary,
.page-template-page-three-columns-php .threecol-row.no-primary{
  grid-template-columns:
    minmax(0, 1fr)
    minmax(240px, var(--three-right));
  grid-template-areas: "content secondary";
}

.page-template-page-three-columns .threecol-row > .sidebar,
.page-template-page-three-columns-php .threecol-row > .sidebar,
.page-template-page-three-columns .threecol-row > .content,
.page-template-page-three-columns-php .threecol-row > .content{
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box;
}

.page-template-page-three-columns .threecol-row > .sidebar.threecol-primary,
.page-template-page-three-columns-php .threecol-row > .sidebar.threecol-primary{
  grid-area: primary;
}

.page-template-page-three-columns .threecol-row > .content,
.page-template-page-three-columns-php .threecol-row > .content{
  grid-area: content;
  min-width: 0 !important;
}

.page-template-page-three-columns .threecol-row > .sidebar.threecol-secondary,
.page-template-page-three-columns-php .threecol-row > .sidebar.threecol-secondary,
.page-template-page-three-columns .threecol-row > .sidebar.threecol-right,
.page-template-page-three-columns-php .threecol-row > .sidebar.threecol-right,
.page-template-page-three-columns .threecol-row > .sidebar.threecol-left,
.page-template-page-three-columns-php .threecol-row > .sidebar.threecol-left{
  grid-area: secondary;
}

/* oba sidebary majú rovnaký horný odskok ako builder/content */
@media (min-width: 992px){
  .page-template-page-three-columns .threecol-row > .sidebar,
  .page-template-page-three-columns-php .threecol-row > .sidebar{
    margin-top: var(--three-top-gap) !important;
    padding-top: 0 !important;
    height: max-content !important;
    --tree-gap:0px !important;
  }
}

/* vnútorné obaly sidebarov bez rozdielnych paddingov */
.page-template-page-three-columns .threecol-row > .sidebar .sidebar-inner,
.page-template-page-three-columns-php .threecol-row > .sidebar .sidebar-inner{
  padding-top: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  box-sizing: border-box;
}

/* prvý widget nech nezačína vlastným horným marginom */
.page-template-page-three-columns .threecol-row > .sidebar .widget:first-child,
.page-template-page-three-columns-php .threecol-row > .sidebar .widget:first-child,
.page-template-page-three-columns .threecol-row > .content > .container-wrapper > *:first-child,
.page-template-page-three-columns-php .threecol-row > .content > .container-wrapper > *:first-child{
  margin-top: 0 !important;
}

/* jednotné medzery medzi widgetmi v oboch sidebaroch */
.page-template-page-three-columns .threecol-row > .sidebar .widget,
.page-template-page-three-columns-php .threecol-row > .sidebar .widget{
  margin-bottom: 30px;
}

.page-template-page-three-columns .threecol-row > .sidebar .widget:last-child,
.page-template-page-three-columns-php .threecol-row > .sidebar .widget:last-child{
  margin-bottom: 0;
}

/* nech sa nič opticky nezužuje vpravo */
.page-template-page-three-columns .threecol-row > .sidebar .container-wrapper,
.page-template-page-three-columns-php .threecol-row > .sidebar .container-wrapper{
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* obrázky/tabuľky nech nepretŕčajú zo stĺpcov */
.page-template-page-three-columns .threecol-row img,
.page-template-page-three-columns-php .threecol-row img,
.page-template-page-three-columns .threecol-row iframe,
.page-template-page-three-columns-php .threecol-row iframe,
.page-template-page-three-columns .threecol-row video,
.page-template-page-three-columns-php .threecol-row video,
.page-template-page-three-columns .threecol-row table,
.page-template-page-three-columns-php .threecol-row table{
  max-width: 100%;
}

/* ===== Mobile / Tablet ===== */
@media (max-width: 991.98px){
  .page-template-page-three-columns .threecol-row,
  .page-template-page-three-columns-php .threecol-row{
    margin-left: 0 !important;
    margin-right: 0 !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "content"
      "primary"
      "secondary" !important;
    row-gap: 0 !important;
    column-gap: 0 !important;
  }

  .page-template-page-three-columns .threecol-row.no-primary,
  .page-template-page-three-columns-php .threecol-row.no-primary{
    grid-template-areas:
      "content"
      "secondary" !important;
  }

  .page-template-page-three-columns .threecol-row > .content,
  .page-template-page-three-columns-php .threecol-row > .content,
  .page-template-page-three-columns .threecol-row > .sidebar,
  .page-template-page-three-columns-php .threecol-row > .sidebar{
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  .page-template-page-three-columns .threecol-row > .content,
  .page-template-page-three-columns-php .threecol-row > .content{
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* kľúčová oprava: odstrániť spodnú medzeru reálnych content wrapperov */
  .page-template-page-three-columns .threecol-row > .content > .container-wrapper,
  .page-template-page-three-columns-php .threecol-row > .content > .container-wrapper,
  .page-template-page-three-columns .threecol-row > .content > .section-wrapper.container,
  .page-template-page-three-columns-php .threecol-row > .content > .section-wrapper.container,
  .page-template-page-three-columns .threecol-row > .content > .container,
  .page-template-page-three-columns-php .threecol-row > .content > .container,
  .page-template-page-three-columns .threecol-row > .content > article,
  .page-template-page-three-columns-php .threecol-row > .content > article,
  .page-template-page-three-columns .threecol-row > .content > .entry,
  .page-template-page-three-columns-php .threecol-row > .content > .entry{
    margin-bottom: 0 !important;
  }

  .page-template-page-three-columns .threecol-row > .content > .container-wrapper:last-child,
  .page-template-page-three-columns-php .threecol-row > .content > .container-wrapper:last-child,
  .page-template-page-three-columns .threecol-row > .content > .section-wrapper.container:last-child,
  .page-template-page-three-columns-php .threecol-row > .content > .section-wrapper.container:last-child,
  .page-template-page-three-columns .threecol-row > .content > .container:last-child,
  .page-template-page-three-columns-php .threecol-row > .content > .container:last-child,
  .page-template-page-three-columns .threecol-row > .content > article:last-child,
  .page-template-page-three-columns-php .threecol-row > .content > article:last-child,
  .page-template-page-three-columns .threecol-row > .content > .entry:last-child,
  .page-template-page-three-columns-php .threecol-row > .content > .entry:last-child{
    margin-bottom: 0 !important;
  }

  .page-template-page-three-columns .threecol-row > .sidebar,
  .page-template-page-three-columns-php .threecol-row > .sidebar{
    margin-top: 0 !important;
    margin-bottom: 15px !important;
  }

  .page-template-page-three-columns .threecol-row > .sidebar .sidebar-inner,
  .page-template-page-three-columns-php .threecol-row > .sidebar .sidebar-inner{
    position: static !important;
    top: auto !important;
    transform: none !important;
  }
}

/* =========================================
   Three columns: sticky riadi JS/Theia
   ========================================= */

@media (min-width: 992px){
  .page-template-page-three-columns .threecol-row > .sidebar[data-threecol-sticky="1"],
  .page-template-page-three-columns-php .threecol-row > .sidebar[data-threecol-sticky="1"],
  .page-template-page-three-columns .threecol-row > .sidebar[data-threecol-sticky="0"],
  .page-template-page-three-columns-php .threecol-row > .sidebar[data-threecol-sticky="0"]{
    position: static !important;
    top: auto !important;
  }

  .page-template-page-three-columns .threecol-row > .sidebar > .sidebar-inner,
  .page-template-page-three-columns-php .threecol-row > .sidebar > .sidebar-inner,
  .page-template-page-three-columns .threecol-row > .sidebar > .theiaStickySidebar,
  .page-template-page-three-columns-php .threecol-row > .sidebar > .theiaStickySidebar{
    width: 100% !important;
    max-width: 100% !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

@media (max-width: 991.98px){
  .page-template-page-three-columns .threecol-row > .sidebar,
  .page-template-page-three-columns-php .threecol-row > .sidebar,
  .page-template-page-three-columns .threecol-row > .sidebar > .sidebar-inner,
  .page-template-page-three-columns-php .threecol-row > .sidebar > .sidebar-inner,
  .page-template-page-three-columns .threecol-row > .sidebar > .theiaStickySidebar,
  .page-template-page-three-columns-php .threecol-row > .sidebar > .theiaStickySidebar{
    position: static !important;
    top: auto !important;
  }
}

/* =========================================
   Three columns: content bočné odsadenie pri zúžení
   ========================================= */

@media (min-width: 768px) and (max-width: 991.98px){
  .page-template-page-three-columns .threecol-row > .content > .container-wrapper,
  .page-template-page-three-columns-php .threecol-row > .content > .container-wrapper,
  .page-template-page-three-columns .threecol-row > .content .section-wrapper.container,
  .page-template-page-three-columns-php .threecol-row > .content .section-wrapper.container,
  .page-template-page-three-columns .threecol-row > .content .container,
  .page-template-page-three-columns-php .threecol-row > .content .container{
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

@media (max-width: 767.98px){
  .page-template-page-three-columns .threecol-row > .content,
  .page-template-page-three-columns-php .threecol-row > .content,
  .page-template-page-three-columns .threecol-row > .content > .container-wrapper,
  .page-template-page-three-columns-php .threecol-row > .content > .container-wrapper,
  .page-template-page-three-columns .threecol-row > .content .section-wrapper.container,
  .page-template-page-three-columns-php .threecol-row > .content .section-wrapper.container,
  .page-template-page-three-columns .threecol-row > .content .container,
  .page-template-page-three-columns-php .threecol-row > .content .container{
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* =========================================
   Three columns: full width wrapper na mobile/tablete
   ========================================= */

@media (max-width: 991.98px){
  .page-template-page-three-columns .threecol-page-wrap > .container,
  .page-template-page-three-columns-php .threecol-page-wrap > .container{
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  .page-template-page-three-columns .threecol-page-wrap > .container > .main-content,
  .page-template-page-three-columns-php .threecol-page-wrap > .container > .main-content{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .page-template-page-three-columns .threecol-row,
  .page-template-page-three-columns-php .threecol-row{
    width: 100% !important;
  }
}

/* =========================================
   Three columns: full width wrapper na mobile/tablete
   ========================================= */

@media (max-width: 767px){
  .page-template-page-three-columns .threecol-page-wrap > .container,
  .page-template-page-three-columns-php .threecol-page-wrap > .container{
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .page-template-page-three-columns .threecol-page-wrap > .container > .main-content,
  .page-template-page-three-columns-php .threecol-page-wrap > .container > .main-content{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .page-template-page-three-columns .threecol-row,
  .page-template-page-three-columns-php .threecol-row{
    width: 100% !important;
  }
}

@media (min-width: 992px) {
  .magazine1 .sidebar-left .main-content {
    width: 100%;
    padding-left: 15px !important;
  }
}