:root {
    --oat-sidebar-width: 140px;
    --oat-content-max-width: 1760px;
    --oat-content-gutter: 24px;
    /* Rounded vertical hexagon — r≈0.32 (css-tip.com rounded-hexagon) */
    --oat-hex-clip: polygon(
        42.2955% 4.4482%, 44.2216% 3.4752%, 46.1477% 2.7801%, 48.0739% 2.3631%, 50.0000% 2.2241%, 51.9261% 2.3631%, 53.8523% 2.7801%,
        55.7784% 3.4752%, 57.7045% 4.4482%, 85.5968% 20.5518%, 87.4025% 21.7334%, 88.9675% 23.0539%, 90.2917% 24.5135%, 91.3751% 26.1121%,
        92.2178% 27.8496%, 92.8197% 29.7262%, 93.1809% 31.7418%, 93.3013% 33.8964%, 93.3013% 66.1036%, 93.1809% 68.2582%, 92.8197% 70.2738%,
        92.2178% 72.1504%, 91.3751% 73.8879%, 90.2917% 75.4865%, 88.9675% 76.9461%, 87.4025% 78.2666%, 85.5968% 79.4482%, 57.7045% 95.5518%,
        55.7784% 96.5248%, 53.8523% 97.2199%, 51.9261% 97.6369%, 50.0000% 97.7759%, 48.0739% 97.6369%, 46.1477% 97.2199%, 44.2216% 96.5248%,
        42.2955% 95.5518%, 14.4032% 79.4482%, 12.5975% 78.2666%, 11.0325% 76.9461%, 9.7083% 75.4865%, 8.6249% 73.8879%, 7.7822% 72.1504%,
        7.1803% 70.2738%, 6.8191% 68.2582%, 6.6987% 66.1036%, 6.6987% 33.8964%, 6.8191% 31.7418%, 7.1803% 29.7262%, 7.7822% 27.8496%,
        8.6249% 26.1121%, 9.7083% 24.5135%, 11.0325% 23.0539%, 12.5975% 21.7334%, 14.4032% 20.5518%
    );
    --oat-hex-fill-scale: 0.9;
    --oat-page-title-color: #3e3c3d;
}

html[data-bs-theme="dark"] {
    --oat-page-title-color: #ffffff;
}

#kt_footer .text-white,
#kt_footer .menu-white .menu-item .menu-link,
#kt_footer .menu-white .menu-item .menu-link .menu-title {
    color: var(--oat-page-title-color) !important;
}

#kt_aside {
    background-color: var(--bs-body-bg) !important;
    opacity: 1 !important;
}

#kt_aside_logo {
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Aside nav — hex icon tiles */
#kt_aside .menu > .menu-item > .menu-link .menu-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0;
    margin-right: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    clip-path: var(--oat-hex-clip);
    background: rgba(var(--bs-primary-rgb), 0.12);
    transition: background 0.15s ease;
}

#kt_aside .menu > .menu-item > .menu-link .menu-icon i {
    line-height: 1 !important;
    color: var(--bs-primary) !important;
}

#kt_aside .menu-item.here > .menu-link .menu-icon,
#kt_aside .menu-item.show > .menu-link .menu-icon {
    background: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
}

#kt_aside .menu-item.here > .menu-link .menu-icon i,
#kt_aside .menu-item.show > .menu-link .menu-icon i {
    color: #fff !important;
}

html[data-bs-theme="dark"] #kt_aside .menu > .menu-item > .menu-link .menu-icon {
    background: rgba(var(--bs-primary-rgb), 0.22);
}

/* Header full-width behind sidebar; sidebar overlays on top */
@media (min-width: 992px) {
    .aside-fixed .aside {
        z-index: 105;
    }

    .wrapper {
        padding-left: 0 !important;
    }

    .oat-app-header {
        width: 100%;
        margin-left: 0 !important;
        border-bottom-left-radius: 0 !important;
        background-size: cover;
        background-position: center;
    }

    .oat-content-container {
        width: 100%;
        max-width: min(
            var(--oat-content-max-width),
            calc(100vw - var(--oat-sidebar-width) - (var(--oat-content-gutter) * 2))
        );
        margin-left: auto;
        margin-right: auto;
        padding-left: calc(var(--oat-sidebar-width) + var(--oat-content-gutter));
        padding-right: var(--oat-content-gutter);
    }

    .header-fixed[data-kt-sticky-header=on] .header {
        left: 0 !important;
        right: 0;
        z-index: 100;
    }

    /* Page titles on transparent header (before scroll) */
    #kt_header:not(.bg-body) .page-title,
    #kt_header:not(.bg-body) .page-title h1,
    #kt_header:not(.bg-body) .page-title h2,
    #kt_header:not(.bg-body) .page-title span,
    #kt_header:not(.bg-body) .page-title small {
        color: var(--oat-page-title-color);
    }

    #kt_header:not(.bg-body) .page-title .text-white {
        color: var(--oat-page-title-color) !important;
    }

    #kt_header:not(.bg-body) .page-title small,
    #kt_header:not(.bg-body) .page-title .opacity-75 {
        color: var(--oat-page-title-color);
        opacity: 0.75 !important;
    }

    #kt_footer {
        width: 100%;
    }

    #kt_footer .oat-content-container {
        width: 100%;
    }

    #kt_aside .menu > .menu-item > .menu-link .menu-icon {
        width: 48px !important;
        height: 48px !important;
        min-width: 48px !important;
        min-height: 48px !important;
    }

    #kt_aside .menu > .menu-item > .menu-link .menu-icon i {
        font-size: 1.35rem !important;
    }

    #kt_aside .menu-item.here > .menu-link.menu-center,
    #kt_aside .menu-item.show > .menu-link.menu-center {
        background: transparent !important;
    }

    #kt_aside .menu-item.here > .menu-link.menu-center .menu-icon,
    #kt_aside .menu-item.show > .menu-link.menu-center .menu-icon {
        background: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
    }

    /* Sidebar layout — logo, centered nav, profile footer */
    #kt_aside.aside {
        height: 100vh;
        height: 100dvh;
        min-height: 100vh;
        min-height: 100dvh;
    }

    #kt_aside .aside-logo.flex-column-auto {
        flex-shrink: 0;
        padding-top: 1.25rem !important;
        padding-bottom: 0.25rem !important;
    }

    #kt_aside .aside-logo img,
    #kt_aside .aside-logo .app-logo {
        display: block;
        margin: 0 auto;
        height: 80px !important;
        width: auto;
        max-width: 100%;
    }

    #kt_aside .aside-menu.flex-column-fluid {
        flex: 1 1 auto;
        min-height: 0;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #kt_aside #kt_aside_menu_wrapper {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100%;
        max-height: 100%;
        overflow-y: auto;
    }

    #kt_aside .aside-menu .menu.menu-column {
        width: 100%;
        margin: auto !important;
        align-items: center !important;
    }

    #kt_aside .aside-menu .menu > .menu-item {
        width: 100%;
        margin-bottom: 0.65rem !important;
        display: flex;
        justify-content: center;
    }

    #kt_aside .aside-menu .menu > .menu-item:last-child {
        margin-bottom: 0 !important;
    }

    #kt_aside .aside-menu .menu > .menu-item > .menu-link.menu-center {
        justify-content: center !important;
        width: auto;
        margin: 0 auto;
    }

    #kt_aside .aside-footer.flex-column-auto {
        flex-shrink: 0;
        padding-top: 0.5rem !important;
        padding-bottom: 1.25rem !important;
    }

    .oat-aside-profile-trigger {
        position: relative;
    }

    .oat-aside-profile-avatar-trigger {
        display: inline-flex;
        line-height: 0;
        text-decoration: none;
    }

    .oat-aside-profile-menu label.menu-link,
    .oat-aside-profile-menu button.menu-link {
        cursor: pointer;
    }
}

/* Listing cards: programs & team members */

.oat-listing-card {
    border-radius: 16px;
    overflow: hidden;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.oat-listing-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(81, 60, 146, 0.15);
}

.oat-listing-card-visual {
    position: relative;
    overflow: hidden;
    background: #0f172a;
}

.oat-program-card-visual {
    aspect-ratio: 16 / 10;
}

.oat-team-card-visual {
    aspect-ratio: 4 / 5;
}

.oat-listing-card-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.03);
    transition: transform 0.35s ease;
}

.oat-listing-card:hover .oat-listing-card-bg {
    transform: scale(1.07);
}

.oat-listing-card-fg {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 108%;
    max-width: 58%;
    object-fit: contain;
    object-position: bottom right;
    pointer-events: none;
    z-index: 2;
}

.oat-listing-card-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(15, 23, 42, 0.05) 0%,
        rgba(15, 23, 42, 0.35) 45%,
        rgba(15, 23, 42, 0.92) 100%
    );
    z-index: 1;
}

.oat-listing-card-badges {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.oat-listing-card-overlay {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 14px 16px;
    z-index: 3;
    color: #fff;
}

.oat-listing-card-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.2;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
}

.oat-listing-card-sub {
    margin: 4px 0 0;
    font-size: 0.85rem;
    opacity: 0.92;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.45);
}

.oat-listing-card-body {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.oat-listing-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    font-weight: 600;
}

.oat-listing-meta a {
    text-decoration: none;
}

.oat-listing-details {
    margin: 0;
    font-size: 0.8125rem;
    color: var(--bs-gray-600);
    line-height: 1.5;
}

.oat-listing-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: auto;
    padding-top: 4px;
}

.oat-listing-empty {
    border: 1px dashed var(--bs-border-color);
    border-radius: 16px;
    background: rgba(var(--bs-primary-rgb), 0.03);
}

/* Dashboard */

.oat-dashboard-page {
    --oat-dashboard-gradient: linear-gradient(135deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
}

/* Hero welcome bar */

.oat-dashboard-hero {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    background: var(--oat-dashboard-gradient);
    box-shadow: 0 16px 48px rgba(var(--bs-primary-rgb), 0.22);
}

.oat-dashboard-hero-glow {
    position: absolute;
    top: -40%;
    right: -10%;
    width: 55%;
    height: 180%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.18) 0%, transparent 70%);
    pointer-events: none;
}

.oat-dashboard-hero-inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 24px 28px;
    color: #fff;
}

.oat-dashboard-hero-profile {
    display: flex;
    align-items: center;
    gap: 18px;
    min-width: 0;
}

.oat-dashboard-hero-avatar {
    width: 64px;
    height: 64px;
    overflow: visible;
    flex-shrink: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.oat-dashboard-hero-avatar:not(.oat-hex-avatar) {
    border-radius: 16px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.15);
    border: 2px solid rgba(255, 255, 255, 0.35);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.oat-dashboard-hero-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.oat-dashboard-hero-greeting {
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.oat-dashboard-hero-message {
    font-size: 0.9rem;
    opacity: 0.9;
    margin-top: 2px;
}

.oat-dashboard-hero-station {
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    opacity: 0.75;
    margin-top: 6px;
}

.oat-dashboard-hero-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.oat-dashboard-hero-pill {
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    backdrop-filter: blur(6px);
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease;
}

.oat-dashboard-hero-pill--action:hover {
    background: rgba(255, 255, 255, 0.28);
    color: #fff;
    transform: translateY(-1px);
}

/* Section headers */

.oat-dashboard-section-header {
    margin-bottom: 20px;
}

.oat-dashboard-section-header h2 {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--bs-gray-800);
}

html[data-bs-theme="dark"] .oat-dashboard-section-header h2 {
    color: var(--bs-gray-200);
}

/* Now on air — same layout as embed widgets: extra height for foreground overflow */

.oat-dashboard-onair-shell {
    border-radius: 18px;
    overflow: visible;
    background: transparent;
    box-shadow: none;
}

.dashboard-onair-outer {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10.35;
    overflow: visible;
}

.dashboard-onair-outer .onair-visual-wrapper {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: visible;
}

.dashboard-onair-outer .onair-background {
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.2);
}

