.calendar-hero {position: relative;overflow: hidden;background-color: var(--color-accent-black);color: var(--color-text-on-dark);} .calendar-hero-media {position: absolute;inset: 0;z-index: 0;} .calendar-hero-media img {width: 100%;height: 100%;object-fit: cover;filter: saturate(1.15) contrast(1.05) brightness(0.85);} .calendar-hero-inner {position: relative;z-index: 1;max-width: 640px;padding-top: var(--space-16);padding-bottom: var(--space-16);} .calendar-hero-title {margin-top: var(--space-4);margin-bottom: var(--space-4);} .calendar-hero-lead {color: var(--color-text-on-dark);opacity: 0.9;margin-bottom: var(--space-6);} .calendar-hero-actions {display: flex;flex-wrap: wrap;gap: var(--space-3);margin-bottom: var(--space-6);} .calendar-hero-meta {display: grid;grid-template-columns: minmax(0,1fr);gap: var(--space-4);font-size: var(--text-sm);color: rgba(249,250,252,0.9);} .calendar-hero-meta dt {font-weight: 600;text-transform: uppercase;letter-spacing: 0.08em;font-size: var(--text-xs);margin-bottom: 4px;color: rgba(249,250,252,0.75);} @media (min-width: 768px) {.calendar-hero-meta {grid-template-columns: repeat(2,minmax(0,1fr));}} .calendar-section-header {display: flex;flex-direction: column;gap: var(--space-4);margin-bottom: var(--space-8);} @media (min-width: 1024px) {.calendar-section-header {flex-direction: row;align-items: flex-end;justify-content: space-between;}} .calendar-monthly {background-color: var(--color-background);} .calendar-filter-summary {min-width: 220px;} .calendar-filter-select-wrapper {position: relative;} .calendar-filter-select {appearance: none;-webkit-appearance: none;-moz-appearance: none;padding-right: 32px;background-image: linear-gradient(45deg,transparent 50%, var(--gray-500) 50%),linear-gradient(135deg,var(--gray-500) 50%,transparent 50%);background-position: calc(100% - 18px) 17px, calc(100% - 12px) 17px;background-size: 6px 6px,6px 6px;background-repeat: no-repeat;} .calendar-grid {border-radius: var(--radius-xl);background-color: var(--color-surface);box-shadow: var(--shadow-soft);overflow: hidden;margin-bottom: var(--space-4);} .calendar-grid-header {display: grid;grid-template-columns: repeat(7,minmax(0,1fr));background: radial-gradient(circle at top, rgba(15,23,42,0.45), rgba(5,6,10,0.95));color: var(--color-text-on-dark);font-size: var(--text-xs);letter-spacing: 0.12em;text-transform: uppercase;padding: 10px 12px;gap: 2px;} .calendar-grid-header span {text-align: center;opacity: 0.85;} .calendar-grid-body {display: grid;grid-template-columns: repeat(7,minmax(0,1fr));gap: 2px;padding: 4px;background-color: var(--gray-100);} .calendar-day {position: relative;display: flex;flex-direction: column;align-items: flex-start;justify-content: flex-start;padding: 8px;border-radius: var(--radius-sm);background-color: var(--color-surface);cursor: default;min-height: 110px;text-align: left;transition: transform var(--transition-fast),box-shadow var(--transition-normal),background-color var(--transition-normal);} .calendar-day:hover {transform: translateY(-1px);box-shadow: var(--shadow-soft);background-color: #fdfcfb;} .calendar-day.is-empty {background-color: transparent;box-shadow: none;pointer-events: none;} .calendar-day-number {font-weight: 600;font-size: var(--text-sm);margin-bottom: 4px;color: var(--gray-700);} .calendar-day-tag {margin-bottom: 4px;font-size: var(--text-xs);} .calendar-day-title {font-size: var(--text-sm);font-weight: 500;margin-bottom: 2px;color: var(--color-accent-black);} .calendar-day-meta {font-size: var(--text-xs);color: var(--color-text-muted);} .calendar-legend {margin-top: var(--space-4);} @media (max-width: 767.98px) {.calendar-grid-header {display: none;} .calendar-grid-body {grid-template-columns: minmax(0,1fr);} .calendar-day {min-height: 0;} .calendar-day-number {margin-bottom: 2px;}} .calendar-featured-grid {gap: var(--space-8);align-items: center;} .calendar-featured-media img {border-radius: var(--radius-xl);box-shadow: var(--shadow-elevated);} .calendar-featured-list {display: flex;flex-direction: column;gap: var(--space-6);margin-top: var(--space-4);} .calendar-featured-card {padding: var(--space-5);} .calendar-featured-details {margin: var(--space-3) 0; padding-left: 18px;font-size: var(--text-sm);color: var(--color-text-muted);} .calendar-featured-details li {margin-bottom: 4px;list-style: disc;} .calendar-category-grid {margin-top: var(--space-8);gap: var(--space-6);} .calendar-category-card h3 {margin-bottom: var(--space-3);} .calendar-category-list {margin-bottom: var(--space-4);padding-left: 18px;font-size: var(--text-sm);color: var(--color-text-muted);} .calendar-category-list li {margin-bottom: 4px;list-style: disc;} .calendar-category-actions {display: flex;flex-wrap: wrap;gap: var(--space-3);margin-top: var(--space-2);} .calendar-programs-grid {gap: var(--space-8);} .calendar-program-list {display: flex;flex-direction: column;gap: var(--space-5);margin-top: var(--space-4);} .calendar-program-item h3 {margin-bottom: 4px;} .calendar-program-item p {margin-bottom: 6px;} .calendar-program-item ul {padding-left: 18px;font-size: var(--text-sm);color: var(--color-text-muted);} .calendar-program-item li {margin-bottom: 4px;list-style: disc;} .calendar-aside {display: flex;align-items: stretch;} .calendar-aside-card {width: 100%;} .calendar-steps {margin-top: var(--space-3);margin-bottom: var(--space-4);padding-left: 18px;font-size: var(--text-sm);color: var(--color-text-muted);} .calendar-steps li {margin-bottom: 6px;list-style: decimal;} .calendar-aside-note {margin-top: var(--space-3);font-size: var(--text-sm);color: var(--color-text-muted);} .calendar-community-grid {gap: var(--space-8);align-items: center;} .calendar-community-media img {border-radius: var(--radius-xl);box-shadow: var(--shadow-elevated);} .calendar-community-list {margin: var(--space-3) 0 var(--space-3);padding-left: 18px;font-size: var(--text-sm);color: var(--color-text-muted);} .calendar-community-list li {margin-bottom: 4px;list-style: disc;} .calendar-filters {background-color: var(--color-surface);} .calendar-filter-form {border-radius: var(--radius-xl);box-shadow: var(--shadow-soft);background-color: var(--color-surface);padding: var(--space-6);margin-top: var(--space-4);} .calendar-filter-row {display: grid;grid-template-columns: repeat(3,minmax(0,1fr));gap: var(--space-4);margin-bottom: var(--space-4);} @media (max-width: 1023.98px) {.calendar-filter-row {grid-template-columns: minmax(0,1fr);}} .calendar-filter-field label {margin-bottom: 6px;} .calendar-filter-actions {display: flex;flex-wrap: wrap;gap: var(--space-3);align-items: center;} .calendar-filter-note {margin-top: var(--space-3);font-size: var(--text-sm);} .calendar-reminders-grid {gap: var(--space-8);align-items: flex-start;} .calendar-reminders-list {margin-top: var(--space-3);padding-left: 18px;font-size: var(--text-sm);color: var(--color-text-muted);} .calendar-reminders-list li {margin-bottom: 6px;list-style: disc;} .calendar-reminders-aside .calendar-aside-card {height: 100%;display: flex;flex-direction: column;gap: var(--space-3);} @media (max-width: 767.98px) {.calendar-hero-inner {padding-top: var(--space-12);padding-bottom: var(--space-12);} .calendar-featured-grid,.calendar-programs-grid,.calendar-community-grid,.calendar-reminders-grid {grid-template-columns: minmax(0,1fr);} }
