/**
 * Public Styles for GALA Events
 * Enhanced with design tokens, animations, and unified styling
 */

/* ==========================================================================
    Design Tokens (CSS Variables)
    ========================================================================== */

:root {
    --gala-radius-pill: 500px;
    --gala-radius-md: 16px;
    --gala-tint: color-mix(in srgb, var(--gala-highlight), black 90%);
    --gala-glass-deep: rgba(0, 0, 0, 0.4);

    /* Highlight-Derived Neutrals */
    --gala-highlight-soft: rgba(var(--gala-highlight-rgb), 0.05);
    --gala-highlight-dark: color-mix(in srgb, var(--gala-highlight), black 85%);
    --gala-highlight-deep: color-mix(in srgb, var(--gala-highlight), black 96%);

    /* Neumorphism (Soft UI) */
    --gala-neu-light: -8px -8px 16px #ffffff, 8px 8px 16px #d1d9e6;
    --gala-neu-pressed: inset 6px 6px 12px #d1d9e6, inset -6px -6px 12px #ffffff;
}

/* PILL BUTTON STANDARDIZATION */
.gala-btn-premium {
    border-radius: var(--gala-radius-pill) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.4s var(--gala-ease-out-expo);
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    border: none;
    text-decoration: none;
    white-space: nowrap;
}

.gala-btn-lift:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(var(--gala-highlight-rgb), 0.4) !important;
}

/* NAVIGATION SLIDER STYLES */
.gala-nav-card:hover {
    transform: translateX(10px) !important;
    border-color: var(--gala-highlight) !important;
    background: #fdfdfd !important;
}

/* LAYOUT SPECIFIC FIXES */
.gala-split-layout {
    overflow-x: hidden;
}

.gala-split-story {
    /* Content flows naturally with page scroll */
}

.gala-split-sidebar {
    /* Sticky sidebar - follows page scroll naturally */
}

.gala-atc-dropdown {
    border-radius: 20px !important;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.15) !important;
}

.gala-atc-dropdown a {
    transition: all 0.2s ease;
}

.gala-atc-dropdown a:hover {
    background: #f8fafc !important;
    color: var(--gala-highlight) !important;
}

/* DISCOVERY NAVIGATION */
.gala-discovery-nav {
    margin-top: 100px;
    padding-top: 80px;
    border-top: 1px solid var(--gala-highlight-soft);
}

.gala-nav-card {
    transition: all 0.5s var(--gala-ease-out-expo) !important;
    background: white;
    border: 1px solid rgba(var(--gala-highlight-rgb), 0.05) !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.03) !important;
}

.gala-nav-card:hover {
    transform: translateY(-10px) scale(1.02) !important;
    box-shadow: 0 30px 60px rgba(var(--gala-highlight-rgb), 0.12) !important;
    border-color: var(--gala-highlight) !important;
}

.gala-nav-label {
    font-size: 0.65rem;
    font-weight: 900;
    color: var(--gala-highlight);
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 8px;
    display: block;
}

/* --- UNIFIED BUTTON SYSTEM --- */
.gala-btn-premium,
.gala-btn-pill {
    font-family: var(--gala-font-body), -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-weight: 800 !important;
    font-size: 0.9rem;
    text-decoration: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--gala-radius-pill) !important;
    cursor: pointer;
    transition: all 0.3s var(--gala-ease-out-expo);
}

.gala-btn-lift {
    transition: transform 0.3s var(--gala-ease-out-back), box-shadow 0.3s var(--gala-ease-out-expo);
}

.gala-btn-lift:hover {
    transform: translateY(-3px);
}