.oat-dashboard-onair-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(15, 23, 42, 0.72) 0%,
        rgba(15, 23, 42, 0.25) 45%,
        rgba(15, 23, 42, 0.05) 100%
    );
    border-radius: inherit;
    z-index: 1;
}

.dashboard-onair-col .onair-text {
    z-index: 3;
}

.dashboard-onair-col .onair-title {
    font-size: clamp(1.25rem, 2.5vw, 1.75rem);
    font-weight: 800;
}

.dashboard-onair-col .onair-dj {
    font-size: clamp(0.95rem, 1.8vw, 1.15rem);
    opacity: 0.95;
}

.oat-dashboard-onair-badge {
    display: inline-block;
    padding: 0.5rem 0.85rem;
    font-size: 0.75rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #fff;
    background: var(--oat-dashboard-gradient);
    border-radius: 999px;
    box-shadow: 0 6px 16px rgba(var(--bs-primary-rgb), 0.35);
}

.dashboard-onair-col .onair-foreground.is-visible,
.dashboard-next-visual .onair-foreground.is-visible {
    opacity: 1;
    -webkit-mask-position: 0 0;
    mask-position: 0 0;
    animation: none;
    z-index: 2;
}

/* Next program card */

.oat-dashboard-next-card {
    display: flex;
    flex-direction: column;
    border-radius: 18px;
    overflow: visible;
    background: var(--bs-body-bg);
    border: none;
    box-shadow: 0 12px 40px rgba(15, 23, 42, 0.1);
}

html[data-bs-theme="dark"] .oat-dashboard-next-card {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
}

.oat-dashboard-next-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 18px;
    background: var(--oat-dashboard-gradient);
    color: #fff;
    font-size: 0.85rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 18px 18px 0 0;
}

.oat-dashboard-next-body {
    flex: 1;
    padding: 0;
    overflow: visible;
    background: transparent;
}

.oat-dashboard-next-body .dashboard-onair-outer {
    margin-bottom: 0;
}

.oat-dashboard-next-time {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px 18px;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--bs-gray-600);
    background: var(--bs-body-bg);
    border-radius: 0 0 18px 18px;
}

.oat-dashboard-next-body .oat-dashboard-module-empty {
    margin: 18px;
}

.dashboard-next-visual-outer {
    aspect-ratio: 16 / 10.35;
}

.dashboard-next-visual .onair-background {
    border-radius: 12px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.16);
}

.dashboard-next-visual .onair-text {
    z-index: 3;
}

.dashboard-next-visual .onair-title {
    font-size: 1rem;
    font-weight: 800;
}

/* Program strip visuals */

.dashboard-program-strip-visual {
    width: 72px;
    border-radius: 8px;
    flex-shrink: 0;
}

.dashboard-program-strip-visual.oat-program-card-visual {
    aspect-ratio: 16 / 10;
}

.dashboard-program-strip-visual .oat-listing-card-fg {
    height: 105%;
    max-width: 62%;
}

.dashboard-program-strip-visual .oat-listing-card-gradient {
    background: linear-gradient(
        180deg,
        rgba(15, 23, 42, 0.1) 0%,
        rgba(15, 23, 42, 0.55) 100%
    );
}

/* Module cards */

.oat-dashboard-module {
    display: flex;
    flex-direction: column;
    height: 100%;
    border-radius: 18px;
    overflow: hidden;
    background: var(--bs-body-bg);
    border: none;
    box-shadow: 0 12px 40px rgba(15, 23, 42, 0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

html[data-bs-theme="dark"] .oat-dashboard-module {
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
}

.oat-dashboard-module:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 48px rgba(var(--bs-primary-rgb), 0.14);
}

.oat-dashboard-module-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    background: var(--oat-dashboard-gradient);
    color: #fff;
}

.oat-dashboard-module-header-main {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.oat-dashboard-module-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.25);
    flex-shrink: 0;
}

.oat-dashboard-module-icon i {
    font-size: 1.35rem;
    color: #fff;
}

.oat-dashboard-module-title {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: 0.02em;
}

.oat-dashboard-module-subtitle {
    margin: 3px 0 0;
    font-size: 0.75rem;
    opacity: 0.88;
    font-weight: 600;
}

.oat-dashboard-module-header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

.oat-dashboard-module-metric {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 1.1rem;
    font-weight: 800;
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.oat-dashboard-module-cta {
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--bs-primary);
    background: #fff;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.oat-dashboard-module-cta:hover {
    color: var(--bs-primary);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

.oat-dashboard-module-cta--upgrade {
    color: #b45309;
    background: #fef3c7;
}

.oat-dashboard-module-body {
    flex: 1;
    padding: 16px 18px 18px;
    display: flex;
    flex-direction: column;
}

.oat-dashboard-module--locked .oat-dashboard-module-items,
.oat-dashboard-module--locked .oat-dashboard-chart-list,
.oat-dashboard-module--locked .oat-dashboard-module-empty {
    opacity: 0.5;
    pointer-events: none;
}

.oat-dashboard-module-locked-notice {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    margin-bottom: 14px;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 700;
    color: #b45309;
    background: rgba(245, 158, 11, 0.1);
    border: 1px dashed rgba(245, 158, 11, 0.45);
}

.oat-dashboard-module-progress {
    margin-bottom: 14px;
}

.oat-dashboard-module-progress-labels {
    display: flex;
    justify-content: space-between;
    margin-bottom: 6px;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-gray-600);
}

.oat-dashboard-module-progress .progress-bar {
    background: var(--oat-dashboard-gradient);
}

/* Module item rows */

.oat-dashboard-module-items {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.oat-dashboard-module-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    background: rgba(var(--bs-primary-rgb), 0.04);
    border: 1px solid rgba(var(--bs-primary-rgb), 0.08);
    transition: background 0.2s ease, border-color 0.2s ease;
}

.oat-dashboard-module-item:hover {
    background: rgba(var(--bs-primary-rgb), 0.08);
    border-color: rgba(var(--bs-primary-rgb), 0.15);
}

.oat-dashboard-module-item-visual .dashboard-program-strip-visual {
    width: 64px;
}

.oat-dashboard-module-item-cover {
    width: 44px;
    height: 44px;
    border-radius: 8px;
    object-fit: cover;
    flex-shrink: 0;
}

.oat-dashboard-module-item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    flex-shrink: 0;
    background: var(--oat-dashboard-gradient);
    color: #fff;
}

.oat-dashboard-module-item-icon i {
    font-size: 1.1rem;
}

.oat-dashboard-module-item-primary {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--bs-gray-900);
}

html[data-bs-theme="dark"] .oat-dashboard-module-item-primary {
    color: var(--bs-gray-100);
}

.oat-dashboard-module-item-secondary {
    font-size: 0.75rem;
    color: var(--bs-gray-600);
    margin-top: 2px;
}

.oat-dashboard-module-item-badge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 28px;
    padding: 0 8px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 800;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.12);
}

.oat-dashboard-module-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 32px 16px;
    border-radius: 12px;
    border: 1px dashed var(--bs-border-color);
    background: rgba(var(--bs-primary-rgb), 0.03);
    flex: 1;
}

.oat-dashboard-module-empty i {
    font-size: 2.5rem;
    color: var(--bs-gray-400);
    margin-bottom: 12px;
}

.oat-dashboard-module-empty p {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--bs-gray-600);
}

/* Chart list inside modules */

.oat-dashboard-chart-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid rgba(var(--bs-primary-rgb), 0.1);
    border-radius: 12px;
    overflow: hidden;
    background: rgba(var(--bs-primary-rgb), 0.03);
}

.oat-dashboard-chart-item {
    display: grid;
    grid-template-columns: 48px 42px 48px minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    padding: 10px 14px;
    border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.08);
    transition: background 0.2s ease;
}

.oat-dashboard-chart-item:hover {
    background: rgba(var(--bs-primary-rgb), 0.06);
}

.oat-dashboard-chart-item:last-child {
    border-bottom: 0;
}

.oat-dashboard-chart-position {
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1;
    color: var(--bs-primary);
    text-align: center;
}

.oat-dashboard-chart-move-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 42px;
}

.oat-dashboard-chart-artist {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--bs-gray-900);
}

html[data-bs-theme="dark"] .oat-dashboard-chart-artist {
    color: var(--bs-gray-100);
}

.oat-dashboard-chart-title {
    font-size: 0.8rem;
    color: var(--bs-gray-600);
}

/* Invitations */

.oat-dashboard-invitations {
    border-radius: 18px;
    overflow: hidden;
    background: var(--bs-body-bg);
    border: none;
    box-shadow: 0 12px 40px rgba(15, 23, 42, 0.08);
}

.oat-dashboard-invitations .oat-dashboard-section-header {
    padding: 16px 18px 0;
    margin-bottom: 12px;
}

.oat-dashboard-invitation-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    border-top: 1px solid var(--bs-border-color);
}

.oat-dashboard-invitation-station {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--bs-gray-900);
}

html[data-bs-theme="dark"] .oat-dashboard-invitation-station {
    color: var(--bs-gray-100);
}

.oat-dashboard-invitation-owner {
    font-size: 0.8rem;
    color: var(--bs-gray-600);
    margin-top: 2px;
}

.oat-dashboard-modules {
    margin-bottom: 8px;
}

@media (max-width: 767px) {
    .oat-dashboard-hero-inner {
        padding: 20px;
    }

    .oat-dashboard-module-header {
        flex-wrap: wrap;
    }

    .oat-dashboard-module-header-actions {
        width: 100%;
        justify-content: flex-end;
    }
}

.oat-track-cover {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    background: var(--bs-gray-200);
    flex-shrink: 0;
}

.oat-track-cover--placeholder {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: var(--bs-gray-500);
    background: linear-gradient(135deg, var(--bs-gray-100) 0%, var(--bs-gray-300) 100%);
}

.oat-chart-move--up {
    color: #16a34a;
    font-weight: 700;
    font-size: 12px;
}

.oat-chart-move--down {
    color: #dc2626;
    font-weight: 700;
    font-size: 12px;
}

.oat-chart-move--same {
    color: var(--bs-gray-500);
    font-size: 12px;
}

.oat-chart-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--bs-primary);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}

/* Inbox */

.oat-inbox-toolbar .btn {
    white-space: nowrap;
}

.oat-inbox-quota .card {
    border: 1px solid var(--bs-border-color);
    box-shadow: none;
}

.oat-inbox-quota-card-warning {
    border-color: rgba(var(--bs-warning-rgb), 0.45) !important;
    background: rgba(var(--bs-warning-rgb), 0.04);
}

.oat-inbox-quota-used,
.oat-inbox-quota-max {
    min-width: 2rem;
    font-size: 1.1rem;
    line-height: 1;
    color: var(--bs-gray-800);
}

.oat-inbox-quota-max {
    text-align: right;
    color: var(--bs-gray-600);
}

.oat-inbox-quota-bar .progress {
    border-radius: 999px;
}

[data-bs-theme="dark"] .oat-inbox-quota-used,
[data-bs-theme="dark"] .oat-inbox-quota-max {
    color: var(--bs-gray-200);
}

