/*
Theme Name: Simply Closed
Theme URI: https://simplyclosed.com/blog/
Author: Simply Closed
Author URI: https://simplyclosed.com/
Description: Classic WordPress theme for the Simply Closed blog at /blog/. It carries no design system of its own — it links the site-wide stylesheet at /assets/css/site.css so the blog and the static marketing site can never drift apart. Editorial/Swiss: no drop shadows, radii 0–2px, hairline rules instead of card borders, flush-left headings, brand blue #004AAD as ink and gold #FFDE59 as a sparing accent.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: Proprietary
License URI: https://simplyclosed.com/terms/
Text Domain: simplyclosed
Tags: blog, one-column, custom-menu, editor-style, translation-ready
*/

/* ==========================================================================
   THIS FILE HOLDS NO DESIGN TOKENS.

   Every colour, type scale, space value and component in this theme comes
   from the shared stylesheet:

       /assets/css/site.css        (loaded first, by functions.php)

   That file is the single source of truth for both the static marketing site
   and this blog. Copying its :root tokens here would guarantee that the two
   drift the first time either one is edited — so it is deliberately not done.
   Everything below is blog-only: things WordPress emits that the static site
   never needed (post meta, pagination, comments, search form, block editor
   output), styled to the same five rules:

     1. No drop shadows.
     2. Radii are 0 or 2px. Nothing is a pill.
     3. Hairline rules do the work that card borders used to.
     4. Headings are flush left.
     5. Blue is ink. Gold is a hairline accent.
   ========================================================================== */

/* ---------- Post meta ---------- */
.post-meta{
  font-size:.66rem;
  font-weight:650;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 .75rem;
  line-height:1.4;
}
.post-meta-sep{margin:0 .5rem}
a.card:hover .post-meta{color:var(--muted)}
.bg-ink .post-meta,.bg-brand .post-meta{color:#8AA3C4}

/* Featured image inside a card: a flat plate under the top rule. */
.post-thumb{margin:0 0 1.2rem}
.post-thumb img{
  width:100%;
  aspect-ratio:16/10;
  object-fit:cover;
  border-radius:0;
  display:block;
}

/* Tags / paged-post links at the foot of an article */
.sc-terms,.sc-link-pages{
  margin-top:2rem;
  padding-top:1rem;
  border-top:1px solid var(--line);
  letter-spacing:.04em;
}
.sc-link-pages span{margin-right:.6rem}

/* ---------- Pagination ----------
   Deliberately NOT core's .nav-links wrapper: that class belongs to the site
   header, where it is display:none below 1160px. This is its own row of
   ruled figures. */
.sc-pagination{
  margin-top:clamp(2.5rem,1.6rem + 2vw,3.5rem);
  padding-top:1.25rem;
  border-top:1.5px solid var(--rule);
}
.sc-pagination ul{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.25rem;
  list-style:none;
  padding:0;
  margin:0;
}
.sc-pagination li{margin:0}
.sc-pagination a,
.sc-pagination span{
  display:inline-block;
  padding:.55rem .7rem;
  font-family:var(--f-mono);
  font-size:.78rem;
  letter-spacing:.08em;
  color:var(--muted);
  border-bottom:1.5px solid transparent;
  border-radius:0;
  background:none;
}
.sc-pagination a:hover{
  color:var(--brand);
  border-bottom-color:var(--brand);
  text-decoration:none;
}
.sc-pagination .current{
  color:var(--ink);
  font-weight:600;
  border-bottom-color:var(--gold);
}
.sc-pagination .dots{border-bottom-color:transparent;color:var(--line-strong)}
.sc-pagination .prev,
.sc-pagination .next{
  font-family:var(--f-body);
  font-size:.82rem;
  font-weight:600;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--brand);
}

/* ---------- Search form ---------- */
.sc-search{margin-top:2.25rem}
.sc-search-row{
  display:flex;
  align-items:flex-end;
  gap:1.5rem;
}
.sc-search-row input[type=search]{
  flex:1 1 auto;
  min-width:0;
  width:100%;
  padding:.75rem 0;
  border:0;
  border-bottom:1.5px solid var(--line-strong);
  border-radius:0;
  font-family:inherit;
  font-size:1rem;
  background:none;
  color:var(--ink);
  -webkit-appearance:none;
  appearance:none;
  transition:border-color .15s;
}
.sc-search-row input[type=search]:focus{
  outline:none;
  border-bottom-color:var(--brand);
  box-shadow:none;
}
.sc-search-row .btn{flex:0 0 auto}

/* ---------- Comments ---------- */
.sc-comments{
  margin-top:3rem;
  padding-top:1.5rem;
  border-top:1.5px solid var(--rule);
}
.sc-comments-title{
  font-size:.66rem;
  font-family:var(--f-body);
  font-weight:650;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 1.5rem;
  border:0;
  padding:0;
}
.prose .sc-comments-title{border-top:0;padding-top:0;margin-top:0}
.sc-comment-list,
.sc-comment-list .children{
  list-style:none;
  padding:0;
  margin:0;
}
.sc-comment-list .children{
  margin-left:1.5rem;
  padding-left:1.5rem;
  border-left:1px solid var(--line);
}
.sc-comment{
  border-top:1px solid var(--line);
  padding:1.4rem 0;
  margin:0;
}
.sc-comment:first-child{border-top:0;padding-top:0}
.sc-comment-author{color:var(--ink)}
.sc-comment-text{font-size:.95rem}
.sc-comment-text p:last-child{margin-bottom:0}
.sc-comment-reply{margin:.8rem 0 0}
.sc-comment-reply a{
  font-size:.68rem;
  font-weight:650;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--brand);
  border-bottom:1.5px solid transparent;
}
.sc-comment-reply a:hover{text-decoration:none;border-bottom-color:var(--brand)}

