/* ==========================================================================
   RUN.EVENTS WIDGETS — Tabular Agenda Desktop Widget
   COLOR OVERRIDES ONLY - applying brand colors to existing layout
   ========================================================================== */

/* --- Material Design Tab Colors --- */

/* Date tabs - pill style */
.agenda-component-carousel .mdc-tab {
    padding: 0 16px !important;
    border-radius: 20px !important;
    min-height: 36px !important;
}

/* Active tab - Primary color background */
.agenda-component-carousel .mdc-tab--active,
.agenda-component-carousel .mdc-tab.mdc-tab--active {
    color: var(--color-text-on-primary) !important;
    background: var(--color-primary) !important;
}

/* Tab hover */
.agenda-component-carousel .mdc-tab:hover:not(.mdc-tab--active) {
    color: var(--color-primary) !important;
    background: hsla(var(--color-primary-hsl), 0.08) !important;
}

/* Tab pagination chevrons */
.agenda-component-carousel .mat-mdc-tab-header-pagination-chevron {
    border-color: var(--color-primary) !important;
}

/* --- Time Labels - Secondary color --- */
.agenda-component-carousel .time-label {
    color: var(--color-text-on-secondary) !important;
    background: var(--color-secondary) !important;
    box-shadow: 0 4px 12px hsla(var(--color-secondary-hsl), 0.25) !important;
}

/* --- Session Cards Colors --- */
.agenda-component-carousel .session-card-carousel {
    background: linear-gradient(
            160deg,
            var(--color-bg) 0%,
            var(--color-surface) 55%,
            var(--color-surface-alt) 100%
    ) !important;
    border-color: hsla(var(--color-primary-hsl), 0.1) !important;
    border-left: 4px solid var(--color-primary) !important;
}

.agenda-component-carousel .session-card-carousel:hover {
    box-shadow: 0 8px 24px hsla(var(--color-primary-hsl), 0.15) !important;
    border-left-color: var(--color-secondary) !important;
}

/* Room Name - Secondary color pill */
.agenda-component-carousel .room-name-carousel {
    background: var(--color-secondary) !important;
    color: var(--color-text-on-secondary) !important;
    display: inline-block !important;
    padding: 2px 10px !important;
    border-radius: 12px !important;
}

/* Session Title - Primary color, 2 lines */
.agenda-component-carousel .session-title-carousel {
    color: var(--color-primary) !important;
    white-space: normal !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    line-height: 1.3 !important;
}

/* Session Card - taller to fit 2-line title */
.agenda-component-carousel .session-card-carousel {
    min-height: 232px !important;
}

/* Session Time */
.agenda-component-carousel .session-time-carousel {
    color: var(--color-text-muted) !important;
}

/* Speaker Name */
.agenda-component-carousel .speaker-name-carousel {
    color: var(--color-text) !important;
}

/* Speaker Photo */
.agenda-component-carousel .speaker-carousel img {
    border-color: var(--color-bg) !important;
    box-shadow: 0 2px 8px hsla(var(--color-primary-hsl), 0.15) !important;
}

.agenda-component-carousel .session-card-carousel:hover .speaker-carousel img {
    box-shadow: 0 4px 12px hsla(var(--color-primary-hsl), 0.25) !important;
}

/* --- Non-Content Cards (Registration, Lunch) --- */
.agenda-component-carousel .session-card-nonContent {
    background: hsla(var(--color-primary-hsl), 0.03) !important;
    border-color: hsla(var(--color-primary-hsl), 0.15) !important;
}

.agenda-component-carousel .session-card-nonContent:hover {
    background: hsla(var(--color-primary-hsl), 0.06) !important;
}

.agenda-component-carousel .session-card-nonContent h4 {
    color: var(--color-primary) !important;
}

/* Override inline content-item colors */
.agenda-component-carousel .session-card-nonContent .content-item {
    background: var(--color-secondary) !important;
    color: var(--color-text-on-secondary) !important;
}

