/*
Theme Name: JOKER123 Black Gold Elementor Home 5.8
Theme URI: https://example.com/
Author: JOKER123
Description: Black and gold WordPress theme with Elementor shells, mobile CSS recovery, and instant opening without entry loaders.
Version: 5.8.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: joker123-blackgold-home-58
*/

/* The original visual CSS is kept unchanged in assets/style.css. */
.loader,.px-loader{display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.article-card>a{display:block;color:inherit;text-decoration:none}
.article-card>a>img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.joker-entry-content{font-size:17px;line-height:1.9;color:#f7f0df}
.joker-entry-content h1{font-size:clamp(32px,3vw,42px);line-height:1.3}
.joker-entry-content h2{font-size:clamp(24px,2.2vw,30px);line-height:1.4;margin-top:1.4em}
.joker-entry-content h3{font-size:clamp(19px,1.7vw,23px);line-height:1.5;margin-top:1.3em}
.joker-entry-content img{max-width:100%;height:auto}
@media(max-width:782px){.admin-bar .mobile-header{top:46px}.joker-entry-content{font-size:16px}}

/* WordPress black and gold palette */
:root{
  --bg:#050504;
  --surface:rgba(13,12,9,.94);
  --surface-strong:#11100c;
  --text:#f7f0df;
  --muted:#b8ad96;
  --blue:#d6a72d;
  --blue-2:#f2d06c;
  --cyan:#f7d75f;
  --navy:#090806;
  --line:rgba(224,179,57,.24);
  --shadow:0 24px 80px rgba(0,0,0,.55);
  --shadow-soft:0 14px 40px rgba(0,0,0,.42);
}
html,body{color:#f7f0df;background:#050504!important}
body{background-image:radial-gradient(circle at 18% 4%,rgba(214,167,45,.10),transparent 28%),radial-gradient(circle at 84% 18%,rgba(247,215,95,.07),transparent 24%),linear-gradient(180deg,#050504,#090806 54%,#050504)!important}
.sidebar,.topbar,.page-hero,.game-card,.article-card,.featured-article,.contact-card,.form-card,.rank-panel,.stat,.feature-box,.promo,.about-values article,.feature-grid article,.timeline article{border-color:rgba(224,179,57,.24)!important;background-color:#0c0b08!important}
.nav a,.mobile-menu-links a{color:#c8bfae!important}
.nav a:hover,.mobile-menu-links a:hover{color:#ffe38a!important;background:rgba(214,167,45,.10)!important}
.nav a.active,.nav .current-menu-item>a,.mobile-menu-links a.active,.chip.active,.btn,.auth-register{color:#160f02!important;background:linear-gradient(135deg,#a8730d,#e7b938 55%,#ffe58e)!important;box-shadow:0 12px 30px rgba(214,167,45,.25)!important}
.nav-icon,.icon-btn,.view-btn,.game-fav{border-color:rgba(224,179,57,.35)!important;color:#f1c84f!important;background:#090806!important}
.eyebrow,.article-tag,.tag{color:#f1c84f!important;background:rgba(214,167,45,.12)!important;border-color:rgba(224,179,57,.24)!important}
.gradient-text,.stats .num,.section-head h2,.page-hero h1,.joker-entry-content h1,.joker-entry-content h2,.joker-entry-content h3{color:#f4c94e!important;background:none!important;-webkit-text-fill-color:currentColor!important}
input,textarea,select{color:#f7f0df!important;background:#090806!important;border-color:rgba(224,179,57,.25)!important}
.footer,.premium-footer{border-color:rgba(224,179,57,.20)!important;background:#050504!important;color:#b8ad96!important}

/* Elementor page content inside the theme's existing shell */
.joker-elementor-home-content{min-width:0}
.joker-elementor-home{width:100%;max-width:100%;min-width:0;overflow:hidden}
.joker-elementor-home>.elementor,
.joker-elementor-home>.elementor>.elementor-element,
.joker-elementor-home .e-con{max-width:100%}
.joker-elementor-home .elementor-widget-image img{max-width:100%;height:auto}
.joker-elementor-home-empty{padding:clamp(32px,6vw,72px) 24px;text-align:center;border:1px solid rgba(224,179,57,.24);border-radius:20px;background:#0c0b08}
.joker-elementor-home-empty h1{margin:0 0 12px;color:#f4c94e;font-size:clamp(26px,3vw,38px)}
.joker-elementor-home-empty p{margin:0;color:#b8ad96}
@media(max-width:1024px){.joker-elementor-home{overflow:clip}}

/* Balanced article and game-review cards: 3 / 2 / 1 responsive columns */
.article-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(16px,2vw,24px);
  align-items:stretch;
}
.article-card{height:100%;border-radius:18px}
.article-card>a{display:flex;flex-direction:column;height:100%;min-width:0}
.article-card>a>img,
.article-card>img{
  display:block;
  width:100%;
  height:clamp(180px,16vw,250px);
  aspect-ratio:3/2;
  object-fit:cover;
  object-position:center;
  flex:none;
}
.article-card>a>div,
.article-card>div{display:flex;flex:1;flex-direction:column;padding:16px 18px 18px}
.article-card h3{
  display:-webkit-box;
  min-height:2.8em;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  line-height:1.4;
}
.article-card p{
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
}
.article-card .article-meta{margin-top:auto;padding-top:4px}
.featured-article img{width:100%;height:clamp(230px,27vw,360px);aspect-ratio:16/10;object-fit:cover;object-position:center}
@media(max-width:1050px){
  .article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article-card>a>img,.article-card>img{height:clamp(200px,28vw,280px)}
}
@media(max-width:620px){
  .article-grid{grid-template-columns:1fr;gap:16px}
  .article-card>a>img,.article-card>img{height:auto;aspect-ratio:3/2}
  .article-card h3{min-height:0}
  .featured-article{padding:16px;gap:18px}
  .featured-article img{height:auto;aspect-ratio:3/2}
}

/* Full website shell and readable content area for individual posts */
.joker-single-shell{min-width:0}
.joker-single-hero{display:block;margin-bottom:22px}
.joker-single-hero>div{max-width:980px}
.joker-single-card{
  display:block;
  width:100%;
  max-width:1120px;
  margin:0 auto;
  padding:clamp(18px,3vw,34px);
  overflow:hidden;
  background:#090909!important;
  color:#f7f0df;
}
.joker-single-featured{margin-bottom:clamp(20px,3vw,32px);overflow:hidden;border-radius:20px}
.joker-single-featured img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.joker-single-card .joker-entry-content{width:100%;max-width:980px;margin:0 auto}
.joker-single-card .joker-entry-content>.elementor{width:100%;max-width:100%}
.joker-single-card .joker-entry-content p{margin:0 0 1.15em}
.joker-single-card .joker-entry-content iframe{max-width:100%}
@media(max-width:760px){
  .joker-single-shell{padding-top:18px}
  .joker-single-hero{margin-bottom:16px}
  .joker-single-card{padding:18px 16px;border-radius:18px}
  .joker-single-featured{border-radius:14px;margin-bottom:20px}
}

/* Wide, shorter, uncropped thumbnails on article and review listings */
.article-card>a>img,
.article-card>img{
  width:100%;
  height:180px;
  aspect-ratio:auto;
  padding:0;
  object-fit:contain;
  object-position:center;
  background:#050504;
}
@media(max-width:1050px){
  .article-card>a>img,.article-card>img{height:210px}
}
@media(max-width:620px){
  .article-card>a>img,.article-card>img{height:clamp(150px,43vw,190px);aspect-ratio:auto;object-fit:contain}
}

/* Structural thumbnail frames prevent portrait images from stretching rows */
.article-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:start}
.article-card{height:auto;align-self:start;border-radius:16px}
.article-card>a{height:auto;display:block}
.article-thumb{
  display:grid;
  place-items:center;
  width:100%;
  height:150px;
  overflow:hidden;
  border-radius:15px 15px 0 0;
  background:#050504;
}
.article-card .article-thumb img{
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:contain;
  object-position:center;
}
.article-card>a>div:not(.article-thumb),
.article-card>div:not(.article-thumb){display:block;min-height:176px;padding:14px 15px 16px}
.article-card h3{min-height:2.8em;margin:8px 0;font-size:17px;line-height:1.4}
.article-card p{margin:8px 0 0;font-size:14px;line-height:1.55}
.article-card .article-meta{margin:12px 0 0;padding:0}
@media(max-width:1200px){
  .article-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .article-thumb{height:165px}
}
@media(max-width:900px){
  .article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article-thumb{height:190px}
}
@media(max-width:620px){
  .article-grid{grid-template-columns:1fr}
  .article-thumb{height:clamp(160px,44vw,210px)}
  .article-card>a>div:not(.article-thumb),.article-card>div:not(.article-thumb){min-height:0}
}

/* Numbered pagination for article and review archives */
.joker-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin:32px 0 10px;
}
.joker-pagination .page-numbers{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:42px;
  height:42px;
  padding:0 13px;
  border:1px solid rgba(224,179,57,.28);
  border-radius:12px;
  background:#0c0b08;
  color:#e9dfc8;
  font-weight:800;
  text-decoration:none;
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.joker-pagination a.page-numbers:hover{transform:translateY(-2px);border-color:#e7b938;color:#ffe38a;background:#151107}
.joker-pagination .page-numbers.current{
  color:#160f02;
  border-color:#f2d06c;
  background:linear-gradient(135deg,#a8730d,#e7b938 55%,#ffe58e);
  box-shadow:0 10px 24px rgba(214,167,45,.22);
}
.joker-pagination .page-numbers.dots{border-color:transparent;background:transparent;color:#9d927b}
@media(max-width:620px){
  .joker-pagination{gap:6px;margin-top:24px}
  .joker-pagination .page-numbers{min-width:38px;height:38px;padding:0 10px;font-size:13px}
}

/* General Elementor pages inside the complete theme shell */
.page .joker-single-card{max-width:none;padding:clamp(14px,2vw,26px)}
.page .joker-single-card .joker-entry-content{max-width:none}
.page .joker-single-card .elementor{width:100%;max-width:100%}
.page .joker-single-card .e-con{max-width:100%}

/* Keep Elementor content visible and inside the viewport on theme-shell mobile pages. */
@media(max-width:760px){
  body.joker-theme-shell-page .layout,
  body.joker-theme-shell-page .main,
  body.joker-theme-shell-page .content,
  body.joker-theme-shell-page .joker-single-shell,
  body.joker-theme-shell-page .joker-single-card,
  body.joker-theme-shell-page .joker-entry-content,
  body.joker-theme-shell-page .joker-entry-content>.elementor{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
  }
  body.joker-theme-shell-page .content{padding:12px 0 96px!important}
  body.joker-theme-shell-page .joker-single-card{margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
  body.joker-theme-shell-page .joker-entry-content{margin:0!important;padding:0!important}
  body.joker-theme-shell-page .joker-entry-content .elementor-element,
  body.joker-theme-shell-page .joker-entry-content .e-con,
  body.joker-theme-shell-page .joker-entry-content .e-con-inner,
  body.joker-theme-shell-page .joker-entry-content .elementor-widget,
  body.joker-theme-shell-page .joker-entry-content .elementor-widget-container{
    max-width:100%!important;
    min-width:0!important;
  }
  body.joker-theme-shell-page .joker-entry-content .elementor-invisible{
    visibility:visible!important;
    opacity:1!important;
    transform:none!important;
  }
  body.joker-theme-shell-page .joker-entry-content img,
  body.joker-theme-shell-page .joker-entry-content video,
  body.joker-theme-shell-page .joker-entry-content iframe{
    display:block;
    max-width:100%!important;
    height:auto;
  }

  /* Front page: show Elementor content immediately without a tap or scroll. */
  body.joker-elementor-front-page .joker-elementor-home-content,
  body.joker-elementor-front-page .joker-elementor-home,
  body.joker-elementor-front-page .joker-elementor-home>.elementor{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
  }
  body.joker-elementor-front-page .joker-elementor-home-content{padding:12px 0 96px!important}
  body.joker-elementor-front-page .joker-elementor-home .elementor-element,
  body.joker-elementor-front-page .joker-elementor-home .e-con,
  body.joker-elementor-front-page .joker-elementor-home .e-con-inner,
  body.joker-elementor-front-page .joker-elementor-home .elementor-widget,
  body.joker-elementor-front-page .joker-elementor-home .elementor-widget-container{
    max-width:100%!important;
    min-width:0!important;
  }
  body.joker-elementor-front-page .joker-elementor-home .elementor-invisible,
  body.joker-elementor-front-page .joker-elementor-home .px-reveal,
  body.joker-elementor-front-page .joker-elementor-home .reveal{
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
  }
  body.joker-elementor-front-page .joker-elementor-home img,
  body.joker-elementor-front-page .joker-elementor-home video,
  body.joker-elementor-front-page .joker-elementor-home iframe{
    max-width:100%!important;
    height:auto;
  }
  body.joker-elementor-front-page .loader,
  body.joker-elementor-front-page .px-loader{
    pointer-events:none!important;
  }
}