.sc-comment-form{margin-top:2rem}
.sc-comment-form p{margin-bottom:1.4rem}
.sc-comment-form label{
  display:block;
  font-size:.68rem;
  font-weight:650;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ink);
  margin-bottom:.5rem;
}
.sc-comment-form input[type=text],
.sc-comment-form input[type=email],
.sc-comment-form input[type=url],
.sc-comment-form textarea{
  width:100%;
  padding:.75rem 0;
  border:0;
  border-bottom:1.5px solid var(--line-strong);
  border-radius:0;
  font-family:inherit;
  font-size:1rem;
  background:none;
  color:var(--ink);
  transition:border-color .15s;
}
.sc-comment-form input:focus,
.sc-comment-form textarea:focus{
  outline:none;
  border-bottom-color:var(--brand);
  box-shadow:none;
}
.sc-comment-form textarea{min-height:140px;resize:vertical}
.sc-comment-form .comment-form-cookies-consent{
  display:flex;
  align-items:flex-start;
  gap:.6rem;
}
.sc-comment-form .comment-form-cookies-consent label{
  text-transform:none;
  letter-spacing:0;
  font-size:.82rem;
  font-weight:400;
  color:var(--muted);
  margin:0;
}
.sc-comment-form .comment-form-cookies-consent input{width:auto;accent-color:var(--brand)}
.sc-comment-form .form-submit{margin-top:1.5rem}
.sc-comment-form .submit{border-radius:2px}

/* ---------- WordPress core output ---------- */
.screen-reader-text{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
.screen-reader-text:focus{
  position:static!important;
  width:auto;height:auto;
  margin:0;clip:auto;
  white-space:normal;
}
.alignleft{float:left;margin:.4rem 2rem 1.5rem 0}
.alignright{float:right;margin:.4rem 0 1.5rem 2rem}
.aligncenter{display:block;margin-inline:auto}
.alignwide,.alignfull{margin-inline:0;max-width:100%}
.wp-caption{max-width:100%;margin:2.25rem 0}
.wp-caption img{border-radius:0}
.wp-caption-text,
.prose figcaption{
  font-size:.78rem;
  color:var(--muted);
  text-align:left;
  margin-top:.75rem;
  letter-spacing:.06em;
}
.sticky .post-meta::after{
  content:" · Featured";
  color:var(--gold-700);
}

/* Block editor output, pulled back into the system. */
.prose .wp-block-image{margin:2.25rem 0}
.prose .wp-block-image img{border-radius:0}
.prose .wp-block-button__link,
.prose .wp-element-button{
  border-radius:2px;
  padding:.95rem 1.7rem;
  font-weight:600;
  font-size:.95rem;
  background:var(--brand);
  color:#fff;
  box-shadow:none;
}
.prose .wp-block-button__link:hover{background:var(--ink);text-decoration:none}
.prose .is-style-outline .wp-block-button__link{
  background:none;
  color:var(--ink);
  border:1.5px solid var(--line-strong);
}
.prose .wp-block-quote,
.prose .wp-block-pullquote{
  margin:2.25rem 0;
  padding:0 0 0 1.5rem;
  border:0;
  border-left:2px solid var(--gold);
  background:none;
  text-align:left;
  font-family:var(--f-display);
  font-size:1.28rem;
  line-height:1.4;
  color:var(--ink);
  letter-spacing:-.02em;
}
.prose .wp-block-quote cite,
.prose .wp-block-pullquote cite{
  display:block;
  margin-top:.9rem;
  font-family:var(--f-body);
  font-style:normal;
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}
.prose .wp-block-separator{
  border:0;
  border-top:1px solid var(--line);
  margin:2.5rem 0;
  width:100%;
  opacity:1;
}
.prose .wp-block-separator.is-style-wide{width:100%}
.prose .wp-block-table{margin:2.25rem 0;overflow-x:auto}
.prose .wp-block-table table{border-collapse:collapse}
.prose .wp-block-code,
.prose pre{
  background:var(--paper);
  border:0;
  border-left:2px solid var(--line-strong);
  border-radius:0;
  padding:1.2rem 1.4rem;
  font-family:var(--f-mono);
  font-size:.85rem;
  overflow-x:auto;
}
.prose code{font-family:var(--f-mono);font-size:.88em;background:var(--paper);padding:.1em .3em;border-radius:2px}
.prose pre code{background:none;padding:0}
.prose .wp-block-embed{margin:2.25rem 0}
.prose .wp-block-embed__wrapper{position:relative}
.prose .wp-block-gallery{margin:2.25rem 0}
.prose .wp-block-gallery img{border-radius:0}

/* ---------- Logged-in admin bar ----------
   The admin bar is fixed at the top of the viewport; the sticky site header
   has to start below it or the two overlap. Logged-out visitors never see
   either rule. */
body.admin-bar .site-header{top:32px}
@media screen and (max-width:782px){
  body.admin-bar .site-header{top:46px}
}
body.admin-bar .mobile-nav{max-height:calc(100vh - 108px)}

.nav-phone{font-size:.86rem;font-weight:600;color:var(--ink);text-decoration:none;white-space:nowrap;margin-right:14px}
.nav-phone:hover{color:var(--brand)}