/* Upcoming workshops list on documentation/getting-started.html.
   Content is baked at build time by scripts/build-workshops.js and refreshed at
   runtime by /js/workshops.js. */

.workshop-list {
    display: grid;
    gap: 16px;
}

.workshop-card {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px 24px;
    border: 1px solid #e1e6ec;
    border-left: 4px solid var(--brand-blue, #0c62a6);
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .06);
    font-family: 'Segoe UI', Arial, sans-serif;
}

/* Date block on the left: big day number, month above/below. */
.workshop-card__date {
    flex: none;
    width: 76px;
    text-align: center;
    padding: 10px 0;
    border-radius: 8px;
    background: #eef4fa;
    color: var(--brand-blue, #0c62a6);
    line-height: 1.1;
}

.workshop-card__month {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.workshop-card__day {
    display: block;
    font-size: 28px;
    font-weight: 700;
}

.workshop-card__body {
    flex: 1 1 auto;
    min-width: 0;
}

.workshop-card__title {
    margin: 0 0 4px;
    font-size: 17px;
    font-weight: 600;
    color: #1a1a2e;
}

.workshop-card__time {
    margin: 0;
    font-size: 15px;
    color: #4a5a6a;
}

/* Filled in by JS once the visitor's timezone is known. */
.workshop-card__tz {
    color: #7a8794;
}

.workshop-card__summary {
    margin: 6px 0 0;
    font-size: 14px;
    color: #4a5a6a;
}

.workshop-card__cta {
    flex: none;
    display: inline-block;
    padding: 11px 22px;
    border-radius: 8px;
    background: var(--brand-blue, #0c62a6);
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, transform .15s ease;
}

.workshop-card__cta:hover {
    background: #0a4f86;
    transform: translateY(-1px);
    color: #fff;
}

.workshop-card__cta:focus-visible {
    outline: 2px solid #2E9BD6;
    outline-offset: 2px;
}

/* Shown when no sessions are scheduled or the listing could not be loaded. */
.workshop-empty {
    padding: 20px 24px;
    border: 1px dashed #cfd8e3;
    border-radius: 10px;
    text-align: center;
    color: #4a5a6a;
    font-family: 'Segoe UI', Arial, sans-serif;
}

@media (max-width: 640px) {
    .workshop-card {
        flex-wrap: wrap;
        gap: 14px;
    }

    .workshop-card__body {
        flex-basis: calc(100% - 96px);
    }

    .workshop-card__cta {
        flex-basis: 100%;
        text-align: center;
    }
}