/* TSN Events — BEM styles
   Inherits typography and base font from the GeneratePress parent theme.
   All sizing uses rem relative to the document root (16px default). */

:root {
    --tsn-color-primary:    #2c4a3e;
    --tsn-color-accent:     #e8a838;
    --tsn-color-text:       #1a1a1a;
    --tsn-color-text-muted: #5a5a5a;
    --tsn-color-bg:         #ffffff;
    --tsn-color-bg-subtle:  #f6f4f1;
    --tsn-color-border:     #e0ddd8;

    --tsn-space-xs:  0.4rem;
    --tsn-space-sm:  0.8rem;
    --tsn-space-md:  1.6rem;
    --tsn-space-lg:  3.2rem;
    --tsn-space-xl:  6.4rem;

    --tsn-radius:    0.375rem;
    --tsn-shadow:    0 2px 8px rgba(0, 0, 0, 0.08);
    --tsn-transition: 0.15s ease;
}

/* ── Archive ─────────────────────────────────────────────────────────────── */

.tsn-event-archive {
    max-width: 72rem;
    margin-inline: auto;
    padding: var(--tsn-space-lg) var(--tsn-space-md);
}

.tsn-event-archive__header {
    margin-bottom: var(--tsn-space-lg);
}

.tsn-event-archive__title {
    font-size: 1.6rem;
    color: var(--tsn-color-primary);
    margin-bottom: var(--tsn-space-sm);
}

.tsn-event-archive__description {
    color: var(--tsn-color-text-muted);
    max-width: 48rem;
}

.tsn-event-archive__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
    gap: var(--tsn-space-md);
}

.tsn-event-archive__item {
    display: contents;
}

.tsn-event-archive__empty {
    color: var(--tsn-color-text-muted);
    font-style: italic;
    padding: var(--tsn-space-lg) 0;
}

.tsn-event-archive__pagination {
    margin-top: var(--tsn-space-lg);
}

/* ── Event card ──────────────────────────────────────────────────────────── */

.tsn-event-card {
    display: flex;
    flex-direction: column;
    background: var(--tsn-color-bg);
    border: 1px solid var(--tsn-color-border);
    border-radius: var(--tsn-radius);
    box-shadow: var(--tsn-shadow);
    overflow: hidden;
    transition: box-shadow var(--tsn-transition), transform var(--tsn-transition);
}

.tsn-event-card:hover,
.tsn-event-card:focus-within {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
    transform: translateY(-2px);
}

.tsn-event-card__media {
    margin: 0;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--tsn-color-bg-subtle);
}

.tsn-event-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform var(--tsn-transition);
}

.tsn-event-card:hover .tsn-event-card__image {
    transform: scale(1.03);
}

.tsn-event-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: var(--tsn-space-md);
    gap: var(--tsn-space-sm);
}

.tsn-event-card__header {
    display: flex;
    flex-direction: column;
    gap: var(--tsn-space-xs);
}

.tsn-event-card__title {
    font-size: 1.6rem;
    margin: 0;
    line-height: 1.3;
}

.tsn-event-card__link {
    color: var(--tsn-color-primary);
    text-decoration: none;
}

.tsn-event-card__link:hover,
.tsn-event-card__link:focus {
    text-decoration: underline;
    color: var(--tsn-color-accent);
}

.tsn-event-card__link:focus {
    outline: 2px solid var(--tsn-color-accent);
    outline-offset: 2px;
    border-radius: 2px;
}

.tsn-event-card__date {
    margin: 0;
    color: var(--tsn-color-text-muted);
}

.tsn-event-card__excerpt {
    flex: 1;
    color: var(--tsn-color-text);
    margin: 0;
}

.tsn-event-card__excerpt p {
    margin: 0;
}

.tsn-event-card__footer {
    display: flex;
    flex-wrap: wrap;
    gap: var(--tsn-space-sm);
    padding-top: var(--tsn-space-sm);
    border-top: 1px solid var(--tsn-color-border);
    color: var(--tsn-color-text-muted);
}

.tsn-event-card__location,
.tsn-event-card__cost {
    margin: 0;
}

.tsn-event-card__location-icon {
    margin-right: var(--tsn-space-xs);
}

/* ── Single event ────────────────────────────────────────────────────────── */

.tsn-event--single {
    max-width: 52rem;
    margin-inline: auto;
    padding: var(--tsn-space-lg) var(--tsn-space-md);
}

.tsn-event__header {
    margin-bottom: var(--tsn-space-md);
}

.tsn-event__title {
    font-size: 3rem;
    color: var(--tsn-color-primary);
    margin-bottom: var(--tsn-space-sm);
}

.tsn-event__dates {
    color: var(--tsn-color-text-muted);
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--tsn-space-xs);
}

.tsn-event__dates-sep {
    color: var(--tsn-color-border);
}

