/*
Theme Name: TieuLamTV Child
Theme URI: https://tieulamtv.work/
Description: TieuLamTV child theme for Flatsome.
Author: Yaki
Author URI: https://tieulamtv.work/
Template: flatsome
Version: 2.0.29
Text Domain: tieulamtv-child
Requires at least: 6.2
Requires PHP: 7.4
*/

/* Visual source: assets/css/tieulamtv.css. Setup mirrors it into Customize > Additional CSS. */

/*
 * Critical above-the-fold slider sizing.
 * Loaded with the child theme stylesheet before Flickity initializes so the
 * home blog does not flash as oversized 100%-width cards and then shrink.
 * Keep only geometry here; visual styling remains editable in Additional CSS.
 */
.tieulamtv-front-page .v-ux-post-slider .post-item{
  width:25%!important;
  max-width:25%!important;
  flex:0 0 25%!important;
  min-width:0!important;
}
.tieulamtv-front-page .v-ux-post-slider .flickity-slider>.post-item{
  width:25%!important;
  max-width:25%!important;
  flex-basis:25%!important;
}
@media (max-width:1099px){
  .tieulamtv-front-page .v-ux-post-slider .post-item,
  .tieulamtv-front-page .v-ux-post-slider .flickity-slider>.post-item{
    width:50%!important;
    max-width:50%!important;
    flex-basis:50%!important;
  }
}
@media (max-width:549px){
  .tieulamtv-front-page .v-ux-post-slider .post-item,
  .tieulamtv-front-page .v-ux-post-slider .flickity-slider>.post-item{
    width:100%!important;
    max-width:100%!important;
    flex-basis:100%!important;
  }
}


/* ================================================================
   TIEULAMTV 2.0.19 — HOME CONTENT HEIGHT
   Initial-paint geometry only; matching editable rules are also added
   to Customize > Additional CSS once during the 2.0.19 upgrade.
   ================================================================ */
body.tieulamtv-theme.tieulamtv-front-page .tl-home-stage .tl-home-layout-source .v-home-content-section .home-content.scroll{
  max-height:380px!important;
}
@media (max-width:1099px){
  body.tieulamtv-theme.tieulamtv-front-page .tl-home-stage .tl-home-layout-source .v-home-content-section .home-content.scroll{max-height:330px!important}
}
@media (max-width:549px){
  body.tieulamtv-theme.tieulamtv-front-page .tl-home-stage .tl-home-layout-source .v-home-content-section .home-content.scroll{max-height:280px!important}
}


/* ================================================================
   TIEULAMTV 2.0.27 — TRUE UX BUILDER FLOW
   The homepage source is already ordered correctly. Never use flex/grid/order
   on the page-level wrapper; render top-level sections in DOM order.
   ================================================================ */
html body.tieulamtv-theme.tieulamtv-front-page #content.tl-home-stage > .tl-home-layout-source{
  display:block!important;
  grid-template-columns:none!important;
  grid-template-rows:none!important;
}
html body.tieulamtv-theme.tieulamtv-front-page #content.tl-home-stage > .tl-home-layout-source > .section{
  position:relative!important;
}


/* ================================================================
   TIEULAMTV 2.0.28 — QUICK ACCESS + BLOG FIRST-PAINT STABILITY
   High-specificity geometry beats the legacy 100%-width .col rule before
   Flickity lazy-initializes. Quick Access is styled as four real cards.
   ================================================================ */
html body.tieulamtv-theme.tieulamtv-front-page #main #content.tl-home-stage .tl-home-layout-source > .v-ux-blog-section .v-ux-post-slider .post-item{
  width:25%!important;
  max-width:25%!important;
  flex:0 0 25%!important;
  min-width:0!important;
}
html body.tieulamtv-theme.tieulamtv-front-page #main #content.tl-home-stage .tl-home-layout-source > .v-ux-blog-section .v-ux-post-slider{
  overflow:hidden!important;
}

