/* Hubbo Prime v40.1.0.8 – Prime Appearance Preferences Completion */

:root {
    --prime-accent: #8edb32;
    --prime-accent-rgb: 142, 219, 50;
    --prime-accent-hover: #a1e955;
    --prime-accent-strong: #6baa26;
    --prime-accent-text: #071005;
    --prime-bg: #070b08;
    --prime-surface: rgba(13, 21, 16, .92);
    --prime-surface-soft: rgba(18, 28, 21, .82);
    --prime-surface-raised: rgba(25, 36, 28, .92);
    --prime-border: rgba(255, 255, 255, .085);
    --prime-border-accent: rgba(var(--prime-accent-rgb), .24);
    --prime-text: #f5fbf5;
    --prime-text-muted: #9dac9f;
    --prime-radius-sm: 12px;
    --prime-radius: 18px;
    --prime-radius-lg: 26px;
    --prime-shadow: 0 24px 68px rgba(0, 0, 0, .36);
    --prime-focus: 0 0 0 3px rgba(var(--prime-accent-rgb), .22);
}

body.hubbo-prime-body {
    --hp-green: var(--prime-accent);
    --hp-green-2: var(--prime-accent-hover);
    --hps-green: var(--prime-accent);
    --hps-green-bright: var(--prime-accent-hover);
    accent-color: var(--prime-accent);
}

body.hubbo-prime-body ::selection {
    background: rgba(var(--prime-accent-rgb), .34);
    color: #fff;
}

/* Shared primary actions */
body.hubbo-prime-body :where(
    .hp-ui-button--primary,
    .hp-index-button--primary,
    .hp-onboard-button--primary,
    .hp-onboard-button--submit,
    .hp-identity-button--primary,
    .hp-maintenance-button--primary,
    .hp-launch-button--primary,
    .hp-foundation-button--primary,
    .hp-register-button--primary
) {
    border-color: transparent !important;
    background: linear-gradient(135deg, var(--prime-accent-hover), var(--prime-accent-strong)) !important;
    color: var(--prime-accent-text) !important;
    box-shadow: 0 16px 38px rgba(var(--prime-accent-rgb), .24), inset 0 1px rgba(255,255,255,.30) !important;
}

body.hubbo-prime-body :where(
    .hp-ui-button--primary,
    .hp-index-button--primary,
    .hp-onboard-button--primary,
    .hp-onboard-button--submit,
    .hp-identity-button--primary,
    .hp-maintenance-button--primary,
    .hp-launch-button--primary,
    .hp-foundation-button--primary,
    .hp-register-button--primary
):hover {
    filter: brightness(1.05);
    box-shadow: 0 20px 48px rgba(var(--prime-accent-rgb), .32), inset 0 1px rgba(255,255,255,.34) !important;
}

/* Navigation, active links and shared badges */
body.hubbo-prime-body :where(.hp-nav-link.is-active, .hp-identity-nav > a.is-active) {
    border-color: rgba(var(--prime-accent-rgb), .26) !important;
    background: rgba(var(--prime-accent-rgb), .12) !important;
    color: var(--prime-accent-hover) !important;
}

body.hubbo-prime-body :where(
    .hp-nav-link.is-active .hp-nav-icon,
    .hp-ui-card__eyebrow,
    .hp-index-kicker,
    .hp-index-section-head > span,
    .hp-onboard-kicker,
    .hp-onboard-step__head > span,
    .hp-identity-kicker,
    .hp-identity-card__head > div > span,
    .hp-me-kicker,
    .hp-maintenance-eyebrow
) {
    color: var(--prime-accent-hover) !important;
}

body.hubbo-prime-body :where(
    .hp-index-stat__icon,
    .hp-index-today__icon,
    .hp-ui-card__icon,
    .hp-me-action-icon,
    .hp-me-pulse-card__icon,
    .hp-onboard-interest-option__icon,
    .hp-onboard-path-option__icon
) {
    border-color: rgba(var(--prime-accent-rgb), .18) !important;
    background: rgba(var(--prime-accent-rgb), .09) !important;
    color: var(--prime-accent-hover) !important;
}

