/**
 * SOS News — Front-end Styles
 *
 * Designed for WCAG 2.2 AA compliance:
 *   - Minimum 4.5:1 contrast for body text
 *   - Minimum 3:1 contrast for large text and UI components
 *   - Focus indicators meet 2px / 3:1 contrast requirements
 *   - Touch targets minimum 24×24 CSS px (Target Size)
 *   - No information conveyed by colour alone
 *
 * @package SOS_News
 */

/* ── CSS Custom Properties ─────────────────────────────────── */
:root {
    --sos-news-text:          #1a1a1a;
    --sos-news-text-muted:    #595959;
    --sos-news-link:          #0055a4;
    --sos-news-link-hover:    #003d75;
    --sos-news-border:        #d1d1d1;
    --sos-news-bg:            #ffffff;
    --sos-news-bg-hover:      #f5f5f5;
    --sos-news-focus:         #0055a4;
    --sos-news-radius:        4px;
    --sos-news-spacing:       1rem;
    --sos-news-font:          inherit;
}

/* ── Focus ring (WCAG 2.4.7 / 2.4.13) ─────────────────────── */
.sos-news-list a:focus-visible,
.sos-news-archive a:focus-visible,
.sos-news-single a:focus-visible,
.sos-news-widget__link:focus-visible,
.sos-news-archive__filter-link:focus-visible {
    outline: 3px solid var(--sos-news-focus);
    outline-offset: 2px;
    border-radius: var(--sos-news-radius);
}

