/* ==========================================================================
   WUS Events — Public Front-End Styles v7.1
   Brand: Navy #0A1543 | Orange #F47C2C
   Fonts: Montserrat (headings/UI) | Aleo (body/reading)
   Both fonts loaded by theme — no @import needed
   ========================================================================== */
/* ---- WUS Design Tokens ---- */
/* --radius-btn: 8px;   — CTAs, view tabs, search inputs */
/* --radius-chip: 6px;  — Quick chips, category pills */
/* --radius-tag: 5px;   — Card category tags */
/* --radius-card: 12px; — Event cards, containers */
/* --radius-badge: 10px; — Date badge */



/* ---- RESET ---- */
.wus-events-wrap,
.wus-events-wrap * {
    box-sizing: border-box;
}

/* ---- BASE — Aleo for body text ---- */
.wus-events-wrap {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px 60px;
    font-family: 'Aleo', Georgia, serif !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    color: #1f2937 !important;
}

/* ---- Montserrat for ALL UI elements ---- */
.wus-events-hero h1,
.wus-events-hero p,
.wus-events-hero a,
.wus-events-search input,
.wus-events-search select,
.wus-events-search button,
.wus-events-search .wus-search-btn,
.wus-events-search .wus-search-clear,
.wus-view-tab,
.wus-tab-count,
.wus-quick-chip,
.wus-cat-pill,
.wus-event-card__title,
.wus-event-card__title a,
.wus-event-card__cat,
.wus-event-card__meta,
.wus-event-card__meta span,
.wus-featured-badge,
.wus-date-badge,
.wus-date-badge__month,
.wus-date-badge__day,
.wus-series-badge-front,
.wus-today-header h2,
.wus-today-date,
.wus-no-events h3,
.wus-results-count,
.wus-pagination a,
.wus-pagination span {
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, sans-serif !important;
}

/* ---- Aleo for reading/body content ---- */
.wus-event-card__excerpt,
.wus-event-card__excerpt p,
.wus-no-events p {
    font-family: 'Aleo', Georgia, serif !important;
}