/* Selection states */
body.hubbo-prime-body :where(
    .hp-onboard-progress__item.is-active,
    .hp-onboard-progress__item.is-complete,
    .hp-onboard-avatar-option.is-selected,
    .hp-onboard-interest-option.is-selected,
    .hp-onboard-path-option.is-selected,
    .hp-onboard-privacy-option.is-selected,
    .hp-theme-preset.is-active
) {
    border-color: rgba(var(--prime-accent-rgb), .48) !important;
    background: rgba(var(--prime-accent-rgb), .10) !important;
    box-shadow: 0 0 0 1px rgba(var(--prime-accent-rgb), .08), 0 18px 46px rgba(var(--prime-accent-rgb), .08) !important;
}

body.hubbo-prime-body :where(
    .hp-onboard-progress__line > i,
    .hp-me-progress > i,
    .hp-index-status__server > i,
    .hp-dashboard-progress > i
) {
    background: linear-gradient(90deg, var(--prime-accent), var(--prime-accent-hover)) !important;
}

/* Inputs: one consistent focus state, no blue inner browser ring */
body.hubbo-prime-body :where(input, select, textarea):focus,
body.hubbo-prime-body :where(input, select, textarea):focus-visible {
    outline: none !important;
    border-color: rgba(var(--prime-accent-rgb), .72) !important;
    box-shadow: var(--prime-focus) !important;
}

body.hubbo-prime-body :where(
    .hp-index-field__control,
    .hp-onboard-field,
    .hp-ui-input-wrap,
    .hp-identity-form label,
    .hp-launch-field,
    .hp-maintenance-field
):focus-within {
    border-color: rgba(var(--prime-accent-rgb), .72) !important;
    box-shadow: var(--prime-focus) !important;
}

body.hubbo-prime-body .hp-id-strong-focus :where(a, button, input, select, textarea, [tabindex]):focus-visible,
body.hubbo-prime-body.hp-id-strong-focus :where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid var(--prime-accent-hover) !important;
    outline-offset: 3px !important;
    box-shadow: 0 0 0 6px rgba(var(--prime-accent-rgb), .20) !important;
}

/* Switches and checks */
body.hubbo-prime-body :where(.hp-switch input:checked + i, .hp-onboard-toggle input:checked + i) {
    border-color: var(--prime-accent) !important;
    background: var(--prime-accent) !important;
}

body.hubbo-prime-body :where(.hp-switch input:checked + i)::after,
body.hubbo-prime-body :where(.hp-onboard-toggle input:checked + i)::after {
    background: var(--prime-accent-text) !important;
}

/* Accent-aware cards and links */
body.hubbo-prime-body :where(.hp-ui-card, .hp-index-panel, .hp-identity-card, .hp-onboard-stage, .hp-onboard-preview):hover {
    border-color: rgba(var(--prime-accent-rgb), .16);
}

body.hubbo-prime-body :where(.hp-index-section-head a, .hp-index-login__register a, .hp-identity-card a, .hp-me-account-card__settings, .hp-me-dashboard-control > a) {
    color: var(--prime-accent-hover) !important;
}

/* Global backdrop follows the selected accent without recoloring hotel images. */
body.hubbo-prime-body .hp-prime-global-bg__glow--left,
body.hubbo-prime-body .hp-me-bg::before {
    background: rgba(var(--prime-accent-rgb), .12) !important;
}