.oat-inbox-stats .oat-inbox-stat-card {
    border: 1px solid var(--bs-border-color);
    box-shadow: none;
}

.oat-inbox-stat-card-warning {
    border-color: rgba(var(--bs-warning-rgb), 0.45) !important;
    background: rgba(var(--bs-warning-rgb), 0.04);
}

.oat-inbox-stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    flex-shrink: 0;
}

.oat-inbox-stat-value {
    font-size: 1.75rem;
    font-weight: 800;
    line-height: 1.2;
    color: var(--bs-gray-900);
}

.oat-inbox-hint {
    border: 1px dashed rgba(var(--bs-primary-rgb), 0.25);
    background: rgba(var(--bs-primary-rgb), 0.03);
}

.oat-inbox-queue-hint {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(var(--bs-primary-rgb), 0.06);
    color: var(--bs-gray-700);
    font-size: 0.875rem;
    line-height: 1.45;
}

.oat-inbox-history-toggle.active {
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--bs-primary);
    border-color: rgba(var(--bs-primary-rgb), 0.25);
}

[data-bs-theme="dark"] .oat-inbox-queue-hint {
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--bs-gray-400);
}

[data-bs-theme="dark"] .oat-inbox-stat-value {
    color: var(--bs-gray-100);
}

[data-bs-theme="dark"] .oat-inbox-hint {
    background: rgba(var(--bs-primary-rgb), 0.08);
}

.oat-inbox-page {
    --oat-inbox-scale: 1;
}

