/*
 * WP Sendeplan Pro 2.6
 * Einheitliche, theme-robuste Oberfläche für alle Frontend-Shortcodes.
 */

.rsp-ui {
    --rsp-surface: var(--rsp-bg-table-header, #1c1c1c);
    --rsp-surface: color-mix(in srgb, var(--rsp-bg-table-header, #1c1c1c) var(--rsp-surface-opacity, 96%), transparent);
    --rsp-surface-alt: var(--rsp-bg-table-row-alt, #151515);
    --rsp-surface-alt: color-mix(in srgb, var(--rsp-bg-table-row-alt, #151515) var(--rsp-surface-opacity, 96%), transparent);
    --rsp-copy: var(--rsp-text-main, #f5f5f5);
    --rsp-muted: var(--rsp-copy);
    --rsp-muted: color-mix(in srgb, var(--rsp-copy) 68%, transparent);
    --rsp-faint: var(--rsp-copy);
    --rsp-faint: color-mix(in srgb, var(--rsp-copy) 48%, transparent);
    --rsp-border: rgba(128, 128, 128, .28);
    --rsp-border: color-mix(in srgb, var(--rsp-copy) var(--rsp-border-opacity, 14%), transparent);
    --rsp-border-strong: rgba(128, 128, 128, .4);
    --rsp-border-strong: color-mix(in srgb, var(--rsp-copy) 20%, transparent);
    --rsp-accent-soft: rgba(255, 102, 0, .16);
    --rsp-accent-soft: color-mix(in srgb, var(--rsp-accent, #ff6600) 16%, transparent);
    width: 100%;
    box-sizing: border-box;
    color: var(--rsp-copy);
    font-family: var(--rsp-font-main, inherit);
    line-height: 1.55;
    text-align: left;
}

.rsp-ui *,
.rsp-ui *::before,
.rsp-ui *::after {
    box-sizing: border-box;
}

.rsp-ui [hidden] {
    display: none !important;
}

.rsp-ui img {
    max-width: 100%;
}

.rsp-ui button,
.rsp-ui input,
.rsp-ui textarea,
.rsp-ui select {
    font: inherit;
}

.rsp-ui button,
.rsp-ui a {
    -webkit-tap-highlight-color: transparent;
}

.rsp-ui :where(a, button, input, textarea, select, summary):focus-visible {
    outline: 3px solid rgba(255, 102, 0, .45);
    outline: 3px solid color-mix(in srgb, var(--rsp-accent, #ff6600) 52%, transparent);
    outline-offset: 3px;
}

.rsp-ui :where(h1, h2, h3, h4, p) {
    color: inherit;
}

.rsp-ui :where(
    .rsp-hero,
    .rsp-streampanel,
    .rsp-slot,
    .rsp-week-day,
    .rsp-table-wrap,
    .rsp-studiobox-standalone,
    .rsp-login-widget,
    .rsp-apply-wrapper,
    .rsp-filebox,
    .rsp-form-section,
    .rsp-notice
) {
    -webkit-backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    backdrop-filter: blur(var(--rsp-glass-blur, 0px));
}

.rsp-ui .rsp-eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--rsp-accent, #ff6600);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .14em;
    line-height: 1.3;
    text-transform: uppercase;
}

.rsp-ui .rsp-primary-button,
.rsp-ui a.rsp-primary-button,
.rsp-ui button.rsp-primary-button {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 10px 18px;
    border: 1px solid transparent;
    border-radius: 999px;
    background: var(--rsp-accent, #ff6600);
    color: var(--rsp-accent-contrast, #fff);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--rsp-accent, #ff6600) 20%, transparent);
    cursor: pointer;
    font-weight: 800;
    text-decoration: none;
    transition: var(--rsp-motion, transform .18s ease, box-shadow .18s ease);
}

.rsp-ui .rsp-primary-button:hover {
    color: var(--rsp-accent-contrast, #fff);
    filter: brightness(1.08);
    transform: var(--rsp-hover-lift, translateY(-2px));
}

.rsp-template-main {
    width: 100%;
    margin: 0 auto;
    padding: clamp(12px, 2vw, 28px);
}

/* Komplette öffentliche Seite */

.rsp-frontend.rsp-public-wrapper {
    width: min(100%, 1360px);
    margin: 0 auto;
    padding: clamp(12px, 2.2vw, 30px);
    overflow: visible;
    border: 1px solid var(--rsp-border);
    border-radius: calc(var(--rsp-card-radius, 18px) + 8px) !important;
    background: var(--rsp-bg-main, #111);
    background:
        radial-gradient(circle at 12% 0, var(--rsp-accent-soft), transparent 28rem),
        color-mix(in srgb, var(--rsp-bg-main, #111) var(--rsp-page-opacity, 100%), transparent);
    -webkit-backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    box-shadow: var(--rsp-card-shadow, 0 10px 30px rgba(0,0,0,.24));
}

.rsp-frontend.rsp-width-standard {
    max-width: 1080px;
}

.rsp-frontend.rsp-width-full {
    max-width: none;
}

.rsp-ui .rsp-hero {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(14px, 2.5vw, 26px);
    margin: 0 0 18px;
    padding: clamp(18px, 3vw, 34px);
    overflow: hidden;
    position: relative;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-surface);
    background:
        linear-gradient(125deg, color-mix(in srgb, var(--rsp-surface) 94%, transparent), color-mix(in srgb, var(--rsp-accent) 9%, var(--rsp-surface)));
}

.rsp-ui .rsp-hero::after {
    width: 300px;
    height: 300px;
    position: absolute;
    right: -130px;
    bottom: -220px;
    border: 60px solid color-mix(in srgb, var(--rsp-accent) 7%, transparent);
    border-radius: 50%;
    content: "";
    pointer-events: none;
}

.rsp-ui .rsp-public-logo,
.rsp-ui .rsp-hero-mark {
    width: clamp(64px, 8vw, 94px);
    height: clamp(64px, 8vw, 94px);
    flex: 0 0 auto;
    border: 1px solid var(--rsp-border);
    border-radius: calc(var(--rsp-card-radius, 18px) - 2px);
    background: var(--rsp-surface-alt);
    object-fit: contain;
}

.rsp-ui .rsp-hero-mark {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 17px;
}

.rsp-ui .rsp-hero-mark span {
    width: 5px;
    border-radius: 999px;
    background: var(--rsp-accent);
    animation: var(--rsp-equalizer-animation, rsp-equalizer 1.25s ease-in-out infinite alternate);
}

.rsp-ui .rsp-hero-mark span:nth-child(1) { height: 35%; }
.rsp-ui .rsp-hero-mark span:nth-child(2) { height: 75%; animation-delay: -.4s; }
.rsp-ui .rsp-hero-mark span:nth-child(3) { height: 52%; animation-delay: -.8s; }
.rsp-ui .rsp-hero-mark span:nth-child(4) { height: 88%; animation-delay: -.2s; }

@keyframes rsp-equalizer {
    to { height: 100%; }
}

.rsp-ui .rsp-hero-copy {
    min-width: 0;
    position: relative;
    z-index: 1;
}

.rsp-ui .rsp-hero h1 {
    margin: 0;
    color: var(--rsp-copy);
    font-size: clamp(30px, 4.5vw, 56px);
    font-weight: 900;
    letter-spacing: -.04em;
    line-height: 1.02;
}

.rsp-ui .rsp-hero p {
    max-width: 720px;
    margin: 9px 0 0;
    color: var(--rsp-muted);
    font-size: clamp(14px, 1.6vw, 17px);
}

.rsp-ui .rsp-icon-button {
    display: inline-flex;
    min-height: 42px;
    align-items: center;
    gap: 8px;
    padding: 8px 13px;
    position: relative;
    z-index: 1;
    border: 1px solid var(--rsp-border-strong);
    border-radius: 999px;
    background: var(--rsp-surface-alt);
    background: color-mix(in srgb, var(--rsp-surface-alt) 84%, transparent);
    color: var(--rsp-copy);
    cursor: pointer;
    font-size: 13px;
    font-weight: 750;
    transition: var(--rsp-motion, transform .18s ease, border-color .18s ease);
}

.rsp-ui .rsp-icon-button:hover {
    border-color: var(--rsp-accent);
    transform: var(--rsp-hover-lift, translateY(-2px));
}

.rsp-ui .rsp-hero-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    position: relative;
    z-index: 2;
}

.rsp-ui .rsp-hero-actions a.rsp-icon-button {
    color: var(--rsp-copy);
    text-decoration: none;
}

.rsp-ui .rsp-hero-actions a.rsp-icon-button::before,
.rsp-ui .rsp-hero-actions a.rsp-icon-button::after,
.rsp-ui .rsp-hero-actions button.rsp-icon-button::before {
    display: none !important;
    content: none !important;
}

.rsp-ui .rsp-standalone-actions {
    margin: 0 0 14px;
}

.rsp-ui .rsp-header-login-button {
    width: 42px;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    justify-content: center;
    padding: 0;
}

.rsp-ui .rsp-header-login-button svg {
    width: 19px;
    height: 19px;
    display: block;
    fill: currentColor;
}

.rsp-ui .rsp-header-login-button.is-logged-in::after {
    width: 8px;
    height: 8px;
    position: absolute;
    right: 2px;
    bottom: 2px;
    border: 2px solid var(--rsp-surface-alt);
    border-radius: 50%;
    background: #35d279;
    content: "";
}

/* Live-Panel */

.rsp-ui.rsp-streampanel,
.rsp-ui .rsp-streampanel {
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px) !important;
    background: var(--rsp-surface);
    box-shadow: none;
}

.rsp-hub-stream {
    margin-bottom: 18px;
}

.rsp-ui .rsp-stream-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 11px 16px;
    border-bottom: 1px solid var(--rsp-border);
    background: color-mix(in srgb, var(--rsp-surface-alt) 78%, transparent);
}

.rsp-ui .rsp-status-pill {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 7px;
    color: var(--rsp-muted);
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.rsp-ui .rsp-status-pill i,
.rsp-ui .rsp-live-dot {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 50%;
    background: var(--rsp-soon-badge, #777);
}

.rsp-ui .rsp-status-pill.is-live {
    color: color-mix(in srgb, var(--rsp-live-badge, #e02424) 72%, var(--rsp-copy));
}

.rsp-ui .rsp-status-pill.is-live i,
.rsp-ui .rsp-live-dot {
    background: var(--rsp-live-badge, #e02424);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--rsp-live-badge, #e02424) 16%, transparent);
    animation: rsp-pulse 1.8s ease-out infinite;
}

@keyframes rsp-pulse {
    50% { box-shadow: 0 0 0 9px transparent; }
}

.rsp-ui .rsp-nowplaying {
    min-width: 0;
    display: flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 8px;
    font-size: 13px;
}

.rsp-ui .rsp-nowplaying span {
    color: var(--rsp-faint);
}

.rsp-ui .rsp-nowplaying strong {
    max-width: min(56vw, 620px);
    overflow: hidden;
    color: var(--rsp-copy);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rsp-ui .rsp-streampanel-show {
    display: grid;
    grid-template-columns: minmax(160px, 240px) minmax(0, 1fr);
    gap: 0;
}

.rsp-ui .rsp-streampanel-image {
    min-height: 190px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: var(--rsp-surface-alt);
    color: var(--rsp-accent);
    font-size: 52px;
}

.rsp-ui .rsp-streampanel-image img {
    width: 100%;
    height: 100%;
    min-height: 190px;
    display: block;
    object-fit: cover;
}

.rsp-ui .rsp-streampanel-meta {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    padding: clamp(18px, 3vw, 30px);
}

.rsp-ui .rsp-streampanel-title {
    margin: 0 0 10px;
    color: var(--rsp-copy);
    font-size: clamp(22px, 3vw, 36px);
    font-weight: 900;
    letter-spacing: -.025em;
    line-height: 1.08;
}

.rsp-ui .rsp-streampanel-dj {
    display: flex;
    align-items: center;
    gap: 10px;
}

.rsp-ui .rsp-streampanel-avatar,
.rsp-ui .rsp-streampanel-dj img {
    width: var(--rsp-avatar-size, 42px);
    height: var(--rsp-avatar-size, 42px);
    flex: 0 0 auto;
    border: 2px solid var(--rsp-border-strong);
    border-radius: 50%;
    object-fit: cover;
}

.rsp-ui .rsp-streampanel-dj span {
    display: grid;
}

.rsp-ui .rsp-streampanel-dj small {
    color: var(--rsp-faint);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.rsp-ui .rsp-streampanel-desc {
    max-width: 760px;
    margin: 13px 0;
    color: var(--rsp-show-desc, var(--rsp-muted));
}

.rsp-ui .rsp-stream-offair {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 22px;
}

.rsp-ui .rsp-stream-offair > span {
    color: var(--rsp-accent);
    font-size: 34px;
}

.rsp-ui .rsp-stream-offair p {
    margin: 2px 0 0;
    color: var(--rsp-muted);
}

/* Datumsnavigation und Ansichtsumschalter */

.rsp-ui .rsp-hub-date-nav {
    display: block;
    width: 100%;
    margin-bottom: 18px;
}

/* WordPress-Themes dürfen die Plugin-Navigation weder mit Listenmarkern noch
 * mit eigenen Menü-/Slider-Pfeilen ergänzen. */
.rsp-ui .rsp-hub-date-nav::before,
.rsp-ui .rsp-hub-date-nav::after,
.rsp-ui .rsp-public-day-nav::before,
.rsp-ui .rsp-public-day-nav::after {
    content: none !important;
    display: none !important;
}

.rsp-ui .rsp-public-day-nav {
    display: grid;
    grid-template-columns: repeat(7, minmax(88px, 1fr));
    gap: 8px;
    margin: 0;
    padding: 3px 2px 8px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -ms-overflow-style: none;
    scrollbar-width: none;
    scroll-snap-type: inline mandatory;
    list-style: none !important;
    list-style-type: none !important;
}

.rsp-ui .rsp-public-day-nav::-webkit-scrollbar {
    display: none;
}

.rsp-ui .rsp-public-day-nav li {
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    list-style: none !important;
    list-style-type: none !important;
    scroll-snap-align: start;
}

.rsp-ui .rsp-public-day-nav li::marker {
    content: "" !important;
    font-size: 0 !important;
}

.rsp-ui .rsp-public-day-nav li::before,
.rsp-ui .rsp-public-day-nav li::after,
.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-hub-date-nav .rsp-public-day-nav > li::before,
.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-hub-date-nav .rsp-public-day-nav > li::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}

.rsp-ui .rsp-public-day-nav a::before,
.rsp-ui .rsp-public-day-nav a::after,
.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-hub-date-nav .rsp-public-day-nav > li > a::before,
.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-hub-date-nav .rsp-public-day-nav > li > a::after {
    content: none !important;
    display: none !important;
}

.rsp-ui .rsp-public-day-nav a {
    display: grid;
    min-height: 61px;
    place-content: center;
    gap: 1px;
    padding: 9px 12px;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-nav-radius, 999px);
    background: var(--rsp-nav-bg, var(--rsp-bg-table-header, #1c1c1c));
    background: color-mix(in srgb, var(--rsp-nav-bg, var(--rsp-bg-table-header, #1c1c1c)) var(--rsp-nav-opacity, 92%), transparent);
    -webkit-backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    color: var(--rsp-nav-text, var(--rsp-copy));
    box-shadow: none;
    font-family: var(--rsp-font-nav, inherit);
    font-size: var(--rsp-nav-font-size, 14px);
    font-weight: 850;
    line-height: 1.15;
    text-align: center;
    text-decoration: none;
    text-transform: var(--rsp-nav-text-transform, none);
    transition: var(--rsp-motion, transform .18s ease, border-color .18s ease);
}

.rsp-ui .rsp-public-day-nav a small {
    opacity: .66;
    font-size: 10px;
    letter-spacing: .04em;
}

.rsp-ui .rsp-public-day-nav a:hover {
    border-color: var(--rsp-accent);
    color: var(--rsp-nav-text, var(--rsp-copy));
    transform: var(--rsp-hover-lift, translateY(-2px));
}

.rsp-ui .rsp-public-day-nav .active a {
    border-color: var(--rsp-accent);
    background: var(--rsp-nav-bg-active, var(--rsp-accent));
    background: color-mix(in srgb, var(--rsp-nav-bg-active, var(--rsp-accent)) var(--rsp-nav-opacity, 92%), transparent);
    color: var(--rsp-nav-text, #fff);
    box-shadow: 0 10px 24px color-mix(in srgb, var(--rsp-accent) 20%, transparent);
}

.rsp-ui .rsp-nav-scroll {
    display: none !important;
}

.rsp-ui .rsp-selected-date {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin: 2px 0 13px;
}

.rsp-ui .rsp-selected-date-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.rsp-ui .rsp-today-link,
.rsp-ui .rsp-secondary-button {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    padding: 7px 12px;
    border: 1px solid var(--rsp-border-strong);
    border-radius: 999px;
    background: var(--rsp-surface-alt);
    color: var(--rsp-copy);
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.rsp-ui .rsp-today-link:hover,
.rsp-ui .rsp-secondary-button:hover {
    border-color: var(--rsp-accent);
    color: var(--rsp-copy);
}

.rsp-ui .rsp-selected-date h2 {
    margin: 0;
    color: var(--rsp-copy);
    font-size: clamp(20px, 2.4vw, 29px);
    font-weight: 850;
    letter-spacing: -.02em;
}

.rsp-ui .rsp-loading-indicator {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--rsp-muted);
    font-size: 12px;
}

.rsp-ui .rsp-loading-indicator span {
    width: 14px;
    height: 14px;
    border: 2px solid var(--rsp-border-strong);
    border-top-color: var(--rsp-accent);
    border-radius: 50%;
    animation: rsp-spin .7s linear infinite;
}

@keyframes rsp-spin {
    to { transform: rotate(360deg); }
}

.rsp-ui .rsp-view-switcher {
    width: max-content;
    max-width: 100%;
    display: flex;
    gap: 4px;
    margin: 0 0 15px;
    padding: 4px;
    border: 1px solid var(--rsp-border);
    border-radius: 999px;
    background: var(--rsp-surface-alt);
}

.rsp-ui .rsp-view-switcher button {
    display: inline-flex;
    min-height: 37px;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: var(--rsp-muted);
    cursor: pointer;
    font-size: 13px;
    font-weight: 800;
}

.rsp-ui .rsp-view-switcher button.is-active {
    background: var(--rsp-surface);
    color: var(--rsp-copy);
    box-shadow: 0 4px 14px rgba(0,0,0,.16);
}

.rsp-ui .rsp-hub-content,
.rsp-ui .rsp-hub-layout,
.rsp-ui .rsp-view-panels,
.rsp-ui .rsp-view-panel {
    min-width: 0;
}

.rsp-ui .rsp-hub-layout.has-sidebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 310px);
    gap: 18px;
}

.rsp-ui .rsp-hub-sidebar {
    align-self: start;
    position: sticky;
    top: 24px;
}

/* Tageskarten */

.rsp-ui.rsp-schedule-day,
.rsp-ui.rsp-schedule-week,
.rsp-ui.rsp-schedule-table {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0 !important;
    background: transparent;
    box-shadow: none;
}

.rsp-ui .rsp-section-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 15px;
}

.rsp-ui .rsp-section-heading h2,
.rsp-ui .rsp-mini-heading h3 {
    margin: 0;
    color: var(--rsp-copy);
    font-weight: 850;
    letter-spacing: -.02em;
}

.rsp-ui .rsp-result-count {
    display: inline-flex;
    min-height: 30px;
    align-items: center;
    padding: 5px 10px;
    border: 1px solid var(--rsp-border);
    border-radius: 999px;
    color: var(--rsp-muted);
    font-size: 11px;
    font-weight: 750;
    white-space: nowrap;
}

.rsp-ui .rsp-day-nav {
    display: flex;
    gap: 7px;
    margin: 0 0 16px;
    overflow-x: auto;
}

.rsp-ui .rsp-day-nav-link {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-nav-radius, 999px);
    background: color-mix(in srgb, var(--rsp-nav-bg, var(--rsp-bg-table-header, #1c1c1c)) var(--rsp-nav-opacity, 92%), transparent);
    color: var(--rsp-nav-text);
    text-decoration: none;
}

.rsp-ui .rsp-schedule-layout.has-sidebar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 310px);
    gap: 18px;
}

.rsp-ui .rsp-slot-list {
    display: grid;
    gap: 13px;
}

.rsp-ui .rsp-slot {
    display: grid;
    grid-template-columns: clamp(150px, 20vw, 250px) minmax(0, 1fr);
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px) !important;
    background: var(--rsp-surface);
    box-shadow: 0 7px 24px rgba(0,0,0,.13);
    transition: var(--rsp-motion, transform .18s ease, border-color .18s ease);
}

.rsp-ui .rsp-slot:hover {
    border-color: color-mix(in srgb, var(--rsp-accent) 68%, var(--rsp-border));
    transform: var(--rsp-hover-lift, translateY(-2px));
}

.rsp-ui .rsp-slot.is-live {
    border-color: color-mix(in srgb, var(--rsp-live-badge) 54%, var(--rsp-border));
}

.rsp-ui .rsp-slot-media {
    min-height: 210px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
    background:
        linear-gradient(145deg, var(--rsp-surface-alt), color-mix(in srgb, var(--rsp-accent) 12%, var(--rsp-surface-alt)));
}

.rsp-ui .rsp-slot-media img {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
}

.rsp-ui .rsp-slot-placeholder {
    color: var(--rsp-accent);
    font-size: 54px;
}

.rsp-ui .rsp-slot-live {
    position: absolute;
    top: 12px;
    left: 12px;
}

.rsp-ui .rsp-live-badge,
.rsp-ui .rsp-onair-badge,
.rsp-ui .rsp-event-badge,
.rsp-ui .rsp-today-badge,
.rsp-ui .rsp-slot-tag {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .06em;
    line-height: 1.2;
    text-transform: uppercase;
}

.rsp-ui .rsp-live-badge,
.rsp-ui .rsp-onair-badge {
    background: var(--rsp-live-badge, #e02424);
    color: var(--rsp-live-contrast, #fff);
}

.rsp-ui .rsp-event-badge {
    background: var(--rsp-accent);
    color: var(--rsp-accent-contrast, #fff);
}

.rsp-ui .rsp-today-badge,
.rsp-ui .rsp-slot-tag {
    border: 1px solid var(--rsp-border-strong);
    background: var(--rsp-surface-alt);
    color: var(--rsp-muted);
}

.rsp-ui .rsp-slot-content {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 10px;
    padding: clamp(17px, 2.5vw, 26px);
}

.rsp-ui .rsp-slot-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.rsp-ui .rsp-slot-time {
    color: var(--rsp-accent);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .04em;
}

.rsp-ui .rsp-slot-time span {
    color: var(--rsp-muted);
    font-weight: 700;
}

.rsp-ui .rsp-slot-tags {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 5px;
}

.rsp-ui .rsp-slot-title {
    margin: 0;
    color: var(--rsp-copy);
    font-size: clamp(21px, var(--rsp-show-title-size, 2.5vw), 54px);
    font-weight: 900;
    letter-spacing: -.025em;
    line-height: 1.1;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.rsp-ui .rsp-slot-dj {
    display: flex;
    align-items: center;
    gap: 10px;
}

.rsp-ui .rsp-slot-dj img {
    width: var(--rsp-avatar-size, 42px);
    height: var(--rsp-avatar-size, 42px);
    flex: 0 0 auto;
    border: 2px solid var(--rsp-border-strong);
    border-radius: 50%;
    object-fit: cover;
}

.rsp-ui .rsp-slot-dj > span {
    display: grid;
}

.rsp-ui .rsp-slot-dj small {
    color: var(--rsp-faint);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.rsp-ui .rsp-slot-description {
    color: var(--rsp-show-desc, var(--rsp-muted));
}

.rsp-ui .rsp-slot-description p {
    margin: 0;
}

.rsp-ui .rsp-availability-note {
    color: var(--rsp-faint);
    font-size: 11px;
    font-weight: 650;
}

.rsp-ui .rsp-empty-state {
    display: grid;
    min-height: 230px;
    place-items: center;
    align-content: center;
    gap: 6px;
    padding: 30px;
    border: 1px dashed var(--rsp-border-strong);
    border-radius: var(--rsp-card-radius, 18px);
    background: color-mix(in srgb, var(--rsp-surface) 76%, transparent);
    text-align: center;
}

.rsp-ui .rsp-empty-state h3,
.rsp-ui .rsp-empty-state p {
    margin: 0;
}

.rsp-ui .rsp-empty-state p {
    max-width: 520px;
    color: var(--rsp-muted);
}

.rsp-ui .rsp-empty-icon {
    color: var(--rsp-accent);
    font-size: 38px;
}

.rsp-ui .rsp-empty-state-compact {
    min-height: 150px;
}

/* Wochenansicht */

.rsp-ui .rsp-week-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(180px, 1fr));
    gap: 10px;
    overflow-x: auto;
    padding: 2px 2px 10px;
    scroll-snap-type: inline mandatory;
    scrollbar-width: thin;
    overscroll-behavior-inline: contain;
}

.rsp-ui .rsp-week-day {
    min-width: 180px;
    min-height: 245px;
    padding: 13px;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-surface);
    scroll-snap-align: start;
}

.rsp-ui .rsp-week-day.is-today {
    border-color: color-mix(in srgb, var(--rsp-accent) 62%, var(--rsp-border));
    background: linear-gradient(180deg, var(--rsp-accent-soft), var(--rsp-surface) 42%);
}

.rsp-ui .rsp-week-day-header {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 8px;
    margin: 0 0 12px;
    padding: 0 1px 10px;
    border-bottom: 1px solid var(--rsp-border);
}

.rsp-ui .rsp-week-day-header > div {
    display: grid;
}

.rsp-ui .rsp-week-day-header h3 {
    margin: 0;
    color: var(--rsp-copy);
    font-size: 14px;
    font-weight: 850;
}

.rsp-ui .rsp-week-day-header small {
    color: var(--rsp-faint);
    font-size: 11px;
}

.rsp-ui .rsp-week-slot-list {
    display: grid;
    gap: 8px;
}

.rsp-ui .rsp-week-slot {
    display: grid;
    grid-template-columns: 45px minmax(0, 1fr);
    gap: 8px;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--rsp-border);
    border-radius: calc(var(--rsp-card-radius, 18px) - 7px) !important;
    background: var(--rsp-surface-alt);
    box-shadow: none;
}

.rsp-ui .rsp-week-slot-time {
    color: var(--rsp-accent);
    font-size: 11px;
    font-weight: 850;
    line-height: 1.25;
}

.rsp-ui .rsp-week-slot-time small {
    display: block;
    color: var(--rsp-faint);
    font-size: 9px;
}

.rsp-ui .rsp-week-slot-title {
    color: var(--rsp-copy);
    font-size: 12px;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.rsp-ui .rsp-week-slot-dj {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 5px;
    color: var(--rsp-muted);
    font-size: 10px;
}

.rsp-ui .rsp-week-slot-dj img {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
}

.rsp-ui .rsp-week-empty {
    min-height: 150px;
    display: grid;
    place-content: center;
    color: var(--rsp-faint);
    text-align: center;
}

.rsp-ui .rsp-week-empty p {
    margin: 5px 0 0;
    font-size: 11px;
}

/* Listenansicht */

.rsp-ui .rsp-table-nav {
    margin-bottom: 13px;
}

.rsp-ui .rsp-table-nav .nav-pills {
    display: flex;
    gap: 7px;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    list-style: none;
}

.rsp-ui .rsp-table-nav .nav-item {
    margin: 0;
}

.rsp-ui .rsp-table-nav .rsp-day-nav-link {
    display: grid;
    min-width: 78px;
    place-items: center;
}

.rsp-ui .rsp-day-nav-label-sub {
    opacity: .62;
    font-size: 9px;
}

.rsp-ui .rsp-day-select-wrapper {
    display: none;
}

.rsp-ui .rsp-table-wrap {
    overflow: auto;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-surface);
}

.rsp-ui .rsp-table {
    width: 100%;
    margin: 0;
    border: 0;
    border-collapse: collapse;
    background: transparent;
    color: var(--rsp-copy);
}

.rsp-ui .rsp-table th,
.rsp-ui .rsp-table td {
    padding: 14px 16px;
    border: 0;
    border-bottom: 1px solid var(--rsp-border);
    background: transparent;
    color: var(--rsp-copy);
    vertical-align: middle;
}

.rsp-ui .rsp-table th {
    background: var(--rsp-surface-alt);
    color: var(--rsp-faint);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.rsp-ui .rsp-table tbody tr:last-child td {
    border-bottom: 0;
}

.rsp-ui .rsp-table-row {
    transition: var(--rsp-motion, background .18s ease);
}

.rsp-ui .rsp-table-row:hover td {
    background: color-mix(in srgb, var(--rsp-accent) 5%, transparent);
}

.rsp-ui .rsp-table-row.is-live td:first-child {
    box-shadow: inset 3px 0 var(--rsp-live-badge, #e02424);
}

.rsp-ui .rsp-table-col-time {
    width: 145px;
}

.rsp-ui .rsp-time-range {
    display: block;
    color: var(--rsp-accent);
    font-weight: 850;
    white-space: nowrap;
}

.rsp-ui .rsp-time-range small {
    color: var(--rsp-muted);
}

.rsp-ui .rsp-table-show-cell {
    display: flex;
    align-items: center;
    gap: 13px;
}

.rsp-ui .rsp-table-show-image {
    width: var(--rsp-show-image-size, 72px);
    height: var(--rsp-show-image-size, 72px);
    max-width: 82px;
    max-height: 82px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 12px;
    background: var(--rsp-surface-alt);
    color: var(--rsp-accent);
    font-size: 24px;
}

.rsp-ui .rsp-table-show-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rsp-ui .rsp-table-show-text {
    min-width: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
}

.rsp-ui .rsp-table-show-title {
    max-width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--rsp-copy);
    cursor: default;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.3;
    text-align: left;
}

.rsp-ui button.rsp-table-show-title {
    cursor: pointer;
}

.rsp-ui button.rsp-table-show-title:hover {
    color: var(--rsp-accent);
}

.rsp-ui .rsp-table-show-desc {
    width: 100%;
    display: block;
    color: var(--rsp-show-desc, var(--rsp-muted));
    font-size: 12px;
}

.rsp-ui .rsp-table-dj-cell {
    display: flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
}

.rsp-ui .rsp-table-avatar {
    width: var(--rsp-avatar-size, 38px);
    height: var(--rsp-avatar-size, 38px);
    flex: 0 0 auto;
    border: 2px solid var(--rsp-border-strong);
    border-radius: 50%;
    object-fit: cover;
}

/* Wunschbox und Formulare */

.rsp-ui.rsp-studiobox-standalone,
.rsp-ui.rsp-login-widget,
.rsp-ui.rsp-apply-wrapper,
.rsp-ui.rsp-filebox {
    padding: clamp(18px, 3vw, 30px);
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px) !important;
    background: var(--rsp-surface);
    box-shadow: var(--rsp-card-shadow, 0 10px 30px rgba(0,0,0,.24));
}

.rsp-ui .rsp-mini-heading {
    margin-bottom: 18px;
}

.rsp-ui .rsp-mini-heading h3 small {
    display: block;
    margin-top: 3px;
    color: var(--rsp-muted);
    font-size: 13px;
    font-weight: 650;
}

.rsp-ui .rsp-mini-heading p {
    margin: 6px 0 0;
    color: var(--rsp-muted);
}

.rsp-ui .rsp-studiobox-form {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
}

.rsp-ui .rsp-form-grid,
.rsp-ui .rsp-apply-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.rsp-ui .rsp-form-row {
    display: grid;
    gap: 6px;
    margin: 0;
}

.rsp-ui .rsp-form-row-full {
    grid-column: 1 / -1;
}

.rsp-ui .rsp-form-row label {
    color: var(--rsp-muted);
    font-size: 12px;
    font-weight: 750;
}

.rsp-ui .rsp-form-row label b,
.rsp-ui .rsp-choice-card b {
    color: var(--rsp-accent);
}

.rsp-ui .rsp-form-row :where(input, textarea, select),
.rsp-ui .rsp-filebox-filter :where(input, select) {
    width: 100%;
    min-height: 45px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--rsp-border-strong);
    border-radius: 11px;
    background: var(--rsp-bg-main, #111);
    background: color-mix(in srgb, var(--rsp-bg-main, #111) var(--rsp-page-opacity, 100%), transparent);
    color: var(--rsp-copy);
    box-shadow: none;
}

.rsp-ui .rsp-form-row textarea {
    min-height: 105px;
    resize: vertical;
}

.rsp-ui .rsp-form-row :where(input, textarea, select):focus {
    border-color: var(--rsp-accent);
    outline: 3px solid var(--rsp-accent-soft);
}

.rsp-ui .rsp-choice-card {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    margin: 14px 0;
    padding: 13px;
    border: 1px solid var(--rsp-border);
    border-radius: 12px;
    background: var(--rsp-surface-alt);
    color: var(--rsp-copy);
    cursor: pointer;
}

.rsp-ui .rsp-choice-card input {
    width: 18px;
    height: 18px;
    margin: 2px 0 0;
    accent-color: var(--rsp-accent);
}

.rsp-ui .rsp-choice-card > span {
    display: grid;
}

.rsp-ui .rsp-choice-card small {
    color: var(--rsp-muted);
}

.rsp-ui .rsp-form-actions,
.rsp-ui .rsp-apply-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 15px;
}

.rsp-ui .rsp-studiobox-form button[type="submit"],
.rsp-ui .rsp-wunschbox-btn {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: var(--rsp-wb-btn-gap, 8px);
    padding: var(--rsp-wb-btn-pad-y, 0px) var(--rsp-wb-btn-pad-x, 14px);
    border: 0;
    border-radius: var(--rsp-wb-btn-radius, 999px);
    background: var(--rsp-wb-btn-bg, var(--rsp-accent));
    color: var(--rsp-wb-btn-text, #fff);
    cursor: pointer;
    font-weight: 800;
    text-decoration: none;
    text-align: center;
    white-space: normal;
}

.rsp-ui .rsp-wunschbox-btn {
    max-width: 100%;
}

.rsp-ui .rsp-wunschbox-btn:hover,
.rsp-ui .rsp-studiobox-form button[type="submit"]:hover {
    background: var(--rsp-wb-btn-hover-bg, var(--rsp-wb-btn-bg, var(--rsp-accent)));
    color: var(--rsp-wb-btn-hover-text, var(--rsp-wb-btn-text, #fff));
    transform: var(--rsp-hover-lift-small, translateY(-1px));
}

.rsp-ui .rsp-wunschbox-btn:active,
.rsp-ui .rsp-studiobox-form button[type="submit"]:active {
    transform: none;
}

.rsp-ui .rsp-studiobox-result,
.rsp-ui .rsp-apply-msg {
    color: var(--rsp-muted);
    font-size: 13px;
    font-weight: 700;
}

.rsp-ui .rsp-msg-success,
.rsp-ui .rsp-apply-msg.ok {
    color: #35d279;
}

.rsp-ui .rsp-msg-error,
.rsp-ui .rsp-apply-msg.err {
    color: #ff6b72;
}

.rsp-ui .rsp-form-hero {
    display: flex;
    align-items: center;
    gap: 17px;
    margin-bottom: 24px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--rsp-border);
}

/* Eigenstaendige Bewerbungsseite */

.rsp-ui .rsp-application-layout {
    display: grid;
    grid-template-columns: minmax(250px, 340px) minmax(0, 1fr);
    align-items: start;
    gap: clamp(16px, 2.5vw, 28px);
}

.rsp-ui .rsp-application-guide {
    padding: clamp(20px, 3vw, 30px);
    position: sticky;
    top: 18px;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-surface);
    box-shadow: var(--rsp-card-shadow, 0 10px 30px rgba(0,0,0,.24));
}

.rsp-ui .rsp-application-guide h2,
.rsp-ui .rsp-application-form-heading h2 {
    margin: 0;
    font-size: clamp(23px, 3vw, 34px);
    font-weight: 900;
    letter-spacing: -.025em;
    line-height: 1.1;
}

.rsp-ui .rsp-application-guide > p,
.rsp-ui .rsp-application-form-heading p {
    margin: 9px 0 0;
    color: var(--rsp-muted);
}

.rsp-ui .rsp-application-benefits {
    display: grid;
    gap: 13px;
    margin: 24px 0;
    padding: 0;
    list-style: none;
}

.rsp-ui .rsp-application-benefits li {
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    align-items: start;
    gap: 11px;
    margin: 0;
    padding: 0;
}

.rsp-ui .rsp-application-benefits li::before,
.rsp-ui .rsp-application-benefits li::after {
    display: none !important;
    content: none !important;
}

.rsp-ui .rsp-application-benefits li > span {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--rsp-accent-soft);
    color: var(--rsp-accent);
    font-weight: 900;
}

.rsp-ui .rsp-application-benefits li div {
    display: grid;
    gap: 2px;
}

.rsp-ui .rsp-application-benefits small {
    color: var(--rsp-muted);
    line-height: 1.45;
}

.rsp-ui .rsp-application-note {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    gap: 10px;
    padding: 13px;
    border: 1px solid var(--rsp-border);
    border-radius: 12px;
    background: var(--rsp-surface-alt);
}

.rsp-ui .rsp-application-note > span {
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--rsp-accent);
    color: var(--rsp-accent-contrast, #fff);
    font-size: 12px;
    font-weight: 900;
}

.rsp-ui .rsp-application-note p {
    margin: 0;
    color: var(--rsp-muted);
    font-size: 12px;
}

.rsp-ui .rsp-application-form-column {
    min-width: 0;
}

.rsp-ui .rsp-application-form-heading {
    margin: 0 0 16px;
    padding: 0 4px;
}

.rsp-ui .rsp-application-form-column > .rsp-apply-wrapper {
    width: 100%;
}

.rsp-ui .rsp-form-hero-icon {
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: var(--rsp-accent-soft);
    font-size: 27px;
}

.rsp-ui.rsp-apply-wrapper .rsp-form-hero-icon {
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
}

.rsp-ui .rsp-form-hero h2,
.rsp-ui .rsp-form-hero p {
    margin: 0;
}

.rsp-ui .rsp-form-hero h2 {
    font-size: clamp(23px, 3vw, 34px);
    font-weight: 900;
    letter-spacing: -.025em;
}

.rsp-ui .rsp-form-hero p {
    max-width: 720px;
    margin-top: 4px;
    color: var(--rsp-muted);
}

.rsp-ui .rsp-apply-form {
    display: grid;
    gap: 18px;
}

.rsp-ui .rsp-form-section {
    padding: clamp(16px, 2.5vw, 24px);
    border: 1px solid var(--rsp-border);
    border-radius: calc(var(--rsp-card-radius, 18px) - 3px);
    background: var(--rsp-surface-alt);
}

.rsp-ui .rsp-form-section-title {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-bottom: 17px;
}

.rsp-ui .rsp-form-section-title > span {
    width: 31px;
    height: 31px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--rsp-accent);
    color: var(--rsp-accent-contrast, #fff);
    font-size: 12px;
    font-weight: 900;
}

.rsp-ui .rsp-form-section-title h3,
.rsp-ui .rsp-form-section-title p {
    margin: 0;
}

.rsp-ui .rsp-form-section-title h3 {
    font-size: 16px;
}

.rsp-ui .rsp-form-section-title p {
    color: var(--rsp-muted);
    font-size: 12px;
}

.rsp-ui .rsp-honeypot {
    width: 1px;
    height: 1px;
    overflow: hidden;
    position: absolute;
    left: -10000px;
}

/* Login */

.rsp-ui .rsp-login-form {
    display: grid;
    gap: 14px;
}

.rsp-ui .rsp-login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    color: var(--rsp-muted);
    font-size: 12px;
}

.rsp-ui .rsp-check-label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.rsp-ui .rsp-login-options a,
.rsp-ui .rsp-text-link {
    color: var(--rsp-accent);
}

.rsp-ui .rsp-login-success {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 13px;
}

.rsp-ui .rsp-login-success img {
    width: 62px;
    height: 62px;
    border-radius: 50%;
}

.rsp-ui .rsp-login-success h3 {
    margin: 0;
}

.rsp-ui .rsp-text-link {
    display: inline-block;
    margin-top: 14px;
    font-size: 12px;
}

/* Today-Panel */

.rsp-ui.rsp-today-panel {
    padding: 17px;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-surface);
}

.rsp-ui .rsp-today-list {
    display: grid;
    gap: 7px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.rsp-ui .rsp-today-list li {
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) 10px;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 10px;
    border: 1px solid var(--rsp-border);
    border-radius: 12px;
    background: var(--rsp-surface-alt);
}

.rsp-ui .rsp-today-list time {
    color: var(--rsp-accent);
    font-size: 11px;
    font-weight: 850;
}

.rsp-ui .rsp-today-list time small {
    display: block;
    color: var(--rsp-faint);
    font-size: 9px;
}

.rsp-ui .rsp-today-copy {
    min-width: 0;
    display: grid;
}

.rsp-ui .rsp-today-copy strong {
    overflow: hidden;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rsp-ui .rsp-today-copy small {
    color: var(--rsp-muted);
    font-size: 10px;
}

.rsp-ui .rsp-mini-empty {
    display: grid;
    place-items: center;
    padding: 22px;
    color: var(--rsp-muted);
    text-align: center;
}

/* Setcard */

.rsp-ui.rsp-setcard {
    display: grid;
    grid-template-columns: minmax(220px, 34%) minmax(0, 1fr);
    gap: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--rsp-border);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-surface);
    box-shadow: var(--rsp-card-shadow);
}

.rsp-ui .rsp-setcard-visual {
    min-height: 360px;
    display: grid;
    place-items: center;
    overflow: hidden;
    position: relative;
    background: var(--rsp-surface-alt);
    color: var(--rsp-accent);
    font-size: 54px;
}

.rsp-ui .rsp-setcard-visual img {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
    object-fit: cover;
}

.rsp-ui .rsp-setcard-role {
    position: absolute;
    right: 13px;
    bottom: 13px;
    padding: 5px 10px;
    border-radius: 999px;
    background: var(--rsp-accent);
    color: var(--rsp-accent-contrast, #fff);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.rsp-ui .rsp-setcard-info {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 16px;
    padding: clamp(22px, 4vw, 42px);
}

.rsp-ui .rsp-setcard-info h2,
.rsp-ui .rsp-setcard-info h3,
.rsp-ui .rsp-setcard-info p {
    margin: 0;
}

.rsp-ui .rsp-setcard-info h2 {
    font-size: clamp(27px, 4vw, 43px);
    font-weight: 900;
    letter-spacing: -.035em;
}

.rsp-ui .rsp-setcard-info h3 {
    margin-bottom: 3px;
    font-size: 12px;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.rsp-ui .rsp-setcard-info p {
    color: var(--rsp-muted);
}

/* Filebox */

.rsp-ui .rsp-filebox-hero {
    align-items: center;
}

.rsp-ui .rsp-filebox-hero .rsp-result-count {
    margin-left: auto;
}

.rsp-ui .rsp-filebox-filter {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(190px, auto) auto auto;
    align-items: center;
    gap: 11px;
    margin: 0 0 17px;
    padding: 12px 14px;
    border: 1px solid var(--rsp-border);
    border-radius: 13px;
    background: var(--rsp-surface-alt);
}

.rsp-ui .rsp-filebox-filter label {
    display: grid;
    gap: 4px;
    color: var(--rsp-muted);
    font-size: 12px;
    font-weight: 750;
}

.rsp-ui .rsp-filebox-filter select {
    width: 100%;
    min-width: 190px;
}

.rsp-ui .rsp-filebox-filter input[type="search"] {
    width: 100%;
    min-width: 0;
}

.rsp-ui .rsp-file-card-badges {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 6px;
}

.rsp-ui .rsp-file-card-badges span,
.rsp-ui .rsp-file-card-badges strong {
    padding: 3px 6px;
    border-radius: 999px;
    background: var(--rsp-surface);
    color: var(--rsp-muted);
    font-size: 8px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.rsp-ui .rsp-file-card-badges strong {
    background: var(--rsp-accent);
    color: var(--rsp-accent-contrast, #fff);
}

.rsp-ui .rsp-file-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr));
    gap: 13px;
}

.rsp-ui .rsp-file-card {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 13px;
    padding: 16px;
    border: 1px solid var(--rsp-border);
    border-radius: calc(var(--rsp-card-radius, 18px) - 2px);
    background: var(--rsp-surface-alt);
}

.rsp-ui .rsp-file-type {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: var(--rsp-accent-soft);
    color: var(--rsp-accent);
    font-size: 10px;
    font-weight: 900;
}

.rsp-ui .rsp-file-card h3,
.rsp-ui .rsp-file-card p {
    margin: 0;
}

.rsp-ui .rsp-file-card h3 {
    font-size: 16px;
}

.rsp-ui .rsp-file-card p {
    margin-top: 4px;
    color: var(--rsp-muted);
    font-size: 12px;
}

.rsp-ui .rsp-file-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 10px;
    margin-top: 9px;
    color: var(--rsp-faint);
    font-size: 10px;
}

.rsp-ui .rsp-file-changelog {
    margin-top: 9px;
    color: var(--rsp-muted);
    font-size: 11px;
}

.rsp-ui .rsp-file-changelog summary {
    cursor: pointer;
    font-weight: 750;
}

.rsp-ui .rsp-file-download {
    grid-column: 1 / -1;
    justify-self: start;
}

/* Meldungen */

.rsp-ui.rsp-notice {
    padding: 15px 17px;
    border: 1px solid var(--rsp-border);
    border-left: 4px solid var(--rsp-accent);
    border-radius: 12px;
    background: var(--rsp-surface);
    color: var(--rsp-copy);
}

.rsp-ui.rsp-notice-warning {
    border-left-color: #f0b429;
}

/* Modals */

.rsp-ui .rsp-slot-modal,
.rsp-ui .rsp-wunschbox-modal,
.rsp-slot-modal.rsp-ui,
.rsp-wunschbox-modal.rsp-ui {
    display: grid;
    place-items: center;
    padding: 18px;
    position: fixed;
    z-index: 999999;
    inset: 0;
}

.rsp-ui .rsp-slot-modal-backdrop,
.rsp-ui .rsp-wunschbox-modal-backdrop {
    width: 100%;
    height: 100%;
    padding: 0;
    position: absolute;
    inset: 0;
    border: 0;
    border-radius: 0;
    background: rgba(0, 0, 0, .82);
    background: color-mix(in srgb, #000 var(--rsp-overlay-opacity, 82%), transparent);
    -webkit-backdrop-filter: blur(calc(5px + var(--rsp-glass-blur, 0px)));
    backdrop-filter: blur(calc(5px + var(--rsp-glass-blur, 0px)));
}

.rsp-ui .rsp-slot-modal-dialog,
.rsp-ui .rsp-wunschbox-modal-dialog {
    width: min(100%, 680px);
    max-height: min(88vh, 850px);
    overflow: auto;
    position: relative;
    border: 1px solid var(--rsp-border-strong);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-bg-main, #111);
    background: color-mix(in srgb, var(--rsp-bg-main) var(--rsp-surface-opacity, 96%), transparent);
    -webkit-backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    color: var(--rsp-copy);
    box-shadow: 0 28px 80px rgba(0,0,0,.52);
}

.rsp-ui .rsp-slot-modal-header,
.rsp-ui .rsp-wunschbox-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    padding: 15px 18px;
    position: sticky;
    z-index: 2;
    top: 0;
    border-bottom: 1px solid var(--rsp-border);
    background: var(--rsp-bg-main, #111);
    background: color-mix(in srgb, var(--rsp-bg-main) 92%, transparent);
    backdrop-filter: blur(12px);
}

.rsp-ui .rsp-slot-modal-header h3,
.rsp-ui .rsp-wunschbox-modal-header h3 {
    margin: 0;
    font-size: 18px;
}

.rsp-ui .rsp-slot-modal-close,
.rsp-ui .rsp-wunschbox-modal-close {
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--rsp-border);
    border-radius: 50%;
    background: var(--rsp-surface);
    color: var(--rsp-copy);
    cursor: pointer;
    font-size: 22px;
}

.rsp-ui .rsp-slot-modal-body,
.rsp-ui .rsp-wunschbox-modal-body {
    padding: 18px;
}

.rsp-ui img.rsp-slot-modal-image {
    width: 100%;
    max-height: 360px;
    margin-bottom: 16px;
    border-radius: 13px;
    object-fit: cover;
}

/* Kleiner Moderator-Login im oeffentlichen Sendeplan */

.rsp-ui .rsp-login-modal,
.rsp-login-modal.rsp-ui {
    display: grid;
    place-items: center;
    padding: 18px;
    position: fixed;
    z-index: 999999;
    inset: 0;
}

.rsp-ui .rsp-login-modal-backdrop {
    width: 100%;
    height: 100%;
    padding: 0;
    position: absolute;
    inset: 0;
    border: 0;
    border-radius: 0;
    background: rgba(0, 0, 0, .82);
    background: color-mix(in srgb, #000 var(--rsp-overlay-opacity, 82%), transparent);
    -webkit-backdrop-filter: blur(calc(5px + var(--rsp-glass-blur, 0px)));
    backdrop-filter: blur(calc(5px + var(--rsp-glass-blur, 0px)));
    cursor: default;
}

.rsp-ui .rsp-login-modal-dialog {
    width: min(100%, 480px);
    max-height: min(88vh, 720px);
    overflow: auto;
    position: relative;
    border: 1px solid var(--rsp-border-strong);
    border-radius: var(--rsp-card-radius, 18px);
    background: var(--rsp-bg-main, #111);
    background: color-mix(in srgb, var(--rsp-bg-main, #111) var(--rsp-surface-opacity, 96%), transparent);
    -webkit-backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    backdrop-filter: blur(var(--rsp-glass-blur, 0px));
    color: var(--rsp-copy);
    box-shadow: 0 28px 80px rgba(0,0,0,.52);
}

.rsp-ui .rsp-login-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 13px;
    padding: 16px 18px;
    position: sticky;
    z-index: 2;
    top: 0;
    border-bottom: 1px solid var(--rsp-border);
    background: var(--rsp-bg-main, #111);
    background: color-mix(in srgb, var(--rsp-bg-main, #111) 92%, transparent);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.rsp-ui .rsp-login-modal-header h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 900;
}

.rsp-ui .rsp-login-modal-close {
    width: 36px;
    height: 36px;
    min-height: 36px;
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--rsp-border);
    border-radius: 50%;
    background: var(--rsp-surface);
    color: var(--rsp-copy);
    cursor: pointer;
    font-size: 22px;
}

.rsp-ui .rsp-login-modal-body {
    padding: clamp(18px, 4vw, 26px);
}

.rsp-ui .rsp-login-modal-intro {
    margin: 0 0 18px;
    color: var(--rsp-muted);
}

.rsp-ui .rsp-login-modal-body .rsp-primary-button {
    width: 100%;
}

body.rsp-modal-open {
    overflow: hidden;
}

/* Mobile */

@media (max-width: 900px) {
    .rsp-ui .rsp-hub-layout.has-sidebar,
    .rsp-ui .rsp-schedule-layout.has-sidebar {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-application-layout {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-application-guide {
        position: static;
    }

    .rsp-ui .rsp-hub-sidebar {
        position: static;
    }

    .rsp-ui .rsp-week-grid {
        grid-template-columns: repeat(7, minmax(210px, 1fr));
    }
}

@media (max-width: 720px) {
    .rsp-template-main {
        padding: 7px;
    }

    .rsp-frontend.rsp-public-wrapper {
        padding: 9px;
        border-radius: var(--rsp-card-radius, 18px) !important;
    }

    .rsp-ui .rsp-hero {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 17px;
    }

    .rsp-ui .rsp-hero-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .rsp-ui .rsp-hero .rsp-icon-button {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .rsp-ui .rsp-public-logo,
    .rsp-ui .rsp-hero-mark {
        width: 58px;
        height: 58px;
        border-radius: 14px;
    }

    .rsp-ui .rsp-hero h1 {
        font-size: clamp(27px, 10vw, 40px);
    }

    .rsp-ui .rsp-public-day-nav {
        grid-template-columns: repeat(7, minmax(82px, 1fr));
    }

    .rsp-ui .rsp-streampanel-show {
        grid-template-columns: 112px minmax(0, 1fr);
    }

    .rsp-ui .rsp-streampanel-image,
    .rsp-ui .rsp-streampanel-image img {
        min-height: 170px;
    }

    .rsp-ui .rsp-streampanel-meta {
        padding: 15px;
    }

    .rsp-ui .rsp-streampanel-title {
        font-size: 20px;
    }

    .rsp-ui .rsp-streampanel-desc {
        display: none;
    }

    .rsp-ui .rsp-stream-status {
        align-items: flex-start;
    }

    .rsp-ui .rsp-nowplaying {
        display: grid;
        gap: 0;
        text-align: right;
    }

    .rsp-ui .rsp-nowplaying strong {
        max-width: 54vw;
    }

    .rsp-ui .rsp-slot {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-slot-title {
        font-size: clamp(20px, var(--rsp-show-title-size, 7vw), 40px);
    }

    .rsp-ui .rsp-slot-media {
        min-height: 180px;
        aspect-ratio: 16 / 8;
    }

    .rsp-ui .rsp-slot-header {
        align-items: flex-start;
    }

    .rsp-ui .rsp-form-grid,
    .rsp-ui .rsp-apply-grid {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-form-row-full {
        grid-column: auto;
    }

    .rsp-ui.rsp-setcard {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-setcard-visual {
        min-height: 300px;
    }

    .rsp-ui .rsp-table-nav .nav-pills {
        display: none;
    }

    .rsp-ui .rsp-day-select-wrapper {
        display: block;
    }

    .rsp-ui .rsp-day-select {
        width: 100%;
        min-height: 46px;
        border: 1px solid var(--rsp-border-strong);
        border-radius: 12px;
        background: var(--rsp-surface);
        color: var(--rsp-copy);
    }

    .rsp-ui .rsp-table-wrap {
        overflow: visible;
        border: 0;
        background: transparent;
    }

    .rsp-ui .rsp-table,
    .rsp-ui .rsp-table tbody,
    .rsp-ui .rsp-table tr,
    .rsp-ui .rsp-table td {
        display: block;
        width: 100%;
    }

    .rsp-ui .rsp-table thead {
        width: 1px;
        height: 1px;
        overflow: hidden;
        position: absolute;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    .rsp-ui .rsp-table-row {
        margin-bottom: 10px;
        overflow: hidden;
        border: 1px solid var(--rsp-border);
        border-radius: var(--rsp-card-radius, 18px);
        background: var(--rsp-surface);
    }

    .rsp-ui .rsp-table th,
    .rsp-ui .rsp-table td {
        padding: 12px 14px;
        border-bottom: 1px solid var(--rsp-border);
    }

    .rsp-ui .rsp-table td::before {
        display: block;
        margin-bottom: 4px;
        color: var(--rsp-faint);
        content: attr(data-label);
        font-size: 9px;
        font-weight: 850;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .rsp-ui .rsp-table-row td:last-child {
        border-bottom: 0;
    }

    .rsp-ui .rsp-table-col-time {
        width: auto;
    }

    .rsp-ui .rsp-table-show-image {
        width: 64px;
        height: 64px;
    }

    .rsp-ui .rsp-filebox-hero {
        align-items: flex-start;
    }

    .rsp-ui .rsp-filebox-hero .rsp-result-count {
        display: none;
    }

    .rsp-ui .rsp-filebox-filter {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .rsp-ui .rsp-filebox-filter select,
    .rsp-ui .rsp-filebox-filter input,
    .rsp-ui .rsp-filebox-filter button,
    .rsp-ui .rsp-filebox-filter .rsp-secondary-button {
        width: 100%;
    }
}

@media (max-width: 470px) {
    .rsp-ui .rsp-selected-date {
        align-items: flex-start;
        flex-direction: column;
    }

    .rsp-ui .rsp-selected-date-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .rsp-ui .rsp-view-switcher {
        width: 100%;
    }

    .rsp-ui .rsp-view-switcher button {
        flex: 1;
        justify-content: center;
        padding-inline: 9px;
    }

    .rsp-ui .rsp-streampanel-show {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-streampanel-image,
    .rsp-ui .rsp-streampanel-image img {
        min-height: 155px;
        max-height: 210px;
    }

    .rsp-ui .rsp-stream-status {
        display: grid;
    }

    .rsp-ui .rsp-nowplaying {
        text-align: left;
    }

    .rsp-ui .rsp-nowplaying strong {
        max-width: 80vw;
    }

    .rsp-ui .rsp-slot-media {
        min-height: 155px;
    }

    .rsp-ui .rsp-slot-content {
        padding: 16px;
    }

    .rsp-ui .rsp-slot-header {
        display: grid;
    }

    .rsp-ui .rsp-slot-tags {
        justify-content: flex-start;
    }

    .rsp-ui .rsp-login-options {
        align-items: flex-start;
        flex-direction: column;
    }

    .rsp-ui .rsp-form-hero {
        align-items: flex-start;
    }

    .rsp-ui .rsp-form-hero-icon {
        width: 46px;
        height: 46px;
        border-radius: 13px;
        font-size: 21px;
    }

    .rsp-ui .rsp-file-card {
        grid-template-columns: 40px minmax(0, 1fr);
    }

    .rsp-ui .rsp-file-type {
        width: 40px;
        height: 40px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rsp-ui *,
    .rsp-ui *::before,
    .rsp-ui *::after {
        scroll-behavior: auto !important;
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }
}

/* WP Sendeplan Pro 2.6 – konsolidierte Interaktion und Container-Layout */

.rsp-frontend,
.rsp-schedule-day,
.rsp-schedule-week,
.rsp-schedule-table,
.rsp-streampanel,
.rsp-studiobox-standalone,
.rsp-login-widget,
.rsp-apply-wrapper,
.rsp-filebox,
.rsp-setcard {
    min-width: 0;
    container-type: inline-size;
}

.rsp-ui :where(button, input, select, textarea) {
    max-width: 100%;
    margin: 0;
    letter-spacing: normal;
    text-transform: none;
}

.rsp-ui :where(button, a) {
    overflow-wrap: anywhere;
}

.rsp-ui .rsp-view-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 15px;
}

.rsp-ui .rsp-view-toolbar .rsp-view-switcher {
    margin: 0;
}

.rsp-ui .rsp-favorites-filter,
.rsp-ui .rsp-favorite-button,
.rsp-ui .rsp-calendar-button {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 7px 12px;
    border: 1px solid var(--rsp-border-strong);
    border-radius: 999px;
    background: var(--rsp-surface-alt);
    color: var(--rsp-copy);
    box-shadow: none;
    cursor: pointer;
    font: inherit;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
    text-decoration: none;
    transition: var(--rsp-motion, transform .18s ease, border-color .18s ease);
}

.rsp-ui .rsp-favorites-filter:hover,
.rsp-ui .rsp-favorite-button:hover,
.rsp-ui .rsp-calendar-button:hover {
    border-color: var(--rsp-accent);
    color: var(--rsp-copy);
    transform: var(--rsp-hover-lift-small, translateY(-1px));
}

.rsp-ui .rsp-favorites-filter.is-active,
.rsp-ui .rsp-favorites-filter[aria-pressed="true"],
.rsp-ui .rsp-favorite-button.is-favorite,
.rsp-ui .rsp-favorite-button[aria-pressed="true"] {
    border-color: var(--rsp-accent);
    background: var(--rsp-accent-soft);
    color: var(--rsp-copy);
}

.rsp-ui .rsp-favorites-filter > span,
.rsp-ui .rsp-favorite-button > span:first-child {
    color: var(--rsp-accent);
    font-size: 16px;
    line-height: 1;
}

.rsp-ui .rsp-icon-only {
    width: 36px;
    min-width: 36px;
    min-height: 36px;
    padding: 0;
    border-radius: 50%;
}

.rsp-ui .rsp-slot-actions,
.rsp-ui .rsp-week-slot-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--rsp-wb-meta-gap, 8px);
    justify-content: var(--rsp-wb-meta-justify, flex-start);
    margin-top: var(--rsp-wb-meta-margin-top, .35rem);
}

.rsp-ui .rsp-stream-actions {
    margin-top: var(--rsp-wb-meta-margin-top, .35rem);
}

.rsp-ui .rsp-week-slot-actions {
    margin-top: 8px;
}

.rsp-ui .rsp-favorites-empty {
    min-height: 190px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 6px;
    padding: 24px;
    border: 1px dashed var(--rsp-border-strong);
    border-radius: var(--rsp-card-radius, 18px);
    background: color-mix(in srgb, var(--rsp-surface) 76%, transparent);
    color: var(--rsp-muted);
    text-align: center;
}

.rsp-ui .rsp-favorites-empty > span {
    color: var(--rsp-accent);
    font-size: 36px;
}

.rsp-ui .rsp-favorites-empty small {
    max-width: 440px;
    color: var(--rsp-faint);
}

.rsp-ui.is-favorites-filtered [data-rsp-view-panel].is-active > .rsp-schedule-day .rsp-empty-state,
.rsp-ui.is-favorites-filtered [data-rsp-view-panel].is-active > .rsp-schedule-table .rsp-table-empty {
    display: none;
}

.rsp-ui .rsp-live-progress {
    width: min(100%, 620px);
    display: grid;
    gap: 5px;
    margin: 4px 0;
}

.rsp-ui .rsp-live-progress > div {
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: var(--rsp-surface-alt);
}

.rsp-ui .rsp-live-progress > div > span {
    height: 100%;
    display: block;
    border-radius: inherit;
    background: var(--rsp-live-badge, #e02424);
    transition: width .4s ease;
}

.rsp-ui .rsp-live-progress small {
    color: var(--rsp-faint);
    font-size: 10px;
    font-weight: 750;
    letter-spacing: .03em;
}

.rsp-ui.rsp-media-compact .rsp-slot,
.rsp-media-compact .rsp-slot {
    grid-template-columns: minmax(110px, 145px) minmax(0, 1fr);
}

.rsp-ui.rsp-media-compact .rsp-slot-media,
.rsp-media-compact .rsp-slot-media {
    min-height: 150px;
}

.rsp-ui.rsp-media-compact .rsp-streampanel-show,
.rsp-media-compact .rsp-streampanel-show {
    grid-template-columns: minmax(110px, 150px) minmax(0, 1fr);
}

.rsp-ui.rsp-media-none .rsp-slot,
.rsp-media-none .rsp-slot,
.rsp-ui.rsp-media-none .rsp-streampanel-show,
.rsp-media-none .rsp-streampanel-show {
    grid-template-columns: minmax(0, 1fr);
}

.rsp-ui.rsp-media-none .rsp-slot-media,
.rsp-media-none .rsp-slot-media,
.rsp-ui.rsp-media-none .rsp-streampanel-image,
.rsp-media-none .rsp-streampanel-image,
.rsp-ui.rsp-media-none .rsp-table-show-image,
.rsp-media-none .rsp-table-show-image {
    display: none;
}

.rsp-sticky-navigation .rsp-hub-date-nav {
    position: sticky;
    z-index: 20;
    top: 8px;
    margin-inline: -6px;
    padding: 8px 6px;
    border: 1px solid var(--rsp-border);
    border-radius: calc(var(--rsp-nav-radius, 999px) + 6px);
    background: var(--rsp-bg-main);
    background: color-mix(in srgb, var(--rsp-bg-main) 88%, transparent);
    -webkit-backdrop-filter: blur(calc(8px + var(--rsp-glass-blur, 0px)));
    backdrop-filter: blur(calc(8px + var(--rsp-glass-blur, 0px)));
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}

@container (max-width: 860px) {
    .rsp-ui .rsp-application-layout {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-application-guide {
        position: static;
    }
}

@container (max-width: 720px) {
    .rsp-ui .rsp-hero {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 17px;
    }

    .rsp-ui .rsp-hero .rsp-icon-button {
        grid-column: 1 / -1;
        justify-self: start;
    }

    .rsp-ui .rsp-hero-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .rsp-ui .rsp-slot,
    .rsp-ui.rsp-media-compact .rsp-slot,
    .rsp-media-compact .rsp-slot {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-slot-media {
        min-height: 170px;
        aspect-ratio: 16 / 8;
    }

    .rsp-ui .rsp-form-grid,
    .rsp-ui .rsp-apply-grid {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-form-row-full {
        grid-column: auto;
    }

    .rsp-ui.rsp-setcard {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-table-nav .nav-pills {
        display: none;
    }

    .rsp-ui .rsp-day-select-wrapper {
        display: block;
    }

    .rsp-ui .rsp-filebox-filter {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
}

@container (max-width: 500px) {
    .rsp-ui .rsp-selected-date,
    .rsp-ui .rsp-form-hero,
    .rsp-ui .rsp-login-options {
        align-items: flex-start;
        flex-direction: column;
    }

    .rsp-ui .rsp-view-toolbar,
    .rsp-ui .rsp-view-switcher,
    .rsp-ui .rsp-favorites-filter {
        width: 100%;
    }

    .rsp-ui .rsp-view-switcher button {
        flex: 1;
        justify-content: center;
        padding-inline: 8px;
    }

    .rsp-ui .rsp-streampanel-show,
    .rsp-ui.rsp-media-compact .rsp-streampanel-show,
    .rsp-media-compact .rsp-streampanel-show {
        grid-template-columns: 1fr;
    }

    .rsp-ui .rsp-slot-header {
        display: grid;
    }

    .rsp-ui .rsp-slot-tags {
        justify-content: flex-start;
    }

    .rsp-ui .rsp-slot-actions > :where(button, a),
    .rsp-ui .rsp-stream-actions > :where(button, a) {
        flex: 1 1 auto;
    }
}

/* WP Sendeplan Pro 3.1 – Theme-Isolation und robuste Overlay-Geometrie.
 * Diese Regeln stehen bewusst am Ende der Frontend-Datei. Sie korrigieren nur
 * Struktur und Bedienbarkeit; Farben, Transparenzen, Schriften und Radien
 * kommen weiterhin aus dem Design Studio. */

body.rsp-sendeplan-public-page :where(#page, #content, .site-content, .content-area, #primary, .site-main),
body.rsp-sendeplan-application-page :where(#page, #content, .site-content, .content-area, #primary, .site-main) {
    overflow: visible !important;
}

body.rsp-sendeplan-public-page .rsp-template-main {
    box-sizing: border-box !important;
    width: 100vw !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    padding: clamp(8px, 2vw, 28px) !important;
    position: relative !important;
    right: auto !important;
    left: 50% !important;
    float: none !important;
    clear: both !important;
    transform: translateX(-50%) !important;
}

body.rsp-sendeplan-application-page .rsp-application-page.rsp-public-wrapper {
    width: min(calc(100vw - 24px), 1360px) !important;
    max-width: 1360px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin-right: 0 !important;
    margin-left: 50% !important;
    position: relative !important;
    left: 0 !important;
    float: none !important;
    clear: both !important;
    transform: translateX(-50%) !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-scope.rsp-ui {
    display: block !important;
    width: min(100%, 1360px) !important;
    max-width: 1360px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: auto !important;
    margin-right: auto !important;
    margin-left: auto !important;
    position: relative !important;
    float: none !important;
    clear: both !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-width-standard.rsp-ui {
    width: min(100%, 1080px) !important;
    max-width: 1080px !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-width-full.rsp-ui {
    width: 100% !important;
    max-width: none !important;
}

.rsp-ui :where(
    .rsp-hub-stream,
    .rsp-streampanel,
    .rsp-stream-status,
    .rsp-streampanel-show,
    .rsp-streampanel-meta,
    .rsp-slot-actions,
    .rsp-stream-actions,
    .rsp-hub-date-nav,
    .rsp-public-day-nav,
    .rsp-selected-date,
    .rsp-hub-content,
    .rsp-hub-layout,
    .rsp-view-panels,
    .rsp-view-panel
) {
    min-width: 0 !important;
    min-height: 0 !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-hub-stream,
.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-streampanel {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    float: none !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-streampanel-show {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    align-items: stretch !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-streampanel-meta {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
}

.rsp-ui :where(
    .rsp-favorite-button,
    .rsp-calendar-button,
    .rsp-wunschbox-btn,
    .rsp-icon-button,
    .rsp-primary-button,
    .rsp-secondary-button,
    .rsp-today-link,
    .rsp-view-switcher button,
    .rsp-public-day-nav a
)::before,
.rsp-ui :where(
    .rsp-favorite-button,
    .rsp-calendar-button,
    .rsp-wunschbox-btn,
    .rsp-icon-button,
    .rsp-primary-button,
    .rsp-secondary-button,
    .rsp-today-link,
    .rsp-view-switcher button,
    .rsp-public-day-nav a
)::after {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    content: none !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-slot-actions,
.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-stream-actions {
    width: 100% !important;
    max-width: 100% !important;
    display: flex !important;
    align-items: center !important;
    flex-flow: row wrap !important;
}

.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-slot-actions > :where(button, a),
.rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-stream-actions > :where(button, a) {
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 38px !important;
    flex: 0 1 auto !important;
    float: none !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

.rsp-ui button.rsp-wunschbox-btn,
.rsp-ui .rsp-wunschbox-btn.rsp-wunschbox-btn-size-small,
.rsp-ui .rsp-wunschbox-btn.rsp-wunschbox-btn-size-medium,
.rsp-ui .rsp-wunschbox-btn.rsp-wunschbox-btn-size-large {
    width: auto !important;
    min-width: max-content !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: var(--rsp-wb-btn-size, 2.6rem) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: row !important;
    gap: var(--rsp-wb-btn-gap, 8px) !important;
    padding: var(--rsp-wb-btn-pad-y, 0px) var(--rsp-wb-btn-pad-x, 14px) !important;
    float: none !important;
    white-space: nowrap !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

.rsp-ui .rsp-wunschbox-btn > .rsp-wunschbox-icon,
.rsp-ui .rsp-wunschbox-btn > .rsp-wunschbox-text {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    white-space: nowrap !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

/* Overlays werden von app.js vor dem Oeffnen direkt unter body montiert. */
body > .rsp-slot-modal.rsp-ui,
body > .rsp-wunschbox-modal.rsp-ui,
body > .rsp-login-modal.rsp-ui {
    width: 100vw !important;
    max-width: none !important;
    min-width: 0 !important;
    height: 100vh !important;
    min-height: 100vh !important;
    margin: 0 !important;
    padding: clamp(10px, 2vw, 20px) !important;
    display: grid !important;
    place-items: center !important;
    position: fixed !important;
    z-index: 2147483000 !important;
    inset: 0 !important;
    float: none !important;
    clear: both !important;
    transform: none !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

body > .rsp-slot-modal.rsp-ui[hidden],
body > .rsp-wunschbox-modal.rsp-ui[hidden],
body > .rsp-login-modal.rsp-ui[hidden] {
    display: none !important;
}

body > .rsp-slot-modal.rsp-ui > .rsp-slot-modal-backdrop,
body > .rsp-wunschbox-modal.rsp-ui > .rsp-wunschbox-modal-backdrop,
body > .rsp-login-modal.rsp-ui > .rsp-login-modal-backdrop {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute !important;
    inset: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    transform: none !important;
}

body > .rsp-slot-modal.rsp-ui > .rsp-slot-modal-dialog,
body > .rsp-wunschbox-modal.rsp-ui > .rsp-wunschbox-modal-dialog,
body > .rsp-login-modal.rsp-ui > .rsp-login-modal-dialog {
    width: min(100%, 680px) !important;
    max-width: 680px !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: min(90vh, 850px) !important;
    margin: auto !important;
    position: relative !important;
    inset: auto !important;
    float: none !important;
    transform: none !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

body > .rsp-wunschbox-modal.rsp-ui .rsp-wunschbox-modal-body,
body > .rsp-wunschbox-modal.rsp-ui .rsp-studiobox-standalone,
body > .rsp-wunschbox-modal.rsp-ui .rsp-studiobox-form,
body > .rsp-wunschbox-modal.rsp-ui .rsp-form-grid,
body > .rsp-login-modal.rsp-ui .rsp-login-modal-body,
body > .rsp-login-modal.rsp-ui .rsp-login-form {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    float: none !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
}

body > .rsp-wunschbox-modal.rsp-ui :where(input, select, textarea, button),
body > .rsp-login-modal.rsp-ui :where(input, select, textarea, button) {
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
}

@media (max-width: 500px) {
    .rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-stream-actions > :where(button, a),
    .rsp-frontend.rsp-public-wrapper.rsp-ui .rsp-slot-actions > :where(button, a) {
        width: 100% !important;
        min-width: 0 !important;
        flex: 1 1 100% !important;
    }

    .rsp-ui button.rsp-wunschbox-btn,
    .rsp-ui .rsp-wunschbox-btn.rsp-wunschbox-btn-size-small,
    .rsp-ui .rsp-wunschbox-btn.rsp-wunschbox-btn-size-medium,
    .rsp-ui .rsp-wunschbox-btn.rsp-wunschbox-btn-size-large {
        width: 100% !important;
        min-width: 0 !important;
        white-space: normal !important;
    }

    .rsp-ui .rsp-wunschbox-btn > .rsp-wunschbox-text {
        white-space: normal !important;
        text-align: center !important;
    }
}