/* Density is now a real system-wide preference. */
body.hubbo-prime-body.hp-density-compact :where(.hp-ui-card, .hp-index-panel, .hp-identity-card) {
    padding: 18px !important;
}
body.hubbo-prime-body.hp-density-compact :where(.hp-me-grid, .hp-index-content, .hp-identity-stack) {
    gap: 14px !important;
}
body.hubbo-prime-body.hp-density-spacious :where(.hp-ui-card, .hp-index-panel, .hp-identity-card) {
    padding: 30px !important;
}
body.hubbo-prime-body.hp-density-spacious :where(.hp-me-grid, .hp-index-content, .hp-identity-stack) {
    gap: 24px !important;
}

/* --------------------------------------------------------------------------
   Theme studio
   -------------------------------------------------------------------------- */
body.hp-settings-context .hp-theme-studio__value {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid rgba(var(--prime-accent-rgb), .24);
    border-radius: 12px;
    background: rgba(var(--prime-accent-rgb), .08);
    color: var(--prime-accent-hover);
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
    letter-spacing: .05em;
}

body.hp-settings-context .hp-theme-studio__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
    gap: 20px;
}

body.hp-settings-context .hp-theme-presets {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

body.hp-settings-context .hp-theme-preset {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 22px;
    gap: 9px;
    align-items: center;
    min-height: 50px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 14px;
    background: rgba(255,255,255,.028);
    color: #edf5ee;
    text-align: left;
    cursor: pointer;
    transition: .18s ease;
}

body.hp-settings-context .hp-theme-preset:hover {
    transform: translateY(-1px);
    border-color: rgba(var(--prime-accent-rgb), .22);
    background: rgba(255,255,255,.045);
}

body.hp-settings-context .hp-theme-preset i {
    width: 28px;
    height: 28px;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 9px;
    background: var(--preset-color);
    box-shadow: inset 0 1px rgba(255,255,255,.25), 0 6px 16px color-mix(in srgb, var(--preset-color) 28%, transparent);
}

body.hp-settings-context .hp-theme-preset span {
    overflow: hidden;
    font-size: 11px;
    font-weight: 850;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.hp-settings-context .hp-theme-preset b {
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    border-radius: 7px;
    background: transparent;
    color: transparent;
    font-size: 10px;
}

body.hp-settings-context .hp-theme-preset.is-active b {
    background: var(--prime-accent);
    color: var(--prime-accent-text);
}

body.hp-settings-context .hp-theme-custom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 12px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.075);
    border-radius: 16px;
    background: rgba(255,255,255,.025);
}
body.hp-settings-context .hp-theme-custom > span:first-child strong,
body.hp-settings-context .hp-theme-custom > span:first-child small {
    display: block;
}
body.hp-settings-context .hp-theme-custom > span:first-child strong { color: #f2f8f2; font-size: 13px; }
body.hp-settings-context .hp-theme-custom > span:first-child small { margin-top: 4px; color: #819084; font-size: 10.5px; line-height: 1.45; }
body.hp-settings-context .hp-theme-custom__control { display: flex; align-items: center; gap: 9px; }
body.hp-settings-context .hp-theme-custom input[type="color"] {
    width: 48px;
    height: 42px;
    padding: 4px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 12px;
    background: #0b120d;
    cursor: pointer;
}
body.hp-settings-context .hp-theme-custom code {
    min-width: 82px;
    padding: 8px 9px;
    border-radius: 10px;
    background: rgba(0,0,0,.28);
    color: #dce8dd;
    font-size: 11px;
    text-align: center;
}

body.hp-settings-context .hp-theme-preview {
    --preview-accent: var(--prime-accent);
    display: grid;
    align-content: start;
    gap: 12px;
    min-height: 100%;
    padding: 16px;
    border: 1px solid color-mix(in srgb, var(--preview-accent) 28%, rgba(255,255,255,.06));
    border-radius: 20px;
    background:
        radial-gradient(circle at 22% 0%, color-mix(in srgb, var(--preview-accent) 18%, transparent), transparent 45%),
        linear-gradient(180deg, rgba(15,24,18,.96), rgba(6,11,8,.92));
    box-shadow: 0 22px 56px rgba(0,0,0,.28);
}
body.hp-settings-context .hp-theme-preview__eyebrow { color: var(--preview-accent); font-size: 9px; font-weight: 950; letter-spacing: .09em; text-transform: uppercase; }
body.hp-settings-context .hp-theme-preview__nav,
body.hp-settings-context .hp-theme-preview__status { display: grid; grid-template-columns: 11px minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 11px; border: 1px solid rgba(255,255,255,.065); border-radius: 13px; background: rgba(255,255,255,.035); }
body.hp-settings-context .hp-theme-preview__nav i,
body.hp-settings-context .hp-theme-preview__status > i { width: 9px; height: 9px; border-radius: 50%; background: var(--preview-accent); box-shadow: 0 0 16px color-mix(in srgb, var(--preview-accent) 65%, transparent); }
body.hp-settings-context .hp-theme-preview__nav strong { color: #eef6ef; font-size: 11px; }
body.hp-settings-context .hp-theme-preview__nav span { padding: 4px 7px; border-radius: 7px; background: color-mix(in srgb, var(--preview-accent) 15%, transparent); color: var(--preview-accent); font-size: 8px; font-weight: 950; text-transform: uppercase; }
body.hp-settings-context .hp-theme-preview article { padding: 16px; border: 1px solid rgba(255,255,255,.07); border-radius: 16px; background: rgba(255,255,255,.035); }
body.hp-settings-context .hp-theme-preview article small { color: var(--preview-accent); font-size: 9px; font-weight: 950; text-transform: uppercase; }
body.hp-settings-context .hp-theme-preview article h3 { margin: 7px 0 5px; color: #fff; font-size: 20px; line-height: 1.1; }
body.hp-settings-context .hp-theme-preview article p { margin: 0 0 13px; color: #8f9c91; font-size: 10.5px; line-height: 1.45; }
body.hp-settings-context .hp-theme-preview article button { width: 100%; min-height: 38px; border: 0; border-radius: 11px; background: var(--preview-accent); color: #071005; font-size: 10px; font-weight: 950; cursor: default; }
body.hp-settings-context .hp-theme-preview__status { grid-template-columns: 11px minmax(0,1fr); }
body.hp-settings-context .hp-theme-preview__status strong,
body.hp-settings-context .hp-theme-preview__status small { display: block; }
body.hp-settings-context .hp-theme-preview__status strong { color: #f2f8f3; font-size: 10.5px; }
body.hp-settings-context .hp-theme-preview__status small { margin-top: 2px; color: #78867b; font-size: 9px; }

@media (max-width: 980px) {
    body.hp-settings-context .hp-theme-studio__layout { grid-template-columns: 1fr; }
    body.hp-settings-context .hp-theme-presets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    body.hp-settings-context .hp-theme-presets { grid-template-columns: 1fr; }
    body.hp-settings-context .hp-theme-custom { align-items: flex-start; flex-direction: column; }
}

body.hp-settings-context .hp-dashboard-size-select--fixed {
    align-content: center;
}
body.hp-settings-context .hp-dashboard-size-select--fixed strong,
body.hp-settings-context .hp-dashboard-size-select--fixed small {
    display: block;
}
body.hp-settings-context .hp-dashboard-size-select--fixed strong {
    color: var(--prime-accent-hover);
    font-size: 12px;
}
body.hp-settings-context .hp-dashboard-size-select--fixed small {
    margin-top: 2px;
    color: #748177;
    font-size: 9px;
    line-height: 1.25;
}

/* v40.1.0.7.1 – public component taxonomy */
:root{
    --prime-card-radius:24px;
    --prime-card-border:rgba(255,255,255,.075);
    --prime-card-surface:rgba(12,15,14,.94);
    --prime-card-surface-raised:rgba(17,21,19,.95);
    --prime-card-shadow:0 24px 70px rgba(0,0,0,.28);
}
.prime-card{border-radius:var(--prime-card-radius);border:1px solid var(--prime-card-border)}
.prime-card--hero{background:linear-gradient(135deg,var(--prime-card-surface-raised),rgba(6,8,7,.94));box-shadow:0 38px 110px rgba(0,0,0,.42)}
.prime-card--content{background:linear-gradient(180deg,var(--prime-card-surface-raised),var(--prime-card-surface));box-shadow:var(--prime-card-shadow)}
.prime-card--media{background:rgba(9,12,11,.96);box-shadow:var(--prime-card-shadow)}
.prime-card--notice{background:linear-gradient(180deg,rgba(14,18,16,.96),rgba(8,10,9,.95));border-left-color:var(--prime-accent)}
.prime-card--secondary{background:rgba(11,14,13,.90);box-shadow:0 16px 46px rgba(0,0,0,.22)}


/* --------------------------------------------------------------------------
   v40.1.0.7.2 – Accent completion and public footer
   -------------------------------------------------------------------------- */
body.hubbo-prime-body .hp-footer-prime {
    border-top-color: rgba(var(--prime-accent-rgb), .16);
    background:
        radial-gradient(circle at 80% 0%, rgba(var(--prime-accent-rgb), .08), transparent 28%),
        linear-gradient(180deg, rgba(8, 10, 9, .97), rgba(3, 4, 4, 1));
}
body.hubbo-prime-body .hp-footer-prime__inner.is-public {
    min-height: 104px;
    justify-content: flex-start;
}
body.hubbo-prime-body .hp-footer-prime__release {
    background: linear-gradient(135deg, rgba(var(--prime-accent-rgb), .08), rgba(255,255,255,.025));
}
body.hubbo-prime-body .hp-footer-prime__release:hover {
    border-color: rgba(var(--prime-accent-rgb), .30);
    background: linear-gradient(135deg, rgba(var(--prime-accent-rgb), .13), rgba(255,255,255,.04));
}
body.hubbo-prime-body .hp-footer-prime__release-label {
    color: var(--prime-accent-hover);
}
body.hubbo-prime-body .hp-footer-prime__release-label i {
    background: var(--prime-accent);
    box-shadow: 0 0 12px rgba(var(--prime-accent-rgb), .70);
}

/* The personal home uses neutral surfaces; the chosen accent is reserved for
   actions, active states, progress and orientation. */
body.hp-home-context :where(
    .prime-kicker,
    .hp-me2-today__head span,
    .hp-me2-wallet__profile span,
    .hp-me2-section-head > div > span,
    .hp-me2-section-head > a,
    .hp-me2-quick-grid b,
    .hp-me2-friend-list small,
    .hp-me2-event-card time small,
    .hp-me2-event-card > span b,
    .hp-me2-event-card > i,
    .hp-me2-room-grid small,
    .hp-me2-room-grid > a > i,
    .hp-me2-news-list small,
    .hp-me2-news-list > a > i,
    .hp-me2-empty > a
) {
    color: var(--prime-accent-hover) !important;
}
body.hp-home-context :where(
    .hp-me2-today__item.is-featured,
    .hp-me2-focus,
    .hp-me2-event-card,
    .hp-me2-alert-list > a.is-unread
) {
    border-color: rgba(var(--prime-accent-rgb), .18) !important;
}
body.hp-home-context :where(
    .hp-me2-today__item > i,
    .hp-me2-quick-grid > a > i,
    .hp-me2-friend-list > a > span,
    .hp-me2-alert-list > a > i,
    .hp-me2-empty > i
) {
    background: rgba(var(--prime-accent-rgb), .09) !important;
    color: var(--prime-accent-hover) !important;
}
body.hp-home-context .hp-me2-referral__link button:hover {
    filter: brightness(1.06);
    transform: translateY(-1px);
}

/* --------------------------------------------------------------------------
   v40.1.0.8 – functional appearance and accessibility preferences
   -------------------------------------------------------------------------- */

/* Keep the hotel backdrop, but remove animated/decorative atmosphere. */
body.hubbo-prime-body.hp-id-background-effects-off .hp-prime-global-bg {
    background:
        linear-gradient(180deg, rgba(4, 9, 6, .90), rgba(1, 4, 3, .98)),
        var(--hp-global-bg-image) center top / cover fixed no-repeat !important;
    filter: saturate(.52) contrast(.98) !important;
}
body.hubbo-prime-body.hp-id-background-effects-off .hp-prime-global-bg::before,
body.hubbo-prime-body.hp-id-background-effects-off .hp-prime-global-bg::after,
body.hubbo-prime-body.hp-id-background-effects-off .hp-prime-global-bg__glow {
    display: none !important;
}

/* User-selected motion reduction applies across every public module. */
body.hubbo-prime-body.hp-id-reduced-motion,
body.hubbo-prime-body.hp-id-reduced-motion * {
    scroll-behavior: auto !important;
}
body.hubbo-prime-body.hp-id-reduced-motion *,
body.hubbo-prime-body.hp-id-reduced-motion *::before,
body.hubbo-prime-body.hp-id-reduced-motion *::after {
    animation-delay: 0s !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-delay: 0s !important;
    transition-duration: .01ms !important;
}

/* Simplified mode removes decoration, not information or controls. */
body.hubbo-prime-body.hp-id-simplified .hp-prime-global-bg::after,
body.hubbo-prime-body.hp-id-simplified .hp-prime-global-bg__glow,
body.hubbo-prime-body.hp-id-simplified :where(
    .hp-identity-card,
    .hp-identity-hero,
    .prime-card,
    .hp-index-panel,
    .hp-ui-card
)::before {
    display: none !important;
}
body.hubbo-prime-body.hp-id-simplified :where(
    .hp-navbar,
    .hp-identity-nav,
    .hp-identity-card,
    .prime-card,
    .hp-index-panel,
    .hp-ui-card
) {
    backdrop-filter: none !important;
}

/* Statuses remain understandable when colors are hard to distinguish. */
body.hubbo-prime-body.hp-id-color-status .is-online:not(i)::before {
    content: "✓";
    margin-right: .38em;
    font-weight: 950;
}
body.hubbo-prime-body.hp-id-color-status .is-offline:not(i)::before {
    content: "○";
    margin-right: .38em;
    font-weight: 950;
}
body.hubbo-prime-body.hp-id-color-status .hp-event-status::before {
    display: inline-block;
    margin-right: .42em;
    font-weight: 950;
}
body.hubbo-prime-body.hp-id-color-status .hp-event-status--live::before { content: "▶"; }
body.hubbo-prime-body.hp-id-color-status .hp-event-status--planned::before,
body.hubbo-prime-body.hp-id-color-status .hp-event-status--draft::before { content: "◷"; }
body.hubbo-prime-body.hp-id-color-status .hp-event-status--ended::before { content: "✓"; }
body.hubbo-prime-body.hp-id-color-status .hp-event-status--cancelled::before { content: "×"; }
body.hubbo-prime-body.hp-id-color-status .hp-theme-preview__status > i::after {
    content: "✓";
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    color: #071005;
    font-size: 7px;
    font-style: normal;
    font-weight: 950;
}

/* Screenreader support created by hubbo-prime-appearance.js. */
.hp-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}
.hp-sr-skip {
    position: fixed;
    top: 14px;
    left: 14px;
    z-index: 100000;
    padding: 11px 15px;
    border: 2px solid var(--prime-accent-hover);
    border-radius: 12px;
    background: #071005;
    color: #fff !important;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none !important;
    transform: translateY(-170%);
    transition: transform .16s ease;
}
.hp-sr-skip:focus,
.hp-sr-skip:focus-visible {
    transform: translateY(0);
    outline: none !important;
    box-shadow: var(--prime-focus) !important;
}