/* Normal (non-fullscreen) inbox: more air between columns and cards */
body:not(.oat-inbox-fullscreen) .oat-inbox-page.oat-inbox-page {
    --oat-inbox-item-gap: 1.25rem;
    --oat-inbox-action-size: 3.75rem;
    --oat-inbox-action-icon: 1.85rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-page #inbox-columns-row.oat-inbox-columns {
    --bs-gutter-x: 2.25rem;
    --bs-gutter-y: 2rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-page #inbox-columns-row > [class*="col-"] {
    display: flex;
    flex-direction: column;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-page #inbox-columns-row .card {
    flex: 1 1 auto;
    min-height: 0;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-page .card-header {
    padding-top: 1.35rem;
    padding-bottom: 1.35rem;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-page .card-body {
    padding-left: 1.75rem !important;
    padding-right: 1.75rem !important;
}

@media (min-width: 1200px) {
    body:not(.oat-inbox-fullscreen) .oat-inbox-page .card-body {
        padding-left: 2rem !important;
        padding-right: 2rem !important;
    }
}

body:not(.oat-inbox-fullscreen) .oat-inbox-queue {
    gap: var(--oat-inbox-item-gap, 1.25rem);
}

body:not(.oat-inbox-fullscreen) .oat-inbox-item {
    padding: 1.25rem 1.5rem;
    gap: 1.25rem 1.5rem;
    border-radius: 16px;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-item-main {
    flex: 1 1 280px;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-item-header {
    gap: 1rem;
    margin-bottom: 0.65rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-message {
    margin-bottom: 0.85rem;
    padding: 0.75rem 1rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-meta {
    gap: 0.65rem 1.25rem;
    row-gap: 0.5rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-actions {
    grid-template-columns: repeat(2, var(--oat-inbox-action-size, 3.75rem));
    gap: 0.65rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-actions .btn.btn-icon.inbox-action {
    width: var(--oat-inbox-action-size, 3.75rem);
    height: var(--oat-inbox-action-size, 3.75rem);
    min-width: var(--oat-inbox-action-size, 3.75rem);
    min-height: var(--oat-inbox-action-size, 3.75rem);
    border-radius: 0.85rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-actions .btn.btn-icon.inbox-action i {
    font-size: var(--oat-inbox-action-icon, 1.85rem) !important;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-history {
    gap: 0.85rem;
    max-height: min(780px, calc(100vh - 18rem));
}

body:not(.oat-inbox-fullscreen) .oat-inbox-history-item {
    padding: 0.85rem 1.1rem;
}

body:not(.oat-inbox-fullscreen) .oat-teleb-messages {
    max-height: min(780px, calc(100vh - 18rem));
    gap: 0.85rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-queue-hint {
    margin-bottom: 1.25rem;
    padding: 0.85rem 1.1rem;
}

body:not(.oat-inbox-fullscreen) .oat-inbox-page.show-history #inbox-queue-col .oat-inbox-queue,
body:not(.oat-inbox-fullscreen) .oat-inbox-page.show-history #inbox-history-col .oat-inbox-history {
    max-height: min(720px, calc(100vh - 20rem));
    overflow-y: auto;
    padding-right: 0.35rem;
}

.oat-inbox-page.oat-inbox-text-lg {
    --oat-inbox-scale: 1.18;
}

.oat-inbox-page.oat-inbox-text-xl {
    --oat-inbox-scale: 1.36;
}

.oat-inbox-page .oat-inbox-toolbar-note {
    font-size: calc(1rem * var(--oat-inbox-scale));
}

.oat-inbox-page .alert .fw-bold {
    font-size: calc(1.08rem * var(--oat-inbox-scale));
}

.oat-inbox-page .alert .text-muted {
    font-size: calc(0.98rem * var(--oat-inbox-scale));
}

.oat-inbox-page .card-title h2 {
    font-size: calc(1.45rem * var(--oat-inbox-scale));
}

.oat-inbox-page .oat-inbox-empty {
    font-size: calc(1.05rem * var(--oat-inbox-scale));
}

.oat-inbox-page .oat-inbox-item .badge,
.oat-inbox-page .oat-inbox-history-item .badge {
    font-size: calc(0.88rem * var(--oat-inbox-scale));
}

.oat-inbox-text-toggle {
    font-size: calc(1rem * var(--oat-inbox-scale));
    font-weight: 700;
    padding: 0.85rem 1.15rem;
}

.oat-inbox-queue {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.oat-inbox-item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    border: 1px solid var(--bs-border-color);
    border-radius: 14px;
    background: var(--bs-body-bg);
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.oat-inbox-item-new {
    animation: oatInboxSlideIn 0.45s ease;
    border-color: rgba(var(--bs-primary-rgb), 0.35);
    box-shadow: 0 8px 24px rgba(var(--bs-primary-rgb), 0.12);
}

@keyframes oatInboxSlideIn {
    from {
        opacity: 0;
        transform: translateY(16px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.oat-inbox-item-main {
    flex: 1 1 320px;
    min-width: 0;
}

.oat-inbox-item-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.oat-inbox-song {
    font-size: calc(1.25rem * var(--oat-inbox-scale));
    font-weight: 800;
    color: var(--bs-gray-900);
    line-height: 1.25;
}

.oat-inbox-alt,
.oat-inbox-message {
    font-size: calc(1.02rem * var(--oat-inbox-scale));
    color: var(--bs-gray-600);
    line-height: 1.45;
}

.oat-inbox-message {
    margin-bottom: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(var(--bs-primary-rgb), 0.06);
}

.oat-inbox-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    font-size: calc(0.98rem * var(--oat-inbox-scale));
    color: var(--bs-gray-700);
}

.oat-inbox-actions {
    display: grid;
    grid-template-columns: repeat(2, 6rem);
    gap: 10px;
    align-content: start;
    flex-shrink: 0;
    align-self: center;
}

.oat-inbox-actions .btn.btn-icon.inbox-action {
    width: 6rem;
    height: 6rem;
    min-width: 6rem;
    min-height: 6rem;
    padding: 0;
}

.oat-inbox-actions .btn.btn-icon.inbox-action i {
    line-height: 1;
    font-size: 2.5rem !important;
}

.oat-inbox-toolbar-btn.btn.btn-icon {
    width: 3.25rem;
    height: 3.25rem;
    min-width: 3.25rem;
    min-height: 3.25rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
}

.oat-inbox-toolbar-btn.btn.btn-icon i {
    line-height: 1;
    font-size: 1.5rem !important;
}

.oat-inbox-count-badge {
    min-width: 3.25rem;
    min-height: 3.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.65rem;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 0.75rem;
}

.oat-inbox-history {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 720px;
    overflow-y: auto;
}

.oat-inbox-history-item {
    padding: 12px 14px;
    border: 1px solid var(--bs-border-color);
    border-radius: 12px;
    background: rgba(var(--bs-primary-rgb), 0.02);
}

.oat-inbox-page .oat-inbox-history-item .oat-inbox-history-song {
    font-size: calc(1.08rem * var(--oat-inbox-scale));
    font-weight: 700;
    color: var(--bs-gray-800);
    line-height: 1.3;
}

.oat-inbox-page .oat-inbox-history-item .oat-inbox-history-meta {
    font-size: calc(0.95rem * var(--oat-inbox-scale));
    color: var(--bs-gray-600);
}

.oat-inbox-empty {
    padding: 48px 16px;
    text-align: center;
    color: var(--bs-gray-600);
    border: 1px dashed var(--bs-border-color);
    border-radius: 14px;
}

.oat-blocked-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.oat-blocked-item {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    border: 1px solid var(--bs-border-color);
    border-radius: 14px;
    background: rgba(var(--bs-danger-rgb), 0.03);
}

.oat-blocked-main {
    flex: 1 1 320px;
    min-width: 0;
}

.oat-blocked-title {
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--bs-gray-900);
    line-height: 1.25;
}

.oat-blocked-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    margin-top: 8px;
    font-size: 0.8125rem;
    color: var(--bs-gray-700);
}

.oat-blocked-reason {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: rgba(var(--bs-danger-rgb), 0.06);
    font-size: 0.875rem;
    color: var(--bs-gray-700);
    line-height: 1.45;
}

.oat-teleb-messages {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-height: 420px;
    overflow-y: auto;
    padding-right: 4px;
}

.oat-teleb-item {
    border: 1px solid var(--bs-gray-200);
    border-radius: 12px;
    padding: 12px 14px;
    background: var(--bs-body-bg);
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.oat-teleb-item:hover {
    border-color: var(--bs-primary);
    box-shadow: 0 0 0 1px rgba(var(--bs-primary-rgb), 0.15);
}

.oat-teleb-item-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.oat-teleb-sender {
    font-size: calc(1rem * var(--oat-inbox-scale, 1));
    font-weight: 600;
    line-height: 1.3;
}

.oat-teleb-phone {
    font-size: calc(0.85rem * var(--oat-inbox-scale, 1));
}

.oat-teleb-body {
    font-size: calc(0.98rem * var(--oat-inbox-scale, 1));
    line-height: 1.45;
    white-space: pre-wrap;
    word-break: break-word;
}

.oat-teleb-meta {
    margin-top: 8px;
    font-size: calc(0.82rem * var(--oat-inbox-scale, 1));
}

.oat-teleb-body .oat-teleb-text + .oat-teleb-media,
.oat-teleb-chat-text .oat-teleb-text + .oat-teleb-media {
    margin-top: 8px;
}

.oat-teleb-media-list {
    margin-top: 8px;
}

.oat-teleb-media-chat {
    margin-top: 6px;
}

.oat-teleb-media-image {
    display: block;
    max-width: 100%;
    max-height: 220px;
    width: 100%;
    border-radius: 10px;
    object-fit: cover;
}

.oat-teleb-image-open {
    position: relative;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: zoom-in;
    border-radius: 12px;
    overflow: hidden;
}

.oat-teleb-image-open:hover .oat-teleb-image-zoom,
.oat-teleb-image-open:focus-visible .oat-teleb-image-zoom {
    opacity: 1;
}

.oat-teleb-image-zoom {
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.62);
    color: #fff;
    opacity: 0.88;
    transition: opacity 0.15s ease, transform 0.15s ease;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

.oat-teleb-image-open:hover .oat-teleb-image-zoom {
    transform: scale(1.05);
}

.oat-teleb-image-zoom svg {
    width: 20px;
    height: 20px;
}

.oat-teleb-lightbox-content {
    background: transparent;
}

.oat-teleb-lightbox-image {
    max-height: min(85vh, 900px);
    width: auto;
    margin: 0 auto;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
}

#teleb-image-lightbox .modal-backdrop,
#teleb-image-lightbox.show ~ .modal-backdrop {
    opacity: 0.88;
}

.oat-teleb-media-list .oat-teleb-media-image {
    max-height: 160px;
}

.oat-teleb-media-list .oat-teleb-audio-player {
    width: 100%;
    min-width: 0;
}

.oat-teleb-media-video {
    display: block;
    width: min(100%, 320px);
    max-width: 100%;
}

.oat-teleb-audio-player-radio {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    width: min(100%, 380px);
    min-width: 260px;
    padding: 12px 14px;
    border-radius: 16px;
    background: linear-gradient(180deg, #1f2937 0%, #111827 100%);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 8px 24px rgba(0, 0, 0, 0.18);
}

.oat-teleb-audio-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.oat-teleb-audio-play,
.oat-teleb-audio-pause,
.oat-teleb-audio-stop {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
}

.oat-teleb-audio-play svg,
.oat-teleb-audio-pause svg,
.oat-teleb-audio-stop svg {
    width: 18px;
    height: 18px;
}

.oat-teleb-audio-play {
    background: var(--bs-primary);
    color: #fff;
}

.oat-teleb-audio-pause {
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
}

.oat-teleb-audio-stop {
    background: rgba(var(--bs-danger-rgb), 0.85);
    color: #fff;
}

.oat-teleb-audio-play:hover:not(:disabled),
.oat-teleb-audio-pause:hover:not(:disabled),
.oat-teleb-audio-stop:hover:not(:disabled) {
    transform: translateY(-1px);
}

.oat-teleb-audio-play:disabled,
.oat-teleb-audio-pause:disabled,
.oat-teleb-audio-stop:disabled {
    opacity: 0.35;
    cursor: not-allowed;
    transform: none;
}

.oat-teleb-audio-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.oat-teleb-audio-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.72);
}

.oat-teleb-audio-progress {
    position: relative;
    height: 8px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.12);
}

.oat-teleb-audio-progress-bar {
    height: 100%;
    width: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--bs-primary) 0%, #ff6b6b 100%);
    transition: width 0.1s linear;
}

.oat-teleb-audio-time {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.88rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    color: #fff;
}

.oat-teleb-audio-separator {
    opacity: 0.55;
}

.oat-teleb-audio-player audio {
    display: none;
}

.oat-teleb-chat-bubble.is-outbound .oat-teleb-media-video {
    margin-left: auto;
}

.oat-teleb-reply textarea {
    resize: vertical;
    min-height: 72px;
}

.oat-teleb-chat-messages {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: min(52vh, 480px);
    overflow-y: auto;
}

.oat-teleb-chat-bubble {
    max-width: 85%;
    padding: 10px 14px;
    border-radius: 14px;
    line-height: 1.45;
    word-break: break-word;
    white-space: pre-wrap;
}

.oat-teleb-chat-bubble.is-inbound {
    align-self: flex-start;
    background: var(--bs-gray-100);
    border-bottom-left-radius: 4px;
}

.oat-teleb-chat-bubble.is-outbound {
    align-self: flex-end;
    background: rgba(var(--bs-primary-rgb), 0.12);
    border-bottom-right-radius: 4px;
}

.oat-teleb-chat-text {
    font-size: 0.95rem;
}

.oat-teleb-chat-time {
    margin-top: 6px;
    font-size: 0.75rem;
    color: var(--bs-gray-600);
}

[data-bs-theme="dark"] .oat-teleb-chat-bubble.is-inbound {
    background: var(--bs-gray-800);
}

[data-bs-theme="dark"] .oat-teleb-item {
    border-color: var(--bs-gray-700);
}

[data-bs-theme="dark"] .oat-inbox-song {
    color: var(--bs-gray-100);
}

/* Sticky header: page title colors follow theme */
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title,
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title h1,
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title h2,
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title span,
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title small,
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title .text-white,
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title .text-gray-800 {
    color: var(--oat-page-title-color) !important;
}

[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title small,
[data-bs-theme="light"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title .opacity-75 {
    color: var(--oat-page-title-color) !important;
    opacity: 0.75 !important;
}

[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title,
[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title h1,
[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title h2,
[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title span,
[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title small,
[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title .text-white {
    color: var(--oat-page-title-color) !important;
}

[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title small,
[data-bs-theme="dark"] .header-fixed[data-kt-sticky-header=on] #kt_header.bg-body .page-title .opacity-75 {
    color: var(--oat-page-title-color) !important;
    opacity: 0.75 !important;
}

@media (max-width: 991.98px) {
    .oat-content-container {
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }
}

/* Hexagon avatars — rounded vertical hex via clip-path (css-tip.com / Metronic .xehagon) */
.oat-hex-avatar {
    position: relative;
    display: inline-block;
    flex-shrink: 0;
    vertical-align: middle;
    text-decoration: none;
    line-height: 0;
    background: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
    clip-path: var(--oat-hex-clip);
}

/* Scaled inner hex — uniform border incl. top/bottom points (rect inset leaves gaps there) */
.oat-hex-avatar-inner {
    position: absolute;
    inset: 0;
    display: block;
    clip-path: var(--oat-hex-clip);
    transform: scale(var(--oat-hex-fill-scale));
    transform-origin: center center;
}

.oat-hex-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center center;
    background: var(--bs-body-bg);
}

.oat-hex-avatar--logo .oat-hex-avatar-inner,
.oat-hex-avatar--logo img {
    background: #fff;
}

.oat-hex-avatar--logo img {
    object-fit: contain;
    padding: 12%;
    box-sizing: border-box;
}

.oat-hex-avatar--xs { width: 32px; height: 32px; }
.oat-hex-avatar--sm { width: 40px; height: 40px; }
.oat-hex-avatar--md { width: 50px; height: 50px; }
.oat-hex-avatar--lg { width: 72px; height: 72px; }
.oat-hex-avatar--xl { width: 64px; height: 64px; }

/* Header / toolbar hex icon buttons — same clip as aside nav tiles */
.oat-hex-action {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent;
    text-decoration: none;
    line-height: 0;
    color: var(--bs-primary);
    cursor: pointer;
    appearance: none;
    box-shadow: none;
}

.oat-hex-action__tile {
    position: absolute;
    inset: 0;
    clip-path: var(--oat-hex-clip);
    background: rgba(var(--bs-primary-rgb), 0.12);
    transition: background 0.15s ease;
}

.oat-hex-action i {
    position: relative;
    z-index: 1;
    font-size: 1.25rem;
    line-height: 1;
    color: var(--bs-primary);
    transition: color 0.15s ease;
}

.oat-hex-action:hover .oat-hex-action__tile,
.oat-hex-action.oat-hex-action--alert .oat-hex-action__tile {
    background: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
}

.oat-hex-action:hover i,
.oat-hex-action.oat-hex-action--alert i,
.oat-hex-action:hover .oat-hex-action__letter,
.oat-hex-action.oat-hex-action--alert .oat-hex-action__letter {
    color: #fff;
}

.oat-hex-action__letter {
    position: relative;
    z-index: 1;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1;
    color: var(--bs-primary);
    text-transform: uppercase;
}

.oat-hex-action--xs {
    width: 32px;
    height: 32px;
}

.oat-hex-action--xs i {
    font-size: 1rem;
}

.oat-hex-action--static {
    cursor: default;
    pointer-events: none;
}

.oat-hex-action:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 3px;
}

.oat-hex-action__badge {
    position: absolute;
    top: -2px;
    right: -2px;
    z-index: 2;
    min-width: 1.05rem;
    height: 1.05rem;
    padding: 0 0.25rem;
    border-radius: 999px;
    background: var(--bs-danger);
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1.05rem;
    text-align: center;
}

html[data-bs-theme="dark"] .oat-hex-action__tile {
    background: rgba(var(--bs-primary-rgb), 0.22);
}

html[data-bs-theme="dark"] .oat-hex-action:hover .oat-hex-action__tile,
html[data-bs-theme="dark"] .oat-hex-action.oat-hex-action--alert .oat-hex-action__tile {
    background: linear-gradient(180deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
}

.oat-header-user-trigger,
.oat-mobile-user-trigger {
    display: inline-flex;
    line-height: 0;
    text-decoration: none;
}

.oat-header-user-desktop {
    line-height: 0;
}

.oat-station-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-width: 0;
}

.oat-station-switcher__trigger {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
    max-width: 240px;
    height: 40px;
    padding: 0 0.7rem 0 0.25rem;
    border: 0;
    border-radius: 999px;
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--oat-page-title-color);
    text-decoration: none;
    cursor: pointer;
    appearance: none;
    box-shadow: none;
    transition: background 0.15s ease;
}

.oat-station-switcher__trigger:hover,
.oat-station-switcher.show .oat-station-switcher__trigger {
    background: rgba(var(--bs-primary-rgb), 0.2);
}

.oat-station-switcher__trigger:focus-visible {
    outline: 2px solid var(--bs-primary);
    outline-offset: 3px;
}

.oat-station-switcher__label {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.2;
}

.oat-station-switcher__caret {
    flex-shrink: 0;
    font-size: 0.85rem;
    opacity: 0.55;
}

.oat-station-switcher__menu {
    overflow: hidden;
    border-radius: 1rem !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
}

.oat-station-switcher__head,
.oat-station-switcher__foot {
    padding: 1rem 1.15rem;
}

.oat-station-switcher__head {
    border-bottom: 1px solid var(--bs-border-color);
}

.oat-station-switcher__foot {
    padding: 0.4rem 0.4rem 0.55rem;
    border-top: 1px solid var(--bs-border-color);
}

.oat-station-switcher__list {
    max-height: 18rem;
    overflow-y: auto;
}

.oat-station-switcher__form {
    margin: 0;
}

.oat-station-switcher__trigger .oat-hex-avatar,
.oat-station-switcher__item .oat-hex-avatar {
    pointer-events: none;
}

.oat-station-switcher__item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: 0.7rem 1rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    appearance: none;
    transition: background 0.15s ease;
}

.oat-station-switcher__item:hover,
.oat-station-switcher__item.is-current {
    background: rgba(var(--bs-primary-rgb), 0.06);
}

.oat-station-switcher__item-body {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
    gap: 0.1rem;
}

.oat-station-switcher__item-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.925rem;
    font-weight: 600;
    line-height: 1.25;
}

.oat-station-switcher__item-meta {
    font-size: 0.75rem;
    color: var(--bs-gray-500);
}

.oat-station-switcher__check {
    flex-shrink: 0;
    font-size: 1.15rem;
    color: var(--bs-primary);
}

.oat-station-switcher__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.5rem 1.15rem;
}

.oat-station-switcher__item--add {
    border-radius: 0.75rem;
}

.oat-station-switcher__item--add:hover {
    background: rgba(var(--bs-primary-rgb), 0.1);
}

html[data-bs-theme="dark"] .oat-station-switcher__trigger {
    background: rgba(var(--bs-primary-rgb), 0.22);
    color: #fff;
}

html[data-bs-theme="dark"] .oat-station-switcher__item:hover,
html[data-bs-theme="dark"] .oat-station-switcher__item.is-current {
    background: rgba(255, 255, 255, 0.06);
}

.oat-mobile-topbar-actions .oat-notification-menu {
    margin-inline-start: 0.15rem;
}

.oat-user-menu {
    min-width: 320px;
}

.oat-user-menu > .menu-item > .menu-content {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

.oat-user-menu > .menu-item > .menu-link {
    min-height: 2.75rem;
}

.oat-user-menu .symbol.symbol-50px > img {
    object-fit: cover;
}

.oat-dashboard-hero-avatar.oat-hex-avatar {
    border: none;
    border-radius: 0;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    overflow: visible;
    --oat-hex-fill-scale: 0.88;
}

/* Mobile app shell */
@media (max-width: 991.98px) {
    .header-mobile.oat-mobile-topbar {
        display: block;
        width: 100%;
    }

    .oat-mobile-topbar {
        position: sticky;
        top: 0;
        z-index: 110;
        background: var(--bs-body-bg);
        border-bottom: 1px solid var(--bs-border-color);
        padding-top: max(0.75rem, env(safe-area-inset-top)) !important;
        padding-bottom: 0.75rem !important;
    }

    .oat-mobile-topbar-inner {
        display: grid;
        width: 100%;
        grid-template-columns: 44px 1fr auto;
        align-items: center;
        gap: 8px;
        padding: 0 16px;
    }

    .oat-mobile-topbar-logo {
        grid-column: 2;
        justify-self: center;
        display: inline-flex;
        line-height: 0;
    }

    .oat-mobile-topbar-logo img {
        width: 32px;
        height: 32px;
        object-fit: contain;
    }

    .oat-mobile-topbar-actions {
        grid-column: 3;
        position: relative;
        justify-self: end;
        display: inline-flex;
        align-items: center;
    }

    .oat-mobile-topbar-actions > .menu-sub-dropdown,
    .oat-mobile-topbar-actions .oat-notification-menu > .menu-sub-dropdown {
        position: absolute;
        top: calc(100% + 0.35rem);
        right: 0;
        left: auto;
    }

    .oat-mobile-menu-btn {
        grid-column: 1;
        margin: 0 !important;
        justify-self: start;
    }

    #kt_header.oat-app-header {
        height: auto !important;
        min-height: 0 !important;
        padding: 0.75rem 0 1rem !important;
        background: var(--bs-body-bg) !important;
        box-shadow: none !important;
    }

    #kt_header.oat-app-header .header-container {
        flex-direction: column;
        align-items: stretch !important;
        gap: 10px;
    }

    #kt_header .page-title {
        width: 100%;
        margin: 0 !important;
        padding: 0 !important;
    }

    #kt_header .page-title h1 {
        font-size: 1.25rem !important;
        line-height: 1.2;
    }

    #kt_header .page-title small {
        font-size: 0.78rem !important;
    }

    #kt_header .page-title,
    #kt_header .page-title h1,
    #kt_header .page-title h2,
    #kt_header .page-title span,
    #kt_header .page-title small,
    #kt_header .page-title .text-white {
        color: var(--oat-page-title-color) !important;
        opacity: 1 !important;
    }

    #kt_header .page-title small,
    #kt_header .page-title .opacity-75 {
        opacity: 0.75 !important;
    }

    .oat-header-toolbar {
        width: 100%;
    }

    .oat-header-toolbar > .d-flex.align-items-center {
        width: 100%;
        flex-wrap: wrap;
        gap: 8px;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .oat-header-team-switcher {
        flex: 1 1 auto;
        min-width: 0;
    }

    .oat-station-switcher,
    .oat-station-switcher__trigger {
        width: 100%;
        max-width: none;
    }

    .oat-station-switcher__menu {
        width: min(300px, calc(100vw - 2rem)) !important;
    }

    /* Mobile sidebar drawer */
    #kt_aside.aside {
        width: 280px !important;
        z-index: 120 !important;
        display: flex !important;
        flex-direction: column !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
    }

    #kt_aside #kt_aside_menu.aside-menu {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        overflow: hidden;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #kt_aside .aside-logo img,
    #kt_aside .aside-logo .app-logo {
        display: block;
        height: 56px !important;
        width: auto;
        max-width: 100%;
        margin: 0 auto;
    }

    #kt_aside .aside-logo.flex-column-auto {
        flex-shrink: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        padding-top: max(0.85rem, env(safe-area-inset-top)) !important;
        padding-bottom: 0.35rem !important;
    }

    #kt_aside #kt_aside_menu_wrapper {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: stretch !important;
    }

    #kt_aside #kt_aside_menu.menu-column {
        width: 100%;
        padding: 0 16px 8px;
        margin-top: auto !important;
        margin-bottom: auto !important;
    }

    #kt_aside .menu > .menu-item {
        margin-bottom: 2px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        width: 100%;
    }

    #kt_aside .menu-item {
        width: 100%;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    #kt_aside .menu-item .menu-item {
        padding: 0 !important;
        width: 100%;
    }

    #kt_aside .menu-link.menu-center {
        flex-direction: row;
        justify-content: flex-start !important;
        width: 100%;
        min-height: 40px;
        padding: 5px 10px;
        border-radius: 10px;
        gap: 10px;
    }

    #kt_aside .oat-aside-mobile-label {
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--bs-gray-800);
        line-height: 1.2;
    }

    html[data-bs-theme="dark"] #kt_aside .oat-aside-mobile-label {
        color: var(--bs-gray-200);
    }

    #kt_aside .menu-item.here > .menu-link.menu-center,
    #kt_aside .menu-item.show > .menu-link.menu-center {
        background: transparent;
    }

    /* Hex icon tiles — mobile sizing */
    #kt_aside .menu > .menu-item > .menu-link .menu-icon {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
    }

    #kt_aside .menu > .menu-item > .menu-link .menu-icon i {
        font-size: 1.1rem !important;
    }

    html[data-bs-theme="dark"] #kt_aside .menu > .menu-item > .menu-link .menu-icon {
        background: rgba(var(--bs-primary-rgb), 0.22);
    }

    /* Inline accordion submenus — flyouts clip off-screen in 280px drawer */
    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) {
        position: static !important;
        inset: auto !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        transform: none !important;
        display: none;
        flex-direction: column;
        width: 100% !important;
        max-width: none !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 0 2px !important;
        box-shadow: none !important;
        background: transparent !important;
        border-radius: 0 !important;
        overflow: visible !important;
        z-index: auto !important;
    }

    #kt_aside .menu-item.show > .menu-sub-dropdown:not(.oat-aside-profile-menu),
    #kt_aside .menu-item.here > .menu-sub-dropdown:not(.oat-aside-profile-menu),
    #kt_aside .show.menu-dropdown > .menu-sub-dropdown:not(.oat-aside-profile-menu) {
        display: flex !important;
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) .menu-sub-accordion {
        position: static !important;
        transform: none !important;
        display: none;
        padding-left: 4px;
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) .menu-item.menu-accordion.show > .menu-sub-accordion {
        display: flex !important;
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) .menu-link {
        min-height: 36px;
        padding: 5px 10px 5px 44px;
        border-radius: 8px;
        font-size: 0.875rem;
        justify-content: flex-start;
        text-align: left;
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) .menu-item .menu-item .menu-link {
        padding-left: 52px;
        min-height: 34px;
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) .menu-link .menu-bullet {
        width: 1rem;
        margin-right: 0.4rem;
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) .menu-link .menu-bullet i {
        font-size: 0.95rem !important;
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) > .menu-item:first-child .menu-content {
        display: none;
    }

    #kt_aside .menu-item:has(> .menu-sub-dropdown:not(.oat-aside-profile-menu)) > .menu-link.menu-center {
        position: relative;
        padding-right: 36px;
    }

    #kt_aside .menu-item:has(> .menu-sub-dropdown:not(.oat-aside-profile-menu)) > .menu-link.menu-center::after {
        content: "";
        position: absolute;
        right: 16px;
        top: 50%;
        width: 7px;
        height: 7px;
        margin-top: -4px;
        border-right: 2px solid var(--bs-gray-600);
        border-bottom: 2px solid var(--bs-gray-600);
        transform: rotate(45deg);
        transition: transform 0.2s ease;
    }

    #kt_aside .menu-item.show:has(> .menu-sub-dropdown:not(.oat-aside-profile-menu)) > .menu-link.menu-center::after,
    #kt_aside .menu-item.here:has(> .menu-sub-dropdown:not(.oat-aside-profile-menu)) > .menu-link.menu-center::after {
        transform: rotate(-135deg);
        margin-top: -2px;
    }

    html[data-bs-theme="dark"] #kt_aside .menu-item:has(> .menu-sub-dropdown:not(.oat-aside-profile-menu)) > .menu-link.menu-center::after {
        border-color: var(--bs-gray-400);
    }

    #kt_aside .menu-sub-dropdown:not(.oat-aside-profile-menu) .menu-accordion > .menu-link .menu-arrow {
        display: flex;
    }

    #kt_aside .aside-footer {
        flex-shrink: 0;
        padding-bottom: max(0.75rem, env(safe-area-inset-bottom)) !important;
        padding-top: 0.25rem !important;
    }

    #kt_aside .aside-footer .oat-hex-avatar--lg {
        width: 48px;
        height: 48px;
    }

    #kt_aside .oat-aside-mobile-footer {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #kt_aside .oat-aside-mobile-profile {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #kt_aside .oat-aside-mobile-profile-avatar-trigger {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 0;
        padding: 0;
        border: 0;
        background: transparent;
        border-radius: 0;
        cursor: pointer;
    }

    #kt_aside .oat-aside-mobile-profile-avatar-trigger[aria-expanded="true"] .oat-aside-mobile-profile-avatar {
        box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), 0.35);
    }

    #kt_aside .oat-aside-mobile-profile-avatar.oat-hex-avatar--lg {
        width: 64px;
        height: 64px;
    }

    #kt_aside .oat-aside-mobile-profile-menu {
        display: none;
        flex-direction: column;
        gap: 4px;
        width: 100%;
        margin-top: 0.65rem;
    }

    #kt_aside .oat-aside-mobile-profile-menu.show {
        display: flex;
    }

    #kt_aside .oat-aside-mobile-profile-link {
        display: flex;
        align-items: center;
        gap: 10px;
        width: 100%;
        min-height: 40px;
        padding: 8px 12px;
        border-radius: 10px;
        font-size: 0.875rem;
        font-weight: 600;
        color: var(--bs-gray-800);
        text-decoration: none;
        background: rgba(var(--bs-primary-rgb), 0.06);
        transition: background 0.15s ease;
        cursor: pointer;
        text-align: left;
    }

    #kt_aside .oat-aside-mobile-profile-link:hover,
    #kt_aside .oat-aside-mobile-profile-link:focus {
        background: rgba(var(--bs-primary-rgb), 0.12);
        color: var(--bs-primary);
    }

    html[data-bs-theme="dark"] #kt_aside .oat-aside-mobile-profile-link {
        color: var(--bs-gray-200);
        background: rgba(var(--bs-primary-rgb), 0.14);
    }

    html[data-bs-theme="dark"] #kt_aside .oat-aside-mobile-profile-link:hover,
    html[data-bs-theme="dark"] #kt_aside .oat-aside-mobile-profile-link:focus {
        color: var(--bs-primary);
        background: rgba(var(--bs-primary-rgb), 0.22);
    }

    #kt_aside .oat-aside-mobile-profile-link--logout {
        background: rgba(var(--bs-danger-rgb), 0.08);
        color: var(--bs-danger);
    }

    #kt_aside .oat-aside-mobile-profile-link--logout:hover,
    #kt_aside .oat-aside-mobile-profile-link--logout:focus {
        background: rgba(var(--bs-danger-rgb), 0.15);
        color: var(--bs-danger);
    }

    html[data-bs-theme="dark"] #kt_aside .oat-aside-mobile-profile-link--logout {
        background: rgba(var(--bs-danger-rgb), 0.16);
        color: #f87171;
    }
}

