/* Dynamic widget interiors share these defaults. Their Style controls expose
 * colors and rounding. Native Elementor panels/photos are deliberately absent.
 */
.rheinspiel-design .rsg-page .rsg-event,
.rheinspiel-design .rsg-page .rsg-form-panel,
.rheinspiel-design :is(.rs-news-instagram__fallback,.rs-news-instagram .rcb-content-blocker),
.rheinspiel-design .rs-news-instagram #sb_instagram .sbi_photo_wrap {
    border:1px solid var(--rsd-panel-line); border-top:3px solid var(--rsd-ink);
    border-radius:var(--rsd-panel-radius); background:var(--rsd-panel-paper);
    box-shadow:var(--rsd-panel-shadow); color:var(--rsd-ink);
}
/* A single spacing rhythm replaces accumulated widget/paragraph margins.
 * Keep the shared type size and leading; compact the space between elements. */
.rheinspiel-design .rsg-page .rsg-event { padding:18px; gap:8px; }
.rheinspiel-design .rsg-page .rsg-events { gap:16px; margin:12px 0 8px; }
.rheinspiel-design .rsg-page .rsg-event > * { margin:0; min-width:0; }
.rheinspiel-design .rsg-page .rsg-event .rsg-description { flex-grow:0; }
.rheinspiel-design .rsg-page .rsg-event .rsg-description > p { margin:0 0 8px; }
.rheinspiel-design .rsg-page .rsg-event .rsg-description > :last-child { margin-bottom:0; }
.rheinspiel-design .rsg-page .rsg-event .rsg-count { padding-top:8px; }
.rheinspiel-design .rsg-page .rsg-event .rsg-tcg-registration { gap:12px; }
.rheinspiel-design .rsg-page .rsg-event .rsg-tcg-registration p { margin:0 0 8px; }
.rheinspiel-design .rsg-page .rsg-form-panel { padding:28px; }
/* The preceding Elementor ornament already reserves the top frame space. */
.rss-season .rss-native-trim--corner + .elementor-widget-rheinspiel-events .rsg-events { margin-top:0; }
.rheinspiel-design .rsd-event-page .rsg-steps { padding-left:24px; }
.rheinspiel-design .rsd-event-page .rsg-steps li { margin-block:12px; }
.rheinspiel-design .rsd-event-page .rsg-steps :is(strong,span) { display:block; }
.rheinspiel-design .rsg-page .rsg-event-brand { height:88px; padding:12px; border-radius:4px; }
.rheinspiel-design .rsg-page .rsg-event-brand :is(img,svg) { height:60px; }
.rheinspiel-design .rsg-page .rsg-event h3 { font:400 var(--rsd-size-heading)/var(--rsd-leading) var(--rsd-font-heading); letter-spacing:.018em; }
.rheinspiel-design .rsg-page .rsg-event time.rsg-event-date {
    padding:6px 12px; border-left:3px solid var(--rsd-rust);
    border-radius:0 10px 10px 0; background:var(--rsd-cream);
}
.rheinspiel-design .rsg-event-date-line { font-weight:600; }
.rheinspiel-design .rsg-page .rsg-event time strong {
    font:400 var(--rsd-size-text)/var(--rsd-leading) var(--rsd-font-heading);
    color:var(--rsd-rust); letter-spacing:0;
}
.rheinspiel-design .rs-news-instagram #sb_instagram .sbi_photo_wrap { padding:8px; }
.rheinspiel-design .rs-news-instagram #sb_instagram .sbi_photo { border-radius:var(--rsd-image-radius); }
/* Clip only the provider's interior, so the frame and seasonal corner stay
 * outside its thumbnail without depending on generated provider class names.
 */
.rheinspiel-design .rs-news-instagram .rcb-content-blocker > div { border-radius:inherit; overflow:hidden; }
.rheinspiel-design :is(.rsg-privacy-notice,.rs-news-privacy-notice) { color:var(--rsd-ink); }
/* Shared opening-hours table, kept in native Elementor Text Editor widgets. */
.rheinspiel-design .rsd-opening-hours { width:100%; margin:0 0 16px; border:0; border-collapse:collapse; color:inherit; background:transparent; }
.rheinspiel-design .rsd-opening-hours caption { margin-bottom:8px; text-align:left; font-weight:600; color:inherit; }
.rheinspiel-design .rsd-opening-hours :is(th,td) { padding:0 16px 6px 0; border:0; background:transparent; color:inherit; text-align:left; vertical-align:top; font:inherit; white-space:nowrap; }
.rheinspiel-design .rsd-opening-hours th { font-weight:600; }
.rheinspiel-design .rsd-opening-hours td { padding-right:0; }
/* A native heading already names this table on Contact. The same global
 * Elementor hours widget keeps its caption in the footer and home summary. */