/* ---- HERO ---- */
.wus-events-hero {
    background: linear-gradient(135deg, #0A1543 0%, #142654 100%);
    border-radius: 18px;
    padding: 48px 40px 44px;
    margin-top: 36px;
    margin-bottom: 32px;
    color: #fff !important;
    position: relative;
    overflow: hidden;
}
.wus-events-hero::after {
    content: '';
    position: absolute;
    top: -40%; right: -10%;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(244,124,44,.15) 0%, transparent 70%);
    pointer-events: none;
}
.wus-events-hero h1 {
    margin: 0 0 6px !important;
    font-size: 36px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    color: #fff !important;
    position: relative; z-index: 1;
}
.wus-events-hero p {
    margin: 0 !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    opacity: .75;
    color: #fff !important;
    position: relative; z-index: 1;
}
.wus-events-hero a { color: #fff !important; text-decoration: none; opacity: .7; transition: opacity .2s; }
.wus-events-hero a:hover { opacity: 1; }

/* ---- SEARCH BAR ---- */
.wus-events-search {
    display: flex;
    gap: 10px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.wus-events-search input[type="text"],
.wus-events-search input[type="date"],
.wus-events-search select {
    flex: 1;
    min-width: 150px;
    padding: 14px 18px !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    background: #fff !important;
    color: #1f2937 !important;
    transition: border-color .2s, box-shadow .2s;
}
.wus-events-search input:focus,
.wus-events-search select:focus {
    outline: none;
    border-color: #0A1543 !important;
    box-shadow: 0 0 0 3px rgba(10,21,67,.1);
}
.wus-events-search .wus-search-btn {
    background: #0A1543 !important;
    color: #fff !important;
    border: none !important;
    padding: 14px 28px !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    cursor: pointer;
    transition: background .2s;
    white-space: nowrap;
}
.wus-events-search .wus-search-btn:hover { background: #1a2d5c !important; }
.wus-events-search .wus-search-clear {
    background: none !important;
    border: 2px solid #d1d5db !important;
    padding: 14px 18px !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    transition: all .2s;
}
.wus-events-search .wus-search-clear:hover { border-color: #9ca3af !important; color: #374151 !important; }

/* ---- VIEW TABS — 8px radius ---- */
.wus-view-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.wus-view-tab {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 11px 22px !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    color: #4b5563 !important;
    background: #f3f4f6 !important;
    border: 2px solid #e5e7eb !important;
    transition: all .2s;
    cursor: pointer;
}
.wus-view-tab:hover { color: #1f2937 !important; background: #e5e7eb !important; border-color: #d1d5db !important; }
.wus-view-tab.active { background: #0A1543 !important; color: #fff !important; border-color: #0A1543 !important; }
.wus-view-tab .wus-tab-count {
    background: rgba(0,0,0,.1);
    padding: 2px 10px;
    border-radius: 8px;
    font-size: 13px !important;
    font-weight: 700 !important;
}
.wus-view-tab.active .wus-tab-count { background: rgba(255,255,255,.2); }

/* ---- QUICK CHIPS — 8px colored buttons ---- */
.wus-quick-chips {
    display: flex !important;
    gap: 8px !important;
    margin-bottom: 12px !important;
    flex-wrap: wrap !important;
    align-items: center !important;
}

.wus-quick-chip {

    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 10px 18px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    border: 2px solid transparent !important;
    transition: all .2s !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

/* Featured — warm orange */
.wus-chip--featured {
    background: #fff7ed !important;
    color: #c2410c !important;
    border-color: #fed7aa !important;
}
.wus-chip--featured:hover { background: #ffedd5 !important; border-color: #fb923c !important; }
.wus-chip--featured.active { background: #F47C2C !important; color: #fff !important; border-color: #F47C2C !important; }

/* Free — green */
.wus-chip--free {
    background: #f0fdf4 !important;
    color: #166534 !important;
    border-color: #bbf7d0 !important;
}
.wus-chip--free:hover { background: #dcfce7 !important; border-color: #4ade80 !important; }
.wus-chip--free.active { background: #16a34a !important; color: #fff !important; border-color: #16a34a !important; }

/* Recurring — purple */
.wus-chip--recurring {
    background: #faf5ff !important;
    color: #7e22ce !important;
    border-color: #e9d5ff !important;
}
.wus-chip--recurring:hover { background: #f3e8ff !important; border-color: #c084fc !important; }
.wus-chip--recurring.active { background: #7e22ce !important; color: #fff !important; border-color: #7e22ce !important; }

/* Clear — red */
.wus-chip--clear {
    background: #fef2f2 !important;
    color: #dc2626 !important;
    border-color: #fecaca !important;
}
.wus-chip--clear:hover { background: #fee2e2 !important; border-color: #f87171 !important; }

/* ---- CATEGORY PILLS — Same 8px buttons, orange active ---- */
.wus-cat-pills {
    display: flex;
    gap: 8px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}
.wus-cat-pill {
    display: inline-flex !important;
    align-items: center !important;
    padding: 10px 20px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    color: #374151 !important;
    background: #f3f4f6 !important;
    border: 2px solid #e5e7eb !important;
    transition: all .2s;
    white-space: nowrap !important;
}
.wus-cat-pill:hover { background: #e5e7eb !important; color: #1f2937 !important; border-color: #d1d5db !important; }
.wus-cat-pill.active { background: #F47C2C !important; color: #fff !important; border-color: #F47C2C !important; }

/* ---- GRID ---- */
.wus-events-grid { display: grid; gap: 22px; }

/* ---- EVENT CARD ---- */
.wus-event-card {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 0;
    background: #fff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(10,21,67,.05);
    transition: box-shadow .3s, transform .3s;
}
.wus-event-card:hover {
    box-shadow: 0 12px 40px rgba(10,21,67,.12);
    transform: translateY(-3px);
}
.wus-event-card--featured {
    border-left: 5px solid #F47C2C !important;
    background: linear-gradient(135deg, #fff7ed 0%, #fff 40%) !important;
}
.wus-event-card--featured:hover { box-shadow: 0 12px 40px rgba(244,124,44,.15); }

/* Card Image */
.wus-event-card__img { position: relative; overflow: hidden; min-height: 220px; }
.wus-event-card__img img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block; }
.wus-event-card__img-placeholder {
    width: 100%; height: 100%; min-height: 220px;
    background: linear-gradient(135deg, #e5e7eb 0%, #d1d5db 100%);
    display: flex; align-items: center; justify-content: center;
    font-size: 48px !important; color: #9ca3af !important;
}

/* Date Badge */
.wus-date-badge {
    position: absolute; top: 12px; left: 12px;
    background: #fff !important; border-radius: 10px !important;
    padding: 8px 12px !important; text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,.16);
    line-height: 1 !important; min-width: 54px;
}
.wus-date-badge__month {
    display: block; font-size: 11px !important; font-weight: 800 !important;
    text-transform: uppercase; color: #F47C2C !important; letter-spacing: 1.2px !important;
}
.wus-date-badge__day {
    display: block; font-size: 24px !important; font-weight: 900 !important;
    color: #0A1543 !important; margin-top: 2px;
}

/* Featured Star */
.wus-featured-badge {
    position: absolute; top: 12px; right: 12px;
    background: #F47C2C !important; color: #fff !important;
    padding: 6px 14px !important; border-radius: 8px !important;
    font-size: 13px !important; font-weight: 800 !important;
    box-shadow: 0 2px 8px rgba(244,124,44,.3);
}

/* Card Body */
.wus-event-card__body {
    padding: 24px 28px !important;
    display: flex; flex-direction: column; justify-content: center;
}

/* Title */
.wus-event-card__title {
    margin: 0 0 10px !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
}
.wus-event-card__title a { color: #0A1543 !important; text-decoration: none !important; transition: color .2s; }
.wus-event-card__title a:hover { color: #F47C2C !important; }

/* Meta */
.wus-event-card__meta {
    display: flex; flex-wrap: wrap;
    gap: 16px !important; margin-bottom: 12px !important;
    font-size: 15px !important; color: #4b5563 !important;
}
.wus-event-card__meta span {
    display: inline-flex; align-items: center; gap: 5px;
    font-size: 15px !important; color: #4b5563 !important;
}

/* Excerpt — Aleo serif for readability */
.wus-event-card__excerpt {
    font-size: 16px !important; color: #6b7280 !important;
    line-height: 1.65 !important; margin-bottom: 14px !important;
}
.wus-event-card__excerpt p {
    font-size: 16px !important; color: #6b7280 !important;
    line-height: 1.65 !important; margin: 0 !important;
}

/* Card Cats */
.wus-event-card__cats { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.wus-event-card__cat {
    padding: 5px 14px !important; border-radius: 5px !important;
    font-size: 13px !important; font-weight: 700 !important;
    background: #eff6ff !important; color: #1e40af !important;
    text-decoration: none !important; transition: background .2s;
}
.wus-event-card__cat:hover { background: #dbeafe !important; }

/* Series Badge */
.wus-series-badge-front {
    display: inline-flex !important; align-items: center; gap: 6px;
    padding: 9px 20px !important;
    background: #0A1543 !important; color: #fff !important;
    border-radius: 8px !important; font-size: 14px !important;
    font-weight: 700 !important; text-decoration: none !important;
    margin-top: 8px !important; transition: all .2s;
    width: fit-content !important; max-width: fit-content !important;
}
.wus-series-badge-front:hover { background: #142654 !important; color: #fff !important; transform: translateY(-1px); }

/* No Results */
.wus-no-events { text-align: center; padding: 70px 24px; background: #f9fafb; border-radius: 12px; border: 2px dashed #d1d5db; }
.wus-no-events h3 { margin: 0 0 10px !important; font-size: 24px !important; color: #0A1543 !important; font-weight: 800 !important; }
.wus-no-events p { margin: 0 !important; color: #6b7280 !important; font-size: 17px !important; }
.wus-no-events a { color: #F47C2C !important; font-weight: 700 !important; }

/* Pagination */
.wus-pagination { display: flex; justify-content: center; gap: 6px; margin-top: 40px; }
.wus-pagination a, .wus-pagination span {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 44px; height: 44px; padding: 0 16px;
    border-radius: 8px !important; font-size: 15px !important; font-weight: 700 !important;
    text-decoration: none !important; border: 2px solid #e5e7eb !important;
    color: #374151 !important; background: #fff !important; transition: all .2s;
}
.wus-pagination a:hover { background: #f3f4f6 !important; border-color: #d1d5db !important; }
.wus-pagination .current { background: #0A1543 !important; color: #fff !important; border-color: #0A1543 !important; }

/* Today Panel */
.wus-today-header { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.wus-today-header h2 { margin: 0 !important; font-size: 24px !important; font-weight: 800 !important; color: #0A1543 !important; }
.wus-today-date { background: #F47C2C !important; color: #fff !important; padding: 8px 18px !important; border-radius: 8px !important; font-weight: 700 !important; font-size: 15px !important; }

/* ================================================================
   RESPONSIVE
   ================================================================ */
@media (max-width: 900px) {
    .wus-event-card { grid-template-columns: 200px 1fr; }
    .wus-event-card__body { padding: 20px 24px !important; }
    .wus-event-card__title { font-size: 20px !important; }
}

@media (max-width: 768px) {
    .wus-events-hero { padding: 34px 26px 30px; margin-top: 24px; }
    .wus-events-hero h1 { font-size: 28px !important; }
    .wus-events-hero p { font-size: 16px !important; }
    .wus-events-search { flex-direction: column; }
    .wus-events-search input,
    .wus-events-search select,
    .wus-events-search .wus-search-btn { min-width: 100%; }
    .wus-event-card { grid-template-columns: 1fr; }
    .wus-event-card__img { min-height: 220px; max-height: 280px; }
    .wus-event-card__body { padding: 20px 22px !important; }
    .wus-event-card__title { font-size: 20px !important; }
    .wus-event-card__meta span { font-size: 14px !important; }
    .wus-event-card__excerpt { font-size: 15px !important; }
    .wus-view-tabs { gap: 6px; }
    .wus-view-tab { padding: 10px 18px !important; font-size: 14px !important; }
    .wus-quick-chip {
 padding: 9px 14px !important; font-size: 13px !important; }
    .wus-cat-pill { padding: 9px 16px !important; font-size: 13px !important; }
}

@media (max-width: 480px) {
    .wus-events-wrap { padding: 0 14px 40px; }
    .wus-events-hero { padding: 26px 18px 22px; border-radius: 14px; margin-top: 18px; }
    .wus-events-hero h1 { font-size: 24px !important; }
    .wus-event-card__title { font-size: 19px !important; }
    .wus-event-card__meta { font-size: 14px !important; gap: 10px !important; }
    .wus-event-card__meta span { font-size: 14px !important; }
    .wus-event-card__excerpt { font-size: 15px !important; }
    .wus-quick-chip {
 padding: 8px 12px !important; font-size: 12px !important; }
    .wus-cat-pill { padding: 8px 14px !important; font-size: 13px !important; }
}