/* FullCalendar events in primary color */
.fc .fc-event {
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
    color: #fff !important;
}

/* hover effect */
.fc .fc-event:hover {
    background-color: var(--bs-primary-active) !important;
    border-color: var(--bs-primary-active) !important;
}
.fc .fc-col-header-cell-cushion {
    color: var(--bs-primary) !important;
}
.fc .fc-timegrid-now-indicator-line {
    border-color: var(--bs-secondary) !important;
}
.fc .fc-timegrid-now-indicator-arrow {
    border-color: var(--bs-secondary) !important;
}
/* Highlight current day column */
.fc .fc-day-today {
    background-color: rgba(var(--bs-primary-rgb), 0.08) !important;
}

/* Header van vandaag (dagtitel bovenaan) */
.fc .fc-col-header-cell.fc-day-today {
    background-color: rgba(var(--bs-primary-rgb), 0.12) !important;
}

/* Tijdlabel links bij vandaag (timeGrid view) */
.fc .fc-timegrid-col.fc-day-today {
    background-color: rgba(var(--bs-primary-rgb), 0.08) !important;
}

body.oat-inbox-fullscreen {
    overflow: hidden;
}

body.oat-inbox-fullscreen #oat-inbox-page {
    position: fixed;
    inset: 0;
    z-index: 106;
    background: var(--bs-body-bg);
    padding: 16px;
    margin: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: 100vh;
    height: 100dvh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