.rheinspiel-design .rsd-hours-titled .rsd-opening-hours caption { display:none; }

/* PDF-derived content uses normal text flow, with each price beside its item.
 * Only the source PDF is maintained; these panels share the games-shop frame. */
.rheinspiel-design .rsd-pdf-menu-content { column-count:var(--rsd-menu-columns,2); column-gap:20px; }
.rheinspiel-design .rsd-menu-section { break-inside:avoid; display:flow-root; min-width:0; margin-bottom:20px; padding:20px; background:var(--rsd-panel-paper); border:1px solid var(--rsd-panel-line); border-top:3px solid var(--rsd-ink); border-radius:var(--rsd-panel-radius); }
.rheinspiel-design .rsd-menu-section h2 { margin:0 0 12px; }
.rheinspiel-design .rsd-menu-section :is(p,dl,ul) { margin:0 0 12px; }
.rheinspiel-design .rsd-menu-section ul { padding-left:20px; }
.rheinspiel-design .rsd-menu-section > :last-child { margin-bottom:0; }
.rheinspiel-design .rsd-menu-intro { column-span:all; }
.rheinspiel-design .rsd-menu-item { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; padding-block:6px; border-bottom:1px solid var(--rsd-panel-line); }
.rheinspiel-design .rsd-menu-item :is(dt,dd) { margin:0; }
.rheinspiel-design .rsd-menu-item dd { font-weight:600; white-space:nowrap; text-align:right; }
.rheinspiel-design .rsd-menu-notes { column-span:all; }
.rheinspiel-design .rsd-pdf-menu-download { margin-top:20px; }
@media(max-width:767px) {
    .rheinspiel-design .rsd-pdf-menu-content { column-count:1; }
    .rheinspiel-design .rsd-menu-section { padding:16px; }
}

/* Elementor supplies an editable excerpt budget. Text-only news cards can use
 * the space a neighbouring card spends on its photo. Photo cards keep a short
 * teaser; the common ceiling avoids extremely tall cards on narrow screens.
 */
.rheinspiel-design .elementor-post__excerpt p {
    display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:16; overflow:hidden;
}
.rheinspiel-design .elementor-post:has(.elementor-post__thumbnail) .elementor-post__excerpt p {
    -webkit-line-clamp:3;
}

/* Native disclosures add no visible controls to tablet/desktop cards. */
.rheinspiel-design .rsd-mobile-details > summary { display:none; }
/* Without JavaScript, a phone user may close a section and then resize. Keep
 * a recovery toggle reachable in that case instead of hiding the whole text. */
.rheinspiel-design .rsd-mobile-details:not([open]) > summary { display:flex; list-style:none; min-height:44px; cursor:pointer; }
.rheinspiel-design .rsd-details-less { display:none; }
.rheinspiel-design .rsg-qr-details { flex:0 0 140px; order:-1; }
.rheinspiel-design .rsd-native-details { display:contents; }

/* Phone-only density rules. Fonts and touch targets retain their shared sizes. */
@media(max-width:767px), (min-width:768px) and (max-width:1023px) and (max-height:600px) and (orientation:landscape) {
    .rheinspiel-design .rsd-native-details { display:block; }
    .rheinspiel-design .rsg-page .rsg-form-panel { padding:16px; }
    .rheinspiel-design .rsd-mobile-details { margin-bottom:12px; }
    .rheinspiel-design .rsd-mobile-details:not([open]) { flex-grow:0; }
    .rheinspiel-design .rsg-description:empty { display:none; }
    .rheinspiel-design .rsg-tcg-registration { flex-direction:column; align-items:stretch; }
    .rheinspiel-design .rsg-qr-details { order:2; flex:0 0 auto; margin-bottom:0; }
    .rheinspiel-design .rsg-qr-help { display:none; }
    .rheinspiel-design .rsg-tcg-registration .rsg-button { width:100%; }
    /* Gallery thumbnails still open the original photo and keep their alt text. */
    .rheinspiel-design .elementor-image-gallery .gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    .rheinspiel-design .elementor-image-gallery .gallery-item { width:100%!important; max-width:none!important; margin:0!important; }
    .rheinspiel-design .elementor-image-gallery .gallery-icon img { width:100%; aspect-ratio:4/3; object-fit:cover; }
    .rheinspiel-design .elementor-image-gallery .gallery-caption { display:none; }
}

