/*
Theme Name: SilverRush Blog
Theme URI: https://www.silverrushstyle.com/blog
Author: SilverRush Style
Description: Blog theme matching the SilverRush Style shop chrome. Remote-includes shop header/footer (cached 3h) and styles the blog content area with the shop's visual language (Montserrat + Playfair Display, teal accent #81d8d0).
Version: 1.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: Proprietary
Text Domain: silverrush-blog
*/

/* ============================================================
   Typography — match shop (Montserrat body / Playfair Display headings)
   ============================================================ */
body.blog, body.single, body.archive, body.page, body.search {
    font-family: 'Montserrat', system-ui, -apple-system, sans-serif;
    color: #757584;
    line-height: 1.65;
    background: #fff;
}

/* ============================================================
   Blog content wrapper — sits between shop header and footer
   ============================================================ */
.srs-blog-wrap {
    max-width: 1200px;
    margin: 2rem auto 4rem;
    padding: 0 1.25rem;
}

.srs-blog-wrap .srs-blog-main { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 2.5rem; }
@media (max-width: 900px) { .srs-blog-wrap .srs-blog-main { grid-template-columns: 1fr; } }

/* Breadcrumbs matching shop */
.srs-blog-crumbs { font-size: 0.85rem; color: #a0a0a8; margin-bottom: 1.5rem; letter-spacing: 0.5px; }
.srs-blog-crumbs a { color: #757584; text-decoration: none; }
.srs-blog-crumbs a:hover { color: #81d8d0; text-decoration: underline; }
.srs-blog-crumbs .sep { margin: 0 0.5rem; color: #ccc; }

/* ============================================================
   Headings — Playfair Display, uppercase, letterspacing (like shop)
   ============================================================ */
.srs-blog-wrap h1, .srs-blog-wrap h2, .srs-blog-wrap h3, .srs-blog-wrap h4 {
    font-family: 'Playfair Display', Georgia, serif;
    color: #333;
    letter-spacing: 1px;
    line-height: 1.3;
    margin: 1.5em 0 0.6em;
    font-weight: normal;
}
.srs-blog-wrap h1 { font-size: 2.25rem; text-transform: uppercase; letter-spacing: 2px; color: #525252; margin-top: 0; }
.srs-blog-wrap h2 { font-size: 1.65rem; text-transform: uppercase; }
.srs-blog-wrap h3 { font-size: 1.25rem; }
.srs-blog-wrap h4 { font-size: 1.1rem; text-transform: uppercase; color: #81d8d0; letter-spacing: 2px; }

/* Post meta line (date, category) */
.srs-post-meta { font-size: 0.82rem; color: #999; text-transform: uppercase; letter-spacing: 1.5px; margin: 0 0 1.5rem; }
.srs-post-meta a { color: #81d8d0; text-decoration: none; }
.srs-post-meta .sep { margin: 0 0.5rem; color: #ccc; }

/* Post content prose */
.srs-post-content { font-size: 1.02rem; }
.srs-post-content p { margin: 0 0 1.1em; }
.srs-post-content a { color: #81d8d0; border-bottom: 1px solid transparent; text-decoration: none; transition: border-color .15s; }
.srs-post-content a:hover { border-bottom-color: #81d8d0; }
.srs-post-content img { max-width: 100%; height: auto; border-radius: 4px; }
.srs-post-content blockquote {
    margin: 1.5em 0; padding: 1em 1.5em; border-left: 3px solid #81d8d0;
    background: #f8fdfc; color: #525252; font-style: italic;
}
.srs-post-content ul, .srs-post-content ol { margin: 0 0 1.1em 1.5em; }
.srs-post-content li { margin-bottom: 0.4em; }
.srs-post-content hr { border: 0; border-top: 1px solid #e2e8f0; margin: 2em 0; }
.srs-post-content figure { margin: 1.5em 0; }
.srs-post-content figcaption { font-size: 0.85rem; color: #999; text-align: center; margin-top: 0.5em; }
.srs-post-content code { background: #f4f4f7; padding: 0.15em 0.35em; border-radius: 3px; font-size: 0.9em; }

/* Featured image on top of single post */
.srs-post-hero { margin: 0 0 1.8rem; border-radius: 6px; overflow: hidden; }
.srs-post-hero img { width: 100%; display: block; }

/* ============================================================
   Archive / Index — card grid
   ============================================================ */
.srs-blog-title-section { text-align: center; margin: 0 0 2.5rem; }
.srs-blog-title-section .srs-title { font-family: 'Playfair Display', serif; text-transform: uppercase; letter-spacing: 3px; color: #525252; font-size: 2.25rem; margin: 0 0 0.5rem; }
.srs-blog-title-section .srs-sub { color: #888; font-size: 0.95rem; letter-spacing: 1px; }

.srs-post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 2rem; margin: 0 0 3rem; }
.srs-post-card {
    background: #fff; border: 1px solid #eee; border-radius: 6px; overflow: hidden;
    transition: box-shadow .2s, transform .2s;
    display: flex; flex-direction: column;
}
.srs-post-card:hover { box-shadow: 0 6px 24px rgba(17,34,51,.08); transform: translateY(-2px); }
.srs-post-card .card-img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: #f4f4f7; }
.srs-post-card .card-body { padding: 1rem 1.2rem 1.4rem; flex: 1; display: flex; flex-direction: column; }
.srs-post-card .card-cat { font-size: 0.72rem; color: #81d8d0; text-transform: uppercase; letter-spacing: 2px; margin-bottom: 0.5rem; font-weight: 600; }
.srs-post-card h3 { font-family: 'Playfair Display', serif; font-size: 1.15rem; line-height: 1.3; margin: 0 0 0.5rem; letter-spacing: 0; text-transform: none; }
.srs-post-card h3 a { color: #333; text-decoration: none; }
.srs-post-card h3 a:hover { color: #81d8d0; }
.srs-post-card .card-excerpt { font-size: 0.9rem; color: #888; margin: 0 0 0.8rem; flex: 1; }
.srs-post-card .card-date { font-size: 0.75rem; color: #bbb; letter-spacing: 1px; text-transform: uppercase; }

/* Pagination */
.srs-pagination { text-align: center; margin: 3rem 0 0; }
.srs-pagination .page-numbers {
    display: inline-block; padding: 0.5rem 0.9rem; margin: 0 0.2rem;
    color: #333; text-decoration: none; border: 1px solid transparent; border-radius: 3px;
    font-size: 0.9rem; letter-spacing: 1px;
}
.srs-pagination .page-numbers:hover,
.srs-pagination .page-numbers.current { background: #81d8d0; color: #fff; }

/* ============================================================
   Sidebar
   ============================================================ */
.srs-sidebar { font-size: 0.92rem; }
.srs-sidebar .widget { margin-bottom: 2.5rem; }
.srs-sidebar .widget-title {
    font-family: 'Playfair Display', serif; font-size: 1rem; text-transform: uppercase;
    letter-spacing: 2px; color: #525252; margin: 0 0 1rem; padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}
.srs-sidebar ul { list-style: none; padding: 0; margin: 0; }
.srs-sidebar li { padding: 0.4rem 0; border-bottom: 1px solid #f4f4f7; }
.srs-sidebar li:last-child { border-bottom: none; }
.srs-sidebar a { color: #757584; text-decoration: none; }
.srs-sidebar a:hover { color: #81d8d0; }

/* Search widget */
.srs-blog-search { position: relative; }
.srs-blog-search input[type=search] {
    width: 100%; padding: 0.6rem 2.5rem 0.6rem 0.9rem; border: 1px solid #e2e8f0;
    border-radius: 3px; font-family: inherit; font-size: 0.9rem; background: #fafafa;
}
.srs-blog-search input[type=search]:focus { outline: none; border-color: #81d8d0; background: #fff; }
.srs-blog-search button {
    position: absolute; right: 0; top: 0; bottom: 0; width: 40px;
    background: transparent; border: none; color: #81d8d0; cursor: pointer; font-size: 1rem;
}

/* Comments */
.srs-comments { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid #eee; }
.srs-comments h3 { font-family: 'Playfair Display', serif; font-size: 1.4rem; text-transform: uppercase; letter-spacing: 2px; color: #525252; margin: 0 0 1.5rem; }

/* ============================================================
   Shop-chrome integration — when remote include fails, fallback banner
   ============================================================ */
.srs-chrome-fallback { background: #81d8d0; color: #fff; text-align: center; padding: 0.8rem; font-size: 0.85rem; letter-spacing: 1px; }
.srs-chrome-fallback a { color: #fff; text-decoration: underline; font-weight: 600; }