body.oat-inbox-fullscreen .oat-inbox-toolbar,
body.oat-inbox-fullscreen .oat-inbox-quota,
body.oat-inbox-fullscreen .oat-inbox-stats {
    display: none !important;
}

body.oat-inbox-fullscreen #inbox-columns-row {
    flex: 1 1 0;
    min-height: 0;
    margin: 0;
}

body.oat-inbox-fullscreen #inbox-columns-row > [class*="col-"] {
    display: flex;
    flex-direction: column;
    min-height: 0;
    align-self: stretch;
}

body.oat-inbox-fullscreen #inbox-columns-row .card {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
}

body.oat-inbox-fullscreen #inbox-columns-row .card-body {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

body.oat-inbox-fullscreen .oat-inbox-queue,
body.oat-inbox-fullscreen .oat-inbox-history {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overscroll-behavior: contain;
}

body.oat-inbox-fullscreen .oat-teleb-messages {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    display: block;
}

body.oat-inbox-fullscreen #teleb-chat-modal .modal-content {
    max-height: calc(100dvh - 2rem);
    display: flex;
    flex-direction: column;
}

body.oat-inbox-fullscreen #teleb-chat-modal .modal-body {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

body.oat-inbox-fullscreen .oat-teleb-chat-messages {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

body.oat-inbox-fullscreen .inbox-fullscreen-toggle.active {
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--bs-primary);
    border-color: rgba(var(--bs-primary-rgb), 0.25);
}

/* Station configuration */
.station-config-layout {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    min-height: 640px;
}

.station-config-sidebar {
    background: var(--bs-app-bg-color, var(--bs-body-bg));
    border-right: 1px solid var(--bs-gray-200);
    padding: 0 0 1rem;
}

.station-config-sidebar-header {
    padding: 1.5rem 1.5rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--bs-gray-500);
}

.station-config-nav {
    padding-top: 0.25rem;
}

.station-config-nav .station-config-nav-link {
    margin: 0;
}

.station-config-nav .station-config-nav-link.active {
    border-color: var(--bs-primary);
}

.station-config-main {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.station-config-panels {
    flex: 1 1 auto;
    padding: 2rem;
}

.station-config-panel {
    display: none;
}

.station-config-panel.is-active {
    display: block;
}

.station-config-section-header {
    margin-bottom: 1.75rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px dashed var(--bs-gray-300);
}

.station-config-section-header h2 {
    margin: 0 0 0.35rem;
    font-size: 1.35rem;
    font-weight: 700;
}

.station-config-section-header p {
    margin: 0;
    color: var(--bs-gray-600);
    font-size: 0.925rem;
}

.station-config-media-card {
    padding: 1.25rem;
    border: 1px dashed var(--bs-gray-300);
    border-radius: 0.75rem;
    background: var(--bs-gray-100);
}

.station-config-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 2rem;
    border-top: 1px solid var(--bs-gray-200);
    background: var(--bs-gray-100);
}

.station-config-module-groups {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.station-config-module-group-title {
    margin: 0 0 0.35rem;
    font-size: 1rem;
    font-weight: 700;
    color: var(--bs-gray-800);
}

.station-config-module-group-description {
    margin: 0 0 1rem;
    color: var(--bs-gray-600);
    font-size: 0.875rem;
}

.station-config-module-list {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.station-config-module-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1rem 1.15rem;
    border: 1px solid var(--bs-gray-200);
    border-radius: 0.85rem;
    background: var(--bs-body-bg);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.station-config-module-row:hover {
    border-color: rgba(var(--bs-primary-rgb), 0.25);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.station-config-module-row.is-locked {
    opacity: 0.65;
}

.station-config-module-row-main {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    min-width: 0;
}

.station-config-module-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 0.75rem;
    background: rgba(var(--bs-primary-rgb), 0.08);
    color: var(--bs-primary);
    flex-shrink: 0;
}

.station-config-module-icon i {
    font-size: 1.25rem;
}

.station-config-module-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--bs-gray-900);
    margin-bottom: 0.2rem;
}

.station-config-module-description {
    font-size: 0.82rem;
    color: var(--bs-gray-600);
    line-height: 1.45;
}

.station-config-module-badge {
    display: inline-flex;
    margin-top: 0.45rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.1);
}

.station-config-module-locked {
    margin-top: 0.35rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--bs-warning);
}

.station-config-module-switch {
    flex-shrink: 0;
    margin: 0;
}

@media (max-width: 991.98px) {
    .station-config-layout {
        grid-template-columns: 1fr;
    }

    .station-config-sidebar {
        border-right: 0;
        border-bottom: 1px solid var(--bs-gray-200);
    }

    .station-config-nav {
        flex-direction: row !important;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 0.75rem !important;
        padding: 0 1rem 1rem;
        -webkit-overflow-scrolling: touch;
    }

    .station-config-nav .station-config-nav-link {
        flex: 0 0 auto;
        white-space: nowrap;
        padding: 0.85rem 1.15rem !important;
    }

    .station-config-nav .station-config-nav-link i {
        margin-right: 0.65rem !important;
    }

    .station-config-panels {
        padding: 1.25rem;
    }

    .station-config-footer {
        flex-direction: column;
        align-items: stretch;
        padding: 1rem 1.25rem;
    }

    .station-config-footer .btn {
        width: 100%;
    }
}

/* Content feed visual mapper */
.content-feed-mapper.is-loading {
    opacity: 0.7;
    pointer-events: none;
}