/* One compact layout for optional home offers, news, galleries and consented feed
 * items. The ready attribute is added only after usable controls exist. Without
 * JavaScript, the original complete vertical lists remain available.
 * JavaScript also enables the home row on short, landscape phone screens.
 */
    .rheinspiel-design [data-rsd-carousel-ready] {
        display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important; align-items:stretch; gap:12px;
        width:100%; max-width:100%; min-width:0; padding:6px 6px 12px;
        overflow-x:auto; overscroll-behavior-x:contain;
        scroll-snap-type:x mandatory; scroll-padding-inline:6px;
        scrollbar-width:none;
    }
    .rheinspiel-design [data-rsd-carousel-ready]::-webkit-scrollbar { display:none; }
    .rheinspiel-design [data-rsd-carousel-ready] > :is(.rsd-offer-card,.elementor-post,.sbi_item,.gallery-item) {
        flex:0 0 calc(100% - 24px); width:calc(100% - 24px); min-width:0; max-width:none;
        scroll-snap-align:start; scroll-snap-stop:always;
    }
    .rheinspiel-design [data-rsd-carousel-ready] > .elementor-post { margin:0; }

/* Reuse each native photo, including on landscape phones. Elementor handles
 * portrait dimensions/order; these variables reuse those same saved controls
 * where a short landscape screen otherwise falls into its tablet breakpoint. */
@media(min-width:768px) and (max-width:1023px) and (max-height:600px) and (orientation:landscape) {
    .rheinspiel-design .rsd-offer-photo.elementor-element { --order:var(--rsd-phone-photo-order,0); text-align:left; }
    .rheinspiel-design .elementor-widget-image.elementor-element.rsd-offer-photo img {
        width:var(--rsd-phone-photo-width,144px); height:var(--rsd-phone-photo-height,96px);
        object-fit:cover;
    }
}
/* Narrow four-column desktop cards need the same safe wrapping as phones.
 * Weekdays stay in their separate column; time ranges wrap only when needed. */
.rheinspiel-design .rsd-offer-card .rsd-opening-hours td {
    white-space:normal;
}

@media(max-width:767px), (min-width:768px) and (max-width:1023px) and (max-height:600px) and (orientation:landscape) {
    /* Appointments are a continuous chronological list. Keep every primary
     * action visible; only secondary descriptions and QR codes are folded. */
    .rheinspiel-design .rsg-page .rsg-events { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
    .rheinspiel-design .elementor-post__title {
        display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden;
    }
    .rheinspiel-design .elementor-post__thumbnail img { object-fit:cover; }
    .rheinspiel-design .elementor-post:has(.elementor-post__thumbnail) .elementor-post__excerpt p {
        -webkit-line-clamp:2;
    }
    .rheinspiel-design .rs-news-instagram #sb_instagram #sbi_images[data-rsd-carousel-ready] > .sbi_item {
        width:auto!important; padding:0!important;
    }
    .rheinspiel-design .rs-news-instagram #sb_instagram #sbi_images[data-rsd-carousel-ready] .sbi_photo {
        height:auto!important; aspect-ratio:4/3;
    }

    /* Logo and date/time share the first row; the title follows immediately.
     * All facts remain visible, with no duplicate event-kind label. This grid
     * does not change the desktop layout or the original date markup.
     */
    .rheinspiel-design .rsg-page .rsg-event {
        display:grid; grid-template-columns:88px minmax(0,1fr); align-content:start;
        gap:6px; padding:12px;
    }
    .rheinspiel-design .rsg-page .rsg-event > * { grid-column:1 / -1; margin:0; min-width:0; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-event-brand {
        grid-column:1; grid-row:1; align-self:start; width:88px; height:48px; padding:4px; margin:0;
    }
    .rheinspiel-design .rsg-page .rsg-event-brand :is(img,svg) { width:auto; max-width:100%; height:38px; object-fit:contain; }
    .rheinspiel-design .rsg-page .rsg-event time.rsg-event-date {
        grid-column:2; grid-row:1; align-self:start; padding:4px 8px; margin:0;
        overflow-wrap:anywhere;
    }
    .rheinspiel-design .rsg-page .rsg-event :is(h3,p) { margin:0; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-count { margin:0; padding-top:6px; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-tcg-registration { margin:0; gap:4px; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-tcg-registration p { margin:0; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-tcg-registration > div { min-width:0; width:100%; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-tcg-registration .rsg-button { margin-top:4px; }
    .rheinspiel-design .rsg-page .rsg-event .rsd-mobile-details { margin:0; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-description > p { margin-top:4px; }
    .rheinspiel-design .rsg-page .rsg-event .rsg-description:not([open]):empty { display:none; }
    .rheinspiel-design .rsg-page .rsg-form > label:not(.rsg-check) { margin-top:12px; margin-bottom:5px; }
    .rheinspiel-design .rsg-page .rsg-form .rsg-check { margin:14px 0; }
    .rheinspiel-design .rs-news-instagram__fallback { padding:16px; }
    /* The native section already supplies the phone gutter. Do not apply the
     * old standalone feed's second gutter inside the Elementor container. */
    .rheinspiel-design .rs-news-elementor .rs-news-instagram__inner { width:100%; max-width:100%; margin-inline:0; }
}