/* --- Filter Sidebar (matching speakers widget) --- */
.agenda-component-carousel .card-sidebar {
    background: linear-gradient(
            160deg,
            var(--color-bg) 0%,
            var(--color-surface) 55%,
            var(--color-surface-alt) 100%
    ) !important;
    border-radius: var(--radius-md) !important;
    padding: 0 0 16px 0 !important;
    box-shadow: var(--shadow-sm) !important;
    border-left: 16px solid transparent !important;
}

/* Sidebar title sections */
.agenda-component-carousel .card-sidebar .title {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: var(--space-sm) !important;
    padding-bottom: var(--space-xs) !important;
    border-bottom: 1px solid var(--color-border) !important;
}

.agenda-component-carousel .card-sidebar .title span {
    font-family: var(--font-heading) !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    color: var(--color-primary) !important;
}

/* Hide collapse/expand arrow */
.agenda-component-carousel .card-sidebar .title img {
    display: none !important;
}

/* Search input */
.agenda-component-carousel .card-sidebar input[type="search"],
.agenda-component-carousel .card-sidebar .form-control {
    width: 90% !important;
    box-sizing: border-box !important;
    background: var(--color-bg) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    padding: var(--space-sm) var(--space-md) !important;
    font-size: var(--text-body) !important;
    font-family: var(--font-body) !important;
    margin-bottom: var(--space-md) !important;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast) !important;
}

.agenda-component-carousel .card-sidebar input[type="search"]:focus,
.agenda-component-carousel .card-sidebar .form-control:focus {
    outline: none !important;
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 3px hsla(var(--color-primary-hsl), 0.15) !important;
}

/* Checkbox container */
.agenda-component-carousel .card-sidebar .checkbox-container {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-xs) !important;
}

/* Individual checkbox items */
.agenda-component-carousel .card-sidebar .checkbox {
    display: flex !important;
    align-items: center !important;
    padding: 10px var(--space-sm) !important;
    border-radius: var(--radius-sm) !important;
    border-right: 3px solid transparent !important;
    transition: background-color var(--transition-fast) !important;
    cursor: pointer !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

.agenda-component-carousel .card-sidebar .checkbox:hover {
    background: hsla(var(--color-primary-hsl), 0.08) !important;
}

.agenda-component-carousel .card-sidebar .checkbox input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    margin-right: var(--space-sm) !important;
    cursor: pointer !important;
}

/* Custom checkbox visual - target the pseudo-element */
.agenda-component-carousel .card-sidebar .checkbox label::before,
.agenda-component-carousel .card-sidebar .checkbox-container .checkbox label::before,
.container .card-sidebar .checkbox-container .checkbox label::before {
    border-color: var(--color-primary) !important;
}

.agenda-component-carousel .card-sidebar .checkbox input:checked + label::before,
.agenda-component-carousel .card-sidebar .checkbox-container .checkbox input:checked + label::before,
.container .card-sidebar .checkbox-container .checkbox input:checked + label::before {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.agenda-component-carousel .card-sidebar .checkbox label {
    display: flex !important;
    align-items: center !important;
    gap: var(--space-xs) !important;
    cursor: pointer !important;
    font-size: var(--text-small) !important;
    color: var(--color-text-muted) !important;
    font-weight: 400 !important;
    flex: 1 !important;
}

/* --- Timezone Notice - pill style --- */
.agenda-component-carousel small {
    display: inline-block !important;
    color: var(--color-text-muted) !important;
    background: hsla(var(--color-primary-hsl), 0.08) !important;
    padding: 6px 14px !important;
    border-radius: 20px !important;
    border-left: none !important;
    margin-bottom: 16px !important;
}

/* --- Label Pills - Single Row + Softer appearance --- */
.agenda-component-carousel .label-pill-carousel {
    white-space: nowrap !important;
    filter: brightness(1.15) saturate(0.75) !important;
}

/* --- Popup Colors --- */
.agenda-component-carousel .popup {
    background: var(--color-bg) !important;
}

.agenda-component-carousel .popup button {
    background: var(--color-primary) !important;
    color: var(--color-text-on-primary) !important;
}

.agenda-component-carousel .popup button:hover {
    background: var(--color-primary-hover) !important;
}