.feed-mapper-pane {
    border: 1px solid var(--bs-border-color, #e4e6ef);
    border-radius: 0.75rem;
    background: var(--bs-body-bg, #fff);
    display: flex;
    flex-direction: column;
    min-height: 420px;
}

.feed-mapper-pane__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--bs-border-color, #e4e6ef);
}

.feed-mapper-pane__title {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 600;
}

.feed-mapper-pane__body {
    padding: 0.75rem;
    overflow: auto;
    flex: 1;
    max-height: 520px;
}

.feed-mapper-node {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    width: 100%;
    text-align: left;
    border: 1px solid transparent;
    border-radius: 0.5rem;
    background: transparent;
    padding: 0.65rem 0.75rem;
    margin-bottom: 0.35rem;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

.feed-mapper-node:hover,
.feed-mapper-node.is-selected {
    background: rgba(0, 158, 247, 0.08);
    border-color: rgba(0, 158, 247, 0.35);
}

.feed-mapper-node--empty {
    opacity: 0.65;
}

.feed-mapper-node__path {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
}

.feed-mapper-node__kind {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #7e8299;
    background: #f5f8fa;
    border-radius: 0.25rem;
    padding: 0.1rem 0.35rem;
}

.feed-mapper-node__sample {
    font-size: 0.75rem;
    color: #5e6278;
    line-height: 1.35;
}

.feed-mapper-xml {
    margin: 0;
    padding: 1rem 1.25rem;
    font-size: 0.72rem;
    line-height: 1.45;
    background: #1e1e2d;
    color: #e9ecef;
    border-radius: 0 0 0.75rem 0.75rem;
    overflow: auto;
    max-height: 520px;
    white-space: pre-wrap;
    word-break: break-word;
}

.feed-mapper-targets {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.75rem;
    overflow: auto;
    flex: 1;
    max-height: 520px;
}

.feed-mapper-target {
    border: 1px solid var(--bs-border-color, #e4e6ef);
    border-radius: 0.5rem;
    padding: 0.65rem 0.75rem;
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.feed-mapper-target.is-active {
    border-color: #009ef7;
    box-shadow: 0 0 0 1px rgba(0, 158, 247, 0.25);
}

.feed-mapper-target.is-mapped .feed-mapper-target__label {
    color: #009ef7;
}

.feed-mapper-target__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.35rem;
}

.feed-mapper-target__label {
    font-size: 0.82rem;
    font-weight: 600;
}

.feed-mapper-target__paths {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.feed-mapper-chip {
    display: inline-flex;
    align-items: center;
    background: #f1faff;
    border: 1px solid rgba(0, 158, 247, 0.2);
    border-radius: 0.35rem;
    padding: 0.15rem 0.45rem;
    font-size: 0.72rem;
}

.feed-mapper-chip--empty {
    background: #f9f9f9;
    border-color: #e4e6ef;
    color: #a1a5b7;
}

.feed-mapper-chip code {
    color: #009ef7;
    background: transparent;
    padding: 0;
}

.feed-mapper-preview-card {
    border: 1px solid var(--bs-border-color, #e4e6ef);
    border-radius: 0.5rem;
    padding: 1rem;
    margin-bottom: 0.75rem;
}

.content-hub-body,
.public-content-body {
    line-height: 1.7;
}

.content-hub-body p,
.public-content-body p {
    margin-bottom: 1rem;
}

.content-hub-body img,
.public-content-body img {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
    margin: 1rem 0;
}

.content-hub-body ul,
.content-hub-body ol,
.public-content-body ul,
.public-content-body ol {
    margin-bottom: 1rem;
    padding-left: 1.5rem;
}

.content-hub-body blockquote,
.public-content-body blockquote {
    border-left: 3px solid var(--bs-primary, #009ef7);
    padding-left: 1rem;
    color: #5e6278;
    margin: 1rem 0;
}

/* Station API documentation */
.station-api-nav-card {
    position: sticky;
    top: 1.5rem;
}

.station-api-nav-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem 0.85rem;
    border: 0;
    border-radius: 0.65rem;
    background: transparent;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.station-api-nav-item:hover {
    background: var(--bs-gray-100);
}

.station-api-nav-item.is-active {
    background: rgba(var(--bs-primary-rgb), 0.08);
}

.station-api-nav-copy {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.station-api-nav-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--bs-gray-900);
    line-height: 1.35;
}

.station-api-nav-item.is-active .station-api-nav-title {
    color: var(--bs-primary);
}

.station-api-nav-path {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    font-size: 0.72rem;
    color: var(--bs-gray-600);
    word-break: break-word;
}

.station-api-panel {
    display: none;
}

.station-api-panel.is-active {
    display: block;
}

.store-distribution-agreement-content {
    line-height: 1.6;
    color: var(--bs-gray-800);
}

.store-distribution-agreement-content p:last-child,
.store-distribution-agreement-content ul:last-child,
.store-distribution-agreement-content ol:last-child {
    margin-bottom: 0;
}

.store-distribution-agreement-content h2,
.store-distribution-agreement-content h3,
.store-distribution-agreement-content h4 {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

.store-distribution-agreement-content ul,
.store-distribution-agreement-content ol {
    padding-left: 1.25rem;
}

.store-agreement-signatures {
    border-color: var(--bs-gray-300) !important;
}

.store-agreement-signature-block {
    min-height: 120px;
}

.store-agreement-signature-line {
    height: 48px;
    border-bottom: 1px solid var(--bs-gray-500);
    margin-bottom: 0.5rem;
}

.store-agreement-signature-image img,
.store-agreement-signature-preview {
    display: block;
    max-height: 72px;
    max-width: 220px;
    width: auto;
    height: auto;
}

.store-agreement-signature-protected {
    position: relative;
    display: inline-block;
    max-width: 220px;
}

.store-agreement-signature-protected img {
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
    pointer-events: none;
}

.store-agreement-signature-shield {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: transparent;
}

.store-signature-pad-wrapper {
    border: 1px dashed var(--bs-gray-400);
    border-radius: 0.75rem;
    background: #fff;
    overflow: hidden;
}

.store-signature-pad {
    display: block;
    width: 100%;
    height: 160px;
    touch-action: none;
    cursor: crosshair;
}

/* ——— Store (customer) ——— */
.oat-store-hero {
    margin-top: 0.25rem;
}

.oat-store-wallet-tile {
    display: block;
    border-radius: 1rem;
    background: linear-gradient(135deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
    color: #fff;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.oat-store-wallet-tile:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16);
    color: #fff;
}

.oat-store-wallet-tile__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.5rem 1.75rem;
}

.oat-store-wallet-tile__label {
    display: block;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    opacity: 0.85;
}

.oat-store-wallet-tile__balance {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
}

.oat-store-wallet-tile__hint {
    display: block;
    font-size: 0.75rem;
    opacity: 0.8;
    margin-top: 0.35rem;
}

.oat-store-wallet-tile__icon {
    opacity: 0.35;
}

.oat-store-intro {
    border-radius: 1rem;
    border: 1px dashed var(--bs-border-color);
    background: var(--bs-body-bg);
    padding: 1.75rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.oat-store-intro__title {
    font-size: 1.35rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.oat-store-intro__text {
    color: var(--bs-secondary-color);
    max-width: 42rem;
}

.oat-store-empty {
    text-align: center;
    padding: 3rem 1.5rem;
    border-radius: 1rem;
    border: 1px dashed var(--bs-border-color);
    background: var(--bs-body-bg);
}

.oat-store-subscription-card {
    position: relative;
    border-radius: 1rem;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    height: 100%;
}

.oat-store-subscription-card__accent {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--bs-primary);
}

.oat-store-subscription-card--mobile .oat-store-subscription-card__accent {
    background: linear-gradient(180deg, var(--bs-primary), var(--bs-secondary));
}

.oat-store-subscription-card--website .oat-store-subscription-card__accent {
    background: var(--bs-info);
}

.oat-store-subscription-card__body {
    padding: 1.35rem 1.5rem 1.35rem 1.65rem;
}

.oat-store-subscription-card__header {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1.25rem;
}

.oat-store-subscription-card__identity {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.oat-store-subscription-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 0.75rem;
    background: var(--bs-light);
    color: var(--bs-primary);
    flex-shrink: 0;
}

[data-bs-theme="dark"] .oat-store-subscription-card__icon {
    background: rgba(255, 255, 255, 0.06);
}

.oat-store-subscription-card__title {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
}

.oat-store-subscription-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
}

.oat-store-subscription-card__meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    padding: 1rem;
    border-radius: 0.75rem;
    background: var(--bs-light);
    margin-bottom: 1rem;
}

[data-bs-theme="dark"] .oat-store-subscription-card__meta {
    background: rgba(255, 255, 255, 0.04);
}

@media (max-width: 575.98px) {
    .oat-store-subscription-card__meta {
        grid-template-columns: 1fr;
    }
}

.oat-store-subscription-card__meta-label {
    display: block;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--bs-secondary-color);
    margin-bottom: 0.25rem;
}

.oat-store-subscription-card__meta-value {
    font-weight: 600;
    font-size: 1rem;
}

.oat-store-station-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.oat-store-station-pill {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.55rem;
    border-radius: 2rem;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
}

.oat-store-subscription-card__section {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bs-border-color);
}

.oat-store-subscription-card__section:first-of-type {
    border-top: none;
    padding-top: 0;
}

.oat-store-callout {
    border-radius: 0.75rem;
    padding: 0.85rem 1rem;
}

.oat-store-callout--action {
    background: rgba(var(--bs-primary-rgb), 0.08);
    border: 1px solid rgba(var(--bs-primary-rgb), 0.2);
}

.oat-store-callout--warning {
    background: rgba(var(--bs-warning-rgb), 0.12);
    border: 1px solid rgba(var(--bs-warning-rgb), 0.25);
}

.oat-store-callout--danger {
    background: rgba(var(--bs-danger-rgb), 0.1);
    border: 1px solid rgba(var(--bs-danger-rgb), 0.2);
    color: var(--bs-danger);
    font-size: 0.875rem;
}

.oat-store-callout__title {
    display: flex;
    align-items: center;
    font-weight: 700;
    font-size: 0.85rem;
    margin-bottom: 0.65rem;
}

.oat-store-task-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0;
}

.oat-store-task-row + .oat-store-task-row {
    border-top: 1px solid rgba(var(--bs-primary-rgb), 0.12);
}

.oat-store-license-box {
    border-radius: 0.75rem;
    padding: 1rem;
    background: var(--bs-light);
    border: 1px dashed var(--bs-border-color);
}

[data-bs-theme="dark"] .oat-store-license-box {
    background: rgba(0, 0, 0, 0.2);
}

.oat-store-license-box__label {
    font-weight: 700;
    font-size: 0.8rem;
    margin-bottom: 0.35rem;
}

.oat-store-license-box__code {
    font-size: 0.95rem;
    padding: 0.35rem 0.65rem;
    border-radius: 0.5rem;
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
}

.oat-store-subscription-card__footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 1.25rem;
    padding-top: 1rem;
    border-top: 1px solid var(--bs-border-color);
}

.oat-store-manage-stations__toggle {
    display: inline-flex;
    align-items: center;
    border: none;
    background: transparent;
    color: var(--bs-primary);
    font-weight: 600;
    font-size: 0.85rem;
    padding: 0;
}

.oat-store-station-checklist {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.oat-store-station-check {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    border: 1px solid var(--bs-border-color);
    margin: 0;
    cursor: pointer;
}

.oat-store-category__head {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.oat-store-category__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.65rem;
    background: rgba(var(--bs-primary-rgb), 0.1);
    color: var(--bs-primary);
}

.oat-store-category__title {
    font-size: 1.25rem;
    font-weight: 700;
}

.oat-store-product-card {
    border-radius: 1rem;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}

.oat-store-product-card:hover {
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.06);
}

.oat-store-product-card--owned {
    border-color: rgba(var(--bs-success-rgb), 0.45);
}

.oat-store-product-card--coming-soon {
    opacity: 0.92;
    border-style: dashed;
}

.oat-store-product-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.oat-store-product-card__glyph {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 0.85rem;
    background: var(--bs-light);
    color: var(--bs-primary);
}

[data-bs-theme="dark"] .oat-store-product-card__glyph {
    background: rgba(255, 255, 255, 0.06);
}

.oat-store-product-card__name {
    font-size: 1.15rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
}

.oat-store-product-card__desc {
    color: var(--bs-secondary-color);
    font-size: 0.9rem;
    margin-bottom: 1.25rem;
    flex-grow: 1;
}

.oat-store-product-card__pricing {
    border-radius: 0.75rem;
    background: var(--bs-light);
    padding: 0.85rem 1rem;
    margin-bottom: 1.25rem;
}

[data-bs-theme="dark"] .oat-store-product-card__pricing {
    background: rgba(255, 255, 255, 0.04);
}

.oat-store-price-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 0.875rem;
    padding: 0.2rem 0;
}

.oat-store-price-row--highlight {
    margin-top: 0.35rem;
    padding-top: 0.5rem;
    border-top: 1px solid var(--bs-border-color);
    font-size: 0.95rem;
}

.oat-store-product-card__cta {
    padding-top: 0.25rem;
}

.oat-notification-menu {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.oat-notification-bell {
    position: relative;
}

.oat-notification-dropdown {
    overflow: hidden;
    border-radius: 1rem !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12) !important;
}

.oat-notification-dropdown__head,
.oat-notification-dropdown__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 1rem 1.15rem;
}

.oat-notification-dropdown__head {
    border-bottom: 1px solid var(--bs-border-color);
}

.oat-notification-dropdown__foot {
    border-top: 1px solid var(--bs-border-color);
}

.oat-notification-dropdown__list {
    max-height: 24rem;
    overflow-y: auto;
}

.oat-notification-item {
    display: flex;
    gap: 0.85rem;
    padding: 0.9rem 1.15rem;
    text-decoration: none;
    color: inherit;
    border-bottom: 1px solid var(--bs-border-color);
    transition: background 0.15s ease;
}

.oat-notification-item:last-child {
    border-bottom: 0;
}

.oat-notification-item:hover {
    background: var(--bs-light);
}

.oat-notification-item--unread {
    background: rgba(var(--bs-primary-rgb), 0.06);
}

.oat-notification-item__icon {
    flex: 0 0 2.5rem;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0;
    clip-path: var(--oat-hex-clip);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--bs-primary);
}

.oat-notification-item__body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.oat-notification-item__title {
    font-weight: 700;
    font-size: 0.9rem;
}

.oat-notification-item__text {
    color: var(--bs-secondary-color);
    font-size: 0.8rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.oat-notification-item__meta {
    color: var(--bs-secondary-color);
    font-size: 0.72rem;
}

.oat-notification-empty {
    text-align: center;
    padding: 2rem 1.25rem;
}

.oat-notification-page-card {
    border-radius: 1rem;
    overflow: hidden;
}

.oat-notification-row {
    display: flex;
    gap: 1rem;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--bs-border-color);
}

.oat-notification-row:last-child {
    border-bottom: 0;
}

.oat-notification-row--unread {
    background: rgba(var(--bs-primary-rgb), 0.05);
}

.oat-notification-row__icon {
    flex: 0 0 3rem;
    width: 3rem;
    height: 3rem;
    border-radius: 0;
    clip-path: var(--oat-hex-clip);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(var(--bs-primary-rgb), 0.12);
    color: var(--bs-primary);
}

.oat-notification-row__content {
    min-width: 0;
    flex: 1;
}

.oat-mobile-topbar-actions {
    gap: 0.35rem;
}

[data-bs-theme="dark"] .oat-notification-item:hover {
    background: rgba(255, 255, 255, 0.06);
}

[data-bs-theme="dark"] .oat-notification-item__icon,
[data-bs-theme="dark"] .oat-notification-row__icon {
    background: rgba(var(--bs-primary-rgb), 0.22);
}

