/* Expandable hourly-activity cards. Property colors are supplied by SkyBookHotel.css variables. */
#pnlActivity .sb-activity-modern {
    --sbam-accent: var(--main-buttoncolordark, #82b7e3);
    --sbam-soft: var(--main-tabmatchingcolor, #eaf3fb);
    --sbam-text: var(--main-fontcolor, #444);
    --sbam-border: rgba(100,116,139,.26);
    color: var(--sbam-text); max-width:1180px; width:100%; min-width:0; margin:0 auto 75px; font-size:14px; container: sbam-panel / inline-size;
}
#pnlActivity .sb-activity-modern * { box-sizing:border-box; }
#pnlActivity .sbam-header { border-bottom:1px solid var(--sbam-border); padding:4px 2px 15px; margin-bottom:18px; }
#pnlActivity .sbam-header h2 { font-weight:750; font-size:23px; line-height:1.2; }
#pnlActivity .sbam-header p { margin-top:7px; opacity:.75; line-height:1.5; }
#pnlActivity .sbam-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(235px,315px); gap:20px; align-items:start; min-width:0; }
#pnlActivity .sbam-main { min-width:0; width:100%; }
#pnlActivity .sbam-label { font-size:12px; font-weight:750; display:block; margin:0 0 7px; }
#pnlActivity #sbam-search, #pnlActivity #sbam-date { display:block; width:100%; height:43px; border-radius:10px; padding:0 13px; background:#fff; color:#243245; border:1px solid rgba(100,116,139,.4); font:inherit; }
#pnlActivity :is(#sbam-search,#sbam-date):focus-visible { outline:none; border-color:var(--sbam-accent); box-shadow:inset 0 0 0 2px var(--sbam-accent); }
#pnlActivity :is(.sbam-activity,.sbam-add,.sbam-remove,.sbam-more):focus-visible { outline:2px solid var(--sbam-accent); outline-offset:-3px; }
#pnlActivity .sbam-catalog { margin-top:14px; display:grid; gap:14px; }
#pnlActivity .sbam-group { display:grid; gap:9px; min-width:0; }
#pnlActivity .sbam-group-title { font-size:12px; font-weight:750; letter-spacing:.03em; padding:6px 4px 2px; opacity:.75; }
#pnlActivity .sbam-card { min-width:0; width:100%; border:1px solid var(--sbam-border); border-radius:14px; background:#fff; overflow:hidden; box-shadow:0 4px 13px rgba(15,23,42,.035); }
#pnlActivity .sbam-card.is-open { border-color:var(--sbam-accent); box-shadow:0 4px 16px rgba(15,23,42,.075); }
#pnlActivity .sbam-activity { min-width:0; border:0; background:#fff; color:var(--sbam-text); padding:15px 17px; display:flex; gap:12px; align-items:center; justify-content:space-between; text-align:left; width:100%; cursor:pointer; font:inherit; }
#pnlActivity .sbam-activity:hover { background:rgba(148,163,184,.07); }
#pnlActivity .is-open > .sbam-activity { background:var(--sbam-soft); }
#pnlActivity .sbam-activity-text { min-width:0; flex:1 1 auto; overflow-wrap:break-word; }
#pnlActivity .sbam-activity-text strong { display:block; font-size:14px; font-weight:750; line-height:1.35; overflow-wrap:anywhere; }
#pnlActivity .sbam-activity-text small { display:block; margin-top:5px; font-size:12px; opacity:.78; line-height:1.45; }
#pnlActivity .sbam-card-trailing { display:flex; align-items:center; gap:12px; flex-shrink:0; }
#pnlActivity .sbam-price { white-space:nowrap; font-size:13px; font-weight:750; }
#pnlActivity .sbam-chevron { width:27px; height:27px; border:1px solid var(--sbam-border); background:#fff; border-radius:8px; display:grid; place-items:center; font-size:19px; font-weight:500; line-height:1; }
#pnlActivity .sbam-chooser { border-top:1px solid var(--sbam-border); padding:17px 18px 19px; background:#fff; }
#pnlActivity .sbam-chooser[hidden] { display:none; }
#pnlActivity .sbam-subhead { display:none; } /* Name and price already appear in the card header. */
#pnlActivity .sbam-status { padding:14px 0 10px; font-size:13px; opacity:.78; }
#pnlActivity .sbam-times { display:grid; gap:8px; }
#pnlActivity .sbam-slot { display:grid; grid-template-columns:minmax(0,1fr) 66px 88px; gap:10px; align-items:center; border:1px solid var(--sbam-border); border-radius:10px; padding:10px 11px; background:#fff; }
#pnlActivity .sbam-slot.is-selected { background:var(--sbam-soft); border-color:var(--sbam-accent); }
#pnlActivity .sbam-slot-label strong { display:block; font-size:13px; }
#pnlActivity .sbam-slot-label small { display:block; margin-top:3px; opacity:.72; font-size:11px; }
#pnlActivity .sbam-slot select { height:36px; width:100%; border:1px solid var(--sbam-border); border-radius:8px; padding:0 7px; background:#fff; color:#253245; }
#pnlActivity .sbam-add { height:36px; width:100%; cursor:pointer; font-weight:700; border:1px solid rgba(15,23,42,.15); border-radius:8px; background:var(--sbam-accent); color:#152238; }
#pnlActivity .sbam-add:hover { filter:brightness(.96); }
#pnlActivity .sbam-more { justify-self:center; background:transparent; border:0; padding:11px; text-decoration:underline; cursor:pointer; color:var(--sbam-text); font:inherit; font-weight:650; }
#pnlActivity .sbam-summary { min-width:0; padding:17px; border:1px solid var(--sbam-border); border-radius:13px; background:rgba(248,250,252,.8); position:sticky; top:15px; }
#pnlActivity .sbam-summary h3 { font-size:16px; font-weight:750; margin:0 0 12px; }
#pnlActivity .sbam-picked { padding:12px 0; border-top:1px solid var(--sbam-border); }
#pnlActivity .sbam-picked strong { display:block; font-weight:750; }
#pnlActivity .sbam-picked span { display:block; font-size:12px; line-height:1.45; margin:5px 0; }
#pnlActivity .sbam-remove { border:0; background:transparent; color:#a32b2b; text-decoration:underline; padding:3px 0; cursor:pointer; font:inherit; font-size:12px; }
#pnlActivity .sbam-footnote, #pnlActivity .sbam-empty { font-size:12px; line-height:1.5; opacity:.75; margin:10px 0; }
@container sbam-panel (max-width: 790px) {
    #pnlActivity .sbam-layout { grid-template-columns:minmax(0,1fr); }
    #pnlActivity .sbam-summary { position:static; order:2; }
}
/* Browser-width fallback for older engines without CSS container queries. */
@supports not (container-type: inline-size) {
    #pnlActivity .sbam-layout { display:flex; flex-wrap:wrap; }
    #pnlActivity .sbam-main { flex:3 1 500px; }
    #pnlActivity .sbam-summary { flex:1 1 250px; }
}
@media(max-width:440px) {
    #pnlActivity .sbam-header h2 { font-size:19px; }
    #pnlActivity .sbam-chooser { padding:12px; }
    #pnlActivity .sbam-activity { padding:12px; }
    #pnlActivity .sbam-card-trailing { gap:7px; }
    #pnlActivity .sbam-slot { grid-template-columns:minmax(0,1fr) 58px 72px; gap:6px; padding:9px 8px; }
    #pnlActivity .sbam-slot-label strong { font-size:12px; }
}

/* Let the desktop summary follow the document scroll. The legacy booking pane uses
   overflow:auto/hidden, which otherwise traps CSS position:sticky. Scope the
   overrides only to the modern activity view; classic grid is unchanged. */
#pnlActivity .TabUDFBody:has(.sb-activity-modern),
#pnlActivity .divActivity:has(.sb-activity-modern) {
    overflow: visible;
}
#pnlActivity .divActivity:has(.sb-activity-modern) {
    display: block;
    width: 100%;
    min-width: 0;
}
#pnlActivity .sbam-summary {
    top: var(--sbam-sticky-top, 12px);
    align-self: start;
    max-height: calc(100vh - var(--sbam-sticky-top, 12px) - 12px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}
/* Narrow activity panels: normal document flow, after the card list. */
@container sbam-panel (max-width: 790px) {
    #pnlActivity .sbam-summary {
        position: static;
        top: auto;
        max-height: none;
        overflow: visible;
    }
}