.tieulamtv-front-page .tl-home-shortcuts-section{
  margin:0 auto 30px!important;
  padding:0!important;
  background:transparent!important;
}
.tieulamtv-front-page .tl-home-shortcuts-section>.section-content{
  width:min(calc(100% - 64px),1460px)!important;
  max-width:1460px!important;
  margin:0 auto!important;
  padding:0!important;
}
.tieulamtv-front-page .tl-home-shortcuts-row{
  width:auto!important;
  max-width:none!important;
  margin:0 -8px!important;
}
.tieulamtv-front-page .tl-home-shortcut-col{
  padding:0 8px!important;
}
.tieulamtv-front-page .tl-home-shortcut-col>.col-inner{
  min-height:108px!important;
  display:flex!important;
  align-items:center!important;
  padding:18px 20px!important;
  border:1px solid rgba(246,183,25,.20)!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,rgba(246,183,25,.075),rgba(15,12,7,.98) 48%,#090806)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.16)!important;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease!important;
}
.tieulamtv-front-page .tl-home-shortcut-col>.col-inner:hover{
  transform:translateY(-3px)!important;
  border-color:rgba(246,183,25,.52)!important;
  box-shadow:0 18px 34px rgba(0,0,0,.24)!important;
}
.tieulamtv-front-page .tl-home-shortcut-wrap{
  position:relative!important;
  width:100%!important;
  padding:0 26px 0 44px!important;
}
.tieulamtv-front-page .tl-home-shortcut-wrap p{
  margin:0!important;
}
.tieulamtv-front-page .tl-home-shortcut-wrap a{
  display:block!important;
  width:max-content!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  text-decoration:none!important;
}
.tieulamtv-front-page .tl-home-shortcut-wrap a:first-of-type{
  color:#ffd25d!important;
  font-family:"Barlow Condensed",sans-serif!important;
  font-size:21px!important;
  font-weight:800!important;
  line-height:1.05!important;
  letter-spacing:.015em!important;
}
.tieulamtv-front-page .tl-home-shortcut-wrap a:nth-of-type(2){
  margin-top:7px!important;
  color:#b9c3a5!important;
  font-size:12.5px!important;
  line-height:1.35!important;
}
.tieulamtv-front-page .tl-home-shortcut-wrap:before{
  position:absolute!important;
  left:0!important;
  top:50%!important;
  width:32px!important;
  height:32px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  transform:translateY(-50%)!important;
  border:1px solid rgba(246,183,25,.28)!important;
  border-radius:10px!important;
  background:rgba(246,183,25,.07)!important;
  color:#f6b719!important;
  font-size:15px!important;
  font-weight:800!important;
}
.tieulamtv-front-page .tl-home-shortcut-col:nth-child(1) .tl-home-shortcut-wrap:before{content:"▶"!important}
.tieulamtv-front-page .tl-home-shortcut-col:nth-child(2) .tl-home-shortcut-wrap:before{content:"▦"!important}
.tieulamtv-front-page .tl-home-shortcut-col:nth-child(3) .tl-home-shortcut-wrap:before{content:"✓"!important}
.tieulamtv-front-page .tl-home-shortcut-col:nth-child(4) .tl-home-shortcut-wrap:before{content:"↗"!important}
.tieulamtv-front-page .tl-home-shortcut-wrap:after{
  content:"→"!important;
  position:absolute!important;
  right:0!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  color:#f6b719!important;
  font-size:18px!important;
  opacity:.75!important;
}

@media (max-width:1099px){
  html body.tieulamtv-theme.tieulamtv-front-page #main #content.tl-home-stage .tl-home-layout-source > .v-ux-blog-section .v-ux-post-slider .post-item{
    width:50%!important;
    max-width:50%!important;
    flex-basis:50%!important;
  }
  .tieulamtv-front-page .tl-home-shortcuts-section>.section-content{width:min(calc(100% - 36px),980px)!important}
  .tieulamtv-front-page .tl-home-shortcut-col{padding:0 7px 14px!important}
}
@media (max-width:549px){
  html body.tieulamtv-theme.tieulamtv-front-page #main #content.tl-home-stage .tl-home-layout-source > .v-ux-blog-section .v-ux-post-slider .post-item{
    width:100%!important;
    max-width:100%!important;
    flex-basis:100%!important;
  }
  .tieulamtv-front-page .tl-home-shortcuts-section{margin-bottom:20px!important}
  .tieulamtv-front-page .tl-home-shortcuts-section>.section-content{width:calc(100% - 24px)!important}
  .tieulamtv-front-page .tl-home-shortcuts-row{margin:0 -5px!important}
  .tieulamtv-front-page .tl-home-shortcut-col{padding:0 5px 10px!important}
  .tieulamtv-front-page .tl-home-shortcut-col>.col-inner{min-height:92px!important;padding:14px 13px!important;border-radius:13px!important}
  .tieulamtv-front-page .tl-home-shortcut-wrap{padding-left:36px!important;padding-right:16px!important}
  .tieulamtv-front-page .tl-home-shortcut-wrap:before{width:28px!important;height:28px!important;border-radius:8px!important;font-size:13px!important}
  .tieulamtv-front-page .tl-home-shortcut-wrap a:first-of-type{font-size:18px!important}
  .tieulamtv-front-page .tl-home-shortcut-wrap a:nth-of-type(2){font-size:11px!important;margin-top:5px!important}
  .tieulamtv-front-page .tl-home-shortcut-wrap:after{font-size:15px!important}
}