.oat-content-type-picker-card {
    text-decoration: none;
    border: 1px solid var(--bs-border-color);
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.oat-content-type-picker-card:hover {
    border-color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.04);
}

.oat-content-type-picker-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(var(--bs-primary-rgb), 0.1);
}

.oat-content-card-placeholder {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0f172a;
}

.oat-plans-page {
    --oat-plans-gradient: linear-gradient(135deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
    padding-bottom: 2.5rem;
}

.oat-plans-wallet {
    display: block;
    max-width: 28rem;
    margin-inline: auto;
}

.oat-plans-wallet .rocket-wallet-card {
    padding: 22px 26px;
}

.oat-plans-wallet .rocket-wallet-balance {
    font-size: 2rem;
}

.oat-plan-compare-card {
    position: relative;
    overflow: hidden;
    border-radius: 1.35rem;
    border: 1px solid rgba(var(--bs-primary-rgb), 0.12);
    background: var(--bs-body-bg);
    box-shadow: 0 22px 50px rgba(var(--bs-primary-rgb), 0.12);
}

.oat-plan-compare-scroll {
    overflow-x: auto;
}

.oat-plan-compare {
    width: 100%;
    min-width: 54rem;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}

.oat-plan-compare th,
.oat-plan-compare td {
    padding: 0.85rem 1.05rem;
    vertical-align: middle;
    border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.08);
}

.oat-plan-compare thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 1.35rem 1.1rem 1.2rem;
    vertical-align: top;
    border-bottom: none;
    background: var(--oat-plans-gradient);
    color: #fff;
}

.oat-plan-compare__feature-col,
.oat-plan-compare tbody .oat-plan-compare__feature,
.oat-plan-compare tfoot th {
    position: sticky;
    left: 0;
    z-index: 3;
    width: 16.5rem;
    min-width: 14.5rem;
    background: var(--bs-body-bg);
    text-align: left;
}

.oat-plan-compare thead .oat-plan-compare__feature-col {
    z-index: 4;
}

.oat-plan-compare__plan-col {
    min-width: 14rem;
    text-align: center;
}

.oat-plan-compare thead .oat-plan-compare__plan-col.is-popular {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0%, transparent 70%),
        var(--oat-plans-gradient);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.oat-plan-compare thead .oat-plan-compare__plan-col.is-current {
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.45);
}

.oat-plan-compare tbody td.is-popular,
.oat-plan-compare tfoot td.is-popular {
    background: rgba(var(--bs-primary-rgb), 0.035);
}

.oat-plan-compare tbody td.is-current,
.oat-plan-compare tfoot td.is-current {
    background: rgba(var(--bs-primary-rgb), 0.07);
    box-shadow: inset 0 0 0 1px rgba(var(--bs-primary-rgb), 0.08);
}

.oat-plan-compare thead .oat-plan-compare__plan-col {
    height: 1px;
}

.oat-plan-compare__plan-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.45rem;
    height: 100%;
}

.oat-plan-compare__badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.35rem;
    min-height: 1.6rem;
}

.oat-plan-compare__offer-slot {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 1.45rem;
    width: 100%;
}

.oat-plan-compare__price-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-height: 4.1rem;
}

.oat-plan-compare__timer-slot {
    flex: 1 1 auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    min-height: 0;
}

.oat-plan-compare__pill {
    display: inline-flex;
    align-items: center;
    padding: 0.22rem 0.7rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    border: 1px solid rgba(255, 255, 255, 0.32);
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.oat-plan-compare__pill--popular {
    background: rgba(255, 255, 255, 0.92);
    border-color: transparent;
    color: var(--bs-primary);
}

.oat-plan-compare__offer {
    max-width: 14rem;
    padding: 0.2rem 0.65rem;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.3;
    color: #fff;
    background: rgba(255, 196, 0, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.22);
}

.oat-plan-compare__plan-name {
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #fff;
}

.oat-plan-compare__price {
    font-size: 1.85rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
    color: #fff;
}

.oat-plan-compare__price-old {
    margin-right: 0.35rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.62);
    text-decoration: line-through;
}

.oat-plan-compare__price-period,
.oat-plan-compare__price-hint {
    display: block;
    margin-top: 0.15rem;
    min-height: 1.15rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.72);
}

.oat-plan-compare__cta {
    width: 100%;
    margin-top: auto;
    padding-top: 0.55rem;
}

.oat-plan-compare__btn {
    border: 0;
    border-radius: 999px;
    font-weight: 800;
    letter-spacing: 0.01em;
    padding: 0.7rem 1rem;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}

.oat-plan-compare thead .oat-plan-compare__btn--choose {
    background: #fff;
    color: var(--bs-primary);
}

.oat-plan-compare thead .oat-plan-compare__btn--choose:hover {
    background: rgba(255, 255, 255, 0.92);
    color: var(--bs-primary);
}

.oat-plan-compare thead .oat-plan-compare__btn--current {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    box-shadow: none;
    border: 1px solid rgba(255, 255, 255, 0.35);
}

.oat-plan-compare tfoot .oat-plan-compare__btn--choose {
    background: var(--oat-plans-gradient);
    color: #fff;
}

.oat-plan-compare tfoot .oat-plan-compare__btn--current {
    background: rgba(var(--bs-primary-rgb), 0.1);
    color: var(--bs-primary);
    box-shadow: none;
}

.oat-plan-compare__current-meta {
    margin-bottom: 0.55rem;
    font-size: 0.75rem;
    line-height: 1.45;
    color: rgba(255, 255, 255, 0.82);
}

.oat-plan-compare tfoot .oat-plan-compare__current-meta {
    color: var(--bs-gray-600);
}

.oat-plan-compare__timer {
    width: 100%;
    margin-top: 0.45rem;
}

.oat-plan-compare__timer-caption {
    margin-bottom: 0.4rem;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.7);
}

.oat-plan-compare .plan-offer-timer-unit {
    min-width: 2.55rem;
    padding: 0.4rem 0.2rem;
    border-radius: 0.7rem;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

.oat-plan-compare .plan-offer-timer-value {
    display: block;
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.2;
    color: #fff;
}

.oat-plan-compare .plan-offer-timer-label {
    display: block;
    font-size: 0.55rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.65);
}

.oat-plan-compare__group th {
    padding-top: 1rem;
    padding-bottom: 0.55rem;
    background: rgba(var(--bs-primary-rgb), 0.06);
}

.oat-plan-compare__group span {
    display: inline-flex;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--bs-primary);
}

.oat-plan-compare__feature {
    font-weight: 700;
    color: var(--bs-gray-800);
}

.oat-plan-compare tbody td,
.oat-plan-compare tfoot td {
    text-align: center;
}

.oat-plan-compare tbody tr:nth-child(even) td,
.oat-plan-compare tbody tr:nth-child(even) .oat-plan-compare__feature {
    background: rgba(var(--bs-primary-rgb), 0.025);
}

.oat-plan-compare tbody tr:hover td.is-current {
    background: rgba(var(--bs-primary-rgb), 0.12);
}

.oat-plan-compare thead .form-check-label,
.oat-plan-compare thead .text-muted,
.oat-plan-compare thead .text-gray-700 {
    color: rgba(255, 255, 255, 0.82) !important;
}

.oat-plan-compare tfoot td,
.oat-plan-compare tfoot th {
    border-bottom: none;
    vertical-align: top;
    padding-top: 1.15rem;
    padding-bottom: 1.25rem;
    background: rgba(var(--bs-primary-rgb), 0.03);
}

.oat-plan-compare__mark {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    z-index: 1;
}

.oat-plan-compare__mark i {
    position: relative;
    z-index: 1;
    font-size: 0.95rem;
}

.oat-plan-compare__mark--yes {
    color: #fff;
    background: #17c653;
    box-shadow: 0 3px 0 #0f9a3f;
}

.oat-plan-compare__mark--yes i {
    color: #fff;
}

.oat-plan-compare__mark--no {
    color: var(--bs-gray-500);
    background: rgba(var(--bs-gray-200-rgb, 239, 242, 245), 1);
}

.oat-plan-compare__chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.1rem;
    padding: 0.28rem 0.7rem;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 800;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.1);
}

.oat-plan-compare__chip--unlimited {
    color: #fff;
    background: var(--oat-plans-gradient);
}

html[data-bs-theme="dark"] .oat-plan-compare-card {
    border-color: rgba(255, 255, 255, 0.08);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
}

html[data-bs-theme="dark"] .oat-plan-compare__feature,
html[data-bs-theme="dark"] .oat-plan-compare tfoot .oat-plan-compare__btn--current {
    color: var(--bs-gray-100);
}

html[data-bs-theme="dark"] .oat-plan-compare__mark--no {
    background: rgba(255, 255, 255, 0.08);
    color: var(--bs-gray-500);
}

html[data-bs-theme="dark"] .oat-plan-compare tbody tr:nth-child(even) td,
html[data-bs-theme="dark"] .oat-plan-compare tbody tr:nth-child(even) .oat-plan-compare__feature,
html[data-bs-theme="dark"] .oat-plan-compare tfoot td,
html[data-bs-theme="dark"] .oat-plan-compare tfoot th {
    background: rgba(255, 255, 255, 0.03);
}

html[data-bs-theme="dark"] .oat-plan-compare tbody tr:hover td,
html[data-bs-theme="dark"] .oat-plan-compare tbody tr:hover .oat-plan-compare__feature {
    background: rgba(255, 255, 255, 0.06);
}

.oat-wallet-page {
    --oat-wallet-gradient: linear-gradient(135deg, var(--bs-primary) 0%, var(--bs-secondary) 100%);
    padding-bottom: 2rem;
}

.oat-wallet-balance-card {
    display: flex;
    align-items: center;
    justify-content: center;
}

.oat-wallet-balance-card .rocket-wallet-content {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    text-align: center;
}

.oat-wallet-balance-card .rocket-wallet-label,
.oat-wallet-balance-card .rocket-wallet-balance {
    text-align: center;
}

.oat-wallet-balance-card .rocket-wallet-coin {
    display: flex;
    align-items: center;
    justify-content: center;
}

.oat-wallet-topup {
    border-radius: 1.25rem;
    border: 1px solid rgba(var(--bs-primary-rgb), 0.12);
    box-shadow: 0 18px 40px rgba(var(--bs-primary-rgb), 0.08);
}

.oat-wallet-amount .input-group-text {
    font-weight: 800;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.08);
    border: 0;
}

.oat-wallet-amount .form-control {
    font-size: 1.45rem;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.oat-wallet-chip {
    border: 1px solid rgba(var(--bs-primary-rgb), 0.18);
    background: rgba(var(--bs-primary-rgb), 0.06);
    color: var(--bs-gray-800);
    border-radius: 999px;
    padding: 0.45rem 0.9rem;
    font-weight: 800;
    font-size: 0.9rem;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.oat-wallet-chip:hover,
.oat-wallet-chip.is-active {
    background: var(--oat-wallet-gradient);
    border-color: transparent;
    color: #fff;
}

.oat-wallet-submit {
    border-radius: 999px;
    font-weight: 800;
    padding: 0.8rem 1.4rem;
    background: var(--oat-wallet-gradient);
    border: 0;
}

.oat-wallet-transactions {
    border-radius: 1.25rem;
    overflow: hidden;
}

html[data-bs-theme="dark"] .oat-wallet-chip {
    color: var(--bs-gray-200);
}

html[data-bs-theme="dark"] .oat-wallet-topup {
    box-shadow: none;
}