/* PressFly 3.6.38 r16 — authoritative article detail layout.
 * This file is loaded only on article.show and replaces the older competing
 * 1280/77-23/Bootstrap article width rules.
 */
body.article-show{
    --pf-article-max:1540px;
    --pf-article-sidebar:360px;
    --pf-article-gap:24px;
    --pf-article-gutter:clamp(14px,1.5vw,24px);
}
body.pf-layout-full.article-show{
    --pf-article-max:1880px;
    --pf-article-sidebar:390px;
    --pf-article-gap:28px;
}
body.article-show main.article-main-content,
body.article-show main.article-main-content.container{
    width:min(calc(100% - (var(--pf-article-gutter) * 2)),var(--pf-article-max))!important;
    max-width:var(--pf-article-max)!important;
    margin:0 auto!important;
    padding:24px 0 38px!important;
    background:transparent!important;
    position:relative!important;
    z-index:2!important;
}
body.article-show .article-layout-balanced{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(340px,var(--pf-article-sidebar))!important;
    gap:var(--pf-article-gap)!important;
    align-items:start!important;
    margin:0!important;
    width:100%!important;
}
body.article-show .article-content-column,
body.article-show .article-sidebar-column{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    flex:none!important;
    padding:0!important;
    margin:0!important;
}
body.article-show .article-content-column>.col-inner{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    padding:clamp(22px,2vw,32px)!important;
    border:1px solid #e5e7eb!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:none!important;
    overflow:hidden!important;
}
body.article-show .article-sidebar-column .pf-article-sidebar-clean{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}
body.article-show .article-sidebar-column .pf-article-sidebar-clean>.widget,
body.article-show .article-sidebar-column .pf-article-sidebar-clean>.pf-revenue-ad-slot,
body.article-show .article-sidebar-column .pf-article-sidebar-clean>.pf-clean-ad-slot{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0 0 18px!important;
    box-sizing:border-box!important;
}
body.article-show .article-sidebar-column .widget>.block-content,
body.article-show .article-sidebar-column .widget .block-content,
body.article-show .article-sidebar-column .pf-clean-ad-inner,
body.article-show .article-sidebar-column .pf-ad-inner,
body.article-show .article-sidebar-column .ad-inner{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
}
body.article-show .article-sidebar-column img,
body.article-show .article-sidebar-column video,
body.article-show .article-sidebar-column iframe,
body.article-show .article-sidebar-column ins,
body.article-show .article-sidebar-column object,
body.article-show .article-sidebar-column embed{
    max-width:100%!important;
}
body.article-show .article-sidebar-column .widget-article-list .block-item{
    grid-template-columns:92px minmax(0,1fr)!important;
    gap:12px!important;
    min-width:0!important;
}
body.article-show .article-sidebar-column .widget-article-list .block-item-img,
body.article-show .article-sidebar-column .widget-article-list .block-item-img.img-side{
    width:92px!important;
    min-width:92px!important;
    height:72px!important;
}
body.article-show .article-sidebar-column .widget-article-list .block-item-title,
body.article-show .article-sidebar-column .widget-article-list .block-item-title a{
    min-width:0!important;
    overflow-wrap:anywhere!important;
}
body.article-show .article-content,
body.article-show .article-content-column .article-meta,
body.article-show .pf-article-author-flat,
body.article-show .pf-article-tools,
body.article-show .pf-article-action-row{
    min-width:0!important;
    max-width:100%!important;
}
body.article-show .article-content img,
body.article-show .article-content video,
body.article-show .article-content iframe,
body.article-show .article-content table,
body.article-show .article-content pre{
    max-width:100%!important;
}
body.article-show .article-content img,
body.article-show .article-content video{height:auto!important;}
body.article-show .article-content{overflow-wrap:anywhere;}
body.article-show .article-title{
    font-size:clamp(30px,3vw,46px)!important;
    line-height:1.14!important;
    overflow-wrap:anywhere!important;
}
/* Ads may have a fixed creative size (for example 300x600), but the widget
   shell itself must use the full sidebar width and stay visually centered. */
body.article-show .article-sidebar-column .pf-revenue-ad-slot,
body.article-show .article-sidebar-column .pf-clean-ad-slot{
    display:flex!important;
    justify-content:center!important;
    align-items:flex-start!important;
}
@media (min-width:1600px){
    body.pf-layout-full.article-show{--pf-article-sidebar:410px;--pf-article-gap:30px;}
}
@media (max-width:1199.98px) and (min-width:992px){
    body.article-show{--pf-article-sidebar:320px;--pf-article-gap:18px;--pf-article-gutter:14px;}
    body.article-show main.article-main-content,
    body.article-show main.article-main-content.container{
        width:min(calc(100% - 28px),1190px)!important;
        max-width:1190px!important;
        padding-top:20px!important;
    }
    body.article-show .article-layout-balanced{
        grid-template-columns:minmax(0,1fr) 320px!important;
    }
}
@media (max-width:991.98px){
    body.article-show main.article-main-content,
    body.article-show main.article-main-content.container,
    body.pf-layout-full.article-show main.article-main-content{
        width:100%!important;
        max-width:none!important;
        padding:16px 14px 28px!important;
    }
    body.article-show .article-layout-balanced{
        grid-template-columns:minmax(0,1fr)!important;
        gap:18px!important;
    }
    body.article-show .article-sidebar-column{margin-top:0!important;}
    body.article-show .article-sidebar-column .pf-article-sidebar-clean{width:100%!important;}
}
@media (max-width:575.98px){
    body.article-show main.article-main-content,
    body.article-show main.article-main-content.container{padding:12px 10px 24px!important;}
    body.article-show .article-content-column>.col-inner{padding:15px!important;border-radius:15px!important;}
    body.article-show .article-title{font-size:clamp(27px,8vw,35px)!important;}
    body.article-show .article-sidebar-column .widget-article-list .block-item{grid-template-columns:84px minmax(0,1fr)!important;}
    body.article-show .article-sidebar-column .widget-article-list .block-item-img,
    body.article-show .article-sidebar-column .widget-article-list .block-item-img.img-side{width:84px!important;min-width:84px!important;height:66px!important;}
}

/* Dark mode geometry uses the same grid without forcing a light article card. */
html.dark-mode-site body.article-show .article-content-column>.col-inner,
body.dark-mode-site.article-show .article-content-column>.col-inner,
html.dark body.article-show .article-content-column>.col-inner,
body.dark.article-show .article-content-column>.col-inner{
    background:#111827!important;
    border-color:#253044!important;
    color:#dbe7f5!important;
}
