/*
 * WPWiseBones – main.css
 * Additional component styles not in style.css.
 */

/* ── Preloader ────────────────────────────────────────────── */
#wpb-preloader {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .4s ease;
}
#wpb-preloader.fade-out { opacity: 0; pointer-events: none; }

/* ── Search form ──────────────────────────────────────────── */
.search-form { display: flex; }
.search-form .search-field { flex: 1; border-radius: .375rem 0 0 .375rem; border: 1px solid #dee2e6; padding: .375rem .75rem; }
.search-form .search-submit { border-radius: 0 .375rem .375rem 0; background: var(--bs-primary); color: #fff; border: none; padding: .375rem .75rem; cursor: pointer; }

/* ── WP Alignment classes ─────────────────────────────────── */
.alignleft  { float: left; margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter { display: block; margin: 1rem auto; }
.alignwide  { margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); max-width: 100vw; }
.alignfull  { margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); max-width: 100vw; width: 100vw; }

/* ── WP Caption ───────────────────────────────────────────── */
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: .8125rem; color: var(--bs-secondary); text-align: center; padding: .25rem 0; }

/* ── Sticky post badge ─────────────────────────────────────── */
.sticky .card::before {
    content: "Featured";
    position: absolute;
    top: .75rem;
    left: .75rem;
    background: var(--bs-warning);
    color: #000;
    font-size: .7rem;
    font-weight: 700;
    padding: .15rem .5rem;
    border-radius: .25rem;
    z-index: 1;
    text-transform: uppercase;
}
.sticky .card { position: relative; }

/* ── Gallery ───────────────────────────────────────────────── */
.gallery { display: grid; gap: .5rem; }
.gallery-columns-2 { grid-template-columns: repeat(2, 1fr); }
.gallery-columns-3 { grid-template-columns: repeat(3, 1fr); }
.gallery-columns-4 { grid-template-columns: repeat(4, 1fr); }
.gallery-item img  { width: 100%; height: 100%; object-fit: cover; border-radius: .25rem; }

/* ── Post format icons ──────────────────────────────────────── */
.format-video .entry-title::before  { content: "â–¶ "; color: var(--bs-primary); }
.format-audio .entry-title::before  { content: "♫ "; color: var(--bs-primary); }
.format-quote .entry-title::before  { content: "" "; color: var(--bs-primary); }
.format-link  .entry-title::before  { content: "🔗 "; }

/* ── Table of Contents ──────────────────────────────────────── */
#wpb-toc {
    background: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: .5rem;
    padding: 1rem 1.25rem;
    margin-bottom: 1.5rem;
}
#wpb-toc::before {
    content: "Table of Contents";
    display: block;
    font-weight: 700;
    margin-bottom: .5rem;
}
#wpb-toc a { text-decoration: none; color: var(--bs-primary); font-size: .9rem; display: block; padding: .15rem 0; }
#wpb-toc a:hover { text-decoration: underline; }

/* ── Print styles ───────────────────────────────────────────── */
@media print {
    .site-header,
    .site-footer,
    #back-to-top,
    .wpb-share,
    .sidebar,
    nav { display: none !important; }
    body { padding: 0; font-size: 12pt; }
    a[href]::after { content: " (" attr(href) ")"; }
}

/* ============================================================
   WORDPRESS REQUIRED CSS CLASSES
   ============================================================ */

/* .screen-reader-text — visually hidden but accessible */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}
.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
    clip: auto !important;
    clip-path: none;
    color: #21759b;
    display: block;
    font-size: .875rem;
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

/* .gallery-caption — WordPress gallery captions */
.gallery-caption {
    display: block;
    font-size: .875rem;
    color: var(--bs-secondary);
    padding: .25rem 0;
    text-align: center;
}

/* .bypostauthor — highlight comment by post author */
.bypostauthor > .comment-body {
    border-left: 3px solid var(--bs-primary);
    background: #e7f1ff;
}
.bypostauthor .comment-author .fn::after {
    content: ' \2014 Author';
    font-size: .75rem;
    color: var(--bs-primary);
    font-weight: 400;
}

/* .wp-caption — WordPress image captions */
.wp-caption {
    max-width: 100%;
    margin-bottom: 1rem;
}
.wp-caption img { display: block; }
.wp-caption-text {
    font-size: .8125rem;
    color: var(--bs-secondary);
    text-align: center;
    padding: .25rem 0;
}

/* .sticky — sticky/featured posts */
.sticky { position: relative; }
.sticky::before {
    content: attr(data-label, 'Featured');
    display: inline-block;
    background: var(--bs-warning);
    color: #000;
    font-size: .7rem;
    font-weight: 700;
    padding: .15rem .5rem;
    border-radius: .25rem;
    margin-bottom: .5rem;
    text-transform: uppercase;
}