.add-to-calendar-btn,
.gala-add-to-calendar-btn {
    font-family: var(--gala-font-body), -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* Dropdown hover states */
.gala-atc-dropdown a {
    font-family: var(--gala-font-body), -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    transition: background 0.2s, color 0.2s;
}

.gala-atc-dropdown a:hover {
    background: rgba(var(--gala-highlight-rgb), 0.08) !important;
    color: var(--gala-highlight) !important;
}

/* --- UTILITY COMPONENTS --- */

.gala-glass-panel {
    background: var(--gala-glass-bg);
    backdrop-filter: blur(var(--gala-glass-blur)) saturate(180%);
    -webkit-backdrop-filter: blur(var(--gala-glass-blur)) saturate(180%);
    border: 1px solid var(--gala-glass-border);
    box-shadow: var(--gala-shadow-glass);
}

.gala-neu-flat {
    background: var(--gala-bg-light);
    box-shadow: var(--gala-neu-light);
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.gala-neu-pressed {
    background: var(--gala-bg-light);
    box-shadow: var(--gala-neu-pressed);
}

.gala-bento-tile {
    padding: 30px;
    border-radius: 24px;
    background: white;
    box-shadow: var(--gala-shadow-md);
    transition: all 0.4s var(--gala-ease-out-back);
}

.gala-bento-tile:hover {
    transform: scale(1.02) translateY(-5px);
    box-shadow: var(--gala-shadow-lg);
}

.gala-max-border {
    border: 4px solid #000;
    box-shadow: 10px 10px 0 #000;
    transition: all 0.2s var(--gala-ease-out-expo);
}

.gala-max-border:hover {
    transform: translate(-4px, -4px);
    box-shadow: 14px 14px 0 var(--gala-highlight);
}

.gala-display-title {
    font-family: var(--gala-font-display);
    font-weight: 900;
    letter-spacing: -0.04em;
    line-height: 1.1;
}

.gala-meta-label {
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: var(--gala-text-muted);
}


/* ==========================================================================
    General Styles
    ========================================================================== */

.gala-events-no-results {
    text-align: center;
    padding: 40px 20px;
    font-size: 16px;
    color: var(--gala-text-muted);
}

/* ==========================================================================
    Full-Bleed Hero Banners
    ========================================================================== */

.gala-hero-banner,
.gala-default-hero,
.gala-split-hero {
    width: 100vw;
    max-width: none !important;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background-position: center center;
    background-size: cover;
    display: block;
    position: relative;
    z-index: 1;
}

.gala-default-hero,
.gala-split-hero {
    height: 60vh;
    min-height: 400px;
}

@media (max-width: 768px) {

    .gala-default-hero,
    .gala-split-hero {
        height: 50vh;
        min-height: 300px;
    }
}

/* ==========================================================================
    Unified Countdown Timer Styles
    ========================================================================== */

.gala-countdown-timer {
    display: flex;
    justify-content: center;
    gap: var(--gala-spacing-lg);
    flex-wrap: wrap;
}

.gala-countdown-banner {
    transition: all 0.3s var(--gala-ease-out-expo);
    width: 100%;
    box-sizing: border-box;
}

.gala-countdown-banner [data-unit] {
    line-height: 1;
}

@media (max-width: 400px) {
    .gala-countdown-banner div {
        gap: 8px !important;
    }

    .gala-countdown-banner span[data-unit] {
        font-size: 1.2rem !important;
    }
}

.gala-countdown-seg {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
}

.gala-countdown-seg .val {
    line-height: 1;
    margin-bottom: 5px;
}

.gala-atc-dropdown {
    display: none;
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.3s var(--gala-ease-out-back);
    pointer-events: none;
}

.gala-add-to-calendar-wrapper.active .gala-atc-dropdown {
    display: block !important;
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.gala-countdown-item {
    text-align: center;
}

.gala-countdown-number {
    display: block;
    font-weight: 900;
    font-size: 3.5rem;
    line-height: 1;
    margin-bottom: var(--gala-spacing-base);
    transition: all var(--gala-transition-fast);
    letter-spacing: -2px;
}

.gala-countdown-label {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: var(--gala-font-weight-bold);
}

.gala-countdown-ended {
    padding: var(--gala-spacing-xl);
    text-align: center;
    font-size: 1.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 2px;
}

/* ==========================================================================
    Unified Button Styles
    ========================================================================== */

.gala-event-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--gala-spacing-sm);
    padding: 14px 32px;
    font-weight: var(--gala-font-weight-bold);
    text-decoration: none;
    border-radius: var(--gala-radius-md);
    transition: all var(--gala-transition-base);
    cursor: pointer;
    border: none;
    font-size: var(--gala-meta-md);
}

.gala-event-button:hover {
    transform: translateY(-2px);
}

.gala-btn-solid {
    color: var(--gala-white) !important;
}

.gala-btn-solid:hover {
    box-shadow: var(--gala-shadow-heavy);
}

.gala-btn-outline {
    border: 2px solid;
    background: transparent;
}

.gala-btn-pill {
    border-radius: var(--gala-radius-pill);
}

/* ==========================================================================
    Unified Detail Item Styles
    ========================================================================== */

.gala-detail-item {
    display: flex;
    gap: var(--gala-spacing-base);
    margin-bottom: var(--gala-spacing-lg);
    align-items: flex-start;
}

.gala-detail-item:last-child {
    margin-bottom: 0;
}

.gala-detail-item svg {
    flex-shrink: 0;
    transition: color var(--gala-transition-base);
}

.gala-detail-item:hover svg {
    transform: scale(1.15);
}

.gala-detail-item strong {
    font-weight: var(--gala-font-weight-bold);
    color: var(--gala-text-dark);
}

.gala-detail-item span {
    transition: color var(--gala-transition-base);
}

.gala-detail-item a {
    color: inherit;
    text-decoration: none;
    transition: color var(--gala-transition-base);
}

.gala-detail-item a:hover {
    text-decoration: underline;
}

/* ==========================================================================
    Sidebar & Card Styling
    ========================================================================== */

.gala-sidebar-widget {
    transition: all var(--gala-transition-base);
}

.gala-sidebar-widget:hover {
    box-shadow: var(--gala-shadow-medium) !important;
}

.gala-sidebar-taxonomy {
    background: var(--gala-white);
    padding: var(--gala-spacing-lg);
    border-radius: var(--gala-radius-lg);
    box-shadow: var(--gala-shadow-subtle);
}

.gala-sidebar-taxonomy a {
    display: inline-block;
    padding: var(--gala-spacing-sm) var(--gala-spacing-base);
    margin-right: var(--gala-spacing-sm);
    margin-bottom: var(--gala-spacing-sm);
    background: var(--gala-bg-light);
    border-radius: var(--gala-radius-md);
    color: var(--gala-text-dark);
    text-decoration: none;
    font-size: var(--gala-meta-sm);
    font-weight: var(--gala-font-weight-semibold);
    transition: all var(--gala-transition-base);
}

.gala-sidebar-taxonomy a:hover {
    background: var(--gala-bg-lighter);
    transform: translateY(-2px);
}

/* ==========================================================================
    Grid Layout
    ========================================================================== */

.gala-events-grid {
    display: grid;
    gap: 30px;
    margin: 30px 0;
}

.gala-events-grid.gala-events-grid-2-columns {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

.gala-events-grid.gala-events-grid-3-columns {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.gala-events-grid.gala-events-grid-4-columns {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

@media (max-width: 768px) {
    .gala-events-grid {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }
}

/* ========================================================================== 
    Gala Card Wide Layout
   ========================================================================== */

.gala-events-gala-card-wide {
    display: flex;
    flex-direction: column;
    gap: 18px;
    margin: 30px 0;
}

.gala-card-wide-card {
    display: flex;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e5e5e5;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    position: relative;
}

.gala-card-wide-date {
    width: 92px;
    background: #f5f8fb;
    border-right: 1px solid #e0e0e0;
    padding: 12px 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.gala-card-wide-date-day {
    font-size: 32px;
    font-weight: 700;
    color: #0f4c81;
}

.gala-card-wide-date-month,
.gala-card-wide-date-year {
    font-size: 12px;
    color: #55606b;
    text-transform: uppercase;
}

.gala-card-wide-image {
    width: 210px;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
}

.gala-card-wide-image.left {
    order: 1;
}

.gala-card-wide-image.right {
    order: 3;
}

.gala-card-wide-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gala-card-wide-details {
    flex: 1;
    padding: 22px 24px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.gala-card-wide-title {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
}

/* Additional styling to match Gala Card Wide screenshot */
.gala-card-wide-card {
    align-items: center;
    gap: 18px;
}

.gala-card-wide-date {
    text-align: center;
    background: #ffffff;
    /* keep highlight color on left */
}

.gala-card-wide-details {
    padding: 24px 30px;
}

.gala-card-wide-image img {
    display: block;
    object-fit: cover;
}

.gala-card-wide-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    font-size: 14px;
    color: #4d4d4d;
}

/* Card layout Add-to-Calendar */
.gala-card-details-box .gala-card-add-to-calendar .add-to-calendar {
    text-align: left;
}

.gala-card-details-box .gala-card-add-to-calendar .add-to-calendar-menu {
    min-width: 200px;
}

.gala-card-wide-meta svg {
    margin-right: 6px;
    vertical-align: middle;
}

.gala-card-wide-description {
    margin: 0;
    color: #4a4a4a;
    line-height: 1.6;
}

.gala-card-wide-status-badge {
    position: absolute;
    top: 16px;
    right: 16px;
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
}

.gala-card-wide-status-badge.upcoming {
    background: #4caf50;
}

.gala-card-wide-status-badge.current {
    background: #2196f3;
}

.gala-card-wide-status-badge.past {
    background: #f44336;
}

@media (max-width: 960px) {
    .gala-card-wide-card {
        flex-direction: column;
    }

    .gala-card-wide-image {
        width: 100%;
        order: 2;
        height: 220px;
    }
}

/* ==========================================================================
   Timeline Layout
   ========================================================================== */

.gala-events-timeline {
    position: relative;
    padding: 20px 0;
    margin: 30px 0;
}

.gala-events-timeline::before {
    content: '';
    position: absolute;
    left: 40px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: linear-gradient(to bottom, #0073aa 0%, #0073aa 100%);
}

.gala-timeline-item {
    position: relative;
    padding-left: 80px;
    margin-bottom: 30px;
}

.gala-timeline-item::before {
    content: '';
    position: absolute;
    left: 33px;
    top: 8px;
    width: 16px;
    height: 16px;
    background: #0073aa;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.gala-timeline-item:hover::before {
    background: #005177;
    transform: scale(1.2);
    transition: all 0.3s ease;
}

.gala-timeline-item .gala-event-list-inner {
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.3s ease;
}

.gala-timeline-item:hover .gala-event-list-inner {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

@media (max-width: 768px) {
    .gala-events-timeline::before {
        left: 20px;
    }

    .gala-timeline-item {
        padding-left: 50px;
    }

    .gala-timeline-item::before {
        left: 13px;
    }
}

/* ==========================================================================
   Event Card
   ========================================================================== */

.gala-event-card {
    background: transparent;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.3s ease;
    height: 100%;
}

.gala-event-card:hover {
    transform: translateY(-3px);
}

.gala-event-card-inner {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}

.gala-event-card:hover .gala-event-card-inner {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.gala-event-image {
    position: relative;
    overflow: hidden;
    background: #f5f5f5;
}

.gala-event-card-inner.gala-event-image-left {
    flex-direction: row;
    align-items: stretch;
}

.gala-event-card-inner.gala-event-image-left .gala-event-image {
    width: 36%;
    flex-shrink: 0;
}

.gala-event-card-inner.gala-event-image-left .gala-event-image.right {
    order: 2;
}

.gala-event-card-inner.gala-event-image-left .gala-event-content {
    width: 64%;
}

.gala-event-image img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease;
}

.gala-event-card:hover .gala-event-image img {
    transform: scale(1.05);
}

.gala-event-content {
    padding: 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.gala-event-title {
    margin: 0 0 16px;
    font-size: 24px;
    line-height: 1.3;
    font-weight: 600;
}

.gala-event-title a {
    color: #1a1a1a;
    text-decoration: none;
    transition: color 0.2s ease;
}

.gala-event-title a:hover {
    color: #0073aa;
}

.gala-event-datetime,
.gala-event-location,
.gala-event-cost {
    display: flex;
    align-items: center;
    gap: 8px;

    .gala-countdown-horizontal {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;
    }

    margin-bottom: 12px;
    font-size: 14px;
    color: #555;
}

.gala-event-datetime {
    background: transparent;
    /* transparent to avoid boxed backgrounds on single pages */
    padding: 12px 16px;
    border-radius: 6px;
    margin-bottom: 16px;
    border-left: 3px solid #0073aa;
}

.gala-event-location {
    padding: 8px 0;
}

.gala-event-cost {
    padding: 8px 12px;
    background: #e8f5e9;
    border-radius: 4px;
    font-weight: 600;
    color: #2e7d32;
}

/* Next Event Card (single-page support) */
.gala-next-event-card {
    margin: 40px 0 0;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    border: 1px solid #e8e8e8;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
}

.gala-next-event-link {
    display: flex;
    align-items: stretch;
    text-decoration: none;
    color: inherit;
}

.gala-next-event-image {
    width: 180px;
    flex-shrink: 0;
    overflow: hidden;
}

.gala-next-event-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gala-next-event-body {
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.gala-next-event-label {
    text-transform: uppercase;
    font-size: 12px;
    color: #888;
    font-weight: 700;
}

.gala-next-event-title {
    margin: 0;
    font-size: 18px;
    line-height: 1.2;
}

.gala-next-event-meta {
    font-size: 14px;
    color: #666;
}

/* Next Event variants — integrate into layout-specific spots */
.gala-next-event-wrapper {
    display: block;
    margin: 30px 0;
}

.gala-next-event-wrapper.gala-next-event-minimal .gala-next-event-image {
    display: none;
}

.gala-next-event-wrapper.gala-next-event-minimal .gala-next-event-body {
    padding: 10px 12px;
}

.gala-next-event-wrapper.gala-next-event-minimal .gala-next-event-title {
    font-size: 16px
}

.gala-next-event-wrapper.gala-next-event-magazine .gala-next-event-card {
    background: transparent;
    border: none;
    box-shadow: none;
}

.gala-next-event-wrapper.gala-next-event-magazine .gala-next-event-title {
    color: #0073aa
}

.gala-next-event-wrapper.gala-next-event-card .gala-next-event-card {
    margin: 0;
}

.gala-next-event-wrapper.gala-next-event-card .gala-next-event-image {
    width: 100%;
    height: 120px;
}

.gala-next-event-wrapper.gala-next-event-split .gala-next-event-card {
    margin-bottom: 20px;
}

.gala-next-event-wrapper.gala-next-event-hero .gala-next-event-card {
    margin: 0 0 40px 0;
    border-radius: 8px;
}

.gala-next-event-wrapper.gala-next-event-default .gala-next-event-card {
    max-width: 800px;
    margin: 40px auto 0;
}

.gala-next-event-wrapper.gala-next-event-minimal {
    max-width: 680px;
    margin: 20px auto;
}

.gala-next-event-wrapper.gala-next-event-minimal .gala-next-event-card {
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
}

.gala-next-event-wrapper.gala-next-event-magazine {
    max-width: 620px;
    margin: 20px 0;
}

.gala-next-event-wrapper.gala-next-event-magazine .gala-next-event-card {
    border-radius: 6px;
    padding: 12px;
    background: #fff;
}

.gala-next-event-wrapper.gala-next-event-split .gala-next-event-card {
    width: 100%;
}

.gala-next-event-wrapper.gala-next-event-sidebar {
    margin-top: 22px;
}

.gala-next-event-wrapper.gala-next-event-sidebar .gala-next-event-card {
    box-shadow: none;
    border: 1px solid #e9e9e9;
}

/* Ensure Next Event bypasses grid/column containers and stays single */
.gala-next-event-card {
    display: block;
    max-width: 100%;
    grid-column: 1 / -1;
}

/* ==========================================================================
   Single event - sidebar layout fallback
   Provide a simple two-column layout if theme does not supply one.
   ========================================================================== */
@media (min-width: 992px) {
    .gala-single-event-wrapper {
        width: calc(100% - 340px);
        float: left;
        box-sizing: border-box;
    }

    .gala-event-sidebar {
        width: 320px;
        float: right;
        box-sizing: border-box;
    }
}

@media (max-width: 991px) {
    .gala-event-sidebar {
        width: 100%;
        float: none;
        margin-top: 24px;
    }

    .gala-single-event-wrapper {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .gala-next-event-link {
        flex-direction: column;
    }

    .gala-next-event-image {
        width: 100%;
        height: 180px;
    }
}

.gala-event-datetime svg,
.gala-event-location svg,
.gala-event-cost svg {
    flex-shrink: 0;
    opacity: 0.8;
}

.gala-event-date,
.gala-event-time {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: 16px;
    font-weight: 500;
}

.gala-event-excerpt {
    margin: 16px 0 20px;
    font-size: 14px;
    line-height: 1.7;
    color: #555;
    flex: 1;
}

.gala-event-link {
    display: inline-flex;
    align-items: center;
    padding: 10px 20px;
    background: #0073aa;
    color: #fff !important;
    text-decoration: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    transition: background 0.2s ease;
    align-self: flex-start;
    margin-top: auto;
}

.gala-event-link:hover {
    background: #005177;
}

/* ==========================================================================
   List Layout
   ========================================================================== */

.gala-events-list {
    margin: 30px 0;
}

.gala-events-list.gala-events-columns-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.gala-events-list.gala-events-columns-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

@media (max-width: 992px) {
    .gala-events-list.gala-events-columns-3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {

    .gala-events-list.gala-events-columns-2,
    .gala-events-list.gala-events-columns-3 {
        grid-template-columns: 1fr;
    }
}

.gala-event-list-item {
    background: #fff;
    border-radius: 12px;
    margin-bottom: 24px;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.gala-event-list-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 115, 170, 0.2);
}

.gala-event-list-inner {
    display: flex;
    gap: 0;
    align-items: stretch;
    height: 100%;
}

.gala-event-list-image {
    flex-shrink: 0;
    width: 200px;
    overflow: hidden;
    background: #f5f5f5;
}

.gala-event-list-image.right {
    order: 3;
}

.gala-event-list-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.gala-event-list-item:hover .gala-event-list-image img {
    transform: scale(1.05);
}

.gala-event-list-date {
    flex-shrink: 0;
    width: 90px;
    text-align: center;
    padding: 24px 12px;
    background: #0073aa;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.gala-event-list-content {
    flex: 1;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: inherit;
}

.gala-event-list-details {
    flex: 1;
}

.gala-event-list-title {
    margin: 0 0 10px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}

.gala-event-list-title a {
    color: #333;
    text-decoration: none;
}

.gala-event-list-title a:hover {
    color: #0073aa;
}

.gala-event-list-location {
    font-size: 14px;
    color: #666;
    margin-bottom: 10px;
}

.gala-event-list-excerpt {
    font-size: 14px;
    line-height: 1.6;
    color: #555;
}

@media (max-width: 768px) {
    .gala-event-list-inner {
        flex-direction: column;
    }

    .gala-event-list-image {
        width: 100%;
        height: 200px;
    }

    .gala-event-list-date {
        width: 100%;
        padding: 15px;
    }

    .gala-event-list-content {
        padding: 20px;
    }
}

/* ==========================================================================
   Masonry Layout
   ========================================================================== */

.gala-events-masonry {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    margin: 30px 0;
}

.gala-events-masonry.gala-events-columns-2 .gala-event-masonry-item {
    width: calc(50% - 15px);
}

.gala-events-masonry.gala-events-columns-3 .gala-event-masonry-item {
    width: calc(33.333% - 20px);
}

.gala-events-masonry.gala-events-columns-4 .gala-event-masonry-item {
    width: calc(25% - 22.5px);
}

.gala-event-masonry-item {
    break-inside: avoid;
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .gala-events-masonry .gala-event-masonry-item {
        width: 100% !important;
    }
}

/* ==========================================================================
   Carousel Layout
   ========================================================================== */

.gala-events-carousel {
    position: relative;
    margin: 30px 0;
    overflow: hidden;
}

/* Carousel */
.gala-events-carousel {
    position: relative;
    max-width: 1200px;
    margin: 0 auto;
    overflow: hidden;
}

.gala-carousel-container {
    display: flex;
    transition: transform 0.5s ease;
}

.gala-carousel-slide {
    min-width: 100%;
    padding: 0 10px;
}

.gala-carousel-slide .gala-event-card {
    max-width: 800px;
    margin: 0 auto;
}

.gala-carousel-prev,
.gala-carousel-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
    border: none;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s ease;
    z-index: 10;
}

.gala-carousel-prev:hover,
.gala-carousel-next:hover {
    background: rgba(0, 0, 0, 0.8);
}

.gala-carousel-prev {
    left: 20px;
}

.gala-carousel-next {
    right: 20px;
}

.gala-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 20px;
}

.gala-carousel-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid #0073aa;
    background: transparent;
    cursor: pointer;
    padding: 0;
    transition: background 0.3s ease;
}

.gala-carousel-dot.active,
.gala-carousel-dot:hover {
    background: #0073aa;
}

/* ==========================================================================
   Calendar View
   ========================================================================== */

.gala-events-calendar {
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    padding: 20px;
    margin: 30px 0;
}

.gala-calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 2px solid #e5e5e5;
}

.gala-calendar-title {
    margin: 0;
    font-size: 24px;
    color: #333;
}

.gala-calendar-nav {
    background: #0073aa;
    color: #fff;
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 20px;
    transition: background 0.2s ease;
}

.gala-calendar-nav:hover {
    background: #005177;
}

.gala-calendar-grid {
    width: 100%;
}

/* Calendar styles: default, compact, large - DISTINCT visual variants */
.gala-calendar-style-default .gala-calendar-days .gala-calendar-day {
    padding: 12px;
    font-size: 14px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 115, 170, 0.08);
    border: 1px solid #e3f2fd;
}

.gala-calendar-style-compact .gala-calendar-days .gala-calendar-day {
    padding: 4px 6px;
    font-size: 11px;
    background: #fafafa;
    border: 1px solid #e0e0e0;
    box-shadow: none;
    border-radius: 4px;
}

.gala-calendar-style-large .gala-calendar-days .gala-calendar-day {
    padding: 20px;
    font-size: 18px;
    background: linear-gradient(135deg, #e3f2fd 0%, #ffffff 100%);
    border: 2px solid #90caf9;
    box-shadow: 0 4px 16px rgba(33, 150, 243, 0.15);
    border-radius: 12px;
}

/* Per-style header and accent tweaks */
.gala-calendar-style-default .gala-calendar-title {
    color: #1976d2;
    background: transparent;
    padding: 8px 10px;
    font-size: 20px;
    font-weight: 600;
}

.gala-calendar-style-compact .gala-calendar-title {
    color: #424242;
    font-weight: 500;
    font-size: 16px;
    padding: 6px 10px;
    background: #f5f5f5;
    border-radius: 4px;
}

.gala-calendar-style-large .gala-calendar-title {
    color: #0d47a1;
    font-weight: 700;
    font-size: 28px;
    padding: 12px 20px;
    background: linear-gradient(90deg, #bbdefb, #e3f2fd);
    border-radius: 12px;
    border: 2px solid #90caf9;
    box-shadow: 0 2px 8px rgba(33, 150, 243, 0.2);
}

/* Calendar hover preview */
.gala-calendar-hover-preview .gala-calendar-day {
    position: relative;
    overflow: visible;
}

.gala-calendar-hover-preview .gala-calendar-events {
    position: static;
}

.gala-calendar-event {
    position: relative;
    display: block;
    z-index: 1;
}

.gala-calendar-event-preview {
    display: none;
    position: fixed;
    z-index: 99999;
    width: 320px;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    padding: 14px;
    border-radius: 8px;
    pointer-events: none;
}

/* Show preview when hovering over the event */
.gala-calendar-hover-preview .gala-calendar-event:hover+.gala-calendar-event-preview,
.gala-calendar-event-preview.active {
    display: block !important;
    pointer-events: auto;
}

.gala-calendar-event-preview-image {
    width: 100%;
    height: 160px;
    overflow: hidden;
    border-radius: 4px;
    margin-bottom: 10px;
}

.gala-calendar-event-preview-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gala-calendar-event-preview-title {
    font-size: 16px;
    margin: 0 0 6px 0;
    font-weight: 600;
}

.gala-calendar-event-preview-meta {
    font-size: 13px;
    color: #666;
    margin-bottom: 8px;
}

.gala-calendar-event-preview-meta span {
    display: block;
    margin-bottom: 3px;
}

.gala-calendar-event-preview-excerpt {
    margin: 0;
    font-size: 13px;
    color: #444;
    line-height: 1.4;
}

/* Calendar list view */
.gala-calendar-list {
    margin-top: 20px;
}

.gala-calendar-list-item {
    display: flex;
    gap: 20px;
    border-bottom: 1px solid #eee;
    padding: 16px 0;
    transition: background 0.2s ease;
    position: relative;
}

.gala-calendar-list-item:hover {
    background: #f9f9f9;
}

.gala-calendar-list-item-image {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
    overflow: hidden;
    border-radius: 6px;
}

.gala-calendar-list-item-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gala-calendar-list-item-content {
    flex: 1;
}

.gala-calendar-list-item h3 {
    margin: 0 0 8px 0;
    font-size: 22px;
    line-height: 1.3;
}

.gala-calendar-list-item h3 a {
    color: #0073aa;
    text-decoration: none;
    transition: color 0.2s ease;
}

.gala-calendar-list-item h3 a:hover {
    color: #005177;
}

.gala-calendar-list-item-meta {
    font-size: 14px;
    color: #666;
    margin-bottom: 8px;
}

.gala-calendar-list-item p {
    margin: 0;
    color: #444;
    font-size: 15px;
    line-height: 1.5;
}

/* Default list style */
.gala-calendar-style-default .gala-calendar-list-item {
    padding: 18px 0;
}

.gala-calendar-style-default .gala-calendar-list-item h3 {
    font-size: 22px;
}

.gala-calendar-style-default .gala-calendar-list-item-meta {
    font-size: 14px;
}

.gala-calendar-style-default .gala-calendar-list-item p {
    font-size: 15px;
}

.gala-calendar-style-default .gala-calendar-list-item-image {
    width: 120px;
    height: 120px;
}

/* Compact list style */
.gala-calendar-style-compact .gala-calendar-list-item {
    padding: 12px 0;
    gap: 12px;
}

.gala-calendar-style-compact .gala-calendar-list-item h3 {
    font-size: 16px;
    margin-bottom: 4px;
}

.gala-calendar-style-compact .gala-calendar-list-item-meta {
    font-size: 12px;
}

.gala-calendar-style-compact .gala-calendar-list-item p {
    font-size: 13px;
}

.gala-calendar-style-compact .gala-calendar-list-item-image {
    width: 80px;
    height: 80px;
}

/* Large list style */
.gala-calendar-style-large .gala-calendar-list-item {
    padding: 24px 0;
    gap: 24px;
    border-bottom: 2px solid #ddd;
}

.gala-calendar-style-large .gala-calendar-list-item h3 {
    font-size: 28px;
    font-weight: 700;
}

.gala-calendar-style-large .gala-calendar-list-item-meta {
    font-size: 16px;
    font-weight: 500;
}

.gala-calendar-style-large .gala-calendar-list-item p {
    font-size: 17px;
    line-height: 1.6;
}

.gala-calendar-style-large .gala-calendar-list-item-image {
    width: 180px;
    height: 180px;
}

/* List item hover preview */
.gala-calendar-list-item h3 a {
    position: relative;
    z-index: 1;
}

.gala-calendar-list-item-preview {
    display: none;
    position: fixed;
    z-index: 99999;
    width: 360px;
    background: #fff;
    border: 1px solid #ddd;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    padding: 16px;
    border-radius: 8px;
    pointer-events: none;
}

.gala-calendar-hover-preview .gala-calendar-list-item h3:hover .gala-calendar-list-item-preview,
.gala-calendar-list-item-preview.active {
    display: block !important;
    pointer-events: auto;
}

.gala-calendar-list-item-preview-image {
    width: 100%;
    height: 200px;
    overflow: hidden;
    border-radius: 6px;
    margin-bottom: 12px;
}

.gala-calendar-list-item-preview-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gala-calendar-list-item-preview-title {
    font-size: 18px;
    margin: 0 0 8px 0;
    font-weight: 600;
    color: #222;
}

.gala-calendar-list-item-preview-meta {
    font-size: 14px;
    color: #666;
    margin-bottom: 10px;
}

.gala-calendar-list-item-preview-meta span {
    display: block;
    margin-bottom: 4px;
}

.gala-calendar-list-item-preview-excerpt {
    margin: 0;
    font-size: 14px;
    color: #444;
    line-height: 1.5;
}

/* Calendar view mode switching */
[data-calendar-view="list"] .gala-calendar-grid {
    display: none;
}

[data-calendar-view="month"] .gala-calendar-list {
    display: none;
}

.gala-calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 10px;
    margin-bottom: 10px;
}

.gala-calendar-weekdays div {
    text-align: center;
    font-weight: 700;
    font-size: 14px;
    color: #666;
    padding: 10px 5px;
}

.gala-calendar-style-default .gala-calendar-weekdays div {
    font-size: 14px;
    color: #1976d2;
    font-weight: 600;
    background: #e3f2fd;
    border-radius: 6px;
    padding: 8px 5px;
}

.gala-calendar-style-compact .gala-calendar-weekdays div {
    font-size: 11px;
    color: #616161;
    font-weight: 500;
    padding: 4px 2px;
}

.gala-calendar-style-large .gala-calendar-weekdays div {
    font-size: 18px;
    color: #0d47a1;
    font-weight: 700;
    background: linear-gradient(135deg, #bbdefb, #e3f2fd);
    border-radius: 8px;
    padding: 12px 8px;
    box-shadow: 0 2px 6px rgba(33, 150, 243, 0.1);
}

.gala-calendar-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    /* use gap for borders */
    background: #e5e5e5;
    /* border color */
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    overflow: hidden;
    grid-auto-rows: minmax(130px, auto);
}

.gala-calendar-day {
    min-height: 130px;
    padding: 10px;
    background: #fff;
    position: relative;
    transition: background 0.2s ease;
    display: flex;
    flex-direction: column;
}

.gala-calendar-day:hover {
    background: #fbfcfe;
}

.gala-calendar-day-empty {
    background: #f8fafc;
}

.gala-calendar-day.is-today {
    background: #f0f9ff;
}

.gala-calendar-day.is-today::after {
    content: '';
    position: absolute;
    top: 5px;
    right: 5px;
    width: 6px;
    height: 6px;
    background: #0073aa;
    border-radius: 50%;
}

.gala-calendar-day-number {
    display: block;
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 5px;
    color: #333;
    position: relative;
    z-index: 15;
    /* Stay above continuous bars */
}

/* RESPONSIVENESS: Mobile Ready Calendar */
@media screen and (max-width: 768px) {
    .gala-events-calendar-wrapper {
        overflow-x: auto;
        margin-left: -15px;
        margin-right: -15px;
        padding-left: 15px;
        padding-right: 15px;
    }

    .gala-events-calendar {
        min-width: 750px;
        /* Preserve grid layout with horizontal scrolling */
    }

    .gala-calendar-title {
        font-size: 18px;
    }
}

/* CONTINUOUS HIGHLIGHTS MODE */
.gala-calendar-continuous .gala-calendar-day {
    overflow: visible;
}

.gala-calendar-continuous .gala-calendar-events {
    overflow: visible;
    position: relative;
}

.gala-calendar-continuous .gala-calendar-event.event-span-start {
    margin-right: -2px;
    /* Overlap the 1px grid gap */
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    z-index: 10;
}

.gala-calendar-continuous .gala-calendar-event.event-span-middle {
    margin-left: -2px;
    margin-right: -2px;
    border-radius: 0;
    z-index: 10;
}

.gala-calendar-continuous .gala-calendar-event.event-span-end {
    margin-left: -2px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    z-index: 10;
}

/* Ensure today indicator and other elements stay above bars if needed */
.gala-calendar-continuous .gala-day-deadlines {
    z-index: 15;
}

.gala-calendar-day.is-today .gala-calendar-day-number {
    color: #0073aa;
}

.gala-calendar-events {
    margin-top: 5px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.gala-calendar-event {
    display: block;
    padding: 4px 8px;
    background: #0073aa;
    color: #fff !important;
    font-size: 11px;
    line-height: 1.4;
    text-decoration: none;
    border-radius: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: transform 0.2s ease, opacity 0.2s ease;
    font-weight: 500;
}

.gala-calendar-event:hover {
    opacity: 0.9;
    transform: scale(1.02);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

/* Event Span Styles */
.gala-calendar-event.event-span-middle {
    border-radius: 0;
    margin-left: -11px;
    margin-right: -11px;
    padding-left: 11px;
    border-left: none !important;
}

.gala-calendar-event.event-span-start {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: -11px;
    border-left: none !important;
}

.gala-calendar-event.event-span-end {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -11px;
    padding-left: 11px;
    border-left: none !important;
}

/* Deadline Indicators */
.gala-day-deadlines {
    position: absolute;
    bottom: 8px;
    right: 8px;
    display: flex;
    gap: 4px;
}

.gala-deadline-indicator {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    cursor: help;
}

.gala-deadline-submission {
    background: #ff5722;
}

.gala-deadline-juror {
    background: #9c27b0;
}

@media (max-width: 768px) {
    .gala-calendar-day {
        min-height: 80px;
        padding: 5px;
    }

    .gala-calendar-day-number {
        font-size: 14px;
    }

    .gala-calendar-event {
        font-size: 10px;
        padding: 3px 4px;
    }
}

/* ==========================================================================
   Single Event Page Styles
   ========================================================================== */

.gala-single-event {
    max-width: 1200px;
    margin: 0 auto;
}

.gala-event-header {
    margin-bottom: 30px;
}

.gala-event-featured-image {
    margin-bottom: 30px;
}

.gala-event-featured-image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
}

.gala-event-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
    padding: 20px;
    background: transparent;
    /* transparent to avoid boxed look */
    border-radius: 8px;
}

.gala-event-meta-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.gala-event-meta-item svg {
    flex-shrink: 0;
    margin-top: 3px;
    opacity: 0.7;
}

.gala-event-meta-label {
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    color: #666;
    margin-bottom: 3px;
}

.gala-event-meta-value {
    font-size: 16px;
    color: #333;
}

.gala-event-description {
    margin-bottom: 30px;
    line-height: 1.8;
    font-size: 16px;
}

.gala-event-actions {
    display: flex;
    gap: 15px;
    margin-bottom: 30px;
}

.gala-event-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: #0073aa;
    color: #fff !important;
    text-decoration: none;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    transition: background 0.2s ease;
    border: none;
    cursor: pointer;
}

.gala-event-button:hover {
    background: #005177;
}

.gala-event-button.secondary {
    background: #fff;
    color: #0073aa !important;
    border: 2px solid #0073aa;
}

.gala-event-button.secondary:hover {
    background: #0073aa;
    color: #fff !important;
}

/* Add to Calendar Dropdown */
.add-to-calendar {
    position: relative;
    display: inline-block;
}

.add-to-calendar-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 5px;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    min-width: 200px;
    z-index: 999999;
}

.add-to-calendar {
    overflow: visible;
}

.add-to-calendar-menu.show {
    display: block;
}

.add-to-calendar-menu a {
    display: block;
    padding: 12px 16px;
    color: #333 !important;
    text-decoration: none;
    transition: background 0.2s ease;
}

.add-to-calendar-menu a:hover {
    background: #f5f5f5;
}

/* Layout specific Add to Calendar treatments */
.gala-minimal-add-to-calendar {
    text-align: center;
    margin-top: 18px;
}

.gala-minimal-add-to-calendar .gala-event-button {
    padding: 10px 18px;
}

.gala-hero-add-to-calendar .add-to-calendar-menu {
    left: 50%;
    transform: translateX(-50%);
    min-width: 260px;
}

.gala-hero-add-to-calendar .gala-hero-button {
    font-weight: 700;
}

.gala-card-add-to-calendar .add-to-calendar-menu {
    right: 0;
    left: auto;
    min-width: 220px;
}

.gala-card-add-to-calendar .gala-card-button {
    padding: 10px 14px;
    font-size: 14px;
}

.gala-split-add-menu {
    right: 0;
    left: auto;
}

.gala-magazine-box .add-to-calendar-menu {
    position: static;
    box-shadow: none;
    border: none;
    display: block;
}

.gala-magazine-box .add-to-calendar-menu a {
    padding: 6px 0;
}

/* ==========================================================================
   Responsive Design
   ========================================================================== */

@media (max-width: 1024px) {

    .gala-events-grid,
    .gala-events-masonry {
        gap: 20px;
    }
}

@media (max-width: 480px) {
    .gala-event-title {
        font-size: 18px;
    }

    .gala-event-content {
        padding: 15px;
    }

    .gala-carousel-prev,
    .gala-carousel-next {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }

    .gala-carousel-prev {
        left: 10px;
    }

    .gala-carousel-next {
        right: 10px;
    }
}

/* ==========================================================================
   Accessibility
   ========================================================================== */

.gala-event-card:focus-within,
.gala-event-list-item:focus-within {
    outline: 2px solid #0073aa;
    outline-offset: 2px;
}

.gala-event-link:focus,
.gala-event-button:focus,
.gala-calendar-nav:focus {
    outline: 2px solid #0073aa;
    outline-offset: 2px;
}

/* ==========================================================================
   Countdown Timer Styles
   ========================================================================== */

.gala-countdown-banner {
    padding: 12px 20px;
    text-align: center;
    color: #fff;
    font-weight: 600;
    border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.gala-countdown-label {
    font-size: 14px;
    margin-bottom: 8px;
    text-transform: uppercase;
    letter-spacing: 1px;
    opacity: 0.95;
    font-weight: 700;
}

.gala-countdown-timer {
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap;
}

.gala-countdown-segment {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 60px;
}

.gala-countdown-value {
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 4px;
}

.gala-countdown-unit {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.9;
}

/* Compact countdown for event cards */
.gala-countdown-compact {
    padding: 8px 12px;
    margin-bottom: 0;
    border-radius: 0;
}

.gala-countdown-compact .gala-countdown-label {
    font-size: 11px;
    margin-bottom: 6px;
    letter-spacing: 0.5px;
}

.gala-countdown-compact .gala-countdown-timer {
    gap: 10px;
}

.gala-countdown-compact .gala-countdown-segment {
    min-width: auto;
}

.gala-countdown-compact .gala-countdown-value {
    font-size: 18px;
    font-weight: 600;
}

.gala-countdown-compact .gala-countdown-unit {
    font-size: 9px;
}

/* Status-based colors (set inline but can be overridden) */
.gala-countdown-upcoming {
    background-color: #4caf50;
    /* Green */
}

.gala-countdown-current {
    background-color: #2196f3;
    /* Blue */
}

.gala-countdown-past {
    background-color: #f44336;
    /* Red */
    opacity: 0.85;
}

/* ==========================================================================
   Print Styles
   ========================================================================== */

@media print {

    .gala-event-actions,
    .gala-carousel-prev,
    .gala-carousel-next,
    .gala-carousel-dots,
    .gala-countdown-banner {
        display: none !important;
    }

    .gala-event-card,
    .gala-event-list-item {
        break-inside: avoid;
        page-break-inside: avoid;
    }
}

/* ==========================================================================
   COMPREHENSIVE LAYOUT OVERHAUL (User Request Fixes)
   ========================================================================== */

/* --- 1. Calendar Continuous Highlights (Seamless) --- */
.gala-calendar-view[data-continuous-highlights="true"] .gala-calendar-day,
.gala-calendar-view[data-continuous-highlights="true"] .gala-calendar-day-content {
    overflow: visible !important;
    z-index: 1;
}

/* Ensure events stack properly above potential overlaps but below popups */
.gala-calendar-view[data-continuous-highlights="true"] .gala-calendar-event {
    margin-left: -1px;
    /* Pull back to cover gap */
    margin-right: -1px;
    /* Push forward to cover gap */
    width: calc(100% + 2px);
    position: relative;
    z-index: 2;
    border-radius: 0;
    /* Remove side radius for connections */
    box-shadow: none;
    /* Flatten for seamless look */
}

/* Restore radius for start and end of spans */
.gala-calendar-view[data-continuous-highlights="true"] .gala-calendar-event.event-span-start {
    margin-left: 2px;
    width: calc(100% - 1px);
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.gala-calendar-view[data-continuous-highlights="true"] .gala-calendar-event.event-span-end {
    margin-right: 2px;
    width: calc(100% - 1px);
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.gala-calendar-view[data-continuous-highlights="true"] .gala-calendar-event.event-span-middle {
    /* Purely rectangular for middle segments */
    border-radius: 0;
}

/* --- 2. Grid Layout (Strict 16:9 100% Crop) --- */
.gala-layout-grid .gala-event-image {
    aspect-ratio: 16 / 9;
    width: 100%;
    overflow: hidden;
    height: auto;
    /* Reset any fixed height */
}

.gala-layout-grid .gala-event-image img {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
}

/* --- 3. Masonry Layout (Natural Height) --- */
.gala-layout-masonry .gala-event-image {
    height: auto !important;
    aspect-ratio: auto !important;
}

.gala-layout-masonry .gala-event-image img {
    height: auto !important;
    object-fit: contain !important;
}

/* --- 4. Cover Layout (Stacked Heroes) --- */
.gala-layout-cover {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.gala-layout-cover .gala-card-cover {
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.gala-layout-cover .gala-card-cover:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
}

/* ==========================================================================
   FINAL UI REFINEMENTS (User Feedback)
   ========================================================================== */

/* --- Mobile Responsiveness for "Large" Calendar --- */
@media screen and (max-width: 768px) {
    .gala-calendar-style-large .gala-calendar-day {
        padding: 8px !important;
        min-height: 80px !important;
        /* Reduce from large default */
        font-size: 12px !important;
        border-radius: 6px !important;
    }

    .gala-calendar-style-large .gala-calendar-title {
        font-size: 18px !important;
        padding: 10px !important;
        margin-bottom: 15px !important;
    }

    .gala-calendar-style-large .gala-calendar-day-number {
        font-size: 14px !important;
        margin-bottom: 2px !important;
    }

    /* Force stack on mobile for all grids */
    .gala-layout-grid,
    .gala-layout-masonry,
    .gala-events-list {
        grid-template-columns: 1fr !important;
        display: grid !important;
    }
}

/* --- Grid View: Strict 16:9 Crop --- */
.gala-layout-grid {
    display: grid;
    gap: 30px;
    width: 100%;
}

.gala-layout-grid .gala-event-image {
    width: 100%;
    aspect-ratio: 16 / 9;
    /* Enforce 16:9 */
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    margin-bottom: 15px;
    background: #f0f0f0;
}

.gala-layout-grid .gala-event-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    /* Crop to fill */
    position: absolute;
    top: 0;
    left: 0;
}

/* --- Masonry View: Full Image (No Crop) --- */
.gala-layout-masonry {
    display: grid;
    gap: 30px;
    width: 100%;
    align-items: start;
    /* Align items at start to handle varying heights */
}

/* Fallback for Masonry on non-grid supporting browsers, keeping natural height */
.gala-layout-masonry .gala-event-image {
    width: 100%;
    height: auto !important;
    /* Natural height */
    aspect-ratio: auto !important;
    /* Disable forced ratio */
    overflow: visible !important;
    margin-bottom: 15px;
}

.gala-layout-masonry .gala-event-image img {
    width: 100% !important;
    height: auto !important;
    /* Natural height */
    object-fit: contain !important;
    /* Show full image */
    position: relative !important;
}

/* --- Cover / Hero List View --- */
.gala-layout-cover {
    display: flex;
    flex-direction: column;
    gap: 50px;
    /* Space between hero cards */
}

.gala-layout-cover .gala-card-cover {
    width: 100%;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s ease;
}

.gala-layout-cover .gala-card-cover:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
}

.gala-layout-cover .gala-card-cover-inner {
    position: relative;
    z-index: 2;
    padding: 60px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 100%;
}

/* --- General Polish --- */
.gala-event-title,
.gala-card-cover-title {
    font-family: inherit;
    /* Inherit theme font */
    font-weight: 700;
    line-height: 1.3;
}

/* Fix for potential empty p tags from wpautop */
.gala-layout-grid p:empty,
.gala-layout-masonry p:empty {
    display: none;
}

/* ==========================================================================
   CALENDAR RESPONSIVE FIX - Fit to container, no overflow
   ========================================================================== */

/* Main calendar container - must fit within parent */
.gala-events-calendar-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    /* Prevent overflow */
}

.gala-events-calendar {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* Calendar grid - 7 equal columns that scale */
.gala-calendar-grid {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 1px !important;
}

/* Weekday headers - 7 equal columns */
.gala-calendar-weekdays {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    width: 100% !important;
    text-align: center;
    font-weight: 600;
    padding: 10px 0;
    border-bottom: 1px solid #e5e5e5;
    background: #f9f9f9;
}

.gala-calendar-weekdays>div {
    padding: 8px 4px;
    font-size: clamp(10px, 2vw, 14px);
    /* Scales with viewport */
}

/* Day cells grid - 7 equal columns */
.gala-calendar-days {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    width: 100% !important;
    gap: 1px;
    background: #e5e5e5;
    /* Gap color */
}

.gala-calendar-day {
    background: #fff;
    min-height: clamp(60px, 12vw, 120px);
    /* Scales with viewport */
    padding: clamp(4px, 1vw, 12px) !important;
    position: relative;
    box-sizing: border-box;
    overflow: hidden;
}

.gala-calendar-day-number {
    font-size: clamp(12px, 2.5vw, 18px) !important;
}

/* Multi-Day Event Spanning */
.gala-event-start {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    margin-right: -10px !important;
    /* Extend to edge */
    z-index: 2;
}

.gala-event-end {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    margin-left: -10px !important;
    /* Extend to edge */
    z-index: 2;
}

.gala-event-middle {
    border-radius: 0 !important;
    margin-left: -10px !important;
    margin-right: -10px !important;
    z-index: 1;
}

.gala-calendar-event {
    position: relative;
    /* Ensure text is visible */
}

/* Event bars inside days */
.gala-calendar-event {
    font-size: clamp(8px, 1.5vw, 11px) !important;
    padding: clamp(2px, 0.5vw, 4px) clamp(4px, 1vw, 8px) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Remove the problematic min-width that forces overflow */
@media screen and (max-width: 768px) {
    .gala-events-calendar-wrapper {
        overflow-x: visible !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .gala-events-calendar {
        min-width: unset !important;
        /* REMOVE forced min-width */
        padding: 10px !important;
    }

    .gala-calendar-header {
        flex-wrap: wrap;
        gap: 10px;
    }

    .gala-calendar-title {
        font-size: clamp(14px, 4vw, 20px) !important;
        order: 0;
        flex: 1 0 100%;
        text-align: center;
    }

    .gala-calendar-nav {
        width: 32px;
        height: 32px;
        font-size: 16px;
    }
}

/* Extra small screens */
@media screen and (max-width: 480px) {
    .gala-calendar-day {
        min-height: 50px;
        padding: 2px !important;
    }

    .gala-calendar-day-number {
        font-size: 10px !important;
    }

    .gala-calendar-event {
        font-size: 7px !important;
        padding: 1px 2px !important;
    }

    .gala-calendar-weekdays>div {
        font-size: 9px;
        padding: 4px 2px;
    }
}

/* ==========================================================================
   CALENDAR GRID FORCE FIX - Override page builder/theme conflicts
   ========================================================================== */

/* Force 7 column grid on calendar days - highest specificity */
.gala-events-calendar-wrapper .gala-calendar-grid .gala-calendar-days,
.gala-events-calendar .gala-calendar-grid .gala-calendar-days,
div.gala-calendar-days,
.gala-calendar-days {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    grid-template-rows: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 1px !important;
    background: #e5e5e5 !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

/* Force 7 column grid on weekday headers */
.gala-events-calendar-wrapper .gala-calendar-grid .gala-calendar-weekdays,
.gala-events-calendar .gala-calendar-grid .gala-calendar-weekdays,
div.gala-calendar-weekdays,
.gala-calendar-weekdays {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 0 !important;
    margin-bottom: 0 !important;
}

/* Each day cell */
.gala-calendar-days>.gala-calendar-day,
.gala-calendar-days>div.gala-calendar-day {
    background: #fff !important;
    min-height: 80px !important;
    padding: 8px !important;
    position: relative !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Each weekday header cell */
.gala-calendar-weekdays>div {
    text-align: center !important;
    font-weight: 600 !important;
    padding: 10px 4px !important;
    background: #f5f5f5 !important;
    border-bottom: 1px solid #e5e5e5 !important;
}

/* Calendar container - prevent overflow */
.gala-events-calendar-wrapper,
div.gala-events-calendar-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

.gala-events-calendar,
div.gala-events-calendar {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.gala-calendar-grid,
div.gala-calendar-grid {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 1px !important;
}

/* Responsive adjustments */
@media screen and (max-width: 768px) {
    .gala-calendar-days>.gala-calendar-day {
        min-height: 60px !important;
        padding: 4px !important;
    }

    .gala-calendar-weekdays>div {
        padding: 6px 2px !important;
        font-size: 11px !important;
    }

    .gala-calendar-day-number {
        font-size: 12px !important;
    }

    .gala-calendar-event {
        font-size: 9px !important;
        padding: 2px 4px !important;
    }
}

@media screen and (max-width: 480px) {
    .gala-calendar-days>.gala-calendar-day {
        min-height: 45px !important;
        padding: 2px !important;
    }

    .gala-calendar-weekdays>div {
        padding: 4px 1px !important;
        font-size: 9px !important;
    }

    .gala-calendar-day-number {
        font-size: 10px !important;
    }

    .gala-calendar-event {
        font-size: 7px !important;
        padding: 1px 2px !important;
    }
}

/* ==========================================================================
   CALENDAR GRID FIX - WPBakery/Theme Override
   ========================================================================== */

/* Reset any WPBakery/VC column grid interference */
.wpb_column .gala-calendar-days,
.vc_column .gala-calendar-days,
.vc_column_container .gala-calendar-days,
.wpb_wrapper .gala-calendar-days,
[class*="vc_"] .gala-calendar-days,
[class*="wpb_"] .gala-calendar-days,
.gala-events-calendar-wrapper .gala-calendar-days,
.gala-events-calendar .gala-calendar-days,
.gala-calendar-grid .gala-calendar-days,
.gala-calendar-days {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;

    width: 100% !important;
    max-width: none !important;
    flex-wrap: nowrap !important;
    flex-direction: row !important;
}

/* Reset any WPBakery/VC column grid interference for weekdays */
.wpb_column .gala-calendar-weekdays,
.vc_column .gala-calendar-weekdays,
.vc_column_container .gala-calendar-weekdays,
.wpb_wrapper .gala-calendar-weekdays,
[class*="vc_"] .gala-calendar-weekdays,
[class*="wpb_"] .gala-calendar-weekdays,
.gala-events-calendar-wrapper .gala-calendar-weekdays,
.gala-events-calendar .gala-calendar-weekdays,
.gala-calendar-grid .gala-calendar-weekdays,
.gala-calendar-weekdays {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;

    width: 100% !important;
    max-width: none !important;
    flex-wrap: nowrap !important;
}

/* Prevent Salient theme or other themes from overriding */
body .gala-calendar-days,
html body .gala-calendar-days,
#ajax-content-wrap .gala-calendar-days,
.main-content .gala-calendar-days,
.container-wrap .gala-calendar-days,
.content-inner .gala-calendar-days {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
}

/* Force the calendar container to take full width */
.wpb_column .gala-events-calendar-wrapper,
.vc_column .gala-events-calendar-wrapper,
.wpb_wrapper .gala-events-calendar-wrapper,
.gala-events-calendar-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    display: block !important;
}

.wpb_column .gala-events-calendar,
.vc_column .gala-events-calendar,
.wpb_wrapper .gala-events-calendar,
.gala-events-calendar {
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
}

.wpb_column .gala-calendar-grid,
.vc_column .gala-calendar-grid,
.wpb_wrapper .gala-calendar-grid,
.gala-calendar-grid {
    width: 100% !important;
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 1px !important;
}

/* Individual calendar day - prevent any flex/grid child issues */
.gala-calendar-days>div,
.gala-calendar-days>.gala-calendar-day {
    min-width: 0 !important;
    flex: none !important;
    width: auto !important;
}

/* Weekday header items */
.gala-calendar-weekdays>div {
    min-width: 0 !important;
    flex: none !important;
    width: auto !important;
    text-align: center !important;
}

/* Single Event - Default Layout Refinements */
.gala-btn-pill {
    border-radius: 50px !important;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 14px 28px !important;
    transition: all 0.3s ease;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.gala-btn-pill:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
}

.gala-btn-solid {
    /* Background color handled inline for dynamic support */
    color: #fff !important;
    border: none !important;
}

.gala-btn-outline {
    background-color: transparent !important;
    /* Border color handled inline */
    border-width: 2px !important;
    border-style: solid !important;
}

.gala-countdown-banner {
    width: 100%;
    margin-bottom: 30px;
    padding: 20px 30px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
}

.gala-countdown-banner h3 {
    color: #fff !important;
    margin: 0;
    font-size: 1.25rem;
}

.gala-countdown-banner .gala-countdown-timer {
    font-size: 1.5rem;
    font-weight: 700;
}

/* Sidebar Categories */
.gala-sidebar-taxonomy {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

.gala-sidebar-taxonomy h4 {
    font-size: 1rem;
    margin-bottom: 10px;
    color: #333;
}

.gala-sidebar-taxonomy a {
    display: inline-block;
    background: #f0f0f0;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 0.85rem;
    color: #555;
    margin-right: 5px;
    margin-bottom: 5px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.gala-sidebar-taxonomy a:hover {
    background: #e0e0e0;
    color: #333;
}

/* ==========================================================================
   GALA DESIGN SYSTEM (Premium UX Foundation)
   ========================================================================== */

:root {
    /* --- COLOR PALETTE (Dynamic 60-30-10) --- */
    --gala-primary: #ffffff;
    /* 60% Base */
    --gala-secondary: #000000;
    /* 30% Text/Contrast */
    --gala-highlight: #ff3366;
    /* 10% Accent (User defined) */

    /* Computed Variations */
    --gala-highlight-dim: color-mix(in srgb, var(--gala-highlight), white 20%);
    --gala-highlight-glow: color-mix(in srgb, var(--gala-highlight), transparent 60%);

    /* --- SPACING & LAYOUT --- */
    --gala-gap-xs: 8px;
    --gala-gap-sm: 16px;
    --gala-gap-md: 24px;
    --gala-gap-lg: 40px;
    --gala-radius-sm: 8px;
    --gala-radius-md: 16px;
    --gala-radius-lg: 24px;

    /* --- ANIMATION PHYSICS --- */
    --gala-ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
    --gala-ease-smooth: cubic-bezier(0.4, 0.0, 0.2, 1);
}

/* --- UTILITY: GLASSMORPHISM --- */
.gala-glass-panel {
    background: rgba(255, 255, 255, 0.65);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.gala-glass-dark {
    background: rgba(15, 15, 15, 0.85);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: white;
}

/* --- UTILITY: NEUMORPHISM (Soft UI) --- */
.gala-neu-flat {
    background: #f0f3f5;
    box-shadow:
        10px 10px 20px #cdd1d4,
        -10px -10px 20px #ffffff;
    border-radius: var(--gala-radius-md);
    border: none;
}

.gala-neu-pressed {
    background: #f0f3f5;
    box-shadow:
        inset 6px 6px 12px #cdd1d4,
        inset -6px -6px 12px #ffffff;
    border-radius: var(--gala-radius-sm);
}

/* --- UTILITY: BENTO GRID --- */
.gala-bento-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--gala-gap-md);
}

.gala-bento-tile {
    display: flex;
    flex-direction: column;
    padding: var(--gala-gap-md);
    border-radius: var(--gala-radius-lg);
    transition: transform 0.3s var(--gala-ease-out-back);
}

.gala-bento-tile:hover {
    transform: translateY(-4px) scale(1.01);
}

/* --- UTILITY: NEW MAXIMALISM --- */
.gala-max-border {
    border: 3px solid var(--gala-secondary);
    box-shadow: 6px 6px 0px var(--gala-highlight);
    background: white;
}

.gala-max-type {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-weight: 800;
}

/* --- ANIMATIONS --- */
@keyframes gala-fade-in-up {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.gala-animate-entry {
    animation: gala-fade-in-up 0.6s var(--gala-ease-out-back) forwards;
}


/* Layout: Hero (Glassmorphism + New Maximalism) */
.gala-layout-hero {
    position: relative;
    overflow: hidden;
}

.gala-layout-hero .gala-hero-overlay {
    background: var(--gala-gradient-glass);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.gala-layout-hero h1 {
    font-size: var(--gala-heading-xxl);
    text-shadow: 2px 2px 0px var(--gala-highlight);
    color: var(--gala-white);
}

/* Layout: Split (Bento Box + Glassmorphism) */
.gala-layout-split .gala-details-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

@media (max-width: 768px) {
    .gala-layout-split .gala-details-grid {
        grid-template-columns: 1fr;
    }
}

.gala-layout-split .gala-bento-card {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-radius: 20px;
    padding: 24px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    transition: transform 0.3s ease;
}

.gala-layout-split .gala-bento-card:hover {
    transform: scale(1.02);
    background: rgba(255, 255, 255, 0.9);
}

/* Layout: Card (Flat Design 2.0 + Neumorphism) */
.gala-layout-card .gala-card-container {
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    border: 1px solid var(--gala-border-subtle);
}

.gala-layout-card .gala-card-header {
    padding: 40px;
    background: var(--gala-bg-lighter);
    border-bottom: 1px solid var(--gala-border-subtle);
}

/* Layout: Magazine (New Maximalism + Flat Design 2.0) */
.gala-layout-magazine h1 {
    font-family: inherit;
    /* Fonts should be handled by theme or specific enqueue */
    font-size: 4rem;
    line-height: 1.1;
    color: var(--gala-text-dark);
}

.gala-layout-magazine .gala-meta-bar {
    border-top: 4px solid var(--gala-highlight);
    border-bottom: 4px solid var(--gala-highlight);
    padding: 20px 0;
    margin: 30px 0;
}

/* Layout: Minimal (Modern Minimalism + Neumorphism) */
.gala-layout-minimal {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
}

.gala-layout-minimal .gala-minimal-divider {
    height: 1px;
    background: linear-gradient(to right, transparent, var(--gala-highlight), transparent);
    margin: 40px auto;
    width: 60%;
}