/* ── Shortcode list ────────────────────────────────────────── */
.sos-news-list__items {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sos-news-list__item {
    padding: var(--sos-news-spacing) 0;
    border-bottom: 1px solid var(--sos-news-border);
}

.sos-news-list__item:last-child {
    border-bottom: none;
}

/* ── Card (shared between shortcode + archive) ─────────────── */
.sos-news-card__date {
    display: block;
    font-family: var(--sos-news-font);
    font-size: 0.8125rem;
    color: var(--sos-news-text-muted);
    margin-bottom: 0.25rem;
}

.sos-news-card__title {
    font-family: var(--sos-news-font);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.35;
    margin: 0 0 0.375rem;
}

.sos-news-card__title a {
    color: var(--sos-news-text);
    text-decoration: none;
}

.sos-news-card__title a:hover {
    color: var(--sos-news-link-hover);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.sos-news-card__blurb {
    font-family: var(--sos-news-font);
    font-size: 0.9375rem;
    line-height: 1.55;
    color: var(--sos-news-text-muted);
    margin: 0;
}

.sos-news-card__categories {
    font-size: 0.8125rem;
    color: var(--sos-news-text-muted);
    margin: 0.5rem 0 0;
}

/* ── "View all" link ──────────────────────────────────────── */
.sos-news-list__footer {
    margin-top: var(--sos-news-spacing);
}

.sos-news-list__view-all,
.sos-news-widget__footer a {
    display: inline-block;
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--sos-news-link);
    text-decoration: none;
    min-height: 44px;
    line-height: 44px; /* touch target */
}

.sos-news-list__view-all:hover,
.sos-news-widget__footer a:hover {
    color: var(--sos-news-link-hover);
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ── Widget ────────────────────────────────────────────────── */
.sos-news-widget__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sos-news-widget__item {
    border-bottom: 1px solid var(--sos-news-border);
}

.sos-news-widget__item:last-child {
    border-bottom: none;
}

.sos-news-widget__link {
    display: block;
    padding: 0.625rem 0;
    color: var(--sos-news-text);
    text-decoration: none;
    min-height: 44px; /* WCAG target size */
}

.sos-news-widget__link:hover {
    background: var(--sos-news-bg-hover);
}

.sos-news-widget__title {
    display: block;
    font-weight: 600;
    font-size: 0.9375rem;
    line-height: 1.35;
}

.sos-news-widget__date {
    display: block;
    font-size: 0.75rem;
    color: var(--sos-news-text-muted);
    margin-top: 0.125rem;
}

.sos-news-widget__footer {
    margin-top: 0.5rem;
}

/* ── No news message ──────────────────────────────────────── */
.sos-news-empty {
    font-family: var(--sos-news-font);
    color: var(--sos-news-text-muted);
    font-style: italic;
}

/* ── Archive page ──────────────────────────────────────────── */
.sos-news-archive {
    max-width: 48rem;
    margin: 0 auto;
    padding: 2rem var(--sos-news-spacing);
}

.sos-news-archive__title {
    font-size: 1.75rem;
    margin-bottom: 1rem;
}

/* Category filter pills */
.sos-news-archive__filter-list {
    list-style: none;
    margin: 0 0 1.5rem;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.sos-news-archive__filter-link {
    display: inline-block;
    padding: 0.375rem 0.875rem;
    font-size: 0.875rem;
    font-weight: 500;
    border: 1px solid var(--sos-news-border);
    border-radius: 2rem;
    color: var(--sos-news-text);
    text-decoration: none;
    min-height: 36px;
    line-height: 1.5;
    transition: background-color 0.15s, border-color 0.15s;
}

.sos-news-archive__filter-link:hover {
    background: var(--sos-news-bg-hover);
    border-color: var(--sos-news-text-muted);
}

.sos-news-archive__filter-link--active {
    background: var(--sos-news-text);
    color: var(--sos-news-bg);
    border-color: var(--sos-news-text);
}

.sos-news-archive__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sos-news-archive__item {
    padding: 1.25rem 0;
    border-bottom: 1px solid var(--sos-news-border);
}

.sos-news-archive__item:last-child {
    border-bottom: none;
}

/* ── Single page ──────────────────────────────────────────── */
.sos-news-single {
    max-width: 48rem;
    margin: 0 auto;
    padding: 2rem var(--sos-news-spacing);
}

.sos-news-single__title {
    font-size: 2rem;
    line-height: 1.25;
    margin-bottom: 0.75rem;
}

.sos-news-single__meta {
    font-size: 0.875rem;
    color: var(--sos-news-text-muted);
    margin-bottom: 1rem;
}

.sos-news-single__meta a {
    color: var(--sos-news-link);
    text-decoration: none;
}

.sos-news-single__meta a:hover {
    text-decoration: underline;
}

.sos-news-single__blurb {
    font-size: 1.125rem;
    line-height: 1.55;
    color: var(--sos-news-text-muted);
    border-left: 3px solid var(--sos-news-border);
    padding-left: 1rem;
    margin: 0 0 1.5rem;
}

.sos-news-single__image {
    margin: 0 0 1.5rem;
}

.sos-news-single__img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--sos-news-radius);
}

.sos-news-single__content {
    font-size: 1rem;
    line-height: 1.7;
    margin-bottom: 2rem;
}

/* ── Single page navigation ────────────────────────────────── */
.sos-news-single__nav {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.5rem 0;
    border-top: 1px solid var(--sos-news-border);
}

.sos-news-single__nav-link {
    color: var(--sos-news-link);
    text-decoration: none;
    font-weight: 500;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
}

.sos-news-single__nav-link:hover {
    text-decoration: underline;
}

.sos-news-single__back {
    display: inline-block;
    margin-top: 1rem;
    color: var(--sos-news-link);
    text-decoration: none;
    font-weight: 500;
    min-height: 44px;
    line-height: 44px;
}

.sos-news-single__back:hover {
    text-decoration: underline;
}

/* ── Template variations ─────────────────────────────────── */

/* Featured template — card with image */
.sos-news-card--featured {
    display: flex;
    gap: var(--sos-news-spacing);
    align-items: flex-start;
}

.sos-news-card__image {
    flex: 0 0 120px;
}

.sos-news-card__img {
    display: block;
    width: 120px;
    height: 80px;
    object-fit: cover;
    border-radius: var(--sos-news-radius);
}

.sos-news-card--featured .sos-news-card__body {
    flex: 1;
    min-width: 0;
}

/* Compact template — tighter spacing */
.sos-news-card--compact .sos-news-card__title {
    font-size: 1rem;
    margin-bottom: 0;
}

.sos-news-list__item--compact {
    padding: 0.5rem 0;
}

/* Minimal template — title only */
.sos-news-card--minimal .sos-news-card__title {
    font-size: 0.9375rem;
    font-weight: 500;
    margin-bottom: 0;
}

.sos-news-list__item--minimal {
    padding: 0.375rem 0;
}

@media (max-width: 480px) {
    .sos-news-card--featured {
        flex-direction: column;
    }

    .sos-news-card__image {
        flex: none;
    }

    .sos-news-card__img {
        width: 100%;
        height: auto;
        max-height: 200px;
    }
}

/* ── Long URL / word overflow fix ─────────────────────────── */
.single-sos_news .entry-content,
.single-sos_news .entry-content a,
.sos-news-single__content,
.sos-news-single__content a,
.sos-news-card__blurb {
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.single-sos_news .entry-content {
    overflow: hidden;
}

/* ── Reduced motion ────────────────────────────────────────── */
@media ( prefers-reduced-motion: reduce ) {
    .sos-news-archive__filter-link {
        transition: none;
    }
}
