.ocsa-public-shell,
.ocsa-calendar-shell,
.ocsa-public-event-detail,
.ocsa-csa-panel {
    --ocsa-orange: #f37021;
    --ocsa-dark: #22272d;
    --ocsa-light: #f5f6f7;
    max-width: 980px;
    margin: 0 auto;
    box-sizing: border-box;
}
.ocsa-form,
.ocsa-public-event-detail {
    background: #fff;
    border-radius: 20px;
    padding: 28px;
    box-shadow: 0 8px 28px rgba(0,0,0,.08);
}
.ocsa-grid { display: grid; gap: 18px; }
.ocsa-grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ocsa-grid-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.ocsa-field { margin-bottom: 18px; }
.ocsa-field label { display: block; font-weight: 800; margin-bottom: 7px; color: #252525; }
.ocsa-field input[type="text"],
.ocsa-field input[type="email"],
.ocsa-field input[type="tel"],
.ocsa-field input[type="url"],
.ocsa-field input[type="date"],
.ocsa-field input[type="time"],
.ocsa-field input[type="search"],
.ocsa-field textarea,
.ocsa-csa-search {
    width: 100%; box-sizing: border-box; border: 1px solid #cfd3d7; border-radius: 10px; padding: 12px 13px; font: inherit; background:#fff;
}
.ocsa-field input:focus,.ocsa-field textarea:focus,.ocsa-csa-search:focus { outline: 3px solid rgba(243,112,33,.2); border-color: var(--ocsa-orange); }
.ocsa-field.has-error input,.ocsa-field.has-error textarea { border-color: #b42318; }
.ocsa-error { display:block; color:#b42318; margin-top:6px; font-weight:700; }
.ocsa-check-field label { display:flex; align-items:flex-start; gap:10px; }
.ocsa-primary-button,.ocsa-submit-btn {
    display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:999px; padding:13px 22px; background:var(--ocsa-orange); color:#fff !important; font-weight:900; text-decoration:none; cursor:pointer;
}
.ocsa-primary-button:hover,.ocsa-submit-btn:hover { filter:brightness(.94); }
.ocsa-notice,.ocsa-duplicate-warning { border-radius:12px; padding:16px 18px; margin:0 0 20px; }
.ocsa-notice-success { background:#e8f7ed; color:#14532d; }
.ocsa-notice-error { background:#feeceb; color:#7f1d1d; }
.ocsa-notice-warning,.ocsa-duplicate-warning { background:#fff4dc; color:#6b4200; }
.ocsa-hp { position:absolute !important; left:-10000px !important; width:1px !important; height:1px !important; overflow:hidden !important; }
.description { color:#666; font-size:.92em; }
.ocsa-calendar-intro { font-size:1.08rem; }
.ocsa-month-view { margin:24px 0 34px; }
.ocsa-month-heading { display:flex; align-items:center; justify-content:space-between; background:var(--ocsa-dark); color:#fff; border-radius:16px 16px 0 0; padding:14px 18px; }
.ocsa-month-heading h2 { color:#fff; margin:0; }
.ocsa-month-nav { color:#fff !important; font-size:1.5rem; text-decoration:none; }
.ocsa-calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); border-left:1px solid #ddd; }
.ocsa-calendar-days { background:#efefef; font-weight:800; text-align:center; border-top:1px solid #ddd; }
.ocsa-calendar-days > div { padding:8px; border-right:1px solid #ddd; }
.ocsa-calendar-cell { min-height:110px; padding:8px; background:#fff; border-right:1px solid #ddd; border-bottom:1px solid #ddd; }
.ocsa-calendar-cell.is-empty { background:#fafafa; }
.ocsa-calendar-cell.is-today { box-shadow:inset 0 0 0 2px var(--ocsa-orange); }
.ocsa-calendar-number { font-weight:900; }
.ocsa-calendar-events { display:grid; gap:5px; margin-top:7px; }
.ocsa-calendar-events a { display:block; border-radius:7px; background:#fff0e7; color:#8a3600; padding:5px 6px; font-size:.82rem; text-decoration:none; line-height:1.2; }
.ocsa-upcoming-list h2 { margin-bottom:18px; }
.ocsa-event-cards { display:grid; gap:14px; }
.ocsa-event-card { display:flex; gap:16px; background:#fff; border-radius:16px; padding:18px; box-shadow:0 5px 18px rgba(0,0,0,.07); }
.ocsa-event-date-badge { flex:0 0 66px; height:66px; border-radius:14px; background:var(--ocsa-orange); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; line-height:1; }
.ocsa-event-date-badge strong { font-size:1.6rem; }
.ocsa-event-date-badge span { text-transform:uppercase; font-size:.78rem; font-weight:900; margin-top:5px; }
.ocsa-event-card-content { min-width:0; }
.ocsa-event-card h3 { margin:0 0 6px; }
.ocsa-event-card h3 a { color:#222; text-decoration:none; }
.ocsa-event-meta { color:#555; }
.ocsa-event-link { color:var(--ocsa-orange); font-weight:800; }
.ocsa-public-flyer { max-width:100%; height:auto; border-radius:14px; margin:14px 0; box-shadow:0 5px 18px rgba(0,0,0,.1); }
.ocsa-public-contact { background:var(--ocsa-light); border-radius:14px; padding:16px; margin-top:18px; }
.ocsa-csa-panel { background:#fff; border-radius:16px; padding:16px; }
.ocsa-csa-search { margin-bottom:14px; }
.ocsa-csa-items { display:grid; gap:10px; }
.ocsa-csa-item { border:1px solid #ddd; border-radius:12px; padding:13px; }
.ocsa-csa-item h3 { margin:0 0 4px; }
.ocsa-csa-item pre { white-space:pre-wrap; background:#f7f7f7; border-radius:8px; padding:12px; }
.ocsa-copy-csa { border:0; border-radius:999px; padding:8px 13px; background:var(--ocsa-dark); color:#fff; cursor:pointer; }
@media (max-width:760px) {
    .ocsa-form,.ocsa-public-event-detail { padding:20px; border-radius:16px; }
    .ocsa-grid-2,.ocsa-grid-3 { grid-template-columns:1fr; gap:0; }
    .ocsa-calendar-days { display:none; }
    .ocsa-calendar-grid { grid-template-columns:1fr; border-top:1px solid #ddd; }
    .ocsa-calendar-cell,.ocsa-calendar-cell.is-empty { min-height:0; display:flex; gap:12px; align-items:flex-start; }
    .ocsa-calendar-cell.is-empty { display:none; }
    .ocsa-calendar-number { flex:0 0 26px; }
    .ocsa-calendar-events { margin-top:0; flex:1; }
    .ocsa-event-card { align-items:flex-start; }
}
.ocsa-form-heading { margin:0 0 18px; }
.ocsa-form-heading h2 { margin-bottom:6px; }
.ocsa-calendar-intro-row { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:18px; }
.ocsa-calendar-intro-row .ocsa-calendar-intro { margin:0; }
.ocsa-submit-event-button { flex:0 0 auto; }
.ocsa-calendar-submit-footer,.ocsa-event-submit-prompt { margin-top:26px; padding:20px; border-radius:16px; background:#f5f6f7; text-align:center; }
.ocsa-calendar-submit-footer p,.ocsa-event-submit-prompt p { margin-top:0; }
.ocsa-public-flyer { display:block; margin-left:auto; margin-right:auto; }
@media (max-width:760px) {
    .ocsa-calendar-intro-row { align-items:stretch; flex-direction:column; }
    .ocsa-submit-event-button { width:100%; box-sizing:border-box; }
}

/* v1.0.2: flyer thumbnails on upcoming-event cards. */
.ocsa-event-card.has-image {
    padding: 0;
    overflow: hidden;
    align-items: stretch;
}
.ocsa-event-card-media {
    position: relative;
    flex: 0 0 210px;
    min-height: 170px;
    display: block;
    overflow: hidden;
    background: #eceff1;
    text-decoration: none;
}
.ocsa-event-card-image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 170px;
    object-fit: cover;
    object-position: center;
    transition: transform .2s ease;
}
.ocsa-event-card-media:hover .ocsa-event-card-image {
    transform: scale(1.025);
}
.ocsa-event-card.has-image .ocsa-event-card-content {
    padding: 20px 22px 20px 4px;
    align-self: center;
}
.ocsa-event-date-badge.is-overlay {
    position: absolute;
    top: 12px;
    left: 12px;
    box-shadow: 0 5px 14px rgba(0,0,0,.22);
}
@media (max-width:760px) {
    .ocsa-event-card.has-image {
        display: block;
    }
    .ocsa-event-card-media {
        width: 100%;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }
    .ocsa-event-card-image {
        min-height: 0;
    }
    .ocsa-event-card.has-image .ocsa-event-card-content {
        padding: 18px 20px 20px;
    }
}

/* v1.0.4: additional flyer gallery on event pages. */
.ocsa-public-flyer-gallery { margin:14px 0 20px; }
.ocsa-public-flyer-gallery.has-multiple { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; align-items:start; }
.ocsa-public-flyer-gallery .ocsa-public-flyer { margin:0 auto; width:100%; object-fit:contain; }
.ocsa-public-flyer-link { display:block; text-decoration:none; }
@media (max-width:760px) {
    .ocsa-public-flyer-gallery.has-multiple { grid-template-columns:1fr; }
}


/* v1.0.5 cancelled event presentation */
.ocsa-calendar-events a.is-cancelled { background:#fee2e2; color:#991b1b; border-color:#ef4444; font-weight:800; }
.ocsa-event-card.is-cancelled { border:2px solid #dc2626; background:#fff7f7; }
.ocsa-cancelled-label { display:inline-block; margin:0 0 8px; padding:5px 10px; border-radius:999px; background:#dc2626; color:#fff; font-weight:900; letter-spacing:.04em; }
.ocsa-cancelled-notice { margin:0 0 18px; padding:14px 16px; border:2px solid #dc2626; border-radius:10px; background:#fee2e2; color:#991b1b; text-align:center; font-size:1.05rem; letter-spacing:.03em; }

/* v1.0.6: faster calendar navigation and front-page event cards. */
.ocsa-home-events {
    --ocsa-orange: #f37021;
    --ocsa-dark: #22272d;
    --ocsa-light: #f5f6f7;
    max-width: 980px;
    margin: 0 auto;
    box-sizing: border-box;
}
.ocsa-home-events-footer {
    margin: 20px 0 0;
    text-align: center;
}
.ocsa-month-jump {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 14px;
    background: #f5f6f7;
    border: 1px solid #ddd;
    border-top: 0;
}
.ocsa-month-jump label { font-weight: 800; }
.ocsa-month-jump select,
.ocsa-month-jump button,
.ocsa-month-jump a {
    min-height: 40px;
    border-radius: 8px;
    font: inherit;
}
.ocsa-month-jump select {
    border: 1px solid #c9cdd1;
    background: #fff;
    padding: 7px 34px 7px 10px;
}
.ocsa-month-jump button {
    border: 0;
    padding: 8px 16px;
    background: var(--ocsa-orange);
    color: #fff;
    font-weight: 900;
    cursor: pointer;
}
.ocsa-month-jump a {
    display: inline-flex;
    align-items: center;
    padding: 7px 13px;
    color: var(--ocsa-dark);
    font-weight: 800;
}
.ocsa-month-nav {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 92px;
    font-size: 1rem;
    font-weight: 800;
}
.ocsa-month-nav:last-child { justify-content: flex-end; }
@media (max-width:760px) {
    .ocsa-month-heading { gap: 8px; }
    .ocsa-month-heading h2 { font-size: 1.25rem; text-align: center; }
    .ocsa-month-nav { min-width: auto; font-size: 1.25rem; }
    .ocsa-month-nav span { display: none; }
    .ocsa-month-jump { justify-content: stretch; }
    .ocsa-month-jump label { width: 100%; text-align: center; }
    .ocsa-month-jump select { flex: 1 1 120px; }
}