.tsn-event__media {
    margin: 0 0 var(--tsn-space-lg);
    border-radius: var(--tsn-radius);
    overflow: hidden;
    box-shadow: var(--tsn-shadow);
}

.tsn-event__image {
    width: 100%;
    height: auto;
    display: block;
}

.tsn-event__body {
    margin-bottom: var(--tsn-space-lg);
    line-height: 1.7;
    color: var(--tsn-color-text);
}

.tsn-event__body h2,
.tsn-event__body h3 {
    color: var(--tsn-color-primary);
    margin-top: var(--tsn-space-lg);
    font-size: 1.6rem;
}

.tsn-event__details {
    background: var(--tsn-color-bg-subtle);
    border: 1px solid var(--tsn-color-border);
    border-radius: var(--tsn-radius);
    padding: var(--tsn-space-md);
    margin-bottom: var(--tsn-space-lg);
}

.tsn-event__meta {
    margin: 0;
    display: grid;
    gap: var(--tsn-space-sm);
}

.tsn-event__meta-row {
    display: grid;
    grid-template-columns: 7rem 1fr;
    gap: var(--tsn-space-sm);
    align-items: baseline;
}

@media (max-width: 36em) {
    .tsn-event__meta-row {
        grid-template-columns: 1fr;
        gap: var(--tsn-space-xs);
    }
}

.tsn-event__meta-label {
    font-weight: 600;
    color: var(--tsn-color-text-muted);
    text-transform: uppercase;
    white-space: nowrap;
}

.tsn-event__meta-value {
    margin: 0;
    color: var(--tsn-color-text);
}

.tsn-event__location {
    font-style: normal;
}

.tsn-event__footer {
    border-top: 1px solid var(--tsn-color-border);
    padding-top: var(--tsn-space-lg);
}

.tsn-event__book-btn {
    display: inline-block;
    padding: var(--tsn-space-sm) var(--tsn-space-md);
    background: var(--tsn-color-accent);
    color: #1a1a1a;
    font-weight: 600;
    text-decoration: none;
    border-radius: var(--tsn-radius);
    transition: background var(--tsn-transition), transform var(--tsn-transition);
}

.tsn-event__book-btn:hover,
.tsn-event__book-btn:focus {
    background: #d4962e;
    transform: translateY(-1px);
}

.tsn-event__book-btn:focus {
    outline: 2px solid var(--tsn-color-primary);
    outline-offset: 2px;
}

/* ── RSVP form ───────────────────────────────────────────────────────────── */

.tsn-rsvp {
    
}

.tsn-rsvp__title {
    font-size: 1.6rem;
    color: var(--tsn-color-primary);
    margin-bottom: var(--tsn-space-md);
}

.tsn-rsvp__form {
    display: flex;
    flex-direction: column;
    gap: var(--tsn-space-md);
}

.tsn-rsvp__field {
    display: flex;
    flex-direction: column;
    gap: var(--tsn-space-xs);
}

.tsn-rsvp__label {
    font-weight: 600;
    color: var(--tsn-color-text);
}

.tsn-rsvp__input {
    padding: var(--tsn-space-sm) var(--tsn-space-sm);
    border: 1px solid var(--tsn-color-border);
    border-radius: var(--tsn-radius);
    color: var(--tsn-color-text);
    background: var(--tsn-color-bg);
    width: 100%;
    transition: border-color var(--tsn-transition), box-shadow var(--tsn-transition);
}

.tsn-rsvp__input:focus {
    outline: none;
    border-color: var(--tsn-color-primary);
    box-shadow: 0 0 0 3px rgba(44, 74, 62, 0.15);
}

.tsn-rsvp__submit {
    align-self: flex-start;
    padding: var(--tsn-space-sm) var(--tsn-space-md);
    background: var(--tsn-color-primary);
    color: #ffffff;
    font-weight: 600;
    border: none;
    border-radius: var(--tsn-radius);
    cursor: pointer;
    transition: background var(--tsn-transition), transform var(--tsn-transition);
}

.tsn-rsvp__submit:hover,
.tsn-rsvp__submit:focus {
    background: #1e3329;
    transform: translateY(-1px);
}

.tsn-rsvp__submit:focus {
    outline: 2px solid var(--tsn-color-accent);
    outline-offset: 2px;
}

.tsn-rsvp__notice {
    padding: var(--tsn-space-sm) var(--tsn-space-md);
    border-radius: var(--tsn-radius);
    margin-bottom: var(--tsn-space-md);
    font-weight: 500;
}

.tsn-rsvp__notice--success {
    background: #ecf7f1;
    border: 1px solid #82c99e;
    color: #1a4a2e;
}

.tsn-rsvp__notice--error {
    background: #fdf2f2;
    border: 1px solid #e89090;
    color: #5c1a1a;
}

.tsn-rsvp__notice p {
    margin: 0;
}

/* ── Accessibility utilities ─────────────────────────────────────────────── */

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}