/*
Theme Name: Retirely
Theme URI: https://retire.ly/
Author: Retirely
Author URI: https://retire.ly/
Description: The official Retirely theme. Powers the live newsroom homepage, clean article and page templates, and the Retirely header and footer.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: retirely
*/

/* =========================================================================
   Base (article + page chrome). The homepage ships its own scoped CSS;
   the newsroom plugin styles the reader. This covers standalone pages.
   ========================================================================= */
:root{--rt-fg:#16181d;--rt-fg2:#5c626c;--rt-line:#ececec;--rt-bg:#fff;--rt-accent:#15a06a;--rt-gold:#d4af37;--rt-wrap:1180px;--rt-read:730px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Noto Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--rt-fg);background:#fff;line-height:1.6;font-size:16px}
img{max-width:100%;height:auto}
a{color:#2563eb;text-decoration:none}
a:hover{text-decoration:underline}

/* Header (works for both the article header.php and the homepage template header) */
.cs-header{border-bottom:1px solid var(--rt-line);background:#fff}
.cs-header .cs-container{max-width:none;width:100%;padding:0}
.cs-header__inner-desktop{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1200px;margin:0 auto;padding:11px 20px}
.cs-header__col{display:flex;align-items:center;gap:16px;min-width:0}
.cs-header__logo,a.cs-header__logo{font-family:"Noto Sans",sans-serif;font-size:32px;font-weight:700;line-height:1;letter-spacing:-1.6px;color:#16181d;text-decoration:none;display:inline-block;white-space:nowrap;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* Logged-in right cluster (Publish · bell · avatar): Publish soaks up the free
   space via auto margin so the trio sits together at the right edge; negative
   margins cancel most of the flex gap so they cluster tight like the old header. */
.cs-header__inner-desktop #rtly-publish,.cs-header__inner-desktop .rtly-publish{margin-left:auto!important}
.cs-header__inner-desktop #rtly-bell{margin-left:-4px!important}
.cs-header__inner-desktop #rtly-avatar,.cs-header__inner-desktop .rtly-avatar{margin-left:-2px!important}
.cs-header__logo:hover{text-decoration:none}
.cs-header__logo .rtly-dot{color:#15a06a;font-weight:800;margin-left:-1px}
.cs-header__logo .rtly-tm{font-size:.5em;font-weight:700;vertical-align:super;margin-left:-1px}
.cs-header__nav,.cs-header__nav ul,.cs-header__nav-inner{list-style:none!important;display:flex!important;gap:18px!important;margin:0!important;padding:0!important;flex-wrap:wrap;align-items:center}
.cs-header__nav li{list-style:none!important;margin:0!important;padding:0!important}
.cs-header__nav li::before,.cs-header__nav li::marker{content:none!important}
.cs-header__nav a{color:#3d434d!important;font-size:14px;font-weight:500;text-decoration:none}
.cs-header__nav a:hover{color:#16181d!important;text-decoration:none}
.headerqrcontainer{display:flex;align-items:center;gap:8px}
.headerqrcontainer img{height:34px;width:auto;display:block}
.rtly-icon-btn{background:transparent;border:0;cursor:pointer;color:#3d434d;display:inline-flex;align-items:center;justify-content:center;padding:6px;border-radius:8px}
.rtly-icon-btn:hover{background:#f1f2ef;color:#16181d}
.cs-header__inner-mobile{display:none}
.rtly-drawer,.rtly-drawer-backdrop{display:none}
.rtly-search[hidden]{display:none}
.rtly-search .cs-container{max-width:var(--rt-wrap);margin:0 auto;padding:12px 22px}
@media(max-width:980px){
  .cs-header__inner-desktop{display:none}
  .cs-header__inner-mobile{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:var(--rt-wrap);margin:0 auto;padding:12px 16px}
}

/* Content wrappers (match plugin scrape targets) */
main#primary,main#main{display:block}
/* Width is set ONCE on .cs-container (like NewsBlock) so nested wrappers don't double-pad. */
.cs-site-content{width:100%}
.cs-container{max-width:1200px;margin:0 auto;padding:0 20px}
.cs-main-content{padding:28px 0 56px}

/* Article */
.cs-entry__title{font-family:Georgia,"Times New Roman",serif;font-size:34px;line-height:1.18;letter-spacing:-.012em;margin:0 0 14px;color:#14171c;max-width:var(--rt-read)}
.cs-entry__meta,.cs-meta{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--rt-fg2);margin:0 0 20px;max-width:var(--rt-read)}
.cs-meta-author{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:#14171c}
.cs-meta-author a{color:#14171c;text-decoration:none}
.cs-meta-author img{width:26px;height:26px;border-radius:50%;object-fit:cover}
.cs-meta-date{color:var(--rt-fg2)}
.cs-entry__header{max-width:var(--rt-read);margin:0 auto 22px}
.cs-entry__header img,.wp-post-image{width:100%;height:auto;border-radius:10px;display:block}
.entry-content{max-width:var(--rt-read);margin:0 auto;font-size:17px;line-height:1.65;color:#23272e}
.entry-content p{margin:0 0 1.05em}
.entry-content h2{font-family:Georgia,serif;font-size:24px;margin:1.5em 0 .4em}
.entry-content h3{font-size:19px;margin:1.3em 0 .4em}
.entry-content img{height:auto;border-radius:8px;margin:16px 0}
.entry-content img[src*="ycharts"]{width:100%!important;height:auto!important;display:block;margin:18px auto}
.entry-content ul,.entry-content ol{padding-left:24px;margin:0 0 1.05em}
.entry-content blockquote{border-left:3px solid var(--rt-gold);margin:1.4em 0;padding:2px 0 2px 18px;font-family:Georgia,serif;font-style:italic;font-size:20px;color:#33383f}

/* Footer */
.cs-footer{border-top:1px solid var(--rt-line);background:#fff;margin-top:40px}
.cs-footer__inner{max-width:var(--rt-wrap);margin:0 auto;padding:28px 22px;display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.cs-logo{font-size:20px;font-weight:800;color:#16181d}
.cs-logo .rtly-dot{color:#15a06a}
.cs-footer__nav{display:flex;gap:16px;flex-wrap:wrap;margin-left:auto}
.cs-footer__nav a{color:#5c626c;font-size:13px;text-decoration:none}
.cs-footer__nav a:hover{color:#16181d}
.cs-footer__desc{width:100%;color:#9aa0a8;font-size:12.5px}
/* Homepage footer (NewsBlock markup the template emits) */
.cs-footer .cs-container{max-width:1200px;margin:0 auto;padding:0 20px}
.cs-footer__item{position:relative;display:flex;align-items:center;gap:20px;padding:8px 0}
.cs-footer__col{display:flex;align-items:center}
/* Menu sits dead-center; logo stays left, social pinned right. */
.cs-footer .cs-col-left{margin-right:auto}
.cs-footer .cs-col-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0}
.cs-footer .cs-col-right{margin-left:auto}
.cs-footer__logo img{height:40px;width:auto;display:block;filter:none!important;opacity:1!important}
.cs-footer__logo{opacity:1!important}
html:not(.rtly-light) .cs-footer__logo img{filter:invert(1)!important}
.footer-nav-menu ul{list-style:none;display:flex;gap:16px;margin:0;padding:0;flex-wrap:wrap;align-items:center}
.footer-nav-menu li{list-style:none;margin:0}
.footer-nav-menu a{color:#5c626c;font-size:13px;text-decoration:none}
.footer-nav-menu a:hover{color:#16181d}

@media(max-width:680px){
  .cs-entry__title{font-size:27px}
  .cs-main-content,.cs-site-content{padding:18px 16px 40px}
  .cs-header__nav{display:none}
}