@import '_content/Blazor.Bootstrap/Blazor.Bootstrap.olwso25aue.bundle.scp.css';
@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';

/* /Components/Account/Pages/LoginWith2fa.razor.rz.scp.css */
.form-floating>.form-control.two-factor-container[b-fwc5hwj8l2]{
    height: calc(4.5rem + 2px);
    min-height: calc(4.5rem + 2px);
    display: flex;
}

.form-floating>.form-control.two-factor-container:focus-within[b-fwc5hwj8l2]{
    outline: 0;
    box-shadow: 0 0 0 0.2rem #000061;
}

.two-factor-container-outer[b-fwc5hwj8l2] {
    width: 315px;
    overflow: hidden;
    margin: auto;
    position: relative;
}

.two-factor-container-inner[b-fwc5hwj8l2]{
    position: sticky;
    left: 0;
}

#two-factor-code[b-fwc5hwj8l2] {
    padding-left: 15px;
    outline: none;
    border: none;
    letter-spacing: 46px;
    height: 100%;
    font-size: 1.25rem;
    width: 365px;
    min-width: 365px;

    background-image: linear-gradient(to left, rgba(33,37,41, .65) 60%, rgba(255, 255, 255, 0) 0%);
    background-position: bottom;
    background-size: 56px 1px;
    background-repeat: repeat-x;
    background-position-x: 30px;
}
/* /Components/Account/Pages/Manage/ApiSettings.razor.rz.scp.css */
.custom-claims-table[b-qrejg81ue6] {
    width: 100%;
}
@media (min-width: 1000px) {
    .custom-claims-table[b-qrejg81ue6] {
        min-width: 35%;
        max-width: 50%;
    }
}
.select-btn.add:hover[b-qrejg81ue6] {
    background-color: #8CD47E;
    font-weight: normal;
}
.select-btn.edit:hover[b-qrejg81ue6] {
    background-color: #F7A506;
    font-weight: normal;
}
.select-btn.remove:hover[b-qrejg81ue6] {
    background-color: #FF6961;
    font-weight: normal;
}
/* /Components/Account/Shared/AccountLayout.razor.rz.scp.css */
/* ── App shell ──────────────────────────────────────── */

.shop-front-container[b-0xr755ktfz] {
    display: grid;
    grid-template-columns: 1fr 340px;
    height: 100vh;
    overflow: hidden;
    position: relative;
    background:
        radial-gradient(ellipse 120% 80% at 20% 10%, rgba(26, 111, 196, 0.12) 0%, transparent 50%),
        radial-gradient(ellipse 100% 60% at 80% 90%, rgba(30, 58, 138, 0.10) 0%, transparent 50%),
        linear-gradient(145deg, #dce7f5 0%, #e8f0fb 30%, #f0f4fa 60%, #e4ecf7 100%);
}

/* ── Dashboard (left panel) ─────────────────────────── */

.shop-front-dashboard[b-0xr755ktfz] {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.ssy-navbar-container[b-0xr755ktfz]{
    /*background: linear-gradient(to right, #003F9A, #1544A3,#0092D1,#0092D1);*/
    background: #000061;
    color: white;
    height: 50px;
    display: flex;
    justify-content: space-between;
    padding: 0 15px;
}

/* ssy-navbar-title */
.ssy-navbar-title[b-0xr755ktfz] {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 100%;
}
.ssy-navbar-title .ssy-nav-Logo[b-0xr755ktfz] {
    background-image: url('./assets/Logo/SSYLogo_1Line_White_M.png');
    background-repeat: no-repeat;
    width: 80px;
    height: 30px;
    background-size: contain;
    background-position: center;
    background-color: transparent;
    border: none;
    cursor: pointer;
    display: block;
    text-decoration: none;
    color: white;
    /*check aspect ratio*/
}
.ssy-navbar-title .ssy-nav-Logo:not(.no-wave-animation):hover[b-0xr755ktfz] {
    animation: nav-ssyLogo-colorWave 6s ease-in-out infinite alternate;
}

.ssy-navbar-title .navigator-text[b-0xr755ktfz]{
    font-size: 2.3rem;
    font-family: 'Soehne Breit', cursive;
    /*  wider spacing*/
    letter-spacing: 0.15em;
    color: white;
    font-weight: 400;
    text-decoration: none;
    margin-bottom: 0;
    margin-left: 5px;
    position: relative;
}

.ssy-navbar-title .navigator-text:hover[b-0xr755ktfz] {
    animation: nav-ssyLogo-colorWave 6s ease-in-out infinite alternate;
}

.ssy-navbar-title .navigator-text .navigator-text-half[b-0xr755ktfz]{
    display: none;
}
.ssy-navbar-title .navigator-text .navigator-text-full[b-0xr755ktfz]{
    display: block;
}

@media only screen and (max-width: 1570px) {
    .ssy-navbar-title .navigator-text[b-0xr755ktfz] {
        font-size: 1.3rem;
        margin-left: -10px;
        margin-top: 5px;
        display: block;
    }
    .ssy-navbar-title .navigator-text .navigator-text-half[b-0xr755ktfz]{
        display: block;
    }
    .ssy-navbar-title .navigator-text .navigator-text-full[b-0xr755ktfz]{
        display: none;
    }
}

.ssy-navbar-container .ssy-navbar-links[b-0xr755ktfz] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.ssy-navbar-container .ssy-navbar-links ul[b-0xr755ktfz] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: row;
    gap: 10px;
}

.ssy-navbar-container .ssy-navbar-links ul li.podcast-links[b-0xr755ktfz]{
    display: flex;
    flex-direction: row;
}

.ssy-navbar-container .ssy-navbar-links ul li a img[b-0xr755ktfz] {
    height: 30px;
}

.ssy-navbar-container .ssy-navbar-links .ssy-btn-theme[b-0xr755ktfz],
.ssy-navbar-container .ssy-navbar-links .ssy-btn-ssyglobal[b-0xr755ktfz] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    background: white;
    border-radius: 5px;
    padding: 5px 5px;
    color: #000061;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: box-shadow 0.3s ease;
}

.ssy-navbar-container .ssy-navbar-links ul li a.ssy-btn-ssyglobal img[b-0xr755ktfz] {
    height: 20px;
}

.ssy-navbar-container .ssy-navbar-links ul li a:hover[b-0xr755ktfz] {
    box-shadow: 0 0 12px rgb(255, 255, 255, 0.8);
}

/* ── Login panel (right panel) ──────────────────────── */

.acc-login-panel[b-0xr755ktfz] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 40px;
    background: rgba(181, 203, 214, 0.88);
    box-shadow: -4px 0 30px rgba(10, 22, 40, 0.1);
    overflow: hidden;
}

.acc-login-panel[b-0xr755ktfz]::after {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(15, 36, 81, 0.04) 1px, transparent 1px);
    background-size: 24px 24px;
    pointer-events: none;
}

/* Back link */
.ssy-btn-back-to-login[b-0xr755ktfz] {
    position: absolute;
    top: 18px;
    left: 20px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.4px;
}

.acc-ssy-link[b-0xr755ktfz] {
    position: absolute;
    top: 18px;
    left: 20px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.4px;
    color: #4a6080;
    text-decoration: none;
    transition: color 0.2s;
    animation: accFadeDown-b-0xr755ktfz 0.8s ease both;
    z-index: 1;
}

.acc-ssy-link:hover[b-0xr755ktfz] { color: #0f2451; }

.acc-ssy-link svg[b-0xr755ktfz] {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
}

/* Logo block */
.acc-login-logo[b-0xr755ktfz] {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 32px;
    animation: accFadeDown-b-0xr755ktfz 0.8s ease both;
    position: relative;
    z-index: 1;
}

.acc-compass[b-0xr755ktfz] {
    width: 68px;
    height: 68px;
    margin-bottom: 16px;
}

.acc-compass svg[b-0xr755ktfz] { width: 100%; height: 100%; }

.acc-needle[b-0xr755ktfz] {
    transform-origin: center;
    animation: accCompassSpin-b-0xr755ktfz 3s ease-in-out forwards;
}

.acc-login-logo h2[b-0xr755ktfz] {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.5px;
    color: #0f2451;
    margin: 0;
}

.acc-login-logo p[b-0xr755ktfz] {
    font-size: 11px;
    color: #4a6080;
    text-transform: uppercase;
    letter-spacing: 3px;
    margin-top: 6px;
}

/* @Body slot */
.acc-body-slot[b-0xr755ktfz] {
    width: 100%;
    max-width: 280px;
    animation: accFadeUp-b-0xr755ktfz 0.8s ease 0.2s both;
    position: relative;
    z-index: 1;
}

[b-0xr755ktfz] .acc-body-slot h1,
[b-0xr755ktfz] .acc-body-slot .h1 {
    font-size: 1.1rem;
    font-weight: 600;
    color: #0f2451;
    margin: 0 0 16px 0;
}

[b-0xr755ktfz] .acc-body-slot .form-control {
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.4);
    border-radius: 7px;
    color: #0f2451;
    font-size: 14px;
    transition: border-color 0.3s, background 0.3s, box-shadow 0.3s;
}

[b-0xr755ktfz] .acc-body-slot .form-control:focus {
    border-color: #1a6fc4;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 0 0 3px rgba(26, 111, 196, 0.15);
}

[b-0xr755ktfz] .acc-body-slot .form-label {
    font-size: 10.5px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #4a6080;
    font-weight: 600;
}

[b-0xr755ktfz] .acc-body-slot .btn-primary {
    width: 100%;
    padding: 13px;
    border: none;
    border-radius: 7px;
    background: linear-gradient(135deg, #2a7fd4, #1a6fc4);
    color: white;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    box-shadow: 0 4px 20px rgba(26, 111, 196, 0.4);
    transition: box-shadow 0.3s, transform 0.2s;
}

[b-0xr755ktfz] .acc-body-slot .btn-primary:hover {
    box-shadow: 0 6px 24px rgba(26, 111, 196, 0.5);
    transform: translateY(-1px);
    background: linear-gradient(135deg, #2a7fd4, #1a6fc4);
}

[b-0xr755ktfz] .acc-body-slot a {
    color: #1a6fc4;
    font-size: 11.5px;
}

[b-0xr755ktfz] .acc-body-slot a:hover { color: #0f2451; }

/* Footer */
.acc-login-footer[b-0xr755ktfz] {
    margin-top: 28px;
    text-align: center;
    font-size: 10.5px;
    color: #8898b0;
    animation: accFadeUp-b-0xr755ktfz 0.8s ease 0.4s both;
    position: relative;
    z-index: 1;
}

.acc-login-footer p[b-0xr755ktfz] { margin: 0; }
.acc-login-footer p + p[b-0xr755ktfz] { margin-top: 4px; }

/* ── Animations ─────────────────────────────────────── */

@keyframes accFadeDown-b-0xr755ktfz {
    from { opacity: 0; transform: translateY(-10px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes accFadeUp-b-0xr755ktfz {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

@keyframes accCompassSpin-b-0xr755ktfz {
    0%   { transform: rotate(-90deg); }
    60%  { transform: rotate(10deg);  }
    80%  { transform: rotate(-5deg);  }
    100% { transform: rotate(0deg);   }
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 1280px) {
    .shop-front-container[b-0xr755ktfz] { grid-template-columns: 1fr 320px; }
}

@media (max-width: 1050px) {
    .shop-front-container[b-0xr755ktfz] { grid-template-columns: 1fr 300px; }
}

@media (max-width: 800px) {
    .shop-front-container[b-0xr755ktfz] {
        grid-template-columns: 1fr;
        grid-template-rows: auto 1fr;
        height: auto;
        min-height: 100vh;
    }

    .acc-login-panel[b-0xr755ktfz] {
        order: -1;
        padding: 20px 28px;
        flex-direction: row;
        align-items: center;
        gap: 28px;
        justify-content: flex-start;
    }

    .acc-login-logo[b-0xr755ktfz] {
        flex-shrink: 0;
        margin-bottom: 0;
    }

    .acc-compass[b-0xr755ktfz] { width: 48px; height: 48px; margin-bottom: 8px; }
    .acc-login-logo h2[b-0xr755ktfz] { font-size: 20px; }
    .acc-login-footer[b-0xr755ktfz] { display: none; }
    .acc-ssy-link[b-0xr755ktfz] { top: 10px; right: 14px; left: auto; }
    .acc-body-slot[b-0xr755ktfz] { max-width: 280px; }

    .shop-front-dashboard[b-0xr755ktfz] { overflow-y: auto; }
}

@media (max-width: 560px) {
    .acc-login-panel[b-0xr755ktfz] { flex-direction: column; padding: 16px 20px; }
    .acc-compass[b-0xr755ktfz] { width: 40px; height: 40px; }
    .acc-login-logo h2[b-0xr755ktfz] { font-size: 18px; }
    .acc-login-logo p[b-0xr755ktfz] { font-size: 9px; letter-spacing: 2px; }
}
/* /Components/Account/Shared/MarketTileGrid.razor.rz.scp.css */
/* ── Layout ─────────────────────────────────────────── */

.mtg-body[b-ofptghjwxg] {
    flex: 1;
    display: flex;
    gap: 12px;
    padding: 14px 18px 14px 22px;
    min-height: 0;
    background:
        radial-gradient(ellipse 140% 60% at 50% 0%, rgba(26, 111, 196, 0.25) 0%, transparent 60%),
        radial-gradient(ellipse 100% 80% at 50% 100%, rgba(10, 22, 40, 0.3) 0%, transparent 60%),
        linear-gradient(175deg, #122c5e 0%, #0f2451 40%, #0a1a3d 100%);
}

.mtg-left-col[b-ofptghjwxg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 0;
    min-width: 0;
}

.mtg-right-col[b-ofptghjwxg] {
    flex: 1.1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 0;
    min-width: 0;
}

.mtg-curves-grid[b-ofptghjwxg] {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(3, 1fr);
    gap: 10px;
    min-height: 0;
}

.mtg-chart-card[b-ofptghjwxg] {
    flex: 1.6;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.mtg-news-card[b-ofptghjwxg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
}

/* ── Cards ──────────────────────────────────────────── */

.mtg-card[b-ofptghjwxg] {
    background: #ffffff;
    border: 1px solid #cdd8e8;
    border-radius: 11px;
    padding: 10px 12px;
    box-shadow: 0 1px 4px rgba(15, 36, 81, 0.08), 0 4px 16px rgba(15, 36, 81, 0.06);
    animation: mtgCardIn-b-ofptghjwxg 0.5s ease both;
    transition: border-color 0.2s, box-shadow 0.2s;
    overflow: hidden;
}

.mtg-card:hover[b-ofptghjwxg] {
    border-color: #4a7ab5;
    box-shadow: 0 4px 20px rgba(15, 36, 81, 0.14), 0 1px 4px rgba(15, 36, 81, 0.08);
}

@keyframes mtgCardIn-b-ofptghjwxg {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

.mtg-card-title[b-ofptghjwxg] {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.4px;
    color: #1e3a8a;
    margin-bottom: 8px;
    flex-shrink: 0;
    font-family: 'DM Sans', sans-serif;
}

.mtg-card-title[b-ofptghjwxg]::before {
    content: '';
    width: 3px;
    height: 11px;
    background: #1a6fc4;
    border-radius: 2px;
    flex-shrink: 0;
}

/* ── Subtitle card ──────────────────────────────────── */

.mtg-subtitle-card[b-ofptghjwxg] {
    flex-shrink: 0;
    padding: 10px 14px;
    background: #1e3a8a;
    border-color: #1e3a8a;
}

.mtg-subtitle-card .mtg-card-title[b-ofptghjwxg] {
    color: rgba(255, 255, 255, 0.6);
}

.mtg-subtitle-card .mtg-card-title[b-ofptghjwxg]::before {
    background: rgba(255, 255, 255, 0.4);
}

.mtg-subtitle-card p[b-ofptghjwxg] {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.5;
    font-family: 'DM Sans', sans-serif;
}

.mtg-subtitle-card strong[b-ofptghjwxg] {
    font-weight: 600;
    color: #ffffff;
}

/* ── Tables ─────────────────────────────────────────── */

.mtg-table[b-ofptghjwxg] {
    width: 100%;
    border-collapse: collapse;
    font-size: 11px;
    font-family: 'DM Sans', sans-serif;
}

.mtg-table thead tr[b-ofptghjwxg] {
    background: #1e3a8a;
}

.mtg-table thead th[b-ofptghjwxg] {
    padding: 4px 8px;
    color: rgba(255, 255, 255, 0.85);
    font-weight: 600;
    font-size: 9.5px;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    text-align: left;
}

.mtg-table thead th:not(:first-child)[b-ofptghjwxg] {
    text-align: right;
}

.mtg-table tbody td[b-ofptghjwxg] {
    padding: 4px 8px;
    border-bottom: 1px solid #e2eaf4;
    color: #4a6080;
    white-space: nowrap;
}

.mtg-table tbody tr:nth-child(even) td[b-ofptghjwxg] {
    background: #f4f8fc;
}

.mtg-table tbody tr:hover td[b-ofptghjwxg] {
    background: #e8f0fb;
    color: #0f2451;
}

.mtg-table tbody tr:last-child td[b-ofptghjwxg] {
    border-bottom: none;
}

.mtg-mid[b-ofptghjwxg] {
    text-align: right !important;
    font-variant-numeric: tabular-nums;
    color: #0f2451 !important;
    font-weight: 600;
}

.mtg-chg[b-ofptghjwxg] {
    text-align: right !important;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
}

.mtg-chg.mtg-up[b-ofptghjwxg]   { color: #16a34a !important; }
.mtg-chg.mtg-down[b-ofptghjwxg] { color: #dc2626 !important; }
.mtg-chg.mtg-flat[b-ofptghjwxg] { color: #8898b0 !important; }

.mtg-spot td[b-ofptghjwxg] {
    background: #fffbeb !important;
    color: #92400e !important;
    font-weight: 600;
    border-bottom: 1px solid #fde68a !important;
}

.mtg-spot .mtg-mid[b-ofptghjwxg] {
    color: #b45309 !important;
}

/* ── Chart ──────────────────────────────────────────── */

.mtg-chart-card .mtg-card-title[b-ofptghjwxg] {
    margin-bottom: 6px;
}

.mtg-chart-wrap[b-ofptghjwxg] {
    position: relative;
    flex: 1;
    min-height: 0;
}

.mtg-chart-wrap > div[b-ofptghjwxg] {
    width: 100%;
    height: 100%;
}

/* ── News ───────────────────────────────────────────── */

.mtg-news-list[b-ofptghjwxg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 6px;
}

.mtg-news-item[b-ofptghjwxg] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 7px;
    background: #f4f8fc;
    border: 1px solid #e2eaf4;
    transition: background 0.2s, border-color 0.2s;
    flex: 1;
}

.mtg-news-item:hover[b-ofptghjwxg] {
    background: #dbeafe;
    border-color: rgba(30, 58, 138, 0.2);
}

.mtg-news-date[b-ofptghjwxg] {
    flex-shrink: 0;
    width: 42px;
    text-align: center;
    font-size: 10px;
    color: #8898b0;
    line-height: 1.4;
    font-family: 'DM Sans', sans-serif;
}

.mtg-news-date strong[b-ofptghjwxg] {
    display: block;
    font-size: 15px;
    color: #1e3a8a;
    font-weight: 700;
    line-height: 1.1;
}

.mtg-news-body[b-ofptghjwxg] { flex: 1; }

.mtg-news-body h4[b-ofptghjwxg] {
    font-size: 11.5px;
    font-weight: 600;
    color: #0f2451;
    margin-bottom: 2px;
    line-height: 1.3;
    font-family: 'DM Sans', sans-serif;
}

.mtg-news-body p[b-ofptghjwxg] {
    font-size: 10.5px;
    color: #4a6080;
    line-height: 1.4;
    font-family: 'DM Sans', sans-serif;
}

.mtg-news-author[b-ofptghjwxg] {
    font-size: 10px;
    color: #1a6fc4;
    margin-top: 2px;
    font-weight: 500;
    font-family: 'DM Sans', sans-serif;
}

/* ── Responsive ─────────────────────────────────────── */

@media (max-width: 1500px) {
    .mtg-body[b-ofptghjwxg] { padding: 12px 16px 12px 18px; gap: 10px; }
}

@media (max-width: 1050px) {
    .mtg-body[b-ofptghjwxg] { flex-direction: column; overflow-y: auto; }
    .mtg-left-col[b-ofptghjwxg], .mtg-right-col[b-ofptghjwxg] { flex: none; }
    .mtg-curves-grid[b-ofptghjwxg] { grid-template-rows: repeat(3, auto); }
    .mtg-chart-card[b-ofptghjwxg] { min-height: 200px; }
    .mtg-news-card[b-ofptghjwxg]  { min-height: 220px; }
}
/* /Components/Account/Shared/OldAccountLayout.razor.rz.scp.css */
.login-main[b-adcvj360dr]{
    background-image: url("../assets/Background_Images/tankerDoingShippingThings_alt.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    justify-content: center;
    align-items: center;

}

@media only screen and (max-width: 1400px) {
    .login-main[b-adcvj360dr] {
        background-image: url("../assets/Background_Images/LNGDockedComp.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        height: 100vh;
        width: 100vw;
        justify-content: center;
        align-items: center;
    }
}

@media only screen and (max-width: 1000px) {
    .login-main[b-adcvj360dr] {
        background-image: url("../assets/Background_Images/Mobile/DarkPortraitMobile.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        height: 100vh;
        width: 100vw;
        justify-content: center;
        align-items: center;
    }
}

.login-form[b-adcvj360dr] {
    background-color: rgb(181, 203, 214, 0.88);
    border-radius: 1rem;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
}

[b-adcvj360dr] .form-control:focus {
    background-color: #fff;
}

[b-adcvj360dr] h1, [b-adcvj360dr] .h1 {
    margin: 1rem 0 1rem 0;
    font-size: 2.75rem;
    /*white-space: nowrap;*/
}

[b-adcvj360dr] p {
    font-family: "Soehne",cursive;
    font-size: 1.1rem;
}

[b-adcvj360dr] .btn {
    font-size: 1.25rem;
}

.marquee[b-adcvj360dr] {
    height: 1.5rem;
    background-color: rgba(64, 88, 100, 0.8);
    overflow: hidden;
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
    z-index: 1000; /* Ensure it's on top of other elements */
}

.marquee ul[b-adcvj360dr] {
    display: inline-block;
    white-space: nowrap;
    position: absolute;
    width: auto;
    left: 0;
    animation: marqueeAnim-b-adcvj360dr 90s linear infinite; /* Increased from 60s to 90s to make it slower */
}

.marquee li[b-adcvj360dr] {
    display: inline-block;
    color: white;
    font-size: 1.1rem;
    margin-right: 150px; /* Add a margin to prevent overlapping */
}

.marquee li a[b-adcvj360dr] {
    color: white;
    text-decoration: none;
}

.marquee:hover ul[b-adcvj360dr] {
    animation-play-state: paused;
}

.marquee li:hover[b-adcvj360dr] {
    animation-play-state: paused;
}

.marquee li a:hover[b-adcvj360dr] {
    text-decoration: underline;
}

@keyframes marqueeAnim-b-adcvj360dr {
    0% {
        transform: translateX(100vw);
    }
    100% {
        transform: translateX(-100%);
    }
}

@media screen and (max-width: 1400px) {
    .marquee[b-adcvj360dr] {
        display: none;
    }
}
/* /Components/Account/Shared/ShopFrontDashboard.razor.rz.scp.css */
/* /Components/Common/ChartBuilder/HighchartBase.razor.rz.scp.css */
.HighChart-Base[b-t5qgcncj1o],
.highcharts-basic-theme[b-t5qgcncj1o],
.highcharts-myssy-light[b-t5qgcncj1o],
.highcharts-myssy-dark[b-t5qgcncj1o] {
    height: 100%;
}

.HighChart-Base.highcharts-basic-theme[b-t5qgcncj1o]  > .highcharts-container image,
.HighChart-Base.highcharts-myssy-light[b-t5qgcncj1o]  > .highcharts-container image {
    opacity: 5%;
}

.HighChart-Base.highcharts-myssy-dark[b-t5qgcncj1o]  > .highcharts-container image {
    opacity: 30%;
}
/* /Components/Common/ChartBuilder/PeriodCode_Selector.razor.rz.scp.css */
.periodcode-component form[b-6di5g6b8v5] {
    display: flex;
    justify-content: space-evenly;
    margin-bottom: 5px;
}

    .periodcode-component form .ssy-select-long[b-6di5g6b8v5] {
        width: auto;
    }

    .periodcode-component form .periodcode-title-container[b-6di5g6b8v5] {
        margin: auto;
        display: inline-block;
    }

    .periodcode-component form .periodcode-checkbox-parent-container[b-6di5g6b8v5] {
        display: flex;
        flex-direction: row;
        justify-content: space-evenly;
    }

    .periodcode-component form .periodcode-checkbox-container[b-6di5g6b8v5] {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

        .periodcode-component form .periodcode-checkbox-container label[b-6di5g6b8v5] {
            padding: 0.25rem;
        }

            .periodcode-component form .periodcode-checkbox-container label > input[b-6di5g6b8v5] {
                vertical-align: middle;
            }

.periodcode-component .periodcode-selected-container[b-6di5g6b8v5] {
    /*    display: flex;
flex-direction: column;*/
    width: 100%;
}

    .periodcode-component .periodcode-selected-container > table[b-6di5g6b8v5] {
        width: 100%;
    }

        .periodcode-component .periodcode-selected-container > table > caption[b-6di5g6b8v5] {
            caption-side: top;
            color: #000000;
            font-weight: 400;
            margin-bottom: 0;
        }

        .periodcode-component .periodcode-selected-container > table > thead > tr[b-6di5g6b8v5] {
            background-color: #009DC9;
            color: white;
            border-color: #009DC9;
        }

        .periodcode-component .periodcode-selected-container > table > tbody > td[b-6di5g6b8v5] {
            display: flex;
            flex-direction: row;
            align-items: center;
        }


.selected-year[b-6di5g6b8v5] {
    background-color: #B5CBD6;
    width: 3rem;
}
/* /Components/Common/ChartBuilder/PeriodOffset_Selector.razor.rz.scp.css */

/*
    .periodoffset-component form .ssy-select-long {
        width: auto;
    }

    .periodcode-component form .periodcode-title-container {
        margin: auto;
        display: inline-block;
    }

    .periodcode-component form .periodcode-checkbox-parent-container {
        display: flex;
        flex-direction: row;
        justify-content: space-evenly;
    }

    .periodcode-component form .periodcode-checkbox-container {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }

        .periodcode-component form .periodcode-checkbox-container label {
            padding: 0.25rem;
        }

            .periodcode-component form .periodcode-checkbox-container label > input {
                vertical-align: middle;
            }
*/
/* /Components/Common/ChartBuilder/Route_Selector.razor.rz.scp.css */
.dataselector-component form[b-hogceo55vz] {
    padding-left: 2rem;
    display: flex;
    gap: 2rem;
    justify-content: flex-start;
    margin-bottom: 5px;
}

.dataselector-component form .ssy-select-long[b-hogceo55vz] {
    width: auto;
}

.ssy-select-long[b-hogceo55vz] {
    border: 1px solid #767676;
}

.dataselector-component .dataselector-selected-container[b-hogceo55vz] {
    /*    display: flex;
flex-direction: column;*/
    width: 100%;
}

.dataselector-component .dataselector-selected-container > table[b-hogceo55vz] {
    width: 100%;
}

.dataselector-component .dataselector-selected-container > table > caption[b-hogceo55vz] {
    caption-side: top;
    color: #000000;
    font-weight: 400;
    margin-bottom: 0;
}

.dataselector-component .dataselector-selected-container > table > thead > tr[b-hogceo55vz] {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

    .dataselector-component .dataselector-selected-container > table > tbody[b-hogceo55vz] {
        font-size: 0.8rem;
    }

.selected-key[b-hogceo55vz] {
    background-color: #B5CBD6;
    width: 6rem;
}


.selected-sublist[b-hogceo55vz] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 1rem;
    border-bottom: 1px solid #B5CBD6;
}

.route-selected:checked + .route-selected-label[b-hogceo55vz] {
    background-color: #000061;
    color: white;
}

.route-selected-label[b-hogceo55vz] {
    width:100%;
}


.route-selected-label:hover[b-hogceo55vz] {
    background-color: #E9EFF9;
}
/* /Components/Common/ContangoLevels/ContangoLevels.razor.rz.scp.css */
table.enterPrices[b-4nyjqy7tk9] {
    caption-side: top;
}

table.enterPrices > thead > tr[b-4nyjqy7tk9], table.enterPrices tr.tableHeader[b-4nyjqy7tk9] {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

table.enterPrices > tbody > tr[b-4nyjqy7tk9] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min-content !important;
}

.routeName[b-4nyjqy7tk9] {
    font-weight: bold;
    background-color: #000061;
    color: white;
    font-size: 120%;
    padding: 0 0 0 5px;
    align-content: center;
    height: 1.9em;
}

.fcdesc[b-4nyjqy7tk9] {
    text-align: left;
    padding-left: 5px;
    width: 12em;
}

.fcprice[b-4nyjqy7tk9] {
    text-align: right;
    width: 8em;
}

.fcjointprice[b-4nyjqy7tk9] {
    text-align: right;
    width: 10em;
}

.negNum[b-4nyjqy7tk9] {
    color: red;
}

.posNum[b-4nyjqy7tk9] {
    color: darkgreen;
}

.percMove1[b-4nyjqy7tk9] {
    background-color: lemonChiffon;
}

.percMove2[b-4nyjqy7tk9] {
    background-color: gold;
}

.percMove3[b-4nyjqy7tk9] {
    background-color: orange;
}

.percMove4[b-4nyjqy7tk9] {
    background-color: red;
    color: white;
}

[b-4nyjqy7tk9] .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    width: 95%;
    /*min-width: 5rem;*/
    /*max-width: 8rem;*/
}

[b-4nyjqy7tk9] .staleprice {
    background-color: LightYellow;
}

table .remove:hover[b-4nyjqy7tk9] {
    background-color: #FF6961;
    cursor: pointer;
}

.small-icon[b-4nyjqy7tk9] {
    height: 20px;
}
/* /Components/Common/DropZone.razor.rz.scp.css */
.file-drop-zone[b-o2z4wa7pti] {
    position: relative;
    border: dashed 2px transparent;
    border-radius: 6px;
    transition: border linear 0.2s;
    min-height: 100px;
}

.file-drop-zone.hover[b-o2z4wa7pti] {
    border: dashed 2px #007bff;
}

.file-drop-zone[b-o2z4wa7pti]::after {
    border: dashed 2px #007bff;
    content: "Drop here";
    font-size: 24px;
    position: absolute;  /* Changed from relative to absolute */
    top: 0;
    left: 0;
    height: 100%;  /* Ensure it covers the full height */
    width: 100%;  /* Ensure it covers the full width */
    background-color: rgba(0, 123, 255, 0.15);  /* Changed color to match border */
    opacity: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity ease 0.2s;
    pointer-events: none;
    z-index: 1000;
}

.file-drop-zone.hover[b-o2z4wa7pti]::after {
    opacity: 1;  /* Changed from 0.8 to 1 for better visibility */
}

.drop-zone-info[b-o2z4wa7pti] {
    position: absolute;
    bottom: 8px;
    left: 8px;
    color: #6c757d;
    font-size: 14px;
    cursor: help;
}

.drop-zone-info i:hover[b-o2z4wa7pti] {
    color: #007bff;
}
/* /Components/Common/GaugeInput/GaugeInput.razor.rz.scp.css */
/* Existing styles */
.comp-gauge-input[b-2bvzjtnybj]  .enterPrices table {
    width: 100%;
}

.comp-gauge-input[b-2bvzjtnybj]  .tableHeader {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

.comp-gauge-input[b-2bvzjtnybj]  .enterPrices table > tbody > tr {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min-content !important;
}

.comp-gauge-input[b-2bvzjtnybj]  .routeName {
    font-weight: bold;
    background-color: #000061;
    color: white;
    font-size: 120%;
    padding: 0 0 0 5px;
    align-content: center;
    height: 1.9em;
}

.comp-gauge-input[b-2bvzjtnybj]  .fcdesc {
    text-align: left;
    padding-left: 5px;
    width: 12em;
}

.comp-gauge-input[b-2bvzjtnybj]  .fcjointprice {
    text-align: left;
    padding-left: 5px;
    width: 10em;
}

.comp-gauge-input[b-2bvzjtnybj]  .fcprice {
    text-align: right;
    width: 8em;
}

.comp-gauge-input[b-2bvzjtnybj]  .stalePrice {
    background-color: LightYellow;
}
/* /Components/Common/Intraday/IntradayCalculator.razor.rz.scp.css */
.calc-table[b-1kra7qm7u3] {
    width: 100%; 
    border: 1px solid #d2cdc3;
    font-family: Verdana, sans-serif; 
    font-size: 10.5pt;
    text-align: right;
    table-layout: fixed;
}
.align-left[b-1kra7qm7u3] {
    text-align: left;
}
.align-right[b-1kra7qm7u3] {
    text-align: right;
}
.header-selected[b-1kra7qm7u3] {
    background-color: #163E9F;
}

.ssy-h4[b-1kra7qm7u3] {
    font-size: 1.25rem;
    color: #000061;
}

.saved-input-row[b-1kra7qm7u3] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.saved-input-row .form-control[b-1kra7qm7u3] {
    flex: 1;
    height: 2rem;
    padding: 0.25rem 0.5rem;
    font-size: 0.85rem;
}

.saved-calc-list[b-1kra7qm7u3] {
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #d2cdc3;
    border-radius: 4px;
}

.saved-calc-item[b-1kra7qm7u3] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.5rem;
    border-bottom: 1px solid #eee;
}

.saved-calc-item:last-child[b-1kra7qm7u3] {
    border-bottom: none;
}

.saved-calc-item:hover[b-1kra7qm7u3] {
    background-color: #f0f5f8;
}

.saved-calc-load[b-1kra7qm7u3] {
    flex: 1;
    text-align: left;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 0.9rem;
    color: #163E9F;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.saved-calc-load:hover[b-1kra7qm7u3] {
    text-decoration: underline;
}

.saved-calc-meta[b-1kra7qm7u3] {
    font-size: 0.72rem;
    color: #888;
    white-space: nowrap;
    flex-shrink: 0;
}

.saved-calc-delete[b-1kra7qm7u3] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0.1rem;
    color: #aaa;
    line-height: 1;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.saved-calc-delete:hover[b-1kra7qm7u3] {
    color: #d9534f;
}
/* /Components/Common/Intraday/IntradayCurveTable.razor.rz.scp.css */
.intraday-curve-table-container[b-mfbug5rrxc] {
    /* image to work with html to canvas */
    background: conic-gradient(#243447 0deg, #243447 90deg, #1A2432 90deg, #1A2432 270deg, #243447 270deg);
    border-radius: 0.75em;
    border: 1px solid  transparent;
    padding: 0.5em 0 0.5em 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.intraday-curve-table-container.light-theme[b-mfbug5rrxc] {
    background: conic-gradient(#0087CB 0deg, #0087CB 90deg, #F4F7F9 90deg, #F4F7F9 270deg, #0087CB 270deg);
    border: 1px solid #0087CB;
}

.intraday-interaction-icons[b-mfbug5rrxc] {
    display: flex;
    align-items: end;
    column-gap: 0.9em;
}

/* Copy Styling */
/* ============ */
.intraday-copy-as-image-logo[b-mfbug5rrxc] {
    display: none;
    background-image: url(/assets/lines/SSYShippingLines_01_stretchable.svg);
    background-size: 100% 200%;
    /*background-color: #FFFFFF;*/
}
.intraday-copy-as-image-logo img[b-mfbug5rrxc] {
    width: 20rem;
    padding-bottom: 10px;
    align-content: center;
    text-align: center;
}
/* Table styling */
/* ============= */
.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw {
    caption-side: top;
    width: 100%;
    font-family: Verdana, sans-serif;
    /*font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;*/
    font-size: 10.5pt;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw caption {
    padding: 0 0.25em 0.25em 0.25em;
    color: #fff;
    background-color: #243447;
    font-family: inherit;
    font-size: 1em;
    display: table-caption;
}

.intraday-curve-table-container.light-theme[b-mfbug5rrxc]  table.myssy-table-lw caption {
    background-color: #0087CB;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw caption > span {
    display: inline-flex;
    justify-content: space-between;
    width: 100%;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw td,
.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw th {
    line-height: 1.5em;
    text-align: right;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw thead tr.intraday-th-price-row th {
    font-weight: normal;
    background-color: #1A2432;
    color: #FFFFFF;   
}

.intraday-curve-table-container.light-theme[b-mfbug5rrxc]  table.myssy-table-lw thead tr.intraday-th-price-row th {
    background-color: #F4F7F9;
    color: #000000;  
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw thead tr.intraday-th-title-row th {
    background-color: #243447;
    color: #FFFFFF;
}

.intraday-curve-table-container.light-theme[b-mfbug5rrxc]  table.myssy-table-lw thead tr.intraday-th-title-row th {
    background-color: #0087CB;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr td {
    /*border-bottom: 1px solid #0087CB;*/
    border-top: 1px solid #243447;
    background-color: #1A2432;
    color: #FFFFFF;
}

.intraday-curve-table-container.light-theme[b-mfbug5rrxc]  table.myssy-table-lw tbody tr td {
    background-color: #F4F7F9;
    border-bottom: 1px solid #0087CB;
    color: #000000;  
}


.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr.intraday-bom td {
    font-style: italic;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr.intraday-period-separator td {
    border-top: 3px solid #243447;
}

.intraday-curve-table-container.light-theme[b-mfbug5rrxc]  table.myssy-table-lw tbody tr.intraday-period-separator td {
    border-top: 3px solid #0087CB;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr:first-child td {
    border-top: none;

}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw thead tr th:first-child,
.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr td:first-child {
    padding-left: 0.25em;
    text-align: left;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw thead tr th:last-child,
.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr td:last-child {
    padding-right: 0.25em;
}

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr td.intraday-graph-click button {
    visibility: hidden;
} 

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr:hover td.intraday-graph-click button {
    visibility: visible;
} 

.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr.intraday-history-tooltip-row,
.intraday-curve-table-container[b-mfbug5rrxc]  table.myssy-table-lw tbody tr.intraday-history-tooltip-row td.intraday-history-tooltip {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

/* Tooltip styling */
/* ===================== */
.intraday-curve-table-container .intraday-history-tooltip-hover:hover[b-mfbug5rrxc]{
    animation-name: copyFadeInOut-b-mfbug5rrxc;
    animation-duration: 2000ms;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}


.intraday-curve-table-container .intraday-history-tooltip[b-mfbug5rrxc] {
    position: relative;
}

.intraday-curve-table-container .intraday-history-tooltip .intraday-history-tooltip-content[b-mfbug5rrxc] {
    visibility: hidden;
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    background-color: #243447;
    color: #ffffff;
    padding: 0.1em 0 0.25em 0;
    border: 1px solid #243447;
}

.intraday-curve-table-container.light-theme .intraday-history-tooltip .intraday-history-tooltip-content[b-mfbug5rrxc] {
    background-color: #0087CB;
    color: #000000;
    border: 1px solid #0087CB;
}

.intraday-curve-table-container .intraday-history-tooltip .intraday-history-tooltip-content b[b-mfbug5rrxc] {
    font-size: 120%;
    margin-left: 0.25em;
    color: #ffffff;
}

.intraday-curve-table-container .intraday-history-tooltip .intraday-history-tooltip-content table[b-mfbug5rrxc] {
    width: calc(100% - 0.5em);
    margin: 0 0.25em;
}

.intraday-curve-table-container .intraday-history-tooltip-content.intraday-history-tooltip-content-show[b-mfbug5rrxc] {
    visibility: visible;
}

/* Copy styling   */
/* ============== */
.intraday-curve-table-container[b-mfbug5rrxc]  .copy-fade-in-fade-out {
    animation-name: copyFadeInOut-b-mfbug5rrxc;
    animation-duration: 2000ms;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

@keyframes copyFadeInOut-b-mfbug5rrxc {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* Upgrade button styling */
/* ===================== */
.intraday-curve-table-container .myssy-upgrade-button[b-mfbug5rrxc] {
    padding: 0.25em 0.5em;
    font-size: 1em;
    font-weight: 600;
    border-radius: 0.5em;
    background: #152234;
    color: #E5E7EB;
    cursor: pointer;
    border: 1px solid rgba(255,255,255,.08);
    transition: all .15s ease;
    text-decoration: none;
}

.intraday-curve-table-container.light-theme .myssy-upgrade-button[b-mfbug5rrxc] {
    background: #0087CB;
    color: #FFFFFF;
}

.intraday-curve-table-container .myssy-upgrade-button:hover[b-mfbug5rrxc] {
    background: #1e3a5f;
}

.intraday-curve-table-container.light-theme .myssy-upgrade-button:hover[b-mfbug5rrxc] {
    background: #0076b0;
}

.intraday-curve-table-container .myssy-upgrade-button:disabled[b-mfbug5rrxc] {
    background: #E5E7EB;
    color: #000000;
    cursor: not-allowed;
    border-color: transparent;
}

/* Colour styling */
/* ============== */
.intraday-curve-table-container table.myssy-table-lw tbody tr td.settlement-up[b-mfbug5rrxc] {
    color: #22C55E;
}

.intraday-curve-table-container.light-theme table.myssy-table-lw tbody tr td.settlement-up[b-mfbug5rrxc] {
    color: #13A846;
}

.intraday-curve-table-container table.myssy-table-lw tbody tr td.settlement-down[b-mfbug5rrxc] {
    color: #F87171;
}

.intraday-curve-table-container.light-theme table.myssy-table-lw tbody tr td.settlement-down[b-mfbug5rrxc] {
    color: #FF0000;
}

.intraday-curve-table-container table.myssy-table-lw tbody tr td.intraday-up[b-mfbug5rrxc] {
    color: #A3E635;
}

.intraday-curve-table-container.light-theme table.myssy-table-lw tbody tr td.intraday-up[b-mfbug5rrxc] {
    color: #91A527;
}

.intraday-curve-table-container table.myssy-table-lw tbody tr td.intraday-up-pulse[b-mfbug5rrxc] {
    animation-name: pulse-intraday-up-b-mfbug5rrxc;
    animation-duration: 700ms;
    animation-iteration-count: 40;
    animation-timing-function: linear;
}

.intraday-curve-table-container.light-theme table.myssy-table-lw tbody tr td.intraday-up-pulse[b-mfbug5rrxc] {
    animation-name: pulse-intraday-up-light-b-mfbug5rrxc;    
}

.intraday-curve-table-container table.myssy-table-lw tbody tr td.intraday-down[b-mfbug5rrxc] {
    color: #FF7070;
}

.intraday-curve-table-container.light-theme table.myssy-table-lw tbody tr td.intraday-down[b-mfbug5rrxc] {
    color: #DB303A;
}

.intraday-curve-table-container table.myssy-table-lw tbody tr td.intraday-down-pulse[b-mfbug5rrxc] {
    animation-name: pulse-intraday-down-b-mfbug5rrxc;
    animation-duration: 700ms;
    animation-iteration-count: 40;
    animation-timing-function: linear;
}

.intraday-curve-table-container.light-theme table.myssy-table-lw tbody tr td.intraday-down-pulse[b-mfbug5rrxc] {
    animation-name: pulse-intraday-down-light-b-mfbug5rrxc;    
}

@keyframes pulse-intraday-up-b-mfbug5rrxc {
    0% {
        text-shadow: 0 0 0  rgba(163, 230, 53, 0.0);
    }

    30% {
        text-shadow: 
            0 0 6px  rgba(163, 230, 53, 0.85), 
            0 0 14px rgba(163, 230, 53, 0.6), 
            0 0 24px rgba(163, 230, 53, 0.4);
    }

    100% {
        text-shadow: 0 0 0 rgba(163, 230, 53, 0.0);
    }
}

@keyframes pulse-intraday-up-light-b-mfbug5rrxc {
    0% {
        text-shadow: 0 0 0  rgba(145, 165, 39, 0.0);
    }

    30% {
        text-shadow:
             0 0 6px  rgba(145, 165, 39, 0.85),
             0 0 14px rgba(145, 165, 39, 0.6),
             0 0 24px rgba(145, 165, 39, 0.4);
    }

    100% {
        text-shadow: 0 0 0  rgba(145, 165, 39, 0.0);
    }
}

@keyframes pulse-intraday-down-b-mfbug5rrxc {
    0% {
        text-shadow: 0 0 0 rgba(255, 112, 112, 0.0);
    }

    30% {
        text-shadow: 
            0 0 6px  rgba(255, 112, 112, 0.85), 
            0 0 14px rgba(255, 112, 112, 0.6), 
            0 0 24px rgba(255, 112, 112, 0.4);
    }

    100% {
        text-shadow: 0 0 0 rgba(255, 112, 112, 0.0);
    }
}

@keyframes pulse-intraday-down-light-b-mfbug5rrxc {
    0% {
        text-shadow: 0 0 0 rgba(219, 48, 58, 0.0);
    }

    30% {
        text-shadow:
                0 0 6px  rgba(219, 48, 58, 0.85),
                0 0 14px rgba(219, 48, 58, 0.6),
                0 0 24px rgba(219, 48, 58, 0.4);
    }

    100% {
        text-shadow: 0 0 0 rgba(219, 48, 58, 0.0);
    }
}
/* /Components/Common/Intraday/IntradayDynamicChart.razor.rz.scp.css */
.intraday-chart-container[b-3g0yd0kjre] {
    background: conic-gradient(#243447 0deg, #243447 90deg, #1A2432 90deg, #1A2432 270deg, #243447 270deg);
    border-radius: 0.75em;
    border: 1px solid transparent;
    padding: 0.5em 0 0.5em 0;
}

.intraday-chart-container.light-theme[b-3g0yd0kjre] {
    background: conic-gradient(#0087CB 0deg, #0087CB 90deg, #F4F7F9 90deg, #F4F7F9 270deg, #0087CB 270deg);
    border: 1px solid #0087CB;
}

.intraday-chart-header[b-3g0yd0kjre] {
    display: flex;
    padding: 0 0.25em 0.25em 0.25em;
    justify-content: space-between;
}

.intraday-chart-container .intraday-chart-header[b-3g0yd0kjre] {
    color: #fff;
}

.intraday-chart-container .intraday-chart-header h3[b-3g0yd0kjre] {
    color: inherit;
}

.intraday-chart-header h3[b-3g0yd0kjre] {
    font-size: 1.25em;
}

/*.myssy-select-box-container {*/
/*    display: inline-flex;*/
/*    align-items: center;*/
/*    gap: 0.5em;*/
/*}*/

/*.myssy-select-box {*/
/*    min-width: 150px;*/
/*    appearance: none;*/
/*    -webkit-appearance: none;*/
/*    -moz-appearance: none;*/
/*    background-color: light-dark(#009DC9,#152234);*/
/*    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 20 20' fill='none'><path d='M5 7l5 5 5-5' stroke='%23CBD5E1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");*/
/*    background-repeat: no-repeat;*/
/*    background-position: right 0.5em center;*/
/*    border: 1px solid rgba(255,255,255,.10);*/
/*    color: light-dark(#FFFFFF,#E5E7EB);*/
/*    padding: 0 .25em 0 0.5em;*/
/*    border-radius: 0.5em;*/
/*    font-size: 1em;*/
/*    font-weight: 600;*/
/*    outline: none;*/
/*    transition: border-color .15s ease, box-shadow .15s ease;*/
/*    !*box-shadow: 0 0.75em 1.25em rgba(0,0,0,.25);*!*/
/*}*/

/*.myssy-select-box:hover {*/
/*    border-color: rgba(255,255,255,.14);*/
/*}*/

/*.myssy-select-box:focus {*/
/*    border-color: rgba(103,212,255,.55);*/
/*    !*box-shadow: 0 0 0 3px rgba(103,212,255,.18), 0 10px 22px rgba(0,0,0,.30);*!*/
/*}*/

/*.myssy-select-box:disabled {*/
/*    opacity: .55;*/
/*    cursor: not-allowed;*/
/*}*/
/* /Components/Common/Intraday/IntradayInfo.razor.rz.scp.css */
.intraday-info-container[b-sbquo6uky7]{
    border-radius: 0.75em;
    border: 1px solid transparent;
    padding: 0.5em 0 0.5em 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: light-dark(#F4F7F9,#1A2432);
    animation: CardIn-b-sbquo6uky7 0.3s ease-in-out;
}

.intraday-info-container:hover[b-sbquo6uky7] {
    border-color: #4a7ab5;
    box-shadow: 0 4px 20px rgba(15, 36, 81, 0.14), 0 1px 4px rgba(15, 36, 81, 0.08);
}

.intraday-info-container h3[b-sbquo6uky7] {
    font-size: 14px;
    color: light-dark(#000000, #FFFFFF);
    font-weight: 600;
    margin-bottom: 0.25em;
}

.intraday-info-container p[b-sbquo6uky7] {
    font-size: 12px;
    color: light-dark(#666666, #CCCCCC);
    line-height: 1.5;
}

@keyframes CardIn-b-sbquo6uky7 {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}
/* /Components/Common/Intraday/IntradayNewsFeed.razor.rz.scp.css */
.intraday-news-feed-container[b-349ff6rs2v] {
    background: conic-gradient(#243447 0deg, #243447 90deg, #1A2432 90deg, #1A2432 270deg, #243447 270deg);
    border-radius: 0.75em;
    border: 1px solid transparent;
    padding: 0.5em 0 0.5em 0;
}

.intraday-news-feed-container.light-theme[b-349ff6rs2v] {
    background: conic-gradient(#0087CB 0deg, #0087CB 90deg, #F4F7F9 90deg, #F4F7F9 270deg, #0087CB 270deg);
    border: 1px solid #0087CB;
}

.intraday-news-feed-container .intraday-news-feed-header[b-349ff6rs2v] {
    display: flex;
    padding: 0 0.25em 0.25em 0.25em;
    color: #fff;
    justify-content: space-between;
    font-size: 10.5pt;
    font-family: Verdana, sans-serif;
}

.intraday-news-feed-container .intraday-news-feed-header h3[b-349ff6rs2v] {
    font-family: inherit;
    font-size: 1.25em;
    color: #fff;
}

.intraday-news-feed-container .intraday-news-feed-sub-header[b-349ff6rs2v] {
    padding: 0 0.25em 0.25em 0.25em;
}


.intraday-news-feed-container .myssy-radio-main[b-349ff6rs2v] {
    display: flex;
    gap: 0.5em;
}

.intraday-news-feed-container .myssy-radio-main input[b-349ff6rs2v] {
    display: none;
}

.intraday-news-feed-container .myssy-radio-main label[b-349ff6rs2v] {
    padding: 0.25em 0.5em;
    font-size: 1em;
    font-weight: 600;
    border-radius: 0.5em;
    background: #152234;
    color: #E5E7EB;
    cursor: pointer;
    border: 1px solid rgba(255,255,255,.08);
    transition: all .15s ease;
}

.intraday-news-feed-container.light-theme .myssy-radio-main label[b-349ff6rs2v] {
    background: #0087CB;
    color: #FFFFFF;
}


.intraday-news-feed-container .myssy-radio-main label:hover[b-349ff6rs2v] {
    background: #1e3a5f;
}

.intraday-news-feed-container.light-theme .myssy-radio-main label:hover[b-349ff6rs2v] {
    background: #0076b0;
}

.intraday-news-feed-container .myssy-radio-main input:checked + label[b-349ff6rs2v] {
    background: #22C55E;
    color: #0f172a;
    border-color: transparent;
}

.intraday-news-feed-container.light-theme .myssy-radio-main input:checked + label[b-349ff6rs2v] {
    background: #000061;
    color: #FFFFFF;
}

.intraday-news-feed-container .myssy-radio-main input:disabled + label[b-349ff6rs2v] {
    background: #E5E7EB;
    color: #000000;
    cursor: not-allowed;
    border-color: transparent;
}

.intraday-news-feed-container .intraday-news-feed-items-container[b-349ff6rs2v] {
    list-style-type: none;
    padding: 0;
    margin: 0;
    min-height: 250px;
    max-height: 350px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-gutter: stable both-edges;
    scrollbar-color: #152234 transparent;
    background: #1A2432;
}

.intraday-news-feed-container.light-theme .intraday-news-feed-items-container[b-349ff6rs2v] {
    scrollbar-color: #000061 transparent;
    background: #F4F7F9;
}

.intraday-news-feed-container .news-feed-short-container .intraday-news-feed-items-container[b-349ff6rs2v] {
    max-height: 320px;
}

.intraday-news-feed-container .intraday-news-feed-item[b-349ff6rs2v] {
    background: #1A2432;
    color: #e5e7eb;
    font-size: 10.5pt;
    font-family: Verdana, sans-serif;
    padding: 0.25em 0.25em 0.25em 0.25em;
    cursor: pointer;
}

.intraday-news-feed-container.light-theme .intraday-news-feed-item[b-349ff6rs2v] {
    background: #F4F7F9;
    color: #1e293b;
}

.intraday-news-feed-container .intraday-news-feed-item:nth-child(2n)[b-349ff6rs2v] {
    background: #243447;
}

.intraday-news-feed-container.light-theme .intraday-news-feed-item:nth-child(2n)[b-349ff6rs2v] {
    background: #dbeafe;
}

.intraday-news-feed-container .intraday-news-feed-item > div[b-349ff6rs2v] {
    display: flex;
    justify-content: space-between;
    font-style: italic;
    padding-bottom: 0.1em;
    color: #9ca3af;
}

.intraday-news-feed-container.light-theme .intraday-news-feed-item > div[b-349ff6rs2v] {
    color: #475569;
}

.intraday-news-feed-container .intraday-news-feed-item b[b-349ff6rs2v] {
    text-decoration: none;
    color: #fff;
    font-weight: 600;
}

.intraday-news-feed-container.light-theme .intraday-news-feed-item b[b-349ff6rs2v] {
    color: #1e3a8a;
}

.intraday-news-feed-container .intraday-news-feed-item p[b-349ff6rs2v] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
}

.intraday-news-feed-container .intraday-news-feed-item > span[b-349ff6rs2v] {
    display: block;
    padding-bottom: 0.5em;
}

/* override tag styling */
.intraday-news-feed-container .intraday-news-feed-item[b-349ff6rs2v]  .tagsshow-container {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25em;
    margin-top: 0.2em;
}

.intraday-news-feed-container .intraday-news-feed-item[b-349ff6rs2v]  .tagsshow-sub {
    background-color: transparent !important;
    border: 1px solid rgb(34, 211, 238);
    padding: 0.1em 0.35em !important;
    border-radius: 0.25em;
    font-size: 0.7em;
    opacity: 0.8;
}

.intraday-news-feed-container.light-theme .intraday-news-feed-item[b-349ff6rs2v]  .tagsshow-sub {
    border: 1px solid rgb(34, 211, 238);
}
/* /Components/Common/LandingPage/ClickThroughLinks.razor.rz.scp.css */
.click-through-links h2[b-bc3kyvy69u]{
    align-self: center;
}

.click-through-links .click-through-links[b-bc3kyvy69u] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.click-through-links .click-through-links ul[b-bc3kyvy69u] {
    display: flex;
    justify-content: end;
    list-style: none;
    padding: 0;
    width: 95%;
    margin: auto;
}

.click-through-links .click-through-links div:first-child ul[b-bc3kyvy69u] {
    justify-content: start;
}
.click-through-links .click-through-links div:last-child ul li:not(:last-child)[b-bc3kyvy69u] {
    margin-right: 10px;
}
.click-through-links .click-through-links div:first-child ul li:not(:first-child)[b-bc3kyvy69u] {
    margin-left: 10px;
}

/* up to md */
@media (max-width: 767px) {
    .click-through-links .click-through-links ul[b-bc3kyvy69u],
    .click-through-links .click-through-links div:first-child ul[b-bc3kyvy69u] {
        justify-content: center;
    }
    .click-through-links .click-through-links div:last-child ul li[b-bc3kyvy69u],
    .click-through-links .click-through-links div:first-child ul li[b-bc3kyvy69u] {
        margin-left: 5px;
        margin-right: 5px;
    }
}

.click-through-links .click-through-links .btn.btn-info[b-bc3kyvy69u]{
    border-radius: 0.375rem;
    font-size: 18px;
    min-width: 85px;
}


/* /Components/Common/LandingPage/CustomCarousel.razor.rz.scp.css */
.carousel-container[b-qbswfpjsyy],
.carousel-item[b-qbswfpjsyy] {
    height: inherit !important;
}

.carousel[b-qbswfpjsyy] {
    height: 100%;
    width: 100%;
    overflow: hidden; /* Add this line */
}

.carousel-indicators[b-qbswfpjsyy] {
    width: 100%;
    margin: 1rem 0;
}

.carousel-indicators > div[b-qbswfpjsyy] {
    /*border-radius: 5px;*/
    background-color: #000061;
}

.carousel-indicators [data-bs-target][b-qbswfpjsyy] {
    flex: inherit;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

/* Update the carousel container styles */
.carousel-container[b-qbswfpjsyy] {
    width: 100%;
    overflow: hidden; /* Add this line */
    border-top: 3px solid #000061;
    border-bottom: 3px solid #000061;
    background-color: white;
}

.carousel-container > div[b-qbswfpjsyy] {
    display: flex;
    width: 100%;
    gap: 0;
}

.carousel-item[b-qbswfpjsyy] {
    /*height: 400px;*/
    width: 100%;
}

/* Update sidebar styles */
.sidebar-container[b-qbswfpjsyy] {
    width: 35%;  /*Use percentage instead of fixed width */
    height: 400px !important; /* Match carousel height */
    margin: 0;
    overflow-y: auto;
    /*background-color: #fff !important;*/
    /*border: 1px solid lightgrey;*/
    /*border-radius: 10px;*/
    scrollbar-width: none; /* Optional: style scrollbar width */
    /*flex: 1 1 auto;*/ /* Fixed width of 300px */
    list-style: none;
    padding: 1rem 0 1rem 1rem;
}

.sidebar-item[b-qbswfpjsyy] {
    /* min-width: 100px; */
    /* height: 125px; */ /* Remove fixed height */
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: transparent;
    transition: background 0.2s;
}

/*disable the cursor pointer for all elements inside sidebar item*/
.sidebar-item *[b-qbswfpjsyy] {
    cursor: default;
}

.sidebar-item a[b-qbswfpjsyy] {
    color: #000061;
}
.active-item[b-qbswfpjsyy] {
    color: #163E9F;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) inset, 0 0 8px rgba(82, 168, 236, 0.6);
    background: #E9EFF9;
    width: calc(100% - 3px);  /*Use percentage instead of fixed width */
/*    min-width: 255px;
    max-width: 355px;*/
    padding: 3px 0 0 5px !important;
}


@media only screen and (max-width: 1500px) {
    .sidebar-container[b-qbswfpjsyy] {
        display: none !important;
        height: 300px !important;
        margin-bottom: 1rem;
    }

    .carousel-container[b-qbswfpjsyy] {
        /*grid-template-columns: 1fr; !* Stack on smaller screens *!*/
        /*height: auto;*/
    }

    .carousel figure[b-qbswfpjsyy] {
        height: 300px !important;
    }
}

@media (max-width: 768px) {
    
    .carousel-parent[b-qbswfpjsyy]{
        align-content: center;
    }
    
    .carousel-indicators[b-qbswfpjsyy] {
        padding-bottom: 7%;
    }

    .sidebar-container[b-qbswfpjsyy] {
        height: 200px !important;
    }

    .carousel figure[b-qbswfpjsyy] {
        height: 200px !important;
    }
}

@media (max-width: 1800px) {
    .sidebar-item[b-qbswfpjsyy] {
        height: unset;
    }
}

/* Responsive breakpoints */
@media (max-width: 992px) {
    .carousel-container > div[b-qbswfpjsyy] {
        flex-direction: column;
    }

    .sidebar-container[b-qbswfpjsyy] {
        width: 100%;
        max-width: none;
        margin-bottom: 1rem;
    }
    
    .carousel-parent[b-qbswfpjsyy] {
        width: 100% !important;
    }
    #customCarousel[b-qbswfpjsyy] {
     flex: unset !important;
    }
}

.managementPanelToggle[b-qbswfpjsyy] {
    height: 2.5rem;
    width: 2.75rem;
    background-color: #000061;
    color: white;
    border: 1px solid #000061;
    border-radius: 0.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.managementPanelToggle:hover[b-qbswfpjsyy] {
    background-color: white;
    color: #000061;
}

.carousel-parent[b-qbswfpjsyy] {
    position: relative;
}

.carousel-loading-desktop[b-qbswfpjsyy] {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.carousel-loading-mobile[b-qbswfpjsyy] {
    display: none;
}

@media only screen and (max-width: 992px) {
    .carousel-loading-mobile[b-qbswfpjsyy] {
        display: block;
    }
    .carousel-loading-desktop[b-qbswfpjsyy]{
        display: none;
    }
}

.carousel figure[b-qbswfpjsyy] {
    min-height: 250px;
    height: 400px;
    /*width: 100%;*/
    margin: 0;
    background-position: 50% 50%;
    background-size: contain;
    background-repeat: no-repeat;
}

.carousel figure img[b-qbswfpjsyy] {
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    clip: rect(0, 0, 0, 0);
    border: 0;
}

.carousel figure figcaption[b-qbswfpjsyy] {
    background-color: #000061;
    color: white;
    font-weight: 500;
    text-align: center;
    justify-content: center;
    align-items: center;
    vertical-align: middle;
    /*width: 75%;*/
    /*margin: auto;*/
}

.carousel-control-next-icon[b-qbswfpjsyy]{
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000061'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.carousel-control-prev-icon[b-qbswfpjsyy]{
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000061'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}
/* /Components/Common/LandingPage/FaqAccordion.razor.rz.scp.css */
/* /Components/Common/LandingPage/Introduction.razor.rz.scp.css */
/* /Components/Common/LandingPage/LandingPage.razor.rz.scp.css */
/* ===========  =========== */
/* full screen              */
/* ===========  =========== */

/* dashboard container      */
/* =========== =========== */
.dashboard-container[b-fyzwyr2b6p] {
    display: grid;
    grid-template-columns: 1fr 450px;
    grid-template-rows: calc(100vh - 50px);
}
.dashboard-container.container-fluid[b-fyzwyr2b6p]{
    --bs-gutter-x: 0;
}

/* mid container            */
/* =========== =========== */
.dashboard-container.container-fluid > .mid-container[b-fyzwyr2b6p] {
    padding: 0.75rem 1.25rem 0 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.dashboard-container.container-fluid > .mid-container[b-fyzwyr2b6p] {
    background: linear-gradient(var(--a), #1544A3, #1544A3, #0092D1, #0092D1, #1544A3);
    border-right: 3px solid #000061;
    transition: --a 0.5s;
    animation: mid-container-rotate-b-fyzwyr2b6p 240s linear infinite;
}

/* deep goes through to child components*/
.mid-container[b-fyzwyr2b6p]  h2,
.mid-container[b-fyzwyr2b6p]  .h1Grey,
.mid-container[b-fyzwyr2b6p]  .h2Grey,
.mid-container[b-fyzwyr2b6p]  .markets-graphs-container .table-grid-item-chart a,
.mid-container[b-fyzwyr2b6p]  .markets-graphs-container table.table-sm.table-hover tr {
    /* Inline styling on market graphs table cause me to put important here... */
    color: white !important;
    border-bottom: 1px solid transparent;
}
.mid-container[b-fyzwyr2b6p]  .markets-graphs-container table.table-sm.table-hover thead tr{
    /* Inline styling on market graphs table cause me to put important here... */
    border-bottom: 1px solid white !important;
}
.mid-container[b-fyzwyr2b6p]  .markets-graphs-container table.table-sm.table-hover tbody tr:hover{
    background-color: initial;
    border-bottom: 1px solid white;
}

/* right container          */
/* =========== ===========  */
.dashboard-container.container-fluid > .right-container[b-fyzwyr2b6p] {
    padding: 0.75rem 0.5rem 0 0.5rem;
}


/* ===========  =========== */
/* desktop - tankers        */
/* ===========  =========== */
@media (max-width: 1650px) {
    .dashboard-container.Url_Tankers[b-fyzwyr2b6p] {
        grid-template-columns: 100%;
    }
}

/* ===========  =========== */
/* laptop                   */
/* ===========  =========== */

@media (max-width: 1200px) {
    .dashboard-container[b-fyzwyr2b6p] {
        grid-template-columns: 100%;
    }
    
    .dashboard-container.container-fluid > .mid-container[b-fyzwyr2b6p] {
        border-right: 0;
        border-bottom: 3px solid #000061;
    }
}

/* ===========  =========== */
/* tablet / mobile          */
/* ===========  =========== */

/*Visible at lg*/
@media (max-width: 992px) {
    .dashboard-container[b-fyzwyr2b6p] {
        align-content: center;
        grid-template-rows: auto;
    }
    
    .dashboard-container.container-fluid > .mid-container > div.order-0[b-fyzwyr2b6p]{
        display: flex;
        justify-content: center;
    }
}

/* =========== ===========  */
/* animations               */
/* =========== ===========  */
@property --a {
    syntax: '<angle>';
    inherits: false;
    initial-value: 122deg;
}

@keyframes mid-container-rotate-b-fyzwyr2b6p {
    0% {
        --a: 112deg;
    }
    50% {
        --a: 472deg;
    }
    100% {
        --a: 832deg;
    }
}
/* /Components/Common/LandingPage/LatestReports.razor.rz.scp.css */
.page-cont[b-nxz76jpek7] {
    --card-image-height: 15vh;
    --card-image-width: auto;
    --view-btn: 70px;
    --card-height: auto;
}

.cards-container[b-nxz76jpek7] {
    display: grid;
    grid-template-columns: repeat(var(--grid-cols), 1fr);
    gap: 6% 2%;
}

.cards-container.no-items-found[b-nxz76jpek7]{
    grid-template-columns: 25% 50% 25%;
    gap: 0;
}

.report-card[b-nxz76jpek7] {
    border: 1px solid lightgray;
    background: #fff;
    border-radius: 3px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    overflow: hidden; /* Hides any extra content */
    padding: 0.5rem;
    box-shadow: 0 0 4px 1px lightgray;
}

.cards-container.no-items-found .report-card[b-nxz76jpek7] {
    display: block;
}

.report-card-left[b-nxz76jpek7] {
    box-sizing: border-box;
    width: 58%;
    margin: 1% 0 1% 1%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}

/*for when image goes on the left*/
.report-card-image[b-nxz76jpek7] {
    overflow: hidden;
    height: var(--card-image-height);
}

.report-card-right[b-nxz76jpek7] {
    box-sizing: border-box;
    max-height: 100%;
    width: 42%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    text-align: center;
}

.report-title[b-nxz76jpek7] {
    height: 3.7rem;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 1.2;
    display: block;
    z-index: 3;
}

.cards-container.no-items-found .report-title[b-nxz76jpek7] {
    height: initial;
    
}

.report-view-button-div[b-nxz76jpek7] {
    height: 45%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    /*margin: 5% 0 5% 0*/
}
.report-card-view-image[b-nxz76jpek7] {
    display: none;
    height: var(--card-image-height);
    width: var(--card-image-width);
    z-index: 0;
}
.report-view-time-cont[b-nxz76jpek7] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}
.report-view-button[b-nxz76jpek7] {
    border: 2px solid lightgray;
    z-index: 10;
    height: 4vh;
    width: var(--view-btn);
    margin: 0.4rem 0.8rem;
    background-color: #000061;
    color: white;
    border-radius: 5px;
    cursor: pointer;
    font-weight: 500;
}

.report-view-button:hover[b-nxz76jpek7] {
    background: white;
    color: #000061;
    border: 2px solid #000061;
}

.lastUpdatedSmall[b-nxz76jpek7] {
    color: #6c757d;
}

/*half screen*/
@media only screen and (max-width: 1590px) {
    .page-cont[b-nxz76jpek7] {
        --card-height: 17vh;
        --card-image-height: 12vw;
        --card-image-width: 17vw;
    }

    .latest-reports-container[b-nxz76jpek7] {
        padding: 0 5% 0 5%;
    }

    .report-card[b-nxz76jpek7] {
        display: flex;
        flex-direction: column;
        align-items: center;
        height: var(--card-height);
        padding: unset;
        text-align: center;
        border: 6px solid white;
    }

    .report-card-image[b-nxz76jpek7] {
        display: none;
    }
    .report-view-button-div[b-nxz76jpek7] {
        height: 100%;
        margin: unset;
        position: relative;
        overflow: hidden;
    }
    .report-card-view-image[b-nxz76jpek7] {
        display: block;
        overflow: hidden;
    }
    .report-card-view-image img[b-nxz76jpek7] {
        height: auto;
        width: 100%;
        max-height: none;
        /* calc value gives percentage down the image for that transparency to reach */
        mask-image: linear-gradient(to bottom,
        rgba(0, 0, 0, 1.0) calc(var(--card-image-height)*0.1),
        rgba(0, 0, 0, 0.6) calc(var(--card-image-height)*0.3),
        transparent calc(var(--card-image-height)*0.7)
        );
    }


    .report-view-time-cont[b-nxz76jpek7] {
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
    }

    .report-card-left[b-nxz76jpek7] {
        display: none;
    }

    .report-title[b-nxz76jpek7] {
        height: 2.5rem;
        align-items: center;
        padding: unset;
    }

    .report-card-right[b-nxz76jpek7] {
        height: 100%;
        width: 100%;
        justify-content: unset;
    }

    .lastUpdatedSmall[b-nxz76jpek7] {

    }
}
@media only screen and (max-width: 1200px) {
    .page-cont[b-nxz76jpek7] {
        --card-image-height: 15vh;
        --card-image-width: 24vw;
    }

}

@media only screen and (max-width: 992px) {
    .page-cont[b-nxz76jpek7] {
        --card-height: 26vh; /*calc(var(--card-image-height) - 10vh);*/
        --card-image-height: 15vh;
        --card-image-width: 42vw;
    }

    .cards-container[b-nxz76jpek7] {
        height: auto;
        padding: 0 1vw 2vh 1vw;
        gap: calc(0.15 * var(--card-image-height)) calc(0.05 * var(--card-image-width));
    }

    .report-title[b-nxz76jpek7] {
        max-height: unset;
        height: 3rem;
        width: 100%;
    }

    .report-card-view-image img[b-nxz76jpek7] {
        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1.0) calc(var(--card-image-height)*0.1), rgba(0, 0, 0, 0.7) calc(var(--card-image-height)*0.6), transparent calc(var(--card-image-height)*1) );
    }
}

@media only screen and (max-width: 500px) {
    .cards-container[b-nxz76jpek7] {
        --grid-cols: 2;
        gap: calc(0.15 * var(--card-image-height)) calc(0.08 * var(--card-image-width));
    }

    .report-card-right[b-nxz76jpek7] {
        padding: unset;
    }




    /* TO HIDE IMAGE ON MOBILE (comment out image and button styling directly above)
        .report-card-view-image {
        display: none;
    }

    .report-view-button {
        position: relative;
        transform: unset;
    }*/
}
/* /Components/Common/LandingPage/MainRatesGraph.razor.rz.scp.css */
.main-rates-graph h2[b-h8trmqopnq]{
    align-self: center;
}

.main-rates-graph .graph-container[b-h8trmqopnq] {
    /* 300 graph height + border*/
    min-height: 334px;
    border: 2px solid #000061;
    border-radius: 2px;
    width: 95%;
    margin: auto;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.main-rates-graph .graph-container .ssy-colour-dw[b-h8trmqopnq] {
    height: 30px;
}
.main-rates-graph .graph-container h3[b-h8trmqopnq] {
    color: white;
    text-align: center;
}

.main-rates-graph .graph-container .graph[b-h8trmqopnq] {
    background-color: white;
    width: 100%;
    height: 300px;
    aspect-ratio: 16 / 7;
    padding-top: 10px;
}
/* /Components/Common/LandingPage/MarketsClosingFwdPrices.razor.rz.scp.css */
.positive[b-wy4aauxe4z] {
    color: mediumseagreen !important;
}

.negative[b-wy4aauxe4z] {
    color: crimson !important;
}

.radio-btns[b-wy4aauxe4z]{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(31%, 1fr));
    column-gap: 4px;
    row-gap: 4px;
    align-items: center;
}
 .radio-btns span[b-wy4aauxe4z] {
     display: inline-flex;
     justify-content: center;
 }

.radio-label[b-wy4aauxe4z] {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 130px;
    height: 35px;
    padding: 8px 8px;
    margin: 0 !important;
}

@media only screen and (max-width: 1580px) {
    .radio-label[b-wy4aauxe4z] {
        width: 120px;
    }
}@media only screen and (max-width: 1400px) {
    .radio-label[b-wy4aauxe4z] {
        width: 110px;
    }
}
@media only screen and (max-width: 1200px) {
    .radio-label[b-wy4aauxe4z] {
        width: 130px;
    }
    .not-on-mobile[b-wy4aauxe4z] {
        display: none;
    }
}
@media only screen and (max-width: 990px) {
    .radio-label[b-wy4aauxe4z] {
        width: 130px;
    }
    .not-on-mobile[b-wy4aauxe4z] {
        display: none;
    }
}
@media only screen and (max-width: 780px) {
    .radio-label[b-wy4aauxe4z] {
        width: 130px;
    }
    .not-on-mobile[b-wy4aauxe4z] {
        display: none;
    }
}
/* /Components/Common/LandingPage/MarketsClosingSpotPrices.razor.rz.scp.css */
.positive[b-kf5d196uzr] {
    color: mediumseagreen !important;
}

.negative[b-kf5d196uzr] {
    color: crimson !important;
}
/* /Components/Common/LandingPage/MarketsGraphs.razor.rz.scp.css */
.markets-graphs-container[b-8ttfgq1fbp] {
    margin-bottom: 1rem;
}

.table-grid-item-chart[b-8ttfgq1fbp] {
    border: 3px solid #FFFFFF90;
    border-radius: 3px;
}

[b-8ttfgq1fbp] .h1Grey {
    font-family: 'Soehne Breit', Arial, serif;
    font-size: 14px;
    font-weight: bolder;
    color: #000061;
}


[b-8ttfgq1fbp] .h1Grey a {
    color: #000061;
    text-decoration: underline;
}


[b-8ttfgq1fbp] .h2Grey {
    font-family: 'Soehne Breit', Arial, serif;
    font-size: 12px;
    color: #000061;
}

[b-8ttfgq1fbp] .HighChart-Base {
    padding: 0.5rem 0;
    background: #FFFFFF;
}

.loading-overlay[b-8ttfgq1fbp] {
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 50px;
    width: 100%;
    height: 100%;
    background-color: #405864;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    background-image: url('./assets/loadin.gif');
    background-repeat: no-repeat;
    background-position: center; /* Center the image */
    background-size: 20%; /* Make the image slightly smaller */
    opacity: 0.9; /* Make slightly opaque */
}

.loading-overlay[b-8ttfgq1fbp]::after {
    content: "Loading";
    position: absolute;
    top: calc(50% + 100px); /* Adjust this value to position the text below the logo */
    color: white;
    font-size: 1.5em;
    text-align: center;
}

/* /Components/Common/LandingPage/QuickLinks.razor.rz.scp.css */
.quick-links-container[b-gb6kseecxg] {
    display: grid;
    grid-template-columns: repeat(4, 125px);
    gap: 10px;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

ul[b-gb6kseecxg], li[b-gb6kseecxg] { 
    margin-left: 0; 
    padding-left: 0; 
    list-style: none;
}

a[b-gb6kseecxg] {
    text-decoration: none;
}

.grid-item[b-gb6kseecxg] {
    padding: 20px;
    width: 125px;
    height: 125px;
}

.grid-item:hover[b-gb6kseecxg] {
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
    animation: pulse-b-gb6kseecxg 1s infinite;
}

.grid-item-structure[b-gb6kseecxg] {
    height: 100%;
    width: 100%;
    text-align: center;
    color: white;
    font-weight: bold;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
}

/* if it doesn't have an ssy colour class make the colour inherit as default */
.grid-item[class*="ssy-colour-"] .grid-item-structure[b-gb6kseecxg]{
    color: inherit;
}

.grid-item-structure img[b-gb6kseecxg] {
    max-width: 65%;
    height: auto;
    margin-bottom: 10px;
}
.grid-item-structure p[b-gb6kseecxg] {
    margin: 0;
    font-size: 15px;
    font-family: "Soehne", 'Franklin Gothic book', sans-serif;
}

@media (max-width: 992px) {
    .quick-links-container[b-gb6kseecxg] {
        grid-template-columns: repeat(2, 125px);
    }
}

@media (max-width: 576px) {
    .quick-links-container[b-gb6kseecxg] {
        grid-template-columns: 125px;
    }
}

@media (max-width: 1675px) {
    .quick-links-container[b-gb6kseecxg] {
        grid-template-columns: repeat(3, 125px);
    }
}

@keyframes pulse-b-gb6kseecxg {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
    100% {
        transform: scale(1);
    }
}
/* /Components/Common/Model/ModelJoinSelector.razor.rz.scp.css */
.ModelJoinSelector-Container[b-ozf3tro72y] {
    display: flex;
    width: 100%;
}

.ModelJoinSelector-Container > div[b-ozf3tro72y] {
    width: 40%;
}

.ModelJoinSelector-Container > div:nth-child(2n)[b-ozf3tro72y] {
    width: 20%;
    min-width: 20%;
    padding: 0 20px;
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.ssy-modelTable.ssy-modelJoin .ssy-modelTable-container[b-ozf3tro72y] {
    height: 750px;
    width: 100%;
    overflow-y: scroll;
}

.ssy-modelTable.ssy-modelJoin table[b-ozf3tro72y] {
    border-bottom: 1px solid #000061;
    width: 100%;
}

.ModelJoinSelector-Container > div:nth-child(2n+1) .ssy-modelTable table[b-ozf3tro72y] {
    table-layout: fixed;
}

.ssy-modelTable.ssy-modelJoin thead[b-ozf3tro72y] {
    font-weight: bold;
    background-color: #000061;
    color: white;
    border-left: 1px solid #000061;
    border-right: 1px solid #000061;
    position: sticky;
    top: 0;
}

.ssy-modelTable.ssy-modelJoin tr.selectlist[b-ozf3tro72y] {
    border-top: 1px solid transparent;
}

.ssy-modelTable.ssy-modelJoin tr.selectlist:hover[b-ozf3tro72y] {
    border-top: 1px solid #000061;
    border-bottom: 1px solid #000061;
}

.ssy-modelTable.ssy-modelJoin td[b-ozf3tro72y] {
    overflow-wrap: break-word;
    text-overflow: ellipsis;
    border-left: 1px solid #000061;
    border-right: 1px solid #000061;
    padding: 0.25rem;
    /*word-wrap: break-word;*/
    /*max-width: 75%;*/
}

.ssy-modelTable.ssy-modelJoin th[b-ozf3tro72y] {
    padding: 0.25rem;
}

.ssy-modelTable.ssy-modelJoin .pointer[b-ozf3tro72y] {
    cursor: pointer;
}
/* /Components/Common/Model/ModelTable.razor.rz.scp.css */
.ssy-modelTable[b-asxgl7xqfg] {
    display:flex;
    flex-direction:column;
}

.ssy-modelTable .ssy-modelTable-filters[b-asxgl7xqfg] {
    display: flex;
    flex-direction: row;
}

.ssy-modelTable .ssy-modelTable-filters input[type="search"][b-asxgl7xqfg],
.ssy-modelTable .ssy-modelTable-filters select[b-asxgl7xqfg] {
    border-radius: 10px;
    border: 1px solid #000061;
    margin: 0 10px 10px 0;
    height: 25px;
    padding: 0 5px;
}
.ssy-modelTable .ssy-modelTable-container[b-asxgl7xqfg] {
    height: 750px;
    overflow-y:auto;
    overflow-x: clip;
    width: 100%;
}

.ssy-modelTable table[b-asxgl7xqfg] {
    border-bottom: 1px solid #000061;
    width: 100%;
}
.ssy-modelTable table.ssy-modelTable-fixed[b-asxgl7xqfg]{
    table-layout: fixed;
}

.ssy-modelTable thead[b-asxgl7xqfg] {
    font-weight: bold;
    background-color: #000061;
    color: white;
    border-left: 1px solid #000061;
    border-right: 1px solid #000061;
    position: sticky;
    top: 0;
}

.ssy-modelTable tr.selectlist[b-asxgl7xqfg] {
    border-top: 1px solid transparent;
}

.ssy-modelTable tr.selectlist.selected[b-asxgl7xqfg] {
    background-color: #DEDEDE;
}

.ssy-modelTable tr.selectlist:hover[b-asxgl7xqfg] {
    border-top: 1px solid #000061;
    border-bottom: 1px solid #000061;
}

.ssy-modelTable td[b-asxgl7xqfg] {
    overflow-wrap: break-word;
    text-overflow: ellipsis;
    border-left: 1px solid #000061;
    border-right: 1px solid #000061;
    padding: 0.25rem;
    /*max-width: 50%;*/
}
.ssy-modelTable th[b-asxgl7xqfg] {
    padding: 0.25rem;
    width:auto;
}
.ssy-modelTable .pointer[b-asxgl7xqfg] {
    cursor: pointer;
}
/* /Components/Common/PriceInput/EodPrices_Input_Fwd.razor.rz.scp.css */
.enterPrices table[b-8pwdc4cgxc] {
    width: 100%;
}


/*table.enterPrices > thead > tr {*/
.tableHeader[b-8pwdc4cgxc] {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

.enterPrices table > tbody > tr[b-8pwdc4cgxc] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min-content !important;
    /*font-weight: bold;*/
}

.routeName[b-8pwdc4cgxc] {
    font-weight: bold;
    background-color: #000061;
    color: white;
    font-size: 120%;
    padding: 0 0 0 5px;
    align-content: center;
    height: 1.9em;
}

.fcdesc[b-8pwdc4cgxc] {
    text-align: left;
    padding-left: 5px;
    width: 12em;
}

.fcjointprice[b-8pwdc4cgxc] {
    text-align: left;
    padding-left: 5px;
    width: 10em;
}

.fcprice[b-8pwdc4cgxc] {
    text-align: right;
    width: 8em;
}

.negNum[b-8pwdc4cgxc] {
    color: red;
}

.posNum[b-8pwdc4cgxc] {
    color: darkgreen;
}

.percMove1[b-8pwdc4cgxc] {
    background-color: lemonChiffon;
}

.percMove2[b-8pwdc4cgxc] {
    background-color: gold;
}

.percMove3[b-8pwdc4cgxc] {
    background-color: orange;
}

.percMove4[b-8pwdc4cgxc] {
    background-color: red;
    color: white;
}

[b-8pwdc4cgxc] .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    /*        width: 100%;*/
}

[b-8pwdc4cgxc] .staleprice {
    background-color: LightYellow;
}

.calculatedprice[b-8pwdc4cgxc] {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    width: 100%;
    background-color: lightgray;
    padding-right: 5px;
}

.formulatooltip[b-8pwdc4cgxc] {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

.formulatooltip .formulatooltiptext[b-8pwdc4cgxc] {
    visibility: hidden;
    white-space: nowrap;
    background-color: #000061;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 2px 5px 2px 5px;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.formulatooltip:hover .formulatooltiptext[b-8pwdc4cgxc] {
    visibility: visible;
}


.localtooltip[b-8pwdc4cgxc] {
    /*        position: relative;*/
    cursor: pointer;
}


.localtooltip .tooltiptext[b-8pwdc4cgxc] {
    visibility: hidden;
    background-color: #000061;
    color: white;
    text-align: left;
    border-radius: 6px;
    border-color: black;
    border-width: medium;
    padding: 5px;
    /* Position the popupHistory */
    position: absolute;
    left: 6em;
    z-index: 1;
    opacity: 0;
    transition: opacity 5s;
}

.localtooltip .tooltiptext[b-8pwdc4cgxc]::after {
    content: " ";
    position: absolute;
    top: 50%;
    right: 100%; /* To the left of the tooltip */
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent #545 transparent transparent;
}

.localtooltip:hover .tooltiptext[b-8pwdc4cgxc] {
    visibility: visible;
    transition: .25s all ease;
    transition-delay: 1.5s;
    opacity: 1;
}

@media screen and (max-width: 600px) {

    .hideOnSmallScreens[b-8pwdc4cgxc] {
        display: none;
    }
}
/* /Components/Common/PriceInput/EodPrices_Input_GroupFwd.razor.rz.scp.css */
table.enterPrices > thead > tr[b-bdcg11b33a], table.enterPrices tr.tableHeader[b-bdcg11b33a] {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

table.enterPrices > tbody > tr[b-bdcg11b33a] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min-content !important;
}

.fcdesc[b-bdcg11b33a] {
    text-align: left;
    padding-left: 5px;
    width: 12em;
}

.fcprice[b-bdcg11b33a] {
    text-align: right;
    width: 8em;
}

.fcjointprice[b-bdcg11b33a] {
    text-align: right;
    width: 10em;
}

.negNum[b-bdcg11b33a] {
    color: red;
}

.posNum[b-bdcg11b33a] {
    color: darkgreen;
}

.percMove1[b-bdcg11b33a] {
    background-color: lemonChiffon;
}

.percMove2[b-bdcg11b33a] {
    background-color: gold;
}

.percMove3[b-bdcg11b33a] {
    background-color: orange;
}

.percMove4[b-bdcg11b33a] {
    background-color: red;
    color: white;
}

[b-bdcg11b33a] .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
}

[b-bdcg11b33a] .staleprice {
    background-color: LightYellow;
}

.calculatedprice[b-bdcg11b33a] {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    width: 100%;
    background-color: lightgray;
    padding-right: 5px;
}

.formulatooltip[b-bdcg11b33a] {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

.formulatooltip .formulatooltiptext[b-bdcg11b33a] {
    visibility: hidden;
    white-space: nowrap;
    background-color: #000061;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 2px 5px 2px 5px;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.formulatooltip:hover .formulatooltiptext[b-bdcg11b33a] {
    visibility: visible;
}

.hideOnSmallScreens[b-bdcg11b33a] {
    display: table-cell;
}

@media screen and (max-width: 768px) {
    .hideOnSmallScreens[b-bdcg11b33a] {
        display: none;
    }
}
/* /Components/Common/PriceInput/EodPrices_Input_Spot.razor.rz.scp.css */
table.enterPrices[b-nqnd3tnd87] {
    width: 100%;
}

table.enterPrices > thead > tr[b-nqnd3tnd87] {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

table.enterPrices > tbody > tr[b-nqnd3tnd87] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min-content !important;
    /*font-weight: bold;*/
}


.fcdesc[b-nqnd3tnd87] {
    text-align: left;
    padding-left: 5px;
    width: 12em;
}

.fcprice[b-nqnd3tnd87] {
    text-align: right;
    width: 8em;
}

.negNum[b-nqnd3tnd87] {
    color: red;
}

.posNum[b-nqnd3tnd87] {
    color: darkgreen;
}

.percMove1[b-nqnd3tnd87] {
    background-color: lemonChiffon;
}

.percMove2[b-nqnd3tnd87] {
    background-color: gold;
}

.percMove3[b-nqnd3tnd87] {
    background-color: orange;
}

.percMove4[b-nqnd3tnd87] {
    background-color: red;
    color: white;
}

[b-nqnd3tnd87] .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    /*        width: 100%;*/
}

[b-nqnd3tnd87] .staleprice {
    background-color: LightYellow;
}

.calculatedprice[b-nqnd3tnd87] {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    width: 100%;
    background-color: lightgray;
    padding-right: 5px;
}

.formulatooltip[b-nqnd3tnd87] {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

.formulatooltip .formulatooltiptext[b-nqnd3tnd87] {
    visibility: hidden;
    white-space: nowrap;
    background-color: #000061;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 2px 5px 2px 5px;
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
}

.formulatooltip:hover .formulatooltiptext[b-nqnd3tnd87] {
    visibility: visible;
}
/* /Components/Common/PriceInput/IntradayPrice_Input_Fwd.razor.rz.scp.css */
.enterPrices table[b-go4s2nc9pa] {
    width: 100%;
}

/*table.enterPrices > thead > tr {*/
.tableHeader[b-go4s2nc9pa] {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

.enterPrices table > tbody > tr[b-go4s2nc9pa] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min-content !important;
    /*font-weight: bold;*/
}

.routeName[b-go4s2nc9pa] {
    font-weight: bold;
    background-color: #000061;
    color: white;
    font-size: 120%;
    padding: 0 0 0 5px;
    align-content: center;
    height: 1.9em;
}

.fcdesc[b-go4s2nc9pa] {
    text-align: left;
    padding-left: 5px;
    width: 12em;
    cursor: pointer;
}

.fcjointprice[b-go4s2nc9pa] {
    text-align: left;
    padding-left: 5px;
    width: 10em;
}

.fcprice[b-go4s2nc9pa] {
    text-align: right;
    width: 8em;
}

.negNum[b-go4s2nc9pa] {
    color: red;
}

.posNum[b-go4s2nc9pa] {
    color: darkgreen;
}

.percMove1[b-go4s2nc9pa] {
    background-color: lemonChiffon;
}

.percMove2[b-go4s2nc9pa] {
    background-color: gold;
}

.percMove3[b-go4s2nc9pa] {
    background-color: orange;
}

.percMove4[b-go4s2nc9pa] {
    background-color: red;
    color: white;
}

[b-go4s2nc9pa] .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    /*        width: 100%;*/
}

[b-go4s2nc9pa] .staleprice {
    background-color: LightYellow;
}

.calculatedprice[b-go4s2nc9pa] {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    width: 100%;
    background-color: lightgray;
    padding-right: 5px;
}

@media screen and (max-width: 600px) {

    .hideOnSmallScreens[b-go4s2nc9pa] {
        display: none;
    }
}
/* /Components/Common/PriceInput/Uranium_ClientCurve_Input_Fwd.razor.rz.scp.css */
.enterPrices table[b-9txr8gih5r] {
    width: 100%;
}

.tableHeader[b-9txr8gih5r] {
    background-color: #009DC9;
    color: white;
    border-color: #009DC9;
}

.routeName[b-9txr8gih5r] {
    font-weight: bold;
    background-color: #000061;
    color: white;
    font-size: 120%;
    padding: 0 0 0 5px;
    align-content: center;
    height: 1.9em;
}

.fcdesc[b-9txr8gih5r] {
    text-align: left;
    padding-left: 5px;
    width: 9em;
}

.fcprice[b-9txr8gih5r] {
    text-align: right;
    width: 14em;
}

.location-header[b-9txr8gih5r] {
    text-align: center;
}

.bid-offer-cell[b-9txr8gih5r] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 3px;
    white-space: nowrap;
}

.separator[b-9txr8gih5r] {
    color: #666;
    font-size: 0.9em;
}

.copy-col[b-9txr8gih5r] {
    width: 2rem;
    text-align: center;
    padding: 0 4px;
}

.copy-btn[b-9txr8gih5r] {
    cursor: pointer;
    opacity: 0.4;
    display: inline-flex;
    align-items: center;
}

.copy-btn:hover[b-9txr8gih5r] {
    opacity: 1;
}

.localtooltip[b-9txr8gih5r] {
    position: relative;
    cursor: pointer;
}

.localtooltip .tooltiptext[b-9txr8gih5r] {
    visibility: hidden;
    background-color: #000061;
    color: white;
    text-align: left;
    border-radius: 6px;
    padding: 5px;
    position: absolute;
    left: 6em;
    z-index: 1;
    opacity: 0;
    transition: opacity 5s;
}

.localtooltip:hover .tooltiptext[b-9txr8gih5r] {
    visibility: visible;
    transition: .25s all ease;
    transition-delay: 1.5s;
    opacity: 1;
}

.enterPrices[b-9txr8gih5r]  .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    min-width: 4rem;
    max-width: 6rem;
}

.enterPrices[b-9txr8gih5r]  .staleprice {
    background-color: LightYellow;
}

.prev-price[b-9txr8gih5r] {
    font-size: 0.72em;
    color: #aaa;
    text-align: right;
    white-space: nowrap;
}

.volume-row[b-9txr8gih5r] {
    background-color: #f5f5f5;
}

.price-row[b-9txr8gih5r] {
    border-top: 1px solid #d0d8e0;
}

tr.row-alt[b-9txr8gih5r] {
    background-color: #eef4f9;
}

tr.volume-row.row-alt[b-9txr8gih5r] {
    background-color: #e5edf5;
}

.volume-row-collapsed td[b-9txr8gih5r] {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 1;
}

.vol-ref[b-9txr8gih5r] {
    font-size: 0.72em;
    color: #7a9eb5;
    text-align: right;
    white-space: nowrap;
    font-style: italic;
}

.vol-label[b-9txr8gih5r] {
    font-size: 0.75em;
    color: #666;
    font-style: italic;
}

[b-9txr8gih5r] .vol-input {
    text-align: right;
    font-size: 13px;
    min-width: 4rem;
    max-width: 6rem;
    color: #444;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
}

[b-9txr8gih5r] .units-input {
    text-align: left;
    font-size: 13px;
    min-width: 2.5rem;
    max-width: 4rem;
    color: #444;
    background-color: #f5f5f5;
    border: 1px solid #ddd;
}
/* /Components/Common/Report/ReportEodSpotPrices_Plus.razor.rz.scp.css */
@media only screen and (max-width: 700px) {

    .not-on-mobile[b-9xdmijek9x] {
        display: none;
    }
}
/* /Components/Common/SavedSettings/SavedSettingsList.razor.rz.scp.css */
/* ====================================================
   Slender saved-settings list
   ==================================================== */

.saved-settings-wrap[b-kgk3ayjswz] {
    font-size: 0.85rem;
}

/* ---------- Toolbar (save row) ---------- */
.saved-settings-toolbar[b-kgk3ayjswz] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}

.saved-settings-name[b-kgk3ayjswz] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 4px 8px;
    border: 1px solid #B5CBD6;
    border-radius: 3px;
    font-size: 0.85rem;
}

.saved-settings-btn-save[b-kgk3ayjswz] {
    flex: 0 0 auto;
    background-color: #163E9F;
    color: white;
    border: none;
    padding: 4px 16px;
    border-radius: 3px;
    font-size: 0.85rem;
    cursor: pointer;
    min-width: 5rem;
}

.saved-settings-btn-save:hover:not(:disabled)[b-kgk3ayjswz] {
    background-color: #009DC9;
}

.saved-settings-btn-save:disabled[b-kgk3ayjswz] {
    background-color: #B5CBD6;
    cursor: not-allowed;
}

.saved-settings-btn-save.replace[b-kgk3ayjswz] {
    background-color: #FF670F;
}

.saved-settings-btn-save.replace:hover:not(:disabled)[b-kgk3ayjswz] {
    background-color: #DB303A;
}

/* ---------- Sort + filter row ---------- */
.saved-settings-controls[b-kgk3ayjswz] {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 4px;
}

.saved-settings-sort-label[b-kgk3ayjswz] {
    color: #405864;
    margin-right: 2px;
    font-size: 0.8rem;
}

.saved-settings-pill[b-kgk3ayjswz] {
    background-color: white;
    color: #163E9F;
    border: 1px solid #B5CBD6;
    padding: 1px 8px;
    border-radius: 12px;
    font-size: 0.75rem;
    cursor: pointer;
}

.saved-settings-pill.active[b-kgk3ayjswz] {
    background-color: #163E9F;
    color: white;
    border-color: #163E9F;
}

.saved-settings-filter[b-kgk3ayjswz] {
    flex: 1 1 auto;
    min-width: 0;
    padding: 3px 6px;
    border: 1px solid #B5CBD6;
    border-radius: 3px;
    font-size: 0.8rem;
    margin-left: 6px;
}

/* ---------- List ---------- */
.saved-settings-list[b-kgk3ayjswz] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid #B5CBD6;
    border-radius: 3px;
    background-color: white;
}

/* Group header rows */
.saved-settings-group-header[b-kgk3ayjswz] {
    background-color: #E9EFF9;
    color: #163E9F;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 2px 8px;
    border-bottom: 1px solid #B5CBD6;
    border-top: 1px solid #B5CBD6;
}

.saved-settings-group-header:first-child[b-kgk3ayjswz] {
    border-top: none;
}

.saved-settings-row[b-kgk3ayjswz] {
    display: flex;
    align-items: stretch;
    border-bottom: 1px solid #E9EFF9;
    min-height: 22px;
}

.saved-settings-row:last-child[b-kgk3ayjswz] {
    border-bottom: none;
}

.saved-settings-row:hover[b-kgk3ayjswz] {
    background-color: #F5F7FA;
}

.saved-settings-load[b-kgk3ayjswz] {
    flex: 1 1 auto;
    background: none;
    border: none;
    text-align: left;
    padding: 2px 8px;
    cursor: pointer;
    color: #163E9F;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 0.85rem;
    min-width: 0;
}

.saved-settings-load:hover[b-kgk3ayjswz] {
    text-decoration: underline;
}

.saved-settings-row-name[b-kgk3ayjswz] {
    flex: 1 1 auto;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.saved-settings-row-date[b-kgk3ayjswz] {
    flex: 0 0 auto;
    color: #808896;
    font-size: 0.72rem;
    font-weight: normal;
    white-space: nowrap;
}

.saved-settings-delete[b-kgk3ayjswz] {
    background: none;
    border: none;
    color: #DB303A;
    padding: 0 10px;
    cursor: pointer;
    font-weight: 700;
    font-size: 0.85rem;
}

.saved-settings-delete:hover[b-kgk3ayjswz] {
    background-color: #DB303A;
    color: white;
}

.saved-settings-row-confirm[b-kgk3ayjswz] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 8px;
    width: 100%;
    background-color: #FFEBEE;
    color: #DB303A;
    font-size: 0.8rem;
}

.saved-settings-confirm-yes[b-kgk3ayjswz] {
    background-color: #DB303A;
    color: white;
    border: none;
    padding: 1px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.8rem;
}

.saved-settings-confirm-no[b-kgk3ayjswz] {
    background-color: white;
    color: #405864;
    border: 1px solid #B5CBD6;
    padding: 1px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.8rem;
}

.saved-settings-empty[b-kgk3ayjswz] {
    color: #808896;
    font-size: 0.85rem;
    margin: 6px 0;
    font-style: italic;
}

/* ---------- Modal ---------- */
.saved-settings-modal-backdrop[b-kgk3ayjswz] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.45);
    z-index: 1040;
}

.saved-settings-modal[b-kgk3ayjswz] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    border-radius: 6px;
    width: min(520px, 92vw);
    z-index: 1050;
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
}

.saved-settings-modal-header[b-kgk3ayjswz] {
    background-color: #163E9F;
    color: white;
    padding: 8px 14px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
}

.saved-settings-modal-close[b-kgk3ayjswz] {
    background: none;
    border: none;
    color: white;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

.saved-settings-modal-body[b-kgk3ayjswz] {
    padding: 12px 16px;
    max-height: 70vh;
    overflow-y: auto;
}

.saved-settings-modal-help[b-kgk3ayjswz] {
    margin: 0 0 10px 0;
    color: #405864;
    font-size: 0.85rem;
}

.saved-settings-modal-date-block[b-kgk3ayjswz] {
    border: 1px solid #B5CBD6;
    border-radius: 4px;
    padding: 6px 10px 8px 10px;
    margin-bottom: 10px;
}

.saved-settings-modal-date-block legend[b-kgk3ayjswz] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #163E9F;
    padding: 0 4px;
    width: auto;
}

.saved-settings-modal-radio-row[b-kgk3ayjswz] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    margin: 3px 0;
    flex-wrap: wrap;
}

.saved-settings-modal-radio-row input[type="radio"][b-kgk3ayjswz] {
    margin-right: 4px;
}

.saved-settings-modal-num[b-kgk3ayjswz] {
    width: 4rem;
    padding: 2px 4px;
    border: 1px solid #B5CBD6;
    border-radius: 3px;
    text-align: right;
}

.saved-settings-modal-period[b-kgk3ayjswz] {
    padding: 2px 4px;
    border: 1px solid #B5CBD6;
    border-radius: 3px;
}

.saved-settings-modal-footer[b-kgk3ayjswz] {
    padding: 8px 14px;
    border-top: 1px solid #E9EFF9;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.saved-settings-btn-cancel[b-kgk3ayjswz] {
    background-color: white;
    color: #405864;
    border: 1px solid #B5CBD6;
    padding: 4px 14px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.85rem;
}

.saved-settings-btn-confirm[b-kgk3ayjswz] {
    background-color: #163E9F;
    color: white;
    border: none;
    padding: 4px 14px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 0.85rem;
}

.saved-settings-btn-confirm:hover[b-kgk3ayjswz] {
    background-color: #009DC9;
}
/* /Components/Common/SsyAutoComplete.razor.rz.scp.css */
.ssy-autocomplete[b-0266la8d2r] {
    position: relative;
    width: 100%;
}

.ssy-autocomplete .ssy-autocomplete-input[b-0266la8d2r] {
    padding-right: 2.75rem;
}

.ssy-autocomplete > .ssy-autocomplete-clear-btn[b-0266la8d2r] {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateX(-5%) translateY(-50%);
    background-color: unset;
    z-index: 10;
    border: none;
    display: none;
}

.ssy-autocomplete > .ssy-autocomplete-clear-btn:hover[b-0266la8d2r] {
    color: #DB303A;
}

.ssy-autocomplete:hover .ssy-autocomplete-clear-btn[b-0266la8d2r] {
    display: inline-block;
}


.ssy-autocomplete > .ssy-autocomplete-dropdown[b-0266la8d2r] {
    position: absolute;
    z-index: 10;
    inset: 0 auto auto 0;
    margin: 0;
    transform: translate(0px, 51px);
    list-style: none;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 0.5rem;
    max-height: 200px;
    overflow-y: auto;
    width: 100%;
    display: none;
}

.ssy-autocomplete:hover > .ssy-autocomplete-dropdown[b-0266la8d2r],
.ssy-autocomplete:focus > .ssy-autocomplete-dropdown[b-0266la8d2r] {
    display: block;
}

.ssy-autocomplete > .ssy-autocomplete-dropdown li:not(.ssy-autocomplete-non-clickable):hover[b-0266la8d2r] {
    cursor: pointer;
    color: #212529;
    background-color: #f8f9fa;
}
/* /Components/Common/SsyBlobStorageUpdate.razor.rz.scp.css */
.blobupload-customhover[b-szp1erpvdt] {
    border: 1px solid #000097;
    border-radius: 4px;
}


.blobupload-container[b-szp1erpvdt] {
    max-width: 700px; /* Adjust based on preference */
    margin: auto;
    padding: 20px;
    background-color: #f4f4f4; /* Light grey background */
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Soft shadow for depth */
}



/*.fileupload-container .loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 50px;
    width: 100%;
    height: 100%;
    background-color: #405864;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    background-image: url('./assets/loadin.gif');
    background-repeat: no-repeat;
    background-position: center;*/ /* Center the image */
    /*background-size: 20%;*/ /* Make the image slightly smaller */
    /*opacity: 0.9;*/ /* Make slightly opaque */
/*}*/

/*.fileupload-container .loading-overlay::after {
    content: "Loading";
    position: absolute;
    top: calc(50% + 100px);*/ /* Adjust this value to position the text below the logo */
    /*color: white;
    font-size: 1.5em;
    text-align: center;
}*/

/*.fileupload-container ::deep .btn.btn-primary {
    display: inline-flex;
    column-gap: 5px;
    align-items: center;
}

.fileupload-container ::deep .quickgrid{
    width: 100%;
}
.fileupload-container ::deep .quickgrid td {
    padding: 5px 15px;*/ /* Adjust as needed */
    /*text-align: center;
}*/
/*thead should be sticky*/
/*.fileupload-container ::deep .quickgrid thead {
    position: sticky;
    top: 0;
    background-color: #fff;
    text-align: center;
    width: 100%;
    z-index: 1;
}

.fileupload-container ::deep .quickgrid thead .col-title {
    justify-content: center;   
}

.fileupload-container ::deep .quickgrid thead .col-title:has(.sort-indicator){
    justify-content: left;
}

.fileupload-container ::deep .quickgrid tr:nth-child(even):has(td > *) {
    background-color: #f2f2f2;*/ /* This is a light grey color */
/*}

.fileupload-container ::deep .quickgrid .name-column {
    width: 350px;
    text-overflow: ellipsis;
}

.fileupload-container ::deep .quickgrid .date-column {
    width: 100px;
}

.fileupload-container ::deep .quickgrid .int-ext-column {
    width: 50px;
}

.fileupload-container ::deep .quickgrid .search-box {
    margin: 5px;
    z-index: 1;
    position: relative;
}

.fileupload-container .roles-container {
    border: 1px solid black; 
    margin: 10px; 
    border-radius: 10px; 
    background-color: #f2f2f2;
    display: flex;
    flex-direction: row;
    padding: 0.5rem;
}

@media (max-width: 1300px) {
    .fileupload-container h1 > span.hide-mobile{
        display: none;
    }

    .fileupload-container ::deep .quickgrid .hide-mobile {
        display: none;
    }
    .fileupload-container .roles-container {
        flex-direction: column;
    }
}

::deep .font-weight-bold {
    font-weight: bold;
}*/


[b-szp1erpvdt] .edit-form-label {
    display: block; /* Ensure labels are block level for consistent alignment */
    margin-bottom: 5px; /* Space between label and input */
    color: #333; /* Dark grey color for text */
    font-weight: bold;
}

[b-szp1erpvdt] .edit-form-input, [b-szp1erpvdt] .edit-form-select {
    width: 100%; /* Full width inputs */
    padding: 8px;
    margin-bottom: 20px; /* Space between form fields */
    border: 1px solid #ccc; /* Light grey border */
    border-radius: 4px; /* Slightly rounded corners */
}

[b-szp1erpvdt] .edit-form-button:hover {
    background-color: #0056b3; /* Darker blue on hover */
}

[b-szp1erpvdt] .upload-modal-container {
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

[b-szp1erpvdt] .upload-modal-header {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 10px;
    text-align: center;
}

[b-szp1erpvdt] .upload-modal-body {
    padding: 10px;
}

[b-szp1erpvdt] .upload-modal-select {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

[b-szp1erpvdt] .upload-modal-input {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

[b-szp1erpvdt] .upload-modal-footer {
    text-align: center;
    margin-top: 20px;
}



[b-szp1erpvdt] .validation-summary {
    color: red;
    list-style-type: none;
    padding: 0;
}

/* reset disabled styling cause ugly */
[b-szp1erpvdt] .form-control:disabled, .form-control[readonly][b-szp1erpvdt] {
    color: #212529;
    background-color: #e9ecef;
}

/* email modal */
[b-szp1erpvdt] .role-select-btn:hover {
    font-weight: bold;
}
[b-szp1erpvdt] .role-select-btn.add:hover {
    background-color: #8CD47E;
    font-weight: normal;
}
[b-szp1erpvdt] .role-select-btn.remove:hover {
    background-color: #FF6961;
    font-weight: normal;
}
[b-szp1erpvdt] .selected-role {
    font-weight: bold;
    text-decoration: underline;
}
/* /Components/Common/SSYFTS.razor.rz.scp.css */
/* DESKTOP SEARCH */
/* ================ */
.search-bar-container[b-vedyjdpubc]  .input-group{
    margin: 0;
}
/* search bar input */
.search-bar-container[b-vedyjdpubc]  .input-group > .search-bar.form-control {
    padding: 0.4rem;
    padding-right: 1.5rem !important;
    font-size: 0.9rem;
    line-height: 1.1;
    border-radius: 0.3rem;
    border-color: transparent;
    background-color: white;
    color: black;
}

.search-bar-container[b-vedyjdpubc]  .input-group > .search-bar.form-control::placeholder {
    color: #999999;
}

.search-bar-container[b-vedyjdpubc]  .input-group > .search-bar.form-control:focus{
    color: black;
    background-color: white;
    
}
.search-bar-container[b-vedyjdpubc]  .input-group > .search-bar.form-control:focus-visible {
    outline: black auto 1px;
}
/* cancel button */
.search-bar-container[b-vedyjdpubc]  .input-group > button.btn {
    padding: 0.2rem;
    font-size: 0.8rem;
    background: transparent;
    color: #000061 !important;
    right: 0.3rem !important;
}

/* dropdown list */
.search-bar-container[b-vedyjdpubc]  .input-group > ul.dropdown-menu.autocomplete-list {
    width: 195%;
    transform: translate(-25%,2.8rem) !important;
    scrollbar-gutter: stable both-edges;
    scrollbar-width: thin;
    scrollbar-color: #000061 transparent;
    inset: inherit !important;
}

/* MOBILE SEARCH */
/* ================ */
.mobile-menu-search.search-container[b-vedyjdpubc] {
    width: 100%;
    height: 48px;
}
/* search bar input */
.mobile-menu-search .search-bar-container[b-vedyjdpubc]  .input-group > .search-bar.form-control {
    width: 100%;
    height: 48px;
    line-height: 1.1;
    border-radius: 0 !important;
    border: none;
    border-color: transparent;
    background-color: #B5CBD6;
    color: #000061;
    font-size: 1.05rem;
    padding: 0.4rem 0.8rem;
    padding-right: 2rem;
    box-sizing: border-box;
}

.mobile-menu-search .search-bar-container[b-vedyjdpubc]  .input-group > .search-bar.form-control::placeholder {
    color: #000061;
}

.mobile-menu-search .search-bar-container[b-vedyjdpubc]  .input-group > .search-bar.form-control:focus{
    background-color: #B5CBD6;
    color: #000061;
    border: none;
    box-shadow: none;
}
/* cancel button */
.mobile-menu-search .search-bar-container[b-vedyjdpubc]  .input-group > button.btn {
    padding: 0.2rem;
    font-size: 1.05rem;
    background: transparent;
    color: #000061 !important;
    right: 1rem !important;
    top: 12px !important;
}
/* dropdown list */
.mobile-menu-search .search-bar-container[b-vedyjdpubc]  .input-group > ul.dropdown-menu.autocomplete-list {
    width: 98%;
    transform: translate(0,3.7rem) !important;
    inset: inherit !important;
    scrollbar-width: auto;
}
/* /Components/Common/SsyRichText_Adv.razor.rz.scp.css */
.ssy-rich-text-adv-container[b-0hb8e4nhjx] {
    height: 100%;
    width: 100%;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ql-container {
    height: calc(100% - 42px); /* 100% - height of 'ql-toolbar' */
    font-family: Verdana, Arial, sans-serif !important;
    font-size: 15px !important;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ssy-rich-text-adv-character-count {
    padding: 4px 8px;
    font-size: 0.85em;
    color: #666;
    text-align: right;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ssy-rich-text-adv-character-count.over-limit {
    color: #dc3545;
    font-weight: bold;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .elementToFadeOutAndIn {
    -webkit-animation: fade-in-out 2s linear forwards;
    animation: fade-in-out-b-0hb8e4nhjx 2s linear forwards;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  aia {
     background-color: #AAFF00;
 }

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  aix {
    background-color: #FFD025;
    text-decoration: line-through;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ql-toolbar.ql-snow .ql-formats {
    margin-right: 8px;
}

@-webkit-keyframes fade-in-out {
    0%, 100% {
        opacity: 1;
    }

    10% {
        opacity: 0;
    }
}

@keyframes fade-in-out-b-0hb8e4nhjx {
    0%, 100% {
        opacity: 1;
    }

    10% {
        opacity: 0;
    }
}

@media only screen and (max-width: 1000px) {
    .ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ql-container {
        height: calc(100% - 64px); /* 100% - height of 'ql-toolbar' */
    }
}

@media only screen and (max-width: 600px) {
    .ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ql-container {
        height: calc(100% - 84px); /* 100% - height of 'ql-toolbar' */
    }
}

@media only screen and (max-width: 488px) {
    .ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ql-container {
        height: calc(100% - 120px); /* 100% - height of 'ql-toolbar' */
    }
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ssy-ai-compliance-form {
    margin: 0;
    padding: 0;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ssy-ai-compliance-card {
    background: #f8fafc;
    border-radius: 8px;
    padding: 24px 20px 20px 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    max-width: 480px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ssy-ai-compliance-text {
    font-size: 1.1rem;
    margin-bottom: 12px;
    text-align: center;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ssy-ai-compliance-fineprint {
    color: #888;
    font-size: 0.92rem;
    margin-bottom: 20px;
    text-align: center;
}

.ssy-rich-text-adv-container[b-0hb8e4nhjx]  .ssy-ai-compliance-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    width: 100%;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.grid-main[b-zmueg8uke2] {
    display: grid;
    grid-template-columns: auto;
}

    .grid-main.grid-main-landing[b-zmueg8uke2] {
        grid-template-columns: 1fr 5fr;
    }

        .grid-main.grid-main-landing[b-zmueg8uke2]  nav.sidebar-desktop {
            margin-top: 50px;
            position: static;
        }

    .grid-main .body-main[b-zmueg8uke2] {
        margin-top: 51px;
        margin-left: 10px;
        padding: 0 1rem;
        overflow-y: auto;
        height: calc(100vh - 51px);
    }

    .grid-main.grid-main-landing .body-main[b-zmueg8uke2] {
        margin-top: 50px;
        margin-left: 0;
        padding: 0;
        height: calc(100vh - 50px);
        border-left: 3px solid #000061;
    }

#blazor-error-ui[b-zmueg8uke2] {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-zmueg8uke2] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }


@media (max-width: 950px) {
    .grid-main[b-zmueg8uke2],
    .grid-main.grid-main-landing[b-zmueg8uke2] {
        grid-template-columns: auto;
    }

        .grid-main .body-main[b-zmueg8uke2] {
            margin-left: 2px;
            padding: 0;
        }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.ssy-navbar-container[b-ezkrucvdjd]{
    /*background: linear-gradient(to right, #003F9A, #1544A3,#0092D1,#0092D1);*/
    background: #000061;
    color: white;
    position: fixed;
    z-index: 5;
    top: 0;
    height: 50px;
    width: 100vw;
    display: flex;
    justify-content: space-between;
    padding: 0 15px;
}

/* ssy-navbar-title */
.ssy-navbar-title[b-ezkrucvdjd] {
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 100%;
}
.ssy-navbar-title .ssy-nav-Logo[b-ezkrucvdjd] {
    background-image: url('./assets/Logo/SSYLogo_1Line_White_M.png');
    background-repeat: no-repeat;
    width: 80px;
    height: 30px;
    background-size: contain;
    background-position: center;
    background-color: transparent;
    border: none;
    cursor: pointer;
    display: block;
    text-decoration: none;
    color: white;
    /*check aspect ratio*/
}
.ssy-navbar-title .ssy-nav-Logo:not(.no-wave-animation):hover[b-ezkrucvdjd] {
    animation: nav-ssyLogo-colorWave-b-ezkrucvdjd 6s ease-in-out infinite alternate;
}

.ssy-navbar-title .navigator-text[b-ezkrucvdjd]{
    font-size: 2.3rem;
    font-family: 'Soehne Breit', cursive;
    /*  wider spacing*/
    letter-spacing: 0.15em;
    color: white;
    font-weight: 400;
    text-decoration: none;
    margin-bottom: 0;
    margin-left: 5px;
    position: relative;
}

    .ssy-navbar-title .navigator-text:hover[b-ezkrucvdjd] {
        animation: nav-ssyLogo-colorWave-b-ezkrucvdjd 6s ease-in-out infinite alternate;
    }

.ssy-navbar-title .navigator-text .navigator-text-half[b-ezkrucvdjd]{
    display: none;
}
.ssy-navbar-title .navigator-text .navigator-text-full[b-ezkrucvdjd]{
    display: block;
}

.navigator-notice-text-full[b-ezkrucvdjd] {
    display: block;
}

.demo-environment-text[b-ezkrucvdjd] {
    background-color: red;
    border-radius: 5px;
    cursor: default;
    align-self: start;
    margin-top: 1.5%;
}

.ssy-navbar-title .navigator-environment[b-ezkrucvdjd]{
    margin: 0;
    align-self: start;
    display: flex;
    flex-direction: column;
}

.ssy-navbar-title .navigator-environment  > span[b-ezkrucvdjd]{
    line-height: 1;
    font-weight: bold;
    color: #24DEBD;
}

.ssy-navbar-title .navigator-environment  > span:last-child[b-ezkrucvdjd]{
    color: #00E2FD;
}


/* Always show by default */
.ssy-navbar-desktop[b-ezkrucvdjd] {
    display: flex !important;
}

/* Hide below 1000px */
/* Hide desktop navbar below 950px */
@media (max-width: 950px) {
    .ssy-navbar-desktop[b-ezkrucvdjd] {
        display: none !important;
    }
}

/* Hamburger button visibility */
@media (min-width: 951px) {
    .ssy-navbar-mobile[b-ezkrucvdjd] {
        display: none !important;
    }
}

@media (max-width: 950px) {
    .ssy-navbar-mobile[b-ezkrucvdjd] {
        display: inline-block !important;
    }
}

@media only screen and (max-width: 1570px) {
    .ssy-navbar-title .navigator-text[b-ezkrucvdjd] {
        font-size: 1.3rem;
        margin-left: -10px;
        margin-top: 5px;
        display: block;
    }
    .ssy-navbar-title .navigator-text .navigator-text-half[b-ezkrucvdjd]{
        display: block;
    }
    .ssy-navbar-title .navigator-text .navigator-text-full[b-ezkrucvdjd]{
        display: none;
    }
    .navigator-notice-text-full[b-ezkrucvdjd]{
        display: none;
    }
}

/* ssy-navbar */
.ssy-navbar[b-ezkrucvdjd]{
    display: inline-flex;
    align-items: center;
}

/* mobile - animated hamburger / X */
.ssy-navbar .ssy-navbar-mobile[b-ezkrucvdjd] {
    border: 0;
    background: transparent;
    color: white;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 150ms ease;
    -webkit-tap-highlight-color: transparent;
}
.ssy-navbar .ssy-navbar-mobile:hover[b-ezkrucvdjd],
.ssy-navbar .ssy-navbar-mobile:focus-visible[b-ezkrucvdjd] {
    background-color: rgba(255,255,255,0.08);
    outline: none;
}
.ssy-navbar .ssy-navbar-mobile.is-open[b-ezkrucvdjd] {
    background-color: rgba(0,226,253,0.12);
}

.ssy-navbar .ssy-navbar-mobile .hamburger-bars[b-ezkrucvdjd] {
    position: relative;
    width: 22px;
    height: 16px;
    display: inline-block;
}
.ssy-navbar .ssy-navbar-mobile .hamburger-bars > span[b-ezkrucvdjd] {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: #fff;
    border-radius: 2px;
    transition: transform 220ms cubic-bezier(.2,.8,.2,1),
                top 220ms cubic-bezier(.2,.8,.2,1) 100ms,
                opacity 120ms ease 100ms,
                background-color 200ms ease;
}
.ssy-navbar .ssy-navbar-mobile .hamburger-bars > span:nth-child(1)[b-ezkrucvdjd] { top: 0; }
.ssy-navbar .ssy-navbar-mobile .hamburger-bars > span:nth-child(2)[b-ezkrucvdjd] { top: 7px; }
.ssy-navbar .ssy-navbar-mobile .hamburger-bars > span:nth-child(3)[b-ezkrucvdjd] { top: 14px; }

/* Open state - morph to X */
.ssy-navbar .ssy-navbar-mobile.is-open .hamburger-bars > span[b-ezkrucvdjd] {
    transition: top 220ms cubic-bezier(.2,.8,.2,1),
                transform 220ms cubic-bezier(.2,.8,.2,1) 100ms,
                opacity 120ms ease,
                background-color 200ms ease;
    background-color: #00E2FD;
}
.ssy-navbar .ssy-navbar-mobile.is-open .hamburger-bars > span:nth-child(1)[b-ezkrucvdjd] {
    top: 7px;
    transform: rotate(45deg);
}
.ssy-navbar .ssy-navbar-mobile.is-open .hamburger-bars > span:nth-child(2)[b-ezkrucvdjd] {
    opacity: 0;
}
.ssy-navbar .ssy-navbar-mobile.is-open .hamburger-bars > span:nth-child(3)[b-ezkrucvdjd] {
    top: 7px;
    transform: rotate(-45deg);
}

@media (prefers-reduced-motion: reduce) {
    .ssy-navbar .ssy-navbar-mobile .hamburger-bars > span[b-ezkrucvdjd] {
        transition: none;
    }
}

/* desktop */
.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]{
    align-items: center;
    flex-direction: row;
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
    font-family: 'Soehne Breit', 'Franklin Gothic Book', 'Arial Narrow', Arial, sans-serif;
    font-size: 1rem;
}

@media (max-width: 1650px) {
    .ssy-navbar-desktop[b-ezkrucvdjd] {
        font-size: 9pt !important;
    }
}

@media (max-width: 1200px) {
    .ssy-navbar-desktop[b-ezkrucvdjd] {
        font-size: 8.5pt !important;
    }
}

@media (max-width: 1050px) {
    .navigator-text-half[b-ezkrucvdjd] {
        font-size: 8pt !important;
    }

    .navigator-environment[b-ezkrucvdjd] {
        display: none !important;
    }
}


/* Nav Items */
/* Deep needed here as Nav-link is a different component */
.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link{
    padding: 0.5rem;
    color: white;
    text-decoration: none;
    border: 0;
    border-bottom: 1px solid transparent;
    background: transparent;
    display: block;
}

.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link[data-ssy-disabled="true"] {
    pointer-events: none;
    color: #B5CBD6;
}

.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link.ssy-nav-link-icon {
    width: 2.5rem;
}

.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link.ssy-nav-link-icon {
    display: flex;
    justify-content: center;
    align-items: center;
}

.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link:not(.ssy-nav-link-fts).ssy-nav-link-active,
.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link:not(.ssy-nav-link-fts):focus,
.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link:not(.ssy-nav-link-fts):active,
.ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .ssy-nav-link:not(.ssy-nav-link-fts):hover {
    border-bottom: 1px solid white;
}

/* FTS */
@media (max-width: 1350px) {
    /* Hide desktop search bar */
    .ssy-navbar .ssy-navbar-desktop[b-ezkrucvdjd]  .search-container {
        display: none;
    }
    .ssy-navbar .ssy-navbar-desktop .nav-divider[b-ezkrucvdjd] {
        display: none;
    }
}


/* ANIMATIONS */
@keyframes nav-ssyLogo-colorWave-b-ezkrucvdjd {
    /* https://meyerweb.com/eric/tools/color-blend/#FFFFFF:000061:4:hex */
    0% {
        filter: invert(0);
    }

    50% {
        filter: invert(20%) ;
    }

    100% {
        filter: invert(0);
    }
}


/* ANIMATIONS */
@keyframes nav-ssyLogo-colorWave_old-b-ezkrucvdjd {
    /* https://meyerweb.com/eric/tools/color-blend/#FFFFFF:000061:4:hex */
    0% {
        /* #FFFFFF */
        filter: invert(1);
    }

    10% {
        /* #CCCCDF */
        filter: invert(95%) sepia(4%) saturate(3190%) hue-rotate(188deg) brightness(94%) contrast(85%);
    }

    20% {
        /* #9999C0 */
        filter: invert(72%) sepia(13%) saturate(648%) hue-rotate(202deg) brightness(84%) contrast(88%);
    }

    30% {
        /* #6666A0 */
        filter: invert(41%) sepia(7%) saturate(2740%) hue-rotate(202deg) brightness(96%) contrast(86%);
    }

    40% {
        /* #333381 */
        filter: invert(24%) sepia(9%) saturate(3982%) hue-rotate(202deg) brightness(96%) contrast(105%);
    }

    50% {
        /* #000061 */
        filter: invert(12%) sepia(77%) saturate(3396%) hue-rotate(235deg) brightness(67%) contrast(127%);
    }

    60% {
        /* #333381 */
        filter: invert(24%) sepia(9%) saturate(3982%) hue-rotate(202deg) brightness(96%) contrast(105%);
    }

    70% {
        /* #6666A0 */
        filter: invert(41%) sepia(7%) saturate(2740%) hue-rotate(202deg) brightness(96%) contrast(86%);
    }

    80% {
        /* #9999C0 */
        filter: invert(72%) sepia(13%) saturate(648%) hue-rotate(202deg) brightness(84%) contrast(88%);
    }

    90% {
        /* #CCCCDF */
        filter: invert(95%) sepia(4%) saturate(3190%) hue-rotate(188deg) brightness(94%) contrast(85%);
    }

    100% {
        /* #FFFFFF */
        filter: invert(1);
    }
}


@keyframes pulse-b-ezkrucvdjd {
    0% {
        opacity: 1;
    }
    25% {
        opacity: 0.5;
    }
    50% {
        opacity: 1;
        color: red;
        background-color: white;
        border-radius: 8px;
    }
    75% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

@keyframes pulse-small-text-b-ezkrucvdjd {
    0% {
        opacity: 1;
    }
    25% {
        opacity: 0.5;
    }
    50% {
        opacity: 1;
        color: red;
    }
    75% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

.navigator-text.pulse[b-ezkrucvdjd]
{
    animation: pulse-b-ezkrucvdjd 3s infinite;
}
.navigator-notice-text-full[b-ezkrucvdjd]{
    animation: pulse-small-text-b-ezkrucvdjd 3s infinite;
}
/* /Components/Layout/NavSidebarDesktop.razor.rz.scp.css */
/* CONTAINER */
nav.sidebar-desktop[b-v4oekr77js] {
    position: fixed;
    top: 50px;
    height: calc(100vh - 50px);
    max-width: 350px;
    display: none;
    flex-direction: row;
    z-index: 950;
}

nav.sidebar-desktop-landing[b-v4oekr77js]{
    height: calc(100vh - 50px);
    max-width: 350px;
    display: flex;
    flex-direction: row;
    margin-top: 50px;
}

@media (max-width: 950px) {
    nav.sidebar-desktop[b-v4oekr77js],
    nav.sidebar-desktop-landing[b-v4oekr77js] {
        display: none !important;
    }
}

.sidebar-menu[b-v4oekr77js] {
    background-color: #fdfdfd;
    height: calc(100vh - 50px);
}

.collapsed-menu[b-v4oekr77js] {
    width: 0;
    visibility: hidden;
    transition: visibility 50ms linear 75ms, width 250ms linear 50ms ; /* Add transition for smooth movement */
}

.expanded-menu[b-v4oekr77js] {
    width: 350px;
    position: relative;
    visibility: inherit;
    overflow-y: auto;
    padding-right: 0.25rem;
    /*hide the scrollbar*/
    scrollbar-width: thin;
    /*colour the scrollbar - works for everything but safari */
    scrollbar-color: #000061 transparent;
    /* ensure the space stays the same regardless if the scrollbar is needed*/
    scrollbar-gutter: stable;
    transition: visibility 50ms linear 225ms, width 250ms linear 50ms ; /* Add transition for smooth movement */
    padding-bottom: 1.5rem;
}

.sidebar-desktop-landing .expanded-menu[b-v4oekr77js] {
    width: 325px;
}

/* Apply custom scrollbar styles only in Safari for .expanded-menu */
@media not all and (min-resolution: 0.001dpcm) and (-webkit-min-device-pixel-ratio: 0) {
    .expanded-menu[b-v4oekr77js]::-webkit-scrollbar-track {
        background: transparent; /* The transparent background for the scrollbar track */
    }

    .expanded-menu[b-v4oekr77js]::-webkit-scrollbar-thumb {
        background-color: #000061; /* The dark blue color for the scrollbar thumb */
        border-radius: 4px; /* Rounds the edges of the scrollbar thumb */
        border: 2px solid transparent; /* Adds spacing around the thumb */
    }
}

/* title */
/* make the title line underneath line up with carousel*/
.sidebar-menu #sidebar-navigation[b-v4oekr77js] {
    position: sticky;
    top: 0;
    z-index: 2;
    text-decoration: none;
    align-content: start;
    width: 100%;
    display: inline-block;
    background: white;
    border-bottom: 1px solid #B5CBD6;
    margin: 0;
    padding-top: 5px;
    padding-left: 7px;
    padding-bottom: calc(4px + 0.25rem);
}

.sidebar-menu #sidebar-navigation a[b-v4oekr77js] {
    width: 100%;
    color: #000061;
    text-decoration: none;
}

/* list styling */
.sidebar-menu ul[b-v4oekr77js] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidebar-menu[b-v4oekr77js]  ul {
    list-style: none;
    margin-bottom: 0.5rem;
}

.sidebar-menu[b-v4oekr77js]  ul > li.nav-item-header-container,
.sidebar-menu[b-v4oekr77js]  ul.sidebar-desktop-child {
    padding-left: 0;
}

.sidebar-menu[b-v4oekr77js]  ul.sidebar-desktop-child li:not(.nav-item-header-container):not(.sidebar-desktop-child-icon-collapse-container):not(.sidebar-desktop-child-icon-collapse) {
    padding-left: 2rem;
}

.sidebar-menu[b-v4oekr77js]  li.sidebar-desktop-child-icon-collapse-container > ul {
    padding-left: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 2rem auto;
}

.sidebar-menu[b-v4oekr77js]  li.sidebar-desktop-child-icon-collapse-container li.sidebar-desktop-child-icon-collapse.collapse-main {
    order: 0;
}
.sidebar-menu[b-v4oekr77js]  li.sidebar-desktop-child-icon-collapse-container li.sidebar-desktop-child-icon-collapse.collapse-main {
    order: 1;
}

/* headers */
.sidebar-menu[b-v4oekr77js]  .nav-item-header{
    color: #163E9F;
    background: transparent;
    border: 0;
    border-top: 1px solid #B5CBD6;
    
    width: 100%;
    height: 2rem;
    padding: 0.2rem 0 0.2rem 1rem;
    display: inline-block;
    position: relative;

    font-family: "Soehne", sans-serif;
    font-size: 1em;
    font-weight: bold;
    text-decoration: none;
    text-align: left;
}

.sidebar-menu[b-v4oekr77js]  > .sidebar-desktop-child > .nav-item-header-container:first-child .nav-item-header{
    /* remove border for first item, border on the title */
    border-top: none;
}

.sidebar-menu[b-v4oekr77js]  .nav-item-header-closed::after,
.sidebar-menu[b-v4oekr77js]  .nav-item-header-open::after{
    position: absolute;
    right: 0;
    color: #163E9F50;
    margin-right: 1rem;
}

.sidebar-menu[b-v4oekr77js]  .nav-item-header-closed::after{
    content: "▽";

}

.sidebar-menu[b-v4oekr77js]  .nav-item-header-open::after {
    content: "△";
}

/* only display list section if there is children */
.sidebar-menu[b-v4oekr77js]  li.nav-item-header-container:has(button:not(.nav-item-header-closed)){
    display: none;
}

.sidebar-menu[b-v4oekr77js]  li.nav-item-header-container:has(li:not(.nav-item-header-container)){
    display: block;
}

/* child links */
.sidebar-menu[b-v4oekr77js]  a.ssy-nav-link {
    color: #3C4142;
    font-weight: normal;
    border: 1px solid transparent;
    /*width: calc(100% - 1.5rem);*/
    text-decoration: none;
    display: grid;
    grid-template-columns: auto 3rem;
}
.sidebar-menu[b-v4oekr77js]  li.sidebar-desktop-child-icon-collapse.collapse-icon {
    display: flex;
    justify-content: center;
    align-items: center;
}
.sidebar-menu[b-v4oekr77js]  li.sidebar-desktop-child-icon-collapse.collapse-icon > a.ssy-nav-link {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 1.2rem;
    max-height: 100%;
}
.sidebar-menu[b-v4oekr77js]  a.ssy-nav-link svg {
    display: none;
}

.sidebar-menu[b-v4oekr77js]  a.ssy-nav-link:hover,
.sidebar-menu[b-v4oekr77js]  a.ssy-nav-link:focus{
    color: #000061;
    background-color: #f0eeeb;
    text-decoration: none;
    border-radius: 4px;
    border: 1px solid #f0eeeb;
}

.sidebar-menu[b-v4oekr77js]  li.sidebar-desktop-child-icon-collapse-container:hover a.ssy-nav-link svg,
.sidebar-menu[b-v4oekr77js]  li:not(.sidebar-desktop-child-icon-collapse-container) a.ssy-nav-link:hover svg,
.sidebar-menu[b-v4oekr77js]  li.sidebar-desktop-child-icon-collapse-container:focus a.ssy-nav-link svg,
.sidebar-menu[b-v4oekr77js]  li:not(.sidebar-desktop-child-icon-collapse-container) a.ssy-nav-link:focus svg {
    display: block;
}

.sidebar-menu[b-v4oekr77js]  .ssy-nav-link:active,
.sidebar-menu[b-v4oekr77js]  .ssy-nav-link-active{
    color: #000061;
    border-radius: 4px;
    border: 1px solid #b5cbd6;
    text-decoration: none;
    padding-left: 2px;
    margin-right: 2px;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.05) inset, 0px 0px 8px rgba(82, 168, 236, 0.6);
    background: #E9EFF9;
}

.sidebar-menu[b-v4oekr77js]  .ssy-nav-link:active svg,
.sidebar-menu[b-v4oekr77js]  .ssy-nav-link-active svg {
    display: block;
    padding-right: 2px;
}

.sidebar-menu[b-v4oekr77js]  .ssy-nav-link[data-ssy-disabled="true"] {
    pointer-events: none;
    color: #B5CBD6;
}

/* Collapse Button Styling */
.nav-collapse-bar[b-v4oekr77js] {
    background-color: #000061;
    border: 0;
    width: 20px;
    height: calc(100vh - 50px);
    border-right: 3px solid white;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-collapse-bar-expanded[b-v4oekr77js] {
    background-color: transparent;
    color: white;
    border-left: 3px solid #000061;
    border-right: 0;
    width:3px;
}

.nav-collapse-bar-expanded .semi-circle[b-v4oekr77js] {
    height: 6rem;
    background-color: #000061;
    color: white;
    padding: 0 2px 0 2px;
    border-radius: 0 15px 15px 0;
    border: 1px solid transparent;
}

.nav-collapse-bar-expanded .semi-circle:hover[b-v4oekr77js],
.nav-collapse-bar-expanded .semi-circle:focus[b-v4oekr77js]{
    background-color: white;
    color: #000061;
    border: 1px solid #000061;
}
/* /Components/Layout/NavSidebarMobile.razor.rz.scp.css */
/* =============================================================
   Mobile menu - slide-in drawer from the left
   Brand palette: navy #000061 surface, cyan #00E2FD accent
   Visible only at <= 992px; hidden on desktop.
   ============================================================= */

.mobile-menu-root[b-w4vf4isk7f] { display: none; }

@media (max-width: 992px) {

    /* Layer container - sits below the fixed top navbar (50px).
       pointer-events:none so the closed (off-screen) drawer never
       blocks clicks on the page beneath. Children re-enable as needed. */
    .mobile-menu-root[b-w4vf4isk7f] {
        display: block;
        position: fixed;
        top: 50px;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1040;
        pointer-events: none;
    }

    /* Backdrop - dim + blur the page behind the drawer */
    .mobile-menu-backdrop[b-w4vf4isk7f] {
        position: absolute;
        inset: 0;
        background: rgba(0, 0, 16, 0.55);
        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);
        opacity: 0;
        transition: opacity 200ms ease-out;
        pointer-events: none;
    }
    .mobile-menu-root.is-open .mobile-menu-backdrop[b-w4vf4isk7f] {
        opacity: 1;
        pointer-events: auto;
    }

    /* Drawer - slides in from the left.
       Uses transform (compositor-only) for a smooth animation.
       Hamburger button stays in the top-right of the navbar. */
    .mobile-menu-drawer[b-w4vf4isk7f] {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        width: min(340px, 88vw);
        background: #000061;
        color: #fff;
        box-shadow: 8px 0 24px rgba(0, 0, 16, 0.35);
        transform: translateX(-100%);
        transition: transform 220ms cubic-bezier(.2, .8, .2, 1);
        display: flex;
        flex-direction: column;
        pointer-events: auto;
        overflow: hidden;
    }
    .mobile-menu-root.is-open .mobile-menu-drawer[b-w4vf4isk7f] {
        transform: translateX(0);
    }

    @media (prefers-reduced-motion: reduce) {
        .mobile-menu-backdrop[b-w4vf4isk7f],
        .mobile-menu-drawer[b-w4vf4isk7f] {
            transition: none;
        }
    }

    /* ---------- Header: notification button + search ---------- */
    .mobile-menu-drawer .mobile-menu-header[b-w4vf4isk7f] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.75rem 0.875rem;
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        flex-shrink: 0;
    }
    .mobile-menu-drawer .mobile-menu-icon-btn[b-w4vf4isk7f] {
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        padding: 0;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.08);
        border: 1px solid rgba(255, 255, 255, 0.1);
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        transition: background-color 120ms ease, border-color 120ms ease;
    }
    .mobile-menu-drawer .mobile-menu-icon-btn:hover[b-w4vf4isk7f],
    .mobile-menu-drawer .mobile-menu-icon-btn:focus-visible[b-w4vf4isk7f] {
        background-color: rgba(0, 226, 253, 0.14);
        border-color: rgba(0, 226, 253, 0.4);
        outline: none;
    }

    /* Search input restyled to match the dark surface */
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-search {
        flex: 1;
        min-width: 0;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-search .form-control,
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-search input {
        background: rgba(255, 255, 255, 0.08);
        border: 1px solid rgba(255, 255, 255, 0.12);
        color: #fff;
        border-radius: 10px;
        height: 40px;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-search input::placeholder,
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-search .form-control::placeholder {
        color: rgba(255, 255, 255, 0.55);
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-search .form-control:focus,
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-search input:focus {
        border-color: #00E2FD;
        box-shadow: 0 0 0 3px rgba(0, 226, 253, 0.18);
        background: rgba(255, 255, 255, 0.1);
    }

    /* ---------- Body: scrollable accordion ---------- */
    .mobile-menu-drawer .mobile-menu-body[b-w4vf4isk7f] {
        flex: 1;
        min-height: 0;
        overflow-y: auto;
        overscroll-behavior: contain;
        padding: 0.25rem 0 1rem;
    }
    .mobile-menu-drawer .mobile-menu-body[b-w4vf4isk7f]::-webkit-scrollbar { width: 4px; }
    .mobile-menu-drawer .mobile-menu-body[b-w4vf4isk7f]::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.18);
        border-radius: 4px;
    }

    /* ---------- Accordion: override Bootstrap defaults ---------- */
    .mobile-menu-drawer[b-w4vf4isk7f]  ul.accordion,
    .mobile-menu-drawer[b-w4vf4isk7f]  ul.accordion-collapse {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item {
        background: transparent;
        border: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item:last-child { border-bottom: 0; }

    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-button {
        background: transparent !important;
        color: #fff !important;
        font-size: 0.95rem;
        font-weight: 500;
        letter-spacing: 0.02em;
        padding: 0.875rem 1rem;
        min-height: 48px;
        border: 0 !important;
        box-shadow: none !important;
        text-align: left;
        width: 100%;
        transition: background-color 120ms ease, color 150ms ease;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-button:hover {
        background-color: rgba(255, 255, 255, 0.05) !important;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-button:not(.collapsed) {
        color: #00E2FD !important;
        background-color: rgba(0, 226, 253, 0.06) !important;
    }

    /* ---------- Level 1 (top-level) sections - extra visual weight
       so the user can clearly see where one section ends and the next
       begins, especially when one is expanded. ---------- */

    /* Heavier dividers between top-level items */
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-accordion > .accordion-item {
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-accordion > .accordion-item:last-child {
        border-bottom: 0;
    }

    /* Bolder, slightly larger, uppercase top-level button text */
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-accordion > .accordion-item > .accordion-header > .accordion-button,
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-accordion > .accordion-item.accordion-item-child > .nav-link {
        font-size: 0.78rem;
        font-weight: 600;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        padding: 1rem 1rem;
        min-height: 52px;
    }

    /* Expanded top-level section: tint the whole block (header + panel)
       with a subtle "card" background so children read as grouped under
       their parent, and the next collapsed section visibly starts after. */
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-accordion > .accordion-item:has(> .accordion-header > .accordion-button:not(.collapsed)) {
        background-color: rgba(255, 255, 255, 0.04);
        border-top: 1px solid rgba(0, 226, 253, 0.25);
        border-bottom: 1px solid rgba(0, 226, 253, 0.25);
    }
    /* Slim accent strip down the left edge of the expanded section */
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-accordion > .accordion-item:has(> .accordion-header > .accordion-button:not(.collapsed)) > .accordion-header {
        box-shadow: inset 3px 0 0 0 #00E2FD;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .mobile-menu-accordion > .accordion-item:has(> .accordion-header > .accordion-button:not(.collapsed)) > .accordion-collapse {
        box-shadow: inset 3px 0 0 0 rgba(0, 226, 253, 0.45);
    }

    /* CSS-drawn chevron, replacing Bootstrap's SVG */
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-button::after {
        background-image: none !important;
        width: 10px;
        height: 10px;
        border-right: 2px solid rgba(255, 255, 255, 0.6);
        border-bottom: 2px solid rgba(255, 255, 255, 0.6);
        transform: rotate(-45deg);
        transition: transform 200ms ease, border-color 200ms ease;
        margin-top: -2px;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-button:not(.collapsed)::after {
        transform: rotate(45deg);
        margin-top: -4px;
        border-color: #00E2FD;
    }

    /* Top-level leaf items (no children, level 1) - styled to match the
       expanding top-level buttons (uppercase, bolder, smaller caps). */
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item-child.accordion-item-level1 a {
        display: block;
        padding: 1rem 1rem;
        min-height: 52px;
        font-size: 0.78rem;
        font-weight: 600;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #fff;
        text-decoration: none;
        border-radius: 0;
        transition: background-color 120ms ease, color 150ms ease;
    }
    /* Inner span has class .accordion-button which would otherwise override font-size/weight */
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item-child.accordion-item-level1 a .accordion-button {
        padding: 0;
        min-height: 0;
        font-size: inherit;
        font-weight: inherit;
        letter-spacing: inherit;
        text-transform: inherit;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item-child.accordion-item-level1 a:hover {
        background-color: rgba(255, 255, 255, 0.05);
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item-child.accordion-item-level1 a.ssy-nav-link-active {
        background-color: rgba(0, 226, 253, 0.12);
        color: #00E2FD;
    }

    /* Nested accordion - thin left rail instead of nested boxes */
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-collapse .accordion {
        margin: 0 0 0.25rem 1rem;
        padding-left: 0.625rem;
        border-left: 1px solid rgba(255, 255, 255, 0.1);
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-body {
        padding: 0.125rem 0.5rem 0.5rem 1rem;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-collapse .accordion-item {
        border-bottom: 0;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-collapse .accordion-button {
        padding: 0.625rem 0.75rem;
        min-height: 40px;
        font-weight: 400;
        font-size: 0.9rem;
    }

    /* Nav links inside accordion bodies */
    .mobile-menu-drawer[b-w4vf4isk7f]  a.nav-link,
    .mobile-menu-drawer[b-w4vf4isk7f]  a.ssy-nav-link {
        display: block;
        color: rgba(255, 255, 255, 0.85);
        text-decoration: none;
        padding: 0.625rem 0.875rem;
        border-radius: 8px;
        font-size: 0.9rem;
        min-height: 40px;
        line-height: 1.3;
        transition: background-color 120ms ease, color 120ms ease;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  a.nav-link:hover,
    .mobile-menu-drawer[b-w4vf4isk7f]  a.ssy-nav-link:hover {
        background-color: rgba(255, 255, 255, 0.06);
        color: #fff;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  a.ssy-nav-link.ssy-nav-link-active {
        background-color: rgba(0, 226, 253, 0.12);
        color: #00E2FD;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  a.ssy-nav-link[data-ssy-disabled="true"] {
        pointer-events: none;
        color: rgba(255, 255, 255, 0.35);
    }

    /* Hide accordion items that have no permissioned children (preserved
       from the previous implementation - it stops empty sections from
       cluttering the menu for users without those roles). */
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item:not(.accordion-item-child) {
        display: none;
    }
    .mobile-menu-drawer[b-w4vf4isk7f]  .accordion-item:not(.accordion-item-child):has(a.nav-link) {
        display: list-item;
    }
}
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-5idsysqoo6],
.components-reconnect-repeated-attempt-visible[b-5idsysqoo6],
.components-reconnect-failed-visible[b-5idsysqoo6],
.components-pause-visible[b-5idsysqoo6],
.components-resume-failed-visible[b-5idsysqoo6],
.components-rejoining-animation[b-5idsysqoo6] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-retrying[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-failed[b-5idsysqoo6],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-5idsysqoo6] {
    display: block;
}


#components-reconnect-modal[b-5idsysqoo6] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-5idsysqoo6 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-5idsysqoo6 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-5idsysqoo6 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-5idsysqoo6]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-5idsysqoo6 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-5idsysqoo6 {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-5idsysqoo6 {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-5idsysqoo6 {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-5idsysqoo6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-5idsysqoo6] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-5idsysqoo6] {
    color: #FFFFFF;
    background-color: #000061;
    border: 1px solid #000061;
    padding: 4px 24px;
    border-radius: 4px;
}

#components-reconnect-modal button:hover[b-5idsysqoo6], 
#components-reconnect-modal button:active[b-5idsysqoo6] {
    color: #000061;
    background-color: #FFFFFF;
    border: 1px solid #000061;
}

.components-rejoining-animation[b-5idsysqoo6] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-5idsysqoo6] {
        position: absolute;
        border: 3px solid #00E2FD;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-5idsysqoo6 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-5idsysqoo6] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-5idsysqoo6 {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Pages/ApiDocs/ApiDocsExamples.razor.rz.scp.css */
h4[b-wz26t6ibod] {
    font-size: 1.3em;
}

.api-container[b-wz26t6ibod] {
    margin-left: 1rem;
    margin-right: 1rem;
}

.api-container[b-wz26t6ibod]  .code-block {
    background: #E9EFF9;
    border: 1px solid #9FB3BC;
    border-radius: 10px;
    margin: 1rem 0 1.5rem;
    overflow: hidden;
    box-shadow: 0 14px 28px rgba(231 , 238 , 242, 0.15);
}

.api-container[b-wz26t6ibod]  .code-block__header {
    align-items: center;
    background: #DAE5EB;
    border-bottom: 1px solid #9FB3BC;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.85rem 1rem;
}

.api-container[b-wz26t6ibod]  .code-block__title {
    color: #000000;
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}

.api-container[b-wz26t6ibod]  .code-block__copy {
    border-radius: 6px;
    flex-shrink: 0;
}

.api-container[b-wz26t6ibod]  .code-block__surface {
    color: #000000;
    font-family: Consolas, 'Courier New', monospace;
    font-size: 13px;
    line-height: 1.6;
    margin: 0;
    overflow: auto;
    padding: 1rem 1.1rem 1.2rem;
}

.api-container[b-wz26t6ibod]  .code-block__surface code {
    display: block;
    white-space: pre;
}

.api-container[b-wz26t6ibod]  .token-keyword {
    color: #0000ff;
}

.api-container[b-wz26t6ibod]  .token-string {
    color: #A31515;
}

.api-container[b-wz26t6ibod]  .token-comment {
    color: #008000;
}

.api-container[b-wz26t6ibod]  .token-punctuation {
    color: #95a8bd;
}

.api-container[b-wz26t6ibod]  .token-function {
    color: #CF8B05;
}

@media (max-width: 640px) {
    .api-container[b-wz26t6ibod]  .code-block__header {
        align-items: stretch;
        flex-direction: column;
    }

    .api-container[b-wz26t6ibod]  .code-block__copy {
        width: 100%;
    }
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-wz26t6ibod] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/ApiDocsLandingPage.razor.rz.scp.css */
.code[b-g6kks53atw] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-g6kks53atw] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-g6kks53atw] {
    color: #405864;
}

.property[b-g6kks53atw] {
    color: #01A39E;
}

.value[b-g6kks53atw] {
    color: #163E9F;
}
.api-container[b-g6kks53atw] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-g6kks53atw] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Bulkers/DryBulkRates.razor.rz.scp.css */
.code[b-qsebi2awcg] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-qsebi2awcg] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-qsebi2awcg] {
    color: #405864;
}

.property[b-qsebi2awcg] {
    color: #01A39E;
}

.value[b-qsebi2awcg] {
    color: #163E9F;
}

.api-container[b-qsebi2awcg] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-qsebi2awcg] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Futures/FuturesCommentary.razor.rz.scp.css */
.code[b-7n1bt3oko2] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-7n1bt3oko2] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-7n1bt3oko2] {
    color: #405864;
}

.property[b-7n1bt3oko2] {
    color: #01A39E;
}

.value[b-7n1bt3oko2] {
    color: #163E9F;
}

.api-container[b-7n1bt3oko2] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-7n1bt3oko2] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Futures/FuturesFfaIntraday.razor.rz.scp.css */
.code[b-37g97ssyy9] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-37g97ssyy9] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-37g97ssyy9] {
    color: #405864;
}

.property[b-37g97ssyy9] {
    color: #01A39E;
}

.value[b-37g97ssyy9] {
    color: #163E9F;
}

.api-container[b-37g97ssyy9] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-37g97ssyy9] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Futures/FuturesFfaTradeSummary.razor.rz.scp.css */
.code[b-2lvhhikjk7] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-2lvhhikjk7] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-2lvhhikjk7] {
    color: #405864;
}

.property[b-2lvhhikjk7] {
    color: #01A39E;
}

.value[b-2lvhhikjk7] {
    color: #163E9F;
}

.api-container[b-2lvhhikjk7] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-2lvhhikjk7] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Futures/FuturesPricesFwdEod.razor.rz.scp.css */
.code[b-x9m3ll87pv] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-x9m3ll87pv] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-x9m3ll87pv] {
    color: #405864;
}

.property[b-x9m3ll87pv] {
    color: #01A39E;
}

.value[b-x9m3ll87pv] {
    color: #163E9F;
}

.api-container[b-x9m3ll87pv] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-x9m3ll87pv] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Futures/FuturesTradeSummary.razor.rz.scp.css */
.code[b-xp2vwzvtn2] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-xp2vwzvtn2] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-xp2vwzvtn2] {
    color: #405864;
}

.property[b-xp2vwzvtn2] {
    color: #01A39E;
}

.value[b-xp2vwzvtn2] {
    color: #163E9F;
}

.api-container[b-xp2vwzvtn2] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-xp2vwzvtn2] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Gas/GasRates.razor.rz.scp.css */
.code[b-2emnu8saco] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-2emnu8saco] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-2emnu8saco] {
    color: #405864;
}

.property[b-2emnu8saco] {
    color: #01A39E;
}

.value[b-2emnu8saco] {
    color: #163E9F;
}

.api-container[b-2emnu8saco] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-2emnu8saco] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/SNP/SNPRates.razor.rz.scp.css */
.code[b-8f8504dwbw] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-8f8504dwbw] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-8f8504dwbw] {
    color: #405864;
}

.property[b-8f8504dwbw] {
    color: #01A39E;
}

.value[b-8f8504dwbw] {
    color: #163E9F;
}

.api-container[b-8f8504dwbw] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-8f8504dwbw] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/ApiDocs/Tankers/TankerRates.razor.rz.scp.css */
.code[b-t2oikwd0f5] {
    background-color: #E9EFF9;
    padding: 1rem 2.5rem 1rem 1rem;
    margin-bottom: 1rem;
    height: calc(100% - 4rem);
}

code[b-t2oikwd0f5] {
    border: 1px solid transparent;
    margin: 1rem 0 2rem;
    color: #FFFFFF;
}

.punctuation[b-t2oikwd0f5] {
    color: #405864;
}

.property[b-t2oikwd0f5] {
    color: #01A39E;
}

.value[b-t2oikwd0f5] {
    color: #163E9F;
}

.api-container[b-t2oikwd0f5] {
    margin-left: 1rem;
    margin-right: 1rem;
}

/*Visible at lg*/
@media (min-width: 950px) {
    .api-container[b-t2oikwd0f5] {
        width: 75%;
        max-width: 1100px;
    }
}
/* /Components/Pages/Bulkers/ApiSetup/DryBulkRatesSetup.razor.rz.scp.css */
.drybulkextractbox[b-zn8luqwzb6] {
    border: 1px solid #009DC9;
    height: 85vh;
    overflow-y: scroll;
}

.drybulkextractdatepicker[b-zn8luqwzb6] {
}

.drybulkextractroutepicker[b-zn8luqwzb6] {
    display: grid;
    grid-template-columns: 100px auto;
    gap: 10px;
}

.drybulkextractroutepicker-ul[b-zn8luqwzb6] {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.drybulkextractroutepicker-ul .chkbox[b-zn8luqwzb6] {
    margin: 0 3px 0 0;
    vertical-align: middle;
}


.drybulkextractroutepicker-ul li[b-zn8luqwzb6] {
    text-decoration: none;
}

.drybulkextractroutepicker-ul li:hover[b-zn8luqwzb6] {
    background-color: #B5CBD6;
}


.deleterow[b-zn8luqwzb6], .editapiclient[b-zn8luqwzb6] {
    cursor: pointer;
    padding-right: 3px;
}

.deleterow:hover[b-zn8luqwzb6] {
    font-weight: 700;
    color: white;
}

.draggablerow[b-zn8luqwzb6] {
    cursor: pointer;
}

.editapiclient[b-zn8luqwzb6] {
    color: #163E9F;
}


.editapiclient:hover[b-zn8luqwzb6] {
    font-weight: 700;
    color: #91A527;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_000_ParentPage.razor.rz.scp.css */
.pmxlist-admin-wrap[b-owwu5id9w9] {
    margin-top: 1rem;
}

.pmxlist-admin-panel[b-owwu5id9w9] {
    width: min(100%, 100rem);
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
    border: 1px solid #e0e6eb;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_050_HomePage.razor.rz.scp.css */
.pmx-home-stat-card[b-zo3w12ct4e] {
    border: 1px solid #e0e6eb;
}

.pmx-home-stat-title[b-zo3w12ct4e] {
    font-weight: 400;
    color: var(--ssy-colour-main-deep-blue, #163E9F);
}

.pmx-home-wip[b-zo3w12ct4e] {
    min-height: 130px;
}

.pmx-home-wip__stamp[b-zo3w12ct4e] {
    font-size: 3rem;
    opacity: 0.25;
    pointer-events: none;
    letter-spacing: 0.2em;
}

.pmx-home-wip__actions[b-zo3w12ct4e] {
    gap: 1rem;
}

.pmx-home-panel[b-zo3w12ct4e] {
    min-height: 100%;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_100_CargoTonnageList.razor.rz.scp.css */
/* Mobile Responsiveness */
@media (max-width: 768px) {
    .pmx-search-input[b-jhptvkw622] {
        width: 100% !important;
        max-width: none;
    }

    .pmx-legend[b-jhptvkw622] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .pmx-copy-text[b-jhptvkw622] {
        font-size: 1rem;
        margin-left: 0;
        margin-right: 0;
    }

    .sticky-header[b-jhptvkw622] {
        padding: 0.5rem;
    }

    .pmx-title[b-jhptvkw622] {
        font-size: 1.25rem;
        margin-bottom: 0.5rem;
    }

    /* Stack filter controls vertically on mobile */
    .pmx-filters-row .row > .col-md-7[b-jhptvkw622],
    .pmx-filters-row .row > .col-md-5[b-jhptvkw622] {
        margin-bottom: 0.5rem;
    }

    .pmx-filters-row .row > .col-md-7 .row[b-jhptvkw622] {
        flex-direction: column;
        align-items: stretch !important;
    }

    .pmx-filters-row .row > .col-md-7 .col-auto[b-jhptvkw622] {
        margin-bottom: 0.5rem;
    }

    /* Make buttons larger for touch */
    .btn[b-jhptvkw622] {
        min-height: 44px;
        min-width: 44px;
    }

    .btn-sm[b-jhptvkw622] {
        min-height: 36px;
        min-width: 36px;
    }

    /* Improve checkbox labels for touch */
    .ssy-checkbox-slider[b-jhptvkw622] {
        transform: scale(1.2);
        margin-right: 0.5rem;
    }

    /* Stack action buttons vertically */
    .pmx-filters-row .row > .col-md-5 .row[b-jhptvkw622] {
        flex-direction: column;
        align-items: stretch;
    }

    .pmx-filters-row .row > .col-md-5 .col-auto[b-jhptvkw622] {
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .pmx-filters-row .row > .col-md-5 .col-auto button[b-jhptvkw622] {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .pmx-title[b-jhptvkw622] {
        font-size: 1.1rem;
    }

    .pmx-title-legend[b-jhptvkw622] {
        font-size: 0.9rem;
    }

    .sticky-header[b-jhptvkw622] {
        padding: 0.25rem;
    }

    /* Hide less critical elements on very small screens */
    .pmx-legend span:not(:first-child)[b-jhptvkw622] {
        display: none;
    }

    .pmx-legend span:first-child[b-jhptvkw622]::after {
        content: " • *Refreshed Today • *On Subs";
        color: inherit;
    }
}

/* Table responsiveness */
@media (max-width: 768px) {
    .main-table[b-jhptvkw622] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .ssy-table-lw[b-jhptvkw622] {
        min-width: 1200px; /* Ensure table maintains its width for scrolling */
        font-size: 0.875rem;
    }

    .ssy-table-lw th[b-jhptvkw622],
    .ssy-table-lw td[b-jhptvkw622] {
        padding: 0.5rem 0.25rem;
        white-space: nowrap;
    }

    /* Make checkboxes larger for touch */
    .ssy-table-lw input[type="checkbox"][b-jhptvkw622] {
        transform: scale(1.2);
        margin: 0;
    }
}

/* Touch-friendly interactions */
@media (hover: none) and (pointer: coarse) {
    .btn[b-jhptvkw622] {
        min-height: 48px;
        min-width: 48px;
    }

    .dropdown-item[b-jhptvkw622] {
        min-height: 44px;
        padding: 0.75rem 1rem;
    }

    .form-control[b-jhptvkw622] {
        min-height: 44px;
        font-size: 1rem;
    }
}

/* Mobile Action Bar */
.mobile-action-bar[b-jhptvkw622] {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-radius: 50px;
    padding: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.mobile-action-buttons[b-jhptvkw622] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.mobile-action-buttons .btn[b-jhptvkw622] {
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
    border: none;
}

.mobile-action-buttons .btn:hover[b-jhptvkw622] {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.mobile-action-buttons .btn:active[b-jhptvkw622] {
    transform: scale(0.95);
}

/* Mobile Table Summary */
@media (max-width: 576px) {
    .mobile-table-summary[b-jhptvkw622] {
        background: #f8f9fa;
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        padding: 12px;
        margin: 8px 0;
        font-size: 0.9rem;
    }

    .mobile-table-summary .summary-header[b-jhptvkw622] {
        font-weight: 600;
        color: #163E9F;
        margin-bottom: 8px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .mobile-table-summary .summary-stats[b-jhptvkw622] {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
    }

    .mobile-table-summary .stat-item[b-jhptvkw622] {
        display: flex;
        flex-direction: column;
        align-items: center;
        min-width: 60px;
    }

    .mobile-table-summary .stat-value[b-jhptvkw622] {
        font-size: 1.1rem;
        font-weight: 700;
        color: #163E9F;
    }

    .mobile-table-summary .stat-label[b-jhptvkw622] {
        font-size: 0.8rem;
        color: #666;
        text-align: center;
    }

    .mobile-table-summary .expand-toggle[b-jhptvkw622] {
        background: none;
        border: 1px solid #163E9F;
        color: #163E9F;
        padding: 4px 8px;
        border-radius: 4px;
        font-size: 0.8rem;
        cursor: pointer;
        transition: all 0.2s;
    }

    .mobile-table-summary .expand-toggle:hover[b-jhptvkw622] {
        background: #163E9F;
        color: white;
    }
}

.pmx-list-table[b-jhptvkw622] {
    display: flex; 
    flex-direction: row;
    margin: 0 1%;
}

.container-relative[b-jhptvkw622] {
    position: relative;
    width: 100%;
}

.lookup-panel[b-jhptvkw622] {
    position: absolute;
    top: 0;
    right: -50%;
    width: 50%;
    height: 100%;
    transition: right 0.4s ease, opacity 0.4s ease;
    z-index: 10;
    background-color: white; /* or whatever suits your theme */
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
}

.lookup-panel.show[b-jhptvkw622] {
    right: 0;
    opacity: 1;
}

.table-wrapper[b-jhptvkw622] {
    transition: margin-right 0.4s ease;
    margin-right: 0;
}

.table-wrapper.shifted[b-jhptvkw622] {
    margin-right: 50%; /* match lookup-panel width */
}

.sticky-header[b-jhptvkw622] {
    position: sticky;
    top: 0;
    z-index: 999;
    background-color: white;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    border-bottom: 1px solid #ddd;
}

.lookup-flex-container[b-jhptvkw622] {
    display: flex;
    width: 100%;
    transition: all 0.3s ease;  
}

.main-table[b-jhptvkw622] {
    transition: all 0.3s ease;
}

.full-width[b-jhptvkw622] {
    width: 100%;
}

.half-width[b-jhptvkw622] {
    width: 40%;
}

.lookup-tab-panel[b-jhptvkw622] {
    width: 100%;
    transition: all 0.3s ease;
    border-left: 2px solid black;
    
}

.pmxlist-title-row[b-jhptvkw622] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 1rem;
}

.pmxlist-title[b-jhptvkw622] {
    margin-bottom: 0.5rem;
    color: var(--ssy-colour-main-deep-blue, #163E9F);
    font-weight: 600;
}

.pmxlist-count[b-jhptvkw622] {
    font-weight: 400;
    color: var(--ssy-colour-palette-slate-gray, #405864);
    font-size: 1rem;
}

.pmxlist-legend[b-jhptvkw622] {
    color: var(--ssy-colour-palette-slate-gray, #405864);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.85rem;
}

.pmxlist-filters-row[b-jhptvkw622] {
    margin-bottom: 0.5rem;
    border-bottom: 1px solid #e0e6eb;
    padding-bottom: 0.5rem;
    gap: 0.25rem;
}

.pmxlist-search-input[b-jhptvkw622] {
    width: 250px;
    height: 1.6rem;
    border-radius: 999px;
    font-size: 0.9rem;
}

:global(.pmxlist-compact-btn)[b-jhptvkw622] {
    padding: 0.15rem 0.65rem;
    border-radius: 999px;
    font-size: 0.9rem;
}

.pmxlist-copy-label[b-jhptvkw622] {
    font-weight: 600;
    font-size: 1.2rem;
    margin: 0 0.5rem 0 0.75rem;
    color: var(--ssy-colour-main-deep-blue, #163E9F);
}

.pmxlist-iphone-textarea[b-jhptvkw622] {
    width: 100%;
    min-height: 20vh;
    border: 1px solid #d9e3ea;
    border-radius: 12px;
    padding: 0.75rem;
    font-size: 0.95rem;
    font-family: inherit;
}

.pmxlist-mainsection[b-jhptvkw622] {
    flex-grow: 1;
    width: 100%;
    height: 100%;
    /*margin: auto;*/
    display: flex;
    flex-direction: column;
}

.pmxlist-header[b-jhptvkw622] {
    width: 100%;
    background-color: #F4F7F9;
    padding: 2px 4px 0 4px;
    box-sizing: border-box;
}

.pmxlist-datasection[b-jhptvkw622] {
    flex: 1;
    display: flex;
    overflow: hidden; /* Prevent parent scroll */
}

.pmxlist-datacolumn[b-jhptvkw622] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 2px;
    box-sizing: border-box;
    border: 1px solid #ddd;
    transition: all 0.3s ease;
}

.pmxlist-singlecolumn[b-jhptvkw622] {
    flex: 1 1 95%;
}
.pmxlist-split-column1[b-jhptvkw622] {
    flex: 0 0 40%;
}
.pmxlist-split-column2[b-jhptvkw622] {
    flex: 0 0 60%;
}










/* container that holds table + lookup */
.pmxlist-datasection.pmxlist-vertical[b-jhptvkw622] {
display: flex;
flex-direction: column;
height: 100vh;          /* or 100% if parent already controls height */
min-height: 0;          /* important so children can scroll */
}

/* when lookup is off, table fills available space */
.pmxlist-datasection.pmxlist-horizontal[b-jhptvkw622] {
/* keep your existing behaviour, or nothing if current CSS already handles it */
}

/* top 1/4 */
.pmxlist-top-panel[b-jhptvkw622] {
flex: 0 0 20%;
min-height: 0;
overflow: auto;         /* table scrolls if content exceeds 25% */
}

/* bottom 3/4 */
.pmxlist-bottom-panel[b-jhptvkw622] {
flex: 1 1 80%;
min-height: 0;
overflow: auto;         /* lookup scrolls if needed */
}

/* when lookup is off */
.pmxlist-full-panel[b-jhptvkw622] {
flex: 1 1 auto;
min-height: 0;
overflow: auto;
}

.pmxlist-datasection.pmxlist-vertical .pmxlist-bottom-panel[b-jhptvkw622] {
border-top: 2px solid #111010; /* adjust colour to match your theme */
}

[b-jhptvkw622] button.pmxlist-compact-dropdown-btn {
    padding: 0.15rem 0.65rem !important;
    border-radius: 999px !important;
    font-size: 0.9rem !important;
    height: auto !important;
}

[b-jhptvkw622] button.pmxlist-compact-dropdown-btn::after {
    margin-left: 0.35rem;
    vertical-align: middle;
}

.pmxlist-copy-stack[b-jhptvkw622] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    align-items: stretch;
}

.pmxlist-filter-stack[b-jhptvkw622] {
    display: grid;
    grid-template-rows: repeat(2, auto);
    grid-auto-flow: column;
    gap: 0.35rem 1rem;
    align-items: center;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_110_Header.razor.rz.scp.css */
.panamaxlist-header-form[b-j79n2cm7qb] {
    position: sticky;
    top: 0;
    width: 100%;
    background-color: #f9f9f9;
    z-index: 2;
    padding-bottom: 1rem;
    border-radius: 16px;
    border: 1px solid #e0e6eb;
}

@media (max-width: 768px) {
    .panamaxlist-header-form[b-j79n2cm7qb] {
        width: 100vw;
        margin-left: -1rem;
        padding: 0 1rem;
    }
}

.pmxlist-header-actions[b-j79n2cm7qb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 0.1rem;
}

.pmxlist-header-actions__filters[b-j79n2cm7qb] {
    display: flex;
    gap: 0.5rem;
}

.pmxlist-header-actions__primary[b-j79n2cm7qb] {
    display: flex;
}

.pmxlist-field-group[b-j79n2cm7qb] {
    min-width: 200px;
}

.pmxlist-muted-text[b-j79n2cm7qb] {
    color: var(--ssy-colour-palette-slate-gray, #405864);
    font-size: 0.9rem;
}

/* Modal overlay styles now in pmxlist-shared.css */

.panamaxlist-header-form label[b-j79n2cm7qb] {
    font-weight: 600;
    font-size: 1rem;
    color: var(--ssy-colour-main-deep-blue, #163E9F);
}

.panamaxlist-header-form textarea[b-j79n2cm7qb] {
    height: 32px;
    resize: vertical;
    overflow: hidden;
}

.form-container[b-j79n2cm7qb] {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: scaleY(0);
    transform-origin: top;
    transition: all 0.3s ease-in-out;
    border: 1px solid #ccd6dd;
    padding: 5px 15px 15px;
    border-radius: 20px;
    background-color: #f9f9f9;
}

.form-container.show[b-j79n2cm7qb] {
    max-height: 2000px;
    opacity: 1;
    transform: scaleY(1);
}


.pmx-duplicate-warning[b-j79n2cm7qb] {
    margin-top: 6px;
    font-size: 0.85rem;
    color: #b45309; /* amber-ish */
    display: flex;
    align-items: center;
    gap: 6px;
}

.pmx-duplicate-warning i[b-j79n2cm7qb] {
    color: #f59e0b;
}

.pmx-duplicate-details[b-j79n2cm7qb] {
    opacity: 0.8;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_120_ListTable.razor.rz.scp.css */
/* Row status styles (.refresh-today, .submit-today, .on-subs, .large-ok-btn) now in pmxlist-shared.css */

.col-checkbox[b-iumv2vqgm8] {
    width: 1%;
    text-align: center;
}

.col-refreshed[b-iumv2vqgm8] {
    width: 3%;
    text-align: center;
}

.col-account[b-iumv2vqgm8] {
    width: 4%;
    text-align: left;
    overflow-wrap: anywhere;
}

.col-size[b-iumv2vqgm8] {
    width: 5%;
}

.col-load[b-iumv2vqgm8] {
    width: 5%;
}

.col-laycan[b-iumv2vqgm8] {
    width: 4%;
}

.col-disch[b-iumv2vqgm8] {
    width: 6%;
}

.col-cargo[b-iumv2vqgm8] {
    width: 4%;
    text-align: left;
}

.col-comments[b-iumv2vqgm8] {
    width: 10%;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.col-spreads[b-iumv2vqgm8] {
    width: 10%;
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.spreads-placeholder-btn[b-iumv2vqgm8] {
    position: absolute;
    top: 4px;
    right: 4px;

    border: 1px solid rgba(0, 0, 0, 0.15);
    background: transparent;
    border-radius: 4px;

    padding: 2px 4px;
    font-size: 0.8rem;
    opacity: 0.7;
}

.col-offmkt[b-iumv2vqgm8] {
    width: 1.5%;
}

.col-broker[b-iumv2vqgm8] {
    width: 3%;
    text-align: left;
}

.col-comms[b-iumv2vqgm8] {
    width: 3%;
}

.col-updated[b-iumv2vqgm8] {
    width: 5.5%;
}

.col-actions[b-iumv2vqgm8] {
    width: 1%;
    text-align: center;
}

.d-none[b-iumv2vqgm8] {
    display: none !important;
}

.selected-lookup-row[b-iumv2vqgm8] {
    background-color: yellow !important; /* light yellow */
    font-weight: bold;
}

.pmxlist-region-row[b-iumv2vqgm8] {
    border-top: 1px solid #E7EEF2;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.5rem 0;
    cursor: default;
}

.pmxlist-region-row--clickable[b-iumv2vqgm8] {
    cursor: pointer;
}

.pmxlist-region-row--empty[b-iumv2vqgm8] {
    opacity: 0.85;
}

.pmxlist-region-toggle[b-iumv2vqgm8],
.pmxlist-region-toggle-placeholder[b-iumv2vqgm8] {
    width: 2.4rem;
    text-align: center;
    font-size: 1.1rem;
    color: var(--ssy-colour-main-bright-blue, #0087CB);
}

.pmxlist-region-title[b-iumv2vqgm8] {
    min-width: 10em;
}

.pmxlist-region-count[b-iumv2vqgm8] {
    font-weight: 500;
    font-size: 1rem;
    color: #000;
}

.pmxlist-region-count--muted[b-iumv2vqgm8] {
    font-weight: 400;
    font-size: 0.85rem;
    color: var(--ssy-colour-palette-slate-gray, #405864);
}

.pmxlist-data-table[b-iumv2vqgm8] {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 11px;
    overflow-wrap: anywhere;
    max-width: 100%;
}

.pmxlist-cell-textarea[b-iumv2vqgm8] {
    min-height: 60px;
}

.pmxlist-pnc-label[b-iumv2vqgm8] {
    color: var(--ssy-colour-palette-crimson-red, #DB303A);
    font-weight: 600;
}

.pmxlist-actions-cell[b-iumv2vqgm8] {
    white-space: nowrap;
    width: 1%;
}

.pmxlist-warning-indicator[b-iumv2vqgm8] {
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pmxlist-warning-icon[b-iumv2vqgm8] {
    cursor: pointer;
    font-size: 1.2rem;
    color: rgb(255, 145, 0);
}

.pmxlist-updated-text[b-iumv2vqgm8] {
    font-size: 10px;
    color: #888;
    text-align: center;
    margin-top: 2px;
}

.bi-check-lg[b-iumv2vqgm8], .bi-files[b-iumv2vqgm8] {
    transition: all 0.3s ease-in-out;
}

.col-bod[b-iumv2vqgm8] {
    width: 10%;
}

.col-pref[b-iumv2vqgm8] {
    width: 8%;
}

.col-vessel[b-iumv2vqgm8] {
    width: 8%;
}

.ssy-table-lw th[b-iumv2vqgm8],
.ssy-table-lw td[b-iumv2vqgm8] {
    border-right: 1px solid #ccc; /* Light grey vertical lines */
}

.ssy-table-lw th:last-child[b-iumv2vqgm8],
.ssy-table-lw td:last-child[b-iumv2vqgm8] {
    border-right: none; /* No border on the very last column */
}

.custom-modal-backdrop[b-iumv2vqgm8] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.custom-modal-content[b-iumv2vqgm8] {
    background-color: white;
    width: 50vw;
    max-height: 80vh;
    overflow-y: auto;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    margin-top: 10vh; /* Adjust this value to lift it up */
}

.custom-modal-header[b-iumv2vqgm8],
.custom-modal-footer[b-iumv2vqgm8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 0.5rem;
}

.custom-modal-body[b-iumv2vqgm8] {
    flex-grow: 1;
    overflow-y: auto;
}

.tight-dropdown .btn[b-iumv2vqgm8],
.tight-dropdown .dropdown-toggle[b-iumv2vqgm8] {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    line-height: 1.2;
}

.tight-dropdown .dropdown-action-button[b-iumv2vqgm8],
.tight-dropdown .dropdown-toggle[b-iumv2vqgm8] {
    padding-left: 2px;
    padding-right: 2px;
    min-width: unset;
}

/* Icon dropdown and animation styles now in pmxlist-shared.css */

/* ============================================
   MOBILE CARD STYLES
   ============================================ */

/* Desktop table - hidden on mobile, shown on md+ */
.pmxlist-desktop-table[b-iumv2vqgm8] {
    display: block !important;
}

@media (max-width: 767.98px) {
    .pmxlist-desktop-table[b-iumv2vqgm8] {
        display: none !important;
    }
}

/* Mobile cards - shown on mobile, hidden on md+ */
.pmxlist-mobile-cards[b-iumv2vqgm8] {
    display: none !important;
}

@media (max-width: 767.98px) {
    .pmxlist-mobile-cards[b-iumv2vqgm8] {
        display: flex !important;
        flex-direction: column;
        gap: 0.75rem;
        padding: 0.5rem;
    }
}

.pmxlist-card[b-iumv2vqgm8] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.pmxlist-card.on-subs[b-iumv2vqgm8] {
    border-left: 4px solid #dc3545;
}

.pmxlist-card.submit-today[b-iumv2vqgm8] {
    border-left: 4px solid rgb(0, 164, 0);
}

.pmxlist-card.on-subs .pmxlist-card-title[b-iumv2vqgm8] {
    color: #dc3545 !important;
}

.pmxlist-card.submit-today .pmxlist-card-title[b-iumv2vqgm8] {
    color: rgb(0, 164, 0) !important;
}

.pmxlist-card.refresh-today[b-iumv2vqgm8] {
    font-weight: bold;
}

.pmxlist-card-header[b-iumv2vqgm8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.pmxlist-card-title[b-iumv2vqgm8] {
    font-size: 1rem;
}

.pmxlist-card-laycan[b-iumv2vqgm8] {
    font-size: 0.8rem;
    color: #fff;
    background: #163E9F;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    white-space: nowrap;
}

.pmxlist-card-body[b-iumv2vqgm8] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.pmxlist-card-row[b-iumv2vqgm8] {
    display: flex;
    font-size: 0.875rem;
    line-height: 1.4;
}

.pmxlist-card-label[b-iumv2vqgm8] {
    font-weight: 500;
    color: #666;
    min-width: 70px;
    flex-shrink: 0;
}

.pmxlist-card-row > span:last-child[b-iumv2vqgm8] {
    color: #333;
    word-break: break-word;
}

.pmxlist-card-footer[b-iumv2vqgm8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #eee;
}

.pmxlist-card-updated[b-iumv2vqgm8] {
    font-size: 0.75rem;
    color: #888;
}

.pmxlist-card-actions[b-iumv2vqgm8] {
    display: flex;
    gap: 0.2rem;
}

.pmxlist-edit-checkboxes-row[b-iumv2vqgm8] {
    display: flex;
    gap: 18px;
    align-items: center;
    flex-wrap: wrap;
}

.pmxlist-edit-checkboxes-row .form-check[b-iumv2vqgm8] {
    display: flex;
    align-items: center;
    gap: 6px;
}






.pmx-status-badge[b-iumv2vqgm8] {
    width: 18px;
    height: 18px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    line-height: 1;
}

.pmx-status-badge--success[b-iumv2vqgm8] {
    background: rgba(25, 135, 84, 0.15); /* bootstrap success tint */
    color: #198754;
}

.pmx-status-badge--muted[b-iumv2vqgm8] {
    background: rgba(108, 117, 125, 0.15); /* bootstrap secondary tint */
    color: #6c757d;
}

/* Spreads Popup formatting */
.spreads-grid[b-iumv2vqgm8] {
    display: grid;
    grid-template-columns: 25% 1fr 70px; /* Rate | Vessel | PnC */
    gap: 0.75rem;
    align-items: center;
}

.spreads-header[b-iumv2vqgm8] {
    font-size: 0.75rem;
    text-transform: uppercase;
    opacity: 0.7;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(0,0,0,0.12);
    margin-bottom: 0.6rem;
}

.spreads-row[b-iumv2vqgm8] {
    padding: 0.35rem 0;
    border-bottom: 1px solid rgba(0,0,0,0.06);
}

.spreads-center[b-iumv2vqgm8] {
    display: flex;
    justify-content: center;
    align-items: center;
}

 
.pmx-floating-menu[b-iumv2vqgm8] {
    max-height: calc(100vh - 16px);
    overflow-y: auto;
    margin: 0;
}

.pmx-floating-menu--above[b-iumv2vqgm8] {
    transform: translateY(-100%);
}

.pmx-floating-menu--left[b-iumv2vqgm8] {
    transform: translateX(-100%);
}

.pmx-floating-menu--above-left[b-iumv2vqgm8] {
    transform: translate(-100%, -100%);
}
/* /Components/Pages/Bulkers/PmxList/PmxList_121_RowSpreads.razor.rz.scp.css */
/* Spreads Popup formatting */
.spreads-grid[b-s2hiq14pqh] {
    display: grid;
    grid-template-columns: 25% 1fr 70px; /* Rate | Vessel | PnC */
    gap: 0.75rem;
    align-items: center;
}

.spreads-header[b-s2hiq14pqh] {
    font-size: 0.75rem;
    text-transform: uppercase;
    opacity: 0.7;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid rgba(0,0,0,0.12);
    margin-bottom: 0.6rem;
}

.spreads-row[b-s2hiq14pqh] {
    padding: 0.35rem 0;
    border-bottom: 1px solid rgba(0,0,0,0.06);
}

.spreads-center[b-s2hiq14pqh] {
    display: flex;
    justify-content: center;
    align-items: center;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_140_VesselDetails.razor.rz.scp.css */
/* VesselDetails-specific icon style - circular red close button */
/* Differs from standard .icon-dropdown-box in pmxlist-shared.css */

.edited-field[b-enyf8pozkz] {
    border-left: 4px solid #ffc107;
    padding-left: 8px;
    background-color: #fffdf5;
}






.tag-container[b-enyf8pozkz] {
    border: 1px solid #ccc;
    border-radius: 6px;
    background-color: #f8f9fa;
    padding: 6px 8px;
}

.tag-table[b-enyf8pozkz] {
    width: 100%;
    border-collapse: collapse;
}

.tag-table thead th[b-enyf8pozkz] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    padding: 6px 4px;
    border-bottom: 1px solid #dee2e6;
}

.tag-table tbody td[b-enyf8pozkz] {
    padding: 8px 4px;
    vertical-align: middle;
}

.tag-table tbody tr:not(:last-child) td[b-enyf8pozkz] {
    border-bottom: 1px solid #e9ecef;
}

.tag-left[b-enyf8pozkz] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.tag-name[b-enyf8pozkz] {
    font-size: 0.95rem;
    font-weight: 600;
}

.tag-text[b-enyf8pozkz] {
    display: flex;
    flex-direction: column;
}

.tag-context[b-enyf8pozkz] {
    font-size: 0.8rem;
    color: #6c757d;
    margin-top: 2px;
}

.tag-updated[b-enyf8pozkz] {
    font-size: 0.8rem;
    color: #6c757d;
    white-space: nowrap;
}

.tag-status[b-enyf8pozkz] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
}

.tag-status.applied[b-enyf8pozkz] {
    background-color: #28a745;
    color: white;
}

.tag-status.not-applied[b-enyf8pozkz] {
    background-color: #dee2e6;
    color: transparent;
}

.tag-editable-row[b-enyf8pozkz] { cursor: pointer; }
.tag-editable-row:hover[b-enyf8pozkz] { background: #f5f7fa; }
/* /Components/Pages/Bulkers/PmxList/PmxList_200_LookupTool.razor.rz.scp.css */
.container-flex[b-gd058adpbe] {
    display: flex;
    gap: 10px;
    margin-top: 20px;
    height: 80vh;
}

.right-box[b-gd058adpbe] {
    flex: 1; /* Takes 50% of the width */
    padding: 20px;
    border: 1px solid #ccc;
    background-color: #f9f9f9;
    display: flex;
    flex-direction: column;
    align-items: stretch; /* Ensures the table takes full width */
    justify-content: flex-start; /* Aligns content to the top */
    overflow-y: auto; /* Enables scrolling for large lists */
}

.left-box[b-gd058adpbe] {
    flex: 1; /* Takes 50% of the width */
    padding: 20px;
    border: 1px solid #ccc;
    background-color: #f9f9f9;
    display: flex;
    flex-direction: column;
    align-items: stretch; /* Ensures the table takes full width */
    justify-content: flex-start; /* Aligns content to the top */
    /* Remove overflow-y and height from here */
}

/* Make only the table wrapper scrollable */
.panamaxlist-table-wrapper[b-gd058adpbe] {
    max-height: 60vh;
    overflow-y: auto;
    margin-bottom: 1rem;
}

.ssy-table-lw .selected-cargo-row[b-gd058adpbe] {
    background-color: yellow; /* Highlight the selected row */
    font-weight: bold;
}

.ssy-table-lw .selected-tonnage-row[b-gd058adpbe] {
    background-color: yellow; /* Highlight the selected row */
    font-weight: bold;
}

.ssy-table-lw .highlighted-row[b-gd058adpbe] {
    background-color: #c3e6cb; /* Slightly darker green */
    border-left: 5px solid #28a745; /* Deeper green accent */
    font-weight: bold;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_210_LookupTab.razor.rz.scp.css */
/* Base .refresh-today style in pmxlist-shared.css */

.ssy-table-lw .submit-today[b-oaspcn9ts0] {
    color: rgb(0, 164, 0); /* Turns Cargo Green if Added Today */
    font-weight: bold;
}

.ssy-table-lw .on-subs[b-oaspcn9ts0] {
    color: rgb(255, 0, 0); /* Turns Cargo Red if On Subs */
    font-weight: bold;
}

.ssy-table-lw .highlighted-row[b-oaspcn9ts0] {
    background-color: #c3e6cb; /* Slightly darker green */
    border-left: 5px solid #28a745; /* Deeper green accent */
}

.ssy-table-lw .within-laycan[b-oaspcn9ts0] {
    background-color: #c3e6cb; /* Slightly darker green */
    border-left: 5px solid #28a745; /* Deeper green accent */
}

.ssy-table-lw .within-laycan.on-subs[b-oaspcn9ts0] {
    background-color: #c3e6cb;
    border-left: 5px solid #28a745;
    color: rgb(255, 0, 0);
    font-weight: bold;
}

.ssy-table-lw .within-laycan.submit-today[b-oaspcn9ts0] {
    background-color: #c3e6cb;
    border-left: 5px solid #28a745;
    color: rgb(0, 164, 0);
    font-weight: bold;
}

.ssy-table-lw .within-laycan.refresh-today[b-oaspcn9ts0] {
    background-color: #c3e6cb;
    border-left: 5px solid #28a745;
    font-weight: bold;
}

.pmxlist-btn-hover:hover[b-oaspcn9ts0] {
    background-color: #163E9F;
    color: white;
    transition: background-color 0.3s ease, color 0.3s ease;
    cursor:pointer;
}

/* ============================================
   MOBILE CARD STYLES
   ============================================ */

/* Mobile cards - shown by default, hidden on md+ */
.lookup-mobile-cards[b-oaspcn9ts0] {
    display: flex !important;
    flex-direction: column;
    gap: 0.75rem;
    padding: 0.5rem;
}

@media (min-width: 768px) {
    .lookup-mobile-cards[b-oaspcn9ts0] {
        display: none !important;
    }
}

/* Desktop table - hidden by default, shown on md+ */
.lookup-desktop-table[b-oaspcn9ts0] {
    display: none !important;
}

@media (min-width: 768px) {
    .lookup-desktop-table[b-oaspcn9ts0] {
        display: table !important;
    }
}

.lookup-card[b-oaspcn9ts0] {
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 0.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.lookup-card.within-laycan[b-oaspcn9ts0] {
    background-color: #c3e6cb;
    border-left: 4px solid #28a745;
}

.lookup-card.on-subs[b-oaspcn9ts0] {
    border-left: 4px solid #dc3545;
}

.lookup-card.on-subs .lookup-card-title[b-oaspcn9ts0] {
    color: #dc3545;
}

.lookup-card.submit-today .lookup-card-title[b-oaspcn9ts0] {
    color: rgb(0, 164, 0);
}

.lookup-card.refresh-today[b-oaspcn9ts0] {
    font-weight: bold;
}

.lookup-card-header[b-oaspcn9ts0] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #eee;
}

.lookup-card-title[b-oaspcn9ts0] {
    font-weight: 600;
    font-size: 1rem;
    color: #000061;
}

.lookup-card-eta[b-oaspcn9ts0] {
    font-size: 0.8rem;
    color: #666;
    background: #f0f0f0;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    white-space: nowrap;
}

.lookup-card.within-laycan .lookup-card-eta[b-oaspcn9ts0] {
    background: #28a745;
    color: #fff;
}

.lookup-card-body[b-oaspcn9ts0] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.lookup-card-row[b-oaspcn9ts0] {
    display: flex;
    font-size: 0.875rem;
    line-height: 1.4;
}

.lookup-card-label[b-oaspcn9ts0] {
    font-weight: 500;
    color: #666;
    min-width: 80px;
    flex-shrink: 0;
}

.lookup-card-row > span:last-child[b-oaspcn9ts0] {
    color: #333;
    word-break: break-word;
}

.tight-dropdown .btn[b-oaspcn9ts0],
.tight-dropdown .dropdown-toggle[b-oaspcn9ts0] {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
    line-height: 1.2;
}

.tight-dropdown .dropdown-action-button[b-oaspcn9ts0],
.tight-dropdown .dropdown-toggle[b-oaspcn9ts0] {
    padding-left: 2px;
    padding-right: 2px;
    min-width: unset;
}



.collapse-arrow[b-oaspcn9ts0] {
    display: inline-block;
    transition: transform 150ms ease-in-out;
}

.collapse-arrow.collapsed[b-oaspcn9ts0] {
    transform: rotate(-180deg);
}



.lookup-title[b-oaspcn9ts0] {
    font-size: 16px;
    font-weight: bold;
    font-family: Georgia, serif;
    color: rgb(0, 0, 97);
}

.filter-panel[b-oaspcn9ts0] {
    display: flex;
    align-items: flex-start;
    background: #fff;
    border: 1px solid #dcdfe4;
    border-radius: 6px;
    padding: 3px 3px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

.filter-left-panel[b-oaspcn9ts0] {
    flex: 0 0 50%;
    min-width: 0;

    display: flex;
    flex-wrap: wrap;          /* <-- key */
    gap: 2px 3px;
    align-items: center;
}

.filter-right-panel[b-oaspcn9ts0] {
    flex: 0 0 50%;
    min-width: 0;

    display: flex;
    flex-wrap: wrap;          /* <-- key */
    gap: 2px 3px;
    align-items: center;
}

.pmxlist-header-actions[b-oaspcn9ts0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
}

.pmxlist-header-actions__filters[b-oaspcn9ts0] {
    display: flex;
    gap: 0.5rem;
}

.pmxlist-warning-indicator[b-oaspcn9ts0] {
    width: 24px;              /* Reserve fixed width */
    display: flex;
    justify-content: center;  /* Center icon horizontally */
    align-items: center;      /* Center vertically */
    flex-shrink: 0;           /* Prevent shrinking */
}

.pmxlist-warning-icon[b-oaspcn9ts0] {
    font-size: 1.1rem;
    color: rgb(255, 0, 0);
    cursor: pointer;
}

.filter-wrap[b-oaspcn9ts0] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 16px;
    align-items: flex-start;
}

.filter-item[b-oaspcn9ts0] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 260px;   /* key bit */
    flex: 0 0 260px;    /* each item takes same width */
}

.filter-item label[b-oaspcn9ts0] {
    margin: 0;
    font-size: 0.85rem;
    line-height: 1.2;
}

.lookup-desktop-table tbody td[b-oaspcn9ts0] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.lookup-desktop-table tbody tr:last-child td[b-oaspcn9ts0] {
    border-bottom: none;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_300_FixturesParent.razor.rz.scp.css */
/* Mobile Responsiveness */
@media (max-width: 768px) {
    .pmx-search-input[b-tez27samgl] {
        width: 100% !important;
        max-width: none;
    }

    .pmx-legend[b-tez27samgl] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .pmx-copy-text[b-tez27samgl] {
        font-size: 1rem;
        margin-left: 0;
        margin-right: 0;
    }

    .sticky-header[b-tez27samgl] {
        padding: 0.5rem;
    }

    .pmx-title[b-tez27samgl] {
        font-size: 1.25rem;
        margin-bottom: 0.5rem;
    }

    /* Stack filter controls vertically on mobile */
    .pmx-filters-row .row > .col-md-7[b-tez27samgl],
    .pmx-filters-row .row > .col-md-5[b-tez27samgl] {
        margin-bottom: 0.5rem;
    }

    .pmx-filters-row .row > .col-md-7 .row[b-tez27samgl] {
        flex-direction: column;
        align-items: stretch !important;
    }

    .pmx-filters-row .row > .col-md-7 .col-auto[b-tez27samgl] {
        margin-bottom: 0.5rem;
    }

    /* Make buttons larger for touch */
    .btn[b-tez27samgl] {
        min-height: 44px;
        min-width: 44px;
    }

    .btn-sm[b-tez27samgl] {
        min-height: 36px;
        min-width: 36px;
    }

    /* Improve checkbox labels for touch */
    .ssy-checkbox-slider[b-tez27samgl] {
        transform: scale(1.2);
        margin-right: 0.5rem;
    }

    /* Stack action buttons vertically */
    .pmx-filters-row .row > .col-md-5 .row[b-tez27samgl] {
        flex-direction: column;
        align-items: stretch;
    }

    .pmx-filters-row .row > .col-md-5 .col-auto[b-tez27samgl] {
        width: 100%;
        margin-bottom: 0.5rem;
    }

    .pmx-filters-row .row > .col-md-5 .col-auto button[b-tez27samgl] {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .pmx-title[b-tez27samgl] {
        font-size: 1.1rem;
    }

    .pmx-title-legend[b-tez27samgl] {
        font-size: 0.9rem;
    }

    .sticky-header[b-tez27samgl] {
        padding: 0.25rem;
    }

    /* Hide less critical elements on very small screens */
    .pmx-legend span:not(:first-child)[b-tez27samgl] {
        display: none;
    }

    .pmx-legend span:first-child[b-tez27samgl]::after {
        content: " • *Refreshed Today • *On Subs";
        color: inherit;
    }
}

/* Table responsiveness */
@media (max-width: 768px) {
    .main-table[b-tez27samgl] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .ssy-table-lw[b-tez27samgl] {
        min-width: 1200px; /* Ensure table maintains its width for scrolling */
        font-size: 0.875rem;
    }

    .ssy-table-lw th[b-tez27samgl],
    .ssy-table-lw td[b-tez27samgl] {
        padding: 0.5rem 0.25rem;
        white-space: nowrap;
    }

    /* Make checkboxes larger for touch */
    .ssy-table-lw input[type="checkbox"][b-tez27samgl] {
        transform: scale(1.2);
        margin: 0;
    }
}

/* Touch-friendly interactions */
@media (hover: none) and (pointer: coarse) {
    .btn[b-tez27samgl] {
        min-height: 48px;
        min-width: 48px;
    }

    .dropdown-item[b-tez27samgl] {
        min-height: 44px;
        padding: 0.75rem 1rem;
    }

    .form-control[b-tez27samgl] {
        min-height: 44px;
        font-size: 1rem;
    }
}

/* Mobile Action Bar */
.mobile-action-bar[b-tez27samgl] {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-radius: 50px;
    padding: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

.mobile-action-buttons[b-tez27samgl] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.mobile-action-buttons .btn[b-tez27samgl] {
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
    border: none;
}

.mobile-action-buttons .btn:hover[b-tez27samgl] {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.mobile-action-buttons .btn:active[b-tez27samgl] {
    transform: scale(0.95);
}

/* Mobile Table Summary */
@media (max-width: 576px) {
    .mobile-table-summary[b-tez27samgl] {
        background: #f8f9fa;
        border: 1px solid #e0e0e0;
        border-radius: 8px;
        padding: 12px;
        margin: 8px 0;
        font-size: 0.9rem;
    }

    .mobile-table-summary .summary-header[b-tez27samgl] {
        font-weight: 600;
        color: #163E9F;
        margin-bottom: 8px;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .mobile-table-summary .summary-stats[b-tez27samgl] {
        display: flex;
        gap: 16px;
        flex-wrap: wrap;
    }

    .mobile-table-summary .stat-item[b-tez27samgl] {
        display: flex;
        flex-direction: column;
        align-items: center;
        min-width: 60px;
    }

    .mobile-table-summary .stat-value[b-tez27samgl] {
        font-size: 1.1rem;
        font-weight: 700;
        color: #163E9F;
    }

    .mobile-table-summary .stat-label[b-tez27samgl] {
        font-size: 0.8rem;
        color: #666;
        text-align: center;
    }

    .mobile-table-summary .expand-toggle[b-tez27samgl] {
        background: none;
        border: 1px solid #163E9F;
        color: #163E9F;
        padding: 4px 8px;
        border-radius: 4px;
        font-size: 0.8rem;
        cursor: pointer;
        transition: all 0.2s;
    }

    .mobile-table-summary .expand-toggle:hover[b-tez27samgl] {
        background: #163E9F;
        color: white;
    }
}

.pmx-list-table[b-tez27samgl] {
    display: flex; 
    flex-direction: row;
    margin: 0 1%;
}

.container-relative[b-tez27samgl] {
    position: relative;
    width: 100%;
}

.lookup-panel[b-tez27samgl] {
    position: absolute;
    top: 0;
    right: -50%;
    width: 50%;
    height: 100%;
    transition: right 0.4s ease, opacity 0.4s ease;
    z-index: 10;
    background-color: white; /* or whatever suits your theme */
    box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
}

.lookup-panel.show[b-tez27samgl] {
    right: 0;
    opacity: 1;
}

.table-wrapper[b-tez27samgl] {
    transition: margin-right 0.4s ease;
    margin-right: 0;
}

.table-wrapper.shifted[b-tez27samgl] {
    margin-right: 50%; /* match lookup-panel width */
}

.sticky-header[b-tez27samgl] {
    position: sticky;
    top: 0;
    z-index: 999;
    background-color: white;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    border-bottom: 1px solid #ddd;
}

.lookup-flex-container[b-tez27samgl] {
    display: flex;
    width: 100%;
    transition: all 0.3s ease;  
}

.main-table[b-tez27samgl] {
    transition: all 0.3s ease;
}

.full-width[b-tez27samgl] {
    width: 100%;
}

.half-width[b-tez27samgl] {
    width: 40%;
}

.lookup-tab-panel[b-tez27samgl] {
    width: 100%;
    transition: all 0.3s ease;
    border-left: 2px solid black;
    
}

.pmxlist-title-row[b-tez27samgl] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 1rem;
}

.pmxlist-title[b-tez27samgl] {
    margin-bottom: 0.5rem;
    color: var(--ssy-colour-main-deep-blue, #163E9F);
    font-weight: 600;
}

.pmxlist-count[b-tez27samgl] {
    font-weight: 400;
    color: var(--ssy-colour-palette-slate-gray, #405864);
    font-size: 1rem;
}

.pmxlist-legend[b-tez27samgl] {
    color: var(--ssy-colour-palette-slate-gray, #405864);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-size: 0.85rem;
}

.pmxlist-filters-row[b-tez27samgl] {
    margin-bottom: 0.5rem;
    border-bottom: 1px solid #e0e6eb;
    padding-bottom: 0.5rem;
    gap: 0.25rem;
}

.pmxlist-search-input[b-tez27samgl] {
    width: 250px;
    height: 1.6rem;
    border-radius: 999px;
    font-size: 0.9rem;
}

:global(.pmxlist-compact-btn)[b-tez27samgl] {
    padding: 0.15rem 0.65rem;
    border-radius: 999px;
    font-size: 0.9rem;
}

.pmxlist-copy-label[b-tez27samgl] {
    font-weight: 600;
    font-size: 1.2rem;
    margin: 0 0.5rem 0 0.75rem;
    color: var(--ssy-colour-main-deep-blue, #163E9F);
}

.pmxlist-iphone-textarea[b-tez27samgl] {
    width: 100%;
    min-height: 20vh;
    border: 1px solid #d9e3ea;
    border-radius: 12px;
    padding: 0.75rem;
    font-size: 0.95rem;
    font-family: inherit;
}

.pmxlist-mainsection[b-tez27samgl] {
    flex-grow: 1;
    width: 100%;
    height: 100%;
    /*margin: auto;*/
    display: flex;
    flex-direction: column;
}

.pmxlist-header[b-tez27samgl] {
    width: 100%;
    background-color: #F4F7F9;
    padding: 2px 4px 0 4px;
    box-sizing: border-box;
}

.pmxlist-datasection[b-tez27samgl] {
    flex: 1;
    display: flex;
    overflow: hidden; /* Prevent parent scroll */
}

.pmxlist-datacolumn[b-tez27samgl] {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 2px;
    box-sizing: border-box;
    border: 1px solid #ddd;
    transition: all 0.3s ease;
}

.pmxlist-singlecolumn[b-tez27samgl] {
    flex: 1 1 95%;
}
.pmxlist-split-column1[b-tez27samgl] {
    flex: 0 0 40%;
}
.pmxlist-split-column2[b-tez27samgl] {
    flex: 0 0 60%;
}










/* container that holds table + lookup */
.pmxlist-datasection.pmxlist-vertical[b-tez27samgl] {
display: flex;
flex-direction: column;
height: 100vh;          /* or 100% if parent already controls height */
min-height: 0;          /* important so children can scroll */
}

/* when lookup is off, table fills available space */
.pmxlist-datasection.pmxlist-horizontal[b-tez27samgl] {
/* keep your existing behaviour, or nothing if current CSS already handles it */
}

/* top 1/4 */
.pmxlist-top-panel[b-tez27samgl] {
flex: 0 0 20%;
min-height: 0;
overflow: auto;         /* table scrolls if content exceeds 25% */
}

/* bottom 3/4 */
.pmxlist-bottom-panel[b-tez27samgl] {
flex: 1 1 80%;
min-height: 0;
overflow: auto;         /* lookup scrolls if needed */
}

/* when lookup is off */
.pmxlist-full-panel[b-tez27samgl] {
flex: 1 1 auto;
min-height: 0;
overflow: auto;
}

.pmxlist-datasection.pmxlist-vertical .pmxlist-bottom-panel[b-tez27samgl] {
border-top: 2px solid #111010; /* adjust colour to match your theme */
}
/* /Components/Pages/Bulkers/PmxList/PmxList_310_FixturesHeader.razor.rz.scp.css */
.panamaxlist-header-form[b-n1b32nnfl9] {
    position: sticky;
    top: 0;
    z-index: 2;
    width: 100%;
    padding: 0 1rem;
}

@media (max-width: 768px) {
    .panamaxlist-header-form[b-n1b32nnfl9] {
        width: 100vw;
        margin-left: -1rem;
        padding: 0 1rem;
    }
}

.fixture-inline-row[b-n1b32nnfl9] {
    display: flex;
    align-items: center;
    gap: 20px;
    width: 100%;
    white-space: nowrap;
}

.fixture-inline-title[b-n1b32nnfl9] {
    margin: 0;
    white-space: nowrap;
    flex: 0 0 auto;
}

.inline-field[b-n1b32nnfl9] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 5px;
    flex: 0 0 auto;
    white-space: nowrap;
}

.inline-field label[b-n1b32nnfl9] {
    margin: 0;
    font-weight: 600;
    white-space: nowrap;
}

.inline-field .form-control[b-n1b32nnfl9],
.inline-field input[b-n1b32nnfl9],
.inline-field select[b-n1b32nnfl9] {
    width: 220px;
}

.inline-field.details-field .form-control[b-n1b32nnfl9],
.inline-field.details-field input[b-n1b32nnfl9],
.inline-field.details-field select[b-n1b32nnfl9] {
    min-width: 420px;
}

.inline-field.vessel-field .form-control[b-n1b32nnfl9],
.inline-field.vessel-field input[b-n1b32nnfl9],
.inline-field.vessel-field select[b-n1b32nnfl9] {
    width: 260px;
}

.inline-button[b-n1b32nnfl9] {
    display: flex;
    align-items: center;
    margin-left: auto;
    flex: 0 0 auto;
}

.inline-button button[b-n1b32nnfl9] {
    white-space: nowrap;
}

.validation-row[b-n1b32nnfl9] {
    margin-top: 6px;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_320_FixturesTable.razor.rz.scp.css */
/* Icon dropdown styles now in pmxlist-shared.css */
.col-select[b-xlh4llh1u4] {
    width: 3%;
    text-align: center;
}

.col-fixed-date[b-xlh4llh1u4] {
    width: 9%;
    white-space: nowrap;
}

.col-vessel[b-xlh4llh1u4] {
    width: 11%;
}

.col-details[b-xlh4llh1u4] {
    width: auto;
}

.col-pnc[b-xlh4llh1u4] {
    width: 4%;
    text-align: center;
}

.col-actions[b-xlh4llh1u4] {
    width: 7%;
    text-align: center;
}

/* Date navigation arrows */
.date-arrows-left[b-xlh4llh1u4],
.date-arrows-right[b-xlh4llh1u4] {
    background: none;
    border: none;
    padding: 0 4px;
    font-size: 1.5rem;
    line-height: 1;
    color: #000;
    cursor: pointer;
    transition: color 0.2s ease;
}

.date-arrows-left:hover[b-xlh4llh1u4],
.date-arrows-right:hover[b-xlh4llh1u4] {
    color: #007bff;
}

.date-arrows-left:disabled[b-xlh4llh1u4],
.date-arrows-right:disabled[b-xlh4llh1u4] {
    color: #ccc;
    cursor: default;
}

/* Icon dropdown box styles now in pmxlist-shared.css */

.fixtures-toolbar[b-xlh4llh1u4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.1rem;
    background: #F4F7F9;
    width: 100%;
    padding: 0.75rem 1rem;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08);
    flex-wrap: wrap;
}

.fixtures-toolbar-left[b-xlh4llh1u4],
.fixtures-toolbar-middle[b-xlh4llh1u4],
.fixtures-toolbar-right[b-xlh4llh1u4] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.fixtures-toolbar-left label[b-xlh4llh1u4] {
    margin-bottom: 0;
    white-space: nowrap;
}

.fixtures-toolbar-middle[b-xlh4llh1u4] {
    flex-wrap: wrap;
}

.fixtures-toolbar-right[b-xlh4llh1u4] {
    margin-left: auto;
}

.pmxlist-updated-text[b-xlh4llh1u4] {
    font-size: 10px;
    color: #888;
    text-align: center;
    margin-top: 2px;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_420_TonnageArchive.razor.rz.scp.css */
/* Styles for the Panamaxlist Table Parser component */

.panamaxlist-parser h3[b-55q5upks2l] {
    color: #333;
    margin-bottom: 1.5rem;
}

.panamaxlist-parser textarea[b-55q5upks2l] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.panamaxlist-parser .table[b-55q5upks2l] {
    margin-top: 1rem;
}

.panamaxlist-parser .table thead th[b-55q5upks2l] {
    background-color: #f8f9fa;
    position: sticky;
    top: 0;
    z-index: 1;
}

.panamaxlist-parser .table td[b-55q5upks2l], .panamaxlist-parser .table th[b-55q5upks2l] {
    padding: 0.5rem;
    vertical-align: middle;
}

.panamaxlist-parser input[type="checkbox"][b-55q5upks2l] {
    cursor: pointer;
}

.panamaxlist-parser .alert[b-55q5upks2l] {
    animation: fadeIn-b-55q5upks2l 0.5s;
}

/* Search functionality styles */
.search-container[b-55q5upks2l] {
    min-width: 300px;
    margin-left: 1rem;
}

.search-results-count[b-55q5upks2l] {
    text-align: right;
    margin-top: 0.25rem;
    color: #6c757d;
}

.panamaxlist-parser .input-group-append button[b-55q5upks2l] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.panamaxlist-parser .input-group-append button span[b-55q5upks2l] {
    font-size: 1.5rem;
    line-height: 0.5;
    display: inline-block;
}

/* Upload feedback styles */
.upload-feedback[b-55q5upks2l] {
    position: relative;
    padding-bottom: 2rem;
}

.upload-progress[b-55q5upks2l] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background-color: rgba(0, 0, 0, 0.1);
    overflow: hidden;
    border-radius: 0 0 0.25rem 0.25rem;
}

.upload-progress-bar[b-55q5upks2l] {
    height: 100%;
    width: 0;
    background-color: #17a2b8;
    animation: progress-b-55q5upks2l 3s ease-in-out forwards;
}

@keyframes progress-b-55q5upks2l {
    0% { width: 0; }
    100% { width: 100%; }
}

@keyframes fadeIn-b-55q5upks2l {
    from { opacity: 0; }
    to { opacity: 1; }
}
/* /Components/Pages/Bulkers/PmxList/PmxList_520_PendingTonnage.razor.rz.scp.css */
/* Styles for the Panamaxlist Table Parser component */

.panamaxlist-parser h3[b-yon7gb4pyj] {
    color: #333;
    margin-bottom: 1.5rem;
}

.panamaxlist-parser textarea[b-yon7gb4pyj] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.panamaxlist-parser .table[b-yon7gb4pyj] {
    margin-top: 1rem;
}

.panamaxlist-parser .table thead th[b-yon7gb4pyj] {
    background-color: #f8f9fa;
    position: sticky;
    top: 0;
    z-index: 1;
}

.panamaxlist-parser .table td[b-yon7gb4pyj], .panamaxlist-parser .table th[b-yon7gb4pyj] {
    padding: 0.5rem;
    vertical-align: middle;
}

.panamaxlist-parser input[type="checkbox"][b-yon7gb4pyj] {
    cursor: pointer;
}

.panamaxlist-parser .alert[b-yon7gb4pyj] {
    animation: fadeIn-b-yon7gb4pyj 0.5s;
}

/* Search functionality styles */
.search-container[b-yon7gb4pyj] {
    min-width: 300px;
    margin-left: 1rem;
}

.search-results-count[b-yon7gb4pyj] {
    text-align: right;
    margin-top: 0.25rem;
    color: #6c757d;
}

.panamaxlist-parser .input-group-append button[b-yon7gb4pyj] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.panamaxlist-parser .input-group-append button span[b-yon7gb4pyj] {
    font-size: 1.5rem;
    line-height: 0.5;
    display: inline-block;
}

/* Upload feedback styles */
.upload-feedback[b-yon7gb4pyj] {
    position: relative;
    padding-bottom: 2rem;
}

.upload-progress[b-yon7gb4pyj] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background-color: rgba(0, 0, 0, 0.1);
    overflow: hidden;
    border-radius: 0 0 0.25rem 0.25rem;
}

.upload-progress-bar[b-yon7gb4pyj] {
    height: 100%;
    width: 0;
    background-color: #17a2b8;
    animation: progress-b-yon7gb4pyj 3s ease-in-out forwards;
}

@keyframes progress-b-yon7gb4pyj {
    0% { width: 0; }
    100% { width: 100%; }
}

@keyframes fadeIn-b-yon7gb4pyj {
    from { opacity: 0; }
    to { opacity: 1; }
}
/* /Components/Pages/Bulkers/PmxList/PmxList_598_AIProcess.razor.rz.scp.css */
/* Styles for the Panamaxlist Table Parser component */

.panamaxlist-parser h3[b-x2g2tfvijr] {
    color: #333;
    margin-bottom: 1.5rem;
}

.panamaxlist-parser textarea[b-x2g2tfvijr] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.panamaxlist-parser .table[b-x2g2tfvijr] {
    margin-top: 1rem;
}

.panamaxlist-parser .table thead th[b-x2g2tfvijr] {
    background-color: #f8f9fa;
    position: sticky;
    top: 0;
    z-index: 1;
}

.panamaxlist-parser .table td[b-x2g2tfvijr], .panamaxlist-parser .table th[b-x2g2tfvijr] {
    padding: 0.5rem;
    vertical-align: middle;
}

.panamaxlist-parser input[type="checkbox"][b-x2g2tfvijr] {
    cursor: pointer;
}

.panamaxlist-parser .alert[b-x2g2tfvijr] {
    animation: fadeIn-b-x2g2tfvijr 0.5s;
}

/* Search functionality styles */
.search-container[b-x2g2tfvijr] {
    min-width: 300px;
    margin-left: 1rem;
}

.search-results-count[b-x2g2tfvijr] {
    text-align: right;
    margin-top: 0.25rem;
    color: #6c757d;
}

.panamaxlist-parser .input-group-append button[b-x2g2tfvijr] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.panamaxlist-parser .input-group-append button span[b-x2g2tfvijr] {
    font-size: 1.5rem;
    line-height: 0.5;
    display: inline-block;
}

/* Upload feedback styles */
.upload-feedback[b-x2g2tfvijr] {
    position: relative;
    padding-bottom: 2rem;
}

.upload-progress[b-x2g2tfvijr] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background-color: rgba(0, 0, 0, 0.1);
    overflow: hidden;
    border-radius: 0 0 0.25rem 0.25rem;
}

.upload-progress-bar[b-x2g2tfvijr] {
    height: 100%;
    width: 0;
    background-color: #17a2b8;
    animation: progress-b-x2g2tfvijr 3s ease-in-out forwards;
}

@keyframes progress-b-x2g2tfvijr {
    0% { width: 0; }
    100% { width: 100%; }
}

@keyframes fadeIn-b-x2g2tfvijr {
    from { opacity: 0; }
    to { opacity: 1; }
}
/* /Components/Pages/Bulkers/PmxList/PmxList_599_Parser.razor.rz.scp.css */
/* Styles for the Panamaxlist Table Parser component */

.panamaxlist-parser h3[b-g1t1eiixgv] {
    color: #333;
    margin-bottom: 1.5rem;
}

.panamaxlist-parser textarea[b-g1t1eiixgv] {
    width: 100%;
    padding: 0.5rem;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
}

.panamaxlist-parser .table[b-g1t1eiixgv] {
    margin-top: 1rem;
}

.panamaxlist-parser .table thead th[b-g1t1eiixgv] {
    background-color: #f8f9fa;
    position: sticky;
    top: 0;
    z-index: 1;
}

.panamaxlist-parser .table td[b-g1t1eiixgv], .panamaxlist-parser .table th[b-g1t1eiixgv] {
    padding: 0.5rem;
    vertical-align: middle;
}

.panamaxlist-parser input[type="checkbox"][b-g1t1eiixgv] {
    cursor: pointer;
}

.panamaxlist-parser .alert[b-g1t1eiixgv] {
    animation: fadeIn-b-g1t1eiixgv 0.5s;
}

/* Search functionality styles */
.search-container[b-g1t1eiixgv] {
    min-width: 300px;
    margin-left: 1rem;
}

.search-results-count[b-g1t1eiixgv] {
    text-align: right;
    margin-top: 0.25rem;
    color: #6c757d;
}

.panamaxlist-parser .input-group-append button[b-g1t1eiixgv] {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.panamaxlist-parser .input-group-append button span[b-g1t1eiixgv] {
    font-size: 1.5rem;
    line-height: 0.5;
    display: inline-block;
}

/* Upload feedback styles */
.upload-feedback[b-g1t1eiixgv] {
    position: relative;
    padding-bottom: 2rem;
}

.upload-progress[b-g1t1eiixgv] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
    background-color: rgba(0, 0, 0, 0.1);
    overflow: hidden;
    border-radius: 0 0 0.25rem 0.25rem;
}

.upload-progress-bar[b-g1t1eiixgv] {
    height: 100%;
    width: 0;
    background-color: #17a2b8;
    animation: progress-b-g1t1eiixgv 3s ease-in-out forwards;
}

@keyframes progress-b-g1t1eiixgv {
    0% { width: 0; }
    100% { width: 100%; }
}

@keyframes fadeIn-b-g1t1eiixgv {
    from { opacity: 0; }
    to { opacity: 1; }
}
/* /Components/Pages/Bulkers/PmxList/PmxList_600_MarketView.razor.rz.scp.css */
.dashboard-grid[b-eni5koq5k5] {
    display: flex;
    flex-wrap: wrap;      /* allow boxes to naturally wrap */
    gap: 12px;
}

.dashboard-box[b-eni5koq5k5] {
    flex: 1 1 calc(25% - 12px); /* 4 per row */
    max-width: calc(25% - 12px);
    min-width: 150px;
}

.dashboard-box[b-eni5koq5k5] {
    border: 1px solid #000061;
    border-radius: 5px;
    overflow: hidden;
    width: 150px;
    font-weight: bold;
    box-shadow: 1px 1px 4px rgba(0,0,0,0.1);
}

.dashboard-box-title[b-eni5koq5k5] {
    background-color: #000061; /* SSY blue */
    color: white;
    padding: 5px;
    font-size: 14px;
    text-align: center;
}

.dashboard-box-value[b-eni5koq5k5] {
    background-color: white;
    color: black;
    padding: 2px 0px;
    font-size: 16px;
    text-align: center;
}

.dashboard-box-value.positive[b-eni5koq5k5] {
    color: green;
}

.dashboard-box-value.negative[b-eni5koq5k5] {
    color: red;
}

.container-wrapper[b-eni5koq5k5] {
    display: flex;
    justify-content: space-between; /* Space evenly between containers */
    align-items: stretch; /* Ensure equal height */
    gap: 20px; /* Space between containers */
    margin-top: 20px; /* Add spacing between rows of containers */
}

.selectable-row[b-eni5koq5k5] {
    cursor: pointer;
}

.selectable-row.selected[b-eni5koq5k5] {
    background-color: #049924;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_810_ActivityLog.razor.rz.scp.css */
html[b-o514g2j1oo], body[b-o514g2j1oo] { height: 100vh; margin: 0; background: #f5f6f8; }

.page-shell[b-o514g2j1oo] {
min-height: 100vh;
display: flex;
flex-direction: column;
}

.log-container[b-o514g2j1oo] {
flex: 1;
min-height: 0;          /* enables inner scrolling */
display: flex;
flex-direction: column;
margin-top: 10px;
background: #fff;
border-radius: 8px;
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* Header row (always at the very top) */
.log-headerbar[b-o514g2j1oo] {
display: grid;
grid-template-columns: 180px 180px 1fr 180px;
padding: 10px;
border-bottom: 1px solid #e6e8ec;
font-weight: 700;
color: #000061;
}

/* Scrollable area that bottom-anchors content: spacer (1fr) + table (auto) */
.content-frame[b-o514g2j1oo] {
flex: 1;
min-height: 0;
overflow: auto;

display: grid;
grid-template-rows: 1fr auto;
padding: 10px;
}

/* Table niceties (your DS likely covers most) */
.ssy-table-lw td[b-o514g2j1oo] { vertical-align: top; }
.ssy-table-lw td:nth-child(3)[b-o514g2j1oo] { white-space: normal; } /* allow details to wrap */
.ssy-table-lw td:not(:nth-child(3))[b-o514g2j1oo] { white-space: nowrap; }

.log-date-separator td[b-o514g2j1oo] {
    background-color: #f0f0f0;
    font-weight: bold;
    text-align: left;
    padding: 6px 10px;
    border-top: 2px solid #ccc;
}

.date-header[b-o514g2j1oo] {
    color: #555;
    font-size: 0.9rem;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_990_Admin.razor.rz.scp.css */
.table-stickyheader thead[b-f7spxbh111] {
    position: sticky;
    top: 0;
    font-weight: normal;
    padding: 0 2px 0 2px;
}
/* /Components/Pages/Bulkers/PmxList/PmxList_SnapshotArchive.razor.rz.scp.css */
/* Styles inherited from pmxlist-shared.css */
/* /Components/Pages/Bulkers/Reports/CommodityPrices/RptCommodityPrices.razor.rz.scp.css */
/* ────────────────────────────────────────────────────────────────────────
   SSY Broker Commodity Prices — page styling
   Palette mirrors the colours used in the Python source script and matches
   the SSY Geared Markets brand language.

   (Scoped .razor.css cannot include @import — load EB Garamond / Source
    Sans 3 from App.razor's <head> if not already present.)
   ──────────────────────────────────────────────────────────────────────── */

.ssy-comm-frame[b-l69har0x9d] {
    --ssy-navy:        #000061;
    --ssy-navy-light:  #163E9F;
    --ssy-cyan:        #009DC9;
    --ssy-blue-mid:    #0087CB;
    --ssy-aqua:        #00E2FD;
    --ssy-pink:        #EB3871;
    --ssy-teal:        #01A39E;
    --ssy-purple:      #752FD0;
    --ssy-band:        #75BEE3;
    --ssy-grey:        #4a4a4a;
    --ssy-grey-soft:   #ededed;
    --ssy-up:          #2aaf57;
    --ssy-down:        #e23b3b;
    --serif:           "EB Garamond", Georgia, "Times New Roman", serif;
    --sans:            "Source Sans 3", "Source Sans Pro", "Segoe UI", Arial, sans-serif;

    max-width: 1480px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 2px 16px rgba(0, 0, 97, 0.07);
    border-radius: 14px;
    padding: 0 30px 36px;
    font-family: var(--sans);
    color: var(--ssy-grey);
    overflow: hidden;
}

/* ─── Masthead ──────────────────────────────────────────────────────── */
.ssy-comm-mast[b-l69har0x9d] { padding: 18px 0 0; }
.ssy-comm-mast-row[b-l69har0x9d] {
    display: flex; justify-content: space-between; align-items: flex-end;
    gap: 24px; padding-bottom: 8px;
}
.ssy-comm-mast-brand[b-l69har0x9d] { display: flex; align-items: center; gap: 18px; }
.ssy-comm-mast-logo[b-l69har0x9d]  {
    height: 110px; width: auto; flex-shrink: 0;
    object-fit: fill; display: block;
}
.ssy-comm-mast-title h1[b-l69har0x9d] {
    font-family: var(--serif); font-weight: 600; font-size: 34px;
    color: var(--ssy-navy); margin: 0; letter-spacing: 0.4px; line-height: 1.1;
}
.ssy-comm-mast-title .subtitle[b-l69har0x9d] {
    font-family: var(--sans); font-weight: 600; color: var(--ssy-cyan);
    margin: 2px 0 0; font-size: 14px; letter-spacing: 0.4px;
    text-transform: uppercase;
}

.ssy-comm-mast-contact[b-l69har0x9d] {
    text-align: right; font-size: 12.5px; color: var(--ssy-grey); line-height: 1.55;
}
.ssy-comm-mast-contact .date-display[b-l69har0x9d] {
    font-family: var(--serif); font-weight: 700; font-size: 22px;
    color: var(--ssy-navy); margin-bottom: 6px;
}
.ssy-comm-mast-contact .lbl[b-l69har0x9d] { color: #999; display: inline-block; min-width: 76px; }
.ssy-comm-mast-contact a[b-l69har0x9d] { color: var(--ssy-blue-mid); text-decoration: none; }
.ssy-comm-mast-contact a:hover[b-l69har0x9d] { text-decoration: underline; }

.ssy-comm-mast-wave[b-l69har0x9d] { display: block; width: 100%; height: 36px; margin-top: -2px; }

/* ─── Toolbar ───────────────────────────────────────────────────────── */
.ssy-comm-toolbar[b-l69har0x9d] {
    display: flex; align-items: center; justify-content: space-between;
    gap: 16px; padding: 14px 0 12px; flex-wrap: wrap;
}

.ssy-comm-status[b-l69har0x9d] { display: flex; align-items: center; gap: 10px; font-size: 12px; color: #777; }
.ssy-comm-pill[b-l69har0x9d] {
    display: inline-block; padding: 3px 10px; border-radius: 11px;
    font-weight: 700; font-size: 11px; letter-spacing: 0.3px;
    background: var(--ssy-grey-soft); color: #555;
}
.ssy-comm-pill.live[b-l69har0x9d]    { background: #d6f4e2; color: #1f8a44; }
.ssy-comm-pill.mock[b-l69har0x9d]    { background: #fff4d4; color: #8a6a18; }
.ssy-comm-pill.loading[b-l69har0x9d] { background: #e8eef5; color: var(--ssy-navy); }
.ssy-comm-stamp[b-l69har0x9d] { font-size: 12px; color: #777; }

.ssy-comm-cat-tabs[b-l69har0x9d] { display: flex; gap: 6px; flex-wrap: wrap; }
.ssy-comm-cat[b-l69har0x9d] {
    font-family: var(--sans); font-size: 12px; font-weight: 600;
    padding: 6px 12px; border-radius: 18px; border: 1px solid #d0d6dd;
    background: #fff; color: var(--ssy-grey); cursor: pointer;
    transition: background .12s, border-color .12s, color .12s;
}
.ssy-comm-cat:hover:not(.active)[b-l69har0x9d] {
    background: #f0f5fa; border-color: var(--ssy-cyan); color: var(--ssy-navy);
}
.ssy-comm-cat.active[b-l69har0x9d] {
    background: var(--ssy-navy); color: #fff; border-color: var(--ssy-navy);
}

.ssy-comm-actions[b-l69har0x9d] { display: flex; gap: 8px; }
.ssy-comm-btn[b-l69har0x9d] {
    font-family: var(--sans); font-size: 13px; font-weight: 600;
    padding: 7px 14px; border-radius: 22px; cursor: pointer;
    border: 1px solid var(--ssy-navy); background: var(--ssy-navy); color: #fff;
}
.ssy-comm-btn:hover:not([disabled])[b-l69har0x9d] { background: #00003e; }
.ssy-comm-btn[disabled][b-l69har0x9d] { opacity: 0.5; cursor: not-allowed; }
.ssy-comm-btn-primary[b-l69har0x9d] {}

/* ─── Section title ─────────────────────────────────────────────────── */
.ssy-comm-section-h[b-l69har0x9d] {
    font-family: var(--serif); font-weight: 700;
    color: var(--ssy-navy); font-size: 24px;
    margin: 8px 0 14px;
    text-align: center;
}

/* Date-range strip beneath the toolbar — italic, smaller, teal-green. */
.ssy-comm-date-range[b-l69har0x9d] {
    font-family: var(--sans);
    font-style: italic;
    font-weight: 600;
    font-size: 13px;
    color: var(--ssy-teal);
    margin: 4px 0 16px;
    text-align: center;
    letter-spacing: 0.2px;
}

/* ─── 5×5 grid ──────────────────────────────────────────────────────── */
.ssy-comm-grid[b-l69har0x9d] {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
    margin: 4px 0;
}
@media (max-width: 1280px) { .ssy-comm-grid[b-l69har0x9d] { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 1000px) { .ssy-comm-grid[b-l69har0x9d] { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 720px)  { .ssy-comm-grid[b-l69har0x9d] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px)  { .ssy-comm-grid[b-l69har0x9d] { grid-template-columns: 1fr; } }

/* Cell base styles (cell component supplies its own scoped CSS too) */
.ssy-comm-cell[b-l69har0x9d] {
    border: 1px solid #e2e7ec;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
    display: flex; flex-direction: column;
    transition: border-color .12s, box-shadow .12s;
}
.ssy-comm-cell:hover[b-l69har0x9d] { border-color: var(--ssy-band); box-shadow: 0 4px 14px rgba(0,0,97,.06); }

.ssy-comm-cell.empty[b-l69har0x9d] {
    background: repeating-linear-gradient(45deg, #f7fafc, #f7fafc 8px, #fff 8px, #fff 16px);
    border-color: #ebedf0;
}
.ssy-comm-cell.empty .ssy-comm-cell-head[b-l69har0x9d] { background: #c6d0d8; }
.ssy-comm-cell.empty .ssy-comm-cell-head .name[b-l69har0x9d] { color: #fff; }
.ssy-comm-cell.empty .ssy-comm-cell-head .desc[b-l69har0x9d] { color: rgba(255,255,255,0.85); }

.ssy-comm-cell.skeleton .ssy-comm-cell-head .name[b-l69har0x9d],
.ssy-comm-cell.skeleton .ssy-comm-cell-head .desc[b-l69har0x9d] {
    background: linear-gradient(90deg, #e8edf2 25%, #f5f7f9 50%, #e8edf2 75%);
    background-size: 200% 100%; animation: comm-shimmer-b-l69har0x9d 1.4s linear infinite;
    border-radius: 3px; min-height: 14px; color: transparent;
}
@keyframes comm-shimmer-b-l69har0x9d {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.ssy-comm-cell-head[b-l69har0x9d] {
    background: var(--ssy-band);
    color: #fff;
    padding: 7px 10px 8px;
    text-align: center;
    line-height: 1.2;
}
[b-l69har0x9d] .ssy-comm-cell-head .name {
    font-family: var(--sans);
    font-weight: 800;
    font-size: 13px;
    color: var(--ssy-navy);
}
[b-l69har0x9d] .ssy-comm-cell-head .desc {
    font-style: italic;
    font-size: 10px;
    margin-top: 1px;
    color: #666;
}

.ssy-comm-cell-chart[b-l69har0x9d] { flex: 1; min-height: 160px; padding: 0 4px 4px; }

/* Cell meta (last value + 3M delta). The cell component renders these
   classes inside a child render fragment, so we use ::deep to reach them. */
[b-l69har0x9d] .ssy-comm-cell-meta {
    display: flex;
    justify-content: space-between;
    padding: 5px 10px 0;
    font-size: 11px;
    color: #777;
}
[b-l69har0x9d] .ssy-comm-cell-meta .last  { font-weight: 700; color: #000061; font-size: 12px; }
[b-l69har0x9d] .ssy-comm-cell-meta .delta.up   { color: #2aaf57; font-weight: 700; }
[b-l69har0x9d] .ssy-comm-cell-meta .delta.down { color: #e23b3b; font-weight: 700; }
[b-l69har0x9d] .ssy-comm-cell-meta .delta.flat { color: #777; }

/* ─── Footer ────────────────────────────────────────────────────────── */
.ssy-comm-disclaimer[b-l69har0x9d] {
    margin-top: 28px; padding: 14px 0 6px;
    border-top: 1px solid #dadfe5;
    font-size: 11px; color: #888; line-height: 1.55;
}
.ssy-comm-disclaimer strong[b-l69har0x9d] { color: var(--ssy-navy); }

.ssy-comm-error[b-l69har0x9d] {
    margin-top: 14px; padding: 10px 14px;
    border: 1px solid #f3c4c4; background: #fff5f5; color: #a23030;
    border-radius: 6px; font-size: 12.5px;
}
/* /Components/Pages/Bulkers/Reports/DryCargo/RptTemplates/CapesizeRpt.razor.rz.scp.css */

.cape-rpt-content[b-04lyl7dlx8] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}


.cape-rpt-left[b-04lyl7dlx8] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.cape-rpt-mkt-coms[b-04lyl7dlx8] {
    /*height: calc(36% + var(--mktCom-recFixt-split));*/
    height: fit-content;
}

.cape-rpt-rec-fxts[b-04lyl7dlx8] {
    margin: 2% 0;
    /*height: calc(36% - var(--mktCom-recFixt-split));*/
    height: fit-content;
}

.cape-rpt-newbuilding[b-04lyl7dlx8] {
/*    margin: 2% 0;*/
    height: 13%;
}

@scope (.cape-rpt-table) {
    :scope[b-04lyl7dlx8] {
        height: 30%;
        width: 100%;
        text-align: center;
        margin-bottom: 4vh;
    }

    h4[b-04lyl7dlx8] {
        background-color: #009DC9;
        color: white;
        padding: 4px;
        text-align: left;
        font-weight: 500;
    }

    table[b-04lyl7dlx8] {
        width: 100%;
    }

    tbody tr:nth-child(odd)[b-04lyl7dlx8] {
        background-color: #EBF1F8;
    }
}

.cape-rpt-exch-rates[b-04lyl7dlx8] {
    height: 22%;
}

.cape-rpt-freight-fixt[b-04lyl7dlx8] {
    height: 78%;
}

.cape-rpt-right[b-04lyl7dlx8] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}


.cape-5TC-avg[b-04lyl7dlx8] {
    height: 30%;
    /*border: 1px solid navy;*/
}

.cape-rpt-mkt-coms-btm[b-04lyl7dlx8] {
    height: fit-content;
    width: 100%;
}
/* /Components/Pages/Bulkers/Reports/DryCargo/RptTemplates/DryCargoRpt.razor.rz.scp.css */
.dry-rpt-content[b-968ow64jo4] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}


.dry-rpt-left[b-968ow64jo4] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

@scope (.dry-rpt-table) {
    :scope[b-968ow64jo4] {
        width: 100%;
        text-align: center;
    }

    table[b-968ow64jo4] {
        width: 100%;
    }

    tbody tr:nth-child(even)[b-968ow64jo4] {
        background-color: #EBF1F8;
    }
}

.dry-rpt-exch-rates[b-968ow64jo4] {
    height: 24%;
}

.dry-rpt-freight-fixt[b-968ow64jo4] {
    height: 76%;
}

.dry-rpt-right[b-968ow64jo4] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dry-rpt-price-graph[b-968ow64jo4] {
    height: 24%;
}

@scope (.dry-rpt-friday-tables) {
    :scope[b-968ow64jo4] {
        font-size: 0.95em;
        width: 100%;
        text-align: center;
    }

    tbody tr:nth-child(odd)[b-968ow64jo4] {
        background-color: #EBF1F8;
    }
}
/* /Components/Pages/Bulkers/Reports/DryCargo/RptTemplates/HandysizeRpt.razor.rz.scp.css */

.handy-rpt-content[b-y7gd5hvxzh] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}


.handy-rpt-left[b-y7gd5hvxzh] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.handy-rpt-left-fri[b-y7gd5hvxzh] {
    width: 50%;
    height: 100%;
}

.handy-rpt-mkt-coms[b-y7gd5hvxzh] {
    height: fit-content;
}

.handy-rpt-rec-fxts[b-y7gd5hvxzh] {
    margin: 2% 0;
    height: fit-content;
}

.handy-rpt-exch-rates[b-y7gd5hvxzh] {
    height: 22%;
}

.handy-rpt-freight-fixt[b-y7gd5hvxzh] {
    height: 78%;
}

.handy-rpt-right[b-y7gd5hvxzh] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.handy-rpt-table[b-y7gd5hvxzh] {
    height: 30%;
    width: 100%;
    margin: 2% 0;
}

.handy-TC-avg[b-y7gd5hvxzh] {
    height: 35%;
    margin-bottom: 2%;
}
/* /Components/Pages/Bulkers/Reports/DryCargo/RptTemplates/PanamaxRpt.razor.rz.scp.css */

.pnmx-rpt-content[b-zh3tr0z6ou] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.pnmx-rpt-top[b-zh3tr0z6ou] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 80%;
    width: 100%;
}

.pnmx-rpt-left[b-zh3tr0z6ou] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pnmx-rpt-mkt-coms[b-zh3tr0z6ou] {
    height: fit-content;
}

.pnmx-rpt-rec-fxts[b-zh3tr0z6ou] {
    margin: 2% 0;
    height: fit-content;
}

@scope (.pnmx-rpt-table) {
    :scope[b-zh3tr0z6ou] {
        width: 100%;
        text-align: center;
        margin-bottom: 4vh;
    }

    h4[b-zh3tr0z6ou] {
        background-color: #009DC9;
        color: white;
        padding: 4px;
        text-align: left;
        font-weight: 500;
    }

    table[b-zh3tr0z6ou] {
        width: 100%;
    }

    tbody tr:nth-child(odd)[b-zh3tr0z6ou] {
        background-color: #EBF1F8;
    }
}

.pnmx-rpt-exch-rates[b-zh3tr0z6ou] {
    height: 22%;
}

.pnmx-rpt-freight-fixt[b-zh3tr0z6ou] {
    height: 78%;
}

.pnmx-rpt-right[b-zh3tr0z6ou] {
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pnmx-5TC-avg[b-zh3tr0z6ou] {
    height: 28%;
    margin-bottom: 1%;
}

/*bottom*/
.pnmx-tng-supply[b-zh3tr0z6ou] {
    height: 17%;
    width: 100%;
}


/* friday */

.pnmx-rpt-mkt-coms-btm[b-zh3tr0z6ou] {
    height: fit-content;
    width: 100%;
}
/* /Components/Pages/Bulkers/Reports/DryCombinedReport/DryCombinedRpt.razor.rz.scp.css */
/* Dry Combined Report — scoped styles
 * Masthead and toolbar dimensions mirror the SSY Geared Mkt Report so the
 * two reports look like siblings. Tab content (sections, cards, tables,
 * prose blocks, banner, chart cards) uses the same accent bar / gradient
 * /pill visual language as the Geared report.
 */

.dry-combined-frame[b-dqbrpheec8] {
    --ssy-navy:        #1f4e8a;
    --ssy-deep:        #163E9F;
    --ssy-blue:        #0087CB;
    --ssy-blue-light:  #4ec0e0;
    --ssy-blue-pale:   #d3edf7;
    --ssy-aqua:        #009DC9;
    --ssy-grey:        #4a4a4a;
    --ssy-grey-soft:   #ededed;
    --ssy-up:          #2aaf57;
    --ssy-down:        #e23b3b;
    --serif:           "EB Garamond", Georgia, "Times New Roman", serif;
    --sans:            "Source Sans 3", "Source Sans Pro", "Segoe UI", Arial, sans-serif;

    max-width: 1280px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 2px 16px rgba(31, 78, 138, 0.07);
    border-radius: 14px;
    padding: 0 30px 36px;
    font-family: var(--sans);
    color: var(--ssy-grey);
    overflow: hidden;
}

/* ─── Masthead ──────────────────────────────────────────────────── */
.dry-combined-mast[b-dqbrpheec8] { padding: 18px 0 0; }

.dry-combined-mast-row[b-dqbrpheec8] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    padding-bottom: 8px;
}

.dry-combined-mast-brand[b-dqbrpheec8] {
    display: flex;
    align-items: center;
    gap: 18px;
}

.dry-combined-mast-logo[b-dqbrpheec8] {
    height: 110px;
    width: auto;
    flex-shrink: 0;
    object-fit: fill;
    display: block;
}

.dry-combined-mast-title h1[b-dqbrpheec8] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: 34px;
    color: var(--ssy-navy);
    margin: 0;
    letter-spacing: 0.4px;
    line-height: 1.1;
}

.dry-combined-mast-title .subtitle[b-dqbrpheec8] {
    font-family: var(--sans);
    font-weight: 600;
    color: var(--ssy-blue);
    margin: 4px 0 0;
    font-size: 14px;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.dry-combined-mast-contact[b-dqbrpheec8] {
    text-align: right;
    font-size: 12px;
    color: var(--ssy-grey);
    line-height: 1.6;
}

.dry-combined-mast-contact .date-display[b-dqbrpheec8] {
    font-family: var(--serif);
    font-weight: 700;
    font-size: 24px;
    color: var(--ssy-navy);
    margin-bottom: 6px;
    letter-spacing: 0.3px;
}

.dry-combined-mast-contact .lbl[b-dqbrpheec8] {
    color: #999;
    display: inline-block;
    min-width: 50px;
}

.dry-combined-mast-contact a[b-dqbrpheec8] {
    color: var(--ssy-blue);
    text-decoration: none;
    font-weight: 500;
}

.dry-combined-mast-contact a:hover[b-dqbrpheec8] { text-decoration: underline; }

.dry-combined-mast-wave[b-dqbrpheec8] {
    display: block;
    width: 100%;
    height: 32px;
    margin-top: 2px;
    overflow: visible;
}

/* ─── Toolbar ───────────────────────────────────────────────────── */
.dry-combined-toolbar[b-dqbrpheec8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 0 8px;
    flex-wrap: wrap;
}

.dry-combined-date-nav[b-dqbrpheec8] { display: flex; align-items: center; gap: 8px; }

.dry-combined-tabs[b-dqbrpheec8] { display: flex; gap: 6px; flex-wrap: wrap; }

.dry-combined-tab[b-dqbrpheec8] {
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
    background: #fff;
    border: 1px solid var(--ssy-navy);
    padding: 7px 16px;
    cursor: pointer;
    color: var(--ssy-navy);
    border-radius: 22px;
    letter-spacing: 0.2px;
    transition: background .15s, color .15s, transform .12s, box-shadow .15s;
}

.dry-combined-tab:hover:not(.active)[b-dqbrpheec8] {
    background: var(--ssy-grey-soft);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(31, 78, 138, 0.12);
}

.dry-combined-tab.active[b-dqbrpheec8] {
    color: #fff;
    background: var(--ssy-blue);
    border-color: var(--ssy-blue);
    box-shadow: 0 2px 8px rgba(0, 135, 203, 0.30);
}

.dry-combined-tab.active:hover[b-dqbrpheec8] { background: var(--ssy-aqua); }

.dry-combined-actions[b-dqbrpheec8] { display: flex; align-items: center; gap: 8px; }

.dry-combined-edit-btn[b-dqbrpheec8],
.dry-combined-icon-btn[b-dqbrpheec8] {
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
    padding: 7px 16px;
    border-radius: 22px;
    border: 1px solid var(--ssy-navy);
    background: var(--ssy-navy);
    color: #fff;
    cursor: pointer;
    transition: background .12s, transform .12s;
    letter-spacing: 0.2px;
}

.dry-combined-edit-btn:hover[b-dqbrpheec8],
.dry-combined-icon-btn:hover[b-dqbrpheec8] {
    background: #173d70;
    transform: translateY(-1px);
}

.dry-combined-edit-btn.active[b-dqbrpheec8] {
    background: var(--ssy-blue);
    border-color: var(--ssy-blue);
}

/* ─── Tab panel ─────────────────────────────────────────────────── */
.dry-combined-content[b-dqbrpheec8] {
    min-height: 480px;
    margin-top: 14px;
    border-top: 2px solid var(--ssy-blue-light);
    padding-top: 8px;
    animation: dc-fade-b-dqbrpheec8 0.25s ease-out;
}

@keyframes dc-fade-b-dqbrpheec8 {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: none; }
}

.dry-combined-panel[b-dqbrpheec8] { display: none; }
.dry-combined-panel.active[b-dqbrpheec8] { display: block; animation: dc-fade-b-dqbrpheec8 0.2s ease-out; }

/* ─── Section headings (matches Geared section-h with accent bar) ─ */
.dc-section-h[b-dqbrpheec8] {
    font-family: var(--sans);
    color: var(--ssy-blue);
    font-size: 20px;
    font-weight: 700;
    margin: 26px 0 10px;
    letter-spacing: 0.3px;
    position: relative;
    padding-left: 12px;
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}

.dc-section-h[b-dqbrpheec8]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    border-radius: 3px;
    background: linear-gradient(180deg, var(--ssy-blue) 0%, var(--ssy-blue-light) 100%);
}

/* When a section heading is the first child of a column (e.g. the
 * Market Sentiment + Freight Futures pair at the top of Dry Cargo), drop
 * the default 26px top margin so the two columns align cleanly. */
.dc-col > .dc-section-h:first-child[b-dqbrpheec8] { margin-top: 0; }

.dc-section-sub[b-dqbrpheec8] {
    font-size: 13px;
    font-weight: 500;
    color: #6b7280;
    letter-spacing: 0;
    text-transform: none;
}

.dc-subsection-h[b-dqbrpheec8] {
    font-family: var(--sans);
    color: var(--ssy-navy);
    font-size: 16px;
    font-weight: 700;
    margin: 18px 0 6px;
    letter-spacing: 0.2px;
}

/* Comment-section heading — matches the Geared Mkt Rpt's Comment tab h3
 * (small blue, no accent bar, tight margins). Use this for prose sections;
 * keep .dc-section-h for tables and charts where the accent bar helps. */
.dc-comment-h[b-dqbrpheec8] {
    font-family: var(--sans);
    color: var(--ssy-blue-deep, #1c8fbf);
    font-size: 16px;
    font-weight: 700;
    margin: 18px 0 6px;
    letter-spacing: 0.2px;
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}

.dc-comment-h:first-child[b-dqbrpheec8] { margin-top: 0; }

/* ─── Layout grids ──────────────────────────────────────────────── */
.dc-grid-2[b-dqbrpheec8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 26px;
    margin: 4px 0 10px;
}

@media (max-width: 960px) {
    .dc-grid-2[b-dqbrpheec8] { grid-template-columns: 1fr; }
}

.dc-col[b-dqbrpheec8] { display: flex; flex-direction: column; }

.dc-chart-grid[b-dqbrpheec8] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin: 10px 0 0;
}

@media (max-width: 820px) {
    .dc-chart-grid[b-dqbrpheec8] { grid-template-columns: 1fr; }
}

/* ─── Top banner (replaces dryC-rpt-top-banner) ─────────────────── */
.dc-banner[b-dqbrpheec8] {
    background: linear-gradient(90deg, var(--ssy-deep) 0%, var(--ssy-blue) 80%);
    color: #fff;
    padding: 12px 18px;
    margin: 14px 0 16px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
    letter-spacing: 0.2px;
    box-shadow: 0 2px 8px rgba(0, 135, 203, 0.20);
    /* Strip inline styles + force a single-line layout so multi-headline
     * banners ("ATL: FIRM   PAC: FIRM   MID EAST: FIRM") sit on one row. */
    overflow-x: auto;
    white-space: normal;
}
.dc-banner br[b-dqbrpheec8] { display: none; }
.dc-banner p[b-dqbrpheec8] { display: inline; margin: 0; padding: 0; }
.dc-banner *[b-dqbrpheec8] {
    color: inherit !important;
    font-size: inherit !important;
    font-family: inherit !important;
    font-weight: inherit !important;
    background: transparent !important;
}

/* ─── Cards ─────────────────────────────────────────────────────── */
.dc-card[b-dqbrpheec8] {
    border: 1px solid #d8dde3;
    border-radius: 10px;
    background: linear-gradient(160deg, #fff 0%, #f7fbfd 100%);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.dc-card-h[b-dqbrpheec8] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 12px 16px 6px;
    border-bottom: 1px solid #e7e9ec;
}

.dc-card-h h3[b-dqbrpheec8] {
    font-family: var(--sans);
    color: var(--ssy-navy);
    font-size: 15px;
    font-weight: 700;
    margin: 0;
    letter-spacing: 0.2px;
}

.dc-card-note[b-dqbrpheec8] {
    font-size: 11px;
    color: #888;
    font-style: italic;
}

/* ─── Tables ────────────────────────────────────────────────────── */
.dc-table[b-dqbrpheec8] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13.5px;
    background: #fff;
}

.dc-card .dc-table[b-dqbrpheec8] { border-radius: 0 0 10px 10px; }

.dc-table thead th[b-dqbrpheec8] {
    background: var(--ssy-blue-pale);
    color: var(--ssy-navy);
    font-weight: 700;
    text-align: center;
    padding: 5px 10px;
    font-family: var(--sans);
    letter-spacing: 0.2px;
    font-size: 12px;
    text-transform: uppercase;
    border-bottom: 1px solid #c5e0ec;
}

.dc-table thead th.numeric[b-dqbrpheec8] { text-align: right; }
.dc-table thead th.dc-cell-label[b-dqbrpheec8] { text-align: left; }

.dc-table tbody td[b-dqbrpheec8] {
    padding: 4px 10px;
    vertical-align: middle;
    border-bottom: 1px solid #eef2f5;
    line-height: 1.35;
}

.dc-table tbody tr:nth-child(odd) td[b-dqbrpheec8] { background: #fafcfd; }
.dc-table tbody tr:hover td[b-dqbrpheec8] { background: #eaf6fb; }
.dc-table tbody tr:last-child td[b-dqbrpheec8] { border-bottom: none; }

.dc-cell-label[b-dqbrpheec8] {
    text-align: left;
    font-weight: 500;
    color: var(--ssy-grey);
}

.dc-cell-sublabel[b-dqbrpheec8] {
    text-align: left;
    color: #777;
    padding-left: 24px !important;
    font-size: 12.5px;
}

.dc-cell-numeric[b-dqbrpheec8] {
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    color: var(--ssy-navy);
    font-weight: 500;
}

.dc-cell-category[b-dqbrpheec8] {
    text-align: left;
    font-weight: 700;
    color: var(--ssy-navy);
    background: #fff !important;
}

.dc-cell-rowlabel[b-dqbrpheec8] {
    text-align: center;
    vertical-align: middle;
    font-weight: 700;
    color: var(--ssy-navy);
    background: #fff !important;
    border-right: 1px solid #e7e9ec;
}

.dc-cell-trend[b-dqbrpheec8] {
    text-align: right;
    font-weight: 600;
    color: var(--ssy-grey);
    font-variant-numeric: tabular-nums;
}

.dc-cell-trend.up[b-dqbrpheec8]   { color: var(--ssy-up); }
.dc-cell-trend.down[b-dqbrpheec8] { color: var(--ssy-down); }

.dc-row-bold td[b-dqbrpheec8] { font-weight: 700; }
.dc-row-bold td.dc-cell-label[b-dqbrpheec8] { color: var(--ssy-navy); }

/* Newbuild + tonnage tables use the same base but allow tighter padding */
.dc-table-newbuild thead th[b-dqbrpheec8] { background: var(--ssy-blue); color: #fff; }
.dc-table-newbuild thead th.dc-cell-label[b-dqbrpheec8] { color: #fff; }

.dc-table-tonnage[b-dqbrpheec8] { font-size: 12.5px; }
.dc-table-tonnage thead th[b-dqbrpheec8] { background: var(--ssy-navy); color: #fff; }

.dc-table-friday[b-dqbrpheec8] { font-size: 12.5px; margin-top: 4px; }
.dc-table-friday thead th[b-dqbrpheec8] { background: var(--ssy-blue); color: #fff; }

/* Market-sentiment matrix at the top of the Dry Cargo tab */
.dc-sentiment-table thead th:not(:first-child)[b-dqbrpheec8] { text-align: center; }
.dc-sentiment-table td.dc-sentiment-class[b-dqbrpheec8] {
    font-weight: 700;
    color: var(--ssy-navy);
    font-size: 14px;
    letter-spacing: 0.2px;
}
.dc-sentiment-cell[b-dqbrpheec8] {
    text-align: center;
    font-weight: 600;
    font-size: 13.5px;
    font-variant-numeric: tabular-nums;
}
.dc-sentiment-cell.up[b-dqbrpheec8]    { color: var(--ssy-up);   font-weight: 700; }
.dc-sentiment-cell.down[b-dqbrpheec8]  { color: var(--ssy-down); font-weight: 700; }
.dc-sentiment-cell.flat[b-dqbrpheec8]  { color: var(--ssy-grey); }
.dc-sentiment-table tbody tr:nth-child(odd) td[b-dqbrpheec8] { background: #fafcfd; }

/* ─── Prose / comment blocks (matches Geared Mkt Rpt's Comment tab) ─ */
.dc-prose[b-dqbrpheec8] {
    font-size: 1.1em !important;
    line-height: 1.55 !important;
    color: var(--ssy-grey) !important;
    font-family: var(--sans) !important;
    margin: 0 0 18px;
    min-height: 24px;
}

.dc-prose p[b-dqbrpheec8] { margin: 0 0 10px; }
.dc-prose p:last-child[b-dqbrpheec8] { margin-bottom: 0; }
.dc-prose b[b-dqbrpheec8], .dc-prose strong[b-dqbrpheec8] { color: var(--ssy-navy) !important; }

/* Broker entries carry inline font-size / font-family / color attributes
 * that would otherwise override .dc-prose and make different tabs read
 * at different scales. Force every descendant — regardless of how it
 * was saved — to inherit the comment block's typography. */
.dc-prose *[b-dqbrpheec8] {
    font-size: inherit !important;
    font-family: inherit !important;
    line-height: inherit !important;
    color: inherit !important;
}
.dc-prose b *[b-dqbrpheec8], .dc-prose strong *[b-dqbrpheec8],
.dc-prose * b[b-dqbrpheec8], .dc-prose * strong[b-dqbrpheec8] { color: var(--ssy-navy) !important; }

/* ─── Chart cards ───────────────────────────────────────────────── */
.dc-chart-card[b-dqbrpheec8] {
    border: 1px solid #d8dde3;
    border-radius: 10px;
    padding: 14px 16px 18px;
    background: #fff;
    position: relative;
    margin: 4px 0 8px;
}

.dc-chart-wide[b-dqbrpheec8] {
    /* Slightly more breathing room for solo charts */
    padding: 16px 18px 22px;
}

.dc-chart-title[b-dqbrpheec8] {
    font-family: var(--sans);
    color: var(--ssy-navy);
    font-size: 14px;
    font-weight: 700;
    margin: 0 0 8px;
    letter-spacing: 0.2px;
}

.dc-chart-source[b-dqbrpheec8] {
    position: absolute;
    top: 10px;
    right: 14px;
    font-size: 10.5px;
    font-style: italic;
    color: #999;
}

/* Pin embedded Highcharts to a fixed pixel height — Highcharts otherwise
 * defaults to ~400px which makes the 4-up TC Averages grid balloon. The
 * !important here beats any inline height Highcharts may sprinkle on the
 * chart container after it boots. */
.dc-chart-card[b-dqbrpheec8]  .highcharts-container,
.dc-chart-card[b-dqbrpheec8]  svg.highcharts-root {
    width: 100% !important;
    height: 100% !important;
}
.dc-chart-card[b-dqbrpheec8]  > div {
    height: 240px !important;
    max-height: 240px;
    overflow: hidden;
}
.dc-chart-wide[b-dqbrpheec8]  > div {
    height: 280px !important;
    max-height: 280px;
}
.dc-chart-grid .dc-chart-card[b-dqbrpheec8]  > div {
    height: 200px !important;
    max-height: 200px;
}

/* ─── Friday badge ──────────────────────────────────────────────── */
.dc-friday-badge[b-dqbrpheec8] {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.6px;
    color: #c87b0a;
    border: 1px solid #c87b0a;
    border-radius: 4px;
    padding: 2px 7px;
    background: #fff6e6;
    vertical-align: middle;
    text-transform: uppercase;
}

/* ─── Disclaimer footer ─────────────────────────────────────────── */
.dry-combined-disclaimer[b-dqbrpheec8] {
    margin-top: 40px;
    padding: 16px 0 4px;
    border-top: 1px solid #dadfe5;
    font-size: 11.5px;
    color: #888;
    line-height: 1.6;
}

.dry-combined-disclaimer strong[b-dqbrpheec8] { color: var(--ssy-navy); }
/* /Components/Pages/Bulkers/Reports/ECSA/Components/RptEcsaRatesTable.razor.rz.scp.css */
rpt-ecsa-table-td[b-guijbl8j7o] {
    font-size: 1em !important;
}
/* /Components/Pages/Bulkers/Reports/ECSA/RptEcsa.razor.rz.scp.css */

/* /Components/Pages/Bulkers/Reports/GearedMonthly/Components/GearedMonthlySummaryItem.razor.rz.scp.css */
/* ── Wrapper ── */
.gm-summary-item[b-9rcljrsz5p] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 12px;
}

.gm-summary-item--editing[b-9rcljrsz5p] {
    background: #f8fbfd;
    border: 1px solid #d0e4ef;
    border-radius: 8px;
    padding: 12px;
    position: relative;
}

/* ── Number badge ── */
.gm-summary-num[b-9rcljrsz5p] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #1f4e8a;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}

/* ── Body ── */
.gm-summary-body[b-9rcljrsz5p] {
    flex: 1;
    min-width: 0;
}

/* ── Title input (edit mode) ── */
.gm-summary-title-input[b-9rcljrsz5p] {
    width: 100%;
    font-size: 14px;
    font-weight: 700;
    color: #0087CB;
    border: none;
    border-bottom: 1px solid #c8d8e4;
    background: transparent;
    padding: 2px 0 4px;
    margin-bottom: 8px;
    outline: none;
    box-sizing: border-box;
    font-family: inherit;
}

.gm-summary-title-input:focus[b-9rcljrsz5p] {
    border-bottom-color: #0087CB;
}

.gm-summary-title-input[b-9rcljrsz5p]::placeholder {
    color: #bbb;
    font-weight: 400;
}

/* ── Editor wrapper ── */
.gm-summary-editor[b-9rcljrsz5p] {
    min-height: 80px;
}

/* ── Display mode ── */
.gm-summary-title-display[b-9rcljrsz5p] {
    font-size: 14.5px;
    font-weight: 700;
    color: #0087CB;
    margin-bottom: 3px;
}

.gm-summary-text-display[b-9rcljrsz5p] {
    font-size: 12.5px;
    color: #4a5568;
    line-height: 1.5;
}

/* ── Delete button ── */
.gm-summary-delete-btn[b-9rcljrsz5p] {
    flex-shrink: 0;
    background: none;
    border: 1px solid #e2e8f0;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: #aaa;
    cursor: pointer;
    padding: 0;
    transition: background .15s, color .15s, border-color .15s;
    align-self: flex-start;
    margin-top: 4px;
}

.gm-summary-delete-btn:hover[b-9rcljrsz5p] {
    background: #fee2e2;
    color: #e23b3b;
    border-color: #e23b3b;
}
/* /Components/Pages/Bulkers/Reports/GearedMonthly/Components/Sections/CommodityMarkets/CommodityMarketsSection.razor.rz.scp.css */
/* ================================================================
   Commodity Markets section — GearedMonthly
   Three-column layout: Energy | Metals | Agricultural
   ================================================================ */

/* ── Section wrapper ─────────────────────────────────────── */
.gm-comm-section[b-6i4u9ro5ly] {
    padding: 0 0 2rem;
}

/* ── Toolbar ─────────────────────────────────────────────── */
.gm-comm-toolbar[b-6i4u9ro5ly] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 1.25rem;
}

.gm-comm-asof[b-6i4u9ro5ly] {
    font-size: 0.78rem;
    color: #6b7280;
    margin-top: 1rem;
    text-align: right;
}

/* ── Three-column grid ───────────────────────────────────── */
/*
 * Subgrid approach: each .gm-comm-col spans 3 row tracks (heading,
 * commentary, charts) and adopts those tracks from the parent via
 * grid-template-rows: subgrid. CSS therefore sizes each row by the
 * tallest item across all three columns, so the chart grids always
 * start at the same vertical position regardless of commentary length.
 */
.gm-comm-columns[b-6i4u9ro5ly] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    column-gap: 1.5rem;
    row-gap: 0.75rem;   /* shared gap between heading / commentary / charts rows */
}

@media (max-width: 1100px) {
    .gm-comm-columns[b-6i4u9ro5ly] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 700px) {
    .gm-comm-columns[b-6i4u9ro5ly] {
        grid-template-columns: 1fr;
    }
}

/* ── Column ──────────────────────────────────────────────── */
.gm-comm-col[b-6i4u9ro5ly] {
    display: grid;
    grid-row: span 3;           /* occupy the same 3 row tracks as siblings */
    grid-template-rows: subgrid; /* heading / commentary / charts share parent row heights */
    align-content: start;
}

.gm-comm-col-h[b-6i4u9ro5ly] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #000061;
    margin: 0 0 0.25rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #000061;
}

/* ── Chart grid within a column ─────────────────────────── */
.gm-comm-charts[b-6i4u9ro5ly] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
    /* Don't stretch rows to fill the shared track height — keeps the
       chart rows packed at the top so all columns line up. */
    align-content: start;
    align-items: start;
}

.gm-comm-chart-wrap[b-6i4u9ro5ly] {
    position: relative;
}

    /* Dim hidden charts in edit mode */
    .gm-comm-chart-wrap.hidden-chart[b-6i4u9ro5ly] {
        opacity: 0.45;
    }

    /* Show/hide toggle button */
    .gm-comm-chart-wrap.editing .gm-comm-toggle-btn[b-6i4u9ro5ly] {
        display: flex;
    }

.gm-comm-toggle-btn[b-6i4u9ro5ly] {
    display: none;
    position: absolute;
    top: 4px;
    right: 4px;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 0.7rem;
    font-weight: 600;
    line-height: 1;
    padding: 3px 6px;
    z-index: 2;
    transition: background 0.15s;
}

.gm-comm-toggle-btn--hide[b-6i4u9ro5ly] {
    background: rgba(220, 38, 38, 0.85);
    color: #fff;
}

    .gm-comm-toggle-btn--hide:hover[b-6i4u9ro5ly] {
        background: rgb(220, 38, 38);
    }

.gm-comm-toggle-btn--show[b-6i4u9ro5ly] {
    background: rgba(0, 0, 97, 0.80);
    color: #fff;
}

    .gm-comm-toggle-btn--show:hover[b-6i4u9ro5ly] {
        background: #000061;
    }

/* ── Cell styles (replicated from RptCommodityPrices — CSS isolation) ── */
[b-6i4u9ro5ly] .ssy-comm-cell {
    border: none;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

[b-6i4u9ro5ly] .ssy-comm-cell-head {
    background: transparent;
    padding: 6px 4px 2px;
    text-align: left;
    line-height: 1.2;
}

[b-6i4u9ro5ly] .ssy-comm-cell-head .name {
    font-family: var(--sans);
    font-weight: 800;
    font-size: 13px;
    color: #000061;
}

[b-6i4u9ro5ly] .ssy-comm-cell-head .desc {
    font-style: italic;
    font-size: 10px;
    margin-top: 1px;
    color: #888;
}

[b-6i4u9ro5ly] .ssy-comm-cell-chart {
    flex: 1;
    min-height: 160px;
    padding: 0 4px 4px;
}

[b-6i4u9ro5ly] .ssy-comm-cell-meta {
    display: flex;
    justify-content: space-between;
    padding: 5px 10px 0;
    font-size: 11px;
    color: #777;
}

[b-6i4u9ro5ly] .ssy-comm-cell-meta .last        { font-weight: 700; color: #000061; font-size: 12px; }
[b-6i4u9ro5ly] .ssy-comm-cell-meta .delta.up    { color: #2aaf57; font-weight: 700; }
[b-6i4u9ro5ly] .ssy-comm-cell-meta .delta.down  { color: #e23b3b; font-weight: 700; }
[b-6i4u9ro5ly] .ssy-comm-cell-meta .delta.flat  { color: #777; }

[b-6i4u9ro5ly] .ssy-comm-cell.skeleton .ssy-comm-cell-head .name,
[b-6i4u9ro5ly] .ssy-comm-cell.skeleton .ssy-comm-cell-head .desc {
    background: linear-gradient(90deg, #e8edf2 25%, #f5f7f9 50%, #e8edf2 75%);
    background-size: 200% 100%;
    animation: comm-shimmer-b-6i4u9ro5ly 1.4s linear infinite;
    border-radius: 3px;
    min-height: 14px;
    color: transparent;
}

@keyframes comm-shimmer-b-6i4u9ro5ly {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.gm-comm-no-charts[b-6i4u9ro5ly] {
    grid-column: 1 / -1;
    font-size: 0.8rem;
    color: #9ca3af;
    font-style: italic;
    padding: 0.5rem 0;
}

/* ── Commentary area ─────────────────────────────────────── */
.gm-comm-commentary[b-6i4u9ro5ly] {
    margin-top: 0.25rem;
}

.gm-comm-editor[b-6i4u9ro5ly] {
    min-height: 140px;
}

.gm-comm-text[b-6i4u9ro5ly] {
    font-size: 0.85rem;
    line-height: 1.6;
    color: #1f2937;
}

    .gm-comm-text p[b-6i4u9ro5ly] {
        margin: 0 0 0.5em;
    }

.gm-comm-empty[b-6i4u9ro5ly] {
    font-size: 0.8rem;
    color: #9ca3af;
    margin: 0;
}
/* /Components/Pages/Bulkers/Reports/GearedMonthly/Components/Sections/FfaDerivativeMarkets/FfaDerivativeMarketsSection.razor.rz.scp.css */
/* ================================================================
   FFA Derivative Markets section — GearedMonthly
   Three-column layout: Forward Curve | Candlestick Chart | Indicators
   ================================================================ */

.gm-ffa-section[b-3nxy121hry] {
    padding: 0 0 2rem;
}

/* ── Three-column grid ───────────────────────────────────── */
.gm-ffa-columns[b-3nxy121hry] {
    display: grid;
    grid-template-columns: minmax(220px, 300px) 1fr minmax(330px, 450px);
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 1200px) {
    .gm-ffa-columns[b-3nxy121hry] {
        grid-template-columns: minmax(200px, 280px) 1fr;
    }

    .gm-ffa-col--right[b-3nxy121hry] {
        grid-column: 1 / -1;
    }
}

@media (max-width: 720px) {
    .gm-ffa-columns[b-3nxy121hry] {
        grid-template-columns: 1fr;
    }
}

/* ── Column shared ───────────────────────────────────────── */
.gm-ffa-col[b-3nxy121hry] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.gm-ffa-col-h[b-3nxy121hry] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #000061;
    margin: 0 0 0.25rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #000061;
    display: flex;
    align-items: baseline;
    gap: 0.4rem;
}

.gm-ffa-period-accent[b-3nxy121hry] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #01A39E;
    text-transform: none;
    letter-spacing: 0;
}

.gm-ffa-period-accent--lg[b-3nxy121hry] {
    font-size: 0.95rem; /* matches heading size */
}

/* ── Forward curve table ─────────────────────────────────── */
.gm-ffa-table[b-3nxy121hry] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.gm-ffa-table thead tr[b-3nxy121hry] {
    background: #000061;
    color: #fff;
}

.gm-ffa-table thead th[b-3nxy121hry] {
    padding: 5px 8px;
    font-weight: 600;
    font-size: 0.72rem;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.gm-ffa-table thead th.num[b-3nxy121hry] {
    text-align: right;
}

.gm-ffa-table tbody tr[b-3nxy121hry] {
    border-bottom: 1px solid #e5e7eb;
    cursor: pointer;
    transition: background 0.1s;
}

.gm-ffa-table tbody tr:hover[b-3nxy121hry] {
    background: #f0f4ff;
}

.gm-ffa-table tbody tr.selected[b-3nxy121hry] {
    background: #e8edf8;
}

.gm-ffa-table tbody td[b-3nxy121hry] {
    padding: 4px 8px;
    color: #1f2937;
}

.gm-ffa-table td.period[b-3nxy121hry] {
    font-weight: 600;
    color: #000061;
    white-space: nowrap;
}

.gm-ffa-table td.num[b-3nxy121hry] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.gm-ffa-table td.bold[b-3nxy121hry] {
    font-weight: 700;
}

/* ── Group header rows ───────────────────────────────────── */
.gm-ffa-table tr.gm-ffa-group-header td[b-3nxy121hry] {
    background: #eef1f8;
    color: #000061;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 3px 8px;
    border-top: 2px solid #000061;
    cursor: default;
}

.gm-ffa-table tr.gm-ffa-group-header:first-child td[b-3nxy121hry] {
    border-top: none;
}

/* ── Change badge ────────────────────────────────────────── */
.gm-ffa-chg[b-3nxy121hry] {
    display: inline-block;
    padding: 1px 5px;
    border-radius: 3px;
    font-weight: 700;
    font-size: 0.78rem;
}

.gm-ffa-chg.ffa-pos[b-3nxy121hry] {
    background: #dcfce7;
    color: #166534;
}

.gm-ffa-chg.ffa-neg[b-3nxy121hry] {
    background: #fee2e2;
    color: #991b1b;
}

.gm-ffa-asof[b-3nxy121hry] {
    font-size: 0.72rem;
    color: #6b7280;
    text-align: right;
    margin-top: 0.4rem;
}

.gm-ffa-asof time[b-3nxy121hry] {
    color: #0087CB;
    font-weight: 600;
}

/* ── Chart column ────────────────────────────────────────── */
.gm-ffa-chart-wrap[b-3nxy121hry] {
    width: 100%;
    min-height: 806px;
}

.gm-ffa-chart-empty[b-3nxy121hry] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 220px;
    background: #f8fafc;
    border-radius: 8px;
    color: #9ca3af;
    font-size: 0.85rem;
    font-style: italic;
    border: 1px dashed #d1d5db;
}

.gm-ffa-loading[b-3nxy121hry],
.gm-ffa-empty[b-3nxy121hry] {
    font-size: 0.82rem;
    color: #9ca3af;
    font-style: italic;
    padding: 0.5rem 0;
}

/* ── Right placeholder panel ─────────────────────────────── */
.gm-ffa-placeholder-panel[b-3nxy121hry] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.gm-ffa-placeholder-label[b-3nxy121hry] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.25rem;
}

.gm-ffa-placeholder-box[b-3nxy121hry] {
    background: #f8fafc;
    border-radius: 6px;
    border: 1px dashed #d1d5db;
    padding: 1.25rem 1rem;
    text-align: center;
    color: #9ca3af;
    font-size: 0.8rem;
    font-style: italic;
}

/* ── EWMAC speed selector ────────────────────────────── */
.gm-ewmac-speeds[b-3nxy121hry] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-bottom: 0.6rem;
}

.gm-ewmac-speed-btn[b-3nxy121hry] {
    padding: 2px 8px;
    font-size: 0.72rem;
    font-weight: 600;
    border-radius: 12px;
    border: 1.5px solid #000061;
    background: #fff;
    color: #000061;
    cursor: pointer;
    transition: background 0.12s, color 0.12s;
    line-height: 1.6;
}

.gm-ewmac-speed-btn:hover[b-3nxy121hry] {
    background: #eef1f8;
}

.gm-ewmac-speed-btn.active[b-3nxy121hry] {
    background: #000061;
    color: #fff;
}

/* ── EWMAC chart ─────────────────────────────────────── */
.gm-ewmac-chart-wrap[b-3nxy121hry] {
    width: 100%;
}

/* ── Correlation matrix ──────────────────────────────── */
.gm-corr-table[b-3nxy121hry] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.75rem;
    margin-bottom: 0.25rem;
}

.gm-corr-table thead th[b-3nxy121hry] {
    background: #000061;
    color: #fff;
    padding: 4px 6px;
    font-weight: 600;
    font-size: 0.68rem;
    text-align: center;
    letter-spacing: 0.03em;
}

.gm-corr-table thead th:first-child[b-3nxy121hry] {
    background: transparent;
}

.gm-corr-table tbody td[b-3nxy121hry] {
    padding: 4px 6px;
    text-align: center;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    border: 1px solid #e5e7eb;
}

.gm-corr-table td.gm-corr-label[b-3nxy121hry] {
    background: #000061;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 600;
    text-align: left;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

/* ── Sub-section heading ─────────────────────────────── */
.gm-ewmac-subhead[b-3nxy121hry] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 1rem 0 0.25rem;
    padding-bottom: 0.3rem;
    border-bottom: 1.5px solid #000061;
}

/* ── Preset parameters line ──────────────────────────── */
.gm-ewmac-params[b-3nxy121hry] {
    font-size: 0.72rem;
    color: #6b7280;
    margin-top: -0.25rem;
    margin-bottom: 0.15rem;
}

/* ── Signal legend ───────────────────────────────────── */
.gm-ewmac-legend[b-3nxy121hry] {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    font-size: 0.72rem;
    color: #374151;
    margin-top: -1.2rem;
    margin-bottom: 0.25rem;
    position: relative;
    z-index: 10;
}

.gm-ewmac-legend-item[b-3nxy121hry] {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.gm-ewmac-dot[b-3nxy121hry] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
}
/* /Components/Pages/Bulkers/Reports/GearedMonthly/Components/Sections/PhysicalMarketRates/PhysicalMarketRatesSection.razor.rz.scp.css */
/* ================================================================
   Physical Market Rates section — GearedMonthly
   Layout: region tabs → two-column (rates+commentary | trend charts)
   ================================================================ */

.gm-phys-section[b-k7vk9a5imy] {
    padding: 0 0 2rem;
}

/* ── Region tabs ──────────────────────────────────────────────── */
.gm-phys-region-tabs[b-k7vk9a5imy] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.gm-phys-region-tab[b-k7vk9a5imy] {
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.35rem 1rem;
    border-radius: 20px;
    border: 1.5px solid #000061;
    background: transparent;
    color: #000061;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.gm-phys-region-tab:hover:not(.placeholder):not(.active)[b-k7vk9a5imy] {
    background: #e8edf5;
}

.gm-phys-region-tab.active[b-k7vk9a5imy] {
    background: #000061;
    color: #fff;
}

.gm-phys-region-tab.placeholder[b-k7vk9a5imy] {
    border-color: #c8cdd5;
    color: #9ca3af;
    cursor: not-allowed;
}

.gm-phys-soon[b-k7vk9a5imy] {
    font-style: italic;
    font-weight: 400;
    font-size: 0.72rem;
    margin-left: 0.25rem;
}

/* ── Two-column layout ────────────────────────────────────────── */
.gm-phys-layout[b-k7vk9a5imy] {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 2rem;
    align-items: start;
}

@media (max-width: 1100px) {
    .gm-phys-layout[b-k7vk9a5imy] {
        grid-template-columns: 1fr;
    }
}

/* ── Left column ─────────────────────────────────────────────── */
.gm-phys-left[b-k7vk9a5imy] {
    min-width: 0;
}

/* Block headers (rates / commentary) */
.gm-phys-block-header[b-k7vk9a5imy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.6rem;
}

.gm-phys-block-header--cmt[b-k7vk9a5imy] {
    margin-top: 1.5rem;
}

.gm-phys-col-h[b-k7vk9a5imy] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #000061;
    margin: 0;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #000061;
    flex: 1;
}

.gm-phys-note[b-k7vk9a5imy] {
    font-size: 0.72rem;
    color: #9ca3af;
    font-style: italic;
    margin: 0.4rem 0 0;
}

/* Weekly-report source attribution */
.gm-phys-source-note[b-k7vk9a5imy] {
    font-size: 0.72rem;
    color: #6b7280;
    margin: 0.5rem 0 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.gm-phys-source-badge[b-k7vk9a5imy] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #0087CB;
    border: 1px solid #0087CB;
    border-radius: 3px;
    padding: 1px 5px;
    white-space: nowrap;
}

/* Per-section edit row layout */
.gm-phys-cmt-row[b-k7vk9a5imy] {
    margin-bottom: 0.5rem;
}

.gm-phys-cmt-subrow[b-k7vk9a5imy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.25rem;
    min-height: 1.6rem;
}

/* "edited" badge shown next to sub-heading when an override is saved */
.gm-phys-override-badge[b-k7vk9a5imy] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #fff;
    background: #01A39E;
    border-radius: 3px;
    padding: 1px 5px;
    white-space: nowrap;
}

/* Revert button */
.gm-phys-revert-btn[b-k7vk9a5imy] {
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 600;
    color: #6b7280;
    background: transparent;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 1px 7px;
    cursor: pointer;
    transition: border-color 0.12s, color 0.12s;
}

    .gm-phys-revert-btn:hover[b-k7vk9a5imy] {
        border-color: #9ca3af;
        color: #374151;
    }

/* Commentary */
.gm-phys-sub-h[b-k7vk9a5imy] {
    font-size: 0.82rem;
    font-weight: 700;
    color: #000061;
    margin: 1rem 0 0.3rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.gm-phys-prose[b-k7vk9a5imy] {
    font-size: 0.85rem;
    line-height: 1.65;
    color: #1f2937;
}

    .gm-phys-prose p[b-k7vk9a5imy] { margin: 0 0 0.5em; }

.gm-phys-editor[b-k7vk9a5imy] {
    margin-bottom: 1rem;
}

.gm-phys-empty[b-k7vk9a5imy] {
    font-size: 0.82rem;
    color: #9ca3af;
    margin: 0.25rem 0;
}

.gm-phys-loading[b-k7vk9a5imy] {
    font-size: 0.82rem;
    color: #9ca3af;
    font-style: italic;
    margin: 0.25rem 0;
}

/* ── Right column: charts ─────────────────────────────────────── */
.gm-phys-right[b-k7vk9a5imy] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.gm-phys-chart-card[b-k7vk9a5imy] {
    border: 1px solid #dde3ea;
    border-radius: 8px;
    padding: 10px 12px 8px;
    background: linear-gradient(180deg, #ffffff 0%, #f7fbfd 100%);
    box-shadow: 0 1px 3px rgba(0, 0, 97, 0.05);
}

.gm-phys-chart-label[b-k7vk9a5imy] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #000061;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0 0 4px;
}

.gm-phys-chart-wrap[b-k7vk9a5imy] {
    height: 180px;
}

/* Rates table: inherit scoped styles from the shared table component.
   The ::deep combinator reaches into RptSsyGearedRatesTable's rendered HTML. */
[b-k7vk9a5imy] .rpt-ssy-geared-rates th {
    font-size: 0.78rem;
}

[b-k7vk9a5imy] .rpt-ssy-geared-rates td {
    font-size: 0.78rem;
}

/* ════════════════════════════════════════════════════════════════
   Baltic Exchange subpage
   ════════════════════════════════════════════════════════════════ */

.gm-baltic-layout[b-k7vk9a5imy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 2rem;
    align-items: start;
}

@media (max-width: 1100px) {
    .gm-baltic-layout[b-k7vk9a5imy] {
        grid-template-columns: 1fr;
    }
}

.gm-baltic-left[b-k7vk9a5imy] {
    min-width: 0;
}

/* ── Assessments table ── */
.gm-baltic-table[b-k7vk9a5imy] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

    .gm-baltic-table th[b-k7vk9a5imy] {
        text-align: left;
        font-size: 0.72rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: #6b7280;
        padding: 0.45rem 0.6rem;
        border-bottom: 2px solid #000061;
        white-space: nowrap;
    }

    .gm-baltic-table th.num[b-k7vk9a5imy],
    .gm-baltic-table td.num[b-k7vk9a5imy] {
        text-align: right;
        font-variant-numeric: tabular-nums;
    }

    .gm-baltic-table td[b-k7vk9a5imy] {
        padding: 0.42rem 0.6rem;
        border-bottom: 1px solid #eceff3;
        color: #1f2937;
    }

.gm-baltic-row[b-k7vk9a5imy] {
    cursor: pointer;
    transition: background 0.1s;
}

    .gm-baltic-row:hover[b-k7vk9a5imy] {
        background: #f0f5fa;
    }

    .gm-baltic-row.selected[b-k7vk9a5imy] {
        background: #e4ecf7;
        box-shadow: inset 3px 0 0 #000061;
    }

.gm-baltic-route[b-k7vk9a5imy] {
    font-weight: 700;
    color: #000061;
    white-space: nowrap;
}

/* Index averages at the foot of the table */
.gm-baltic-row.index-row td[b-k7vk9a5imy] {
    border-top: 2px solid #000061;
    background: #f5f8fc;
    font-weight: 600;
}

/* Only the first index row carries the heavy separator */
.gm-baltic-row.index-row + .gm-baltic-row.index-row td[b-k7vk9a5imy] {
    border-top: 1px solid #eceff3;
}

.gm-baltic-row.index-row.selected td[b-k7vk9a5imy] {
    background: #e4ecf7;
}

.gm-baltic-name[b-k7vk9a5imy] {
    color: #4b5563;
    font-size: 0.76rem;
}

.gm-baltic-current[b-k7vk9a5imy] {
    font-weight: 700;
}

.gm-baltic-up[b-k7vk9a5imy] {
    color: #0e9f6e;
    font-size: 0.6rem;
    margin-left: 0.25rem;
}

.gm-baltic-down[b-k7vk9a5imy] {
    color: #C8102E;
    font-size: 0.6rem;
    margin-left: 0.25rem;
}

.gm-baltic-asat[b-k7vk9a5imy] {
    font-size: 0.72rem;
    color: #6b7280;
    white-space: nowrap;
}

    .gm-baltic-asat.stale[b-k7vk9a5imy] {
        color: #C8102E;
        font-weight: 600;
    }

/* ── History chart (right column, under the map) ── */
.gm-baltic-chart-card[b-k7vk9a5imy] {
    margin-top: 0;
}

.gm-baltic-chart-wrap[b-k7vk9a5imy] {
    height: 220px;
}

.gm-baltic-name[b-k7vk9a5imy] {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Route map ── */
.gm-baltic-right[b-k7vk9a5imy] {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    min-width: 0;
}

/* Map + definition side by side (each ~quarter of the page) */
.gm-baltic-right-top[b-k7vk9a5imy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.gm-baltic-map-card[b-k7vk9a5imy] {
    border: 1px solid #dde3ea;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 97, 0.05);
    min-width: 0;
}

.gm-baltic-map[b-k7vk9a5imy] {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
}

.gm-baltic-def[b-k7vk9a5imy] {
    min-width: 0;
}

.gm-baltic-map-legend[b-k7vk9a5imy] {
    display: flex;
    gap: 1.2rem;
    padding: 0.5rem 0.75rem;
    border-top: 1px solid #eceff3;
    font-size: 0.74rem;
    font-weight: 600;
    color: #374151;
}

.gm-baltic-dot[b-k7vk9a5imy] {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 0.3rem;
}

.gm-baltic-dot--from[b-k7vk9a5imy] {
    background: #01A39E;
}

.gm-baltic-dot--to[b-k7vk9a5imy] {
    background: #C8102E;
}

.gm-baltic-map-note[b-k7vk9a5imy] {
    padding: 0.5rem 0.75rem;
    border-top: 1px solid #eceff3;
    font-size: 0.74rem;
    font-style: italic;
    color: #6b7280;
    margin: 0;
}

/* ════════════════════════════════════════════════════════════════
   Global subpage (weekly Handysize/Supramax physical report)
   ════════════════════════════════════════════════════════════════ */

.gm-global-layout[b-k7vk9a5imy] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 480px);
    gap: 2rem;
    align-items: start;
}

@media (max-width: 1100px) {
    .gm-global-layout[b-k7vk9a5imy] {
        grid-template-columns: 1fr;
    }
}

.gm-global-left[b-k7vk9a5imy] {
    min-width: 0;
}

.gm-global-right[b-k7vk9a5imy] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    min-width: 0;
}

/* Commentary prose — same size as the South Atlantic commentary.
   The weekly report editor saves inline font sizes intended for the
   printed page, so force everything to inherit the on-screen size. */
.gm-global-prose[b-k7vk9a5imy] {
    font-size: 0.85rem;
}

    [b-k7vk9a5imy] .gm-global-prose * {
        font-size: inherit !important;
        line-height: inherit !important;
    }

/* Rates table — site-wide ssy-table-lw look, sized to match the
   South Atlantic indicative rates table (0.78rem) */
.gm-global-table[b-k7vk9a5imy] {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 0.6rem;
}

    .gm-global-table th[b-k7vk9a5imy] {
        font-size: 0.78rem;
        text-align: left;
        padding: 0.3rem 0.5rem;
        white-space: nowrap;
    }

    .gm-global-table td[b-k7vk9a5imy] {
        font-size: 0.78rem;
        padding: 0.26rem 0.5rem;
    }

    .gm-global-table th.num[b-k7vk9a5imy],
    .gm-global-table td.num[b-k7vk9a5imy] {
        text-align: right;
        font-variant-numeric: tabular-nums;
    }

.gm-global-row[b-k7vk9a5imy] {
    cursor: pointer;
}

    .gm-global-table tbody tr.gm-global-row.selected[b-k7vk9a5imy] {
        background-color: #B5CBD6;
        box-shadow: inset 3px 0 0 #000061;
    }

/* Top banner strip, echoing the weekly report's banner */
.gm-global-banner[b-k7vk9a5imy] {
    background: #000061;
    color: #fff;
    font-size: 0.85rem;
    font-weight: 500;
    line-height: 1.5;
    border-radius: 6px;
    padding: 0.6rem 0.9rem;
    margin: 0.25rem 0 0.75rem;
}

    .gm-global-banner p[b-k7vk9a5imy] {
        margin: 0;
    }

.gm-global-link[b-k7vk9a5imy] {
    align-self: flex-start;
    font-size: 0.8rem;
    font-weight: 600;
    color: #0087CB;
    text-decoration: none;
    border: 1.5px solid #0087CB;
    border-radius: 20px;
    padding: 0.3rem 0.9rem;
    transition: background 0.15s, color 0.15s;
}

    .gm-global-link:hover[b-k7vk9a5imy] {
        background: #0087CB;
        color: #fff;
    }

/* ── Route definition ── */
.gm-baltic-def-h[b-k7vk9a5imy] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #000061;
    margin: 0 0 0.35rem;
}

    .gm-baltic-def-h span[b-k7vk9a5imy] {
        font-weight: 500;
        color: #4b5563;
        font-size: 0.8rem;
        margin-left: 0.4rem;
    }

.gm-baltic-def-text[b-k7vk9a5imy] {
    font-size: 0.8rem;
    line-height: 1.6;
    color: #1f2937;
    margin: 0 0 0.4rem;
}

.gm-baltic-def-vessel[b-k7vk9a5imy] {
    font-size: 0.7rem;
    line-height: 1.55;
    color: #6b7280;
    margin: 0 0 0.4rem;
    padding-top: 0.35rem;
    border-top: 1px dashed #dde3ea;
}
/* /Components/Pages/Bulkers/Reports/GearedMonthly/Components/Sections/Utilisation/UtilisationSection.razor.rz.scp.css */
/* ================================================================
   Utilisation section — GearedMonthly
   Layout: KPI cards (left) + headline chart (right) / 3 charts below
   ================================================================ */

.gm-util-section[b-x6mgqkjs91] {
    padding: 0 0 2rem;
}

/* ── Top row: KPIs + headline chart ─────────────────────────── */
.gm-util-top[b-x6mgqkjs91] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 1.5rem;
    align-items: start;
    margin-bottom: 1.5rem;
}

/* ── KPI cards stack ─────────────────────────────────────────── */
.gm-util-kpis[b-x6mgqkjs91] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.gm-util-kpi[b-x6mgqkjs91] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-left: 4px solid #000061;
    border-radius: 0 6px 6px 0;
    padding: 0.5rem 0.75rem;
}

.gm-util-kpi--headline[b-x6mgqkjs91] {
    background: #000061;
    border-left-color: #01A39E;
    border-color: #000061;
}

.gm-util-kpi--headline .gm-util-kpi-label[b-x6mgqkjs91] {
    color: rgba(255, 255, 255, 0.8);
}

.gm-util-kpi--headline .gm-util-kpi-value[b-x6mgqkjs91] {
    color: #ffffff;
    font-size: 1.6rem;
}

.gm-util-kpi--headline .gm-util-kpi-sub[b-x6mgqkjs91] {
    color: rgba(255, 255, 255, 0.65);
}

.gm-util-kpi-label[b-x6mgqkjs91] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    margin-bottom: 0.1rem;
}

.gm-util-kpi-value[b-x6mgqkjs91] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #000061;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}

.gm-util-kpi-sub[b-x6mgqkjs91] {
    font-size: 0.68rem;
    color: #9ca3af;
    margin-top: 0.1rem;
}

/* ── Headline chart column ───────────────────────────────────── */
.gm-util-headline-chart[b-x6mgqkjs91] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* ── Headline chart header (title + tabs row) ────────────────── */
.gm-util-headline-header[b-x6mgqkjs91] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
}

.gm-util-headline-header .gm-util-col-h[b-x6mgqkjs91] {
    flex: 1;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

/* ── Chart mode tabs ─────────────────────────────────────────── */
.gm-util-chart-tabs[b-x6mgqkjs91] {
    display: flex;
    gap: 0.25rem;
    align-items: center;
}

.gm-util-chart-tab[b-x6mgqkjs91] {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.18rem 0.6rem;
    border-radius: 99px;
    border: 1px solid #000061;
    background: transparent;
    color: #000061;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.gm-util-chart-tab.active[b-x6mgqkjs91],
.gm-util-chart-tab:hover[b-x6mgqkjs91] {
    background: #000061;
    color: #fff;
}

/* ── Column heading ──────────────────────────────────────────── */
.gm-util-col-h[b-x6mgqkjs91] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #000061;
    margin: 0 0 0.25rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #000061;
}

/* ── Bottom row: three decomposition charts ──────────────────── */
.gm-util-bottom[b-x6mgqkjs91] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.gm-util-chart-cell[b-x6mgqkjs91] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* ── Loading / empty states ──────────────────────────────────── */
.gm-util-loading[b-x6mgqkjs91],
.gm-util-empty[b-x6mgqkjs91] {
    font-size: 0.82rem;
    color: #9ca3af;
    font-style: italic;
    padding: 0.5rem 0;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .gm-util-top[b-x6mgqkjs91] {
        grid-template-columns: 1fr;
    }

    .gm-util-kpis[b-x6mgqkjs91] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .gm-util-kpi[b-x6mgqkjs91] {
        flex: 1 1 calc(33% - 0.5rem);
        min-width: 140px;
    }

    .gm-util-bottom[b-x6mgqkjs91] {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 720px) {
    .gm-util-bottom[b-x6mgqkjs91] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Bulkers/Reports/GearedMonthly/Components/Sections/VesselDemand/VesselDemandSection.razor.rz.scp.css */
/* ================================================================
   Vessel Demand section — GearedMonthly
   ================================================================ */

.gm-demand-section[b-3hnpfv7lb3] {
    padding: 0 0 2rem;
}

/* ── Top layout: table col (left) + chart panel (right) ──────── */
.gm-demand-top[b-3hnpfv7lb3] {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 1.5rem;
    align-items: start;
}

/* Prevent the table column from blowing out the grid */
.gm-demand-table-col[b-3hnpfv7lb3] {
    min-width: 0;
}

/* ── Section heading ─────────────────────────────────────────── */
.gm-demand-col-h[b-3hnpfv7lb3] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #000061;
    margin: 0 0 0.25rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #000061;
}

.gm-demand-col-h-sub[b-3hnpfv7lb3] {
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0.01em;
    color: #4b5563;
    font-size: 0.8rem;
}

/* ── Table header row ────────────────────────────────────────── */
.gm-demand-table-header[b-3hnpfv7lb3] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.gm-demand-table-header .gm-demand-col-h[b-3hnpfv7lb3] {
    flex: 1;
    margin-bottom: 0;
    border-bottom: none;
    padding-bottom: 0;
}

/* ── Metric toggle tabs ──────────────────────────────────────── */
.gm-demand-tabs[b-3hnpfv7lb3] {
    display: flex;
    gap: 0.25rem;
}

.gm-demand-tab[b-3hnpfv7lb3] {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.18rem 0.6rem;
    border-radius: 99px;
    border: 1px solid #000061;
    background: transparent;
    color: #000061;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.gm-demand-tab.active[b-3hnpfv7lb3],
.gm-demand-tab:hover[b-3hnpfv7lb3] {
    background: #000061;
    color: #fff;
}

/* ── Two-table container ─────────────────────────────────────── */
.gm-demand-tables-container[b-3hnpfv7lb3] {
    display: flex;
    align-items: start;
}

/* Label column table — truly frozen, no scroll */
.gm-demand-tbl-labels[b-3hnpfv7lb3] {
    flex-shrink: 0;
    width: 170px;
    table-layout: fixed;
    border-right: 2px solid #000061;
}

/* Annual scroll wrapper — only the data year columns scroll */
.gm-demand-annual-scroll[b-3hnpfv7lb3] {
    overflow-x: auto;
    flex-shrink: 0;
    /* Show 2 years: 2 × 3 cols × 48px = 288px */
    width: 288px;
    border-right: 2px solid #000061;
    scrollbar-width: thin;
}

/* Annual data table — expands to full content width */
.gm-demand-tbl-annual[b-3hnpfv7lb3] {
    width: max-content;
    table-layout: fixed;
}

/* Right scrolling table wrapper */
.gm-demand-quarterly-scroll[b-3hnpfv7lb3] {
    overflow-x: auto;
    flex: 1;
    min-width: 0;
}

/* Quarterly table: expand to natural column width so scrolling kicks in */
.gm-demand-tbl-quarterly[b-3hnpfv7lb3] {
    width: max-content;
    min-width: 100%;
}

/* ── Shared table styles ─────────────────────────────────────── */
.gm-demand-tbl[b-3hnpfv7lb3] {
    border-collapse: collapse;
    font-size: 0.75rem;
    white-space: nowrap;
}

.gm-demand-tbl thead tr:first-child th[b-3hnpfv7lb3] {
    background: #000061;
    color: #fff;
    font-weight: 700;
    text-align: center;
    padding: 0.18rem 0.5rem;
    font-size: 0.7rem;
}

.gm-demand-tbl thead tr:first-child th.gm-demand-th-commodity[b-3hnpfv7lb3] {
    background: transparent;
    color: transparent;
    border: none;
}

.gm-demand-tbl thead tr:nth-child(2) th[b-3hnpfv7lb3] {
    background: #f1f5f9;
    color: #374151;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    text-align: right;
    padding: 0.2rem 0.5rem;
    border-bottom: 1px solid #d1d5db;
}

.gm-demand-th-geared[b-3hnpfv7lb3] {
    color: #0087CB !important;
}

.gm-demand-td-commodity[b-3hnpfv7lb3] {
    font-weight: 600;
    color: #1f2937;
    padding: 0.18rem 0.75rem 0.18rem 0.25rem;
    border-bottom: 1px solid #f3f4f6;
    white-space: nowrap;
    background: #fff;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gm-demand-td-val[b-3hnpfv7lb3] {
    text-align: right;
    padding: 0.18rem 0.5rem;
    border-bottom: 1px solid #f3f4f6;
    font-variant-numeric: tabular-nums;
    color: #374151;
}

.gm-demand-td-geared[b-3hnpfv7lb3] {
    color: #0087CB;
}

.gm-demand-td-pct[b-3hnpfv7lb3],
.gm-demand-th-pct[b-3hnpfv7lb3] {
    color: #6b7280;
    font-style: italic;
}

/* ── Annual column headers ───────────────────────────────────── */
.gm-annual-head[b-3hnpfv7lb3] {
    background: #002b8c !important;
}

/* ── Quarterly period headers ────────────────────────────────── */
.gm-demand-tbl-quarterly thead tr:first-child th[b-3hnpfv7lb3] {
    background: #009DCA;
}

/* Separator: right border after the last annual % column */
.gm-annual-sep[b-3hnpfv7lb3] {
    border-right: 2px solid #000061 !important;
}

/* ── Group header row ────────────────────────────────────────── */
.gm-demand-tr-group td[b-3hnpfv7lb3] {
    background: #e8edf5;
    color: #000061;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.28rem 0.5rem;
    border-top: 2px solid #000061;
}

.gm-demand-tr-group:hover td[b-3hnpfv7lb3] {
    background: #dce4f0;
}

.gm-demand-td-group[b-3hnpfv7lb3] {
    white-space: nowrap;
    background: #e8edf5;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gm-demand-expand[b-3hnpfv7lb3] {
    font-size: 0.6rem;
    margin-right: 0.35rem;
    opacity: 0.7;
}

.gm-demand-td-subtotal[b-3hnpfv7lb3] {
    font-weight: 700;
    color: #000061;
}

.gm-demand-td-subtotal.gm-demand-td-geared[b-3hnpfv7lb3] {
    color: #0069a8;
}

.gm-demand-td-subtotal.gm-demand-td-pct[b-3hnpfv7lb3] {
    color: #4b5563;
    font-style: normal;
}

/* ── Sub-group toggle hover ──────────────────────────────────── */
.gm-demand-tr-subgroup-toggle:hover td[b-3hnpfv7lb3] {
    background: #f9fafb;
}

.gm-demand-expand-country[b-3hnpfv7lb3] {
    color: #0087CB;
    font-size: 0.55rem;
}

/* ── Country rows ────────────────────────────────────────────── */
.gm-demand-tr-country td[b-3hnpfv7lb3] {
    background: #f0f7fc;
    border-bottom: 1px solid #e0eef6;
}

.gm-demand-td-country[b-3hnpfv7lb3] {
    font-weight: 400;
    color: #374151;
    padding: 0.15rem 0.5rem 0.15rem 1.75rem;
    font-size: 0.72rem;
    white-space: nowrap;
    font-style: italic;
    background: #f0f7fc;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gm-demand-td-country-val[b-3hnpfv7lb3] {
    font-size: 0.72rem;
    color: #4b5563;
}

/* ── Total row ───────────────────────────────────────────────── */
.gm-demand-tr-total td[b-3hnpfv7lb3] {
    font-weight: 700;
    background: #f8fafc;
    border-top: 2px solid #000061;
    color: #000061;
    padding-top: 0.28rem;
    padding-bottom: 0.28rem;
}

.gm-demand-tr-total .gm-demand-td-geared[b-3hnpfv7lb3] {
    color: #0087CB;
}

/* ── Note ────────────────────────────────────────────────────── */
.gm-demand-note[b-3hnpfv7lb3] {
    font-size: 0.65rem;
    color: #9ca3af;
    margin-top: 0.4rem;
    font-style: italic;
}

/* ── Right chart panel ───────────────────────────────────────── */
/* Height pinned once by JS after first render to match initial table height */
.gm-demand-charts[b-3hnpfv7lb3] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

/* Group selector buttons */
.gm-chart-group-tabs[b-3hnpfv7lb3] {
    display: flex;
    gap: 0.15rem;
    flex-wrap: wrap;
    margin-bottom: 0.35rem;
}

.gm-chart-group-tab[b-3hnpfv7lb3] {
    font-size: 0.62rem;
    font-weight: 500;
    padding: 0.15rem 0.4rem;
    border-radius: 99px;
    border: 1px solid #009DCA;
    background: transparent;
    color: #009DCA;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.gm-chart-group-tab.active[b-3hnpfv7lb3],
.gm-chart-group-tab:hover[b-3hnpfv7lb3] {
    background: #009DCA;
    color: #fff;
}

/* Individual chart sections — each takes equal share of available column height */
.gm-chart-section[b-3hnpfv7lb3] {
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1;
    min-height: 0;
}

/* Geared Share Trend and Commodity Mix are taller than the pie chart section */
.gm-chart-section-trend[b-3hnpfv7lb3],
.gm-chart-section-mix[b-3hnpfv7lb3] {
    flex: 1.4;
}

/* Label + optional metric buttons on one row */
.gm-chart-label-row[b-3hnpfv7lb3] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.4rem;
    margin-bottom: 0.1rem;
    padding-bottom: 0.2rem;
    border-bottom: 1px solid #e5e7eb;
}

.gm-chart-label-row .gm-chart-label[b-3hnpfv7lb3] {
    margin: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.gm-chart-label[b-3hnpfv7lb3] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #000061;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0;
    padding-bottom: 0.1rem;
    border-bottom: 1px solid #e5e7eb;
}

/* Hide the Highcharts legend inside the Commodity Mix chart only.
   ::deep is required because Highcharts renders as JS-generated SVG/HTML
   which doesn't receive Blazor's scoped CSS attribute. */
.gm-chart-section-mix[b-3hnpfv7lb3]  .highcharts-legend {
    display: none !important;
}

/* Metric toggle buttons inside chart label row */
.gm-chart-metric-tabs[b-3hnpfv7lb3] {
    display: flex;
    gap: 0.15rem;
    flex-shrink: 0;
}

.gm-chart-metric-tab[b-3hnpfv7lb3] {
    font-size: 0.6rem;
    font-weight: 500;
    padding: 0.1rem 0.35rem;
    border-radius: 99px;
    border: 1px solid #000061;
    background: transparent;
    color: #000061;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

.gm-chart-metric-tab.active[b-3hnpfv7lb3],
.gm-chart-metric-tab:hover[b-3hnpfv7lb3] {
    background: #000061;
    color: #fff;
}

.gm-demand-chart-ph[b-3hnpfv7lb3] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 200px;
    background: #f8fafc;
    border: 1px dashed #d1d5db;
    border-radius: 6px;
    color: #9ca3af;
    font-size: 0.78rem;
    font-style: italic;
}

/* ── Loading / empty ─────────────────────────────────────────── */
.gm-demand-loading[b-3hnpfv7lb3],
.gm-demand-empty[b-3hnpfv7lb3] {
    font-size: 0.82rem;
    color: #9ca3af;
    font-style: italic;
    padding: 0.5rem 0;
}

/* ── Responsive ──────────────────────────────────────────────── */
@media (max-width: 1100px) {
    .gm-demand-top[b-3hnpfv7lb3] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Bulkers/Reports/GearedMonthly/Components/Sections/VesselSupply/VesselSupplySection.razor.rz.scp.css */
/* ================================================================
   Vessel Supply section — GearedMonthly
   ================================================================ */

.gm-supply-section[b-8fogcd74n3] {
    padding: 0 0 2rem;
}

/* ── KPI strip ───────────────────────────────────────────────── */
.gm-supply-kpi-strip[b-8fogcd74n3] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 1.25rem;
}

.gm-supply-kpi[b-8fogcd74n3] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-left: 4px solid #000061;
    border-radius: 0 6px 6px 0;
    padding: 0.45rem 0.75rem;
    flex: 1 1 140px;
    min-width: 120px;
}

.gm-supply-kpi--hl[b-8fogcd74n3] {
    background: #000061;
    border-color: #000061;
    border-left-color: #01A39E;
}

.gm-supply-kpi--hl .gm-supply-kpi-label[b-8fogcd74n3] { color: rgba(255,255,255,0.75); }
.gm-supply-kpi--hl .gm-supply-kpi-value[b-8fogcd74n3] { color: #fff; }
.gm-supply-kpi--hl .gm-supply-kpi-sub[b-8fogcd74n3]   { color: rgba(255,255,255,0.6); }

.gm-supply-kpi-label[b-8fogcd74n3] {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    margin-bottom: 0.1rem;
}

.gm-supply-kpi-value[b-8fogcd74n3] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #000061;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}

.gm-supply-kpi-sub[b-8fogcd74n3] {
    font-size: 0.65rem;
    color: #9ca3af;
    margin-top: 0.1rem;
}

/* ── Column heading ──────────────────────────────────────────── */
.gm-supply-col-h[b-8fogcd74n3] {
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #000061;
    margin: 0 0 0.25rem;
    padding-bottom: 0.4rem;
    border-bottom: 2px solid #000061;
}

/* ── Card grid ───────────────────────────────────────────────── */
.gm-supply-grid[b-8fogcd74n3] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    align-items: stretch;
}

.gm-supply-card[b-8fogcd74n3] {
    background: #fff;
    border: 1px solid #e3e8ef;
    border-radius: 8px;
    padding: 0.75rem 0.9rem 0.6rem;
    box-shadow: 0 1px 3px rgba(0, 0, 97, 0.05);
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.gm-supply-card--span2[b-8fogcd74n3] {
    grid-column: span 2;
}

.gm-supply-card--span3[b-8fogcd74n3] {
    grid-column: span 3;
}

@media (max-width: 1200px) {
    .gm-supply-grid[b-8fogcd74n3] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gm-supply-card--span2[b-8fogcd74n3],
    .gm-supply-card--span3[b-8fogcd74n3] {
        grid-column: span 2;
    }
}

@media (max-width: 850px) {
    .gm-supply-grid[b-8fogcd74n3] {
        grid-template-columns: 1fr;
    }

    .gm-supply-card--span2[b-8fogcd74n3],
    .gm-supply-card--span3[b-8fogcd74n3] {
        grid-column: span 1;
    }
}

/* Card header with pills alongside the heading */
.gm-supply-card-head[b-8fogcd74n3] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
    border-bottom: 2px solid #000061;
    padding-bottom: 0.35rem;
    margin-bottom: 0.25rem;
}

.gm-supply-col-h--bare[b-8fogcd74n3] {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

/* ── Pills & controls ────────────────────────────────────────── */
.gm-supply-pills[b-8fogcd74n3] {
    display: flex;
    gap: 0.3rem;
    flex-wrap: wrap;
}

.gm-supply-pill[b-8fogcd74n3] {
    font-family: inherit;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 0.18rem 0.65rem;
    border-radius: 12px;
    border: 1.5px solid #000061;
    background: transparent;
    color: #000061;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}

    .gm-supply-pill:hover:not(.active)[b-8fogcd74n3] {
        background: #e8edf5;
    }

    .gm-supply-pill.active[b-8fogcd74n3] {
        background: #000061;
        color: #fff;
    }

.gm-supply-select[b-8fogcd74n3] {
    font-family: inherit;
    font-size: 0.74rem;
    font-weight: 600;
    color: #000061;
    border: 1px solid #c8cdd5;
    border-radius: 5px;
    padding: 0.2rem 0.4rem;
    background: #fff;
    align-self: flex-start;
    cursor: pointer;
}

.gm-supply-link-btn[b-8fogcd74n3] {
    font-family: inherit;
    font-size: 0.72rem;
    font-weight: 600;
    color: #0087CB;
    background: transparent;
    border: none;
    padding: 0.1rem 0;
    cursor: pointer;
    align-self: flex-start;
}

    .gm-supply-link-btn:hover[b-8fogcd74n3] {
        text-decoration: underline;
    }

/* ── Vessel speeds (Supramax segment) ────────────────────────── */
.gm-supply-speed-table[b-8fogcd74n3] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 0.4rem;
    font-variant-numeric: tabular-nums;
}

    .gm-supply-speed-table th[b-8fogcd74n3] {
        font-size: 0.66rem;
        font-weight: 700;
        color: #fff;
        background: #000061;
        padding: 0.22rem 0.3rem;
        text-align: right;
        white-space: nowrap;
    }

    .gm-supply-speed-table td[b-8fogcd74n3] {
        font-size: 0.66rem;
        color: #1f2937;
        padding: 0.2rem 0.3rem;
        text-align: right;
        border-bottom: 1px solid #eceff3;
    }

    .gm-supply-speed-table tbody tr:nth-of-type(even)[b-8fogcd74n3] {
        background: #f2f6fb;
    }

    .gm-supply-speed-table td.yr[b-8fogcd74n3] {
        font-weight: 700;
        color: #000061;
        text-align: left;
    }

.gm-supply-note[b-8fogcd74n3] {
    font-size: 0.68rem;
    color: #9ca3af;
    font-style: italic;
    margin: 0.2rem 0 0;
}

/* ── Loading / empty ─────────────────────────────────────────── */
.gm-supply-loading[b-8fogcd74n3],
.gm-supply-empty[b-8fogcd74n3] {
    font-size: 0.82rem;
    color: #9ca3af;
    font-style: italic;
    padding: 0.5rem 0;
}

/* /Components/Pages/Bulkers/Reports/GearedMonthly/RptSsyGearedMonthly.razor.rz.scp.css */
/* ────────────────────────────────────────────────────────────────────────
   SSY Geared Bulk Monthly Report — page styling
   Mirrored verbatim from RptSsyGearedMkt.razor.css so the monthly report
   looks identical to the weekly report. Diverge from this file (rather
   than the weekly one) if monthly-specific tweaks are needed later.

   Palette is anchored to the SSY tokens used elsewhere in Navigator
   (Highcharts light theme, ECSA report, masthead colours).

   Note: Scoped .razor.css files can't contain @import rules. If you want
   to ship the actual EB Garamond / Source Sans 3 fonts, add the Google
   Fonts <link> to wwwroot/index.html (or App.razor's <head>):
       <link rel="preconnect" href="https://fonts.googleapis.com">
       <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
       <link href="https://fonts.googleapis.com/css2?family=EB+Garamond:wght@500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap" rel="stylesheet">
   Until then the page falls back to the next options in each font stack
   (Georgia / Segoe UI), which still keeps the look on-brand.
   ──────────────────────────────────────────────────────────────────────── */

.ssy-geared-frame[b-dxoc7mf3c7] {
    --ssy-navy:        #1f4e8a;
    --ssy-deep:        #163E9F;
    --ssy-blue:        #0087CB;
    --ssy-blue-light:  #4ec0e0;
    --ssy-blue-pale:   #d3edf7;
    --ssy-aqua:        #009DC9;
    --ssy-pink:        #EB3871;
    --ssy-teal:        #01A39E;
    --ssy-up:          #2aaf57;
    --ssy-down:        #e23b3b;
    --ssy-grey:        #4a4a4a;
    --ssy-grey-soft:   #ededed;
    --serif:           "EB Garamond", Georgia, "Times New Roman", serif;
    --sans:            "Source Sans 3", "Source Sans Pro", "Segoe UI", Arial, sans-serif;

    max-width: 1760px;
    margin: -1.1rem auto 0;
    background: #fff;
    box-shadow: 0 2px 16px rgba(31, 78, 138, 0.07);
    border-radius: 14px;
    padding: 0 18px 18px;
    font-family: var(--sans);
    color: var(--ssy-grey);
    overflow: hidden;
}

/* ─── Masthead ─── */
.ssy-geared-mast[b-dxoc7mf3c7] {
    padding: 4px 0 0;
}

.ssy-geared-mast-row[b-dxoc7mf3c7] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    padding-bottom: 2px;
}

.ssy-geared-mast-brand[b-dxoc7mf3c7] {
    display: flex;
    align-items: center;
    gap: 18px;
}

.ssy-geared-mast-logo[b-dxoc7mf3c7] {
    height: 80px;
    width: auto;
    flex-shrink: 0;
    object-fit: fill;
    display: block;
}

.ssy-geared-mast-title h1[b-dxoc7mf3c7] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: 28px;
    color: var(--ssy-navy);
    margin: 0;
    letter-spacing: 0.4px;
    line-height: 1.1;
}

.ssy-geared-section-accent[b-dxoc7mf3c7] {
    color: #01A39E;
}

.ssy-geared-mast-title.overview-title h1[b-dxoc7mf3c7] {
    font-size: 34px;
}

.ssy-geared-mast-title .subtitle[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-weight: 600;
    color: var(--ssy-blue);
    margin: 4px 0 0;
    font-size: 14px;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.ssy-geared-mast-contact[b-dxoc7mf3c7] {
    text-align: right;
    font-size: 12px;
    color: var(--ssy-grey);
    line-height: 1.6;
}

.ssy-geared-mast-contact .date-display[b-dxoc7mf3c7] {
    font-family: var(--serif);
    font-weight: 700;
    font-size: 19px;
    color: var(--ssy-navy);
    margin-bottom: 6px;
    letter-spacing: 0.3px;
}

.ssy-geared-mast-contact .lbl[b-dxoc7mf3c7] {
    color: #999;
    display: inline-block;
    min-width: 50px;
}

.ssy-geared-mast-contact a[b-dxoc7mf3c7] {
    color: var(--ssy-blue);
    text-decoration: none;
    font-weight: 500;
}

.ssy-geared-mast-contact a:hover[b-dxoc7mf3c7] {
    text-decoration: underline;
}

/* Decorative wave below the masthead */
.ssy-geared-mast-wave[b-dxoc7mf3c7] {
    display: block;
    width: 100%;
    height: 28px;
    margin-top: 0;
    overflow: visible;
}

/* ─── Toolbar ─── */
.ssy-geared-toolbar[b-dxoc7mf3c7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 0 8px;
    flex-wrap: wrap;
}

.ssy-geared-date-nav[b-dxoc7mf3c7] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ssy-geared-page-nav[b-dxoc7mf3c7] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.ssy-geared-actions[b-dxoc7mf3c7] {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* Pill buttons (section nav + edit toggles) */
.ssy-geared-pill[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-size: 11px;
    font-weight: 600;
    padding: 3px 11px;
    border-radius: 22px;
    border: 1px solid var(--ssy-navy);
    background: #fff;
    color: var(--ssy-navy);
    cursor: pointer;
    transition: background .15s, color .15s, transform .12s, box-shadow .15s;
    letter-spacing: 0.2px;
}

.ssy-geared-pill:hover[b-dxoc7mf3c7] {
    background: var(--ssy-grey-soft);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(31, 78, 138, 0.12);
}

.ssy-geared-pill.active[b-dxoc7mf3c7] {
    background: var(--ssy-blue);
    color: #fff;
    border-color: var(--ssy-blue);
    box-shadow: 0 2px 8px rgba(0, 135, 203, 0.30);
}

.ssy-geared-pill.active:hover[b-dxoc7mf3c7] {
    background: var(--ssy-aqua);
}

/* Comment icon button */
.ssy-geared-icon-btn[b-dxoc7mf3c7] {
    background: var(--ssy-navy);
    border: 1px solid var(--ssy-navy);
    border-radius: 8px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s, transform .12s;
    padding: 0;
}

.ssy-geared-icon-btn:hover[b-dxoc7mf3c7] {
    background: #173d70;
    transform: translateY(-1px);
}

/* ─── Region tabs ─── */
.ssy-geared-region-tabs[b-dxoc7mf3c7] {
    display: flex;
    gap: 2px;
    border-bottom: 2px solid var(--ssy-blue-light);
    margin: 8px 0 22px;
}

.ssy-geared-region-tab[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
    background: transparent;
    border: none;
    padding: 10px 22px 8px;
    cursor: pointer;
    color: var(--ssy-grey);
    border-radius: 8px 8px 0 0;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: background .15s, color .15s;
}

.ssy-geared-region-tab:hover:not([disabled])[b-dxoc7mf3c7] {
    background: rgba(78, 192, 224, 0.18);
    color: var(--ssy-navy);
}

.ssy-geared-region-tab.active[b-dxoc7mf3c7] {
    color: #fff;
    background: var(--ssy-blue-light);
}

.ssy-geared-region-tab[disabled][b-dxoc7mf3c7] {
    color: #aaa;
    cursor: not-allowed;
}

.ssy-geared-region-tab em[b-dxoc7mf3c7] {
    font-style: normal;
    color: #999;
    font-weight: 400;
    font-size: 11px;
}

/* ─── Section content layout ─── */
.ssy-geared-content[b-dxoc7mf3c7] {
    min-height: 480px;
    padding-top: 1.25rem;
    animation: ssy-fade-b-dxoc7mf3c7 0.25s ease-out;
}

@keyframes ssy-fade-b-dxoc7mf3c7 {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: none; }
}

.ssy-geared-section-h[b-dxoc7mf3c7] {
    font-family: var(--sans);
    color: var(--ssy-blue);
    font-size: 20px;
    font-weight: 700;
    margin: 78px 0 10px;
    letter-spacing: 0.3px;
    position: relative;
    padding-left: 12px;
}

.ssy-geared-section-h[b-dxoc7mf3c7]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    border-radius: 3px;
    background: linear-gradient(180deg, var(--ssy-blue) 0%, var(--ssy-blue-light) 100%);
}

.ssy-geared-section-head[b-dxoc7mf3c7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 66px 0 10px;
}

.ssy-geared-prose[b-dxoc7mf3c7] {
    font-size: 15px;
    line-height: 1.6;
    color: #2d3748;
    margin: 6px 0 14px;
    padding: 14px 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f4fafd 100%);
    border-left: 3px solid var(--ssy-blue-light);
    border-radius: 0 8px 8px 0;
}

.ssy-geared-note[b-dxoc7mf3c7] {
    font-size: 12px;
    color: #888;
    margin: 12px 0 0;
}

/* ─── Overview cards ─── */
.ssy-geared-overview-cards[b-dxoc7mf3c7] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
    margin: 14px 0 20px;
}

.ssy-geared-overview-card[b-dxoc7mf3c7] {
    border: 1px solid #d8dde3;
    border-radius: 10px;
    padding: 16px 18px;
    background: linear-gradient(160deg, #fff 0%, #f7fbfd 100%);
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    color: inherit;
    transition: transform .15s, box-shadow .15s, border-color .15s;
    display: flex;
    flex-direction: column;
    gap: 4px;
    position: relative;
    overflow: hidden;
}

.ssy-geared-overview-card[b-dxoc7mf3c7]::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ssy-blue) 0%, var(--ssy-blue-light) 60%, transparent 100%);
    opacity: 0;
    transition: opacity .2s;
}

.ssy-geared-overview-card:hover[b-dxoc7mf3c7] {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(31, 78, 138, 0.12);
    border-color: var(--ssy-blue);
}

.ssy-geared-overview-card:hover[b-dxoc7mf3c7]::after {
    opacity: 1;
}

.ssy-geared-overview-card h4[b-dxoc7mf3c7] {
    color: var(--ssy-blue);
    font-size: 16px;
    margin: 0;
    font-weight: 700;
    letter-spacing: 0.2px;
}

.ssy-geared-overview-card .card-sub[b-dxoc7mf3c7] {
    font-size: 12.5px;
    color: #6b7280;
    line-height: 1.45;
    flex: 1;
}

.ssy-geared-overview-card .card-cta[b-dxoc7mf3c7] {
    font-size: 11px;
    color: var(--ssy-navy);
    font-weight: 700;
    letter-spacing: 0.6px;
    margin-top: 6px;
}

/* ─── Tonnage list headers ─── */
.ssy-geared-list-head[b-dxoc7mf3c7] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    margin: 22px 0 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid #e5e7eb;
}

.ssy-geared-list-head h3[b-dxoc7mf3c7] {
    font-family: var(--sans);
    color: var(--ssy-navy);
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    letter-spacing: 0.2px;
}

.ssy-geared-list-head .count[b-dxoc7mf3c7] {
    font-size: 13px;
    color: var(--ssy-grey);
    font-weight: 500;
}

.ssy-geared-list-head .count .up[b-dxoc7mf3c7]   { color: var(--ssy-up);   font-weight: 700; }
.ssy-geared-list-head .count .down[b-dxoc7mf3c7] { color: var(--ssy-down); font-weight: 700; }

/* ─── Cargo: segment headers + region bands ─── */
.ssy-geared-segment-h[b-dxoc7mf3c7] {
    color: var(--ssy-navy);
    font-family: var(--sans);
    font-weight: 700;
    font-size: 17px;
    margin: 26px 0 6px;
    letter-spacing: 0.2px;
}

.ssy-geared-region-band[b-dxoc7mf3c7] {
    background: linear-gradient(90deg, var(--ssy-deep) 0%, #1f4e8a 80%);
    color: #fff;
    padding: 6px 14px;
    margin: 10px 0 0;
    font-weight: 700;
    font-size: 13px;
    border-radius: 5px 5px 0 0;
    letter-spacing: 0.4px;
}

/* ─── Overview 4-column layout ─── */
.ssy-geared-overview-layout[b-dxoc7mf3c7] {
    display: grid;
    grid-template-columns: 200px minmax(0, 1.1fr) minmax(0, 1fr) 330px;
    gap: 24px;
    margin: 16px 0 24px;
    align-items: start;
}

@media (max-width: 1400px) {
    .ssy-geared-overview-layout[b-dxoc7mf3c7] {
        grid-template-columns: 180px minmax(0, 1fr) minmax(0, 1fr);
    }

    .ssy-geared-right-panel[b-dxoc7mf3c7] {
        grid-column: 1 / -1;
    }
}

/* ── Contents: current page (greyed) ── */
.contents-current .contents-num[b-dxoc7mf3c7],
.contents-current .contents-here[b-dxoc7mf3c7] {
    color: #b3b9c4;
}

.contents-here[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
}

/* ── Scuttlebutt column ── */
.ssy-geared-scuttle[b-dxoc7mf3c7] {
    min-width: 0;
}

.ssy-geared-scuttle-text[b-dxoc7mf3c7] {
    font-size: 13px;
    line-height: 1.65;
    color: var(--ssy-grey);
}

    .ssy-geared-scuttle-text p[b-dxoc7mf3c7] {
        margin: 0 0 0.5em;
    }

.ssy-geared-scuttle-editor[b-dxoc7mf3c7] {
    min-height: 160px;
}

/* ── Right panel: utilisation strip + headings ── */
.ssy-geared-panel-section[b-dxoc7mf3c7] {
    background: #fff;
    padding: 10px 12px 8px;
    border-bottom: 1px solid #d8dde3;
}

.ssy-geared-panel-h[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--ssy-navy);
    margin: 0 0 6px;
}

.ssy-geared-panel-h--rates[b-dxoc7mf3c7] {
    background: #f4f6f8;
    margin: 0;
    padding: 8px 12px 4px;
}

.ssy-geared-util-strip[b-dxoc7mf3c7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.ssy-geared-util-kpi[b-dxoc7mf3c7] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-left: 3px solid var(--ssy-navy);
    border-radius: 0 5px 5px 0;
    padding: 5px 8px;
}

    .ssy-geared-util-kpi .lbl[b-dxoc7mf3c7] {
        font-family: var(--sans);
        font-size: 9.5px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: #6b7280;
    }

    .ssy-geared-util-kpi .val[b-dxoc7mf3c7] {
        font-family: var(--sans);
        font-size: 16px;
        font-weight: 700;
        color: var(--ssy-navy);
        font-variant-numeric: tabular-nums;
        line-height: 1.2;
    }

.ssy-geared-panel-note[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-size: 10.5px;
    font-style: italic;
    color: #9ca3af;
    margin: 6px 0 0;
    padding: 0;
}

.ssy-geared-panel-table-wrap .ssy-geared-panel-note[b-dxoc7mf3c7] {
    margin: 0;
    padding: 5px 8px 7px;
    background: #fff;
}

.ssy-geared-panel-table td.delta-pos[b-dxoc7mf3c7] {
    color: #0e9f6e;
    font-weight: 600;
}

.ssy-geared-panel-table td.delta-neg[b-dxoc7mf3c7] {
    color: #C8102E;
    font-weight: 600;
}

/* ─── Shared column heading ─── */
.ssy-geared-col-h[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-size: 18px;
    font-weight: 700;
    color: var(--ssy-navy);
    margin: 0 0 14px;
    letter-spacing: 0.2px;
}

/* ─── Contents list ─── */
.ssy-geared-contents-list[b-dxoc7mf3c7] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ssy-geared-contents-list li[b-dxoc7mf3c7] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 5px 0;
    border-bottom: 1px solid #edf0f3;
}

.ssy-geared-contents-list li:last-child[b-dxoc7mf3c7] {
    border-bottom: none;
}

.contents-num[b-dxoc7mf3c7] {
    font-family: var(--serif);
    font-size: 14px;
    font-weight: 600;
    color: var(--ssy-navy);
    min-width: 18px;
    text-align: right;
}

.contents-link[b-dxoc7mf3c7] {
    background: none;
    border: none;
    padding: 0;
    font-family: var(--sans);
    font-size: 13.5px;
    font-weight: 500;
    color: var(--ssy-blue);
    cursor: pointer;
    text-align: left;
    transition: color .15s;
    line-height: 1.35;
}

.contents-link:hover[b-dxoc7mf3c7] {
    color: var(--ssy-navy);
    text-decoration: underline;
}

/* ─── Summary list ─── */
.ssy-geared-summary-list[b-dxoc7mf3c7] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* ─── Summary header (title + Edit toggle) ─── */
.ssy-geared-summary-header[b-dxoc7mf3c7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}

.ssy-geared-summary-header .ssy-geared-col-h[b-dxoc7mf3c7] {
    margin-bottom: 0;
}

/* ─── Empty state ─── */
.gm-summary-empty[b-dxoc7mf3c7] {
    font-size: 12.5px;
    color: #aaa;
    font-style: italic;
}

/* ─── Summary item — editing mode ─── */
.gm-summary-item[b-dxoc7mf3c7] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 16px;
}

.gm-summary-item--editing[b-dxoc7mf3c7] {
    background: #f8fbfd;
    border: 1px solid #d0e4ef;
    border-radius: 8px;
    padding: 12px;
    position: relative;
}

.gm-summary-num[b-dxoc7mf3c7] {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--ssy-navy);
    color: #fff;
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2px;
}

.gm-summary-body[b-dxoc7mf3c7] {
    flex: 1;
    min-width: 0;
}

.gm-summary-title-input[b-dxoc7mf3c7] {
    width: 100%;
    font-family: var(--sans);
    font-size: 14px;
    font-weight: 700;
    color: var(--ssy-blue);
    border: none;
    border-bottom: 1px solid #c8d8e4;
    background: transparent;
    padding: 2px 0 4px;
    margin-bottom: 8px;
    outline: none;
    box-sizing: border-box;
}

.gm-summary-title-input:focus[b-dxoc7mf3c7] {
    border-bottom-color: var(--ssy-blue);
}

.gm-summary-title-input[b-dxoc7mf3c7]::placeholder {
    color: #bbb;
    font-weight: 400;
}

.gm-summary-editor[b-dxoc7mf3c7] {
    min-height: 80px;
}

.gm-summary-title-display[b-dxoc7mf3c7] {
    font-family: var(--sans);
    font-size: 14.5px;
    font-weight: 700;
    color: var(--ssy-blue);
    margin-bottom: 3px;
}

.gm-summary-text-display[b-dxoc7mf3c7] {
    font-size: 12.5px;
    color: #4a5568;
    line-height: 1.5;
}

.gm-summary-delete-btn[b-dxoc7mf3c7] {
    flex-shrink: 0;
    background: none;
    border: 1px solid #e2e8f0;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: #aaa;
    cursor: pointer;
    padding: 0;
    transition: background .15s, color .15s, border-color .15s;
    align-self: flex-start;
    margin-top: 4px;
}

.gm-summary-delete-btn:hover[b-dxoc7mf3c7] {
    background: #fee2e2;
    color: var(--ssy-down);
    border-color: var(--ssy-down);
}

.gm-summary-add-btn[b-dxoc7mf3c7] {
    margin-top: 8px;
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
    color: var(--ssy-blue);
    background: transparent;
    border: 1px dashed var(--ssy-blue);
    border-radius: 8px;
    padding: 6px 16px;
    cursor: pointer;
    width: 100%;
    transition: background .15s, color .15s;
}

.gm-summary-add-btn:hover[b-dxoc7mf3c7] {
    background: var(--ssy-blue-pale);
}

/* ─── Right panel ─── */
.ssy-geared-right-panel[b-dxoc7mf3c7] {
    display: flex;
    flex-direction: column;
    gap: 0;
    border: 1px solid #d8dde3;
    border-radius: 8px;
    overflow: hidden;
}

.ssy-geared-panel-tabs[b-dxoc7mf3c7] {
    display: flex;
    background: #f4f6f8;
    border-bottom: 1px solid #d8dde3;
}

.ssy-geared-panel-tab[b-dxoc7mf3c7] {
    flex: 1;
    padding: 8px 12px;
    font-family: var(--sans);
    font-size: 12px;
    font-weight: 600;
    background: transparent;
    border: none;
    cursor: pointer;
    color: var(--ssy-grey);
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
    transition: color .15s, background .15s;
}

.ssy-geared-panel-tab.active[b-dxoc7mf3c7] {
    color: var(--ssy-navy);
    background: #fff;
    border-bottom-color: var(--ssy-blue);
}

.ssy-geared-panel-table-wrap[b-dxoc7mf3c7] {
    overflow-x: auto;
    background: #fff;
}

.ssy-geared-panel-table[b-dxoc7mf3c7] {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    font-family: var(--sans);
}

.ssy-geared-panel-table th[b-dxoc7mf3c7] {
    background: var(--ssy-navy);
    color: #fff;
    padding: 6px 8px;
    text-align: right;
    font-weight: 600;
    font-size: 11px;
    letter-spacing: 0.2px;
    white-space: nowrap;
}

.ssy-geared-panel-table th:first-child[b-dxoc7mf3c7] {
    text-align: left;
}

.ssy-geared-panel-table td[b-dxoc7mf3c7] {
    padding: 5px 8px;
    text-align: right;
    border-bottom: 1px solid #edf0f3;
    color: var(--ssy-grey);
}

.ssy-geared-panel-table td:first-child[b-dxoc7mf3c7] {
    text-align: left;
    font-weight: 600;
    color: var(--ssy-navy);
}

.ssy-geared-panel-table tbody tr:last-child td[b-dxoc7mf3c7] {
    border-bottom: none;
}

.placeholder-cell[b-dxoc7mf3c7] {
    text-align: center !important;
    color: #aaa !important;
    font-style: italic;
    padding: 24px 8px !important;
    font-weight: 400 !important;
}

.ssy-geared-chart-placeholder[b-dxoc7mf3c7] {
    height: 180px;
    background: linear-gradient(160deg, #f4fafd 0%, #edf4f8 100%);
    border-top: 1px solid #d8dde3;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chart-ph-label[b-dxoc7mf3c7] {
    font-size: 12px;
    color: #aaa;
    font-style: italic;
    text-align: center;
    padding: 0 16px;
}

/* ─── Footer disclaimer ─── */
.ssy-geared-disclaimer[b-dxoc7mf3c7] {
    margin-top: 40px;
    padding: 16px 0 4px;
    border-top: 1px solid #dadfe5;
    font-size: 10px;
    color: #888;
    line-height: 1.6;
}

.ssy-geared-disclaimer strong[b-dxoc7mf3c7] {
    color: var(--ssy-navy);
}
/* /Components/Pages/Bulkers/Reports/PeriodSnp/DryCargo_20_SnpRates_Upd.razor.rz.scp.css */
[b-ed2ubx6g3z] .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    /*        width: 100%;*/
}

[b-ed2ubx6g3z] .stalePrice {
    background-color: LightYellow;
}
/* /Components/Pages/Bulkers/Reports/PmxBkrDaily/PMX_DAILY_010_Main.razor.rz.scp.css */
/* /Components/Pages/Bulkers/Reports/PmxBkrDaily/PMX_DAILY_100_Page1.razor.rz.scp.css */
.dashboard-grid[b-cngqiux2q2] {
    display: flex;
    flex-direction: row;
    flex-wrap: nRowrap; /* prevents wrapping */
    gap: 12px;
    margin-bottom: 5px;
}

.dashboard-box[b-cngqiux2q2] {
    border: 1px solid #000061;
    border-radius: 5px;
    overflow: hidden;
    width: 150px;
    font-weight: bold;
    box-shadow: 1px 1px 4px rgba(0,0,0,0.1);
}

.dashboard-box-title[b-cngqiux2q2] {
    background-color: #000061; /* SSY blue */
    color: white;
    padding: 5px;
    font-size: 14px;
    text-align: center;
}

.dashboard-box-value[b-cngqiux2q2] {
    background-color: white;
    color: black;
    padding: 2px 0px;
    font-size: 16px;
    text-align: center;
}

.dashboard-box-value.positive[b-cngqiux2q2] {
    color: green;
}

.dashboard-box-value.negative[b-cngqiux2q2] {
    color: red;
}

.container-wrapper[b-cngqiux2q2] {
    display: flex;
    justify-content: space-between; /* Space evenly between containers */
    align-items: stretch; /* Ensure equal height */
    gap: 10px; /* Space between containers */
    margin-top: 5px; /* Add spacing between rows of containers */
}

.left-column[b-cngqiux2q2] {
flex: 7 1 0;
}

.right-column[b-cngqiux2q2] {
flex: 3 1 0;
}

.right-column[b-cngqiux2q2] {
display: flex;
flex-direction: column;
gap: 8px; /* spacing between stacked sections */
}

.pacific-tables[b-cngqiux2q2] {
display: flex;
gap: 12px;
}

.pacific-tables table[b-cngqiux2q2] {
flex: 1 1 0;
}
/* /Components/Pages/Bulkers/Reports/SSYGearedMktReport/Components/RptSsyGearedRatesTable.razor.rz.scp.css */
.rpt-ssy-geared-rates-td[b-vl110mi20w] {
    font-size: 1em !important;
}
/* /Components/Pages/Bulkers/Reports/SSYGearedMktReport/RptSsyGearedMkt.razor.rz.scp.css */
/* ────────────────────────────────────────────────────────────────────────
   SSY Geared Markets — page styling
   Palette is anchored to the SSY tokens used elsewhere in Navigator
   (Highcharts light theme, ECSA report, masthead colours).

   Note: Scoped .razor.css files can't contain @import rules. If you want
   to ship the actual EB Garamond / Source Sans 3 fonts, add the Google
   Fonts <link> to wwwroot/index.html (or App.razor's <head>):
       <link rel="preconnect" href="https://fonts.googleapis.com">
       <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
       <link href="https://fonts.googleapis.com/css2?family=EB+Garamond:wght@500;600;700&family=Source+Sans+3:wght@400;500;600;700&display=swap" rel="stylesheet">
   Until then the page falls back to the next options in each font stack
   (Georgia / Segoe UI), which still keeps the look on-brand.
   ──────────────────────────────────────────────────────────────────────── */

.ssy-geared-frame[b-zca9zweunp] {
    --ssy-navy:        #1f4e8a;
    --ssy-deep:        #163E9F;
    --ssy-blue:        #0087CB;
    --ssy-blue-light:  #4ec0e0;
    --ssy-blue-pale:   #d3edf7;
    --ssy-aqua:        #009DC9;
    --ssy-pink:        #EB3871;
    --ssy-teal:        #01A39E;
    --ssy-up:          #2aaf57;
    --ssy-down:        #e23b3b;
    --ssy-grey:        #4a4a4a;
    --ssy-grey-soft:   #ededed;
    --serif:           "EB Garamond", Georgia, "Times New Roman", serif;
    --sans:            "Source Sans 3", "Source Sans Pro", "Segoe UI", Arial, sans-serif;

    max-width: 1280px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 2px 16px rgba(31, 78, 138, 0.07);
    border-radius: 14px;
    padding: 0 30px 36px;
    font-family: var(--sans);
    color: var(--ssy-grey);
    overflow: hidden;
}

/* ─── Masthead ─── */
.ssy-geared-mast[b-zca9zweunp] {
    padding: 18px 0 0;
}

.ssy-geared-mast-row[b-zca9zweunp] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 24px;
    padding-bottom: 8px;
}

.ssy-geared-mast-brand[b-zca9zweunp] {
    display: flex;
    align-items: center;
    gap: 18px;
}

.ssy-geared-mast-logo[b-zca9zweunp] {
    height: 110px;
    width: auto;
    flex-shrink: 0;
    object-fit: fill;
    display: block;
}

.ssy-geared-mast-title h1[b-zca9zweunp] {
    font-family: var(--serif);
    font-weight: 600;
    font-size: 34px;
    color: var(--ssy-navy);
    margin: 0;
    letter-spacing: 0.4px;
    line-height: 1.1;
}

.ssy-geared-mast-title .subtitle[b-zca9zweunp] {
    font-family: var(--sans);
    font-weight: 600;
    color: var(--ssy-blue);
    margin: 4px 0 0;
    font-size: 14px;
    letter-spacing: 0.4px;
    text-transform: uppercase;
}

.ssy-geared-mast-contact[b-zca9zweunp] {
    text-align: right;
    font-size: 12px;
    color: var(--ssy-grey);
    line-height: 1.6;
}

.ssy-geared-mast-contact .date-display[b-zca9zweunp] {
    font-family: var(--serif);
    font-weight: 700;
    font-size: 24px;
    color: var(--ssy-navy);
    margin-bottom: 6px;
    letter-spacing: 0.3px;
}

.ssy-geared-mast-contact .lbl[b-zca9zweunp] {
    color: #999;
    display: inline-block;
    min-width: 50px;
}

.ssy-geared-mast-contact a[b-zca9zweunp] {
    color: var(--ssy-blue);
    text-decoration: none;
    font-weight: 500;
}

.ssy-geared-mast-contact a:hover[b-zca9zweunp] {
    text-decoration: underline;
}

/* Decorative wave below the masthead */
.ssy-geared-mast-wave[b-zca9zweunp] {
    display: block;
    width: 100%;
    height: 32px;
    margin-top: 2px;
    overflow: visible;
}

/* ─── Toolbar ─── */
.ssy-geared-toolbar[b-zca9zweunp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 0 8px;
    flex-wrap: wrap;
}

.ssy-geared-date-nav[b-zca9zweunp] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ssy-geared-page-nav[b-zca9zweunp] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.ssy-geared-actions[b-zca9zweunp] {
    display: flex;
    gap: 8px;
    align-items: center;
}

/* Pill buttons (section nav + edit toggles) */
.ssy-geared-pill[b-zca9zweunp] {
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
    padding: 7px 16px;
    border-radius: 22px;
    border: 1px solid var(--ssy-navy);
    background: #fff;
    color: var(--ssy-navy);
    cursor: pointer;
    transition: background .15s, color .15s, transform .12s, box-shadow .15s;
    letter-spacing: 0.2px;
}

.ssy-geared-pill:hover[b-zca9zweunp] {
    background: var(--ssy-grey-soft);
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(31, 78, 138, 0.12);
}

.ssy-geared-pill.active[b-zca9zweunp] {
    background: var(--ssy-blue);
    color: #fff;
    border-color: var(--ssy-blue);
    box-shadow: 0 2px 8px rgba(0, 135, 203, 0.30);
}

.ssy-geared-pill.active:hover[b-zca9zweunp] {
    background: var(--ssy-aqua);
}

/* Comment icon button */
.ssy-geared-icon-btn[b-zca9zweunp] {
    background: var(--ssy-navy);
    border: 1px solid var(--ssy-navy);
    border-radius: 8px;
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .15s, transform .12s;
    padding: 0;
}

.ssy-geared-icon-btn:hover[b-zca9zweunp] {
    background: #173d70;
    transform: translateY(-1px);
}

/* ─── Region tabs ─── */
.ssy-geared-region-tabs[b-zca9zweunp] {
    display: flex;
    gap: 2px;
    border-bottom: 2px solid var(--ssy-blue-light);
    margin: 8px 0 22px;
}

.ssy-geared-region-tab[b-zca9zweunp] {
    font-family: var(--sans);
    font-size: 13px;
    font-weight: 600;
    background: transparent;
    border: none;
    padding: 10px 22px 8px;
    cursor: pointer;
    color: var(--ssy-grey);
    border-radius: 8px 8px 0 0;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    transition: background .15s, color .15s;
}

.ssy-geared-region-tab:hover:not([disabled])[b-zca9zweunp] {
    background: rgba(78, 192, 224, 0.18);
    color: var(--ssy-navy);
}

.ssy-geared-region-tab.active[b-zca9zweunp] {
    color: #fff;
    background: var(--ssy-blue-light);
}

.ssy-geared-region-tab[disabled][b-zca9zweunp] {
    color: #aaa;
    cursor: not-allowed;
}

.ssy-geared-region-tab em[b-zca9zweunp] {
    font-style: normal;
    color: #999;
    font-weight: 400;
    font-size: 11px;
}

/* ─── Section content layout ─── */
.ssy-geared-content[b-zca9zweunp] {
    min-height: 480px;
    animation: ssy-fade-b-zca9zweunp 0.25s ease-out;
}

@keyframes ssy-fade-b-zca9zweunp {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 1; transform: none; }
}

.ssy-geared-section-h[b-zca9zweunp] {
    font-family: var(--sans);
    color: var(--ssy-blue);
    font-size: 20px;
    font-weight: 700;
    margin: 26px 0 10px;
    letter-spacing: 0.3px;
    position: relative;
    padding-left: 12px;
}

.ssy-geared-section-h[b-zca9zweunp]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    bottom: 6px;
    width: 4px;
    border-radius: 3px;
    background: linear-gradient(180deg, var(--ssy-blue) 0%, var(--ssy-blue-light) 100%);
}

.ssy-geared-section-head[b-zca9zweunp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin: 22px 0 10px;
}

.ssy-geared-prose[b-zca9zweunp] {
    font-size: 15px;
    line-height: 1.6;
    color: #2d3748;
    margin: 6px 0 14px;
    padding: 14px 16px;
    background: linear-gradient(180deg, #ffffff 0%, #f4fafd 100%);
    border-left: 3px solid var(--ssy-blue-light);
    border-radius: 0 8px 8px 0;
}

.ssy-geared-note[b-zca9zweunp] {
    font-size: 12px;
    color: #888;
    margin: 12px 0 0;
}

/* ─── Overview cards ─── */
.ssy-geared-overview-cards[b-zca9zweunp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
    margin: 14px 0 20px;
}

.ssy-geared-overview-card[b-zca9zweunp] {
    border: 1px solid #d8dde3;
    border-radius: 10px;
    padding: 16px 18px;
    background: linear-gradient(160deg, #fff 0%, #f7fbfd 100%);
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    color: inherit;
    transition: transform .15s, box-shadow .15s, border-color .15s;
    display: flex;
    flex-direction: column;
    gap: 4px;
    position: relative;
    overflow: hidden;
}

.ssy-geared-overview-card[b-zca9zweunp]::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ssy-blue) 0%, var(--ssy-blue-light) 60%, transparent 100%);
    opacity: 0;
    transition: opacity .2s;
}

.ssy-geared-overview-card:hover[b-zca9zweunp] {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(31, 78, 138, 0.12);
    border-color: var(--ssy-blue);
}

.ssy-geared-overview-card:hover[b-zca9zweunp]::after {
    opacity: 1;
}

.ssy-geared-overview-card h4[b-zca9zweunp] {
    color: var(--ssy-blue);
    font-size: 16px;
    margin: 0;
    font-weight: 700;
    letter-spacing: 0.2px;
}

.ssy-geared-overview-card .card-sub[b-zca9zweunp] {
    font-size: 12.5px;
    color: #6b7280;
    line-height: 1.45;
    flex: 1;
}

.ssy-geared-overview-card .card-cta[b-zca9zweunp] {
    font-size: 11px;
    color: var(--ssy-navy);
    font-weight: 700;
    letter-spacing: 0.6px;
    margin-top: 6px;
}

/* ─── Tonnage list headers ─── */
.ssy-geared-list-head[b-zca9zweunp] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    margin: 22px 0 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid #e5e7eb;
}

.ssy-geared-list-head h3[b-zca9zweunp] {
    font-family: var(--sans);
    color: var(--ssy-navy);
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    letter-spacing: 0.2px;
}

.ssy-geared-list-head .count[b-zca9zweunp] {
    font-size: 13px;
    color: var(--ssy-grey);
    font-weight: 500;
}

.ssy-geared-list-head .count .up[b-zca9zweunp]   { color: var(--ssy-up);   font-weight: 700; }
.ssy-geared-list-head .count .down[b-zca9zweunp] { color: var(--ssy-down); font-weight: 700; }

/* ─── Cargo: segment headers + region bands ─── */
.ssy-geared-segment-h[b-zca9zweunp] {
    color: var(--ssy-navy);
    font-family: var(--sans);
    font-weight: 700;
    font-size: 17px;
    margin: 26px 0 6px;
    letter-spacing: 0.2px;
}

.ssy-geared-region-band[b-zca9zweunp] {
    background: linear-gradient(90deg, var(--ssy-deep) 0%, #1f4e8a 80%);
    color: #fff;
    padding: 6px 14px;
    margin: 10px 0 0;
    font-weight: 700;
    font-size: 13px;
    border-radius: 5px 5px 0 0;
    letter-spacing: 0.4px;
}

/* ─── Footer disclaimer ─── */
.ssy-geared-disclaimer[b-zca9zweunp] {
    margin-top: 40px;
    padding: 16px 0 4px;
    border-top: 1px solid #dadfe5;
    font-size: 11.5px;
    color: #888;
    line-height: 1.6;
}

.ssy-geared-disclaimer strong[b-zca9zweunp] {
    color: var(--ssy-navy);
}
/* /Components/Pages/Bulkers/VoyageRates/Commodities.razor.rz.scp.css */
.vr-map-cont[b-rvfowpgsh0] {
    height: 100%;
    width: 100%;
    padding-top: 12px;
    display: flex; 
    flex-direction: row;
}
.vr-map-cont path[b-rvfowpgsh0] {
    fill: lightgray
}
.vr-map-svg-cont svg[b-rvfowpgsh0] {
    width: 50%;
    height: 50%;
}

.vr-map-svg-cont[b-rvfowpgsh0] {
    height: 100%;
    width: 50%;
}

.vr-country-cont[b-rvfowpgsh0] {
    height: 100%;
    width: 50%;
}

.vr-stats[b-rvfowpgsh0] {
    margin-top: 2%;
    height: 98%;
    width: 100%;
}
/* /Components/Pages/Bulkers/VoyageRates/Comps/Map.razor.rz.scp.css */
.world-map-cont[b-0cdufhaemw] {
    height: 100%;
    width: 100%;
}
.world-map-cont path[b-0cdufhaemw] {
    fill: #F0F0F0;
}
.world-map-cont svg[b-0cdufhaemw] {
    height: 100%;
    width: 100%;
}

.country-clickable[b-0cdufhaemw] {
    cursor: pointer;
    fill: #98ABB4 !important;
    transition: fill 0.3s ease;
}

    .country-clickable:hover[b-0cdufhaemw] {
        fill: #009DC9 !important;
    }

.country-chosen[b-0cdufhaemw] {
    cursor: pointer;
    fill: #0087CB !important;
    transition: fill 0.3s ease;
}

.route-path[b-0cdufhaemw] {
    stroke: #000061;
    transition: stroke 0.3s ease;
}
    .route-path:hover[b-0cdufhaemw] {
        stroke: red !important;
    }
/* /Components/Pages/Bulkers/VoyageRates/NewVoyageRoute.razor.rz.scp.css */
.dropdown-search[b-v0zur600js] {
    display: flex; 
    flex-direction: column;
    align-items: baseline;
    border: 1px solid;
    border-radius: 12px;
    padding: 7px 13px;
    margin-top: 0.3%;
    position: absolute;
    z-index: 111111;
}

.dropdown-search-item[b-v0zur600js] {
    display: flex;
    width: 100%;
}

    .dropdown-search-item:hover[b-v0zur600js] {
        background-color: #F0F0F0;
    }

.vr-btn[b-v0zur600js] {
    height: 32px;
    width: 32px;
    border: 1px solid #000061;
    background-color: white;
    border-radius: 999px;
}
    .vr-btn:hover[b-v0zur600js] {
        background-color: #D3E9FF;
        font-weight: 500;
    }
    .vr-btn:focus[b-v0zur600js] {
        background-color: #D3E9FF;
        font-weight: 500;
    }
/* /Components/Pages/Bulkers/VoyageRates/PortInfoManager.razor.rz.scp.css */
.dropdown-search[b-jhl7slffy7] {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    border: 1px solid #000061;
    border-radius: 12px;
    padding: 7px 13px;
    margin-top: 12px;
    margin-left: 8px;
    position: absolute;
    z-index: 111111;
}

.dropdown-search-item[b-jhl7slffy7] {
    display: flex;
    width: 100%;
}

    .dropdown-search-item:hover[b-jhl7slffy7] {
        background-color: #F0F0F0;
    }
/* /Components/Pages/Futures/ApiSetup/FuturesRatesSetup.razor.rz.scp.css */
.gasextractbox[b-jkrd93dob6] {
    border: 1px solid #009DC9;
    height: 85vh;
    overflow-y: scroll;
}

.gasextractdatepicker[b-jkrd93dob6] {
}

.gasextractroutepicker[b-jkrd93dob6] {
    display: grid;
    grid-template-columns: 100px auto;
    gap: 10px;
}

.gasextractroutepicker-ul[b-jkrd93dob6] {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.gasextractroutepicker-ul .chkbox[b-jkrd93dob6] {
    margin: 0 3px 0 0;
    vertical-align: middle;
}


.gasextractroutepicker-ul li[b-jkrd93dob6] {
    text-decoration: none;
}

.gasextractroutepicker-ul li:hover[b-jkrd93dob6] {
    background-color: #B5CBD6;
}


.deleterow[b-jkrd93dob6], .editapiclient[b-jkrd93dob6] {
    cursor: pointer;
    padding-right: 3px;
}

.deleterow:hover[b-jkrd93dob6] {
    font-weight: 700;
    color: white;
}

.draggablerow[b-jkrd93dob6] {
    cursor: pointer;
}

.editapiclient[b-jkrd93dob6] {
    color: #163E9F;
}


.editapiclient:hover[b-jkrd93dob6] {
    font-weight: 700;
    color: #91A527;
}
/* /Components/Pages/Futures/BalticFwdPrices/BalticFwdPrices.razor.rz.scp.css */
.positive[b-zmdsy3ds1m] {
    color: mediumseagreen !important;
}

.negative[b-zmdsy3ds1m] {
    color: crimson !important;
}

.ssy-table-lw td[b-zmdsy3ds1m], .ssy-table-lw th[b-zmdsy3ds1m] {
    padding: .25rem;
}

.radio-btns input[type="radio"][b-zmdsy3ds1m] {
    display: none;
}

.radio-label[b-zmdsy3ds1m] {
    display: block;
    padding: 0.5rem;
    text-align: center;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    cursor: pointer;
    border-radius: 4px;
}

.radio-btns input[type="radio"]:checked + .radio-label[b-zmdsy3ds1m] {
    background-color: var(--bs-primary);
    color: white;
    border-color: var(--bs-primary);
}

.radio-item[b-zmdsy3ds1m] {
    flex: 1;
    min-width: 120px;
}
.ssy-date-selector[b-zmdsy3ds1m] {
    font-size: 1.5em;
    color: #009DC9;
}
.ssy-date-selector time[b-zmdsy3ds1m] {
    font-weight: 600;
}

.section-container[b-zmdsy3ds1m] {
    padding: 0;
    border-radius: 0;  /* Removed border radius */
    height: auto;
    margin: 0;
}

.section-container table[b-zmdsy3ds1m] {
    margin: 0;
    width: 100% !important;  /* Ensure all tables are full width */
    table-layout: fixed;     /* Fixed table layout for consistent columns */
}

/* Add consistent column widths */
.section-container table th[b-zmdsy3ds1m],
.section-container table td[b-zmdsy3ds1m] {
    padding: 0.25rem 0.5rem;
    white-space: nowrap;  /* Prevent wrapping */
}

.section-container table th:first-child[b-zmdsy3ds1m],
.section-container table td:first-child[b-zmdsy3ds1m] {
    width: 40%;
    text-align: left;

}

.section-container table th:nth-child(2)[b-zmdsy3ds1m],
.section-container table td:nth-child(2)[b-zmdsy3ds1m],
.section-container table th:last-child[b-zmdsy3ds1m],
.section-container table td:last-child[b-zmdsy3ds1m] {
    width: 30%;  /* Adjusted width distribution */
    text-align: right;
    direction: ltr;  /* Ensure numbers read left-to-right */
}


@media (min-width: 992px) {
    .container-fluid[b-zmdsy3ds1m] {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .col-lg-4[b-zmdsy3ds1m] {
        display: flex;
        flex-direction: column;
        gap: 0;
    }

    .section-container[b-zmdsy3ds1m] {
        margin: 0;
        flex: 0 0 auto;
    }

    .mt-4[b-zmdsy3ds1m] {
        margin-top: 0 !important;
    }
}
/* /Components/Pages/Futures/DataAndHistoricals/DataAndHistoricals.razor.rz.scp.css */
.commentary[b-bs697l7ly7] {
    color: #000061;
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
    font-size: 10pt;
    margin-bottom: 2rem;
}

.eod_vol_total[b-bs697l7ly7] {
    cursor: grab;
    background-color: #B5CBD6;
}

.eod_vol_total:hover[b-bs697l7ly7] {
    background-color: #B5CBD6A0;
}

.dataSourceButtons[b-bs697l7ly7] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-top: 0.5%;
    margin-bottom: 0.7%;
}

.dataSourceButtons button[b-bs697l7ly7] {
    font-size: 130%;
    padding-top: 0.2%;
    padding-bottom: 0.2%;
    padding-left: 0.5%;
    padding-right: 0.5%;
    border: 2.5px solid #0087CB;
    border-radius: 999px;
}
.date-select-simple[b-bs697l7ly7]  .ssy-date-selector {
    display: block;
}

/* ============================================================
 * Top-level desk tabs (FFA / Metals / Coal / Carbon / LNG / LPG / Uranium)
 * ------------------------------------------------------------
 * Designed as the PRIMARY level of navigation on this page.
 * They sit ABOVE the inner .ssy-radio-main route picker; the two
 * controls are visually related (both pill-like, both rounded) but
 * the desk tabs clearly outrank: bigger, individually separated,
 * stronger active fill, with a thin divider below to mark the
 * hierarchical break.
 *
 * Performance note:
 *   No keyframe animations are applied to the heavy content panel.
 *   Only the tab buttons themselves transition (color/background),
 *   so switching desks is bottlenecked only by the SQL data fetch -
 *   the UI is not also paying a chart-remount or animation cost.
 * ============================================================ */

.eod-desk-tabs[b-bs697l7ly7] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    margin: 0.25rem auto 0;
    padding: 0;
    max-width: 1000px;
}

.eod-desk-tab[b-bs697l7ly7] {
    /* reset button styles */
    appearance: none;
    margin: 0;
    padding: 0.55rem 1.4rem;

    /* surface */
    background: #ffffff;
    border: 1.5px solid #c5cedb;
    border-radius: 999px; /* full pill */
    box-shadow: 0 1px 2px rgba(0, 0, 97, 0.04);

    /* type */
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: #000061;

    /* layout */
    text-align: center;
    cursor: pointer;
    user-select: none;
    min-width: 90px;
    line-height: 1.1;

    /* transition (cheap properties only - color, bg, shadow, border) */
    transition:
        background-color 160ms ease,
        color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.eod-desk-tab:hover:not(:disabled):not(.active)[b-bs697l7ly7] {
    background: #f2f5fb;
    border-color: #000061;
}

.eod-desk-tab:focus-visible[b-bs697l7ly7] {
    outline: 2px solid #0087CC;
    outline-offset: 2px;
}

/* Active = solid navy fill, white text, slightly raised */
.eod-desk-tab.active[b-bs697l7ly7] {
    background: #000061;
    border-color: #000061;
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(0, 0, 97, 0.25);
    cursor: default;
}

/* No-permission tab: greyed out, no pointer */
.eod-desk-tab.no-access[b-bs697l7ly7],
.eod-desk-tab:disabled[b-bs697l7ly7] {
    background: #f4f5f7;
    border-color: #e0e3e8;
    color: #b5bdc7;
    cursor: not-allowed;
    box-shadow: none;
}

.eod-desk-tab.no-access:hover[b-bs697l7ly7],
.eod-desk-tab:disabled:hover[b-bs697l7ly7] {
    background: #f4f5f7;
    border-color: #e0e3e8;
    color: #b5bdc7;
}

/* Hierarchy divider: thin horizontal rule under the desk tabs that visually
   separates the primary level from the secondary (.ssy-radio-main) row beneath. */
.eod-desk-tabs-divider[b-bs697l7ly7] {
    max-width: 1000px;
    margin: 0.6rem auto 0;
    height: 1px;
    background: linear-gradient(
        to right,
        transparent 0%,
        #d9dfe6 12%,
        #d9dfe6 88%,
        transparent 100%
    );
}

/* Narrow screens: shrink pills so the row still fits */
@media (max-width: 700px) {
    .eod-desk-tab[b-bs697l7ly7] {
        padding: 0.45rem 0.9rem;
        font-size: 0.9rem;
        min-width: 70px;
    }
    .eod-desk-tabs[b-bs697l7ly7] {
        gap: 0.35rem;
    }
}
/* /Components/Pages/Futures/DataAndHistoricals/UraniumDataAndHistoricals.razor.rz.scp.css */
/* ── Broker Price Index current prices ───────────────────────────────── */
.uranium-bpi-current[b-7t1cb03o5f] {
    padding: 0.4rem 0.6rem;
}

.uranium-bpi-prices[b-7t1cb03o5f] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.uranium-bpi-price-item[b-7t1cb03o5f] {
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
}

.uranium-bpi-price-label[b-7t1cb03o5f] {
    font-size: 0.7rem;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.uranium-bpi-price-value[b-7t1cb03o5f] {
    font-size: 1.1rem;
    font-weight: 700;
}

.uranium-bpi-divider[b-7t1cb03o5f] {
    font-size: 1.2rem;
    color: #aaa;
    padding: 0 0.1rem;
    align-self: flex-end;
    padding-bottom: 2px;
}

.uranium-bpi-change[b-7t1cb03o5f] {
    font-size: 0.82rem;
    font-weight: 600;
    margin-left: 0.35rem;
    align-self: flex-end;
    padding-bottom: 3px;
}

/* ── Price direction colours (SSY palette) ───────────────────────────── */
.uranium-price-up[b-7t1cb03o5f]   { color: #91A527; font-weight: 600; }
.uranium-price-down[b-7t1cb03o5f] { color: #DB303A; font-weight: 600; }

/* ── Curve table ─────────────────────────────────────────────────────── */
.uranium-curve-table[b-7t1cb03o5f] {
    border-collapse: collapse;
    font-size: 0.88rem;
}

/* Product name cell — sits in the dark header row alongside location names */
.uranium-curve-product-header-row[b-7t1cb03o5f] {
    background: #000061 !important;
    color: #ffffff !important;
}

.uranium-curve-product-cell[b-7t1cb03o5f] {
    text-align: left !important;
    font-weight: 700;
    font-size: 0.95rem;
    letter-spacing: 0.02em;
    color: #ffffff !important;
    padding-top: 0.45rem !important;
    padding-bottom: 0.45rem !important;
    white-space: nowrap;
}

.uranium-curve-loc-header[b-7t1cb03o5f] {
    text-align: center;
    font-weight: 600;
    font-size: 0.85rem;
    letter-spacing: 0.01em;
    color: #ffffff !important;
}

.uranium-subheader-row th[b-7t1cb03o5f] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding-top: 0.15rem !important;
    padding-bottom: 0.15rem !important;
    border-bottom: 1px solid #ccc;
    background: #f7f8fc;
}

.uranium-subheader-cell[b-7t1cb03o5f] {
    text-align: center;
}

.uranium-change-header[b-7t1cb03o5f] {
    text-align: center;
    color: #888 !important;
}

.uranium-curve-price-cell[b-7t1cb03o5f] {
    text-align: center;
    white-space: nowrap;
}

.uranium-change-cell[b-7t1cb03o5f] {
    text-align: center;
    white-space: nowrap;
    font-size: 0.82rem;
}

.uranium-sep[b-7t1cb03o5f] {
    color: #bbb;
    margin: 0 0.15rem;
}

.uranium-no-price[b-7t1cb03o5f] {
    color: #bbb;
    text-align: center;
}

/* ── Table wrapper: horizontal breathing room ────────────────────────── */
.uranium-table-wrap[b-7t1cb03o5f] {
    padding: 0 0.6rem;
    margin-bottom: 1.5rem;
    overflow-x: auto;
}

/* ── colgroup widths ─────────────────────────────────────────────────── */
/* Period col: wide enough for "Dec 27" and longer product names */
.uranium-col-period[b-7t1cb03o5f] { width: 70px; }
/* Bid / Offer value columns */
.uranium-col-price[b-7t1cb03o5f]  { width: 52px; }
/* "/" separator — as narrow as possible */
.uranium-col-sep[b-7t1cb03o5f]    { width: 14px; }
/* Change column */
.uranium-col-change[b-7t1cb03o5f] { width: 50px; }

/* ── Mobile overrides — make 3-route table fit without horizontal scroll  */
@media (max-width: 767px) {
    .uranium-curve-table[b-7t1cb03o5f] {
        font-size: 0.75rem;
    }
    /* Tighten cell padding so values have room */
    .uranium-curve-table td[b-7t1cb03o5f],
    .uranium-curve-table th[b-7t1cb03o5f] {
        padding-left: 2px !important;
        padding-right: 2px !important;
    }
    /* Narrower cols: 3 routes = 48 + 3×(40+8+40) = 48+264 = 312px — fits 390px */
    .uranium-col-period[b-7t1cb03o5f] { width: 48px; }
    .uranium-col-price[b-7t1cb03o5f]  { width: 40px; }
    .uranium-col-sep[b-7t1cb03o5f]    { width: 8px;  }
    .uranium-col-change[b-7t1cb03o5f],.uranium-change-cell[b-7t1cb03o5f], .uranium-change-header[b-7t1cb03o5f] { width: 0;display: none;    } /* hidden on mobile anyway */
}
/* /Components/Pages/Futures/EodBatteryMetalsEmail.razor.rz.scp.css */


.bminputpage[b-wdjz9gwezu] {
    display: grid;
    gap: 40px;
    grid-template-columns: 1fr 1fr;
}


@media screen and (max-width: 600px) {

    .bminputpage[b-wdjz9gwezu] {
        display: flex;
        flex-direction: column;
    }
}
/* /Components/Pages/Futures/EodCommentary.razor.rz.scp.css */

.eodCommPage-grid-container[b-lq9nrmfx1c] {
    display: grid;
    grid-template-columns: var(--input-columns);
    grid-gap: 40px;
    background-color: transparent;
}
/*
.grid-item-input {
}
*/
.eodcomm-pricesColumn[b-lq9nrmfx1c] {
    grid-row: 1 / span 2;
    width: 580px;
    /* width: 580px; float: left; margin-right:10px;*/
}



.showOnSmallScreens[b-lq9nrmfx1c] {
    display: none;
}


@media screen and (max-width: 600px) {


    .eodCommPage-grid-container[b-lq9nrmfx1c] {
        display: block;
        grid-gap: 40px;
        background-color: transparent;
    }

    .showOnSmallScreens[b-lq9nrmfx1c] {
        display: block;
    }
}

.rcorners[b-lq9nrmfx1c] {
    display: inline-block;
    border-radius: 25px;
    border: 2px solid;
    text-align: center;
    line-height: 1.5em;
    height: 1.8em;
    width: 50px;
    margin-left: 4px;
}

.goodborder[b-lq9nrmfx1c] {
    background-color: #70ad4755;
    border-color: #70ad47;
}

.badborder[b-lq9nrmfx1c] {
    background-color: #ff804155;
    border-color: #ff8041;
}

.ffatabcontent[b-lq9nrmfx1c] {
    border: 1px solid #405864;
    padding: 5px;
    background-color: #F4F7F9;
    border-radius: 3px;
}
/* /Components/Pages/Futures/EuEtsCalculator.razor.rz.scp.css */
.euets-flex[b-h3ys2hq867] {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 20px;
}

.text-end[b-h3ys2hq867] {
    padding-left:0;
}

.euets-flex-calculations[b-h3ys2hq867] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 27px;
    margin-bottom: 15px;
}

.euets-flex-result[b-h3ys2hq867] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 27px;
    width: 100%;
}

.euets-grid-saved[b-h3ys2hq867] {
    display: grid;
    grid-template-columns: auto auto auto;
    gap: 10px;
    list-style:none;
    margin-left: 0;
    padding-left: 0;
}

.euets-grid-saved li[b-h3ys2hq867] {
    margin-left: 0;
    padding-left: 0;
}

.main-col-left[b-h3ys2hq867] {
    width: 350px;
}

.main-col-right[b-h3ys2hq867] {
    /*flex: 1 0 auto;*/
}

.euets-table-header1[b-h3ys2hq867] {
    font-family: 'Soehne breit', 'Franklin Gothic Book', Arial, sans-serif;
    font-size: 1.2rem;
    color: #009DC9;
    border: 2px solid #B5CBD6;
}

.euets-table-header2[b-h3ys2hq867] {
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: #009DC9;
}

.euets-result-values[b-h3ys2hq867] {
    font-size: 1rem;
    color: #000061;
    background-color: #E9EFF98A;
    font-weight: normal;
}

.euets-flex-savename[b-h3ys2hq867] {
    display: flex;
    justify-content: space-between;
    width: 355px;
}

.euets-savename[b-h3ys2hq867] {
    border-radius: 25px 0 0 25px;
    background: #009DC9;
    color: white;
    padding: 3px 0 3px 10px;
    width: 325px;
    border: none;
    overflow: hidden;
    text-overflow: clip;
}


.euets-savename-delete[b-h3ys2hq867] {
    border-radius: 0 25px 25px 0;
    background: #F7A506;
    border: none;
    padding: 3px 0 3px 0;
    width: 30px;
    cursor: pointer;
}

.euets-flex-delete[b-h3ys2hq867] {
    display: flex;
    justify-content: space-between;
    width: 150px;
}

.euets-savename-delete-confirm[b-h3ys2hq867] {
    border-radius: 25px 0 0 25px;
    background: #DB303A;
    border: none;
    color: white;
    padding: 3px 3px 3px 0;
    width: 75px;
    cursor: pointer;
    text-align: right;
}

.euets-savename-delete-cancel[b-h3ys2hq867] {
    border-radius: 0 25px 25px 0;
    background: #91A527;
    border: none;
    padding: 3px;
    width: 75px;
    cursor: pointer;
}

.euets-country-input[b-h3ys2hq867] {
    border: 1px solid #ced4da;
    border-radius: .375rem;
    color: #212529;
    padding: .375rem .75rem;
    line-height: 1.5;
}




.euets-flex-contact[b-h3ys2hq867] {
    display: flex;
    justify-content: space-around;
    height: 200px;
    width: 410px;
    padding: 5px;
}


.euets-assumptions-noneditable.form-control:disabled[b-h3ys2hq867]{
    background-color: #fff;
    color: #000;
    border-color: #fff;
}



@media only screen and (max-width: 1620px) {
    .euets-flex[b-h3ys2hq867] {
        gap: 10px;
    }


}
/* /Components/Pages/Futures/FuturesDataExtractor/FuturesTradeExtractor_00.razor.rz.scp.css */
.tradeextractPageLayout[b-llnat61zkx] {
    display: grid;
    grid-template-columns: 320px auto;
    gap: 20px;
}

.tradeextractbox[b-llnat61zkx] {
    border: 1px solid #009DC9;
}

.tradeextractdatepicker[b-llnat61zkx] {
}

.tradeextractroutepicker[b-llnat61zkx] {
    display: grid;
    grid-template-columns: 100px auto;
    gap: 20px;
}

.tradeextractroutepicker-ul[b-llnat61zkx] {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

    .tradeextractroutepicker-ul .chkbox[b-llnat61zkx] {
        margin: 0 3px 0 0;
        vertical-align: middle;
    }


    .tradeextractroutepicker-ul li[b-llnat61zkx] {
        text-decoration: none;
    }

        .tradeextractroutepicker-ul li:hover[b-llnat61zkx] {
            background-color: #B5CBD6;
        }

.tradeextractroutepicker-tbl tr:hover[b-llnat61zkx] {
    background-color: #B5CBD6;
}

.tradeextractroutepicker-tbl td[b-llnat61zkx] {
    padding-right: 30px;
}

.tradeextractroutepicker-tbl .delete[b-llnat61zkx] {
    cursor: pointer;
    padding-right: 3px;
}

    .tradeextractroutepicker-tbl .delete:hover[b-llnat61zkx] {
        font-weight: 700;
        color: white;
    }

.tradeextractoutput-tbl th:not(:first-child)[b-llnat61zkx] {
    text-align: center;
    border: 1px solid #B5CBD6;
}

.tradeextractoutput-tbl[b-llnat61zkx] {
    text-align: right;
}

    .tradeextractoutput-tbl tr:hover[b-llnat61zkx] {
        background-color: #B5CBD6;
    }

    .tradeextractoutput-tbl td:first-child[b-llnat61zkx], .tradeextractoutput-tbl th:first-child[b-llnat61zkx] {
        text-align: left;
    }

    .tradeextractoutput-tbl th label[b-llnat61zkx] {
        font-size: 0.8rem;
        font-weight: normal;
        color: #163E9F;
        font-style: italic;
    }

.tradeextractoutpup-btn-text[b-llnat61zkx] {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: center;
}

    .tradeextractoutpup-btn-text > div[b-llnat61zkx] {
        flex-shrink: 0;
    }

    .tradeextractoutpup-btn-text button[b-llnat61zkx] {
        white-space: nowrap;
    }

.tradeextractoutput-c3y[b-llnat61zkx] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.disclaimer-accordion[b-llnat61zkx] {
    background-color: #B5CBD6;
    color: #000061;
    cursor: pointer;
    padding: 2px 0 2px 20px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 0.8rem;
    transition: 0.4s;
}

    .disclaimer-accordion:hover[b-llnat61zkx] {
        background-color: #405864;
        color: white;
    }


.tradeflashing[b-llnat61zkx] {
    animation: tradeflash-b-llnat61zkx 3s infinite;
    color: #EB3871;
    font-weight: bold;
}

        @keyframes tradeflash-b-llnat61zkx {
            0%  {opacity: 1; }
            50% {opacity: 0.5; }
            100% {opacity: 1; }
        }
/* /Components/Pages/Futures/IntradayDashboard/IntradayDashboard.razor.rz.scp.css */
.settings-container[b-zzjkugx7ep] {
    position: fixed;
    top: 50px;
    display: flex;
    flex-direction: column;
    z-index: 925;
    left: 0;
    border-left: 3px solid #243447;
}

.settings-container.light-theme[b-zzjkugx7ep] {
    border-left: 3px solid #000061;
}

.settings-container .settings-btn[b-zzjkugx7ep] {
    height: 5rem;
    width: 1.3rem;
    background-color: #243447;
    color: white;
    border-radius: 0;
    border: 1px solid transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.settings-container.light-theme .settings-btn[b-zzjkugx7ep] {
    background-color: #000061;
}

.settings-container .settings-btn:last-child[b-zzjkugx7ep] {
    border-radius: 0 0px 15px 0;
}

.settings-container .settings-btn:hover[b-zzjkugx7ep] {
    background-color: white;
    color: #243447;
    border: 1px solid #243447;
}

.settings-container.light-theme .settings-btn:hover[b-zzjkugx7ep] {
    color: #000061;
    border: 1px solid #000061;
}

.settings-container .settings-btn:hover[b-zzjkugx7ep]  path,
.settings-container .settings-btn[b-zzjkugx7ep]  svg:hover path,
.settings-container .settings-btn[b-zzjkugx7ep]  path:hover {
    fill: #243447;
}

.settings-container.light-theme .settings-btn:hover[b-zzjkugx7ep]  path,
.settings-container.light-theme .settings-btn[b-zzjkugx7ep]  svg:hover path,
.settings-container.light-theme .settings-btn[b-zzjkugx7ep]  path:hover {
    fill: #000061;
}


.settings-container .settings-btn.copy-fade-in-fade-out[b-zzjkugx7ep] {
    animation-name: copyFadeInOut-b-zzjkugx7ep;
    animation-duration: 2000ms;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

@keyframes copyFadeInOut-b-zzjkugx7ep {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.dashboard-container[b-zzjkugx7ep] {
    overflow-x: auto;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
    /* screen width - navbar */
    height: calc(100vh - 55px);
    /* screen width - body margin - body padding - margin */
    width: calc(100vw - 1rem - 10px - 0.25em);
    padding-bottom: 0.25em;
    margin-left: 0.25em;
    box-sizing: border-box;
}

.board[b-zzjkugx7ep] {
    position: relative;
    display: grid;
    gap: 12px;
    width: fit-content;
    height: fit-content;
    max-width: 100%;
    max-height: 100%;
}

.item[b-zzjkugx7ep] {
    width: 100%;
    user-select: none;
    touch-action: none;
    cursor: grab;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

.board.modal-open .item[b-zzjkugx7ep],
.board.modal-open[b-zzjkugx7ep] {
    cursor: default;
}

.item:active[b-zzjkugx7ep],
.item:focus[b-zzjkugx7ep],
.item:focus-visible[b-zzjkugx7ep] {
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
    outline: none;
}

.placeholder-slot[b-zzjkugx7ep] {
    background: light-dark(rgba(0,0,0,.08), rgba(255,255,255,.08));
    border-radius: 0.75em;
    border: 2px dashed light-dark(rgba(0,0,0,.16), rgba(255,255,255,.16));
    z-index: 1;
}

.js-hidden-origin[b-zzjkugx7ep] {
    visibility: hidden;
    pointer-events: none;
    box-shadow: none;
}

.js-drag-ghost[b-zzjkugx7ep] {
    position: fixed;
    z-index: 9999;
    pointer-events: none;
    cursor: grabbing;
}

/* Add box shadow to child element */
.js-drag-ghost[b-zzjkugx7ep]  > div {
    box-shadow: 0 14px 28px light-dark(rgba(0,0,0,.18), rgba(255,255,255,.18));
}

.js-drag-placeholder[b-zzjkugx7ep] {
    z-index: 1;
}

[b-zzjkugx7ep] .intraday-settings-tab-legend {
    margin-right: 1rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

[b-zzjkugx7ep] .intraday-settings-configs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

[b-zzjkugx7ep] .intraday-settings-config-group {
    border: 1px solid #495057;
    border-radius: 0.5rem;
    padding: 0.75rem;
    margin-bottom: 1rem;
}

[b-zzjkugx7ep] .intraday-settings-config-title {
    color: #000061;
    margin-bottom: 0.5rem;
}

[b-zzjkugx7ep] .intraday-settings-config-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

[b-zzjkugx7ep] .intraday-settings-config-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    border: 1px solid #495057;
    border-radius: 0.4rem;
}

[b-zzjkugx7ep] .intraday-settings-config-row.selected {
    border-color: #0d6efd;
    background: color-mix(in srgb, #0d6efd 15%, transparent);
}

[b-zzjkugx7ep] .intraday-settings-config-main {
    flex: 1;
    text-align: left;
}

[b-zzjkugx7ep] .intraday-settings-config-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

[b-zzjkugx7ep] .intraday-settings-config-actions button {
    border: none;
    background: transparent;
    color: inherit;
}

[b-zzjkugx7ep] .intraday-settings-config-edit {
    display: flex;
    gap: 0.5rem;
    width: 100%;
}

[b-zzjkugx7ep] .intraday-settings-config-edit input {
    flex: 1;
}

[b-zzjkugx7ep] .intraday-settings-checkbox-row {
    width: 100%;
}

[b-zzjkugx7ep] .intraday-settings-checkbox-input {
    width: 20px;
    height: 20px;
    margin-top: 0;
    padding-left: 0;
}

[b-zzjkugx7ep] .intraday-settings-checkbox-label {
    padding-left: 0.5rem;
    vertical-align: middle;
    position: relative;
    bottom: 1px;
    margin: 0;
}

[b-zzjkugx7ep] .ssy-recursive-checkboxlist legend {
    font-size: 1.25rem;
}

[b-zzjkugx7ep] .ssy-recursive-checkboxlist-children {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

[b-zzjkugx7ep] .ssy-recursive-checkboxlist-items {
    display: flex;
    flex-direction: column;
}

[b-zzjkugx7ep] .ssy-recursive-checkboxlist-items > label {
    margin-bottom: 0.75rem;
}


/* Radio styling   */
/* ============== */
.chart-radio.myssy-radio-main[b-zzjkugx7ep] {
    display: flex;
    justify-content: center;
    gap: 0.5em;
}

.chart-radio.myssy-radio-main input[b-zzjkugx7ep] {
    display: none;
}

.chart-radio.myssy-radio-main label[b-zzjkugx7ep] {
    padding: 0.25em 0.5em;
    font-size: 1em;
    font-weight: 600;
    border-radius: 0.5em;
    background: #009DC9; /*light-dark(#009DC9,#152234);*/
    color: #FFFFFF; /*light-dark(#FFFFFF,#E5E7EB);*/
    cursor: pointer;
    border: 1px solid rgba(255,255,255,.08);
    transition: all .15s ease;
}

.chart-radio.myssy-radio-main label:hover[b-zzjkugx7ep] {
    background: #0076b0; /* light-dark(#0076b0, #1e3a5f); */
}

.chart-radio.myssy-radio-main input:checked + label[b-zzjkugx7ep] {
    background: #000061; /*light-dark(#000061, #22C55E);*/
    color: #fff; /*light-dark(#fff, #0f172a);*/
    border-color: transparent;
}

.chart-radio.myssy-radio-main input:disabled + label[b-zzjkugx7ep] {
    background: #E5E7EB;
    color: #000000;
    cursor: not-allowed;
    border-color: transparent;
}
/* /Components/Pages/Futures/IntradayDashboard/IntradayDashboardMobile.razor.rz.scp.css */
.settings-container[b-211w6tpvsx] {
    position: fixed;
    top: 50px;
    display: flex;
    flex-direction: column;
    z-index: 925;
    left: 0;
    border-left: 3px solid #000061;
}

.settings-btn[b-211w6tpvsx] {
    height: 5rem;
    width: 1.3rem;
    background-color: #000061;
    color: white;
    border-radius: 0;
    border: 1px solid transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.settings-btn.red-btn[b-211w6tpvsx] {
    background-color: #DB303A;
}

.settings-btn:last-child[b-211w6tpvsx] {
    border-radius: 0 0px 15px 0;
}

.settings-btn:hover[b-211w6tpvsx] {
    background-color: white;
    color: #000061;
    border: 1px solid #000061;
}

.settings-btn.red-btn:hover[b-211w6tpvsx] {
    color: #DB303A;
    border: 1px solid #DB303A;
}

.settings-btn:hover[b-211w6tpvsx]  path, .settings-btn[b-211w6tpvsx]  svg:hover path, .settings-btn[b-211w6tpvsx]  path:hover {
    fill: #000061;
}

.settings-btn.red-btn:hover[b-211w6tpvsx]  path, .settings-btn.red-btn[b-211w6tpvsx]  svg:hover path, .settings-btn.red-btn[b-211w6tpvsx]  path:hover {
    fill: #DB303A;
}

.dashboard-container[b-211w6tpvsx] {
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-gutter: stable;
    height: calc(100vh - 55px - 0.25em);
    display: flex;
    flex-direction: column;
    margin-bottom: 0.25em;
    margin-left: 0.25em;
    padding-right: 0.5em;
}

/*.dashboard-container .dashboard-row {
    display: flex;
    width: 100%;
    flex-wrap: unset;
    margin-bottom: 0.5em;
    column-gap: 0.5em;
}*/

    .dashboard-container .dashboard-item[b-211w6tpvsx] {
        /*min-height: 25em;*/
        /*border-radius: 1em;*/
        /*padding: 0.5em;*/
        /*max-height: 40em;*/
        margin-bottom: 0.5em;
    }

    .dashboard-container .dashboard-item.item-span-1[b-211w6tpvsx] {
        /*width: 22.25em;*/
        min-width: 22.25em;
    }

        .dashboard-container .dashboard-item.item-span-2[b-211w6tpvsx] {
            /*width: calc((22.25em * 2) + 0.5em);*/
            /*min-width: calc((22.25em * 2) + 0.5em);*/
            min-width: 22.25em;
        }

.dashboard-container .dashboard-item.item-padding[b-211w6tpvsx] {
    width: 0.5em;
    min-width: 0.5em;
}

@media (min-width: 2000px) {
    .intraday-dashboard[b-211w6tpvsx] {
        --ssy-grid-columns: 6;
    }
}

/* Large desktop */
@media (max-width: 1400px) {
    .intraday-dashboard[b-211w6tpvsx] {
        --ssy-grid-columns: 4;
    }
}

/* Portrait tablet to landscape and desktop */
@media (max-width: 979px) {
    .intraday-dashboard[b-211w6tpvsx] {
        --ssy-grid-columns: 2;
    }

    .grid-container[b-211w6tpvsx] {
        grid-template-columns: auto auto auto;
    }
}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
    .intraday-dashboard[b-211w6tpvsx] {
        --ssy-grid-columns: 1;
    }

    .grid-container[b-211w6tpvsx] {
        grid-template-columns: auto auto;
    }

    .span-3[b-211w6tpvsx] {
        grid-column: span 2;
    }
}

/* Landscape phones and down */
@media (max-width: 480px) {
    .intraday-dashboard[b-211w6tpvsx] {
        --ssy-grid-columns: 0;
    }

    .grid-container[b-211w6tpvsx] {
        grid-template-columns: auto;
    }

    .span-3[b-211w6tpvsx] {
        grid-column: span 1;
    }

    .span-2[b-211w6tpvsx] {
        grid-column: span 1;
    }
}
/* /Components/Pages/Futures/IntradayPrices/FfaLiveCurves.razor.rz.scp.css */
.itd-pge-noPaddingMargin[b-qnd7kw3gwk] {
    padding: 0 !important;
    margin: 0 !important;
    overflow-y: visible !important;
}

.container-fluid .itd-pge-row[b-qnd7kw3gwk] {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 0.5em;
}

.itd-pge-box[b-qnd7kw3gwk] {
    min-width: 22em;
    white-space: nowrap !important;
}

@media screen and (max-width:600px) {
    .itd-pge-box[b-qnd7kw3gwk] {
        width: 92%;
    }


}

@media screen and (min-width:600px) {
    .itd-pge-box[b-qnd7kw3gwk] {
        width: 20em;
        padding: 0;
    }

    .container-fluid .itd-pge-row[b-qnd7kw3gwk] {
        margin-left: -13px;
    }

}

@media screen and (min-width:768px) {
    .itd-pge-box[b-qnd7kw3gwk] {
        width: 22em;
        white-space: nowrap !important;
        padding: unset;
        margin-right: 5px;
    }

    .container-fluid .itd-pge-row[b-qnd7kw3gwk] {
        flex-wrap: unset;
        margin-left: 0;
    }
}


.itd-pge-box.draggable[b-qnd7kw3gwk] {
    background-color: rgba(255, 255, 255, 0.8);
    border: 1px solid rgba(0, 0, 0, 0.8);
    text-align: center;
}

   /* .itd-pge-box.draggable:hover {
        background-color: rgba(255, 255, 255, 0.8);
        border: 1px solid rgba(0, 0, 0, 0.8);
        text-align: center;
    }

    .itd-pge-box.draggable.dragging {
        background-color: rgba(255, 255, 255, 0.8);
        border: 1px solid rgba(0, 0, 0, 0.8);
        text-align: center;
    }*/
/* /Components/Pages/Futures/IntradayPrices/IntradayPriceTable.razor.rz.scp.css */
table.intraday thead tr[b-k45iaxlqku] {
    border-color: #0087CB !important;
}

table.intraday tbody tr[b-k45iaxlqku] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min-content !important;
    font-weight: bold;
}

table.intraday tbody tr th:nth-child(1)[b-k45iaxlqku] {
    text-align: left;
    padding-left: 5px;
}

table.intraday tbody tr td:nth-child(1)[b-k45iaxlqku] {
    text-align: center;
}

table.intraday tbody tr th:nth-child(2)[b-k45iaxlqku], td:nth-child(2)[b-k45iaxlqku] {
    text-align: right;
}

table.intraday tbody tr th:nth-child(3)[b-k45iaxlqku], td:nth-child(3)[b-k45iaxlqku] {
    text-align: right;
}

table.intraday tbody tr th:nth-child(4)[b-k45iaxlqku], td:nth-child(4)[b-k45iaxlqku] {
    text-align: right;
}

table.intraday tbody tr th:nth-child(5)[b-k45iaxlqku], td:nth-child(5)[b-k45iaxlqku] {
    text-align: right;
}

.pulsecolour[b-k45iaxlqku] {
    animation-name: pulseSetting;
    animation-duration: 700ms;
    animation-iteration-count: 40;
    animation-timing-function: linear;
}



/* /Components/Pages/Futures/LiveTrades.razor.rz.scp.css */


.date-select-simple-arrows[b-wzlyo9gp5s] {
    font-size: 20px;
    width: 30px;
}

.dateChanger-date[b-wzlyo9gp5s] {
    font-size: 16px;
    width: 160px;
    display: inline-block;
    text-align: center;
}

.date-select-simple-arrows.disable[b-wzlyo9gp5s] {
    color: lightgray;
}

    .date-select-simple-arrows.disable:hover[b-wzlyo9gp5s] {
        color: lightgray;
        cursor: default;
        font-weight: normal;
    }

.arrow[b-wzlyo9gp5s] {
    height: 20px;
}

    .arrow.switch-arrow[b-wzlyo9gp5s] {
        transform: rotate(180deg);
    }

.tooltip-box[b-wzlyo9gp5s] {
    position: fixed;
    padding: 10px;
    background-color: #000061;
    border-radius: 5px;
    color: #fff;
}


.filtertextbox[b-wzlyo9gp5s] {
    width: 300px;
    padding-right: 4px;
    margin-left: 5%;
    margin-top: 0%;
}


.ssythemefilter[b-wzlyo9gp5s] {
    background-color: white;
    border-color: #d2cdc3;
    color: black;
}

.pulsenewtrade[b-wzlyo9gp5s] {
    animation-name: pulseNewTradeSettings-b-wzlyo9gp5s;
    animation-duration: 700ms;
    animation-iteration-count: 40;
    animation-timing-function: linear;
    font-weight: bold;
    color: black;
    background-color: #D9EBF9 !important;
}

.tradetable-row[b-wzlyo9gp5s] {
    cursor: pointer;
    height: 1.5em;
}

.tradetable-div[b-wzlyo9gp5s] {
    font-family: Verdana;
    font-size: 0.9rem;
    flex-basis: content;
    flex-shrink: 1;
    width: 100%;
}

.tradetable[b-wzlyo9gp5s] {
    width: 650px;
}

.numcol[b-wzlyo9gp5s] {
    text-align: right;
}

.centercol[b-wzlyo9gp5s] {
    text-align: center;
}

.lightUnderscore[b-wzlyo9gp5s] {
    text-decoration: underline;
    -webkit-text-decoration-color: silver; /* safari still uses vendor prefix */
    text-decoration-color: silver;
}

.stattable-routename[b-wzlyo9gp5s] {
    border-top: solid 1px silver;
    border-bottom: solid 1px silver;
    background-color: none;
    font-weight: bold;
    color: #000061;
}

.stattable-detail[b-wzlyo9gp5s] {
    background-color: none;
}

    .stattable-detail:hover[b-wzlyo9gp5s] {
        background-color: lightgrey;
    }

.tradesummarylogo[b-wzlyo9gp5s] {
    background-image: url("/assets/lines/SSYShippingLines_01_stretchable.svg");
    background-size: 100% 200%;
    /*background-position-y: -10px;*/
}

@keyframes pulseNewTradeSettings-b-wzlyo9gp5s {
    0% {
        /*background-color: #f0e2b4 !important;*/
        color: black;
    }

    100% {
        /*background-color: #f5ef87 !important;*/
        color: red;
    }
}

@media screen and (max-width: 1400px) {
    .tradetable[b-wzlyo9gp5s] {
        width: 450px;
    }
}


@media screen and (max-width: 600px) {
    .hide-mobile[b-wzlyo9gp5s] {
        display: none;
    }

    .flex-mobile-wrap[b-wzlyo9gp5s] {
        flex-wrap: wrap;
    }

    .tradetable[b-wzlyo9gp5s] {
        width: 100%;
    }

    .tradetable-div[b-wzlyo9gp5s] {
        flex-basis: unset;
        flex-shrink: 1;
        width: 100%;
    }

    .date-select-simple .date-arrows[b-wzlyo9gp5s] {
        padding: 0 8px 0 8px;
    }
}
/* /Components/Pages/Futures/Splash/Splash_010_Main.razor.rz.scp.css */
/* ============== HERO ============== */
.hero[b-7cbyp12ixa] {
    position: relative;
    min-height: 540px;
    border-radius: 28px;
    overflow: hidden;
    isolation: isolate;
    margin-bottom: 16px;
}
.hero-bg[b-7cbyp12ixa] {
    position: absolute;
    inset: 0;
    z-index: -1;
    overflow: hidden;
}
.hero-photo[b-7cbyp12ixa] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.06);
    animation: heroZoom-b-7cbyp12ixa 24s ease-in-out infinite;
}
@keyframes heroZoom-b-7cbyp12ixa {
    0%, 100% { transform: scale(1.06) translate(0, 0); }
    50%      { transform: scale(1.12) translate(-1.5%, -1%); }
}
.hero-veil[b-7cbyp12ixa] {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 30% 50%, rgba(5,6,20,0.25) 0%, rgba(5,6,20,0.85) 70%),
        linear-gradient(180deg, rgba(5,6,20,0.55) 0%, rgba(5,6,20,0.92) 100%);
}

.hero-particles[b-7cbyp12ixa] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}
.hero-particle[b-7cbyp12ixa] {
    position: absolute;
    width: 3px; height: 3px;
    border-radius: 50%;
    background: rgba(0,157,201,0.7);
    box-shadow: 0 0 8px rgba(0,157,201,0.7);
    animation: particleFloat-b-7cbyp12ixa 12s linear infinite;
}
@keyframes particleFloat-b-7cbyp12ixa {
    0%   { transform: translateY(40px); opacity: 0; }
    20%  { opacity: 1; }
    100% { transform: translateY(-60vh); opacity: 0; }
}
.hero-particle.p-0[b-7cbyp12ixa]  { left: 5%;  bottom: 0; animation-delay: 0s;     animation-duration: 13s; }
.hero-particle.p-1[b-7cbyp12ixa]  { left: 12%; bottom: 0; animation-delay: -2s;    animation-duration: 11s; background: rgba(247,165,6,0.6); box-shadow: 0 0 8px rgba(247,165,6,0.6); }
.hero-particle.p-2[b-7cbyp12ixa]  { left: 19%; bottom: 0; animation-delay: -5s;    animation-duration: 14s; }
.hero-particle.p-3[b-7cbyp12ixa]  { left: 26%; bottom: 0; animation-delay: -3s;    animation-duration: 12s; }
.hero-particle.p-4[b-7cbyp12ixa]  { left: 33%; bottom: 0; animation-delay: -7s;    animation-duration: 16s; }
.hero-particle.p-5[b-7cbyp12ixa]  { left: 40%; bottom: 0; animation-delay: -1s;    animation-duration: 15s; background: rgba(247,165,6,0.6); }
.hero-particle.p-6[b-7cbyp12ixa]  { left: 47%; bottom: 0; animation-delay: -4s;    animation-duration: 13s; }
.hero-particle.p-7[b-7cbyp12ixa]  { left: 54%; bottom: 0; animation-delay: -8s;    animation-duration: 11s; }
.hero-particle.p-8[b-7cbyp12ixa]  { left: 61%; bottom: 0; animation-delay: -2.5s;  animation-duration: 14s; }
.hero-particle.p-9[b-7cbyp12ixa]  { left: 68%; bottom: 0; animation-delay: -6s;    animation-duration: 12s; background: rgba(247,165,6,0.6); }
.hero-particle.p-10[b-7cbyp12ixa] { left: 74%; bottom: 0; animation-delay: -3.5s;  animation-duration: 15s; }
.hero-particle.p-11[b-7cbyp12ixa] { left: 81%; bottom: 0; animation-delay: -9s;    animation-duration: 13s; }
.hero-particle.p-12[b-7cbyp12ixa] { left: 88%; bottom: 0; animation-delay: -1.5s;  animation-duration: 11s; }
.hero-particle.p-13[b-7cbyp12ixa] { left: 94%; bottom: 0; animation-delay: -4.5s;  animation-duration: 16s; }
.hero-particle.p-14[b-7cbyp12ixa] { left: 8%;  bottom: 0; animation-delay: -10s;   animation-duration: 14s; }
.hero-particle.p-15[b-7cbyp12ixa] { left: 22%; bottom: 0; animation-delay: -7.5s;  animation-duration: 12s; background: rgba(247,165,6,0.6); }
.hero-particle.p-16[b-7cbyp12ixa] { left: 56%; bottom: 0; animation-delay: -11s;   animation-duration: 15s; }
.hero-particle.p-17[b-7cbyp12ixa] { left: 78%; bottom: 0; animation-delay: -2.8s;  animation-duration: 13s; }

.hero-grid[b-7cbyp12ixa] {
    position: relative;
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 48px;
    padding: 64px 56px;
    align-items: center;
}
.hero-copy[b-7cbyp12ixa] { max-width: 640px; }
.hero-lede[b-7cbyp12ixa] {
    font-size: 16px;
    line-height: 1.6;
    color: rgba(231,236,255,0.78);
    margin: 18px 0 28px;
    max-width: 540px;
    font-weight: 300;
}
.hero-cta[b-7cbyp12ixa] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.hero-btn[b-7cbyp12ixa] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 24px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-decoration: none;
    transition: all 0.3s cubic-bezier(.2,.8,.2,1);
}
.hero-btn.primary[b-7cbyp12ixa] {
    background: linear-gradient(135deg, #009DC9, #003B89);
    color: #fff;
    box-shadow: 0 14px 32px rgba(0,157,201,0.38);
}
.hero-btn.primary:hover[b-7cbyp12ixa] {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px rgba(0,157,201,0.52);
}
.hero-btn.primary span[b-7cbyp12ixa] { transition: transform 0.3s; display: inline-block; }
.hero-btn.primary:hover span[b-7cbyp12ixa] { transform: translateX(4px); }

.hero-btn.ghost[b-7cbyp12ixa] {
    background: rgba(255,255,255,0.06);
    color: #e7ecff;
    border: 1px solid rgba(255,255,255,0.18);
}
.hero-btn.ghost:hover[b-7cbyp12ixa] {
    background: rgba(255,255,255,0.12);
    border-color: rgba(255,255,255,0.4);
}

.hero-cal[b-7cbyp12ixa] { justify-self: end; width: 100%; max-width: 480px; }

@media (max-width: 1100px) {
    .hero-grid[b-7cbyp12ixa] { grid-template-columns: 1fr; padding: 40px 28px; gap: 32px; }
    .hero-cal[b-7cbyp12ixa] { justify-self: stretch; max-width: none; }
}

/* ============== CURVES GRID ============== */
.curves-grid[b-7cbyp12ixa] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 18px;
}

/* ============== JUMP CARDS ============== */
.jump-grid[b-7cbyp12ixa] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 18px;
}
.jump[b-7cbyp12ixa] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 28px;
    border-radius: 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    color: #e7ecff;
    text-decoration: none;
    overflow: hidden;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: all 0.4s cubic-bezier(.2,.8,.2,1);
}
.jump[b-7cbyp12ixa]::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 100% 0%, rgba(0,157,201,0.18), transparent 60%);
    opacity: 0;
    transition: opacity 0.4s;
}
.jump:hover[b-7cbyp12ixa] {
    transform: translateY(-4px);
    border-color: rgba(0,157,201,0.5);
    color: #fff;
    box-shadow: 0 20px 50px rgba(0,157,201,0.18);
}
.jump:hover[b-7cbyp12ixa]::before { opacity: 1; }
.jump-num[b-7cbyp12ixa] {
    font-size: 11px;
    letter-spacing: 0.3em;
    color: #009DC9;
    font-variant-numeric: tabular-nums;
}
.jump-title[b-7cbyp12ixa] {
    font-size: 24px;
    font-weight: 400;
    color: #fff;
    letter-spacing: -0.01em;
}
.jump-blurb[b-7cbyp12ixa] {
    font-size: 13px;
    color: rgba(231,236,255,0.7);
    line-height: 1.5;
    margin-top: 4px;
}
.jump-arrow[b-7cbyp12ixa] {
    margin-top: 12px;
    font-size: 18px;
    color: #F7A506;
    transition: transform 0.3s;
}
.jump:hover .jump-arrow[b-7cbyp12ixa] { transform: translateX(6px); }
/* /Components/Pages/Futures/Splash/Splash_100_Markets.razor.rz.scp.css */
.md-lede[b-15m1jog54h] {
    font-size: 16px;
    color: rgba(231,236,255,0.7);
    margin: 16px 0 0;
    max-width: 640px;
}

.md-grid[b-15m1jog54h] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 18px;
}

.md-card[b-15m1jog54h] {
    --accent: #009DC9;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 24px 26px 22px;
    border-radius: 20px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    color: #e7ecff;
    text-decoration: none;
    overflow: hidden;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: all 0.4s cubic-bezier(.2,.8,.2,1);
}
.md-card[b-15m1jog54h]::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: 20px;
    padding: 1px;
    background: linear-gradient(135deg, var(--accent), transparent 60%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.4s;
}
.md-card:hover[b-15m1jog54h] {
    transform: translateY(-5px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
    color: #fff;
}
.md-card:hover[b-15m1jog54h]::before { opacity: 0.85; }

.md-card-strip[b-15m1jog54h] {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--accent), transparent 70%);
}

.md-card-eyebrow[b-15m1jog54h] {
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 4px;
}
.md-card-title[b-15m1jog54h] {
    font-size: 24px;
    font-weight: 400;
    color: #fff;
    letter-spacing: -0.01em;
}
.md-card-sub[b-15m1jog54h] {
    font-size: 12px;
    color: rgba(231,236,255,0.55);
    letter-spacing: 0.04em;
    margin-top: 2px;
}

.md-card-spot[b-15m1jog54h] {
    display: flex;
    align-items: baseline;
    gap: 12px;
}
.md-card-spot-num[b-15m1jog54h] {
    font-size: 38px;
    font-weight: 200;
    color: #fff;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.md-card-tenors[b-15m1jog54h] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
    padding: 12px 0;
    border-top: 1px solid rgba(255,255,255,0.08);
    border-bottom: 1px solid rgba(255,255,255,0.08);
}
.md-tenor[b-15m1jog54h] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    text-align: center;
    padding: 4px;
    border-radius: 6px;
}
.md-tenor-period[b-15m1jog54h] {
    font-size: 9px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(231,236,255,0.45);
}
.md-tenor-mid[b-15m1jog54h] {
    font-size: 13px;
    color: #fff;
    font-variant-numeric: tabular-nums;
}

.md-card-go[b-15m1jog54h] {
    margin-top: auto;
    font-size: 12px;
    letter-spacing: 0.1em;
    color: var(--accent);
    transition: transform 0.3s;
}
.md-card:hover .md-card-go[b-15m1jog54h] { transform: translateX(4px); }
/* /Components/Pages/Futures/Splash/Splash_200_Charts.razor.rz.scp.css */
.cv-lede[b-uhqsmwxsts] {
    font-size: 16px;
    color: rgba(231,236,255,0.7);
    margin: 16px 0 0;
    max-width: 640px;
}
.cv-jump-grid[b-uhqsmwxsts] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 18px;
}
.cv-jump[b-uhqsmwxsts] {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 28px;
    border-radius: 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    color: #e7ecff;
    text-decoration: none;
    overflow: hidden;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: all 0.4s cubic-bezier(.2,.8,.2,1);
}
.cv-jump[b-uhqsmwxsts]::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, transparent 60%, rgba(0,157,201,0.18));
    opacity: 0;
    transition: opacity 0.4s;
}
.cv-jump:hover[b-uhqsmwxsts] {
    transform: translateY(-4px);
    border-color: rgba(0,157,201,0.5);
    box-shadow: 0 18px 50px rgba(0,157,201,0.22);
    color: #fff;
}
.cv-jump:hover[b-uhqsmwxsts]::after { opacity: 1; }
.cv-jump-num[b-uhqsmwxsts] {
    font-size: 11px;
    letter-spacing: 0.3em;
    color: #009DC9;
    font-variant-numeric: tabular-nums;
}
.cv-jump-title[b-uhqsmwxsts] {
    font-size: 24px;
    color: #fff;
    font-weight: 400;
    letter-spacing: -0.01em;
}
.cv-jump-blurb[b-uhqsmwxsts] {
    font-size: 13px;
    line-height: 1.5;
    color: rgba(231,236,255,0.7);
}
.cv-jump-go[b-uhqsmwxsts] {
    margin-top: 12px;
    font-size: 12px;
    letter-spacing: 0.12em;
    color: #F7A506;
}
/* /Components/Pages/Futures/Splash/Splash_210_Indices.razor.rz.scp.css */
.ix-lede[b-hu4nh92yrd] {
    font-size: 16px;
    color: rgba(231,236,255,0.7);
    margin: 16px 0 0;
    max-width: 640px;
}
.ix-charts[b-hu4nh92yrd] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
    gap: 18px;
}
.ix-chart[b-hu4nh92yrd] {
    padding: 22px 24px 18px;
    min-height: 380px;
    display: flex;
    flex-direction: column;
}
.ix-chart-head[b-hu4nh92yrd] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 6px;
}
.ix-chart-eyebrow[b-hu4nh92yrd] {
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: rgba(231,236,255,0.45);
}
.ix-chart-title[b-hu4nh92yrd] {
    font-size: 18px;
    color: #fff;
    font-weight: 500;
    letter-spacing: 0.02em;
}
.ix-chart-body[b-hu4nh92yrd] {
    flex: 1;
    min-height: 320px;
}
.ix-chart-placeholder[b-hu4nh92yrd] {
    width: 100%;
    height: 320px;
}
/* /Components/Pages/Futures/Splash/Splash_220_Differentials.razor.rz.scp.css */
.df-lede[b-op2e9l1ihu] {
    font-size: 16px;
    color: rgba(231,236,255,0.7);
    margin: 16px 0 0;
    max-width: 640px;
}
.df-chart[b-op2e9l1ihu] { padding: 24px 26px 22px; }
.df-chart-head[b-op2e9l1ihu] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 12px;
}
.df-chart-eyebrow[b-op2e9l1ihu] {
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: rgba(231,236,255,0.45);
}
.df-chart-title[b-op2e9l1ihu] {
    font-size: 18px;
    color: #fff;
    font-weight: 500;
}
.df-chart-body[b-op2e9l1ihu] { min-height: 460px; }
/* /Components/Pages/Futures/Splash/Splash_230_Movement.razor.rz.scp.css */
.mv-lede[b-nlkyiw6kdh] {
    font-size: 16px;
    color: rgba(231,236,255,0.7);
    margin: 16px 0 0;
    max-width: 740px;
}

/* ============== ROUTE PICKER ============== */
.mv-vessels[b-nlkyiw6kdh] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}
.mv-vessel[b-nlkyiw6kdh] {
    --accent: #009DC9;
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 14px;
    color: rgba(231,236,255,0.85);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(.2,.8,.2,1);
    text-align: left;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}
.mv-vessel:hover[b-nlkyiw6kdh] {
    transform: translateY(-2px);
    border-color: var(--accent);
    color: #fff;
}
.mv-vessel.active[b-nlkyiw6kdh] {
    background: rgba(0,157,201,0.12);
    border-color: var(--accent);
    color: #fff;
    box-shadow: 0 10px 30px rgba(0,157,201,0.25);
}
.mv-vessel-dot[b-nlkyiw6kdh] {
    width: 10px; height: 10px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 10px var(--accent);
    flex-shrink: 0;
    transition: transform 0.3s;
}
.mv-vessel.active .mv-vessel-dot[b-nlkyiw6kdh] {
    animation: vesselDotPulse-b-nlkyiw6kdh 1.6s ease-in-out infinite;
}
@keyframes vesselDotPulse-b-nlkyiw6kdh {
    0%, 100% { transform: scale(1); opacity: 1; }
    50%      { transform: scale(1.5); opacity: 0.6; }
}
.mv-vessel-name[b-nlkyiw6kdh] {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: inherit;
}
.mv-vessel-route[b-nlkyiw6kdh] {
    font-size: 10px;
    color: rgba(231,236,255,0.5);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    margin-left: auto;
}

/* ============== CHART CARD ============== */
.mv-chart[b-nlkyiw6kdh] {
    padding: 24px 28px 20px;
}
.mv-chart-head[b-nlkyiw6kdh] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.mv-chart-eyebrow[b-nlkyiw6kdh] {
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: rgba(231,236,255,0.45);
    margin-bottom: 4px;
}
.mv-chart-title[b-nlkyiw6kdh] {
    font-size: 22px;
    color: #fff;
    font-weight: 400;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}

.mv-key[b-nlkyiw6kdh] {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.mv-key-item[b-nlkyiw6kdh] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: rgba(231,236,255,0.7);
    letter-spacing: 0.06em;
}
.mv-key-mid[b-nlkyiw6kdh], .mv-key-up[b-nlkyiw6kdh], .mv-key-down[b-nlkyiw6kdh] {
    width: 14px;
    height: 14px;
    border-radius: 3px;
}
.mv-key-mid[b-nlkyiw6kdh] { background: rgba(0,157,201,0.85); }
.mv-key-up[b-nlkyiw6kdh] {
    background: rgba(77,220,165,0.95);
    border: 1px solid rgba(77,220,165,1);
}
.mv-key-down[b-nlkyiw6kdh] {
    background: rgba(255,107,138,0.4);
    border: 1px solid rgba(255,107,138,1);
}

.mv-chart-body[b-nlkyiw6kdh] {
    position: relative;
    min-height: 480px;
    overflow: hidden;
    border-radius: 12px;
}

/* Huge outlined date that floats over the lower-left while playing.
   Uses -webkit-text-stroke so the glyphs are hollow and the chart
   shows through the centre of each letter. */
.mv-date-overlay[b-nlkyiw6kdh] {
    position: absolute;
    left: 12px;
    bottom: 12px;
    pointer-events: none;
    z-index: 4;
    margin: 0;
    padding: 0;
    font-family: 'Soehne', 'Inter', system-ui, sans-serif;
    font-size: 4rem;
    margin-top: -3rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.05em;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
    /* hollow glyphs - chart shows through every letter */
    color: transparent;
    -webkit-text-stroke: 1px rgba(231, 236, 255, 0.8);
    text-stroke: 1px rgba(231, 236, 255, 0.8);
    text-shadow: 0 0 60px rgba(0, 157, 201, 0.18);
    opacity: 0;
    transform: translateY(24px) scale(0.98);
    transition: opacity 0.5s cubic-bezier(.2,.8,.2,1), transform 0.6s cubic-bezier(.2,.8,.2,1);
}
    .mv-date-overlay.visible[b-nlkyiw6kdh] {
        opacity: 1;
        transform: translateY(0) scale(1);
        font-size: 4rem;
        position: absolute;
        margin-top: -3rem;
    }

/* ============== TIMELINE ============== */
.mv-timeline[b-nlkyiw6kdh] {
    margin-top: 18px;
    padding: 20px 22px;
    border-radius: 14px;
    background: rgba(7,10,32,0.5);
    border: 1px solid rgba(255,255,255,0.08);
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 22px;
    align-items: center;
}

.mv-play[b-nlkyiw6kdh] {
    width: 52px; height: 52px;
    border-radius: 50%;
    border: 1px solid rgba(0,157,201,0.5);
    background: linear-gradient(135deg, rgba(0,157,201,0.25), rgba(0,0,97,0.4));
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(.2,.8,.2,1);
    flex-shrink: 0;
}
.mv-play:hover:not(:disabled)[b-nlkyiw6kdh] {
    transform: scale(1.06);
    border-color: #009DC9;
    box-shadow: 0 8px 24px rgba(0,157,201,0.5);
}
.mv-play:disabled[b-nlkyiw6kdh] {
    opacity: 0.4;
    cursor: not-allowed;
}
.mv-play.playing[b-nlkyiw6kdh] {
    border-color: #F7A506;
    background: linear-gradient(135deg, rgba(247,165,6,0.3), rgba(0,0,97,0.4));
    box-shadow: 0 0 0 4px rgba(247,165,6,0.15), 0 8px 24px rgba(247,165,6,0.4);
    animation: playingPulse-b-nlkyiw6kdh 1.8s ease-in-out infinite;
}
@keyframes playingPulse-b-nlkyiw6kdh {
    0%, 100% { box-shadow: 0 0 0 4px rgba(247,165,6,0.15), 0 8px 24px rgba(247,165,6,0.4); }
    50%      { box-shadow: 0 0 0 8px rgba(247,165,6,0.05), 0 8px 24px rgba(247,165,6,0.55); }
}

/* slider track */
.mv-track-wrap[b-nlkyiw6kdh] {
    position: relative;
    padding: 0 4px;
}
.mv-track[b-nlkyiw6kdh] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 6px;
    background: linear-gradient(90deg, rgba(0,157,201,0.4), rgba(247,165,6,0.4));
    border-radius: 6px;
    outline: none;
    cursor: pointer;
    margin: 0;
}
.mv-track:disabled[b-nlkyiw6kdh] { opacity: 0.4; cursor: not-allowed; }

.mv-track[b-nlkyiw6kdh]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 22px; height: 22px;
    background: #fff;
    border: 3px solid #009DC9;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 0 4px rgba(0,157,201,0.2), 0 4px 12px rgba(0,0,0,0.5);
    transition: transform 0.2s, box-shadow 0.2s;
}
.mv-track[b-nlkyiw6kdh]::-webkit-slider-thumb:hover {
    transform: scale(1.15);
    box-shadow: 0 0 0 8px rgba(0,157,201,0.18), 0 4px 14px rgba(0,0,0,0.55);
}
.mv-track[b-nlkyiw6kdh]::-moz-range-thumb {
    width: 22px; height: 22px;
    background: #fff;
    border: 3px solid #009DC9;
    border-radius: 50%;
    cursor: pointer;
}

.mv-track-labels[b-nlkyiw6kdh] {
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    font-size: 11px;
    letter-spacing: 0.12em;
    color: rgba(231,236,255,0.5);
}

.mv-tick-row[b-nlkyiw6kdh] {
    position: absolute;
    top: -2px;
    left: 4px; right: 4px;
    height: 10px;
    pointer-events: none;
}
.mv-tick[b-nlkyiw6kdh] {
    position: absolute;
    top: 0;
    width: 2px;
    height: 10px;
    margin-left: -1px;
    background: rgba(255,255,255,0.18);
    transform: translateY(0);
    transition: background 0.2s, transform 0.2s, height 0.2s;
}
.mv-tick.active[b-nlkyiw6kdh] {
    background: #F7A506;
    height: 14px;
    box-shadow: 0 0 8px #F7A506;
}

.mv-counter[b-nlkyiw6kdh] {
    text-align: right;
    color: rgba(231,236,255,0.7);
    font-variant-numeric: tabular-nums;
    font-size: 13px;
    letter-spacing: 0.08em;
    min-width: 64px;
}
.mv-counter-now[b-nlkyiw6kdh] {
    color: #fff;
    font-weight: 500;
    font-size: 16px;
}
.mv-counter-of[b-nlkyiw6kdh] {
    color: rgba(231,236,255,0.45);
    margin-left: 4px;
}

@media (max-width: 760px) {
    .mv-timeline[b-nlkyiw6kdh] {
        grid-template-columns: 1fr;
        gap: 16px;
        text-align: center;
    }
    .mv-counter[b-nlkyiw6kdh] { text-align: center; }
    .mv-play[b-nlkyiw6kdh] { justify-self: center; }
}
/* /Components/Pages/Futures/Splash/Splash_300_Commentary.razor.rz.scp.css */
.cm-lede[b-a07mpaaij3] {
    font-size: 16px;
    color: rgba(231,236,255,0.7);
    margin: 16px 0 0;
    max-width: 720px;
}
.cm-deep[b-a07mpaaij3] {
    color: #009DC9;
    text-decoration: none;
    border-bottom: 1px dashed rgba(0,157,201,0.5);
    transition: color 0.25s, border-color 0.25s;
}
.cm-deep:hover[b-a07mpaaij3] { color: #fff; border-color: #fff; }

.cm-grid[b-a07mpaaij3] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 18px;
}
.cm-card[b-a07mpaaij3] {
    --accent: #009DC9;
    position: relative;
    padding: 26px 28px;
    border-radius: 18px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.10);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(.2,.8,.2,1), border-color 0.3s, box-shadow 0.3s;
}
.cm-card:hover[b-a07mpaaij3] {
    transform: translateY(-3px);
    border-color: var(--accent);
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.4);
}
.cm-card-strip[b-a07mpaaij3] {
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--accent), transparent);
}
.cm-card-eyebrow[b-a07mpaaij3] {
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 6px;
}
.cm-card-title[b-a07mpaaij3] {
    font-size: 22px;
    color: #fff;
    font-weight: 500;
    margin: 0 0 14px;
    letter-spacing: 0.01em;
}
.cm-card-body[b-a07mpaaij3] {
    color: rgba(231,236,255,0.85);
    line-height: 1.65;
    font-size: 14px;
}
[b-a07mpaaij3] .cm-card-body p { margin: 0 0 10px; }
[b-a07mpaaij3] .cm-card-body strong { color: #fff; font-weight: 500; }
[b-a07mpaaij3] .cm-card-body a { color: #009DC9; text-decoration: none; }
[b-a07mpaaij3] .cm-card-body a:hover { text-decoration: underline; }
.cm-empty[b-a07mpaaij3] {
    color: rgba(231,236,255,0.4);
    font-style: italic;
}
/* /Components/Pages/Futures/Splash/Splash_310_Fundamentals.razor.rz.scp.css */
.fd-lede[b-ffzgitmrxx] {
    font-size: 16px;
    color: rgba(231,236,255,0.7);
    margin: 16px 0 0;
    max-width: 720px;
}
.fd-card[b-ffzgitmrxx] { padding: 32px 36px; max-width: 920px; }
.fd-card-eyebrow[b-ffzgitmrxx] {
    font-size: 10px;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: #009DC9;
    margin-bottom: 8px;
}
.fd-card-title[b-ffzgitmrxx] {
    font-size: 24px;
    color: #fff;
    font-weight: 400;
    letter-spacing: 0.01em;
    margin: 0 0 22px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    padding-bottom: 18px;
}
.fd-card-body[b-ffzgitmrxx] {
    color: rgba(231,236,255,0.88);
    font-size: 15px;
    line-height: 1.75;
    font-weight: 300;
}
[b-ffzgitmrxx] .fd-card-body p { margin: 0 0 14px; }
[b-ffzgitmrxx] .fd-card-body strong { color: #fff; font-weight: 500; }
[b-ffzgitmrxx] .fd-card-body a { color: #009DC9; text-decoration: none; }
[b-ffzgitmrxx] .fd-card-body a:hover { text-decoration: underline; }
.fd-empty[b-ffzgitmrxx] {
    color: rgba(231,236,255,0.4);
    font-style: italic;
}
/* /Components/Pages/Futures/Splash/_Shared/SplashCalendar.razor.rz.scp.css */
.cal-wrap[b-2ypt9igbf7] {
    position: relative;
    width: 100%;
    max-width: 540px;
}

/* ----- HERO ----- */
.cal-hero[b-2ypt9igbf7] {
    position: relative;
    padding: 28px 32px;
    border-radius: 24px;
    background: linear-gradient(140deg, rgba(0,157,201,0.18) 0%, rgba(0,0,97,0.4) 60%, rgba(247,165,6,0.08) 100%);
    border: 1px solid rgba(255,255,255,0.16);
    cursor: pointer;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(.2,.8,.2,1), box-shadow 0.4s;
    user-select: none;
}
.cal-hero:hover[b-2ypt9igbf7] {
    transform: translateY(-3px);
    box-shadow: 0 24px 60px rgba(0,157,201,0.28);
}
.cal-hero-eyebrow[b-2ypt9igbf7] {
    display: flex; align-items: center; gap: 8px;
    color: rgba(231,236,255,0.7);
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.cal-hero-eyebrow .dot[b-2ypt9igbf7] {
    width: 8px; height: 8px; border-radius: 50%;
    background: #4ddca5;
    box-shadow: 0 0 10px #4ddca5;
    animation: heroPulse-b-2ypt9igbf7 1.4s ease-in-out infinite;
}
@keyframes heroPulse-b-2ypt9igbf7 {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.5); opacity: 0.5; }
}

.cal-hero-display[b-2ypt9igbf7] {
    display: flex;
    align-items: flex-end;
    gap: 22px;
}
.cal-hero-day[b-2ypt9igbf7] {
    font-size: 96px;
    font-weight: 200;
    line-height: 0.9;
    color: #fff;
    letter-spacing: -0.04em;
    font-variant-numeric: tabular-nums;
    text-shadow: 0 4px 30px rgba(0,157,201,0.4);
}
.cal-hero-rest[b-2ypt9igbf7] { padding-bottom: 10px; }
.cal-hero-month[b-2ypt9igbf7] {
    font-size: 24px;
    font-weight: 500;
    color: #fff;
    letter-spacing: 0.02em;
}
.cal-hero-year[b-2ypt9igbf7] {
    font-size: 14px;
    color: rgba(231,236,255,0.65);
    letter-spacing: 0.16em;
    margin-top: 2px;
}
.cal-hero-dow[b-2ypt9igbf7] {
    font-size: 11px;
    color: #F7A506;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    margin-top: 8px;
    font-weight: 500;
}

.cal-hero-foot[b-2ypt9igbf7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.cal-step[b-2ypt9igbf7] {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.18);
    color: #e7ecff;
    width: 40px; height: 40px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.25s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.cal-step:hover[b-2ypt9igbf7] {
    background: rgba(0,157,201,0.25);
    border-color: #009DC9;
    transform: scale(1.05);
}
.cal-step:disabled[b-2ypt9igbf7] {
    opacity: 0.3;
    cursor: not-allowed;
    transform: none;
}
.cal-hint[b-2ypt9igbf7] {
    font-size: 11px;
    color: rgba(231,236,255,0.5);
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.cal-glow[b-2ypt9igbf7] {
    position: absolute;
    width: 280px; height: 280px;
    right: -80px; top: -80px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0,157,201,0.4) 0%, transparent 70%);
    pointer-events: none;
    animation: glowFloat-b-2ypt9igbf7 8s ease-in-out infinite;
}
@keyframes glowFloat-b-2ypt9igbf7 {
    0%, 100% { transform: translate(0, 0); }
    50% { transform: translate(-30px, 20px); }
}

/* ----- PANEL (calendar grid drawer) ----- */
.cal-panel[b-2ypt9igbf7] {
    margin-top: 12px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(.2,.8,.2,1), opacity 0.4s, margin-top 0.4s;
    pointer-events: none;
}
.cal-wrap.expanded .cal-panel[b-2ypt9igbf7] {
    max-height: 540px;
    opacity: 1;
    pointer-events: auto;
}
.cal-panel-inner[b-2ypt9igbf7] {
    padding: 22px;
    background: rgba(7, 10, 32, 0.55);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 20px;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.cal-quick[b-2ypt9igbf7] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}
.cal-chip[b-2ypt9igbf7] {
    padding: 7px 14px;
    border-radius: 999px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.14);
    color: rgba(231,236,255,0.85);
    font-size: 11px;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: all 0.25s ease;
}
.cal-chip:hover[b-2ypt9igbf7] {
    background: rgba(0,157,201,0.18);
    border-color: rgba(0,157,201,0.5);
    color: #fff;
    transform: translateY(-1px);
}
.cal-chip.active[b-2ypt9igbf7] {
    background: linear-gradient(135deg, #009DC9, #000061);
    border-color: #009DC9;
    color: #fff;
    box-shadow: 0 6px 18px rgba(0,157,201,0.35);
}
.cal-chip:disabled[b-2ypt9igbf7] {
    opacity: 0.3;
    cursor: not-allowed;
    transform: none;
}

.cal-month-bar[b-2ypt9igbf7] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    margin-bottom: 12px;
}
.cal-mbtn[b-2ypt9igbf7] {
    background: none;
    border: none;
    color: #009DC9;
    cursor: pointer;
    font-size: 14px;
    padding: 6px 10px;
    border-radius: 6px;
    transition: background 0.25s;
}
.cal-mbtn:hover[b-2ypt9igbf7] { background: rgba(0,157,201,0.15); }
.cal-month-name[b-2ypt9igbf7] {
    text-align: center;
    color: #fff;
    font-size: 14px;
    letter-spacing: 0.12em;
    font-weight: 500;
}

.cal-grid[b-2ypt9igbf7] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.cal-dow[b-2ypt9igbf7] {
    text-align: center;
    color: rgba(231,236,255,0.4);
    font-size: 9px;
    letter-spacing: 0.18em;
    padding: 6px 0;
    text-transform: uppercase;
}
.cal-cell[b-2ypt9igbf7] {
    aspect-ratio: 1 / 1;
    background: rgba(255,255,255,0.03);
    border: 1px solid transparent;
    border-radius: 8px;
    color: rgba(231,236,255,0.85);
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.cal-cell.empty[b-2ypt9igbf7] {
    background: transparent;
    cursor: default;
    pointer-events: none;
}
.cal-cell:not(.empty):hover[b-2ypt9igbf7] {
    background: rgba(0,157,201,0.18);
    border-color: rgba(0,157,201,0.5);
    transform: scale(1.05);
}
.cal-cell.weekend[b-2ypt9igbf7] {
    color: rgba(231,236,255,0.25);
    background: rgba(255,255,255,0.015);
}
.cal-cell.today[b-2ypt9igbf7]::after {
    content: '';
    position: absolute;
    bottom: 4px; left: 50%;
    transform: translateX(-50%);
    width: 4px; height: 4px;
    background: #F7A506;
    border-radius: 50%;
}
.cal-cell.selected[b-2ypt9igbf7] {
    background: linear-gradient(135deg, #009DC9, #003B89);
    border-color: #009DC9;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 6px 18px rgba(0,157,201,0.4);
}
.cal-cell.disabled[b-2ypt9igbf7] {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}

@media (max-width: 540px) {
    .cal-hero-day[b-2ypt9igbf7] { font-size: 64px; }
    .cal-hero-month[b-2ypt9igbf7] { font-size: 18px; }
    .cal-hero[b-2ypt9igbf7] { padding: 22px; }
}
/* /Components/Pages/Futures/Splash/_Shared/SplashShell.razor.rz.scp.css */
/* ================================================================
   SplashShell - dark glass theme
   - Scoped styles using ::deep so the look reaches inside child
     components on every Splash page.
   ================================================================ */

.splash-root[b-m3op71ghxp] {
    --ssy-navy:        #000061;
    --ssy-cyan:        #009DC9;
    --ssy-amber:       #F7A506;
    --splash-bg-0:     #050614;
    --splash-bg-1:     #0a0e29;
    --splash-bg-2:     #11163d;
    --splash-glass:    rgba(255, 255, 255, 0.04);
    --splash-glass-2:  rgba(255, 255, 255, 0.07);
    --splash-stroke:   rgba(255, 255, 255, 0.10);
    --splash-stroke-2: rgba(255, 255, 255, 0.18);
    --splash-text:     #e7ecff;
    --splash-text-dim: rgba(231, 236, 255, 0.65);
    --splash-text-faint: rgba(231, 236, 255, 0.4);
    --splash-up:       #4ddca5;
    --splash-down:     #ff6b8a;
    --splash-flat:     #b9c2de;

    position: relative;
    min-height: 100vh;
    width: 100%;
    color: var(--splash-text);
    background: linear-gradient(180deg,
        var(--splash-bg-0) 0%,
        var(--splash-bg-1) 35%,
        var(--splash-bg-2) 100%);
    font-family: 'Soehne', 'Inter', 'Segoe UI', system-ui, sans-serif;
    overflow-x: hidden;
}

/* ---------- background blobs / drifting glow ---------- */
[b-m3op71ghxp] .splash-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
}
[b-m3op71ghxp] .splash-bg-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.55;
    mix-blend-mode: screen;
    animation: splashDrift-b-m3op71ghxp 28s ease-in-out infinite;
}
[b-m3op71ghxp] .splash-bg-blob-a {
    width: 620px; height: 620px;
    left: -10%; top: -15%;
    background: radial-gradient(circle, #009DC9 0%, transparent 70%);
}
[b-m3op71ghxp] .splash-bg-blob-b {
    width: 720px; height: 720px;
    right: -15%; top: 10%;
    background: radial-gradient(circle, #000061 0%, transparent 70%);
    animation-delay: -9s;
}
[b-m3op71ghxp] .splash-bg-blob-c {
    width: 540px; height: 540px;
    left: 30%; bottom: -20%;
    background: radial-gradient(circle, #F7A506 0%, transparent 75%);
    opacity: 0.32;
    animation-delay: -18s;
}
@keyframes splashDrift-b-m3op71ghxp {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33%      { transform: translate(40px, -30px) scale(1.05); }
    66%      { transform: translate(-30px, 40px) scale(0.95); }
}
[b-m3op71ghxp] .splash-bg-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
    background-size: 80px 80px;
    mask-image: radial-gradient(circle at 50% 30%, rgba(0,0,0,0.8), transparent 75%);
    -webkit-mask-image: radial-gradient(circle at 50% 30%, rgba(0,0,0,0.8), transparent 75%);
}

/* ---------- top bar ---------- */
[b-m3op71ghxp] .splash-topbar {
    position: sticky;
    top: 0;
    z-index: 50;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    background: rgba(7, 10, 32, 0.55);
    border-bottom: 1px solid var(--splash-stroke);
}
[b-m3op71ghxp] .splash-topbar-inner {
    max-width: 1600px;
    margin: 0 auto;
    padding: 14px 28px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 28px;
    align-items: center;
}

[b-m3op71ghxp] .splash-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    user-select: none;
}
[b-m3op71ghxp] .splash-brand-mark {
    width: 28px;
    height: 28px;
    position: relative;
}
[b-m3op71ghxp] .splash-brand-mark-dot {
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--ssy-cyan);
    box-shadow: 0 0 12px var(--ssy-cyan);
    animation: brandPulse-b-m3op71ghxp 2.4s ease-in-out infinite;
}
[b-m3op71ghxp] .splash-brand-mark-dot:nth-child(1) { left: 0; top: 0; }
[b-m3op71ghxp] .splash-brand-mark-dot:nth-child(2) { right: 0; top: 4px; background: var(--ssy-amber); box-shadow: 0 0 12px var(--ssy-amber); }
[b-m3op71ghxp] .splash-brand-mark-dot:nth-child(3) { left: 6px; bottom: 0; background: #fff; box-shadow: 0 0 10px #fff; }
[b-m3op71ghxp] .splash-brand-mark-dot.delay-1 { animation-delay: -0.8s; }
[b-m3op71ghxp] .splash-brand-mark-dot.delay-2 { animation-delay: -1.6s; }
@keyframes brandPulse-b-m3op71ghxp {
    0%, 100% { transform: scale(1); opacity: 1; }
    50%      { transform: scale(1.35); opacity: 0.7; }
}
[b-m3op71ghxp] .splash-brand-line-1 {
    font-size: 13px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--splash-text);
    font-weight: 600;
}
[b-m3op71ghxp] .splash-brand-line-2 {
    font-size: 11px;
    color: var(--splash-text-dim);
    letter-spacing: 0.1em;
}

[b-m3op71ghxp] .splash-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}
[b-m3op71ghxp] .splash-tab {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 999px;
    color: var(--splash-text-dim);
    text-decoration: none;
    transition: color 0.25s ease, background 0.25s ease, transform 0.25s ease;
    font-size: 13px;
    letter-spacing: 0.04em;
}
[b-m3op71ghxp] .splash-tab:hover {
    color: var(--splash-text);
    background: var(--splash-glass);
    transform: translateY(-1px);
}
[b-m3op71ghxp] .splash-tab.active {
    color: var(--splash-text);
    background: var(--splash-glass-2);
}
[b-m3op71ghxp] .splash-tab-num {
    font-size: 10px;
    color: var(--splash-text-faint);
    letter-spacing: 0.2em;
    font-variant-numeric: tabular-nums;
}
[b-m3op71ghxp] .splash-tab.active .splash-tab-num { color: var(--ssy-cyan); }
[b-m3op71ghxp] .splash-tab-label { font-weight: 500; }
[b-m3op71ghxp] .splash-tab-underline {
    position: absolute;
    left: 16px; right: 16px;
    bottom: 4px;
    height: 2px;
    background: linear-gradient(90deg, var(--ssy-cyan), var(--ssy-amber));
    border-radius: 2px;
    animation: underlineSlide-b-m3op71ghxp 0.5s ease both;
}
@keyframes underlineSlide-b-m3op71ghxp {
    from { transform: scaleX(0.2); opacity: 0; }
    to   { transform: scaleX(1);   opacity: 1; }
}

[b-m3op71ghxp] .splash-date-pill {
    display: grid;
    grid-template-columns: auto auto auto auto;
    gap: 8px;
    align-items: center;
    padding: 8px 16px;
    border: 1px solid var(--splash-stroke-2);
    border-radius: 999px;
    background: var(--splash-glass);
    cursor: pointer;
    transition: all 0.25s ease;
    font-variant-numeric: tabular-nums;
}
[b-m3op71ghxp] .splash-date-pill:hover {
    border-color: var(--ssy-cyan);
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(0,157,201,0.18);
}
[b-m3op71ghxp] .splash-date-pill-dow {
    font-size: 10px;
    color: var(--splash-text-faint);
    text-transform: uppercase;
    letter-spacing: 0.2em;
}
[b-m3op71ghxp] .splash-date-pill-dm {
    font-size: 14px;
    font-weight: 600;
    color: var(--splash-text);
}
[b-m3op71ghxp] .splash-date-pill-y {
    font-size: 11px;
    color: var(--splash-text-dim);
}
[b-m3op71ghxp] .splash-date-pill-icon {
    color: var(--ssy-cyan);
    display: flex;
    align-items: center;
}

[b-m3op71ghxp] .splash-crumbs {
    max-width: 1600px;
    margin: 0 auto;
    padding: 8px 28px 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--splash-text-dim);
}
[b-m3op71ghxp] .splash-crumb {
    color: var(--splash-text-dim);
    text-decoration: none;
    transition: color 0.2s;
    letter-spacing: 0.05em;
}
[b-m3op71ghxp] .splash-crumb:hover { color: var(--ssy-cyan); }
[b-m3op71ghxp] .splash-crumb.current {
    color: var(--splash-text);
    font-weight: 500;
}
[b-m3op71ghxp] .splash-crumb-sep { color: var(--splash-text-faint); }

/* ---------- main content area ---------- */
[b-m3op71ghxp] .splash-main {
    position: relative;
    z-index: 1;
    max-width: 1600px;
    margin: 0 auto;
    padding: 32px 28px 80px;
}

/* ---------- footer ---------- */
[b-m3op71ghxp] .splash-footer {
    position: relative;
    z-index: 1;
    border-top: 1px solid var(--splash-stroke);
    padding: 28px 28px 36px;
    color: var(--splash-text-faint);
    font-size: 11px;
    letter-spacing: 0.08em;
    text-align: center;
}
[b-m3op71ghxp] .splash-footer-thin {
    color: var(--splash-text-faint);
    margin-top: 4px;
    font-style: italic;
}

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
    [b-m3op71ghxp] .splash-topbar-inner {
        grid-template-columns: 1fr;
        gap: 12px;
        text-align: center;
    }
    [b-m3op71ghxp] .splash-tabs { flex-wrap: wrap; }
    [b-m3op71ghxp] .splash-brand { justify-content: center; }
    [b-m3op71ghxp] .splash-date-pill { justify-self: center; }
}

/* ===============================================================
   Re-usable building blocks - styles "leak" via ::deep so any
   page that uses .splash-card, .splash-pill, etc. picks them up
   without re-defining.
   =============================================================== */

[b-m3op71ghxp] .splash-card {
    position: relative;
    background: var(--splash-glass);
    border: 1px solid var(--splash-stroke);
    border-radius: 18px;
    padding: 22px;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: transform 0.4s cubic-bezier(.2,.8,.2,1), border-color 0.3s, box-shadow 0.3s;
    overflow: hidden;
}
[b-m3op71ghxp] .splash-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent);
    opacity: 0.5;
}
[b-m3op71ghxp] .splash-card:hover {
    transform: translateY(-4px);
    border-color: var(--splash-stroke-2);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
}

[b-m3op71ghxp] .splash-card-glow:hover {
    border-color: rgba(0,157,201,0.5);
    box-shadow: 0 18px 60px rgba(0,157,201,0.2);
}

[b-m3op71ghxp] .splash-h1 {
    font-size: 36px;
    font-weight: 300;
    letter-spacing: -0.02em;
    color: #fff;
    margin: 0 0 8px;
    line-height: 1.1;
}
[b-m3op71ghxp] .splash-h1 b { font-weight: 600; color: var(--ssy-cyan); }

[b-m3op71ghxp] .splash-h2 {
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 0.01em;
    color: var(--splash-text);
    margin: 0 0 4px;
}

[b-m3op71ghxp] .splash-h3 {
    font-size: 11px;
    color: var(--splash-text-faint);
    letter-spacing: 0.25em;
    text-transform: uppercase;
    margin: 0 0 12px;
    font-weight: 500;
}

[b-m3op71ghxp] .splash-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 5px 12px;
    border: 1px solid var(--splash-stroke-2);
    border-radius: 999px;
    font-size: 10px;
    color: var(--splash-text-dim);
    letter-spacing: 0.2em;
    text-transform: uppercase;
    background: var(--splash-glass);
}
[b-m3op71ghxp] .splash-eyebrow .pulse {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--splash-up);
    box-shadow: 0 0 8px var(--splash-up);
    animation: eyebrowPulse-b-m3op71ghxp 1.6s ease-in-out infinite;
}
@keyframes eyebrowPulse-b-m3op71ghxp {
    0%, 100% { opacity: 1; transform: scale(1); }
    50%      { opacity: 0.4; transform: scale(1.4); }
}

/* arrows / dod indicators */
[b-m3op71ghxp] .splash-dod {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}
[b-m3op71ghxp] .splash-dod.up   { color: var(--splash-up); }
[b-m3op71ghxp] .splash-dod.down { color: var(--splash-down); }
[b-m3op71ghxp] .splash-dod.flat { color: var(--splash-flat); }
[b-m3op71ghxp] .splash-dod-arrow { font-size: 10px; }

/* generic reveal-on-mount */
[b-m3op71ghxp] .splash-reveal {
    opacity: 0;
    transform: translateY(16px);
    animation: splashReveal-b-m3op71ghxp 0.7s cubic-bezier(.2,.8,.2,1) forwards;
}
[b-m3op71ghxp] .splash-reveal.delay-1 { animation-delay: 0.05s; }
[b-m3op71ghxp] .splash-reveal.delay-2 { animation-delay: 0.1s; }
[b-m3op71ghxp] .splash-reveal.delay-3 { animation-delay: 0.15s; }
[b-m3op71ghxp] .splash-reveal.delay-4 { animation-delay: 0.2s; }
[b-m3op71ghxp] .splash-reveal.delay-5 { animation-delay: 0.25s; }
[b-m3op71ghxp] .splash-reveal.delay-6 { animation-delay: 0.3s; }
@keyframes splashReveal-b-m3op71ghxp {
    to { opacity: 1; transform: translateY(0); }
}

/* loader skeleton bar */
[b-m3op71ghxp] .splash-skeleton {
    display: inline-block;
    background: linear-gradient(90deg,
        rgba(255,255,255,0.05) 0%,
        rgba(255,255,255,0.13) 50%,
        rgba(255,255,255,0.05) 100%);
    background-size: 200% 100%;
    animation: splashShimmer-b-m3op71ghxp 1.6s linear infinite;
    border-radius: 4px;
    color: transparent !important;
}
@keyframes splashShimmer-b-m3op71ghxp {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* section heading helper */
[b-m3op71ghxp] .splash-section {
    margin-top: 48px;
}
[b-m3op71ghxp] .splash-section:first-child { margin-top: 0; }
/* /Components/Pages/Futures/TradeTracker/TradeTrackerOrderBook/TradeTrackerOrderBook.razor.rz.scp.css */
/* Order-book spin-off — page-scoped styles.
   ============================================
   Every selector descends from .tradetrackerorderbook-pagelayout so nothing
   leaks into the combined view or the trades-only spin-off. Brand colours come
   from the global ssy-* palette where possible; only the bits unique to this
   layout live here. */

.tradetrackerorderbook-pagelayout[b-bvow0u3cfs] {
    background-color: #0D0D1A;
    color: #e0e0e0;
    font-family: Verdana, sans-serif;
    padding: 8px 8px 16px;
}

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-header[b-bvow0u3cfs] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        flex-wrap: wrap;
        margin-bottom: 6px;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-title[b-bvow0u3cfs] {
        color: #6ab0e0;
        font-size: 1.4rem;
        font-weight: bold;
        margin: 0;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-actions[b-bvow0u3cfs] {
        display: flex;
        gap: 8px;
        align-items: center;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-viewbtn[b-bvow0u3cfs] {
        font-size: 0.8rem;
        padding: 3px 10px;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-datebar[b-bvow0u3cfs] {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 4px 0;
        margin-bottom: 8px;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-datenav[b-bvow0u3cfs] {
        color: #6ab0e0;
        font-size: 1.2rem;
        cursor: pointer;
        padding: 0 4px;
        user-select: none;
    }

        .tradetrackerorderbook-pagelayout .tradetrackerorderbook-datenav:hover[b-bvow0u3cfs] {
            color: #ffffff;
        }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-datetext[b-bvow0u3cfs] {
        color: #e0e0e0;
        font-size: 1rem;
        font-weight: bold;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-orderbookpanel[b-bvow0u3cfs] {
        min-height: 5rem;
        padding: 10px 8px;
        background-color: #1a1a2e;
        border: 1px solid #8888aa;
        border-radius: 10px;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-tabrow[b-bvow0u3cfs] {
        display: grid;
        gap: 0;
        row-gap: 4px;
        grid-template-columns: repeat(6, 10rem);
        margin-bottom: 6px;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-bookrow[b-bvow0u3cfs] {
        display: flex;
        gap: 10px;
        overflow: visible;
        font-size: 0.9rem;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-nodata[b-bvow0u3cfs] {
        color: #8888aa;
        font-size: 0.85rem;
        padding: 10px 4px;
    }

/* Mobile — stack the tab row into a wrapping flex strip and let the
   order-book tables wrap vertically. */
@media screen and (max-width: 700px) {
    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-tabrow[b-bvow0u3cfs] {
        display: flex;
        flex-wrap: wrap;
        grid-template-columns: none;
        gap: 4px;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-bookrow[b-bvow0u3cfs] {
        flex-direction: column;
    }

    .tradetrackerorderbook-pagelayout .tradetrackerorderbook-actions[b-bvow0u3cfs] {
        width: 100%;
    }
}
/* /Components/Pages/Futures/TradeTracker/TradeTrackerTrades/TradeTrackerTrades.razor.rz.scp.css */
/* Trade-list spin-off — page-scoped styles.
   ============================================
   Every selector descends from .tradetrackertrades-pagelayout so nothing
   leaks into the combined view or the order-book spin-off. Brand colours
   come from the global ssy-* palette where possible; only the bits unique
   to this layout live here. */

.tradetrackertrades-pagelayout[b-n8lzrubxbx] {
    background-color: #0D0D1A;
    color: #e0e0e0;
    font-family: Verdana, sans-serif;
    padding: 8px 8px 16px;
}

    .tradetrackertrades-pagelayout .tradetrackertrades-header[b-n8lzrubxbx] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        flex-wrap: wrap;
        margin-bottom: 6px;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-title[b-n8lzrubxbx] {
        color: #6ab0e0;
        font-size: 1.4rem;
        font-weight: bold;
        margin: 0;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-actions[b-n8lzrubxbx] {
        display: flex;
        gap: 8px;
        align-items: center;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-viewbtn[b-n8lzrubxbx] {
        font-size: 0.8rem;
        padding: 3px 10px;
    }

    /* Totals strip — single-row coloured chips, identical look to the
       combined view but scoped under the spin-off wrapper. */
    .tradetrackertrades-pagelayout .tradetrackertrades-totalsstrip[b-n8lzrubxbx] {
        display: flex;
        margin-top: 4px;
        font-size: 0.8rem;
        overflow: hidden;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-totalslabel[b-n8lzrubxbx] {
        background-color: #0D0D1A;
        color: #8888aa;
        padding: 2px 8px;
        display: flex;
        align-items: center;
        min-width: 4rem;
        border-right: 1px solid #2a2a45;
        font-size: 0.75rem;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-totalscol[b-n8lzrubxbx] {
        display: flex;
        flex-direction: column;
        border-right: 1px solid #2a2a45;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-totalscolname[b-n8lzrubxbx] {
        background-color: #1d263b;
        color: #6ab0e0;
        text-align: right;
        padding: 2px 8px 0 8px;
        font-size: 0.75rem;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-totalscolval[b-n8lzrubxbx] {
        background-color: #1a1a2e;
        color: white;
        text-align: right;
        padding: 0 8px 2px 8px;
        font-weight: bold;
    }

    /* Date + filter row. */
    .tradetrackertrades-pagelayout .tradetrackertrades-datebar[b-n8lzrubxbx] {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 4px 0;
        margin-top: 8px;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-datenav[b-n8lzrubxbx] {
        color: #6ab0e0;
        font-size: 1.2rem;
        cursor: pointer;
        padding: 0 4px;
        user-select: none;
    }

        .tradetrackertrades-pagelayout .tradetrackertrades-datenav:hover[b-n8lzrubxbx] {
            color: #ffffff;
        }

    .tradetrackertrades-pagelayout .tradetrackertrades-datetext[b-n8lzrubxbx] {
        color: #e0e0e0;
        font-size: 1rem;
        font-weight: bold;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-filterinput[b-n8lzrubxbx] {
        background-color: #1d263b;
        border: 1px solid #3a3a5c;
        border-radius: 3px;
        color: #e0e0e0;
        font-size: 0.85rem;
        padding: 3px 6px;
        flex: 1 1 auto;
        max-width: 30rem;
    }

        .tradetrackertrades-pagelayout .tradetrackertrades-filterinput[b-n8lzrubxbx]::placeholder {
            color: #555577;
        }

        .tradetrackertrades-pagelayout .tradetrackertrades-filterinput:focus[b-n8lzrubxbx] {
            outline: none;
            border-color: #6ab0e0;
        }

    .tradetrackertrades-pagelayout .tradetrackertrades-hint[b-n8lzrubxbx] {
        color: #8888aa;
        font-size: 0.75rem;
        margin: 2px 0 6px;
    }

    /* Trade table & summary use the global .tt-table / .tt-tradetable-row /
       .tt-expand-row styles from the combined page's inline <style>, so we
       only add the spin-off wrapper here. table-layout:fixed on a thin
       window keeps the columns scaling with the wrapper rather than
       expanding to their content. */
    .tradetrackertrades-pagelayout .tradetrackertrades-table[b-n8lzrubxbx] {
        width: 100%;
        max-width: 60rem;
        min-width: 0;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-summarywrap[b-n8lzrubxbx] {
        margin-top: 12px;
        background-color: #14142d;
        width: fit-content;
    }

/* Mobile — collapse the date bar and let the totals strip wrap so the page
   works docked in a narrow window or on a phone. */
@media screen and (max-width: 700px) {
    .tradetrackertrades-pagelayout .tradetrackertrades-totalsstrip[b-n8lzrubxbx] {
        flex-wrap: wrap;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-datebar[b-n8lzrubxbx] {
        flex-wrap: wrap;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-filterinput[b-n8lzrubxbx] {
        max-width: 100%;
    }

    .tradetrackertrades-pagelayout .tradetrackertrades-actions[b-n8lzrubxbx] {
        width: 100%;
    }
}
/* /Components/Pages/Futures/TradeTracker/TradeTracker_010_main.razor.rz.scp.css */


/* ── In-row panel layout ───────────────────────────────────────────────
   Each row of order-book panels is a horizontal flex strip; rows stack.
   The trade-list / trade-summary panels sit inside a row but should only
   take the height of the order-book panels beside them and scroll their
   own content. align-self:stretch gives the wrapper the row's height; the
   child component is absolutely filled inside it and scrolls vertically. */
.tt-panelrow[b-sevv83xiiy] {
    margin-bottom: 10px;
}

/* Porthole button — a round "window" that jumps between the 010 and 020 pages.
   Deliberately reads as a portal/porthole (metal rim + glowing glass), not a link. */
.tt-porthole[b-sevv83xiiy] {
    flex-shrink: 0;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    border: 3px solid #6ab0e0;
    background: radial-gradient(circle at 32% 28%, #34618c 0%, #16263d 55%, #0a1422 100%);
    color: #d6ecff;
    font-family: Verdana, sans-serif;
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 0 7px rgba(0, 226, 253, 0.45), inset 0 2px 4px rgba(255, 255, 255, 0.25), inset 0 -3px 6px rgba(0, 0, 0, 0.7);
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

    .tt-porthole:hover[b-sevv83xiiy] {
        color: #ffffff;
        transform: scale(1.06);
        box-shadow: 0 0 14px rgba(0, 226, 253, 0.9), inset 0 2px 4px rgba(255, 255, 255, 0.3), inset 0 -3px 6px rgba(0, 0, 0, 0.7);
    }

    .tt-porthole:active[b-sevv83xiiy] {
        transform: scale(0.97);
    }

.tt-inline-panel[b-sevv83xiiy] {
    position: relative;
    align-self: stretch;
    /* A definite floor so a row made up ENTIRELY of inline panels (e.g. closed/open/cancelled)
       doesn't collapse to a single line — there is no order-book sibling to stretch against.
       When there IS a taller sibling, align-self:stretch still grows the panel to match it. */
    min-height: 22rem;
    width: 34rem;
    border: 1px solid #8888aa;
    border-radius: 6px;
    overflow: hidden;
    background: #14142d;
}

    /* Per-type widths. Order lists are wide tables (~45.5em) so they get more room to avoid a
       horizontal scrollbar; the trade summary is widened by ~1 scrollbar width for the same reason. */
    .tt-inline-panel.tt-inline-panel--list[b-sevv83xiiy] { width: 48.5rem; }
    .tt-inline-panel.tt-inline-panel--summary[b-sevv83xiiy] { width: 31rem; }

    /* Fixed title bar so you can tell open / closed / cancelled etc. apart. */
    .tt-inline-panel .tt-inline-title[b-sevv83xiiy] {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 1.5rem;
        line-height: 1.5rem;
        padding: 0 8px;
        font-family: Verdana, sans-serif;
        font-size: 0.8rem;
        font-weight: 700;
        color: #fff;
        background: #1a1a2e;
        border-bottom: 1px solid #8888aa;
        z-index: 1;
    }

    /* Scrolls vertically only; horizontal is hidden so the 3 order lists never show a
       horizontal scrollbar (the panel is sized wide enough to fit instead). */
    .tt-inline-panel .tt-inline-scroll[b-sevv83xiiy] {
        position: absolute;
        top: 1.5rem;
        left: 0;
        right: 0;
        bottom: 0;
        overflow-y: auto;
        overflow-x: hidden;
        padding: 4px;
    }

.date-select-simple-arrows[b-sevv83xiiy] {
    font-size: 20px;
    width: 30px;
}

.dateChanger-date[b-sevv83xiiy] {
    font-size: 16px;
    width: 160px;
    display: inline-block;
    text-align: center;
}

.date-select-simple-arrows.disable[b-sevv83xiiy] {
    color: lightgray;
}

    .date-select-simple-arrows.disable:hover[b-sevv83xiiy] {
        color: lightgray;
        cursor: default;
        font-weight: normal;
    }

.arrow[b-sevv83xiiy] {
    height: 20px;
}

    .arrow.switch-arrow[b-sevv83xiiy] {
        transform: rotate(180deg);
    }

.tooltip-box[b-sevv83xiiy] {
    position: fixed;
    padding: 10px;
    background-color: #2a2a45;
    border: 1px solid #3a3a5c;
    border-radius: 5px;
    color: #e0e0e0;
}


.filtertextbox[b-sevv83xiiy] {
    width: 300px;
    padding-right: 4px;
    margin-left: 5%;
    margin-top: 0%;
}


.ssythemefilter[b-sevv83xiiy] {
    background-color: #1d263b;
    border-color: #3a3a5c;
    color: #e0e0e0;
}


.tt-tradetable-row[b-sevv83xiiy] {
    cursor: pointer;
    height: 1.5rem;
}

.tt-tradetable-div[b-sevv83xiiy] {
    flex-basis: content;
    flex-shrink: 1;
    width: 100%;
    /* Stop the left panel from taking the whole viewport on wide screens —
       50rem is wide enough to fit the trade table comfortably while leaving
       room for the order-book / summary on the right. The split-divider div
       lives directly after this element so the right panel still fills the
       rest of the row. */
    max-width: 50rem;
    /* Default flex items have min-width:auto which equals the intrinsic
       content width — for a wide table that means the wrapper refuses to
       shrink. min-width:0 lets the wrapper honour its max-width / parent
       constraints, and overflow-x:auto adds a scrollbar inside the wrapper
       when the table's own column min-widths still exceed the wrapper. The
       table bleeding under the right-hand panel was the symptom of both
       missing. */
    min-width: 0;
    overflow-x: auto;
}

/* ── Split divider between the trade list (left) and the order-book / summary
   (right). Width matches the previous flex gap of 10px so the layout doesn't
   shift when the user toggles the panel. */
.tt-split-divider[b-sevv83xiiy] {
    width: 10px;
    flex-shrink: 0;
    border-left: 1px solid #2a2a45;
    border-right: 1px solid #2a2a45;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    cursor: pointer;
    color: white;
    transition: background-color 120ms ease, width 120ms ease;
}

    .tt-split-divider:hover[b-sevv83xiiy] {
        background-color: #1d263b;
    }


/* When the left panel is hidden, give the divider a touch more presence so
   it remains easy to find. The chevron flips direction via the data-state attr. */
.tt-split-divider[data-state="collapsed"][b-sevv83xiiy] {
    width: 14px;
    background-color: #1d263b;
}

/* Split-screen button — sits inline with the Premium / Clearer controls. */
.tt-split-screen-btn[b-sevv83xiiy] {
    background-color: #1d263b;
    border: 1px solid #3a3a5c;
    border-radius: 3px;
    color: #6ab0e0;
    font-family: Verdana, sans-serif;
    font-size: 0.8rem;
    padding: 2px 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

    .tt-split-screen-btn:hover[b-sevv83xiiy] {
        background-color: #2a2a45;
        color: #ffffff;
    }

/* Let the table follow its wrapper rather than sit at a fixed 650px.
   The colgroup min-widths in the markup still keep columns readable; the
   wrapper's overflow-x picks up the slack when the wrapper goes really
   narrow (e.g. the user dragging the split divider in tight). */
.tt-tradetable[b-sevv83xiiy] {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* Per-column filter row below the headers — slightly indented inputs so they
   read as a sub-row of the table header. */
.tt-filter-row[b-sevv83xiiy] {
    background-color: #1a1a2e;
}

    .tt-filter-row th[b-sevv83xiiy] {
        padding: 2px 4px;
    }



.tt-page-right-tab[b-sevv83xiiy] {
    overflow: visible;
    width: calc(100vw - 685px);
}

.numcol[b-sevv83xiiy] {
    text-align: right;
}

.centercol[b-sevv83xiiy] {
    text-align: center;
}

.lightUnderscore[b-sevv83xiiy] {
    text-decoration: underline;
    -webkit-text-decoration-color: silver; /* safari still uses vendor prefix */
    text-decoration-color: silver;
}

.stattable-routename[b-sevv83xiiy] {
    border-top: solid 1px #2a2a45;
    border-bottom: solid 1px #2a2a45;
    background-color: #14142d;
    font-weight: bold;
    color: #6ab0e0;
}

.stattable-detail[b-sevv83xiiy] {
    background-color: transparent;
}

    .stattable-detail:hover[b-sevv83xiiy] {
        background-color: #2a2a45;
    }

.tradesummarylogo[b-sevv83xiiy] {
    background-image: url("/assets/lines/SSYShippingLines_01_stretchable.svg");
    background-size: 100% 200%;
    /*background-position-y: -10px;*/
}



.pulsenewtrade[b-sevv83xiiy] {
    animation-name: pulseNewTradeSettings-b-sevv83xiiy;
    animation-duration: 700ms;
    animation-iteration-count: 40;
    animation-timing-function: linear;
    color: #FFE68C;
    /*color: #FFE892;*/
    text-shadow: 0 0 15px #ffb300;
}

@keyframes pulseNewTradeSettings-b-sevv83xiiy {

    0% {
        text-shadow: 0 0 15px #ffb300;
    }

    50% {
        text-shadow: 0 0 2px #ffff00; /*0 0 4px #fff700, 0 0 8px #ffea00, 0 0 14px #ffd000, 0 0 40px #ffb300;*/
    }

    100% {
        text-shadow: 0 0 15px #ffff00;
    }

}

@media screen and (max-width: 1400px) {
    .tt-tradetable[b-sevv83xiiy] {
        width: 100%;
    }

    .tt-page-right-tab[b-sevv83xiiy] {
        width: calc(100vw - 485px);
    }
}


@media screen and (max-width: 600px) {
    .hide-mobile[b-sevv83xiiy] {
        display: none;
    }

    .flex-mobile-wrap[b-sevv83xiiy] {
        flex-wrap: wrap;
    }

    .tt-tradetable[b-sevv83xiiy] {
        width: 100%;
    }

    .tt-tradetable-div[b-sevv83xiiy] {
        flex-basis: unset;
        flex-shrink: 1;
        width: 100%;
        /* Reset the desktop cap on mobile — the panels stack so the trade
           table should be free to use the full viewport width. */
        max-width: none;
    }

    /* The vertical divider doesn't make sense on a stacked mobile layout,
       so hide it. The split-screen button still works (and is the better
       affordance on a phone anyway). */
    .tt-split-divider[b-sevv83xiiy] {
        display: none;
    }

    .date-select-simple .date-arrows[b-sevv83xiiy] {
        padding: 0 8px 0 8px;
    }

    .tt-page-right-tab[b-sevv83xiiy] {
        width: 100%;
    }
}
[b-sevv83xiiy]
/* /Components/Pages/Futures/TradeTracker/TradeTracker_100_OrderBook.razor.rz.scp.css */
/* /Components/Pages/Futures/TradeTracker/TradeTracker_200_TradeEditPopup.razor.rz.scp.css */
/* ── TradeTracker_200_TradeEditPopup scoped styles ──────── */

.tt-tradeedit-form[b-5wdpdtdsuh] {
    font-family: Verdana, sans-serif;
    font-size: 0.88rem;
    color: #e0e0e0;
    padding: 4px 0;
}

.tt-tradeedit-subheader[b-5wdpdtdsuh] {
    color: #8888aa;
    font-size: 0.78rem;
    margin: 0 0 12px 0;
}

/* Label + input side-by-side row */
.tt-tradeedit-row[b-5wdpdtdsuh] {
    display: grid;
    grid-template-columns: 8rem 1fr;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.tt-tradeedit-label[b-5wdpdtdsuh] {
    color: #8888aa;
    font-size: 0.82rem;
    text-align: right;
    white-space: nowrap;
}

/* Make all controlled inputs fill their grid cell */
.tt-tradeedit-field[b-5wdpdtdsuh] {
    width: 100%;
    box-sizing: border-box;
}

/* Validation error */
.tt-tradeedit-error[b-5wdpdtdsuh] {
    color: #ff6666;
    font-size: 0.8rem;
    margin: 4px 0 8px 8.5rem; /* align under the input column */
}

/* Delete confirmation strip */
.tt-tradeedit-deleteconfirm[b-5wdpdtdsuh] {
    background-color: #2a1010;
    border: 1px solid #c0392b;
    border-radius: 4px;
    padding: 10px 12px;
    margin: 8px 0;
    font-size: 0.85rem;
    color: #ff9999;
}

/* Button row */
.tt-tradeedit-buttons[b-5wdpdtdsuh] {
    display: flex;
    gap: 8px;
    margin-top: 16px;
    flex-wrap: wrap;
}

/* Delete trigger button — danger-coloured outline */
.tt-tradeedit-deletetrigger[b-5wdpdtdsuh] {
    color: #ff8888 !important;
    border-color: #c0392b !important;
}

.tt-tradeedit-deletetrigger:hover[b-5wdpdtdsuh] {
    background-color: #3a1010 !important;
}

/* Delete confirm action button */
.tt-tradeedit-deletebtn[b-5wdpdtdsuh] {
    background-color: #c0392b !important;
    border-color: #c0392b !important;
    color: #fff !important;
}

.tt-tradeedit-deletebtn:hover[b-5wdpdtdsuh] {
    background-color: #a93226 !important;
}
/* /Components/Pages/Futures/TradeTracker/TradeTracker_210_ImpliedExecutePopup.razor.rz.scp.css */
.tradetracker-impliedexec[b-75x0yvyku8] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    font-size: 0.9rem;
}

/* ── Derivation strip: SPREAD + OUTRIGHT ⇒ IMPLIED ───────────────────────── */
.tradetracker-impliedexec .impliedexec-derivation[b-75x0yvyku8] {
    display: flex;
    align-items: stretch;
    gap: 8px;
}

.tradetracker-impliedexec .impliedexec-card[b-75x0yvyku8] {
    flex: 1;
    border: 1px solid #c8c8d4;
    border-radius: 6px;
    /* No top padding — the tag below acts as a _150-style header strip that bleeds to the edges. */
    padding: 0 0 8px 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #fff;
    overflow: hidden;
}

/* The two source orders are interactive — make that obvious. */
.tradetracker-impliedexec .impliedexec-card-source[b-75x0yvyku8] {
    cursor: pointer;
}

.tradetracker-impliedexec .impliedexec-card-source:hover[b-75x0yvyku8] {
    border-color: #009DC9;
    box-shadow: 0 0 0 2px #009DC933;
}

/* The derived result, accented in the implied colour. */
.tradetracker-impliedexec .impliedexec-card-implied[b-75x0yvyku8] {
    border-color: #009DC9;
    border-width: 2px;
    background: #009DC90D;
}

.tradetracker-impliedexec .impliedexec-card-client[b-75x0yvyku8] {
    font-weight: 700;
    font-size: 1rem;
}

.tradetracker-impliedexec .impliedexec-card-contract[b-75x0yvyku8] {
    color: #444;
}

.tradetracker-impliedexec .impliedexec-card-price[b-75x0yvyku8] {
    font-size: 1.15rem;
    font-weight: 700;
    margin-top: 2px;
}

.tradetracker-impliedexec .impliedexec-card-price span[b-75x0yvyku8] {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    margin-right: 6px;
    vertical-align: middle;
}

.tradetracker-impliedexec .impliedexec-bid[b-75x0yvyku8] {
    background: #1f7a33;
    color: #fff;
}

.tradetracker-impliedexec .impliedexec-offer[b-75x0yvyku8] {
    background: #b03030;
    color: #fff;
}

.tradetracker-impliedexec .impliedexec-card-edit[b-75x0yvyku8] {
    margin-top: 4px;
    font-size: 0.72rem;
    color: #009DC9;
}

/* The + and ⇒ operators between cards. */
.tradetracker-impliedexec .impliedexec-op[b-75x0yvyku8] {
    display: flex;
    align-items: center;
    font-size: 1.4rem;
    color: #6a6a82;
    padding: 0 2px;
}

/* ── Per-leg completion (each leg is an order-book entry via an embedded _150) ──
   No outer border / vertical padding: the _151 form already has its own framed look,
   so the wrapper just reserves horizontal room and a tight gap between legs. Dropping
   the grey border and the top/bottom padding reclaims the vertical space the popup
   needed (it was a touch too tall for the screen). */
.tradetracker-impliedexec .impliedexec-completelegs[b-75x0yvyku8] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tradetracker-impliedexec .impliedexec-completeleg[b-75x0yvyku8] {
    padding: 0 10px;
    border-radius: 6px;
}

/* Blue glow on the leg whose derivation card was clicked — shows the cursor has jumped here. */
    .tradetracker-impliedexec .impliedexec-completeleg.impliedexec-leg-focus[b-75x0yvyku8] {
        box-shadow: 0 0 0 3px #00E2FD, 0 0 8px 2px #00E2FD99;
        background-color: #00E2FD;
    }

.tradetracker-impliedexec .impliedexec-leg-title[b-75x0yvyku8] {
    font-weight: 700;
    margin-bottom: 6px;
}

.tradetracker-impliedexec .impliedexec-done[b-75x0yvyku8] {
    margin-left: 8px;
    color: #1f7a33;
    font-weight: 700;
}

.tradetracker-impliedexec .impliedexec-error[b-75x0yvyku8] {
    color: #c0392b;
    font-weight: 600;
}
/* /Components/Pages/Futures/TradeTracker/TradeTracker_220_ImpliedSpreadExecutePopup.razor.rz.scp.css */
/* Scoped styles for the implied-SPREAD execution popup. Mirrors TradeTracker_210's look — Blazor
   scoped CSS can't be shared between two components, so the visual language is duplicated here so
   both execution popups read identically. */

.tradetracker-impliedexec[b-k80pr57335] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    font-size: 0.9rem;
}

/* ── Derivation strip: OUTRIGHT − OUTRIGHT ⇒ SPREAD ──────────────────────── */
.tradetracker-impliedexec .impliedexec-derivation[b-k80pr57335] {
    display: flex;
    align-items: stretch;
    gap: 8px;
}

.tradetracker-impliedexec .impliedexec-card[b-k80pr57335] {
    flex: 1;
    border: 1px solid #c8c8d4;
    border-radius: 6px;
    /* No top padding — the tag below acts as a _150-style header strip that bleeds to the edges. */
    padding: 0 0 8px 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #fff;
    overflow: hidden;
}

.tradetracker-impliedexec .impliedexec-card-source[b-k80pr57335] {
    cursor: default;
}

/* The derived result, accented in the implied colour. */
.tradetracker-impliedexec .impliedexec-card-implied[b-k80pr57335] {
    border-color: #009DC9;
    border-width: 2px;
    background: #009DC90D;
}

.tradetracker-impliedexec .impliedexec-card-client[b-k80pr57335] {
    font-weight: 700;
    font-size: 1rem;
}

.tradetracker-impliedexec .impliedexec-card-contract[b-k80pr57335] {
    color: #444;
}

.tradetracker-impliedexec .impliedexec-card-price[b-k80pr57335] {
    font-size: 1.15rem;
    font-weight: 700;
    margin-top: 2px;
}

.tradetracker-impliedexec .impliedexec-card-price span[b-k80pr57335] {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    margin-right: 6px;
    vertical-align: middle;
}

.tradetracker-impliedexec .impliedexec-bid[b-k80pr57335] {
    background: #1f7a33;
    color: #fff;
}

.tradetracker-impliedexec .impliedexec-offer[b-k80pr57335] {
    background: #b03030;
    color: #fff;
}

/* The − and ⇒ operators between cards. */
.tradetracker-impliedexec .impliedexec-op[b-k80pr57335] {
    display: flex;
    align-items: center;
    font-size: 1.4rem;
    color: #6a6a82;
    padding: 0 2px;
}

/* ── Per-leg completion (each leg is an order-book entry via an embedded _151) ── */
.tradetracker-impliedexec .impliedexec-completelegs[b-k80pr57335] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tradetracker-impliedexec .impliedexec-completeleg[b-k80pr57335] {
    padding: 0 10px;
    border-radius: 6px;
}

.tradetracker-impliedexec .impliedexec-leg-title[b-k80pr57335] {
    font-weight: 700;
    margin-bottom: 6px;
}

.tradetracker-impliedexec .impliedexec-done[b-k80pr57335] {
    margin-left: 8px;
    color: #1f7a33;
    font-weight: 700;
}

.tradetracker-impliedexec .impliedexec-error[b-k80pr57335] {
    color: #c0392b;
    font-weight: 600;
}
/* /Components/Pages/Futures/TradeTracker/TradeTracker_915_LayoutEditor.razor.rz.scp.css */
/*  Editor for the order-book tab layout. Everything is scoped under
    .tradetracker-layouteditor so it can't bleed into other pages — see
    CLAUDE.md rule 4. We don't restyle the popup chrome (that belongs to
    _190); we only style elements unique to this editor.                 */

.tradetracker-layouteditor[b-ikddds0z8t] {
    color: #e0e0e0;
    font-size: 0.85rem;
}

    /* One row of panels inside the edited tab. */
    .tradetracker-layouteditor .le-row-block[b-ikddds0z8t] {
        border: 1px solid #2a2a44;
        border-radius: 6px;
        padding: 8px;
        margin-bottom: 10px;
        background: #0f0f1e;
    }

    .tradetracker-layouteditor .le-row-header[b-ikddds0z8t] {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 6px;
    }

    .tradetracker-layouteditor .le-row-label[b-ikddds0z8t] {
        color: #8888aa;
        font-weight: 600;
    }

    .tradetracker-layouteditor .le-addrow-btn[b-ikddds0z8t] {
        margin-top: 4px;
    }

    .tradetracker-layouteditor .le-intro[b-ikddds0z8t] {
        color: #bbb;
        font-size: 0.75rem;
        margin: 0 0 12px;
    }

    .tradetracker-layouteditor .le-section-label[b-ikddds0z8t] {
        color: #8888aa;
        font-size: 0.7rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        margin: 12px 0 6px;
    }

    /* ── Tab strip ──────────────────────────────────────────────────── */
    .tradetracker-layouteditor .le-tabstrip[b-ikddds0z8t] {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
        align-items: center;
        padding: 8px;
        background: #0a0a14;
        border: 1px solid #2a2a44;
        border-radius: 6px;
        margin-bottom: 18px;
    }

    .tradetracker-layouteditor .le-tabchip[b-ikddds0z8t] {
        display: flex;
        align-items: center;
        gap: 6px;
        padding: 5px 10px;
        background: #1a1a2e;
        border: 1px solid #8888aa;
        border-radius: 4px;
        cursor: grab;
        user-select: none;
    }

        .tradetracker-layouteditor .le-tabchip:hover[b-ikddds0z8t] {
            background: #20203a;
        }

    .tradetracker-layouteditor .le-tabchip-selected[b-ikddds0z8t] {
        background: #26264a;
        border-color: #00E2FD;
        box-shadow: 0 0 0 1px #00E2FD inset;
        color: #fff;
    }

    .tradetracker-layouteditor .le-tabchip-add[b-ikddds0z8t] {
        background: transparent;
        border: 1px dashed #00E2FD;
        color: #00E2FD;
        cursor: pointer;
    }

    .tradetracker-layouteditor .le-tabchip-label[b-ikddds0z8t] {
        font-weight: 500;
    }

    .tradetracker-layouteditor .le-grip[b-ikddds0z8t] {
        color: #666;
        font-size: 0.85rem;
        cursor: grab;
    }

    .tradetracker-layouteditor .le-x[b-ikddds0z8t] {
        color: #FF7777;
        cursor: pointer;
        margin-left: 4px;
        font-size: 0.95rem;
        line-height: 1;
        padding: 0 2px;
    }

        .tradetracker-layouteditor .le-x:hover[b-ikddds0z8t] {
            color: #ffaaaa;
        }

    .tradetracker-layouteditor .le-plus[b-ikddds0z8t] {
        font-size: 0.95rem;
        line-height: 1;
    }

    /* ── Edit panel ─────────────────────────────────────────────────── */
    .tradetracker-layouteditor .le-edit-panel[b-ikddds0z8t] {
        background: #0a0a14;
        border: 1px solid #2a2a44;
        border-radius: 6px;
        padding: 14px;
    }

    .tradetracker-layouteditor .le-name-row[b-ikddds0z8t] {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 4px;
    }

    .tradetracker-layouteditor .le-field-label[b-ikddds0z8t] {
        color: #aaa;
        font-size: 0.75rem;
        min-width: 72px;
    }

    .tradetracker-layouteditor .le-name-input[b-ikddds0z8t] {
        width: 220px;
    }

    .tradetracker-layouteditor .le-auto-pill[b-ikddds0z8t] {
        color: #00FF7F;
        font-size: 0.7rem;
        border: 1px solid #00FF7F;
        border-radius: 3px;
        padding: 1px 6px;
    }

    .tradetracker-layouteditor .le-custom-pill[b-ikddds0z8t] {
        color: #FFE68C;
        font-size: 0.7rem;
        border: 1px solid #FFE68C;
        border-radius: 3px;
        padding: 1px 6px;
    }

    .tradetracker-layouteditor .le-hint[b-ikddds0z8t] {
        color: #666;
        font-size: 0.7rem;
        font-style: italic;
        margin: 0 0 14px 82px;
    }

    /* ── Panel list ─────────────────────────────────────────────────── */
    .tradetracker-layouteditor .le-panel-list[b-ikddds0z8t] {
        display: flex;
        flex-direction: column;
        gap: 4px;
        margin-bottom: 10px;
    }

    .tradetracker-layouteditor .le-panelrow[b-ikddds0z8t] {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 6px 10px;
        background: #1a1a2e;
        border: 1px solid #8888aa;
        border-radius: 4px;
        cursor: grab;
    }

    .tradetracker-layouteditor .le-panelrow-special[b-ikddds0z8t] {
        background: #14142d;
        border-color: #FFE68C;
        cursor: default;
    }

    .tradetracker-layouteditor .le-panel-title[b-ikddds0z8t] {
        flex: 1;
    }

    .tradetracker-layouteditor .le-short[b-ikddds0z8t] {
        color: #666;
        font-size: 0.7rem;
    }

    .tradetracker-layouteditor .le-add-row[b-ikddds0z8t] {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .tradetracker-layouteditor .le-add-select[b-ikddds0z8t] {
        flex: 1;
        max-width: 280px;
    }

    .tradetracker-layouteditor .le-add-btn[b-ikddds0z8t] {
        padding: 3px 14px;
    }

    .tradetracker-layouteditor .le-error[b-ikddds0z8t] {
        color: #FF7777;
        font-size: 0.75rem;
        margin: 10px 0 0;
    }

    /* ── Footer ─────────────────────────────────────────────────────── */
    .tradetracker-layouteditor .le-footer[b-ikddds0z8t] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: 18px;
        padding-top: 14px;
        border-top: 1px solid #2a2a44;
        flex-wrap: wrap;
        gap: 8px;
    }

    .tradetracker-layouteditor .le-reset-btn[b-ikddds0z8t] {
        background: transparent;
        color: #FF7777;
        border: 1px solid #FF7777;
        border-radius: 3px;
        padding: 4px 14px;
        font-size: 0.75rem;
        cursor: pointer;
    }

        .tradetracker-layouteditor .le-reset-btn:hover[b-ikddds0z8t] {
            background: #FF777722;
        }

    .tradetracker-layouteditor .le-reset-confirm[b-ikddds0z8t] {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 0.75rem;
        color: #FFE68C;
    }

    .tradetracker-layouteditor .le-reset-yes[b-ikddds0z8t] {
        padding: 3px 10px;
    }

    .tradetracker-layouteditor .le-saved-msg[b-ikddds0z8t] {
        color: #00FF7F;
        font-size: 0.7rem;
    }
/* /Components/Pages/General/Analysis/Surveys/Surveys.razor.rz.scp.css */
.svy-rpt-btn[b-az69lovmyn] {
    background-color: #000061;
    color: white;
    border: 1px solid navy;
    cursor: pointer;
    padding: 0.3% 3%;
    width: 100%;
}

/* /Components/Pages/General/Analysis/Vessels/Pages/Changes.razor.rz.scp.css */
.vls-type-btn[b-7rm7v4wvcd] {
    cursor: pointer;
    background-color: #E8E8E8;
    margin-right: 2%;
    padding: 0.5% 2.5%;
    border: 1px solid #E8E8E8;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

    .vls-type-btn:hover[b-7rm7v4wvcd] {
        background-color: #D1EDF5;
    }


.striped-bg[b-7rm7v4wvcd] {
    background: repeating-linear-gradient( 45deg, #666DA9, #666DA9 20%, #163E9F 20%, #163E9F 40% );
}
/* /Components/Pages/General/Analysis/Vessels/Pages/FuelInfo.razor.rz.scp.css */
.fuelinfo-btn[b-szukaiwjis] {
    cursor: pointer;
    background-color: #E8E8E8;
    margin-right: 2%;
    padding: 0.5% 5%;
    border: 1px solid #E8E8E8;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

    .fuelinfo-btn:hover[b-szukaiwjis] {
        background-color: #D1EDF5;
    }
/* /Components/Pages/General/Analysis/Vessels/Pages/Orderbook.razor.rz.scp.css */
@scope (.orderbook-cont) {
    :scope[b-kuc3xdl3n9] {
        /*        background-color: lightblue;*/
        /*        border: 2px solid gray;*/
        display: flex;
        flex-direction: column;
        height: 96%;
        width: 100%;
    }

    .div[b-kuc3xdl3n9] {
        border: 1px solid lightblue;
    }

    td[b-kuc3xdl3n9], th[b-kuc3xdl3n9] {
        padding: 5px;
    }
}

.orderbook-top[b-kuc3xdl3n9] {
    display: flex;
    flex-direction: row;
    height: 50%;
    width: 100%;
}

.orderbook-outlook[b-kuc3xdl3n9] {
    height: 100%;
    width: 59%;
    padding: 0.5%;
}

.orderbook-outlook-graph[b-kuc3xdl3n9] {
    height: 90%;
}

.orderbook-outlook-btn[b-kuc3xdl3n9] {
    cursor: pointer;
    background-color: #E8E8E8;
    margin-right: 2%;
    padding: 0.5% 5%;
    border: 1px solid #E8E8E8;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

    .orderbook-outlook-btn:hover[b-kuc3xdl3n9] {
        background-color: #D1EDF5;
    }


.orderbook-btm[b-kuc3xdl3n9] {
    height: 50%;
    width: 100%;
    display: flex;
    flex-direction: row;
}

.orderbook-geo[b-kuc3xdl3n9] {
    height: 100%;
    width: 50%;
    padding: 0.5%;
}

.orderbook-yards[b-kuc3xdl3n9] {
    height: 100%;
    width: 50%;
    padding: 0.5%;
}
/* /Components/Pages/General/Analysis/Vessels/Pages/YardInfo.razor.rz.scp.css */
.country-btn[b-oq2cff82lp] {
    width: 100%;
    cursor: pointer;
    background-color: #E8E8E8;
    /*    color: white;*/
    padding: 3% 5%;
    border: 1px solid #E8E8E8;
    border-radius: 8px;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}

    .country-btn:hover[b-oq2cff82lp] {
        background-color: #D1EDF5;
    }


@scope(.yard-util-table) {
    :scope[b-oq2cff82lp] {
    }

    thead[b-oq2cff82lp] {
        background-color: #163E9F;
        color: white;
        font-weight: 400;
    }

    tbody[b-oq2cff82lp] {
    }

        tbody tr:hover[b-oq2cff82lp] {
            background-color: #D0E4F0 !important;
        }
}
/* /Components/Pages/General/Bunkers/BunkerPrices.razor.rz.scp.css */
#mapdiv[b-95bobo2hnz] {
    width: 100%;
    height: 400px !important;
    z-index: unset !important;
}

#chartdiv[b-95bobo2hnz] {
    width: 100%;
}

.leaflet-popup-close-button[b-95bobo2hnz] {
    display: none;
}

.grid-container-bunker[b-95bobo2hnz] {
    display: grid;
    grid-template-columns: auto 300px;
    gap: 5px;
}

.grid-container-table-map[b-95bobo2hnz] {
    display: grid;
    grid-template-columns: 400px auto;
    grid-template-rows: auto;
    gap: 5px;
}

/*Autocomlete CSS*/

.autocomplete[b-95bobo2hnz] {
    /*the container must be positioned relative:*/
    position: relative;
    display: inline-block;
}

.cardformat[b-95bobo2hnz] {
    background-color: #DEEEF1 !important;
    width: 285px;
}

.autocomplete-items[b-95bobo2hnz] {
    position: absolute;
    border: 1px solid #d4d4d4;
    border-bottom: none;
    border-top: none;
    /*position the autocomplete items to be the same width as the container:*/
    top: 100%;
    left: 0;
    right: 0;
}

.autocomplete-items div[b-95bobo2hnz] {
    padding: 10px;
    cursor: pointer;
    background-color: #fff;
    border-bottom: 1px solid #d4d4d4;
}

.autocomplete-items div:hover[b-95bobo2hnz] {
    /*when hovering an item:*/
    background-color: #e9e9e9;
}

.autocomplete-active[b-95bobo2hnz] {
    /*when navigating through the items using the arrow keys:*/
    background-color: DodgerBlue !important;
    color: #ffffff;
}

.bunkersidebar[b-95bobo2hnz]  .bunkerex-input {
    height: 38px;
    background-color: #f0eeeb !important;
    color: black !important;
    border: black 1px solid !important;
    padding-left: 5px;
    padding-right: 2px;
}

.bunkersidebar[b-95bobo2hnz]  .bunkerex-button {
    vertical-align: top;
    height: 38px;
    background-color: #f0eeeb;
    color: black;
    border: black 1px solid;
    padding: 0;
}


.chartrow[b-95bobo2hnz] {
    display: flex;
}

.chartrowitem[b-95bobo2hnz] {
    /* flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0;
    border: 1px solid black; */
    /*width: calc((100dvw - 350px) / @chartCount );*/
    height: 460px
}

.leaflet-pane[b-95bobo2hnz] {
    z-index: 0;
}

.bunkersidebar[b-95bobo2hnz] {
    background-color:#B5CBD6;
    border: 1px solid #405864;
    border-radius: 10px;
    padding:8px;
}

@media (max-width: 768px) {
    .grid-container-bunker[b-95bobo2hnz] {
        display: block;
    }

    .grid-container-table-map[b-95bobo2hnz] {
        display: block;
    }

    .chartrow[b-95bobo2hnz] {
        display: block;
    }

    .chartrowitem[b-95bobo2hnz] {
        width: 100%;
        height: 460px
    }
}
/*End of Autocomplete CSS*/

/* /Components/Pages/General/Commentary/Commentary_00_Main.razor.rz.scp.css */
.commentary-page-layout[b-gvygzap5om] {
    display: grid;
    grid-template-columns: 250px auto;
    gap: 10px;
}

.commentary-button[b-gvygzap5om] {
    width: 80%;
    margin-bottom: 10px;
}

.commentary-filter-input[b-gvygzap5om] {
    width: 80%;
}

.commentary-filter-header[b-gvygzap5om] {
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 8px;
}

.commentary-filter-subheader[b-gvygzap5om] {
    font-weight: bold;
    font-size: 12px;
    margin-bottom: 8px;
}


    .span-2-widescreen[b-gvygzap5om] {
        grid-column: span 2;
    }

.commentary-small-icon[b-gvygzap5om] {
    height: 15px;
    cursor: pointer;
    border-radius: 5px;
}

    .commentary-small-icon.red:hover[b-gvygzap5om] {
        background-color: #FE908F;
    }

    .commentary-small-icon.orange:hover[b-gvygzap5om] {
        background-color: #F7B900;
    }

    .commentary-small-icon.green:hover[b-gvygzap5om] {
        background-color: #73D673;
    }


.commentary-side-panel[b-gvygzap5om] {
    z-index: 900;
    position: fixed;
    width: calc(100vw - 195px);
    height: 100vh;
    top: 0;
    left: calc(-100vw + 200px);
    transition: transform 0.5s ease-out;
    background-color: var(--ssy-grey);
    border-right: 5px solid var(--ssy-black);
    box-shadow: 0 20px 40px rgba(0,0,0,0.3);
}

    .commentary-side-panel.expanded[b-gvygzap5om] {
        transform: translateX(calc(100vw - 200px));
    }

.commentary-side-panel-container[b-gvygzap5om] {
    position: relative;
    height: 100%;
    width: 100%;
}

.commentary-side-panel-tab[b-gvygzap5om] {
    position: absolute;
    top: 40vh;
    left: calc(100vw - 200px);
    height: 94px;
    width: 30px;
    border-radius: 0 10px 10px 0;
    cursor: pointer;
    background-color: var(--ssy-black);
}

.commentary-arrow[b-gvygzap5om] {
    height: 40px;
    transition: transform 0.25s;
    transform: rotate(270deg);
    margin-top: 26px;
    margin-left: -5px;
}

    .commentary-arrow.expanded[b-gvygzap5om] {
        transform: rotate(450deg);
    }

@media (max-width: 840px) {
    .span-2-widescreen[b-gvygzap5om] {
        grid-column: auto;
    }
}
/* /Components/Pages/General/Commentary/Commentary_50_Edit.razor.rz.scp.css */
.commentaryeditgrid[b-j30kmh2tjs] {
    margin-left: 5px;
    display: grid;
    /*flex-direction: column;*/
    grid-template-columns: 14rem auto;
    gap: 10px;
}



.commentaryeditflex[b-j30kmh2tjs] {
    display: flex;
    gap: 10px;
}

.commentaryeditheader[b-j30kmh2tjs] {
    border: 1px solid silver;
    font-size: 20px;
    color: black;
    width: 100%;
    padding-left: 1em;
    margin-bottom: 4px;
    background-color: #E9EFF9;
}


    .commentaryeditheader[b-j30kmh2tjs]::placeholder {
        font-weight: unset;
        opacity: 0.5;
        color: grey;
        font-style: italic;
    }

.commentaryedittitle[b-j30kmh2tjs] {
    border: 1px solid silver;
    font-size: 20px;
    color: grey;
    width: 100%;
    padding-left: 1em;
    margin-bottom: 4px;
    background-color: #E9EFF9;
}

.commentarytitleheader[b-j30kmh2tjs] {
    border: 1px solid silver;
    font-weight: bold;
    width: 100%;
    padding-left: 5px;
    background-color: #E9EFF9;
}

.commentarylistbox[b-j30kmh2tjs] {
    border: 1px solid silver;
    font-weight: bold;
    width: 100%;
    padding-left: 5px;
    background-color: #E9EFF9;
}

.commentaryedittext[b-j30kmh2tjs] {
    border: 1px solid silver;
    color: black;
    width: 100%;
    padding-left: 1em;
    margin-bottom: 4px;
    background-color: #E9EFF9;
}


    .commentaryedittext[b-j30kmh2tjs]::placeholder {
        opacity: 0.5;
        color: grey;
        font-style: italic;
    }

.tagsshow-container[b-j30kmh2tjs] {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 2px;
}


.tagsshow-container-sub[b-j30kmh2tjs] {
    display: flex;
    align-items: flex-start;
    gap: 1px;
}

.tagsshow-parent[b-j30kmh2tjs] {
    text-align: center;
    font-weight: bold;
    font-size: 10px;
    width: 100px;
    border: darkGrey;
    border-radius: 5px;
    margin-bottom: 10px;
}

.tagsshow-sub[b-j30kmh2tjs] {
    text-align: center;
    font-size: 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    padding: 0 5px 0 5px;
}

.buttons-flex-container[b-j30kmh2tjs] {
    display: flex;
    align-items: flex-start;
    flex-wrap: nowrap;
    gap: 20px;
    justify-content: space-between;
}

.commentary-editor-button[b-j30kmh2tjs] {
    padding: 5px 20px 5px 20px;
}

.links-grid-container[b-j30kmh2tjs] {
    display: grid;
    grid-template-columns: 170px auto 22px;
    gap: 3px;
}

.delete-container[b-j30kmh2tjs] {
    position: relative;
    width: 300px;
    padding: 10px 20px 10px 20px;
}

.hoverred:hover[b-j30kmh2tjs] {
    background-color: #DB303A;
    border-radius: 5px;
}

.hoverorange:hover[b-j30kmh2tjs] {
    background-color: #F7B900;
    border-radius: 5px;
}

.hovergreen:hover[b-j30kmh2tjs] {
    background-color: #73D673;
    border-radius: 5px;
}
/* /Components/Pages/General/Commentary/Commentary_90_TagSelector.razor.rz.scp.css */
.tags-container[b-3krgu92uyf] {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 5px;
    flex-direction: column;
}
.commentaryeditgrid .tags-container[b-3krgu92uyf] {
    flex-direction: row;
}

.tags-container-sub[b-3krgu92uyf] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.tags-parent[b-3krgu92uyf] {
    text-align: center;
    font-weight: bold;
    font-size: 10px;
    padding: 0 10px;
    border: var(--tag-border);
    border-radius: 5px;
    margin-bottom: 10px;
    cursor: pointer;
    min-width: 100px;
}
.commentaryeditgrid .tags-parent[b-3krgu92uyf] {
    min-width: 0;
}

.tags-sub[b-3krgu92uyf] {
    font-size: 10px;
    cursor: pointer;
}

.tags-sub[b-3krgu92uyf]::before {
    display: inline-block;
    content: '';
    width: 15px;
    height: 15px;
    margin: 2px 3px;
    border-radius: 10px;
    border: var(--tag-border);
    background-color: var(--tag-bk-colours);
    color: var(--tag-tx-colours);
    vertical-align: middle;
}

@media (min-width: 576px) {
    .commentaryeditgrid .tags-container[b-3krgu92uyf] {
        flex-direction: column;
    }

    .commentaryeditgrid .tags-parent[b-3krgu92uyf] {
        min-width: 100px;
    }
}
/* /Components/Pages/General/CustomCarouselEdit.razor.rz.scp.css */
/* --- Carousel Management Window Modern Redesign --- */
.carousel-mgmt-main[b-nxvp9w1d8i] {
    width: 100%;
    height: 100%;
    padding: 0;
    background: #f6f8fa;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.carousel-mgmt-header-bar[b-nxvp9w1d8i] {
    background: #fff;
    padding-bottom: 1rem;
    display: flex;
    flex-direction: row;
    gap: 1rem;
}

.carousel-mgmt-header-desc[b-nxvp9w1d8i] {
    font-size: 1rem;
    color: #666;
}

.carousel-mgmt-columns[b-nxvp9w1d8i] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
    padding: 2rem;
    flex: 1 1 auto;
    overflow-y: auto;
    background: #f6f8fa;
}

.carousel-mgmt-section[b-nxvp9w1d8i] {
    background: #fff;
    border-radius: 1rem;
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.04);
    padding: 1.5rem 1rem;
    display: flex;
    flex-direction: column;
    min-height: 400px;
    max-height: 80vh;
}

.carousel-mgmt-section header[b-nxvp9w1d8i] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1rem;
    font-size: 1.1rem;
    font-weight: 600;
}

.carousel-mgmt-count[b-nxvp9w1d8i] {
    color: #888;
    margin-left: 0.5rem;
    font-size: 1rem;
}

.carousel-mgmt-filter[b-nxvp9w1d8i] {
    margin-left: auto;
    width: 120px;
    border-radius: 1rem;
    border: 1px solid #e5e7eb;
    background: #f7fafd;
}

.carousel-mgmt-list[b-nxvp9w1d8i] {
    flex: 1 1 auto;
    overflow-y: auto;
    min-height: 200px;
    background: transparent;
    border: none;
    padding: 0;
}

.carousel-mgmt-card-item[b-nxvp9w1d8i] {
    background: #f8f9fa;
    border-radius: 0.75rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
    border: 1px solid #e5e7eb;
    margin-bottom: 1rem;
    transition: box-shadow 0.2s, border 0.2s, background 0.2s;
    cursor: grab;
}

.carousel-mgmt-card-item-row[b-nxvp9w1d8i] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
}

.carousel-mgmt-card-item.dragging[b-nxvp9w1d8i] {
    opacity: 0.5;
    border: 2px dashed #007bff;
    background: #e9eff9;
}

.carousel-mgmt-drag-handle[b-nxvp9w1d8i] {
    color: #888;
    font-size: 1.3rem;
    padding-top: 0.2rem;
    user-select: none;
    transition: color 0.2s;
    cursor: grab;
}

.carousel-mgmt-card-item:hover .carousel-mgmt-drag-handle[b-nxvp9w1d8i] {
    color: #007bff;
}

.carousel-mgmt-thumb[b-nxvp9w1d8i] {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 0.5rem;
    border: 1px solid #e5e7eb;
    background: #f6f8fa;
}

.carousel-mgmt-card-item-content[b-nxvp9w1d8i] {
    flex: 1;
    min-width: 0;
    gap: 0.25rem;
    display: flex;
    flex-direction: column;
}

.carousel-mgmt-card-title[b-nxvp9w1d8i] {
    font-size: 1rem;
    font-weight: 600;
    color: #163E9F;
}

.carousel-mgmt-card-desc[b-nxvp9w1d8i] {
    font-size: 0.97rem;
    color: #444;
    margin-bottom: 0.25rem;
    max-height: none !important;
    overflow: visible !important;
    text-overflow: unset !important;
    white-space: normal !important;
    word-break: break-word !important;
}

.carousel-mgmt-card-meta[b-nxvp9w1d8i] {
    font-size: 0.85rem;
    color: #888;
    display: flex;
    gap: 1rem;
}

.carousel-mgmt-card-actions[b-nxvp9w1d8i] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-end;
}

.empty-list-placeholder[b-nxvp9w1d8i] {
    color: #aaa;
    text-align: center;
    padding: 2.5rem 0;
    font-size: 1.1rem;
    background: #f3f6fa;
    border-radius: 0.75rem;
    border: 1px dashed #d0d7e2;
    margin-bottom: 1rem;
}

.limit-warning[b-nxvp9w1d8i] {
    color: #dc3545;
    font-size: 1.3rem;
    margin-left: 0.5rem;
}

.carousel-mgmt-modal-footer[b-nxvp9w1d8i] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    padding: 1.25rem 2rem 1.25rem 2rem;
    background: #fff;
    border-top: 1px solid #e5e7eb;
    border-bottom-left-radius: 1.25rem;
    border-bottom-right-radius: 1.25rem;
}

/** MODAL **/

[b-nxvp9w1d8i] .carousel-edit-image-preview-simple {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    background: #f8f9fa;
    border-radius: 0.5rem;
    padding: 0.5rem;
    text-align: center;
}

/* Fix preview and crop styles */
[b-nxvp9w1d8i] .preview-area-simple {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 aspect ratio */
    border-radius: 0.5rem;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

[b-nxvp9w1d8i] .preview-image-simple {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Changed from contain to cover */
    border-radius: 0.5rem;
    z-index: 1;
}
/* /Components/Pages/General/CustomCharts.razor.rz.scp.css */
.chart-builder-container[b-a78zcl10l2] {
    display: grid;
    grid-template-columns: 27.1rem auto;
    gap: 1.5rem;
}
    .chart-builder-container .chart-builder-highchart[b-a78zcl10l2] {
        align-self: baseline;
        overflow: auto;
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        padding-left: 0.5rem;
    }

/* Each chart wrapper is drag-resizable via the native CSS resize handle in the bottom-right corner.
   Tracked via [data-chart-wrapper="1"] in CustomCharts.razor.js, which reflows the live Highcharts
   instance during the drag and persists the resulting pixel size through Saved Settings. */
.ssy-chart-wrapper[b-a78zcl10l2] {
    resize: both;
    overflow: hidden;
    min-width: 320px;
    min-height: 200px;
    position: relative;
    border: 1px dashed transparent;
}
.ssy-chart-wrapper:hover[b-a78zcl10l2] {
    /* Hint that the corner is draggable. */
    border-color: rgba(22, 62, 159, 0.18);
}
.ssy-chart-wrapper[b-a78zcl10l2]::after {
    /* Make the native resize handle a little more visible. */
    content: "";
    position: absolute;
    right: 2px;
    bottom: 2px;
    width: 12px;
    height: 12px;
    background:
        linear-gradient(135deg, transparent 50%, #163E9F 50%, #163E9F 60%, transparent 60%, transparent 70%, #163E9F 70%, #163E9F 80%, transparent 80%);
    pointer-events: none;
    opacity: 0.55;
}

.chart-builder-container h2[b-a78zcl10l2] {
    margin-bottom: 0.5em;
}
.chart-builder-form[b-a78zcl10l2] {
    align-self: flex-start;
}

.chart-builder-form > .chart-builder[b-a78zcl10l2] {
    height: calc(100% - 3em);
    display: grid;
}

.chart-builder > .chart-data-selector[b-a78zcl10l2]{
    /*min-height: 16rem;*/
}

.chart-builder > div[b-a78zcl10l2] {
    border: 2px solid #009DC9;
    margin-bottom: 1em;
}
.chart-builder h3.ssy-colour-lw[b-a78zcl10l2] {
    text-align: center;
    font-size: 1.25em;
}

.chart-builder-measures[b-a78zcl10l2] {
    display: flex;
    gap: 3px;
}

.chart-builder-measures .ssy-radio-main label[b-a78zcl10l2] {
    background-color: #009DC9;
    color: white;
}

.chart-builder-measures .ssy-radio-main input:checked + label[b-a78zcl10l2] {
    background-color: #000061;
    color: white;
}

.chart-builder-action:hover[b-a78zcl10l2] {
    cursor: pointer;
    color: white;
    background-color: #163E9F;
    border-radius: 5px;
}

@media (max-width: 900px)  {
    .chart-builder-container[b-a78zcl10l2] {
        display: block;
    }

        .chart-builder-container .chart-builder-highchart[b-a78zcl10l2] {
            align-self: baseline;
            overflow: auto;
            display: flex;
            flex-wrap: wrap;
            gap: 5px;
        }

    .chart-builder-measures[b-a78zcl10l2] {
        display: block;
    }
}
/* /Components/Pages/General/Dashboard/Dashboard_00.razor.rz.scp.css */
/* container */

.ssymarkets-dashboard-container .dashboard-chartsection[b-fw3r49wmly] {
    display: grid;
    grid-template-columns: 3em auto;
}

.ssymarkets-dashboard-container .dashboard-header[b-fw3r49wmly] {
    writing-mode: vertical-lr;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ssymarkets-dashboard-container .dashboard-header a[b-fw3r49wmly],
.ssymarkets-dashboard-container .dashboard-header a h2[b-fw3r49wmly],
.ssymarkets-dashboard-container .dashboard-header div[b-fw3r49wmly],
.ssymarkets-dashboard-container .dashboard-header div h2[b-fw3r49wmly]{
    color: inherit;
}

.ssymarkets-dashboard-container .dashboard-content[b-fw3r49wmly] {
    display: flex;
    flex-direction: column;
}

.ssymarkets-dashboard-container .dashboard-content:not(.contentType-table)[b-fw3r49wmly]{
    justify-content: space-between;
}

.ssymarkets-dashboard-container .dashboard-row .dashboard-content:first-child[b-fw3r49wmly] {
    padding-left: 0.5rem;
}

.ssymarkets-dashboard-container .dashboard-content[b-fw3r49wmly]  .HighChart-Base {
    
}

/* border top classes */
.dashboard-chartsection .dashboard-header[b-fw3r49wmly],
.dashboard-chartsection .dashboard-row[b-fw3r49wmly] {
    border-top: 7px solid #000000;
}

.dashboard-chartsection .dashboard-header.ssy-colour-dw[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-dw"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #000061; /* Simpson Blue */
}

.dashboard-chartsection .dashboard-header.ssy-colour-brightblue-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-brightblue-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #0087CB; /* Bright Blue */
}

.dashboard-chartsection .dashboard-header.ssy-colour-vividpink-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-vividpink-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #EB3871; /* Vivid Pink */
}

.dashboard-chartsection .dashboard-header.ssy-colour-tealgreen-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-tealgreen-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #01A39E; /* Teal Green */
}

.dashboard-chartsection .dashboard-header.ssy-colour-goldenyellow-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-goldenyellow-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #F7A506; /* Golden Yellow */
}

.dashboard-chartsection .dashboard-header.ssy-colour-aquamarine-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-aquamarine-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #24DEBD; /* Aquamarine */
}

.dashboard-chartsection .dashboard-header.ssy-colour-brightorange-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-brightorange-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #FF670F; /* Bright Orange */
}

.dashboard-chartsection .dashboard-header.ssy-colour-royalpurple-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-royalpurple-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #752FD0; /* Royal Purple */
}

.dashboard-chartsection .dashboard-header.ssy-colour-lemonyellow-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-lemonyellow-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #FFD025; /* Lemon Yellow */
}

.dashboard-chartsection .dashboard-header.ssy-colour-cyanblue-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-cyanblue-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #009DCA; /* Cyan Blue */
}

.dashboard-chartsection .dashboard-header.ssy-colour-slategray-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-slategray-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #405864; /* Slate Gray */
}

.dashboard-chartsection .dashboard-header.ssy-colour-lightblue-gray-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-lightblue-gray-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #B5CBD6; /* Light Blue-Gray */
}

.dashboard-chartsection .dashboard-header.ssy-colour-crimsonred-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-crimsonred-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #DB303A; /* Crimson Red */
}

.dashboard-chartsection .dashboard-header.ssy-colour-olivegreen-white[b-fw3r49wmly],
.dashboard-chartsection[data-headerColor*="ssy-colour-olivegreen-white"] .dashboard-row[b-fw3r49wmly] {
    border-top-color: #91A527; /* Olive Green */
}

/* loading classes */

/* While the dashboard is still loading we keep the chart sections in layout
   (so Highcharts and Bootstrap's grid can size everything correctly off-screen)
   but invisible to the user. Once every child has reported it's ready we fade
   the sections in as one settled view, instead of letting them flicker in and
   resize individually. */
.ssymarkets-dashboard-container.is-loading .dashboard-chartsection[b-fw3r49wmly] {
    opacity: 0;
    pointer-events: none;
}

.ssymarkets-dashboard-container.is-ready .dashboard-chartsection[b-fw3r49wmly] {
    opacity: 1;
    transition: opacity 0.15s ease-in;
}

.loading-overlay[b-fw3r49wmly] {
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 50px;
    width: 100%;
    height: 100%;
    background-color: #405864;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
    background-image: url('./assets/loadin.gif');
    background-repeat: no-repeat;
    background-position: center; /* Center the image */
    background-size: 20%; /* Make the image slightly smaller */
    opacity: 0.9; /* Make slightly opaque */
}

.loading-overlay[b-fw3r49wmly]::after {
    content: "Loading";
    position: absolute;
    top: calc(50% + 100px); /* Adjust this value to position the text below the logo */
    color: white;
    font-size: 1.5em;
    text-align: center;
}

/* styling for charts and components*/

[b-fw3r49wmly] .tableRowHeaderText a {
    color:white;
}

[b-fw3r49wmly] .h1Grey {
    font-family: 'Soehne Breit', Arial;
    font-size: 16px;
    font-weight: bolder;
    color: #000061;
}


[b-fw3r49wmly] .h1Grey a {
    color: #000061;
    text-decoration: underline;
}


[b-fw3r49wmly] .h2Grey {
    font-family: 'Soehne Breit', Arial;
    font-size: 12px;
    color: #000061;
}

/* Mobile: hide vertical scrollbar but keep scrolling enabled (prevents flicker as content loads) */
@media (min-width: 768px) {
    .ssymarkets-dashboard-container[b-fw3r49wmly] {
        scrollbar-width: none; /* Firefox */
        -ms-overflow-style: none; /* IE / legacy Edge */
        overflow-y: auto; /* ensure scrolling still works */
        -webkit-overflow-scrolling: touch;
    }

        .ssymarkets-dashboard-container[b-fw3r49wmly]::-webkit-scrollbar {
            width: 0;
            height: 0;
            display: none; /* Chrome / Safari / WebKit */
        }
}
/* /Components/Pages/General/LearningHub/DemoClientAccess.razor.rz.scp.css */
.client-demo-table[b-rkgovn9u1g] {
    width: 100%;
}
.client-demo-table .td[b-rkgovn9u1g] {
    padding: 15px;
}
/* /Components/Pages/General/LearningHub/LearningHub.razor.rz.scp.css */
/* /Components/Pages/General/LearningHub/LearningHubVideo.razor.rz.scp.css */
.theatre-container[b-pnysgso4cj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    min-height: 94vh;
    background-color: #f5f7fa;
}

.page-header[b-pnysgso4cj] {
    width: 100%;
    max-width: 1200px;
    margin-bottom: 0rem;
    margin-top: 1rem;
}

.page-header h2[b-pnysgso4cj] {
    color: #2c3e50;
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

.page-header hr[b-pnysgso4cj] {
    border: none;
    height: 2px;
    background: linear-gradient(to right, #007bff, transparent);
}


.video-container[b-pnysgso4cj] {
    width: 100%;
    max-width: 1200px;
    background-color: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
    padding: 1rem;
    margin-top: 1rem;
}

.video-player[b-pnysgso4cj] {
    width: 100%;
    aspect-ratio: 16/9;
    background-color: #000;
}

@media (max-width: 768px) {
    .video-container[b-pnysgso4cj] {
        margin-top: 1rem;
    }
}


/* /Components/Pages/General/LearningHub/LearningHubVideoPage.razor.rz.scp.css */
/* /Components/Pages/General/LearningHub/RequestAccess/RegisterRequestAccess_1.razor.rz.scp.css */
.req-access-field[b-txorbe5yjo] {
    background-color: #405864;
    color: #F0F0F0;
    border: 1px solid gray;
    border-radius: 12px;
}

.req-access-label[b-txorbe5yjo] {
    color: lightgray;
}
/* /Components/Pages/General/OmniPortal/Components/AttachmentListItem.razor.rz.scp.css */
.opalitem[b-dfhc2a17n3] {
    padding: 4px 8px 4px 20px;
    
    border-radius: 4px;
    transition: all 0.3s ease; /* Increased transition time for smoother effect */
    border-left: 3px solid transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    position: relative;
    -webkit-tap-highlight-color: transparent;
}

    .opalitem:hover[b-dfhc2a17n3] {
        background-color: #f8f9fa;
        border-left-color: #163E9F;
        transform: translateX(3px); /* Add subtle movement on hover */
        box-shadow: 0 1px 3px rgba(0,0,0,0.1); /* Add subtle shadow for depth */
    }

    .opalitem:active[b-dfhc2a17n3] {
        background-color: #f0f0f0;
        transform: translateX(2px) scale(0.99);
    }

    .opalitem:hover .child-type-label[b-dfhc2a17n3] {
        background: #f8f9fa;
        color: #555;
    }

    .opalitem span[b-dfhc2a17n3] {
        color: #333;
        font-size: 0.9rem;
        margin-right: 20px;
        display: inline-block;
    }

.item-content[b-dfhc2a17n3] {
    display: flex;
    flex-direction: column;
}

.item-date[b-dfhc2a17n3] {
    position: relative;
    z-index: 1;
}

.item-indicator[b-dfhc2a17n3] {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 0;
    background-color: rgba(22, 62, 159, 0.05);
    transition: width 0.3s ease;
    z-index: 0;
    border-radius: 0 4px 4px 0;
}

.opalitem:hover .item-indicator[b-dfhc2a17n3] {
    width: 100%;
}

.actions[b-dfhc2a17n3] {
    display: flex;
    align-items: center;
    opacity: 0.6; /* Start with lower opacity */
    transition: opacity 0.3s ease;
    position: relative;
    z-index: 2;
}

.opalitem:hover .actions[b-dfhc2a17n3] {
    opacity: 1; /* Full opacity on hover */
}

.view-html-button[b-dfhc2a17n3],
.view-pdf-button[b-dfhc2a17n3] {
    opacity: 0.7;
    transition: all 0.2s ease; /* Changed from just opacity to all */
    padding: 4px;
    margin-left: 8px;
    cursor: pointer;
    border-radius: 4px; /* Add rounded corners */
    position: relative;
}

.view-html-button:hover[b-dfhc2a17n3],
.view-pdf-button:hover[b-dfhc2a17n3] {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.05); /* Add subtle background */
    transform: scale(1.1); /* Slightly larger on hover */
}

.view-html-button:active[b-dfhc2a17n3],
.view-pdf-button:active[b-dfhc2a17n3] {
    transform: scale(0.95);
}

[b-dfhc2a17n3] .badge {
    margin-left: 8px;
    padding: 3px 8px;
    font-size: 0.75rem;
    animation: pulse-b-dfhc2a17n3 2s infinite; /* Add pulsing animation for new badges */
}

@keyframes pulse-b-dfhc2a17n3 {
    0% { opacity: 1; }
    50% { opacity: 0.7; }
    100% { opacity: 1; }
}

.archive-item[b-dfhc2a17n3] {
   /* margin-left: 15px;*/
    font-size: 0.9em;
    /*padding: 4px 12px;*/
}

.archive-item:hover[b-dfhc2a17n3] {
    background-color: #f3f3f3;
    border-left-color: #009DC9;
}

.archive-item span[b-dfhc2a17n3] {
    color: #666;
}

.archive-item .child-type-label[b-dfhc2a17n3] {
    background: #fafafa;
    color: #888;
}

.child-type-label[b-dfhc2a17n3] {
    position: absolute;
    left: -3px;
    top: 0;
    font-size: 0.65rem;
    color: #666;
    background: #fff;
    padding: 1px 6px;
    line-height: 1;
    border-bottom: 1px solid #eee;
    border-right: 1px solid #eee;
    border-radius: 0 0 4px 0;
    transition: all 0.2s ease;
}

.opalitem:hover .child-type-label[b-dfhc2a17n3] {
    left: 0;
    color: #163E9F;
    border-color: #163E9F;
}

/* Mobile optimizations */
@media (max-width: 768px) {
    .opalitem[b-dfhc2a17n3] {
        padding: 12px 15px 12px 45px;
        margin: 4px 0;
    }
    
    .actions[b-dfhc2a17n3] {
        display: flex;
        gap: 10px;
        opacity: 0.9;
    }
    
    .view-html-button[b-dfhc2a17n3],
    .view-pdf-button[b-dfhc2a17n3] {
        padding: 8px;
        margin-left: 0;
        opacity: 0.9;
        position: relative;
        z-index: 5;
    }
    
    .view-html-button[b-dfhc2a17n3]::before,
    .view-pdf-button[b-dfhc2a17n3]::before {
        content: '';
        position: absolute;
        top: -5px;
        bottom: -5px;
        left: -5px;
        right: -5px;
        z-index: -1;
    }
    
    .item-date[b-dfhc2a17n3] {
        font-size: 1rem !important;
    }
    
    .child-type-label[b-dfhc2a17n3] {
        font-size: 0.7rem;
        padding: 2px 8px;
    }
}
/* /Components/Pages/General/OmniPortal/Components/ViewFileIFrame.razor.rz.scp.css */
.fileViewerContainer[b-2qrfbeybab] {
    height: 100%;
    width: 100%;
    position: relative;
}
.fileViewerContainer[b-2qrfbeybab]  iframe[data-jsFunction="viewFile"],
.fileViewerContainer[b-2qrfbeybab]  iframe[data-jsFunction="viewFileByUri"],
.fileViewerContainer[b-2qrfbeybab]  iframe[data-jsFunction="loadSandboxedIframe"],
.fileViewerContainer[b-2qrfbeybab]  iframe[data-jsFunction="loadOfficeIframe"],
.fileViewerContainer[b-2qrfbeybab]  iframe[data-jsFunction="loadUrlIframe"]{
    width: 100%;
    height: 100%;
    border: none;
    margin: 0 auto;
    display: inline-block;
    overflow: auto;
}
/* /Components/Pages/General/OmniPortal/FileUpload.razor.rz.scp.css */
.fileupload-container .loading-overlay[b-iudv622tm2] {
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 50px;
    width: 100%;
    height: 100%;
    background-color: #405864;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
    background-image: url('./assets/loadin.gif');
    background-repeat: no-repeat;
    background-position: center; /* Center the image */
    background-size: 20%; /* Make the image slightly smaller */
    opacity: 0.9; /* Make slightly opaque */
}

.fileupload-container .loading-overlay[b-iudv622tm2]::after {
    content: "Loading";
    position: absolute;
    top: calc(50% + 100px); /* Adjust this value to position the text below the logo */
    color: white;
    font-size: 1.5em;
    text-align: center;
}

.fileupload-container[b-iudv622tm2]  .btn.btn-primary {
    display: inline-flex;
    column-gap: 5px;
    align-items: center;
}

.fileupload-container[b-iudv622tm2]  .quickgrid{
    width: 100%;
}
.fileupload-container[b-iudv622tm2]  .quickgrid td {
    padding: 5px 15px; /* Adjust as needed */
    text-align: center;
}

.fileupload-container[b-iudv622tm2]  .quickgrid tr:nth-child(even):has(td > *) {
    background-color: #f2f2f2; /* This is a light grey color */
}

.fileupload-container[b-iudv622tm2]  .quickgrid .name-column {
    width: 350px;
    text-overflow: ellipsis;
}

.fileupload-container[b-iudv622tm2]  .quickgrid .date-column {
    width: 100px;
}

.fileupload-container[b-iudv622tm2]  .quickgrid .int-ext-column {
    width: 50px;
}

.fileupload-container[b-iudv622tm2]  .quickgrid .btn-column {
    width: 150px;
}
.fileupload-container[b-iudv622tm2]  .quickgrid .btn-extended-column {
    width: 175px;
}

.fileupload-container[b-iudv622tm2]  .quickgrid .search-box {
    margin: 5px;
    z-index: 1;
    position: relative;
}

.fileupload-container .roles-container[b-iudv622tm2] {
    border: 1px solid black; 
    margin: 10px; 
    border-radius: 10px; 
    background-color: #f2f2f2;
    display: flex;
    flex-direction: row;
    padding: 0.5rem;
}

@media (max-width: 1300px) {
    .fileupload-container h1 > span.hide-mobile[b-iudv622tm2]{
        display: none;
    }

    .fileupload-container[b-iudv622tm2]  .quickgrid .hide-mobile {
        display: none;
    }
    .fileupload-container .roles-container[b-iudv622tm2] {
        flex-direction: column;
    }
}

[b-iudv622tm2] .font-weight-bold {
    font-weight: bold;
}

[b-iudv622tm2] .edit-form-container {
    max-width: 600px; /* Adjust based on preference */
    margin: auto;
    padding: 20px;
    background-color: #f4f4f4; /* Light grey background */
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Soft shadow for depth */
}

[b-iudv622tm2] .edit-form-label {
    display: block; /* Ensure labels are block level for consistent alignment */
    margin-bottom: 5px; /* Space between label and input */
    color: #333; /* Dark grey color for text */
    font-weight: bold;
}

[b-iudv622tm2] .edit-form-input, [b-iudv622tm2] .edit-form-select {
    width: 100%; /* Full width inputs */
    padding: 8px;
    margin-bottom: 20px; /* Space between form fields */
    border: 1px solid #ccc; /* Light grey border */
    border-radius: 4px; /* Slightly rounded corners */
}

[b-iudv622tm2] .edit-form-button:hover {
    background-color: #0056b3; /* Darker blue on hover */
}

[b-iudv622tm2] .upload-modal-container {
    padding: 20px;
    background-color: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

[b-iudv622tm2] .upload-modal-header {
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 10px;
    text-align: center;
}

[b-iudv622tm2] .upload-modal-body {
    padding: 10px;
}

[b-iudv622tm2] .upload-modal-select {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

[b-iudv622tm2] .upload-modal-input {
    width: 100%;
    padding: 8px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

[b-iudv622tm2] .upload-modal-footer {
    text-align: center;
    margin-top: 20px;
}



[b-iudv622tm2] .validation-summary {
    color: red;
    list-style-type: none;
    padding: 0;
}

/* reset disabled styling cause ugly */
[b-iudv622tm2] .form-control:disabled, .form-control[readonly][b-iudv622tm2] {
    color: #212529;
    background-color: #e9ecef;
}

/* email modal */
[b-iudv622tm2] .role-select-btn:hover {
    font-weight: bold;
}
[b-iudv622tm2] .role-select-btn.add:hover {
    background-color: #8CD47E;
    font-weight: normal;
}
[b-iudv622tm2] .role-select-btn.remove:hover {
    background-color: #FF6961;
    font-weight: normal;
}
[b-iudv622tm2] .selected-role {
    font-weight: bold;
    text-decoration: underline;
}
/* /Components/Pages/General/OmniPortal/OmniPortal.razor.rz.scp.css */
/* Layout & Responsive Styles */
.col-md-10[b-fgesmmdxhj] {
    transition: margin-left 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), width 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.menu-collapsed .col-md-10[b-fgesmmdxhj] {
    margin-left: 0;
    width: 100%;
}

@media (max-width: 1500px) {
    .col-sm-2[b-fgesmmdxhj] {
        flex: 0 0 20%;
        max-width: 20%;
    }
    .col-md-10[b-fgesmmdxhj] {
        flex: 0 0 80%;
        max-width: 80%;
    }
    .collapse-button[b-fgesmmdxhj] {
        left: 19.5% !important;
    }
    .menu-collapsed .collapse-button[b-fgesmmdxhj] {
        left: -10px !important;
        animation: slideOut-b-fgesmmdxhj 0.3s forwards;
    }
}

@media (max-width: 992px) {
    .collapse-button[b-fgesmmdxhj] {
        left: 19% !important;
    }
    .menu-collapsed .collapse-button[b-fgesmmdxhj] {
        left: 0 !important
    }
}

/* Menu States & Navigation */
.expanded-menu[b-fgesmmdxhj] {
    background: #f8f9fa;
    border: 1px dashed #dee2e6;
    transform: translateX(0);
    width: 16.66%;
    animation: slideIn-b-fgesmmdxhj 0.3s forwards;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
}

.collapsed-menu[b-fgesmmdxhj] {
    display: none;
    transform: translateX(-100%);
    width: 0;
    animation: slideOut-b-fgesmmdxhj 0.3s forwards;
}

.menu-expanded .collapse-button[b-fgesmmdxhj] {
    left: 16.5%;
    margin-left: 6px;
    animation: slideIn-b-fgesmmdxhj 0.3s forwards;
}

.sidebar-container[b-fgesmmdxhj] {
    position: relative;
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    height: calc(99vh - 60px);
    padding-right: 0;
    padding-bottom: 8px;
}
.select-attachType-container[b-fgesmmdxhj]{
    padding: 8px;
    position: sticky;
    top: 0;
    z-index: 50;
    background-color: #f8f9fa;
}

/* Sidebar Components */
.sidebar-container[b-fgesmmdxhj]::-webkit-scrollbar {
    width: 6px;
}

.sidebar-container[b-fgesmmdxhj]::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.sidebar-container[b-fgesmmdxhj]::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

.sidebar-container[b-fgesmmdxhj]::-webkit-scrollbar-thumb:hover {
    background: #555;
}


.opcard[b-fgesmmdxhj] {
    padding: 0px 2px 0 0;
    margin-bottom: 10px;
    background-color: #ffffff;
    border-radius: 4px;
    border: 1px solid transparent;
    box-shadow: 2px 2px 4px rgba(0,0,0,0.1);
}

.opcardcontent[b-fgesmmdxhj] {
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0;
    background-color: #ffffff;
}


/* Report Headers */
.reportHeaderGroup[b-fgesmmdxhj] {
    padding: 10px 15px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    color: #163E9F;
    background: #ffffff;
    transition: all 0.3s ease;
    width: 100%;
    font-weight: 500;
}


.reportHeaderGroup.static[b-fgesmmdxhj] {
    cursor: default;
}

.reportHeaderGroup:not(.static)[b-fgesmmdxhj] {
    cursor: pointer;
}

.reportHeaderGroup a[b-fgesmmdxhj] {
    width: 100%;
}

.reportHeaderGroup.collapsed[b-fgesmmdxhj]::after,
.reportHeaderGroup.expanded[b-fgesmmdxhj]::after {
    position: absolute;
    right: 0;
    color: #163E9F;
    margin-right: 1rem;
}

.reportHeaderGroup.collapsed[b-fgesmmdxhj]::after {
    content: "▼";
    /*content: "▽";*/
}

.reportHeaderGroup.expanded[b-fgesmmdxhj]::after {
    content: "▲";
    /*content: "△";*/
}

/* Remove the old a::after rules since we're using the div::after instead */
.reportHeaderGroup.collapsed a[b-fgesmmdxhj]::after,
.reportHeaderGroup.expanded a[b-fgesmmdxhj]::after {
    display: none;
}


.accordion[b-fgesmmdxhj]{
    padding: 1px 0 !important;
    width: 100%;
}

.opaccordion-button[b-fgesmmdxhj] {
    position: relative;
    font-size: 0.9rem !important;
    padding: 8px 15px;
    background-color: #f8f9fa;
    border-radius: 4px;
    color: #000061;
    font-weight: 500;
    border-left: 3px solid transparent;
    transition: all 0.2s ease;
    align-items: center;
    width: 100%;
    cursor: pointer;
}

    .opaccordion-button:not(.collapsed)[b-fgesmmdxhj] {
        background-color: #f8f9fa;
        color: #000061;
        box-shadow: none;
    }

    .opaccordion-button:hover[b-fgesmmdxhj] {
        background-color: #f8f9fa;
        border-left-color: #163E9F;
    }

    .opaccordion-button:focus[b-fgesmmdxhj] {
        box-shadow: 0 0 0 0.1rem rgba(219, 48, 58, 0.25);
    }

    .opaccordion-button[b-fgesmmdxhj]::after {
        position: absolute;
        right: 0;
        color: #163E9F;
        margin-right: 1rem;
    }

    .opaccordion-button.collapsed[b-fgesmmdxhj]::after {
        content: "▼";
    }

    .opaccordion-button:not(.collapsed)[b-fgesmmdxhj]::after {
        content: "▲";
    }

.accordion-body[b-fgesmmdxhj] {
    padding: 4px 0 0 0;
    width: 100%;
}

.accordion-collapse[b-fgesmmdxhj] {
    width: 100%;
}

.accordion-body .itemDiv[b-fgesmmdxhj] {
    padding: 4px 15px;
    margin: 2px 0;
    border-radius: 4px;
    background: #ffffff;
    border-left: 3px solid transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.3s ease;
    width: 100%;
}

    .accordion-body .itemDiv:hover[b-fgesmmdxhj] {
        background-color: #f8f9fa;
        border-left-color: #163E9F;
    }

.accordion-collapse[b-fgesmmdxhj] {
    transition: all 0.3s ease-in-out;
}



/* List Items   */ 
.itemDiv[b-fgesmmdxhj] {
    padding: 4px 15px;
    margin: 2px 0;
    border-radius: 4px;
    background: #ffffff;
    border-left: 3px solid transparent;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.2s ease;
}

.itemDiv span[b-fgesmmdxhj] {
    margin-left: 10px;
}

/* Buttons & Interactive Elements */
.collapse-button[b-fgesmmdxhj] {
    position: fixed;
    width: 20px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 0 4px 4px 0;
    box-shadow: 2px 0 4px rgba(0,0,0,0.1);
    z-index: 98;
    transition: all 0.3s ease;
}

.semi-circle[b-fgesmmdxhj] {
    height: 4.8rem !important;
    top: calc(50% - 7px);
    background-color: #009DC9;
    color: white;
    padding: 0 4px;
    border-radius: 0 15px 15px 0;
    border: 1px solid transparent;
    transition: all 0.2s ease;
}

.semi-circle:hover[b-fgesmmdxhj] {
    background-color: #0088b0;
    width: 25px;
    box-shadow: 2px 0 6px rgba(0,0,0,0.15);
}

.downloadButton[b-fgesmmdxhj],
.CopyButton[b-fgesmmdxhj] {
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.itemDiv:hover[b-fgesmmdxhj] {
    background-color: #f8f9fa;
    border-left-color: #163E9F;
}

.itemDiv:hover .downloadButton[b-fgesmmdxhj],
.itemDiv:hover .CopyButton[b-fgesmmdxhj] {
    opacity: 1;
}

.collapse-button:hover[b-fgesmmdxhj] {
    background-color: #0088b0;
}

/* Utility Classes */
.text-info[b-fgesmmdxhj] {
    color: #000061 !important;
}

/* Viewer Action Button */
.viewer-action-button[b-fgesmmdxhj] {
    position: absolute;
    left: 30px;
    top: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #49494a;
    background: none;
    padding: 0 5px;
    /*I want round buttons*/
    border-radius: 50%;
    border: 1px solid transparent;
}

.viewer-action-button:hover[b-fgesmmdxhj] {
    background-color: #000061;
    color: white;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Add styles for the archive items to look more like report items */
.accordion-item[b-fgesmmdxhj] {
    border: none;
    background: none;
    width: 100%;
    margin: 4px 0;
}

.accordion[b-fgesmmdxhj] {
    padding: 1px 0 !important;
    width: 100%;
}

.accordion-head[b-fgesmmdxhj] {
    font-family: "Soehne", sans-serif;
}


/* Child Attachment Types */
.child-attachment-type[b-fgesmmdxhj] {
    padding-left: 15px;
    border-left: 2px solid #e0e0e0;
    margin: 5px 0 5px 15px;
}

.child-attachment-type .itemDiv[b-fgesmmdxhj] {
    background: #fafafa;
}

.child-attachment-type .itemDiv:hover[b-fgesmmdxhj] {
    background-color: #f0f0f0;
    border-left-color: #009DC9;
}

.child-attachment-type .opaccordion-button[b-fgesmmdxhj] {
    background: #fafafa;
    font-size: 0.8rem !important;
}

/* Add a light shadow to the selected attachment type */
.opcard.selected[b-fgesmmdxhj] {
    box-shadow: 0 0 10px rgba(0, 0, 97, 0.2);
    border-color: #000061;
}

@keyframes slideIn-b-fgesmmdxhj {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}

@keyframes slideOut-b-fgesmmdxhj {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-100%);
    }
}

a[b-fgesmmdxhj] {
    text-decoration: none;
    display: block;
    width: 100%;
    cursor: pointer;
}

.loading-container[b-fgesmmdxhj] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 80vh;
    width: 100%;
}

.loading-spinner[b-fgesmmdxhj] {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #000061;
    border-radius: 50%;
    animation: spinner-b-fgesmmdxhj 1.5s linear infinite;
    margin-bottom: 15px;
}

@keyframes spinner-b-fgesmmdxhj {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.file-viewer-placeholder[b-fgesmmdxhj] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    background-color: #f8f9fa;
    color: #6c757d;
    border-radius: 8px;
    border: 1px dashed #dee2e6;
}

.placeholder-content[b-fgesmmdxhj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 2rem;
}

.placeholder-content p[b-fgesmmdxhj] {
    margin-top: 1rem;
    font-size: 1.1rem;
}

.archive-count[b-fgesmmdxhj] {
    color: #6c757d;
    font-size: 0.85rem;
    margin-left: 0.5rem;
    background-color: #e9ecef;
    padding: 0.2rem 0.2rem;
    border-radius: 1rem;
}

/* Mobile optimizations */
@media (max-width: 768px) {
    .expanded-menu[b-fgesmmdxhj] {
        width: 100%;
        max-width: 100%;
        position: fixed;
        top: 60px;
        left: 0;
        z-index: 99;
        height: calc(100vh - 60px);
    }

    .expanded-menu[b-fgesmmdxhj] {
        width: 100% !important;
        max-width: 100% !important;
        position: fixed;
        top: 60px;
        left: 0;
        z-index: 99;
        height: calc(100vh - 60px);
        transition: transform 0.3s ease-in-out;
        padding: 10px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    }


    .col-md-10[b-fgesmmdxhj] {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .col-md-10[b-fgesmmdxhj] {
        width: 100%;
        flex: 0 0 100%;
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
        margin-left: 0 !important;
    }

    .collapse-button[b-fgesmmdxhj] {
        z-index: 100;
        width: 40px !important;
        height: 80px !important;
        left: 10px !important;
        background-color: rgba(0, 157, 201, 0.9) !important;
        box-shadow: 0 2px 8px rgba(0,0,0,0.2);
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0 !important;
    }

    .menu-collapsed .expanded-menu[b-fgesmmdxhj] {
        transform: translateX(-100%);
    }
   
    
    .menu-collapsed .collapse-button[b-fgesmmdxhj] {
        left: 10px !important;
    }
    
    .file-viewer-placeholder[b-fgesmmdxhj] {
        padding: 1rem;
    }



    .menu-collapsed .collapse-button[b-fgesmmdxhj] {
        left: 30px !important;
    }

    .menu-expanded .collapse-button[b-fgesmmdxhj] {
        left: -5px !important;
    }
    
    .file-viewer-placeholder[b-fgesmmdxhj] {
        padding: 1rem;
    }
    
    /* Increase touch target sizes for mobile */
    .reportHeaderGroup[b-fgesmmdxhj] {
        padding: 12px 15px;
        margin: 6px 0;
    }
    
    .itemDiv[b-fgesmmdxhj] {
        padding: 12px 15px;
        margin: 4px 0;
    }
    
    .actions[b-fgesmmdxhj] {
        display: flex;
        gap: 10px;
    }
    
    .view-html-button[b-fgesmmdxhj],
    .view-pdf-button[b-fgesmmdxhj] {
        padding: 8px;
        margin-left: 5px;
        opacity: 0.9;
    }
    
    /* Collapsible sidebar with overlay effect */
    .menu-overlay[b-fgesmmdxhj] {
        display: none;
    }
    
    .menu-expanded .menu-overlay[b-fgesmmdxhj] {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(0,0,0,0.4);
        z-index: 98;
        animation: fadeIn-b-fgesmmdxhj 0.3s forwards;
    }
    
    @keyframes fadeIn-b-fgesmmdxhj {
        from { opacity: 0; }
        to { opacity: 1; }
    }
    
    /* Mobile-friendly action buttons */
    .mobile-action-container[b-fgesmmdxhj] {
        position: fixed;
        bottom: 20px;
        right: 20px;
        display: flex;
        flex-direction: column;
        gap: 10px;
        z-index: 95;
    }
    
    .mobile-action-button[b-fgesmmdxhj] {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background-color: #009DC9;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        box-shadow: 0 3px 6px rgba(0,0,0,0.2);
        transition: all 0.2s ease;
        border: none;
    }
    
    .mobile-action-button:hover[b-fgesmmdxhj],
    .mobile-action-button:focus[b-fgesmmdxhj] {
        background-color: #0088b0;
        transform: scale(1.05);
    }
    
    /* Improved toast positioning for mobile */
    [b-fgesmmdxhj] .toast-container {
        bottom: 80px !important;
        right: 20px !important;
    }
}
/* /Components/Pages/General/Redirects.razor.rz.scp.css */
.loading-container[b-7cy6za7rk9] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 80vh;
    width: 100%;
}

.loading-spinner[b-7cy6za7rk9] {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #000061;
    border-radius: 50%;
    animation: spinner-b-7cy6za7rk9 1.5s linear infinite;
    margin-bottom: 15px;
}

@keyframes spinner-b-7cy6za7rk9 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/* /Components/Pages/General/ReportBuilder/Components/DataPanel/ReportDataPanel.razor.rz.scp.css */
/* ── Panel shell ── */
.report-data-panel[b-qjalh9kx5n] {
    flex: 1;
    min-width: 320px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid #e5e7eb;
    background: #f9fafb;
    align-self: stretch;
}

/* ── Header ── */
.dp-header[b-qjalh9kx5n] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 12px;
    background: white;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.dp-title[b-qjalh9kx5n] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #374151;
    white-space: nowrap;
}

/* ── Save button ── */
.dp-save-btn[b-qjalh9kx5n] {
    padding: 5px 12px;
    background: #000061;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    transition: background 0.12s;
}

    .dp-save-btn:hover:not(:disabled)[b-qjalh9kx5n] { background: #0000a0; }
    .dp-save-btn:disabled[b-qjalh9kx5n]             { opacity: 0.45; cursor: not-allowed; }

    .dp-save-btn.dp-save-pending[b-qjalh9kx5n]               { background: #ea580c; }
    .dp-save-btn.dp-save-pending:hover:not(:disabled)[b-qjalh9kx5n] { background: #c2410c; }

.dp-pending-badge[b-qjalh9kx5n] {
    background: white;
    color: #ea580c;
    border-radius: 10px;
    padding: 1px 7px;
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.5;
}

/* ── Notice bar ── */
.dp-notice[b-qjalh9kx5n] {
    padding: 6px 12px;
    font-size: 0.75rem;
    font-weight: 500;
    flex-shrink: 0;
}

.dp-notice-success[b-qjalh9kx5n] { background: #f0fdf4; color: #15803d; border-bottom: 1px solid #bbf7d0; }
.dp-notice-error[b-qjalh9kx5n]   { background: #fef2f2; color: #b91c1c; border-bottom: 1px solid #fecaca; }

/* ── Scrollable body ── */
.dp-body[b-qjalh9kx5n] {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* ── Placeholder ── */
.dp-placeholder[b-qjalh9kx5n] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex: 1;
    min-height: 160px;
    color: #9ca3af;
    text-align: center;
}

.dp-placeholder-icon[b-qjalh9kx5n] {
    font-size: 2rem;
    opacity: 0.35;
}

.dp-placeholder-text[b-qjalh9kx5n] {
    font-size: 0.8rem;
    line-height: 1.5;
    max-width: 200px;
}

/* ── Info message (no-entry components) ── */
.dp-info-msg[b-qjalh9kx5n] {
    background: #f3f4f6;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 12px 14px;
    font-size: 0.78rem;
    color: #6b7280;
    font-style: italic;
    line-height: 1.5;
}

/* ── Paste zone ── */
.dp-paste-zone[b-qjalh9kx5n] {
    background: #f9fafb;
    border: 1px dashed #d1d5db;
    border-radius: 6px;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.dp-paste-label[b-qjalh9kx5n] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #374151;
}

.dp-paste-hint[b-qjalh9kx5n] {
    font-weight: 400;
    color: #9ca3af;
}

.dp-paste-textarea[b-qjalh9kx5n] {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 5px 7px;
    font-size: 0.72rem;
    font-family: monospace;
    color: #374151;
    resize: vertical;
    background: white;
}

    .dp-paste-textarea:focus[b-qjalh9kx5n] {
        outline: none;
        border-color: #000061;
    }

.dp-paste-status[b-qjalh9kx5n] {
    font-size: 0.7rem;
    border-radius: 3px;
    padding: 3px 6px;
}

.dp-paste-ok[b-qjalh9kx5n]   { background: #f0fdf4; color: #15803d; }
.dp-paste-warn[b-qjalh9kx5n] { background: #fef2f2; color: #b91c1c; }

.dp-paste-actions[b-qjalh9kx5n] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.dp-apply-btn[b-qjalh9kx5n] {
    padding: 4px 10px;
    background: #000061;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 0.72rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

    .dp-apply-btn:hover:not(:disabled)[b-qjalh9kx5n] { background: #0000a0; }
    .dp-apply-btn:disabled[b-qjalh9kx5n]             { opacity: 0.4; cursor: not-allowed; }

.dp-paste-summary[b-qjalh9kx5n] {
    font-size: 0.68rem;
    color: #15803d;
}

/* ── Inline table ── */
.dp-inline-table-wrap[b-qjalh9kx5n] {
    overflow-x: auto;
}

.dp-inline-table[b-qjalh9kx5n] {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

    /* Inherit data-table border/padding from the shared stylesheet;
       override only what differs in the panel context */
    .dp-inline-table th[b-qjalh9kx5n],
    .dp-inline-table td[b-qjalh9kx5n] {
        border: 1px solid #e5e7eb;
        padding: 4px 8px;
        vertical-align: middle;
        overflow: hidden;
    }

/* Cells that contain an input get zero padding so the input fills the cell */
.dp-inline-table td.dp-td-editable[b-qjalh9kx5n] {
    padding: 0;
}

/* Header cells and non-editable data cells are dimmed — datapoint cells stay full opacity */
.dp-inline-table th[b-qjalh9kx5n],
.dp-inline-table td:not(.dp-td-editable)[b-qjalh9kx5n] {
    opacity: 0.4;
}

/* Read-only cells with no resolved value yet */
.dp-inline-table td.dp-td-no-data[b-qjalh9kx5n] {
    color: #9ca3af;
    font-style: italic;
}


/* The inline input inside a table cell */
.dp-cell-inline-input[b-qjalh9kx5n] {
    width: 100%;
    height: 100%;
    min-height: 28px;
    border: none;
    background: transparent;
    font: inherit;
    color: inherit;
    padding: 4px 8px;
    box-sizing: border-box;
    display: block;
    outline: none;
}

    .dp-cell-inline-input:focus[b-qjalh9kx5n] {
        background: rgba(255, 255, 255, 0.92);
        outline: 2px solid #000061;
        outline-offset: -2px;
        border-radius: 1px;
    }

    /* Orange tint + border when value differs from loaded (pending) */
    .dp-cell-inline-input.dp-cell-pending[b-qjalh9kx5n] {
        background: rgba(249, 115, 22, 0.07);
    }

    .dp-cell-inline-input.dp-cell-pending:focus[b-qjalh9kx5n] {
        background: rgba(249, 115, 22, 0.12);
        outline-color: #ea580c;
    }

/* ── Stack children list ── */
.dp-stack-children[b-qjalh9kx5n] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.dp-stack-child-block[b-qjalh9kx5n] {
    padding: 10px 0;
    border-bottom: 1px dashed #e5e7eb;
}

    .dp-stack-child-block:last-child[b-qjalh9kx5n] {
        border-bottom: none;
    }

/* ── TextBlock inline editor ── */
.dp-textblock-container[b-qjalh9kx5n] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.dp-label[b-qjalh9kx5n] {
    font-size: 0.68rem;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    /* don't inherit the textblock's font size/color */
    font-size: 0.68rem !important;
    color: #6b7280!important;
    font-weight: 600 !important;
    font-style: normal !important;
    text-decoration: none !important;
}

.dp-textblock-input[b-qjalh9kx5n] {
    width: 100%;
    min-height: 80px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 8px;
    box-sizing: border-box;
    /* Inherits font-size, color, font-weight etc. from .dp-textblock-container */
    font: inherit;
    color: inherit;
    background: white;
    resize: vertical;
    line-height: 1.5;
    transition: border-color 0.12s;
}

    .dp-textblock-input:focus[b-qjalh9kx5n] {
        outline: none;
        border-color: #000061;
        box-shadow: 0 0 0 2px rgba(0,0,97,.08);
    }

    .dp-textblock-input.dp-cell-pending[b-qjalh9kx5n] {
        border-color: #ea580c;
        background: rgba(249, 115, 22, 0.05);
    }

/* ── Graph datapoint series ── */
.dp-graph-hint[b-qjalh9kx5n] {
    font-size: 0.75rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}

.dp-graph-series-row[b-qjalh9kx5n] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    cursor: pointer;
    background: #fafafa;
    user-select: none;
}
.dp-graph-series-row:hover[b-qjalh9kx5n] { border-color: #9ca3af; background: #f3f4f6; }
.dp-graph-series-expanded[b-qjalh9kx5n]  { border-color: #000061; background: #eff6ff; border-radius: 4px 4px 0 0; }

.dp-graph-series-label[b-qjalh9kx5n] { flex: 1; font-size: 0.85rem; font-weight: 500; color: #374151; }

.dp-series-status[b-qjalh9kx5n] {
    font-size: 0.7rem;
    padding: 2px 7px;
    border-radius: 10px;
    white-space: nowrap;
}
.dp-status-ok[b-qjalh9kx5n]   { background: #dcfce7; color: #166534; }
.dp-status-none[b-qjalh9kx5n] { background: #f3f4f6; color: #9ca3af; }

.dp-graph-paste-panel[b-qjalh9kx5n] {
    padding: 10px 12px 12px;
    border: 1px solid #000061;
    border-top: none;
    border-radius: 0 0 4px 4px;
    background: white;
}

/* ── List row remove button ── */
.dp-list-remove-row[b-qjalh9kx5n] {
    width: 22px;
    height: 22px;
    border: 1px solid #e5e7eb;
    border-radius: 3px;
    background: white;
    font-size: 0.85rem;
    color: #9ca3af;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
    transition: background 0.1s, border-color 0.1s, color 0.1s;
}

    .dp-list-remove-row:hover[b-qjalh9kx5n] { background: #fef2f2; border-color: #fca5a5; color: #b91c1c; }
/* /Components/Pages/General/ReportBuilder/Components/DatapointManager.razor.rz.scp.css */
.dp-manager-empty[b-02vdgytakr] {
    font-size: 0.8rem;
    color: #9ca3af;
    font-style: italic;
    margin: 4px 0;
}

.dp-manager-list[b-02vdgytakr] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    max-height: 320px;
    overflow-y: auto;
}

.dp-manager-row[b-02vdgytakr] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 6px;
    border-radius: 4px;
    background: #f9fafb;
}

    .dp-manager-row:hover[b-02vdgytakr] {
        background: #f3f4f6;
    }

/* ── Type badges ── */
.dp-manager-type-badge[b-02vdgytakr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 3px;
    font-size: 0.65rem;
    font-weight: 700;
    flex-shrink: 0;
    line-height: 1;
}

.dp-badge-numeric[b-02vdgytakr] {
    background: #d1fae5;
    color: #065f46;
}

.dp-badge-text[b-02vdgytakr] {
    background: #f3f4f6;
    color: #6b7280;
}

.dp-manager-name[b-02vdgytakr] {
    flex: 1;
    font-size: 0.8rem;
    color: #374151;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dp-manager-format-hint[b-02vdgytakr] {
    font-size: 0.7rem;
    color: #9ca3af;
    white-space: nowrap;
    flex-shrink: 0;
}

.dp-manager-remove[b-02vdgytakr] {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.9rem;
    color: #9ca3af;
    padding: 0 2px;
    line-height: 1;
    flex-shrink: 0;
}

    .dp-manager-remove:hover[b-02vdgytakr] {
        color: #b91c1c;
    }
/* /Components/Pages/General/ReportBuilder/Components/DatapointPicker.razor.rz.scp.css */
.dp-picker-wrap[b-qaelxhotvz] {
    position: relative;
    width: 100%;
}

.dp-picker-input[b-qaelxhotvz] {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: white;
    box-sizing: border-box;
}

    .dp-picker-input:focus[b-qaelxhotvz] {
        outline: none;
        border-color: #000061;
    }

.dp-dropdown[b-qaelxhotvz] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    z-index: 1000;
    max-height: 200px;
    overflow-y: auto;
}

.dp-option[b-qaelxhotvz] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    font-size: 0.8rem;
    color: #374151;
    cursor: pointer;
}

    .dp-option:hover[b-qaelxhotvz],
    .dp-option-selected[b-qaelxhotvz] {
        background: #f3f4f6;
    }

.dp-option-create[b-qaelxhotvz] {
    color: #000061;
    font-style: italic;
    border-top: 1px solid #f3f4f6;
}

    .dp-option-create:hover[b-qaelxhotvz] {
        background: #eff6ff;
    }

/* ── Type badges in dropdown ── */
.dp-type-badge[b-qaelxhotvz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 3px;
    font-size: 0.65rem;
    font-weight: 700;
    flex-shrink: 0;
    line-height: 1;
}

.dp-badge-numeric[b-qaelxhotvz] {
    background: #d1fae5;
    color: #065f46;
}

.dp-badge-text[b-qaelxhotvz] {
    background: #f3f4f6;
    color: #6b7280;
}

/* ── Inline creation form ── */
.dp-create-form[b-qaelxhotvz] {
    margin-top: 4px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background: #f9fafb;
    padding: 10px 12px;
}

.dp-create-name[b-qaelxhotvz] {
    font-size: 0.78rem;
    color: #374151;
    margin: 0 0 8px;
}

.dp-create-type-row[b-qaelxhotvz] {
    display: flex;
    gap: 4px;
    margin-bottom: 8px;
}

.dp-type-btn[b-qaelxhotvz] {
    padding: 3px 10px;
    font-size: 0.78rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: white;
    color: #374151;
    cursor: pointer;
}

    .dp-type-btn:hover[b-qaelxhotvz] {
        background: #f3f4f6;
    }

.dp-type-btn-active[b-qaelxhotvz] {
    background: #000061;
    color: white;
    border-color: #000061;
}

    .dp-type-btn-active:hover[b-qaelxhotvz] {
        background: #000061;
    }

.dp-create-num-opts[b-qaelxhotvz] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 8px;
}

.dp-create-label[b-qaelxhotvz] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.78rem;
    color: #374151;
}

.dp-create-check-label[b-qaelxhotvz] {
    cursor: pointer;
}

.dp-create-num-input[b-qaelxhotvz] {
    width: 60px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 2px 6px;
    font-size: 0.78rem;
    color: #374151;
}

.dp-create-actions[b-qaelxhotvz] {
    display: flex;
    gap: 6px;
}

.dp-create-confirm[b-qaelxhotvz] {
    padding: 4px 10px;
    font-size: 0.78rem;
    background: #000061;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

    .dp-create-confirm:hover[b-qaelxhotvz] {
        background: #000080;
    }

.dp-create-cancel[b-qaelxhotvz] {
    padding: 4px 10px;
    font-size: 0.78rem;
    background: white;
    color: #6b7280;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    cursor: pointer;
}

    .dp-create-cancel:hover[b-qaelxhotvz] {
        background: #f3f4f6;
    }
/* /Components/Pages/General/ReportBuilder/Components/Footer/ReportFooterBlock.razor.rz.scp.css */
.report-component-card[b-cnzn3yrvxp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-cnzn3yrvxp] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.footer-icon[b-cnzn3yrvxp] { background: #009DC9; }

.component-label[b-cnzn3yrvxp] { font-size: 0.8rem; font-weight: 500; }

.report-footer[b-cnzn3yrvxp] {
    border-top: 2px solid #009DC9;
    display: flex;
    flex-direction: row;
    color: #000061;
    align-items: center;
    padding: 8px 0 0 0;
}

.footer-contact[b-cnzn3yrvxp] {
    text-align: right;
    width: 28%;
}

.footer-email[b-cnzn3yrvxp] {
    font-size: 0.8em;
}

.footer-divider[b-cnzn3yrvxp] {
    background-color: #000061;
    height: 60px;
    width: 1px;
    margin: 0 2%;
}

.footer-disclaimer[b-cnzn3yrvxp] {
    width: 72%;
    font-size: 0.6em;
    margin-right: 1%;
}
/* /Components/Pages/General/ReportBuilder/Components/Footer/ReportFooterBlockEditModal.razor.rz.scp.css */
.edit-modal-body[b-ilz0y6tjls] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
}

.edit-section-label[b-ilz0y6tjls] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #6b7280;
    margin: 4px 0;
}

.edit-row[b-ilz0y6tjls] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.edit-label[b-ilz0y6tjls] {
    width: 110px;
    font-size: 0.8rem;
    color: #374151;
    flex-shrink: 0;
}

.edit-input[b-ilz0y6tjls] {
    flex: 1;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
}

.edit-input:focus[b-ilz0y6tjls] {
    outline: none;
    border-color: #000061;
    box-shadow: 0 0 0 2px rgba(0,0,97,.1);
}

.visibility-options[b-ilz0y6tjls] {
    display: flex;
    gap: 14px;
    flex-wrap: wrap;
    flex: 1;
}

.visibility-option[b-ilz0y6tjls] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.8rem;
    color: #374151;
    cursor: pointer;
}

.template-option[b-ilz0y6tjls] {
    border: 2px solid #000061;
    border-radius: 6px;
    padding: 10px 12px;
}

.template-option-top[b-ilz0y6tjls] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.template-name[b-ilz0y6tjls] { font-size: 0.85rem; font-weight: 600; color: #111827; }

.template-file[b-ilz0y6tjls] {
    font-size: 0.7rem;
    color: #6b7280;
    font-family: monospace;
    background: #f3f4f6;
    padding: 1px 6px;
    border-radius: 3px;
}

.template-preview[b-ilz0y6tjls] {
    width: 100%;
    height: 110px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    background: white;
    padding: 8px;
    box-sizing: border-box;
}

.preview-scale-wrapper[b-ilz0y6tjls] {
    transform: scale(0.5);
    transform-origin: top left;
    width: 200%;
    pointer-events: none;
}

.edit-coming-soon[b-ilz0y6tjls] {
    font-size: 0.75rem;
    color: #9ca3af;
    font-style: italic;
    margin-top: 4px;
}
/* /Components/Pages/General/ReportBuilder/Components/Graph/ReportGraph.razor.rz.scp.css */
.report-component-card[b-p4h13nn7ai] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-p4h13nn7ai] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.graph-icon[b-p4h13nn7ai] { background: #8b5cf6; }

.component-label[b-p4h13nn7ai] { font-size: 0.8rem; font-weight: 500; }

.report-graph-live[b-p4h13nn7ai] {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.report-graph-empty[b-p4h13nn7ai] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    gap: 8px;
}

.graph-svg[b-p4h13nn7ai] {
    width: 100%;
    max-width: 300px;
    height: 80px;
    opacity: 0.5;
}

.empty-placeholder[b-p4h13nn7ai] {
    color: #9ca3af;
    font-style: italic;
    font-size: 0.8rem;
    margin: 0;
    text-align: center;
}
/* /Components/Pages/General/ReportBuilder/Components/Graph/ReportGraphEditModal.razor.rz.scp.css */
.edit-modal-body[b-rc57t8esnc] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 0;
}

.edit-section-label[b-rc57t8esnc] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 0;
}

.edit-row[b-rc57t8esnc] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.edit-label[b-rc57t8esnc] {
    width: 120px;
    font-size: 0.8rem;
    color: #374151;
    flex-shrink: 0;
}

.edit-input[b-rc57t8esnc] {
    flex: 1;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}

.edit-input:focus[b-rc57t8esnc] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.size-input[b-rc57t8esnc] { max-width: 80px; flex: none; }

.edit-divider[b-rc57t8esnc] { border: none; border-top: 1px solid #e5e7eb; margin: 12px 0 8px; }

/* ── Tab bar ── */
.graph-tab-bar[b-rc57t8esnc] {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e5e7eb;
    margin-top: 14px;
    margin-bottom: 10px;
}

.graph-tab-btn[b-rc57t8esnc] {
    padding: 7px 18px;
    font-size: 0.82rem;
    border: none;
    border-bottom: 2px solid transparent;
    background: none;
    color: #6b7280;
    cursor: pointer;
    margin-bottom: -2px;
    border-radius: 4px 4px 0 0;
    transition: color 0.1s, border-color 0.1s;
}

.graph-tab-btn:hover[b-rc57t8esnc] { color: #374151; background: #f9fafb; }
.graph-tab-active[b-rc57t8esnc] { color: #000061; border-bottom-color: #000061; font-weight: 600; }

/* ── Series list ── */
.series-list[b-rc57t8esnc] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 6px;
}

.series-row[b-rc57t8esnc] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8rem;
    color: #374151;
}

.series-type-badge[b-rc57t8esnc] {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    color: white;
    font-size: 0.65rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.series-badge-dp[b-rc57t8esnc]    { background: #059669; }
.series-badge-route[b-rc57t8esnc] { background: #2563eb; }

.series-color-picker[b-rc57t8esnc] {
    width: 26px;
    height: 22px;
    padding: 0;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    cursor: pointer;
    flex-shrink: 0;
    background: white;
}
.series-color-picker[b-rc57t8esnc]::-webkit-color-swatch-wrapper { padding: 2px; }
.series-color-picker[b-rc57t8esnc]::-webkit-color-swatch { border: none; border-radius: 2px; }

.series-info[b-rc57t8esnc] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.series-label-input[b-rc57t8esnc] {
    width: 100%;
    border: 1px solid transparent;
    border-radius: 3px;
    padding: 3px 6px;
    font-size: 0.8rem;
    color: #374151;
    background: transparent;
    box-sizing: border-box;
}
.series-label-input:hover[b-rc57t8esnc]  { border-color: #e5e7eb; background: white; }
.series-label-input:focus[b-rc57t8esnc]  { outline: none; border-color: #000061; background: white; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.series-route-path[b-rc57t8esnc] {
    font-size: 0.68rem;
    color: #9ca3af;
    padding: 0 6px;
}

.series-no-data[b-rc57t8esnc] {
    font-size: 0.68rem;
    color: #f59e0b;
    padding: 0 6px;
    font-style: italic;
}

/* ── Per-series period selector ── */
.series-period-row[b-rc57t8esnc] {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 2px 4px;
    flex-wrap: wrap;
}

.series-period-btn[b-rc57t8esnc],
.series-period-type[b-rc57t8esnc] {
    padding: 2px 8px;
    font-size: 0.7rem;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    background: #f9fafb;
    color: #6b7280;
    cursor: pointer;
    line-height: 1.4;
}
.series-period-btn:hover[b-rc57t8esnc],
.series-period-type:hover[b-rc57t8esnc] { border-color: #9ca3af; color: #374151; }
.series-period-active[b-rc57t8esnc] { background: #000061; color: white; border-color: #000061; }

.series-period-offset[b-rc57t8esnc] {
    width: 48px;
    border: 1px solid #d1d5db;
    border-radius: 3px;
    padding: 2px 4px;
    font-size: 0.7rem;
    color: #374151;
    background: #f9fafb;
    text-align: center;
}
.series-period-offset:focus[b-rc57t8esnc] { outline: none; border-color: #000061; }

.series-period-hint[b-rc57t8esnc] {
    font-size: 0.68rem;
    color: #9ca3af;
    margin-left: 2px;
}

.series-remove-btn[b-rc57t8esnc] {
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    font-size: 0.75rem;
    padding: 0 2px;
    line-height: 1;
    flex-shrink: 0;
}
.series-remove-btn:hover[b-rc57t8esnc] { color: #b91c1c; }

/* ── Add series type toggle / buttons ── */
.type-toggle[b-rc57t8esnc] { display: flex; gap: 6px; margin-top: 6px; }

.type-btn[b-rc57t8esnc] {
    padding: 5px 14px;
    font-size: 0.8rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
}
.type-btn:hover[b-rc57t8esnc] { border-color: #9ca3af; }
.type-btn-active[b-rc57t8esnc] { background: #000061; color: white; border-color: #000061; }

/* ── Division buttons ── */
.division-row[b-rc57t8esnc] { display: flex; gap: 6px; flex-wrap: wrap; }

.div-btn[b-rc57t8esnc] {
    padding: 4px 12px;
    font-size: 0.78rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
}
.div-btn:hover[b-rc57t8esnc] { border-color: #9ca3af; }
.div-btn-active[b-rc57t8esnc] { background: #000061; color: white; border-color: #000061; }

/* ── Route search ── */
.search-wrapper[b-rc57t8esnc] { position: relative; }

.route-dropdown[b-rc57t8esnc] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
    max-height: 220px;
    overflow-y: auto;
    z-index: 100;
    margin-top: 2px;
}

.route-option[b-rc57t8esnc] {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 7px 10px;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
}
.route-option:last-child[b-rc57t8esnc] { border-bottom: none; }
.route-option:hover[b-rc57t8esnc] { background: #eff6ff; }

.route-code[b-rc57t8esnc] { font-size: 0.7rem; font-weight: 600; color: #000061; }
.route-desc[b-rc57t8esnc] { font-size: 0.8rem; color: #374151; }

/* ── Data tab: datapoint series list ── */
.dp-series-row[b-rc57t8esnc] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    cursor: pointer;
    margin-top: 4px;
    background: #fafafa;
    user-select: none;
}
.dp-series-row:hover[b-rc57t8esnc] { border-color: #9ca3af; background: #f3f4f6; }
.dp-series-expanded[b-rc57t8esnc] { border-color: #000061; background: #eff6ff; border-radius: 4px 4px 0 0; }

.dp-series-label[b-rc57t8esnc]  { flex: 1; font-size: 0.85rem; font-weight: 500; color: #374151; }

.dp-series-status[b-rc57t8esnc] {
    font-size: 0.7rem;
    padding: 2px 7px;
    border-radius: 10px;
    white-space: nowrap;
}
.dp-status-ok[b-rc57t8esnc]   { background: #dcfce7; color: #166534; }
.dp-status-none[b-rc57t8esnc] { background: #f3f4f6; color: #9ca3af; }

.dp-chevron[b-rc57t8esnc] { font-size: 0.55rem; color: #9ca3af; }

/* ── Data paste panel ── */
.dp-paste-panel[b-rc57t8esnc] {
    padding: 10px 12px 12px;
    border: 1px solid #000061;
    border-top: none;
    border-radius: 0 0 4px 4px;
    background: white;
    margin-bottom: 4px;
}

.paste-textarea[b-rc57t8esnc] {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.78rem;
    font-family: monospace;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
    resize: vertical;
}
.paste-textarea:focus[b-rc57t8esnc] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

/* ── Preview ── */
.graph-preview-wrap[b-rc57t8esnc] {
    height: 300px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    overflow: hidden;
    background: white;
}

/* ── Date format builder (X-axis) ── */
.date-parts-row[b-rc57t8esnc] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    min-height: 28px;
    padding: 4px 0;
    align-items: center;
}

.date-parts-empty[b-rc57t8esnc] {
    font-size: 0.75rem;
    color: #9ca3af;
    font-style: italic;
}

.date-part-chip[b-rc57t8esnc] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 3px 7px;
    border-radius: 4px;
    border: 1px solid transparent;
    font-size: 0.78rem;
    font-family: monospace;
    white-space: nowrap;
}

.date-part-text[b-rc57t8esnc] { line-height: 1.2; }

.date-part-remove[b-rc57t8esnc] {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0 1px;
    font-size: 0.75rem;
    line-height: 1;
    opacity: 0.5;
    color: inherit;
}
.date-part-remove:hover[b-rc57t8esnc] { opacity: 1; }

.date-part-day[b-rc57t8esnc]     { background: #dbeafe; color: #1e40af; border-color: #bfdbfe; }
.date-part-weekday[b-rc57t8esnc] { background: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }
.date-part-month[b-rc57t8esnc]   { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.date-part-year[b-rc57t8esnc]    { background: #f3f4f6; color: #374151; border-color: #e5e7eb; }
.date-part-quarter[b-rc57t8esnc] { background: #fef9c3; color: #854d0e; border-color: #fef08a; }
.date-part-week[b-rc57t8esnc]    { background: #ffedd5; color: #9a3412; border-color: #fed7aa; }
.date-part-sep[b-rc57t8esnc]     { background: #ffffff; color: #6b7280; border-color: #d1d5db; }

.date-preview[b-rc57t8esnc] {
    font-size: 0.78rem;
    color: #374151;
    margin: 2px 0 0;
}

.date-picker-row[b-rc57t8esnc] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
}

.date-picker-btn[b-rc57t8esnc] {
    padding: 4px 10px;
    font-size: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
}
.date-picker-btn:hover[b-rc57t8esnc] { border-color: #9ca3af; }
.date-picker-btn.active[b-rc57t8esnc] { background: #000061; color: white; border-color: #000061; }

.date-options-row[b-rc57t8esnc] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 4px 0;
    align-items: center;
    margin-top: 4px;
}

.date-opt-btn[b-rc57t8esnc] {
    padding: 4px 12px;
    font-size: 0.78rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    cursor: pointer;
    font-family: monospace;
}
.date-opt-btn:hover[b-rc57t8esnc] { border-color: #000061; color: #000061; background: #eff6ff; }
/* /Components/Pages/General/ReportBuilder/Components/Header/ReportHeaderBlock.razor.rz.scp.css */
.report-component-card[b-spgoms9xmq] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-spgoms9xmq] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.header-icon[b-spgoms9xmq] { background: #000061; }

.component-label[b-spgoms9xmq] { font-size: 0.8rem; font-weight: 500; }
/* /Components/Pages/General/ReportBuilder/Components/Header/ReportHeaderBlockEditModal.razor.rz.scp.css */
.edit-modal-body[b-3t3eva61fx] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
}

.edit-section-label[b-3t3eva61fx] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 4px 0;
}

.edit-row[b-3t3eva61fx] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.edit-label[b-3t3eva61fx] {
    width: 70px;
    font-size: 0.8rem;
    color: #374151;
    flex-shrink: 0;
}

.edit-input[b-3t3eva61fx] {
    flex: 1;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
}

.edit-input:focus[b-3t3eva61fx] {
    outline: none;
    border-color: #000061;
    box-shadow: 0 0 0 2px rgba(0,0,97,.1);
}

.template-option[b-3t3eva61fx] {
    border: 2px solid #000061;
    border-radius: 6px;
    padding: 10px 12px;
}

.template-option-top[b-3t3eva61fx] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.template-name[b-3t3eva61fx] { font-size: 0.85rem; font-weight: 600; color: #111827; }

.template-file[b-3t3eva61fx] {
    font-size: 0.7rem;
    color: #6b7280;
    font-family: monospace;
    background: #f3f4f6;
    padding: 1px 6px;
    border-radius: 3px;
}

.template-preview[b-3t3eva61fx] {
    width: 100%;
    height: 110px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    background: white;
}

.preview-scale-wrapper[b-3t3eva61fx] {
    transform: scale(0.38);
    transform-origin: top left;
    width: 263%;
    pointer-events: none;
}

.edit-coming-soon[b-3t3eva61fx] {
    font-size: 0.75rem;
    color: #9ca3af;
    font-style: italic;
    margin-top: 4px;
}
/* /Components/Pages/General/ReportBuilder/Components/Image/ReportImage.razor.rz.scp.css */
.report-component-card[b-vyzvwi6irb] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-vyzvwi6irb] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.image-icon[b-vyzvwi6irb] {
    background: #f5e150;
}

.component-label[b-vyzvwi6irb] {
    font-size: 0.8rem;
    font-weight: 500;
}


.report-image-wrap[b-vyzvwi6irb] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    box-sizing: border-box;
}

/* object-fit:contain keeps aspect ratio and scales to fit — never overflows */
.report-image-fill[b-vyzvwi6irb] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.image-empty-placeholder[b-vyzvwi6irb] {
    color: #9ca3af;
    font-size: 0.8rem;
    text-align: center;
    padding: 8px;
}
/* /Components/Pages/General/ReportBuilder/Components/Image/ReportImageEditModal.razor.rz.scp.css */
.edit-modal-body[b-of8c32d6ip] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
}

.edit-section-label[b-of8c32d6ip] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #6b7280;
    margin: 12px 0 4px;
}

/* ── Existing image gallery ── */
.img-gallery[b-of8c32d6ip] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    max-height: 260px;
    overflow-y: auto;
    padding: 2px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
}

.img-thumb-wrap[b-of8c32d6ip] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 4px;
    border: 2px solid transparent;
    border-radius: 5px;
    cursor: pointer;
    transition: border-color 0.1s, background 0.1s;
    background: white;
    min-width: 0;
}

.img-thumb-wrap:hover[b-of8c32d6ip]        { border-color: #9ca3af; background: #f3f4f6; }
.img-thumb-selected[b-of8c32d6ip]          { border-color: #000061 !important; background: #eff6ff !important; }

.img-thumb[b-of8c32d6ip] {
    width: 100%;
    aspect-ratio: 1;
    object-fit: contain;
    border-radius: 3px;
    background: #f9fafb;
}

.img-thumb-label[b-of8c32d6ip] {
    font-size: 0.62rem;
    color: #6b7280;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
    text-align: center;
}

/* ── Remove button ── */
.remove-img-btn[b-of8c32d6ip] {
    padding: 4px 10px;
    font-size: 0.78rem;
    border: 1px solid #fca5a5;
    border-radius: 4px;
    background: #fef2f2;
    color: #dc2626;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
}
.remove-img-btn:hover:not(:disabled)[b-of8c32d6ip] { background: #fee2e2; }
.remove-img-btn:disabled[b-of8c32d6ip]             { opacity: 0.5; cursor: default; }
/* /Components/Pages/General/ReportBuilder/Components/List/ReportList.razor.rz.scp.css */
/* ── Palette card (template mode) ── */
.report-component-card[b-nxvbghnw6i] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-nxvbghnw6i] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.list-icon[b-nxvbghnw6i] {
    background: #EB3871;
}

.list-icon-lines[b-nxvbghnw6i] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    width: 14px;
}

    .list-icon-lines span[b-nxvbghnw6i] {
        display: block;
        height: 2px;
        background: white;
        border-radius: 1px;
    }

.component-label[b-nxvbghnw6i] { font-size: 0.8rem; font-weight: 500; }

/* ── Canvas (view mode) ── */
.list-body[b-nxvbghnw6i] {
    width: 100%;
    height: 100%;
    overflow: hidden;
    box-sizing: border-box;
}

/* ── List resize support ── */
.list-resize-wrap[b-nxvbghnw6i] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.list-table[b-nxvbghnw6i] {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.list-table th[b-nxvbghnw6i] {
    padding: 5px 8px;
    font-size: 0.8em;
    font-weight: 600;
    border-right: 1px solid rgba(0,0,0,0.08);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
    text-align: left;
}

    .list-table th:last-child[b-nxvbghnw6i] { border-right: none; }

.list-table td[b-nxvbghnw6i] {
    padding: 5px 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-right: 1px solid rgba(0,0,0,0.05);
    box-sizing: border-box;
    color: #374151;
}

    .list-table td:last-child[b-nxvbghnw6i] { border-right: none; }

.list-table tbody tr[b-nxvbghnw6i] { border-bottom: 1px solid #e5e7eb; }
.list-table tbody tr:last-child[b-nxvbghnw6i] { border-bottom: none; }

.list-placeholder[b-nxvbghnw6i] {
    padding: 12px 8px;
    color: #9ca3af;
    font-style: italic;
    font-size: 0.78rem;
}

/* ── Column resize handle (identical pattern to table) ── */
.col-resize-handle[b-nxvbghnw6i] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 6px;
    margin-left: -3px;
    cursor: col-resize;
    z-index: 15;
}

    .col-resize-handle:hover[b-nxvbghnw6i] {
        background: rgba(0, 0, 97, 0.12);
    }
/* /Components/Pages/General/ReportBuilder/Components/List/ReportListEditModal.razor.rz.scp.css */
.edit-modal-body[b-o49kqka1zy] { display: flex; flex-direction: column; gap: 6px; padding: 4px 0; }

.edit-section-label[b-o49kqka1zy] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 0;
}

.edit-input[b-o49kqka1zy] {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}

.edit-input:focus[b-o49kqka1zy] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.col-add-btn[b-o49kqka1zy] {
    align-self: flex-start;
    padding: 5px 10px;
    border: 1px dashed #d1d5db;
    border-radius: 4px;
    background: white;
    font-size: 0.78rem;
    color: #374151;
    cursor: pointer;
    transition: border-color 0.1s, background 0.1s;
}

.col-add-btn:hover[b-o49kqka1zy] { background: #f3f4f6; border-color: #9ca3af; }

.col-remove-btn[b-o49kqka1zy] {
    width: 24px;
    height: 24px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: white;
    font-size: 1rem;
    color: #6b7280;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
    padding: 0;
    transition: background 0.1s, border-color 0.1s;
}

.col-remove-btn:hover:not(:disabled)[b-o49kqka1zy] { background: #fef2f2; border-color: #fca5a5; color: #b91c1c; }
.col-remove-btn:disabled[b-o49kqka1zy] { opacity: 0.35; cursor: not-allowed; }

.tb-header-toggle[b-o49kqka1zy] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: #374151;
    cursor: pointer;
}

.theme-swatch[b-o49kqka1zy] {
    padding: 4px 10px;
    border: 2px solid transparent;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: border-color 0.1s;
}

    .theme-swatch:hover[b-o49kqka1zy]  { border-color: #9ca3af; }
    .theme-swatch.theme-active[b-o49kqka1zy] { border-color: #000061; }

.size-input-text[b-o49kqka1zy] {
    width: 46px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 5px 6px;
    font-size: 0.8rem;
    color: #374151;
    background: white;
    text-align: right;
}

.size-input-text:focus[b-o49kqka1zy] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.size-select[b-o49kqka1zy] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}
.size-select:focus[b-o49kqka1zy] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.edit-divider[b-o49kqka1zy] { border: none; border-top: 1px solid #e5e7eb; margin: 12px 0 8px; }
/* /Components/Pages/General/ReportBuilder/Components/Shared/BorderBackgroundEditor.razor.rz.scp.css */
.bba-root[b-tea2wjazj2] { padding: 4px 0; }

.bba-label[b-tea2wjazj2] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 0 0 8px;
}

.swatch-row[b-tea2wjazj2] { display: flex; flex-wrap: wrap; gap: 6px; }

.swatch[b-tea2wjazj2] {
    width: 26px;
    height: 26px;
    border-radius: 4px;
    border: 2px solid transparent;
    cursor: pointer;
    padding: 0;
    outline: 1px solid #e5e7eb;
    transition: outline-color 0.1s, border-color 0.1s;
}

.swatch:hover[b-tea2wjazj2] { outline-color: #9ca3af; }

.swatch-active[b-tea2wjazj2] {
    border-color: #000061 !important;
    outline-color: #000061 !important;
}

.bba-row[b-tea2wjazj2] { display: flex; align-items: center; gap: 10px; }

.bba-sublabel[b-tea2wjazj2] {
    width: 42px;
    font-size: 0.78rem;
    color: #374151;
    flex-shrink: 0;
}

.bba-range[b-tea2wjazj2] { flex: 1; accent-color: #000061; }

.bba-px[b-tea2wjazj2] {
    width: 28px;
    text-align: right;
    font-size: 0.78rem;
    color: #374151;
}

.bba-select[b-tea2wjazj2] {
    flex: 1;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}

.bba-select:focus[b-tea2wjazj2] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }
/* /Components/Pages/General/ReportBuilder/Components/Stack/ReportStack.razor.rz.scp.css */
/* ── Palette card (template mode) ── */
.report-component-card[b-f7wwq5ua4t] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-f7wwq5ua4t] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.stack-icon[b-f7wwq5ua4t] { background: #f97316; }

.stack-icon-box[b-f7wwq5ua4t] {
    width: 16px;
    height: 16px;
    border: 2px dotted rgba(255,255,255,0.9);
    border-radius: 2px;
}

.component-label[b-f7wwq5ua4t] { font-size: 0.8rem; font-weight: 500; }

/* ── Child component-tab — bottom-left for regular children, top-left for nested stacks ── */
.component-tab[b-f7wwq5ua4t] {
    position: absolute;
    bottom: 4px;
    left: 4px;
    height: 26px;
    display: flex;
    align-items: center;
    gap: 5px;
    background: rgba(0,0,97,.85);
    border-radius: 4px;
    padding: 0 8px;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.12s, visibility 0.12s;
    z-index: 50;
    white-space: nowrap;
}

.stack-child:hover .component-tab[b-f7wwq5ua4t] {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

/* Always-visible tab for child stacks — repositioned to top-left so it doesn't clash */
.stack-child .component-tab-always[b-f7wwq5ua4t] {
    visibility: visible;
    opacity: 0.8;
    pointer-events: auto;
    bottom: auto;
    top: 4px;
}

.stack-child:hover .component-tab-always[b-f7wwq5ua4t] {
    opacity: 1;
}

.stack-child-edit:hover .component-content[b-f7wwq5ua4t] {
    outline: 1px dashed #d1d5db;
    border-radius: 2px;
}

.tab-label[b-f7wwq5ua4t] {
    font-size: 0.68rem;
    font-weight: 500;
    color: rgba(255,255,255,.65);
    margin-right: 4px;
}

.tab-btn[b-f7wwq5ua4t] {
    background: rgba(255,255,255,.15);
    border: none;
    color: white;
    border-radius: 3px;
    padding: 2px 9px;
    cursor: pointer;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.6;
    transition: background 0.1s;
}

    .tab-btn:hover[b-f7wwq5ua4t] { background: rgba(255,255,255,.28); }

    .tab-btn.tab-unstack[b-f7wwq5ua4t] { background: rgba(234,88,12,.75); }

        .tab-btn.tab-unstack:hover[b-f7wwq5ua4t] { background: rgba(234,88,12,1); }

    .tab-btn.tab-delete[b-f7wwq5ua4t] { background: rgba(185,28,28,.7); }

        .tab-btn.tab-delete:hover[b-f7wwq5ua4t] { background: rgba(185,28,28,.9); }

/* ── Stack body ── */
.stack-body[b-f7wwq5ua4t] {
    box-sizing: border-box;
}

/* Subtle always-on outline so nested stacks are visible in edit mode */
.stack-body.stack-edit-mode[b-f7wwq5ua4t] {
    outline: 1px dashed rgba(249, 115, 22, 0.35);
    outline-offset: -1px;
    border-radius: 2px;
}

.stack-empty-hint[b-f7wwq5ua4t] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-height: 60px;
    border: 2px dashed #d1d5db;
    border-radius: 4px;
    color: #9ca3af;
    font-size: 0.8rem;
    pointer-events: none;
}

.stack-child[b-f7wwq5ua4t] {
    box-sizing: border-box;
    width: 100%;
}

.stack-child-edit[b-f7wwq5ua4t] {
    cursor: grab;
}

    .stack-child-edit:active[b-f7wwq5ua4t] {
        cursor: grabbing;
    }

    .stack-child-edit .component-content[b-f7wwq5ua4t] {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

/* ── Stack drop-target highlight (shown while dragging from palette) ── */
.stack-body.stack-drop-target[b-f7wwq5ua4t] {
    outline: 2px dashed #f97316;
    outline-offset: -2px;
    border-radius: 3px;
}

/* ── Per-child width resize handle (right edge, always in edit mode) ── */
.stack-child-w-resize[b-f7wwq5ua4t] {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 6px;
    cursor: ew-resize;
    z-index: 20;
}

    .stack-child-w-resize:hover[b-f7wwq5ua4t] {
        background: rgba(0, 0, 97, 0.12);
    }

/* ── Per-child height resize handle (bottom edge, Table/Graph/Image only) ── */
.stack-child-h-resize[b-f7wwq5ua4t] {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 6px;
    cursor: ns-resize;
    z-index: 20;
}

    .stack-child-h-resize:hover[b-f7wwq5ua4t] {
        background: rgba(0, 0, 97, 0.12);
    }

.stack-fill-label[b-f7wwq5ua4t] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.7rem;
    color: rgba(255,255,255,.8);
    cursor: pointer;
    padding: 2px 6px;
    background: rgba(255,255,255,.1);
    border-radius: 3px;
}

    .stack-fill-label input[type="checkbox"][b-f7wwq5ua4t] {
        margin: 0;
        cursor: pointer;
    }
/* /Components/Pages/General/ReportBuilder/Components/Stack/ReportStackEditModal.razor.rz.scp.css */
/* ── Shared layout ── */
.edit-modal-body[b-m3v45qdzgq] { display: flex; flex-direction: column; gap: 6px; padding: 4px 0; }

.edit-section-label[b-m3v45qdzgq] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 8px 0 4px;
}

.edit-row[b-m3v45qdzgq] { display: flex; align-items: center; gap: 12px; }

.edit-label[b-m3v45qdzgq] {
    width: 100px;
    font-size: 0.8rem;
    color: #374151;
    flex-shrink: 0;
}

.edit-input[b-m3v45qdzgq], .edit-select[b-m3v45qdzgq] {
    flex: 1;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}

.edit-input:focus[b-m3v45qdzgq], .edit-select:focus[b-m3v45qdzgq] {
    outline: none;
    border-color: #000061;
    box-shadow: 0 0 0 2px rgba(0,0,97,.1);
}

.edit-divider[b-m3v45qdzgq] { border: none; border-top: 1px solid #e5e7eb; margin: 12px 0 8px; }

/* ── Child order list ── */
.child-order-list[b-m3v45qdzgq] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 4px;
}

.child-order-list.child-order-row[b-m3v45qdzgq] {
    flex-direction: row;
    flex-wrap: wrap;
}

.child-order-item[b-m3v45qdzgq] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 5px 8px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    cursor: grab;
    user-select: none;
    font-size: 0.78rem;
    color: #374151;
    transition: background 0.1s, border-color 0.1s;
}

    .child-order-item:active[b-m3v45qdzgq] { cursor: grabbing; }

    .child-order-item.child-order-drag-over[b-m3v45qdzgq] {
        border-color: #000061;
        background: #eff6ff;
    }

.child-order-grip[b-m3v45qdzgq] {
    color: #9ca3af;
    font-size: 1rem;
    line-height: 1;
    flex-shrink: 0;
}

.child-order-label[b-m3v45qdzgq] { flex: 1; font-weight: 500; }

.child-order-num[b-m3v45qdzgq] {
    font-size: 0.7rem;
    color: #9ca3af;
    background: #f3f4f6;
    border-radius: 3px;
    padding: 1px 5px;
    flex-shrink: 0;
}

/* Direction toggle buttons */
.fmt-btn[b-m3v45qdzgq] {
    padding: 4px 14px;
    font-size: 0.78rem;
    font-weight: 500;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #ffffff;
    color: #374151;
    cursor: pointer;
    transition: background 0.1s, border-color 0.1s, color 0.1s;
}

    .fmt-btn:hover[b-m3v45qdzgq] { background: #f3f4f6; border-color: #9ca3af; }

.fmt-btn-active[b-m3v45qdzgq] {
    background: #000061;
    border-color: #000061;
    color: #ffffff;
}

    .fmt-btn-active:hover[b-m3v45qdzgq] { background: #000080; border-color: #000080; }
/* /Components/Pages/General/ReportBuilder/Components/Table/ReportTable.razor.rz.scp.css */
.report-component-card[b-dg541wduoh] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-dg541wduoh] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.table-icon[b-dg541wduoh] { background: #10b981; }

.table-icon-grid[b-dg541wduoh] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2px;
    width: 16px;
    height: 16px;
}

    .table-icon-grid span[b-dg541wduoh] {
        background: white;
        border-radius: 1px;
    }

.component-label[b-dg541wduoh] { font-size: 0.8rem; font-weight: 500; }

.report-table[b-dg541wduoh] {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.data-table[b-dg541wduoh] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.data-table th[b-dg541wduoh],
.data-table td[b-dg541wduoh] {
    border: none;
    padding: 5px 10px;
    text-align: left;
}

.data-table th[b-dg541wduoh] { font-weight: 600; }
.data-table td[b-dg541wduoh] { color: #374151; }
.data-table td.price-col[b-dg541wduoh] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.empty-placeholder[b-dg541wduoh] {
    color: #9ca3af;
    font-style: italic;
    font-size: 0.8rem;
    margin: 8px 0 0 0;
    text-align: center;
}

/* ── Table resize support ── */
.table-resize-wrap[b-dg541wduoh] {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Fixed column widths when per-column widths have been set by the user */
.data-table.table-fixed-cols[b-dg541wduoh] {
    table-layout: fixed;
}

/* Column resize handle — invisible vertical strip on interior column borders */
.col-resize-handle[b-dg541wduoh] {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 6px;
    margin-left: -3px;   /* centre the hit zone on the border */
    cursor: col-resize;
    z-index: 15;
}

/* Row resize handle — invisible horizontal strip on interior row borders */
.row-resize-handle[b-dg541wduoh] {
    position: absolute;
    left: 0;
    right: 0;
    height: 6px;
    margin-top: -3px;    /* centre the hit zone on the border */
    cursor: row-resize;
    z-index: 15;
}

.col-resize-handle:hover[b-dg541wduoh],
.row-resize-handle:hover[b-dg541wduoh] {
    background: rgba(0, 0, 97, 0.12);
}
/* /Components/Pages/General/ReportBuilder/Components/Table/ReportTableEditModal.razor.rz.scp.css */
.edit-modal-body[b-y7cnbjc68q] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
}

.edit-section-label[b-y7cnbjc68q] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 12px 0 4px;
}

.preview-date[b-y7cnbjc68q] {
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
    color: #9ca3af;
}

.edit-row[b-y7cnbjc68q] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.edit-label[b-y7cnbjc68q] {
    width: 120px;
    font-size: 0.8rem;
    color: #374151;
    flex-shrink: 0;
}

.edit-input[b-y7cnbjc68q] {
    flex: 1;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    width: 100%;
    box-sizing: border-box;
}

.edit-input:focus[b-y7cnbjc68q] {
    outline: none;
    border-color: #000061;
    box-shadow: 0 0 0 2px rgba(0,0,97,.1);
}

.size-input[b-y7cnbjc68q] { max-width: 80px; flex: none; }

.size-input-text[b-y7cnbjc68q] {
    width: 46px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 5px 6px;
    font-size: 0.8rem;
    color: #374151;
    background: white;
    text-align: right;
}
.size-input-text:focus[b-y7cnbjc68q] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

/* ── Cell grid ── */
.cell-grid[b-y7cnbjc68q] {
    display: grid;
    gap: 4px;
    margin-top: 4px;
}

/* ── Row / column drag handles ── */
.cell-handle-corner[b-y7cnbjc68q] {
    /* empty top-left corner */
}

.cell-col-handle[b-y7cnbjc68q] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1px;
    border-bottom: 1px dashed #e5e7eb;
    min-height: 18px;
}

.cell-row-handle[b-y7cnbjc68q] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1px;
    border-right: 1px dashed #e5e7eb;
}

.cell-drag-handle[b-y7cnbjc68q] {
    display: inline-block;
    color: #d1d5db;
    font-size: 0.72rem;
    cursor: grab;
    user-select: none;
    padding: 2px 3px;
    border-radius: 3px;
    line-height: 1;
}

.cell-drag-handle:hover[b-y7cnbjc68q] {
    color: #6b7280;
    background: #f3f4f6;
}

.cell-drag-handle:active[b-y7cnbjc68q] {
    cursor: grabbing;
}

.cell-drag-over[b-y7cnbjc68q] {
    background: #eff6ff !important;
    outline: 1px solid #93c5fd;
    outline-offset: -1px;
    border-radius: 3px;
}

.cell-tile-drag-over[b-y7cnbjc68q] {
    background: #eff6ff !important;
    border-color: #93c5fd !important;
}

.cell-tile[b-y7cnbjc68q] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 5px 7px;
    font-size: 0.72rem;
    color: #374151;
    background: #f9fafb;
    cursor: pointer;
    min-height: 32px;
    display: flex;
    align-items: center;
    overflow: hidden;
    transition: border-color 0.1s, background 0.1s;
}

.cell-tile:hover[b-y7cnbjc68q] { border-color: #9ca3af; background: #f3f4f6; }

.cell-tile-selected[b-y7cnbjc68q] {
    border-color: #000061 !important;
    background: #eff6ff !important;
    color: #000061;
}

.cell-tile-header[b-y7cnbjc68q] { background: #f3f4f6; font-weight: 600; }
.cell-tile-header.cell-tile-selected[b-y7cnbjc68q] { background: #dbeafe !important; }

.cell-tile-text[b-y7cnbjc68q] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 100%;
}

/* ── size-select matches edit-input ── */
.size-select[b-y7cnbjc68q] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}
.size-select:focus[b-y7cnbjc68q] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

/* ── Cell editor panel ── */
.cell-editor[b-y7cnbjc68q] {
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 10px 12px;
    background: #fafafa;
    margin-top: 4px;
}

.type-toggle[b-y7cnbjc68q] { display: flex; gap: 6px; margin-top: 6px; }

.type-btn[b-y7cnbjc68q] {
    padding: 5px 14px;
    font-size: 0.8rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
}

.type-btn:hover[b-y7cnbjc68q] { border-color: #9ca3af; }
.type-btn-active[b-y7cnbjc68q] { background: #000061; color: white; border-color: #000061; }

/* ── Division buttons ── */
.division-row[b-y7cnbjc68q] { display: flex; gap: 6px; flex-wrap: wrap; }

.div-btn[b-y7cnbjc68q] {
    padding: 4px 12px;
    font-size: 0.78rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
}

.div-btn:hover[b-y7cnbjc68q] { border-color: #9ca3af; }
.div-btn-active[b-y7cnbjc68q] { background: #000061; color: white; border-color: #000061; }

/* ── Route search dropdown ── */
.search-wrapper[b-y7cnbjc68q] { position: relative; }

.group-dropdown[b-y7cnbjc68q] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
    max-height: 200px;
    overflow-y: auto;
    z-index: 100;
    margin-top: 2px;
}

.group-option[b-y7cnbjc68q] { padding: 7px 10px; font-size: 0.8rem; color: #374151; cursor: pointer; }
.group-option:hover[b-y7cnbjc68q], .group-option.selected[b-y7cnbjc68q] { background: #eff6ff; color: #000061; }

/* ── Date relativity / period ── */
.relativity-row[b-y7cnbjc68q], .period-row[b-y7cnbjc68q] { display: flex; gap: 6px; flex-wrap: wrap; }

.rel-btn[b-y7cnbjc68q] {
    padding: 4px 10px;
    font-size: 0.78rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
}

.rel-btn:hover[b-y7cnbjc68q] { border-color: #9ca3af; }
.rel-btn-active[b-y7cnbjc68q] { background: #000061; color: white; border-color: #000061; }

/* ── Theme swatches ── */
.theme-row[b-y7cnbjc68q] { display: flex; gap: 8px; }

.theme-swatch[b-y7cnbjc68q] {
    width: 52px;
    height: 32px;
    border-radius: 4px;
    border: 2px solid transparent;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;
    outline: 1px solid #e5e7eb;
    transition: outline-color 0.1s, border-color 0.1s;
}

.theme-swatch:hover[b-y7cnbjc68q] { outline-color: #9ca3af; }

.theme-active[b-y7cnbjc68q] {
    border-color: #000061 !important;
    outline-color: #000061 !important;
}

.edit-divider[b-y7cnbjc68q] { border: none; border-top: 1px solid #e5e7eb; margin: 12px 0 8px; }

/* ── Cell type colours ── shared between cell tiles and type buttons */
:root[b-y7cnbjc68q] {
    --cell-color-freetext: #6b7280;
    --cell-color-route:    #2563eb;
    --cell-color-dp:       #16a34a;
}

.cell-type-freetext[b-y7cnbjc68q] { border-left: 3px solid var(--cell-color-freetext) !important; }
.cell-type-route[b-y7cnbjc68q]    { border-left: 3px solid var(--cell-color-route) !important; }
.cell-type-datapoint[b-y7cnbjc68q]{ border-left: 3px solid var(--cell-color-dp) !important; }
.cell-type-date[b-y7cnbjc68q]     { border-left: 3px solid #7c3aed !important; }

.type-btn-freetext:not(.type-btn-active)[b-y7cnbjc68q] { border-color: var(--cell-color-freetext); color: var(--cell-color-freetext); }
.type-btn-route:not(.type-btn-active)[b-y7cnbjc68q]    { border-color: var(--cell-color-route);    color: var(--cell-color-route); }
.type-btn-datapoint:not(.type-btn-active)[b-y7cnbjc68q]{ border-color: var(--cell-color-dp);       color: var(--cell-color-dp); }

/* ── Date format builder ── */
.date-parts-row[b-y7cnbjc68q] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    min-height: 30px;
    padding: 5px 6px;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    background: #fafafa;
    align-items: center;
}

.date-parts-empty[b-y7cnbjc68q] {
    font-size: 0.75rem;
    color: #9ca3af;
    font-style: italic;
}

.date-part-chip[b-y7cnbjc68q] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 2px 4px 2px 7px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid transparent;
    white-space: nowrap;
}

.date-part-text[b-y7cnbjc68q] { line-height: 1.2; }

.date-part-remove[b-y7cnbjc68q] {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.8rem;
    line-height: 1;
    padding: 0 2px;
    opacity: 0.5;
    color: inherit;
}
.date-part-remove:hover[b-y7cnbjc68q] { opacity: 1; }

/* Category colours */
.date-part-day[b-y7cnbjc68q]     { background: #dbeafe; color: #1e40af; border-color: #bfdbfe; }
.date-part-weekday[b-y7cnbjc68q] { background: #ede9fe; color: #5b21b6; border-color: #ddd6fe; }
.date-part-month[b-y7cnbjc68q]   { background: #dcfce7; color: #166534; border-color: #bbf7d0; }
.date-part-year[b-y7cnbjc68q]    { background: #f3f4f6; color: #374151; border-color: #e5e7eb; }
.date-part-quarter[b-y7cnbjc68q] { background: #fef9c3; color: #854d0e; border-color: #fef08a; }
.date-part-week[b-y7cnbjc68q]    { background: #ffedd5; color: #9a3412; border-color: #fed7aa; }
.date-part-sep[b-y7cnbjc68q]     { background: #ffffff; color: #6b7280; border-color: #d1d5db; }

.date-preview[b-y7cnbjc68q] {
    font-size: 0.78rem;
    color: #374151;
    margin: 2px 0 0;
}

.date-picker-row[b-y7cnbjc68q] {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 6px;
}

.date-picker-btn[b-y7cnbjc68q] {
    padding: 4px 10px;
    font-size: 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
}
.date-picker-btn:hover[b-y7cnbjc68q] { border-color: #9ca3af; }
.date-picker-btn.active[b-y7cnbjc68q] { background: #000061; color: white; border-color: #000061; }

.date-options-row[b-y7cnbjc68q] {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 6px 8px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    margin-top: 4px;
}

.date-opt-btn[b-y7cnbjc68q] {
    padding: 4px 12px;
    font-size: 0.78rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: white;
    color: #374151;
    cursor: pointer;
    font-family: monospace;
}
.date-opt-btn:hover[b-y7cnbjc68q] { border-color: #000061; color: #000061; background: #eff6ff; }

/* ── Cell style controls ── */
.clear-style-btn[b-y7cnbjc68q] {
    margin-left: 6px;
    padding: 3px 8px;
    font-size: 0.72rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #6b7280;
    cursor: pointer;
    white-space: nowrap;
}
.clear-style-btn:hover[b-y7cnbjc68q] { border-color: #9ca3af; color: #374151; }

.fmt-btn[b-y7cnbjc68q] {
    width: 28px;
    height: 28px;
    font-size: 0.85rem;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #f9fafb;
    color: #374151;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fmt-btn:hover[b-y7cnbjc68q] { border-color: #9ca3af; }
.fmt-btn-active[b-y7cnbjc68q] { background: #000061; color: white; border-color: #000061; }
/* /Components/Pages/General/ReportBuilder/Components/TextBlock/ReportTextBlock.razor.rz.scp.css */
.report-component-card[b-ejka0k579v] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    background: #f9fafb;
    color: #374151;
}

.component-icon[b-ejka0k579v] {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.text-icon[b-ejka0k579v] { background: #3b82f6; }

.component-label[b-ejka0k579v] { font-size: 0.8rem; font-weight: 500; }

.tb-header[b-ejka0k579v] {
    padding: 5px 8px;
    font-weight: 600;
    font-size: 0.8em;
    flex-shrink: 0;
    line-height: 1.4;
}

.textblock-body[b-ejka0k579v] {
    width: 100%;
    height: 100%;
    padding: 8px;
    box-sizing: border-box;
    overflow: hidden;
    word-break: break-word;
}

.tb-placeholder[b-ejka0k579v] {
    color: #9ca3af;
    font-style: italic;
    font-size: 0.8rem;
}
/* /Components/Pages/General/ReportBuilder/Components/TextBlock/ReportTextBlockEditModal.razor.rz.scp.css */
.edit-modal-body[b-t03yvi1u4s] { display: flex; flex-direction: column; gap: 6px; padding: 4px 0; }

.edit-section-label[b-t03yvi1u4s] {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #000061;
    margin: 0;
}

.preview-date[b-t03yvi1u4s] { font-weight: 400; text-transform: none; letter-spacing: 0; color: #9ca3af; }

.source-toggle[b-t03yvi1u4s] { display: flex; gap: 4px; }

.src-btn[b-t03yvi1u4s] {
    flex: 1;
    padding: 6px 10px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: white;
    font-size: 0.8rem;
    color: #374151;
    cursor: pointer;
    transition: background 0.1s, border-color 0.1s;
}

.src-btn:hover[b-t03yvi1u4s] { background: #f3f4f6; }
.src-btn.active[b-t03yvi1u4s] { background: #000061; border-color: #000061; color: white; }

.tb-header-toggle[b-t03yvi1u4s] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.8rem;
    color: #374151;
    cursor: pointer;
}

.theme-swatch[b-t03yvi1u4s] {
    padding: 4px 10px;
    border: 2px solid transparent;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
    transition: border-color 0.1s;
}

    .theme-swatch:hover[b-t03yvi1u4s]  { border-color: #9ca3af; }
    .theme-swatch.theme-active[b-t03yvi1u4s] { border-color: #000061; }

.search-wrapper[b-t03yvi1u4s] { position: relative; }

.edit-input[b-t03yvi1u4s] {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}

.edit-input:focus[b-t03yvi1u4s] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.group-dropdown[b-t03yvi1u4s] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
    max-height: 180px;
    overflow-y: auto;
    z-index: 100;
    margin-top: 2px;
}

.group-option[b-t03yvi1u4s] { padding: 7px 10px; font-size: 0.8rem; color: #374151; cursor: pointer; }
.group-option:hover[b-t03yvi1u4s], .group-option.selected[b-t03yvi1u4s] { background: #eff6ff; color: #000061; }

.code-list[b-t03yvi1u4s] {
    display: flex;
    flex-direction: column;
    max-height: 140px;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-radius: 4px;
}

.code-option[b-t03yvi1u4s] {
    padding: 6px 10px;
    font-size: 0.8rem;
    color: #374151;
    cursor: pointer;
    border-bottom: 1px solid #f3f4f6;
}

.code-option:last-child[b-t03yvi1u4s] { border-bottom: none; }
.code-option:hover[b-t03yvi1u4s] { background: #f9fafb; }
.code-option.selected[b-t03yvi1u4s] { background: #eff6ff; color: #000061; font-weight: 600; }

.loading-text[b-t03yvi1u4s] { font-size: 0.8rem; color: #6b7280; font-style: italic; }

.fetched-preview[b-t03yvi1u4s] {
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 8px 10px;
    font-size: 0.8rem;
    color: #374151;
    background: #f0fdf4;
    white-space: pre-wrap;
    max-height: 100px;
    overflow-y: auto;
}

.edit-textarea[b-t03yvi1u4s] {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 8px;
    font-size: 0.85rem;
    color: #111827;
    resize: vertical;
    box-sizing: border-box;
    font-family: inherit;
}

.edit-textarea:focus[b-t03yvi1u4s] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.format-row[b-t03yvi1u4s] { display: flex; align-items: center; gap: 12px; }
.format-toolbar[b-t03yvi1u4s] { display: flex; gap: 4px; }

.fmt-btn[b-t03yvi1u4s] {
    width: 32px;
    height: 32px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: white;
    cursor: pointer;
    font-size: 0.85rem;
    color: #374151;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.1s, border-color 0.1s;
}

.fmt-btn:hover[b-t03yvi1u4s] { background: #f3f4f6; }
.fmt-btn.active[b-t03yvi1u4s] { background: #000061; border-color: #000061; color: white; }
.fmt-btn.active strong[b-t03yvi1u4s], .fmt-btn.active em[b-t03yvi1u4s] { color: white; }

.size-select[b-t03yvi1u4s] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 6px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: #f9fafb;
    box-sizing: border-box;
}
.size-select:focus[b-t03yvi1u4s] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.size-input-text[b-t03yvi1u4s] {
    width: 46px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 5px 6px;
    font-size: 0.8rem;
    color: #374151;
    background: white;
    text-align: right;
}
.size-input-text:focus[b-t03yvi1u4s] { outline: none; border-color: #000061; box-shadow: 0 0 0 2px rgba(0,0,97,.1); }

.edit-divider[b-t03yvi1u4s] { border: none; border-top: 1px solid #e5e7eb; margin: 12px 0 8px; }

.color-picker-wrap[b-t03yvi1u4s] {
    display: flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 2px 6px;
    background: white;
    cursor: pointer;
}

.color-picker-label[b-t03yvi1u4s] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #374151;
    line-height: 1;
    user-select: none;
}

.color-picker-input[b-t03yvi1u4s] {
    width: 22px;
    height: 22px;
    border: none;
    padding: 0;
    cursor: pointer;
    background: transparent;
}

.preview-strip[b-t03yvi1u4s] {
    border: 1px solid #e5e7eb;
    border-radius: 4px;
    padding: 10px 12px;
    min-height: 44px;
    background: #fafafa;
    word-break: break-word;
    max-height: 100px;
    overflow-y: auto;
}

.edit-coming-soon[b-t03yvi1u4s] { font-size: 0.75rem; color: #9ca3af; font-style: italic; }
/* /Components/Pages/General/ReportBuilder/Pages/ReportsMain.razor.rz.scp.css */
/* ── Outer layout ── */
.report-builder[b-9hs8nakhuk] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 80px);
    overflow: hidden;
}

/* ── Three-column body below toolbar ── */
.report-body[b-9hs8nakhuk] {
    flex: 1;
    min-height: 0;
    display: flex;
    gap: 24px;
    padding: 24px;
    overflow: hidden;
}

/* ── Toolbar ── */
.report-toolbar[b-9hs8nakhuk] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    background: #f3f4f6;
    border-bottom: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.toolbar-label[b-9hs8nakhuk] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
    white-space: nowrap;
}

.toolbar-date[b-9hs8nakhuk] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: white;
}

    .toolbar-date:focus[b-9hs8nakhuk] {
        outline: none;
        border-color: #000061;
    }

.toolbar-select[b-9hs8nakhuk] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: white;
    max-width: 220px;
}

.toolbar-btn[b-9hs8nakhuk] {
    padding: 4px 12px;
    border: 1px solid #000061;
    border-radius: 4px;
    background: white;
    color: #000061;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.1s;
}

    .toolbar-btn:hover[b-9hs8nakhuk] {
        background: #eff6ff;
    }

.toolbar-mode-btn.mode-edit[b-9hs8nakhuk] {
    background: #f0fdf4;
    border-color: #16a34a;
    color: #15803d;
}

.toolbar-mode-btn.mode-view[b-9hs8nakhuk] {
    background: #fff7ed;
    border-color: #ea580c;
    color: #c2410c;
}

.toolbar-mode-btn.mode-data[b-9hs8nakhuk] {
    background: #fff7f0;
    border-color: #f97316;
    color: #c2410c;
}

/* Active button has full colour; inactive buttons are muted */
.toolbar-mode-btn.mode-inactive[b-9hs8nakhuk] {
    background: #f3f4f6 !important;
    border-color: #d1d5db !important;
    color: #9ca3af !important;
}

.toolbar-sep[b-9hs8nakhuk] {
    width: 1px;
    height: 20px;
    background: #d1d5db;
    flex-shrink: 0;
}

/* ── Palette ── */
.component-palette[b-9hs8nakhuk] {
    width: 200px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.palette-heading[b-9hs8nakhuk] {
    font-weight: 700;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    color: #6b7280;
    margin: 0 0 2px;
}

.palette-item[b-9hs8nakhuk] {
    position: relative;
    cursor: grab;
    user-select: none;
}

    .palette-item:active[b-9hs8nakhuk] {
        cursor: grabbing;
        opacity: 0.7;
    }

.palette-disabled[b-9hs8nakhuk] {
    opacity: 0.45;
    cursor: not-allowed;
}

.palette-badge[b-9hs8nakhuk] {
    position: absolute;
    top: 6px;
    right: 6px;
    font-size: 0.62rem;
    background: #000061;
    color: white;
    border-radius: 3px;
    padding: 1px 5px;
    pointer-events: none;
}

/* ── A4 area ── */
.a4-scroll-area[b-9hs8nakhuk] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    background: #e5e7eb;
    border-radius: 8px;
    margin-bottom: 32px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    /* `safe center` centres vertically when the content fits, but falls back to
       `flex-start` when it overflows so every page is reachable via scrolling. */
    justify-content: safe center;
    align-items: center;
    gap: 24px;
}

.a4-page[b-9hs8nakhuk] {
    width: 953px;
    min-height: 1348px;
    height: auto;            /* override inline PDF style's height:297mm so footer stays inside */
    background: white;
/*    box-shadow: 0 4px 24px rgba(0,0,0,.15);*/
    padding: 29px 29px 19px 29px;           /* ~80% of original 36/36/24/36px; PDF export uses its own margin */
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    overflow: visible;       /* allow resize handles + drag overflow to render past edges */
    /* Pin the same web-safe font on-screen as we use in the PDF so glyph metrics match */
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: #111827;
    margin-bottom: 36px;
}

/* ── Page canvas ── */
.page-canvas[b-9hs8nakhuk] {
    position: relative;
    flex: 1;
    min-height: 0;
    overflow: visible;       /* show resize-handle / dragged corners outside the page */
}

/* Guide overlay shown while dragging or resizing — helps line up components with the edges */
.page-canvas.rb-guide-active[b-9hs8nakhuk]::after {
    content: '';
    position: absolute;
    inset: 0;
    border: 1px dashed #d1d5db;
    pointer-events: none;
    z-index: 9999;
}

.drop-hint[b-9hs8nakhuk] {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed #d1d5db;
    border-radius: 6px;
    color: #9ca3af;
    font-size: 0.875rem;
    min-height: 120px;
    margin: 0;
}

.duplicate-page-hint[b-9hs8nakhuk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 2px dashed #d1d5db;
    border-radius: 6px;
    color: #9ca3af;
    min-height: 120px;
    padding: 24px;
}

.duplicate-page-btn[b-9hs8nakhuk] {
    background: #000061;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 8px 18px;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.1s;
}

.duplicate-page-btn:hover[b-9hs8nakhuk] {
    background: #0000a0;
}

.duplicate-page-text[b-9hs8nakhuk] {
    font-size: 0.78rem;
    color: #9ca3af;
}

/* ── Placed items shared ── */
.placed-item[b-9hs8nakhuk] {
    position: relative;
}

/* Tab overlays at the top-left of the component — no space pushed above */
.component-tab[b-9hs8nakhuk] {
    position: absolute;
    top: -26px;
    left: 0;
    height: 26px;
    display: flex;
    align-items: center;
    gap: 5px;
    background: rgba(0,0,97,.85);
    border-radius: 4px;
    padding: 0 8px;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.12s, visibility 0.12s;
    z-index: 20;
    white-space: nowrap;
}

.placed-item:hover .component-tab[b-9hs8nakhuk] {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.placed-item:hover .component-content[b-9hs8nakhuk] {
    outline: 1.5px solid #000061;
    border-radius: 2px;
}

.tab-label[b-9hs8nakhuk] {
    font-size: 0.68rem;
    font-weight: 500;
    color: rgba(255,255,255,.65);
    margin-right: 4px;
}

.tab-btn[b-9hs8nakhuk] {
    background: rgba(255,255,255,.15);
    border: none;
    color: white;
    border-radius: 3px;
    padding: 2px 9px;
    cursor: pointer;
    font-size: 0.7rem;
    font-weight: 500;
    line-height: 1.6;
    transition: background 0.1s;
}

    .tab-btn:hover[b-9hs8nakhuk] {
        background: rgba(255,255,255,.28);
    }

    .tab-btn.tab-remove[b-9hs8nakhuk] {
        background: rgba(185,28,28,.7);
    }

        .tab-btn.tab-remove:hover[b-9hs8nakhuk] {
            background: rgba(185,28,28,.9);
        }

/* ── Header placed item ── */
.placed-header[b-9hs8nakhuk] {
    margin-top: 4px;
    margin-bottom: 16px;
    flex-shrink: 0;
}

/* ── Footer placed item ── */
.placed-footer[b-9hs8nakhuk] {
    margin-top: auto;   /* sticks to the bottom of the flex column */
    margin-bottom: 4px;
    flex-shrink: 0;
}

/* ── Body placed items ── */
.placed-body[b-9hs8nakhuk] {
    box-sizing: border-box;
    cursor: grab;
}

    .placed-body:active[b-9hs8nakhuk] {
        cursor: grabbing;
    }

    .placed-body .component-content[b-9hs8nakhuk] {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

/* ── View mode — hide all edit chrome ── */
.view-mode .component-tab[b-9hs8nakhuk] {
    display: none !important;
}

.view-mode .resize-handle[b-9hs8nakhuk] {
    display: none !important;
}

.view-mode .placed-item:hover .component-content[b-9hs8nakhuk] {
    outline: none;
}

.view-mode .placed-body[b-9hs8nakhuk] {
    cursor: default;
}

/* ── Resize handle ── */
.resize-handle[b-9hs8nakhuk] {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 16px;
    height: 16px;
    cursor: nwse-resize;
    background: linear-gradient(135deg, transparent 50%, #9ca3af 50%);
    border-radius: 0 0 2px 0;
    z-index: 10;
}

/* ── Data mode canvas interactions ── */
.data-mode .placed-body[b-9hs8nakhuk] {
    cursor: pointer;
    transition: opacity 0.15s;
}

.data-mode .placed-body.data-dimmed[b-9hs8nakhuk] {
    opacity: 0.6;
}

.data-mode .placed-body.data-selected .component-content[b-9hs8nakhuk] {
    outline: 2px dashed #f97316 !important;
    border-radius: 2px;
}

/* Hover hint in data mode (for unselected items) */
.data-mode .placed-body:not(.data-selected):hover .component-content[b-9hs8nakhuk] {
    outline: 1px dashed #f97316;
    border-radius: 2px;
}

/* ── Save config form (inside SsyPopup body) ── */
.save-form[b-9hs8nakhuk] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 4px 0;
}

.save-label[b-9hs8nakhuk] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #374151;
}

.save-input[b-9hs8nakhuk] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 7px 10px;
    font-size: 0.85rem;
    color: #374151;
    width: 100%;
    box-sizing: border-box;
}

    .save-input:focus[b-9hs8nakhuk] {
        outline: none;
        border-color: #000061;
        box-shadow: 0 0 0 2px rgba(0,0,97,.1);
    }

.save-btn-confirm[b-9hs8nakhuk] {
    padding: 7px 20px;
    background: #000061;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
}

    .save-btn-confirm:disabled[b-9hs8nakhuk] {
        opacity: 0.4;
        cursor: not-allowed;
    }

    .save-btn-confirm:not(:disabled):hover[b-9hs8nakhuk] {
        background: #0000a0;
    }

/* ── edit-input (used inside Roles modal) ── */
.edit-input[b-9hs8nakhuk] {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 4px 8px;
    font-size: 0.8rem;
    color: #374151;
    background: white;
    flex: 1;
}

    .edit-input:focus[b-9hs8nakhuk] {
        outline: none;
        border-color: #000061;
    }

/* ── edit-section-label (used inside Roles modal) ── */
.edit-section-label[b-9hs8nakhuk] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #000061;
    margin: 0 0 2px;
}

/* ── Roles modal ── */
.roles-owner[b-9hs8nakhuk] {
    font-size: 0.82rem;
    color: #6b7280;
    margin: 0 0 4px;
}

.roles-empty[b-9hs8nakhuk] {
    font-size: 0.8rem;
    color: #9ca3af;
    font-style: italic;
    margin: 8px 0 0;
}

.roles-chips[b-9hs8nakhuk] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
    min-height: 28px;
    align-items: center;
}

.roles-chips-empty[b-9hs8nakhuk] {
    font-size: 0.75rem;
    color: #9ca3af;
    font-style: italic;
}

.role-chip[b-9hs8nakhuk] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px 3px 10px;
    border-radius: 12px;
    font-size: 0.78rem;
    font-weight: 500;
}

.role-chip-edit[b-9hs8nakhuk] {
    background: #dbeafe;
    color: #1e3a5f;
}

.role-chip-data[b-9hs8nakhuk] {
    background: #d1fae5;
    color: #065f46;
}

.role-chip-view[b-9hs8nakhuk] {
    background: #f3f4f6;
    color: #374151;
}

.role-chip-remove[b-9hs8nakhuk] {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.9rem;
    line-height: 1;
    padding: 0;
    color: inherit;
    opacity: 0.6;
}

    .role-chip-remove:hover[b-9hs8nakhuk] {
        opacity: 1;
    }

.roles-add-row[b-9hs8nakhuk] {
    display: flex;
    gap: 6px;
    margin-top: 8px;
    align-items: center;
}

.user-search-dropdown[b-9hs8nakhuk] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.12);
    z-index: 999;
    max-height: 220px;
    overflow-y: auto;
}

.user-search-option[b-9hs8nakhuk] {
    padding: 7px 10px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

    .user-search-option:hover[b-9hs8nakhuk] {
        background: #f0f4ff;
    }

.user-search-email[b-9hs8nakhuk] {
    font-size: 0.8rem;
    color: #1e3a5f;
    font-weight: 500;
}

.user-search-name[b-9hs8nakhuk] {
    font-size: 0.72rem;
    color: #6b7280;
}
/* /Components/Pages/LNG/ApiSetup/GasRatesSetup.razor.rz.scp.css */
.gasextractbox[b-7rauy61hb0] {
    border: 1px solid #009DC9;
    height: 85vh;
    overflow-y: scroll;
}

.gasextractdatepicker[b-7rauy61hb0] {
}

.gasextractroutepicker[b-7rauy61hb0] {
    display: grid;
    grid-template-columns: 100px auto;
    gap: 10px;
}

.gasextractroutepicker-ul[b-7rauy61hb0] {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.gasextractroutepicker-ul .chkbox[b-7rauy61hb0] {
    margin: 0 3px 0 0;
    vertical-align: middle;
}


.gasextractroutepicker-ul li[b-7rauy61hb0] {
    text-decoration: none;
}

.gasextractroutepicker-ul li:hover[b-7rauy61hb0] {
    background-color: #B5CBD6;
}


.deleterow[b-7rauy61hb0], .editapiclient[b-7rauy61hb0] {
    cursor: pointer;
    padding-right: 3px;
}

.deleterow:hover[b-7rauy61hb0] {
    font-weight: 700;
    color: white;
}

.draggablerow[b-7rauy61hb0] {
    cursor: pointer;
}

.editapiclient[b-7rauy61hb0] {
    color: #163E9F;
}


.editapiclient:hover[b-7rauy61hb0] {
    font-weight: 700;
    color: #91A527;
}
/* /Components/Pages/LNG/Reports/Forward/Comps/LngFwdPdf.razor.rz.scp.css */
lng-fwd-hide-pdf[b-37bd8cm608] {
    border: 1px solid black;
    margin-top: 5%;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
/* /Components/Pages/LNG/Reports/Forward/LngForward.razor.rz.scp.css */
.lng-fwd-nav[b-8uh2cegfb6] {
    display: block !important;
}

.lng-fwd-pdf[b-8uh2cegfb6]{
    display: none !important;
}

.lng-fwd-refresh-btn[b-8uh2cegfb6] {
    background-color: #000061;
    transition: background-color 0.4s ease;
}

    .lng-fwd-refresh-btn:hover[b-8uh2cegfb6] {
        background-color: navy;
    }
/* /Components/Pages/LNG/Reports/Sonar/SonarAtlantic.razor.rz.scp.css */
.sonar-rpt-area-banner[b-p01jvdh5w5] {
    background-color: #009DC9;
    width: 100%;
    color: white;
    height: 29px;
    text-align: left;
    font-size: 1.5rem;
    font-weight: 400;
    padding-left: 5px;
    display: flex;
    align-items: center;
}

.sonar-atl-page-cont[b-p01jvdh5w5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    --rpt-atl-top-height: calc(0.50* var(--report-height));
    --rpt-atl-bottom-height: calc(var(--report-height) - var(--rpt-atl-top-height));
    --comp-border: 4px solid white;
    font-size: var(--report-font);
}

.sonar-atl-rpt-cont[b-p01jvdh5w5] {
    background: white;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.sonar-atl-rpt-content[b-p01jvdh5w5] {
    background: white;
    height: var(--report-height);
    width: var(--report-width);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.sonar-atl-top-row[b-p01jvdh5w5] {
    border: var(--comp-border);
    width: var(--report-width);
    display: inline-flex;
    flex-direction: row;
    justify-content: space-between;
}

.sonar-atl-top-left[b-p01jvdh5w5] {
    width: calc(0.31 * var(--report-width));
}
.sonar-atl-top-mid[b-p01jvdh5w5] {
    width: calc(0.38 * var(--report-width));
    justify-content: center;
    align-items: center;
    position: relative;
}

.sonar-atl-top-right[b-p01jvdh5w5] {
    width: calc(0.31 * var(--report-width));
}


.sonar-atl-bottom-row[b-p01jvdh5w5] {
    border: var(--comp-border);
    height: var(--rpt-atl-bottom-height);
    width: var(--report-width);
}

.sonar-atl-footer[b-p01jvdh5w5] {
    color: #A1A1A1;
    font-size: 0.75em
}
/* /Components/Pages/LNG/Reports/Sonar/SonarEast.razor.rz.scp.css */
.sonar-rpt-area-banner[b-re2ftdbtqt] {
    background-color: #009DC9;
    width: 100%;
    color: white;
    height: 29px;
    text-align: left;
    font-size: 1.5rem;
    font-weight: 400;
    padding-left: 5px;
    display: flex;
    align-items: center;
}

.sonar-east-page-cont[b-re2ftdbtqt] {
    display: flex;
    flex-direction: column;
    align-items: center;
    --rpt-east-top-height: calc(0.58* var(--report-height));
    --rpt-east-bottom-height: calc(var(--report-height) - var(--rpt-east-top-height));
    --comp-border: 4px solid white;
    font-size: var(--report-font);
}

.sonar-east-rpt-cont[b-re2ftdbtqt] {
    background: white;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.sonar-east-rpt-content[b-re2ftdbtqt] {
    background: white;
    height: var(--report-height);
    width: var(--report-width);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
} 

.sonar-east-top-row[b-re2ftdbtqt] {
    border: var(--comp-border);
    height: var(--rpt-east-top-height);
    width: var(--report-width);
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    font-size: 1.05em;
}

.sonar-east-top-left[b-re2ftdbtqt] {
    width: 53%;
    position: relative;
    overflow: hidden;

}
.sonar-east-image[b-re2ftdbtqt] {
    width: 100%;
    border: unset !important;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.sonar-east-mEast-TFDE[b-re2ftdbtqt] {
    position: absolute;
    transform: translateY(25vh) translateX(16vw);
    font-size: 1.2rem;
    font-weight: 600;
}

.sonar-east-mEast-prompt[b-re2ftdbtqt] {
    position: absolute;
    transform: translateY(18vh) translateX(16.4vw);
    font-size: 1.6rem;
}

.sonar-east-fEast-TFDE[b-re2ftdbtqt] {
    position: absolute;
    transform: translateY(14.8vh) translateX(26vw);
    font-size: 1.2rem;
    font-weight: 600;
}

.sonar-east-fEast-indOcean-prompt[b-re2ftdbtqt] {
    position: absolute;
    transform: translateY(24vh) translateX(10.5vw);
    font-size: 1.6rem;
}
.sonar-east-fEast-philSea-prompt[b-re2ftdbtqt] {
    position: absolute;
    transform: translateY(9.1vh) translateX(23vw);
    font-size: 1.6rem;
}

.sonar-east-top-right[b-re2ftdbtqt] {
    height: 100%;
    width: 47%;
}


.sonar-east-bottom-row[b-re2ftdbtqt] {
    border: var(--comp-border);
    height: var(--rpt-east-bottom-height);
    width: var(--report-width);
}

.sonar-east-footer[b-re2ftdbtqt] {
    color: #A1A1A1;
    font-size: 0.75em
}

.sonar-east-indices-nav[b-re2ftdbtqt] {
    display: block;
}
.sonar-east-indices-pdf[b-re2ftdbtqt] {
    display: none;
}
/* /Components/Pages/LNG/Reports/Sonar/SonarReport.razor.rz.scp.css */
/*@media print {
    @page {
        size: A4 landscape !important;
        margin: 2mm;
    }
}*/

.sonar-report-cont[b-g63xyfl823] {
    --report-height: 68vh;
    --report-width: 67vw;
    --report-font: 1em;
    --report-prompt-font: 1.5em;
    --report-tfde-font: 1.6em;
}

.sonar-top-cont[b-g63xyfl823] {
    display: flex; 
    flex-direction: row;
    justify-content: center;
}


.sonar-refresh-btn[b-g63xyfl823] {
    background-color: #000061;
    border-radius: 10px;
}
.sonar-refresh-btn:hover[b-g63xyfl823] {
    background-color: navy;
}

.sonar-section-btn[b-g63xyfl823] {
    background-color: #E9EFF9;
    color: #000061;
    font-size: 14px;
    text-align: center;
    padding: 0.2% 0.8%;
    margin-right: -1px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
    transition: all 0.1s ease-in-out;
}

.sonar-pdf-hide[b-g63xyfl823] {
    display: none !important;
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_010_main.razor.rz.scp.css */
/* ============================================================
   LPG Markets Dashboard — shared shell (header, cards, palette)
   Page-specific styles live in the child components.
   ============================================================ */

/* ============ LPG palette
   Brand colours alias the ssy-colour-* tokens from ssyglobal.css.
   LPG-specific neutrals are defined here because no global token exists.
   Children inherit via CSS variable lookup on .lpgdash-dash-wrap. */
.lpgdash-dash-wrap[b-u8jnfbyrlz] {
    /* Brand (mapped to ssy palette) */
    --lpgdash-brand: var(--ssy-colour-main-simpson-blue);    /* #000061 */
    --lpgdash-accent: var(--ssy-colour-main-crystal-blue);   /* #009DC9 */
    --lpgdash-up: var(--ssy-colour-palette-teal-green);      /* #01A39E */
    --lpgdash-down: var(--ssy-colour-palette-vivid-pink);    /* #EB3871 */
    --lpgdash-warn: var(--ssy-colour-palette-crimson-red);   /* #DB303A */

    /* LPG-only neutrals — no ssy equivalent */
    --lpgdash-page-bg: #F5F7FA;
    --lpgdash-text: #1a1a1a;
    --lpgdash-text-dim: #536A75;
    --lpgdash-text-muted: #798E98;
    --lpgdash-divider: #DCE5EB;
    --lpgdash-card-border: #E1E8ED;
    --lpgdash-card-border-soft: #CEDCE4;
    --lpgdash-row-line: #F2F5F8;
    --lpgdash-row-line-soft: #EEF2F5;
    --lpgdash-row-active-bg: #EAF1F5;   /* selected/active stock row */
    --lpgdash-surface: #FFFFFF;

    padding: 0 14px 14px 14px;
    background: var(--lpgdash-page-bg);
    font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
    color: var(--lpgdash-text);
}

/* ============ Page header strip (sub-nav) ============ */
.lpgdash-page-header[b-u8jnfbyrlz] {
    display: flex;
    align-items: stretch;
    gap: 20px;
    padding: 3px 0 0 0;
    margin-bottom: 5px;
    border-bottom: 1px solid var(--lpgdash-divider);
}

.lpgdash-ph-left[b-u8jnfbyrlz] {
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding-bottom: 3px;
}

.lpgdash-ph-pill[b-u8jnfbyrlz] {
    font-size: 20px;
    font-weight: 1000;
    color: var(--lpgdash-brand);
    letter-spacing: 1.6px;
}

.lpgdash-ph-eyebrow[b-u8jnfbyrlz] {
    font-size: 10px;
    color: var(--lpgdash-text-dim);
    text-transform: uppercase;
    letter-spacing: 1.4px;
    font-weight: 600;
}

.lpgdash-ph-tabs[b-u8jnfbyrlz] {
    display: flex;
    align-items: stretch;
    gap: 22px;
    flex: 1;
    padding-left: 6px;
}

.lpgdash-ph-tab[b-u8jnfbyrlz] {
    background: transparent;
    border: 0;
    padding: 0 2px 8px 2px;
    margin-top: -2px;
    font-family: inherit;
    font-size: 12.5px;
    color: var(--lpgdash-text-dim);
    cursor: pointer;
    border-bottom: 2px solid transparent;
    letter-spacing: 0.2px;
    text-decoration: none;
    display: inline-flex;
    align-items: flex-end;
    gap: 5px;
}

    .lpgdash-ph-tab.lpgdash-is-active[b-u8jnfbyrlz] {
        color: var(--lpgdash-brand);
        font-weight: 600;
        border-bottom-color: var(--lpgdash-accent);
    }

    .lpgdash-ph-tab.lpgdash-is-planned[b-u8jnfbyrlz] {
        cursor: not-allowed;
    }

.lpgdash-ph-tab-tag[b-u8jnfbyrlz] {
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 3px;
    color: var(--lpgdash-text-muted);
    font-size: 8.5px;
    font-weight: 700;
    line-height: 1;
    padding: 2px 3px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.lpgdash-ph-status[b-u8jnfbyrlz] {
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 11px;
    color: var(--lpgdash-text-dim);
    letter-spacing: 0.4px;
    padding-bottom: 3px;
}

.lpgdash-ph-export[b-u8jnfbyrlz] {
    border: 1px solid var(--lpgdash-card-border-soft);
    background: var(--lpgdash-surface);
    color: var(--lpgdash-brand);
    font-weight: 600;
    font-size: 10.5px;
    padding: 5px 5px;
    letter-spacing: 0.8px;
    cursor: pointer;
    font-family: inherit;
    text-transform: uppercase;
    border-radius: 3px;
}

    .lpgdash-ph-export:disabled[b-u8jnfbyrlz] {
        opacity: 0.5;
        cursor: not-allowed;
    }

/* ============ Generic card chrome (used by child tabs) ============
   These rules need ::deep because cards are rendered inside child
   components (_100_Overview, _200_PanamaCanal, …), not by this shell.
*/
.lpgdash-dash-wrap[b-u8jnfbyrlz]  .lpgdash-card {
    background: var(--lpgdash-surface);
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
    padding: 8px 10px 6px 10px;
    min-width: 0;
}

.lpgdash-dash-wrap[b-u8jnfbyrlz]  .lpgdash-card-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin: 0 0 4px 0;
    gap: 10px;
}

.lpgdash-dash-wrap[b-u8jnfbyrlz]  .lpgdash-card-title {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    color: var(--lpgdash-brand);
    text-transform: uppercase;
    letter-spacing: 0.9px;
    flex: 1;
    min-width: 0;
}

.lpgdash-dash-wrap[b-u8jnfbyrlz]  .lpgdash-card-desc {
    font-weight: 500;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.3px;
    text-transform: none;
    margin-left: 6px;
    font-size: 10.5px;
}

/* ============ Placeholders (loading / error / no-data) ============ */
.lpgdash-dash-wrap[b-u8jnfbyrlz]  .lpgdash-placeholder {
    color: var(--lpgdash-text-muted);
    font-size: 12px;
    padding: 20px;
    text-align: center;
}

.lpgdash-dash-wrap[b-u8jnfbyrlz]  .lpgdash-placeholder-error {
    color: var(--lpgdash-warn);
    font-size: 11px;
    padding: 8px 10px;
    font-family: monospace;
    white-space: pre-wrap;
    background: #fdf2f2;
    border-radius: 3px;
    margin: 6px;
    border-left: 3px solid var(--lpgdash-warn);
}

.lpgdash-dash-wrap[b-u8jnfbyrlz]  .lpgdash-placeholder-nodata {
    color: var(--lpgdash-text-muted);
    font-size: 12px;
    padding: 20px;
    text-align: center;
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_020_ReleaseStrip.razor.rz.scp.css */
/* ============================================================
   Release strip — horizontal pill row above every LPG tab.
   Scoped under .lpgdash-dash-wrap so the strip's CSS vars (--lpgdash-*)
   resolve from the shell. No new colour literals.
   ============================================================ */

.lpgdash-relstrip[b-c0nw07mq2s] {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 6px;
    padding: 0 0 3px 0;
    margin: 0 0 6px 0;
    border-bottom: 1px solid var(--lpgdash-divider);
    font-family: inherit;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.lpgdash-relstrip[b-c0nw07mq2s]::-webkit-scrollbar {
    display: none;
}

.lpgdash-relstrip-eyebrow[b-c0nw07mq2s] {
    font-size: 9.5px;
    color: var(--lpgdash-text-dim);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 600;
    margin-right: 2px;
    flex: 0 0 auto;
}

.lpgdash-relstrip-pill[b-c0nw07mq2s] {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    background: var(--lpgdash-surface);
    border: 1px solid var(--lpgdash-card-border-soft);
    border-left: 3px solid var(--lpgdash-accent);
    border-radius: 4px;
    padding: 2px 7px;
    font-size: 10.5px;
    color: var(--lpgdash-text);
    line-height: 1.35;
    cursor: default;
    flex: 0 0 auto;
    min-height: 22px;
}

.lpgdash-relstrip-official[b-c0nw07mq2s] {
    border-left-color: var(--lpgdash-accent);
}

.lpgdash-relstrip-estimated[b-c0nw07mq2s] {
    border-left-color: var(--lpgdash-up);
}

.lpgdash-relstrip-lowerconfidence[b-c0nw07mq2s] {
    border-left-color: var(--lpgdash-text-muted);
}

/* Country public-holiday pills — distinct warn-coloured left border so the
   broker can visually separate "market data release" pills from "desk closed"
   pills without losing the chronological sort order. Crimson reads clearly
   against the cyan/teal/grey palette used for release-event confidence. */
.lpgdash-relstrip-holiday[b-c0nw07mq2s] {
    border-left-color: var(--lpgdash-warn);
}

.lpgdash-relstrip-name[b-c0nw07mq2s] {
    font-weight: 600;
    color: var(--lpgdash-brand);
    letter-spacing: 0.2px;
    white-space: nowrap;
}

.lpgdash-relstrip-when[b-c0nw07mq2s] {
    color: var(--lpgdash-text-dim);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.1px;
    white-space: nowrap;
}

.lpgdash-relstrip-confidence[b-c0nw07mq2s] {
    color: var(--lpgdash-text-muted);
    font-size: 8.5px;
    font-weight: 600;
    letter-spacing: 0.35px;
    text-transform: uppercase;
    white-space: nowrap;
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_100_Overview.razor.rz.scp.css */
/* Scoped to .lpgdash-overview (the wrapper rendered by _100_Overview.razor).
   Every rule uses ::deep so it reaches into the _110…_150 sub-components. */

/* ============ Section heading ============ */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-section { margin-bottom: 12px; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-section-head {
    display: flex; align-items: baseline; gap: 12px;
    padding: 0 2px 5px 2px; margin-bottom: 8px;
    border-bottom: 1px solid var(--lpgdash-divider);
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-section-eyebrow {
    margin: 0; font-size: 11px; font-weight: 700; color: var(--lpgdash-brand);
    text-transform: uppercase; letter-spacing: 1.4px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-section-sub {
    font-size: 11px; color: var(--lpgdash-text-muted); letter-spacing: 0.2px;
    font-weight: 400;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-section-status {
    margin-left: auto; font-size: 10px; color: var(--lpgdash-text-dim);
    text-transform: uppercase; letter-spacing: 0.8px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-section-status .lpgdash-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: var(--lpgdash-up); display: inline-block;
    margin-right: 5px; vertical-align: 1px;
}

/* Mini KPI strip lives in LpgKpiStrip.razor + .razor.css (shared with the
   Inventory tab). Don't redeclare those rules here. */

/* ============ Grid ============ */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-grid-4 { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 8px; margin-bottom: 8px; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-bottom: 8px; }

/* ============ Card extras (period + input row) ============ */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-card-period {
    font-size: 10px; color: var(--lpgdash-text-muted); font-weight: 600;
    letter-spacing: 0.6px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-card-actions { display: flex; gap: 16px; align-items: center; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-input-pair {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: 10px; color: var(--lpgdash-text-dim); font-weight: 600;
    text-transform: uppercase; letter-spacing: 0.9px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-input-pair input {
    width: 60px; padding: 3px 6px;
    border: 1px solid var(--lpgdash-card-border-soft); border-radius: 3px;
    text-align: right; font-size: 12px;
    background: var(--lpgdash-surface); outline: none;
    color: var(--lpgdash-brand); font-weight: 700;
    font-family: inherit;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-input-pair input:focus { border-color: var(--lpgdash-accent); }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-input-pair .lpgdash-unit { color: var(--lpgdash-text-muted); font-weight: 500; }

/* ============ Arb layout (table + chart side-by-side) ============ */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-layout {
    display: flex; gap: 2px; margin-bottom: 8px; align-items: stretch;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table-section {
    flex: 0 0 50%; overflow: hidden; display: flex; flex-direction: column;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-chart-section {
    flex: 0 0 50%; overflow: hidden; display: flex; flex-direction: row; gap: 2px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-chart-section .lpgdash-card {
    flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 2px 2px 2px 2px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-chart-section .lpgdash-card > :not(header) {
    flex: 1; min-height: 0;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-chart-section svg {
    height: 100% !important;
}

@media (max-width: 1200px) {
    .lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-layout {
        flex-direction: column; gap: 8px;
    }
    .lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table-section,
    .lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-chart-section {
        flex: 0 0 auto;
    }
}

/* ============ Arb table ============ */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-table-card { padding: 10px 12px 8px 12px; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table {
    width: 100%; border-collapse: separate; border-spacing: 0;
    font-size: 11.5px;
    font-family: "Segoe UI", system-ui, sans-serif;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table thead tr.lpgdash-grp th {
    padding: 4px 5px;
    font-weight: 700; font-size: 10px;
    color: var(--lpgdash-brand);
    text-transform: uppercase; letter-spacing: 1.2px;
    border-bottom: 1px solid var(--lpgdash-row-line-soft);
    white-space: nowrap;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table thead tr.lpgdash-sub th {
    padding: 3px 5px 5px 5px;
    font-weight: 500; font-size: 10px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase; letter-spacing: 0.7px;
    border-bottom: 1px solid var(--lpgdash-divider);
    white-space: nowrap;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table th.lpgdash-period-col,
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table td.lpgdash-period-col {
    text-align: left; padding-left: 6px;
    color: var(--lpgdash-text); font-weight: 600;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table td {
    padding: 3px 6px; text-align: right; white-space: nowrap;
    border-bottom: 1px solid var(--lpgdash-row-line);
    color: var(--lpgdash-text); line-height: 1.3;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table tbody tr:last-child td { border-bottom: 0; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table .lpgdash-th-sub {
    display: block; font-size: 9px; font-weight: 500;
    color: var(--lpgdash-text-muted); letter-spacing: 0.5px; margin-top: 1px;
}

/* column group tints (kept subtle so the data leads) */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-grp-export   { background: #F4F7F9; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-grp-import   { background: #EAF1F5; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-grp-spread   { background: #DAE5EB; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-grp-freight  { background: #EAF1F5; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-grp-tfee     { background: #F4F7F9; }

/* per-cell column tints (body) */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-mb,
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-cp        { background: #F8FAFB; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-fei,
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-nwe       { background: #F1F5F8; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-sprfei,
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-sprnwe    { background: #E7EEF2; color: var(--lpgdash-brand); font-weight: 700; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-blpg      { background: #F1F5F8; color: var(--lpgdash-text); }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-fmt       { background: #F8FAFB; color: var(--lpgdash-warn); font-weight: 500; }
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-col-pan       { background: #F8FAFB; color: var(--lpgdash-warn); font-weight: 500; }

/* ARB cells — headers tinted, body cells saturated */
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table th.lpgdash-col-arbfei-h {
    background: #DAE5EB; color: var(--lpgdash-brand);
    font-weight: 700; text-align: center; letter-spacing: 1.2px;
    width: 110px; min-width: 110px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table th.lpgdash-col-arbnwe-h {
    background: #C1E4F0; color: var(--lpgdash-brand);
    font-weight: 700; text-align: center; letter-spacing: 1.2px;
    width: 110px; min-width: 110px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table td.lpgdash-col-arbfei {
    background: var(--lpgdash-brand); color: var(--lpgdash-surface);
    font-weight: 700; font-size: 12.5px;
    padding-right: 14px;
}
.lpgdash-overview[b-4c13qtwo8j]  .lpgdash-arb-table td.lpgdash-col-arbnwe {
    background: var(--lpgdash-accent); color: var(--lpgdash-surface);
    font-weight: 700; font-size: 12.5px;
    padding-right: 14px;
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_300_UsInventory.razor.rz.scp.css */
/* ============================================================
   _300_UsInventory - scoped layout for the Inventory tab.

   The child components own their data transforms; this file owns the dense
   broker-dashboard layout: selector table, compact numeric tables, shared
   grids, and the small context strips under charts.
   ============================================================ */

.lpgdash-usinv-page[b-1g9i8uool6] {
    display: flex;
    flex-direction: column;
    gap: 7px;
    padding: 0;
}

.lpgdash-usinv-sectiontitle[b-1g9i8uool6] {
    margin: 4px 0 0 0;
    font-size: 10.5px;
    font-weight: 800;
    color: var(--lpgdash-brand);
    text-transform: uppercase;
    letter-spacing: 1.15px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-section {
    margin-bottom: 7px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-card {
    padding: 4px 9px 3px 9px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-card-head {
    margin-bottom: 3px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-grid-4 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(430px, 0.95fr);
    gap: 7px;
    align-items: stretch;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-flows {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(460px, 0.95fr);
    gap: 7px;
    align-items: stretch;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.55fr);
    gap: 7px;
    align-items: stretch;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-forecast-table-card {
    margin-top: 7px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-contextline {
    display: flex;
    gap: 11px;
    padding: 2px 4px 0 4px;
    font-size: 10.5px;
    color: var(--lpgdash-text-dim);
    letter-spacing: 0.25px;
    font-variant-numeric: tabular-nums;
    border-top: 1px solid var(--lpgdash-row-line);
    margin-top: 2px;
    flex-wrap: wrap;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-contextline-wide {
    justify-content: space-between;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-contextline .lpgdash-usinv-ctx-label {
    text-transform: uppercase;
    color: var(--lpgdash-text-muted);
    font-size: 8.5px;
    letter-spacing: 0.55px;
    margin-right: 3px;
}

/* Sign-coloured delta text. Specificity bumped so it wins over the
   generic `tbody td` colour rule further down — without this, deltas
   inside .lpgdash-usinv-flowtable / -densetable / -stocktable read as
   plain --lpgdash-text. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-up,
.lpgdash-usinv-page[b-1g9i8uool6]  td.lpgdash-up,
.lpgdash-usinv-page[b-1g9i8uool6]  span.lpgdash-up {
    color: var(--lpgdash-up);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-down,
.lpgdash-usinv-page[b-1g9i8uool6]  td.lpgdash-down,
.lpgdash-usinv-page[b-1g9i8uool6]  span.lpgdash-down {
    color: var(--lpgdash-down);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocktable-card {
    display: flex;
    flex-direction: column;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocktable,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-densetable,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-flowtable {
    width: 100%;
    border-collapse: collapse;
    font-size: 10.5px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocktable thead th,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-densetable thead th,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-flowtable thead th {
    font-size: 8.5px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.55px;
    color: var(--lpgdash-text-muted);
    text-align: right;
    padding: 2px 6px;
    border-bottom: 1px solid var(--lpgdash-divider);
    white-space: nowrap;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocktable thead th:first-child,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-densetable thead th:first-child,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-flowtable thead th:first-child {
    text-align: left;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocktable tbody td,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-densetable tbody td,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-flowtable tbody td {
    padding: 2px 6px;
    text-align: right;
    color: var(--lpgdash-text);
    border-bottom: 1px solid var(--lpgdash-row-line);
    line-height: 1.25;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocktable tbody td:first-child,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-densetable tbody td:first-child,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-flowtable tbody td:first-child {
    text-align: left;
    color: var(--lpgdash-text-dim);
    font-weight: 700;
}

/* Tiny unit chip in column headers — replaces the prose "all flow values kbpd
   - stocks change in MBBL" line that used to sit in the section description. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-unit {
    display: inline-block;
    margin-left: 3px;
    font-size: 7.5px;
    font-weight: 600;
    letter-spacing: 0.35px;
    color: var(--lpgdash-text-dim);
    text-transform: lowercase;
}

/* Faint vertical divider before the Stock chg column so the kbpd → MBBL
   unit switch reads without a sentence. Applies to header + body cells. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-balancetable th.lpgdash-usinv-unitswitch,
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-balancetable td.lpgdash-usinv-unitswitch {
    border-left: 1px solid var(--lpgdash-divider);
    padding-left: 10px;
}

/* STEO forecast table — column-wise heatmap shading.
   Each .lpgdash-usinv-heat cell carries a --heat custom property in [0,1]
   set inline from C# (HeatStyle in _340_Forecasts.razor). color-mix() then
   tints the background. Two palettes:
     -flow  : sequential teal (production, consumption, net exports, inventory)
     -price : sequential blue/accent (MB spot) so the price column is visually
              distinct from the flow columns.
   Cap intensity at 22% so cell text stays comfortably readable.
   Requires color-mix() support — fine on modern Edge/Chrome/Firefox/Safari. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-heat {
    transition: background 120ms linear;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-heat-flow {
    background: color-mix(in srgb, var(--lpgdash-up) calc(var(--heat, 0) * 22%), transparent);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-heat-price {
    background: color-mix(in srgb, var(--lpgdash-accent) calc(var(--heat, 0) * 22%), transparent);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stockrow {
    cursor: pointer;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stockrow:hover td {
    background: var(--lpgdash-row-line-soft);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stockrow.lpgdash-is-active td {
    background: var(--lpgdash-row-active-bg);
    color: var(--lpgdash-brand);
    font-weight: 800;
}

/* ============================================================
   Section 01 (Stocks Snapshot) — hero chart with big-number overlay,
   PADD table with coloured legend dots, 5y-range strip beneath.
   See _320_StocksSeasonality.razor file header for the design intent.
   ============================================================ */

/* Hero chart card needs a relative container so the overlay can absolute-
   position itself top-left over the chart area without colliding with the
   header strip. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-chartcard {
    display: flex;
    flex-direction: column;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-chartarea {
    position: relative;
    flex: 1;
    height: 220px;
    min-height: 220px;
}

/* As-of pill in the chart card header, right side. Mirrors the "as of W19
   · 09 MAY" pill from the reference screenshot. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-asof {
    font-size: 9.5px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.55px;
    font-weight: 700;
    white-space: nowrap;
}

/* Big-number overlay anchored top-left of the chart area. The chart is
   already sparse in its top-left corner (the seasonal fan curves up from
   below) so this overlay doesn't occlude data points. z-index keeps it
   above the chart svg without blocking tooltip pointer events because
   pointer-events:none. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-overlay {
    position: absolute;
    top: 4px;
    left: 50px;
    z-index: 4;
    display: flex;
    flex-direction: column;
    gap: 4px;
    pointer-events: none;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-bignum {
    font-size: 30px;
    font-weight: 800;
    color: var(--lpgdash-brand);
    letter-spacing: -0.5px;
    line-height: 0.75;
    font-variant-numeric: tabular-nums;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-bignum-unit {
    font-size: 10.5px;
    font-weight: 600;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-left: 4px;
    vertical-align: 1px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-deltas {
    display: flex;
    gap: 12px;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    font-weight: 700;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-delta {
    display: inline-flex;
    gap: 4px;
    align-items: baseline;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-delta-label {
    font-size: 8.5px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.55px;
    font-weight: 800;
}

/* Right card header hint — small "click row to focus chart" prompt that
   sits beside the card title, mirrors the reference screenshot. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-clickhint {
    font-size: 8.5px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.55px;
    font-weight: 700;
    white-space: nowrap;
}

/* Small coloured legend dot in the PADD column. Diameter matches the chart's
   marker dots, so the brain reads them as the same series. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-paddot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
}

/* PADD table rows are slightly taller than the default densetable to host
   the legend dot comfortably. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-paddtable tbody td {
    padding-top: 3px;
    padding-bottom: 3px;
}

/* ============ Range strip beneath the PADD table ============
   One horizontal band per region. The band's grey background is the visual
   5y same-week range; the coloured dot is "this week" placed at the
   FiveYearRangePct (0..100) position. Tooltip on the dot reveals the actual
   low–high MBBL values. */
.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-rangestrip {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-top: 4px;
    padding-top: 4px;
    border-top: 1px solid var(--lpgdash-divider);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-rangerow {
    display: grid;
    grid-template-columns: 64px 1fr 64px;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-rangerow-label {
    color: var(--lpgdash-text-dim);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-rangeband {
    position: relative;
    display: block;
    height: 7px;
    border-radius: 999px;
    background: var(--lpgdash-row-line-soft);
    border: 1px solid var(--lpgdash-row-line);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-rangedot {
    position: absolute;
    top: -3px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    transform: translateX(-50%);
    border: 2px solid var(--lpgdash-surface);
    box-shadow: 0 0 0 1px var(--lpgdash-card-border-soft);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-price-rangeband {
    display: inline-block;
    width: min(520px, 100%);
    vertical-align: middle;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-price-rangedot {
    background: var(--lpgdash-brand);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-rangerow-val {
    text-align: right;
    color: var(--lpgdash-text);
    font-weight: 700;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-rangestrip-cap {
    margin-top: 4px;
    font-size: 8.5px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.45px;
    font-weight: 600;
    text-align: center;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-is-empty {
    opacity: 0.55;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocknote {
    margin-top: auto;
    padding-top: 7px;
    color: var(--lpgdash-text-muted);
    font-size: 9.5px;
    line-height: 1.35;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-price-name {
    display: block;
    color: var(--lpgdash-brand);
    font-weight: 800;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-price-source {
    display: block;
    margin-top: 1px;
    color: var(--lpgdash-text-muted);
    font-size: 8.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.45px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-summary {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--lpgdash-divider);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-head-label {
    font-size: 11px;
    font-weight: 700;
    color: var(--lpgdash-brand);
    text-transform: uppercase;
    letter-spacing: 0.9px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-head-month {
    font-size: 18px;
    font-weight: 800;
    color: var(--lpgdash-accent);
    letter-spacing: 0.5px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 2px 0 6px 0;
    border-bottom: 1px solid var(--lpgdash-divider);
    margin-bottom: 4px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-value {
    font-size: 28px;
    font-weight: 800;
    color: var(--lpgdash-brand);
    letter-spacing: -0.5px;
    line-height: 1;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-label {
    font-size: 9px;
    font-weight: 700;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-top: 4px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-delta {
    text-align: right;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-delta-label {
    font-size: 9px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    font-weight: 700;
    margin-bottom: 2px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-delta-value {
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-delta-value.lpgdash-up {
    color: var(--lpgdash-up);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-total-delta-value.lpgdash-down {
    color: var(--lpgdash-down);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-mix-label {
    font-size: 9px;
    font-weight: 700;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 0px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-stack {
    display: flex;
    gap: 0;
    height: 20px;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 0px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-stack-segment {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    padding: 0 5px;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    text-shadow: 0px 1px 4px rgb(0, 0, 0);
    white-space: nowrap;
    overflow: hidden;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-stack-segment-tight {
    justify-content: center;
    padding: 0 2px;
    font-size: 9px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-card {
    border: 1px solid var(--lpgdash-divider);
    border-radius: 4px;
    padding: 6px;
    background: var(--lpgdash-row-line-soft);
    font-size: 10px;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-card-header {
    font-weight: 700;
    color: var(--lpgdash-text-dim);
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-card-value {
    font-size: 16px;
    font-weight: 700;
    color: var(--lpgdash-brand);
    font-variant-numeric: tabular-nums;
    margin-bottom: 4px;
    line-height: 1.2;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-card-mix {
    color: var(--lpgdash-text-muted);
    margin-bottom: 8px;
    font-weight: 600;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-card-delta {
    font-size: 9px;
    white-space: pre-line;
    line-height: 1;
    margin-bottom: 8px;
    font-weight: 600;
}

.lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-card-spark {
    height: 50px;
    margin: 8px -4px -4px -4px;
}

@media (max-width: 1100px) {
    .lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-stocks-grid,
    .lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-flows,
    .lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-ngl-grid {
        grid-template-columns: 1fr;
    }

    .lpgdash-usinv-page[b-1g9i8uool6]  .lpgdash-usinv-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_400_Economics.razor.rz.scp.css */
/* ============================================================
   _400_Economics.razor.css — scoped styles for the Economics tab.

   Every rule is namespaced under `.lpgdash-economics` (the wrapper rendered
   by _400). All deep rules reach into the child sub-components (_410–_440).

   Brand colours come from the --lpgdash-* CSS variables defined on
   .lpgdash-dash-wrap in _010_main.razor.css. Do NOT add hex literals here
   unless they're chart-axis colours (those have to be literal because
   Highcharts JS reads strings).

   Layout:
     .lpgdash-economics
       .lpgeco-switch              (top destination toggle bar)
       .lpgeco-page-grid           (3-col: inputs | breakdown | charts)
         .lpgeco-inputs-card       (LHS detailed inputs from _410)
         .lpgeco-breakdown-card    (centre TCE waterfall from _420)
         .lpgeco-charts-strip      (RHS vertical chart stack from _440)
       .lpgeco-arb-card            (full-width arb table below the grid)
   ============================================================ */

/* ============ Destination switch ============ */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0 10px 0;
    padding: 6px 10px;
    background: var(--lpgdash-surface);
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-switch-label {
    font-size: 10px;
    font-weight: 700;
    color: var(--lpgdash-text-dim);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-right: 4px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-switch-btn {
    background: transparent;
    border: 1px solid var(--lpgdash-card-border-soft);
    color: var(--lpgdash-text-dim);
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    padding: 5px 14px;
    border-radius: 3px;
    cursor: pointer;
    letter-spacing: 0.4px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-switch-btn.lpgeco-switch-active {
    background: var(--lpgdash-brand);
    color: #FFFFFF;
    border-color: var(--lpgdash-brand);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-switch-meta {
    margin-left: auto;
    font-size: 11px;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.3px;
}

/* ============ Page grid (inputs | breakdown | charts) ============
   v1.5: rebalanced to give the breakdown waterfall more horizontal room.
   Inputs are dense vertical lists (300px is enough); breakdown carries
   3-column rows (label + detail + value) and benefits from extra width. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-page-grid {
    display: grid;
    grid-template-columns: 300px 1.4fr 1fr;
    gap: 10px;
    margin-bottom: 10px;
}

/* On narrower viewports collapse: inputs span left, breakdown takes the
   rest, charts wrap below as a row. Threshold matches the broker's typical
   1080p laptop minus the side nav. */
@media (max-width: 1400px) {
    .lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-page-grid {
        grid-template-columns: 280px 1fr;
    }
    .lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-charts-strip {
        grid-column: 1 / -1;
        display: grid !important;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 8px;
    }
}

/* ============ Vessel metadata strip (top of inputs card) ============
   Compact 3-line stack of free-text inputs. No math impact — pure broker
   record-keeping so a screenshot of this page can stand in for a fixture
   broker note. Lives above the .lpgeco-inputs-head divider. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-vessel-strip {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 6px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-vessel-input {
    width: 100%;
    box-sizing: border-box;
    padding: 4px 6px;
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 3px;
    font-family: inherit;
    font-size: 11px;
    color: var(--lpgdash-brand);
    background: var(--lpgdash-page-bg);
    outline: none;
    font-weight: 500;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-vessel-input::placeholder {
    color: var(--lpgdash-text-muted);
    font-weight: 400;
    letter-spacing: 0.3px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-vessel-input:focus {
    border-color: var(--lpgdash-accent);
    background: var(--lpgdash-surface);
}

/* ============ Inputs card (_410) ============ */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-inputs-card {
    background: var(--lpgdash-surface);
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
    padding: 8px 12px 10px 12px;
    min-width: 0;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-inputs-head {
    margin: 0 0 6px 0;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--lpgdash-divider);
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-inputs-head h3 {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    color: var(--lpgdash-brand);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-inputs-sub {
    font-size: 10px;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.3px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-section {
    margin-top: 10px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-section h4,
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-section-head h4 {
    margin: 0 0 4px 0;
    font-size: 10px;
    font-weight: 700;
    color: var(--lpgdash-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.9px;
}

/* Section-header chevron button. Renders inside the h4 so the whole label
   line is clickable; the rendered ▾/▸ glyph signals open/closed state. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-section-toggle {
    background: transparent;
    border: 0;
    color: inherit;
    font: inherit;
    cursor: pointer;
    padding: 2px 0;
    width: 100%;
    text-align: left;
    letter-spacing: inherit;
    text-transform: inherit;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-section-toggle:hover {
    color: var(--lpgdash-brand);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 4px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-sub {
    color: var(--lpgdash-text-muted);
    font-weight: 500;
    text-transform: none;
    margin-left: 4px;
    font-size: 9.5px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 80px 22px;
    align-items: center;
    gap: 6px;
    padding: 1px 0;
    font-size: 11px;
    color: var(--lpgdash-text);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-row label {
    color: var(--lpgdash-text-dim);
    font-weight: 500;
    letter-spacing: 0.2px;
    min-width: 0;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-row input {
    padding: 2px 6px;
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 3px;
    text-align: right;
    font-size: 12px;
    background: var(--lpgdash-surface);
    outline: none;
    color: var(--lpgdash-brand);
    font-weight: 700;
    font-family: inherit;
    width: 100%;
    box-sizing: border-box;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-row input:focus {
    border-color: var(--lpgdash-accent);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-label-unit {
    color: var(--lpgdash-text-muted);
    font-size: 9.5px;
    font-weight: 500;
    letter-spacing: 0.2px;
    margin-left: 3px;
    text-transform: none;
    white-space: nowrap;
}

/* Overridden rows get a subtle goldenrod accent so the broker can see at a
   glance which fields are no longer at their feed / Baltic-basis default.
   Both .lpgeco-input-row (single-input rows) and .lpgeco-port-row (cost+days
   pair) use the same .lpgeco-overridden tell. For port rows only the cost
   <input> reflects the override — the days field isn't part of the Baltic
   basis-vessel reset, so it stays at the normal palette. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-row.lpgeco-overridden input,
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-row.lpgeco-overridden input:first-of-type {
    background: #FFF8E1;
    color: var(--lpgdash-warn);
}

/* Read-only output rows (the "solved-for" side of the freight/TCE toggle).
   Greyed background + muted weight signals "this is the calc's answer". */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-row.lpgeco-readonly input {
    background: var(--lpgdash-page-bg);
    color: var(--lpgdash-text-dim);
    font-weight: 600;
    cursor: not-allowed;
    border-style: dashed;
}

/* Solve-for row uses the full input width for the toggle button group. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-row.lpgeco-solve-row {
    grid-template-columns: 1fr auto;
}

/* Smaller variant of the segmented control — used by the solve-for toggle
   inline in the cargo section + the Full/Eco speed-preset chips, so they
   don't dominate the panel and line up with the tightened input rows. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-segmented-sm .lpgeco-seg-btn {
    padding: 1px 10px;
    font-size: 10px;
    line-height: 1.4;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-foot {
    margin: 6px 0 0 0;
    font-size: 9.5px;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.2px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-mini-icon {
    background: transparent;
    border: 0;
    color: var(--lpgdash-text-muted);
    font-size: 12px;
    cursor: pointer;
    padding: 0;
    font-family: inherit;
    line-height: 1;
    width: 20px;
    height: 20px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-mini-icon:hover {
    color: var(--lpgdash-accent);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-reset-spacer {
    width: 20px;
    height: 20px;
}

/* Segmented route picker */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-segmented {
    display: flex;
    gap: 4px;
    margin-bottom: 2px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-seg-btn {
    background: transparent;
    border: 1px solid var(--lpgdash-card-border-soft);
    color: var(--lpgdash-text-dim);
    font-family: inherit;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 3px;
    cursor: pointer;
    flex: 1;
    letter-spacing: 0.3px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-seg-btn.lpgeco-seg-active {
    background: var(--lpgdash-accent);
    color: #FFFFFF;
    border-color: var(--lpgdash-accent);
}

/* ============ Breakdown card (_420) ============ */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-card {
    background: var(--lpgdash-surface);
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
    padding: 10px 14px 12px 14px;
    min-width: 0;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-head {
    margin: 0 0 8px 0;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--lpgdash-divider);
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-head h3 {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    color: var(--lpgdash-brand);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-sub {
    font-size: 10.5px;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.3px;
}

/* Headline numbers */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline {
    background: var(--lpgdash-page-bg);
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 3px;
    padding: 10px 14px;
    margin-bottom: 12px;
    display: flex;
    align-items: stretch;
    gap: 14px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-main {
    flex: 0 0 auto;
    padding-right: 14px;
    border-right: 1px solid var(--lpgdash-card-border-soft);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-secondary {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-label {
    display: block;
    font-size: 9.5px;
    font-weight: 600;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 2px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-value {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: var(--lpgdash-brand);
    letter-spacing: -0.4px;
    line-height: 1.1;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-value-sm {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: var(--lpgdash-brand);
    letter-spacing: -0.2px;
    line-height: 1.2;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-unit {
    font-size: 11px;
    font-weight: 500;
    color: var(--lpgdash-text-muted);
    margin-left: 2px;
    letter-spacing: 0;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-value.lpgeco-up,
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-value-sm.lpgeco-up { color: var(--lpgdash-up); }

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-value.lpgeco-down,
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-headline-value-sm.lpgeco-down { color: var(--lpgdash-down); }

/* Waterfall sections */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-section {
    margin-top: 10px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-section h4 {
    margin: 0 0 4px 0;
    font-size: 10px;
    font-weight: 700;
    color: var(--lpgdash-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.9px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-row {
    display: grid;
    grid-template-columns: 160px 1fr 120px;
    gap: 8px;
    align-items: baseline;
    padding: 3px 0;
    font-size: 11.5px;
    color: var(--lpgdash-text);
    border-bottom: 1px solid var(--lpgdash-row-line-soft);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-breakdown-row:last-child { border-bottom: 0; }

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-detail {
    font-size: 10px;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.2px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-val {
    text-align: right;
    font-weight: 700;
    color: var(--lpgdash-text);
    font-variant-numeric: tabular-nums;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-subtotal {
    border-top: 1px solid var(--lpgdash-divider);
    margin-top: 4px;
    padding-top: 5px;
    font-weight: 700;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-subtotal .lpgeco-bd-val {
    color: var(--lpgdash-brand);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-net {
    background: var(--lpgdash-page-bg);
    padding: 6px 8px;
    border-radius: 3px;
    border-bottom: 0;
    margin-top: 4px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-net.lpgeco-up .lpgeco-bd-val { color: var(--lpgdash-up); }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-net.lpgeco-down .lpgeco-bd-val { color: var(--lpgdash-down); }

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-bd-placeholder {
    color: var(--lpgdash-text-muted);
    font-style: italic;
    grid-template-columns: 1fr;
}

/* ============ Chart strip (_440) ============ */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-charts-strip {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-charts-strip .lpgdash-card { padding: 8px 10px 6px 10px; }

/* ============ Arb table (_430) ============ */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-card { padding: 10px 14px 10px 14px; }

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11.5px;
    font-family: "Segoe UI", system-ui, sans-serif;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table thead tr.lpgeco-grp th {
    padding: 4px 5px;
    font-weight: 700;
    font-size: 10px;
    color: var(--lpgdash-brand);
    text-transform: uppercase;
    letter-spacing: 1.2px;
    border-bottom: 1px solid var(--lpgdash-row-line-soft);
    white-space: nowrap;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table thead tr.lpgeco-sub th {
    padding: 3px 5px 5px 5px;
    font-weight: 500;
    font-size: 10px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.7px;
    border-bottom: 1px solid var(--lpgdash-divider);
    white-space: nowrap;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table th.lpgeco-period-col,
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-period-col {
    text-align: left;
    padding-left: 6px;
    color: var(--lpgdash-text);
    font-weight: 600;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td {
    padding: 4px 6px;
    text-align: right;
    white-space: nowrap;
    border-bottom: 1px solid var(--lpgdash-row-line);
    color: var(--lpgdash-text);
    line-height: 1.3;
    font-variant-numeric: tabular-nums;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table tbody tr:last-child td { border-bottom: 0; }

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table .lpgeco-th-sub {
    display: block;
    font-size: 9px;
    font-weight: 500;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.5px;
    margin-top: 1px;
}

/* Column group tints (subtle so the arb cell pops) */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-grp-cargo   { background: #F4F7F9; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-grp-cp      { background: #F8FAFB; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-grp-spread  { background: #EAF1F5; color: var(--lpgdash-brand); font-weight: 700; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-grp-freight { background: #EAF1F5; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-grp-tfee    { background: #F4F7F9; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-grp-overage { background: #F8FAFB; color: var(--lpgdash-warn); font-weight: 600; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-overage-cell { background: #F8FAFB; color: var(--lpgdash-warn); font-weight: 600; }

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table .lpgeco-spread-cell { background: #E7EEF2; color: var(--lpgdash-brand); font-weight: 700; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table .lpgeco-voyage-cell { background: #DAE5EB; color: var(--lpgdash-brand); font-weight: 700; }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table .lpgeco-tfee        { background: #F8FAFB; color: var(--lpgdash-warn); font-weight: 500; }

/* Market vs Voyage delta colouring (positive delta = voyage MORE expensive than market) */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-freight-up { color: var(--lpgdash-down); }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-freight-dn { color: var(--lpgdash-up); }

/* The single arb column — high-contrast like in _130 */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table th.lpgeco-arb-col-h {
    background: #DAE5EB;
    color: var(--lpgdash-brand);
    font-weight: 700;
    text-align: center;
    letter-spacing: 1.2px;
    width: 110px;
    min-width: 110px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-arb-cell {
    background: var(--lpgdash-brand);
    color: #FFFFFF;
    font-weight: 700;
    font-size: 12.5px;
    padding-right: 14px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-arb-cell.lpgeco-arb-pos { background: var(--lpgdash-up); }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-arb-cell.lpgeco-arb-neg { background: var(--lpgdash-down); }

/* TCE column (v1.5): per-row implied $/day with same styling treatment as arb.
   Width matches the arb column for visual symmetry. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table th.lpgeco-tce-col-h {
    background: #C1E4F0;
    color: var(--lpgdash-brand);
    font-weight: 700;
    text-align: center;
    letter-spacing: 1px;
    width: 100px;
    min-width: 100px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-tce-cell {
    background: var(--lpgdash-accent);
    color: #FFFFFF;
    font-weight: 700;
    font-size: 12.5px;
    padding-right: 14px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-tce-cell.lpgeco-arb-pos { background: var(--lpgdash-up); }
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-table td.lpgeco-tce-cell.lpgeco-arb-neg { background: var(--lpgdash-down); }

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-empty {
    text-align: center;
    color: var(--lpgdash-text-muted);
    font-style: italic;
    padding: 14px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-arb-foot {
    margin: 6px 0 0 0;
    font-size: 10px;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.2px;
}

/* ============================================================
   v2.0 Primary/Advanced inputs layout
   ============================================================
   .lpgeco-inputs-head reuses the existing flex (justify: space-between)
   so the Reset-to-Baltic button sits on the right. The h3 + caption
   wrap inside .lpgeco-inputs-head-text so they don't get split by the
   flex gap.
   .lpgeco-input-group replaces the old .lpgeco-input-section: no toggle,
   just a small inline grey label above each cluster of rows.
   .lpgeco-advanced is a native <details> accordion holding everything
   the broker rarely touches per-fixture. */

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-inputs-head-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-reset-baltic-btn {
    background: transparent;
    border: 1px solid var(--lpgdash-divider);
    color: var(--lpgdash-text-dim);
    font-size: 10px;
    letter-spacing: 0.4px;
    padding: 2px 8px;
    cursor: pointer;
    white-space: nowrap;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-reset-baltic-btn:hover {
    color: var(--lpgdash-brand);
    border-color: var(--lpgdash-brand);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-input-group {
    margin-top: 6px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-group-label {
    display: block;
    margin: 0 0 2px 0;
    font-size: 9px;
    font-weight: 600;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.8px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-advanced {
    margin-top: 8px;
    border-top: 1px solid var(--lpgdash-divider);
    padding-top: 6px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-advanced-summary {
    cursor: pointer;
    user-select: none;
    font-size: 10px;
    font-weight: 700;
    color: var(--lpgdash-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 2px 0;
    list-style: revert;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-advanced-summary:hover {
    color: var(--lpgdash-brand);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-advanced[open] > .lpgeco-advanced-summary {
    margin-bottom: 4px;
}

/* Port rows — 4-column grid: label | cost input | days input | reset icon.
   Fixed-width input columns so "Cost $" / "Days" headers align exactly. */
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-header,
.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 72px 48px 22px;
    gap: 4px;
    align-items: center;
    margin-bottom: 3px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-col-label {
    font-size: 9px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-align: right;
    padding-right: 4px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-row > label {
    font-size: 11px;
    color: var(--lpgdash-text-dim);
    font-weight: 500;
    letter-spacing: 0.2px;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-row > input {
    padding: 2px 6px;
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 3px;
    text-align: right;
    font-size: 12px;
    background: var(--lpgdash-surface);
    color: var(--lpgdash-brand);
    font-weight: 700;
    font-family: inherit;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    outline: none;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-row > input:focus {
    border-color: var(--lpgdash-accent);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-row-opt > label {
    color: var(--lpgdash-text-muted);
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-add-btn {
    background: transparent;
    border: 0;
    color: var(--lpgdash-accent);
    font-size: 10px;
    font-family: inherit;
    cursor: pointer;
    padding: 1px 0 4px 0;
    text-align: left;
    letter-spacing: 0.3px;
    display: block;
}

.lpgdash-economics[b-3i2nfp8ybg]  .lpgeco-port-add-btn:hover {
    color: var(--lpgdash-brand);
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_500_Calendar.razor.rz.scp.css */
/* ============================================================
   Country holiday calendar tab.
   Scoped under .lpgdash-dash-wrap so the shell owns palette variables.
   ============================================================ */

.lpgdash-dash-wrap .lpgdash-cal[b-pftapqpsii] {
    display: grid;
    gap: 7px;
    font-family: inherit;
}

/* Single controls row: title + month nav + additional-holidays toggle. */
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-controls[b-pftapqpsii] {
    display: flex;
    align-items: center;
    gap: 14px;
    border-bottom: 1px solid var(--lpgdash-divider);
    padding: 2px 0 7px 0;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-controls > .lpgdash-cal-title[b-pftapqpsii] {
    margin: 0;
    flex: 1 1 auto;
    color: var(--lpgdash-brand);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-toggle[b-pftapqpsii] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--lpgdash-text-dim);
    cursor: pointer;
    font-size: 11px;
    font-weight: 500;
    white-space: nowrap;
    flex: 0 0 auto;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail[b-pftapqpsii] {
    min-width: 0;
    background: var(--lpgdash-surface);
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
    padding: 6px 8px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-eyebrow[b-pftapqpsii] {
    color: var(--lpgdash-brand);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-date[b-pftapqpsii] {
    color: var(--lpgdash-text-dim);
    font-size: 10.5px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-muted[b-pftapqpsii] {
    margin: 0;
    color: var(--lpgdash-text-muted);
    font-size: 10.5px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-monthbar[b-pftapqpsii] {
    display: inline-flex;
    align-items: center;
    gap: 0;
    flex: 0 0 auto;
}

/* Chevron / Today buttons grouped as one segmented control. */
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-nav[b-pftapqpsii] {
    border: 1px solid var(--lpgdash-card-border-soft);
    background: var(--lpgdash-surface);
    color: var(--lpgdash-brand);
    border-radius: 0;
    cursor: pointer;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    min-width: 28px;
    padding: 5px 9px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-nav:first-child[b-pftapqpsii] {
    border-radius: 3px 0 0 3px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-nav:last-child[b-pftapqpsii] {
    border-radius: 0 3px 3px 0;
    margin-left: -1px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-nav-today[b-pftapqpsii] {
    color: var(--lpgdash-text);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.3px;
    margin-left: -1px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-nav:hover[b-pftapqpsii] {
    border-color: var(--lpgdash-accent);
    position: relative;
    z-index: 1;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-board[b-pftapqpsii] {
    display: grid;
    grid-template-columns: minmax(820px, 1fr) minmax(280px, 0.31fr);
    gap: 14px;
    align-items: start;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-months[b-pftapqpsii] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    min-width: 0;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-monthpanel[b-pftapqpsii] {
    min-width: 0;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-monthname[b-pftapqpsii] {
    margin: 0 0 6px 0;
    color: var(--lpgdash-brand);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-grid[b-pftapqpsii] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    background: var(--lpgdash-divider);
    border: 1px solid var(--lpgdash-divider);
    border-radius: 4px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-dow[b-pftapqpsii] {
    background: var(--lpgdash-row-active-bg);
    color: var(--lpgdash-text-dim);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.6px;
    padding: 4px 2px;
    text-align: center;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-day[b-pftapqpsii] {
    display: grid;
    align-content: start;
    gap: 3px;
    min-height: 52px;
    min-width: 0;
    border: 0;
    background: var(--lpgdash-surface);
    color: var(--lpgdash-text);
    cursor: pointer;
    font-family: inherit;
    padding: 4px;
    text-align: left;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-day:hover[b-pftapqpsii] {
    background: var(--lpgdash-row-active-bg);
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-empty[b-pftapqpsii] {
    cursor: default;
    opacity: 0.5;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-daynum[b-pftapqpsii] {
    color: var(--lpgdash-text-muted);
    font-size: 10.5px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-has-holiday .lpgdash-cal-daynum[b-pftapqpsii] {
    color: var(--lpgdash-text);
}

/* Today: filled accent tint + brand-coloured day number — the broker's anchor
   point, should be unmissable at a glance. */
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-is-today[b-pftapqpsii] {
    background: var(--lpgdash-row-active-bg);
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-is-today .lpgdash-cal-daynum[b-pftapqpsii] {
    color: var(--lpgdash-brand);
    font-weight: 800;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-is-selected[b-pftapqpsii] {
    outline: 2px solid var(--lpgdash-accent);
    outline-offset: -2px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-has-holiday[b-pftapqpsii] {
    box-shadow: inset 3px 0 0 var(--lpgdash-accent);
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-markers[b-pftapqpsii] {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    line-height: 1.1;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-marker[b-pftapqpsii] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 17px;
    min-height: 16px;
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 3px;
    background: var(--lpgdash-surface);
    color: var(--lpgdash-brand);
    font-size: 9px;
    font-weight: 700;
    line-height: 1;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-marker-additional[b-pftapqpsii] {
    border-style: dashed;
    color: var(--lpgdash-text-muted);
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-marker-more[b-pftapqpsii] {
    color: var(--lpgdash-brand);
    font-size: 9px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail[b-pftapqpsii] {
    position: sticky;
    top: 8px;
    display: grid;
    align-items: start;
    gap: 5px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-card-head[b-pftapqpsii] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 1px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail-list[b-pftapqpsii],
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-holidays[b-pftapqpsii],
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-notes[b-pftapqpsii] {
    display: grid;
    gap: 3px;
}

/* Selected Day rows: country code as a small chip on the left, country name +
   holiday reason flow inline next to it. Reads as "SG Singapore - Vesak Day". */
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail-row[b-pftapqpsii] {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: baseline;
    column-gap: 8px;
    row-gap: 0;
    border-bottom: 1px solid var(--lpgdash-row-line);
    color: var(--lpgdash-text);
    font-size: 11px;
    padding: 4px 0;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail-row strong[b-pftapqpsii] {
    grid-row: 1;
    grid-column: 1;
    color: var(--lpgdash-brand);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.4px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail-row span:nth-of-type(1)[b-pftapqpsii] {
    grid-row: 1;
    grid-column: 2;
    color: var(--lpgdash-text);
    font-weight: 600;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail-row span:last-child[b-pftapqpsii] {
    grid-row: 2;
    grid-column: 2;
    color: var(--lpgdash-text-muted);
    font-size: 10.5px;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail-row strong[b-pftapqpsii],
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-holidays strong[b-pftapqpsii],
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-notes strong[b-pftapqpsii] {
    color: var(--lpgdash-brand);
    font-weight: 700;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-holidays[b-pftapqpsii],
.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-notes[b-pftapqpsii] {
    color: var(--lpgdash-text-dim);
    font-size: 10px;
    line-height: 1.35;
}

.lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-holidays em[b-pftapqpsii] {
    color: var(--lpgdash-text-muted);
    font-style: normal;
    margin-left: 4px;
}

@media (max-width: 1200px) {
    .lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-board[b-pftapqpsii] {
        grid-template-columns: 1fr;
    }

    .lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-detail[b-pftapqpsii] {
        position: static;
    }
}

@media (max-width: 900px) {
    .lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-months[b-pftapqpsii] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-controls[b-pftapqpsii] {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-grid[b-pftapqpsii] {
        overflow-x: auto;
    }

    .lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-dow[b-pftapqpsii],
    .lpgdash-dash-wrap .lpgdash-cal .lpgdash-cal-day[b-pftapqpsii] {
        min-width: 54px;
    }
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_600_Weather.razor.rz.scp.css */
/* ============================================================
   LPG weather tab. Scoped under the dashboard wrapper and the
   lpgweather prefix so this tab stays isolated from sibling tabs.
   Dense Bloomberg-style matrix: one row per port, now + 48h
   per metric, exception colouring (only caution/alert cells tint).
   ============================================================ */

.lpgdash-dash-wrap .lpgweather-tab[b-l873sh1jcx] {
    display: grid;
    gap: 12px;
}

/* --- Top bar: storm watch + counts + freshness --- */

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-top[b-l873sh1jcx] {
    display: flex;
    align-items: stretch;
    gap: 12px;
    justify-content: space-between;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-storms[b-l873sh1jcx] {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    gap: 10px;
    min-width: 0;
    border: 1px solid var(--lpgdash-card-border);
    border-left: 3px solid var(--lpgdash-accent);
    border-radius: 4px;
    background: var(--lpgdash-surface);
    padding: 8px 10px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-eyebrow[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-group-title[b-l873sh1jcx] {
    margin: 0;
    color: var(--lpgdash-brand);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.7px;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-storm-list[b-l873sh1jcx] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-storm-chip[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-storm-pill[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-freshness[b-l873sh1jcx] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 4px;
    background: var(--lpgdash-row-active-bg);
    color: var(--lpgdash-text-dim);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    padding: 5px 8px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-storm-chip strong[b-l873sh1jcx] {
    color: var(--lpgdash-brand);
    font-weight: 800;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-counts[b-l873sh1jcx] {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 6px;
    margin-left: auto;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-count[b-l873sh1jcx] {
    display: inline-flex;
    align-items: center;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.3px;
    padding: 4px 8px;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgweather-tab button.lpgweather-count[b-l873sh1jcx] {
    border: 0;
    cursor: pointer;
    font-family: inherit;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-count-active[b-l873sh1jcx] {
    outline: 2px solid var(--lpgdash-brand);
    outline-offset: 1px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-count-clear[b-l873sh1jcx] {
    border: 1px solid var(--lpgdash-card-border-soft);
    background: var(--lpgdash-surface);
    color: var(--lpgdash-text-dim);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-count-alert[b-l873sh1jcx] {
    background: var(--lpgdash-warn);
    color: #fff;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-count-caution[b-l873sh1jcx] {
    background: var(--lpgdash-accent);
    color: #fff;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-count-calm[b-l873sh1jcx] {
    border: 1px solid var(--lpgdash-card-border-soft);
    background: var(--lpgdash-row-active-bg);
    color: var(--lpgdash-up);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-freshness[b-l873sh1jcx] {
    flex: 0 0 auto;
    background: var(--lpgdash-surface);
    color: var(--lpgdash-text-muted);
    font-variant-numeric: tabular-nums;
}

/* --- Legend / key row --- */

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-legend[b-l873sh1jcx] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 14px;
    color: var(--lpgdash-text-dim);
    font-size: 11px;
    font-weight: 600;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-legend em[b-l873sh1jcx] {
    color: var(--lpgdash-text);
    font-style: normal;
    font-weight: 800;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-key[b-l873sh1jcx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-key-note[b-l873sh1jcx] {
    color: var(--lpgdash-text-muted);
    font-weight: 600;
    margin-left: auto;
}

/* --- Board: matrix + sticky detail rail --- */

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-board[b-l873sh1jcx] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-wrap[b-l873sh1jcx] {
    min-width: 0;
    overflow-x: auto;
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
    background: var(--lpgdash-surface);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix[b-l873sh1jcx] {
    width: 100%;
    border-collapse: collapse;
    color: var(--lpgdash-text);
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix thead th[b-l873sh1jcx] {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--lpgdash-surface);
    color: var(--lpgdash-brand);
    font-weight: 800;
    white-space: nowrap;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-grouphead th[b-l873sh1jcx] {
    border-bottom: 1px solid var(--lpgdash-card-border-soft);
    font-size: 11px;
    letter-spacing: 0.4px;
    padding: 7px 8px 3px;
    text-align: center;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-subhead th[b-l873sh1jcx] {
    border-bottom: 2px solid var(--lpgdash-card-border);
    color: var(--lpgdash-text-muted);
    font-size: 9.5px;
    font-weight: 700;
    letter-spacing: 0.3px;
    padding: 0 8px 5px;
    text-align: right;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-grouphead .lpgweather-col-port[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-subhead .lpgweather-col-port[b-l873sh1jcx] {
    text-align: left;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-region td[b-l873sh1jcx] {
    background: var(--lpgdash-row-active-bg);
    border-top: 1px solid var(--lpgdash-card-border-soft);
    border-bottom: 1px solid var(--lpgdash-card-border-soft);
    color: var(--lpgdash-text-dim);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.6px;
    padding: 3px 8px;
    text-transform: uppercase;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-loading[b-l873sh1jcx] {
    color: var(--lpgdash-text-muted);
    font-size: 11px;
    padding: 12px;
    text-align: center;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row[b-l873sh1jcx] {
    cursor: pointer;
    border-bottom: 1px solid var(--lpgdash-row-line-soft);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row:hover[b-l873sh1jcx] {
    background: var(--lpgdash-row-active-bg);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row.lpgweather-selected[b-l873sh1jcx] {
    background: var(--lpgdash-row-active-bg);
    box-shadow: inset 3px 0 0 var(--lpgdash-accent);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row td[b-l873sh1jcx] {
    padding: 2px 8px;
    line-height: 1.25;
    white-space: nowrap;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-cell-dot[b-l873sh1jcx] {
    text-align: center;
    width: 22px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-col-port[b-l873sh1jcx] {
    color: var(--lpgdash-brand);
    font-weight: 700;
    text-align: left;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-flag[b-l873sh1jcx] {
    margin-right: 6px;
    font-size: 14px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-num[b-l873sh1jcx] {
    text-align: right;
    font-weight: 700;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-ts[b-l873sh1jcx] {
    text-align: center;
    width: 26px;
}

/* Vertical separators between metric groups so each now/48h pair
   reads clearly under its header. */
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-grouphead th:nth-child(2)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-grouphead th:nth-child(3)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-grouphead th:nth-child(4)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-grouphead th:nth-child(5)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-grouphead th:nth-child(6)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-subhead th:nth-child(2)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-subhead th:nth-child(4)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-subhead th:nth-child(6)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-subhead th:nth-child(8)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-matrix-subhead th:nth-child(10)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row td:nth-child(2)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row td:nth-child(4)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row td:nth-child(6)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row td:nth-child(8)[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-row td:nth-child(10)[b-l873sh1jcx] {
    border-right: 1px solid var(--lpgdash-card-border-soft);
}

/* --- Exception cell tints: only caution/alert paint --- */

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-cell-caution[b-l873sh1jcx] {
    background: color-mix(in srgb, var(--lpgdash-accent) 16%, transparent);
    color: var(--lpgdash-brand);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-cell-alert[b-l873sh1jcx] {
    background: color-mix(in srgb, var(--lpgdash-warn) 18%, transparent);
    color: var(--lpgdash-warn);
    font-weight: 800;
}

/* --- Status dots (always coloured) --- */

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-status-dot[b-l873sh1jcx] {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-status-dot.lpgweather-calm[b-l873sh1jcx] {
    background: var(--lpgdash-up);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-status-dot.lpgweather-caution[b-l873sh1jcx] {
    background: var(--lpgdash-accent);
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-status-dot.lpgweather-alert[b-l873sh1jcx] {
    background: var(--lpgdash-warn);
}

/* --- Sticky detail rail --- */

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-detail[b-l873sh1jcx] {
    position: sticky;
    top: 8px;
    min-width: 0;
}

/* --- Ventusky map --- */

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map[b-l873sh1jcx] {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-head[b-l873sh1jcx] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-buttons[b-l873sh1jcx] {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-button[b-l873sh1jcx] {
    border: 1px solid var(--lpgdash-card-border-soft);
    border-radius: 0;
    background: var(--lpgdash-surface);
    color: var(--lpgdash-brand);
    cursor: pointer;
    font-family: inherit;
    font-size: 11px;
    font-weight: 800;
    min-width: 54px;
    padding: 6px 10px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-button:first-child[b-l873sh1jcx] {
    border-radius: 4px 0 0 4px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-button:last-child[b-l873sh1jcx] {
    border-radius: 0 4px 4px 0;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-button + .lpgweather-map-button[b-l873sh1jcx] {
    margin-left: -1px;
}

.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-button:hover[b-l873sh1jcx],
.lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-button.lpgweather-selected[b-l873sh1jcx] {
    border-color: var(--lpgdash-accent);
    background: var(--lpgdash-row-active-bg);
    position: relative;
    z-index: 1;
}

.lpgdash-dash-wrap .lpgweather-tab iframe[b-l873sh1jcx] {
    width: 100%;
    min-height: 520px;
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
    background: var(--lpgdash-brand);
}

/* --- Responsive --- */

@media (max-width: 1280px) {
    .lpgdash-dash-wrap .lpgweather-tab .lpgweather-board[b-l873sh1jcx] {
        grid-template-columns: 1fr;
    }

    .lpgdash-dash-wrap .lpgweather-tab .lpgweather-detail[b-l873sh1jcx] {
        position: static;
    }
}

@media (max-width: 680px) {
    .lpgdash-dash-wrap .lpgweather-tab .lpgweather-top[b-l873sh1jcx],
    .lpgdash-dash-wrap .lpgweather-tab .lpgweather-map-head[b-l873sh1jcx] {
        align-items: flex-start;
        flex-direction: column;
    }

    .lpgdash-dash-wrap .lpgweather-tab .lpgweather-key-note[b-l873sh1jcx] {
        margin-left: 0;
    }

    .lpgdash-dash-wrap .lpgweather-tab .lpgweather-freshness[b-l873sh1jcx] {
        width: 100%;
    }
}
/* /Components/Pages/LPG/LpgDashboard/LpgDashboard_700_Bunkers.razor.rz.scp.css */
/* Scoped styles for the Bunkers tab. */

.lpgdash-bunkers[b-f882t3vtyr] {
    display: grid;
    gap: 8px;
}

.lpgdash-bunkers .lpgbunk-row[b-f882t3vtyr] {
    display: grid;
    gap: 8px;
    align-items: start;
}

.lpgdash-bunkers .lpgbunk-row-full[b-f882t3vtyr] {
    grid-template-columns: minmax(0, 1fr);
}

.lpgdash-bunkers .lpgbunk-row-spot-spreads[b-f882t3vtyr] {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
}

.lpgdash-bunkers .lpgbunk-row-even[b-f882t3vtyr] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lpgdash-bunkers .lpgbunk-row-scrub-lift[b-f882t3vtyr] {
    align-items: stretch;
}

.lpgdash-bunkers .lpgbunk-row-fuel-reg[b-f882t3vtyr] {
    grid-template-columns: minmax(0, 4fr) minmax(0, 6fr);
}

.lpgdash-bunkers .lpgbunk-zone[b-f882t3vtyr] {
    min-width: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgdash-card {
    padding: 5px 7px 4px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 11.5px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-table th {
    padding: 2px 5px;
    text-align: right;
    font-size: 9px;
    font-weight: 800;
    color: var(--lpgdash-text-dim);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1px solid var(--lpgdash-divider);
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-table td {
    height: 22px;
    padding: 0 5px;
    text-align: right;
    vertical-align: middle;
    border-bottom: 1px solid var(--lpgdash-row-line);
    color: var(--lpgdash-text);
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-table tbody tr:last-child td {
    border-bottom: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-table .lpgbunk-col-port {
    text-align: left;
    padding-left: 2px;
    color: var(--lpgdash-brand);
    font-weight: 700;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-num {
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-loading {
    text-align: center !important;
    color: var(--lpgdash-text-muted);
    font-style: italic;
    padding: 18px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-cost-dn {
    color: var(--lpgdash-up);
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-cost-up {
    color: var(--lpgdash-down);
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-flat {
    color: var(--lpgdash-text-muted);
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-board-card,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-spreads,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-fuelchoice,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-zone,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-eua,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrubber,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg {
    min-width: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-stamp {
    color: var(--lpgdash-text-muted);
    font-size: 10px;
    font-weight: 700;
    margin-left: auto;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrubber-toggle,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-check {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--lpgdash-text-dim);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrubber-toggle input,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-check input {
    margin: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-stale-marker {
    display: inline-block;
    margin-left: 5px;
    border: 1px solid var(--lpgdash-divider);
    border-radius: 4px;
    color: var(--lpgdash-down);
    font-size: 9px;
    font-weight: 800;
    line-height: 1;
    padding: 2px 4px;
    text-transform: uppercase;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-outlier-badge {
    color: var(--lpgdash-down);
    font-size: 9px;
    font-weight: 800;
    margin-left: 3px;
    vertical-align: 1px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hi5 {
    color: var(--lpgdash-accent);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-fwd-cell {
    padding: 0 2px;
    min-width: 64px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-fwd-head,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-fwd-sub {
    display: block;
    line-height: 1.05;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-fwd-head {
    color: var(--lpgdash-text);
    font-size: 10px;
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-fwd-sub {
    font-size: 9px;
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-fwd-empty {
    color: var(--lpgdash-text-muted);
    font-weight: 700;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-spreads-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
    gap: 8px;
    align-items: stretch;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-spreads-table-wrap {
    min-width: 0;
    overflow-x: auto;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-status-pill {
    display: inline-block;
    min-width: 34px;
    border-radius: 4px;
    font-size: 9.5px;
    font-weight: 800;
    line-height: 1;
    padding: 4px 5px;
    text-align: center;
    text-transform: uppercase;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-status-in {
    background: var(--lpgdash-row-line-soft);
    color: var(--lpgdash-up);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-status-out {
    background: var(--lpgdash-row-line-soft);
    color: var(--lpgdash-text-muted);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-controls {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 6px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-control,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-fx,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls label {
    display: grid;
    gap: 3px;
    min-width: 0;
    margin: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-control span,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-fx span,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls label span {
    color: var(--lpgdash-text-dim);
    font-size: 9px;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-select,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-select,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-fx input,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls input {
    width: 100%;
    min-width: 0;
    height: 26px;
    border: 1px solid var(--lpgdash-divider);
    border-radius: 4px;
    background: var(--lpgdash-surface);
    color: var(--lpgdash-text);
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    padding: 2px 6px;
    outline: none;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-select {
    margin-left: auto;
    width: auto;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-chart {
    height: 176px;
    min-width: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-eua-chart {
    height: 102px;
    min-width: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-eua-cross-chart {
    height: 112px;
    margin-top: 4px;
    min-width: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-eua-head {
    align-items: flex-start;
    gap: 8px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-eua-latest {
    margin-left: auto;
    color: var(--lpgdash-brand);
    font-size: 11px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-loading {
    color: var(--lpgdash-text-muted);
    font-size: 12px;
    font-style: italic;
    padding: 18px 0 4px;
    text-align: center;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage {
    min-height: 184px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(360px, 0.65fr);
    gap: 6px 8px;
    align-items: start;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-main,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-inputs {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-main {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-inputs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-stat {
    min-width: 0;
    min-height: 74px;
    border: 1px solid var(--lpgdash-divider);
    border-radius: 4px;
    background: var(--lpgdash-surface);
    padding: 6px 8px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-label {
    display: block;
    color: var(--lpgdash-text-dim);
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: 0.5px;
    line-height: 1.1;
    text-transform: uppercase;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-stat strong {
    display: block;
    color: var(--lpgdash-text);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1.15;
    margin-top: 3px;
    overflow-wrap: anywhere;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-sub,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-ets {
    display: block;
    color: var(--lpgdash-text-muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1.2;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-ets {
    font-size: 9px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-input strong {
    font-size: 15px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-delta {
    background: var(--lpgdash-row-line-soft);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-good {
    border-color: var(--lpgdash-up);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-good strong,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-good .lpgbunk-voyage-sub,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-good-text {
    color: var(--lpgdash-up);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-bad {
    border-color: var(--lpgdash-down);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-bad strong,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-bad .lpgbunk-voyage-sub,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-bad-text {
    color: var(--lpgdash-down);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-flat strong,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-flat .lpgbunk-voyage-sub {
    color: var(--lpgdash-text-muted);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-disabled {
    background: var(--lpgdash-row-line-soft);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-disabled strong,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-disabled-text {
    color: var(--lpgdash-text-muted) !important;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 6px;
    align-items: end;
    min-height: 46px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls .lpgbunk-voyage-check {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls .lpgbunk-voyage-check input {
    width: auto;
    height: auto;
    padding: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-assumptions {
    grid-column: 1 / -1;
    color: var(--lpgdash-text-muted);
    font-size: 9.5px;
    font-weight: 700;
    line-height: 1.2;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift-list,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-list,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-list {
    display: grid;
    gap: 5px;
    min-width: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrubber {
    height: 100%;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift-row {
    display: grid;
    grid-template-columns: minmax(auto, 0.5fr) minmax(0, 3fr) minmax(42px, auto);
    gap: 0px;
    align-items: center;
    min-height: 30px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift-port {
    color: var(--lpgdash-brand);
    font-size: 11px;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift-track,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-track {
    min-width: 0;
    border-radius: 4px;
    background: var(--lpgdash-row-line-soft);
    overflow: hidden;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift-bar {
    display: flex;
    justify-content: flex-end;
    min-width: 42px;
    border-radius: 4px;
    background: var(--lpgdash-brand);
    color: var(--lpgdash-surface);
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    padding: 5px 6px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-lift-move {
    justify-self: end;
    font-size: 10px;
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-hero {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-hero strong {
    color: var(--lpgdash-text);
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0;
    line-height: 1;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-hero span {
    color: var(--lpgdash-text-muted);
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-gauge {
    margin: 9px 0 6px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-track {
    position: relative;
    height: 9px;
    border-radius: 999px;
    background: var(--lpgdash-row-line-soft);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-pay,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-now {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-pay i {
    display: block;
    width: 2px;
    height: 18px;
    background: var(--lpgdash-accent);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-pay em {
    position: absolute;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    color: var(--lpgdash-text-muted);
    font-size: 9px;
    font-style: normal;
    font-weight: 800;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-now {
    width: 13px;
    height: 13px;
    border: 2px solid var(--lpgdash-surface);
    border-radius: 999px;
    background: var(--lpgdash-up);
    box-shadow: 0 0 0 1px var(--lpgdash-up);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-scale,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-row,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-head,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-variant-numeric: tabular-nums;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-scale {
    margin-top: 1px;
    color: var(--lpgdash-text-muted);
    font-size: 9px;
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-row {
    min-height: 22px;
    border-bottom: 1px solid var(--lpgdash-row-line);
    font-size: 11px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-row strong {
    min-width: 44px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-row:last-child {
    border-bottom: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-scrub-row span,
.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-head strong {
    color: var(--lpgdash-brand);
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-panel-note {
    margin: 6px 0 0;
    color: var(--lpgdash-text-muted);
    font-size: 9.5px;
    font-weight: 700;
    line-height: 1.25;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-row {
    display: grid;
    gap: 3px;
    padding-bottom: 5px;
    border-bottom: 1px solid var(--lpgdash-row-line);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-row:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-head {
    font-size: 11px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-bars {
    display: grid;
    gap: 3px;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-line {
    display: grid;
    grid-template-columns: minmax(78px, 0.9fr) minmax(0, 3fr);
    font-size: 9.5px;
    font-weight: 800;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-line > span {
    color: var(--lpgdash-text-dim);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-bar {
    min-width: 44px;
    border-radius: 4px;
    color: var(--lpgdash-surface);
    font-size: 9.5px;
    font-weight: 800;
    line-height: 1;
    padding: 4px 5px;
    text-align: right;
    white-space: nowrap;
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-ets {
    background: var(--lpgdash-accent);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-surplus {
    background: var(--lpgdash-up);
}

.lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-reg-penalty {
    background: var(--lpgdash-down);
}

@media (max-width: 1400px) {
    .lpgdash-bunkers .lpgbunk-row[b-f882t3vtyr],
    .lpgdash-bunkers .lpgbunk-row-spot-spreads[b-f882t3vtyr],
    .lpgdash-bunkers .lpgbunk-row-even[b-f882t3vtyr],
    .lpgdash-bunkers .lpgbunk-row-fuel-reg[b-f882t3vtyr] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-controls,
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-main,
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-inputs,
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls {
        grid-template-columns: 1fr 1fr;
    }

    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-layout,
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-spreads-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-hist-controls,
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-main,
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-inputs,
    .lpgdash-bunkers[b-f882t3vtyr]  .lpgbunk-voyage-reg-controls {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/LPG/LpgDashboard/LpgKpiStrip.razor.rz.scp.css */
/* ============================================================
   LpgKpiStrip - scoped styles for the shared KPI tile strip.

   The strip now follows the broker-card pattern from the reference: value
   first, a tiny labelled delta row, then a sparkline. Period/source tags are
   only rendered as fallback when a consumer has no delta row.
   ============================================================ */

.lpgdash-mini-strip[b-53whgstsa8] {
    display: grid;
    background: var(--lpgdash-surface);
    border: 1px solid var(--lpgdash-card-border);
    border-radius: 4px;
}

.lpgdash-mini-cell[b-53whgstsa8] {
    padding: 5px 12px 3px 12px;
    border-right: 1px solid var(--lpgdash-row-line-soft);
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.lpgdash-mini-cell:last-child[b-53whgstsa8] {
    border-right: 0;
}

.lpgdash-mini-top[b-53whgstsa8] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0;
}

.lpgdash-mini-name[b-53whgstsa8] {
    font-size: 10.5px;
    color: var(--lpgdash-brand);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lpgdash-mini-unit[b-53whgstsa8] {
    font-size: 9.5px;
    color: var(--lpgdash-text-muted);
    letter-spacing: 0.4px;
    text-transform: uppercase;
    white-space: nowrap;
}

.lpgdash-mini-mid[b-53whgstsa8] {
    display: flex;
    align-items: baseline;
    margin: 0;
}

.lpgdash-mini-val[b-53whgstsa8] {
    font-size: 22px;
    color: var(--lpgdash-text);
    font-weight: 700;
    letter-spacing: -0.4px;
    line-height: 1.08;
    font-variant-numeric: tabular-nums;
}

.lpgdash-mini-deltas[b-53whgstsa8] {
    display: flex;
    gap: 10px;
    align-items: baseline;
    margin-top: 20px;
    font-size: 10px;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
}

.lpgdash-mini-deltas > span[b-53whgstsa8] {
    display: inline-flex;
    gap: 2px;
    min-width: 0;
}

.lpgdash-mini-delta-label[b-53whgstsa8] {
    color: var(--lpgdash-text);
    font-weight: 1000;
    text-transform: uppercase;
    letter-spacing: -0.25px;
}

/* Delta numbers carry the only real green/red colour cue on the tile.
   Weight bumped to 700 so the colour reads at this small size — at 600
   the teal-green + pink palette washed out into a generic grey. Size and
   letter-spacing unchanged so the strip layout doesn't reflow. */
.lpgdash-mini-deltas .lpgdash-up[b-53whgstsa8],
.lpgdash-mini-deltas .lpgdash-down[b-53whgstsa8] {
    font-size: 10px;
    font-weight: 1000;
    letter-spacing: -0.5px;
}

.lpgdash-mini-deltas .lpgdash-up[b-53whgstsa8] {
    color: var(--lpgdash-up);
}

.lpgdash-mini-deltas .lpgdash-down[b-53whgstsa8] {
    color: var(--lpgdash-down);
}

.lpgdash-mini-tag[b-53whgstsa8] {
    font-size: 8.5px;
    color: var(--lpgdash-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.7px;
    margin-top: 2px;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lpgdash-mini-spark[b-53whgstsa8] {
    height: 80px;
    margin: -65px -4px 0 -4px;
    --lpgdash-kpi-spark-fade-start: 0%;
    --lpgdash-kpi-spark-fade-full: 80%;
    -webkit-mask-image: linear-gradient(
        to right,
        rgba(0, 0, 0, var(--lpgdash-kpi-spark-fade-start)) 0%,
        #000 var(--lpgdash-kpi-spark-fade-full)
    );
    mask-image: linear-gradient(
        to right,
        rgba(0, 0, 0, var(--lpgdash-kpi-spark-fade-start)) 0%,
        #000 var(--lpgdash-kpi-spark-fade-full)
    );
}
/* /Components/Pages/Maintenance/Data/AzureLoad.razor.rz.scp.css */
.tab-bar[b-p8zzbzq4yc] {
    display: flex;
    border-bottom: 2px solid #e0e0e0;
    margin-bottom: 18px;
    background: #f8f9fa;
    border-radius: 8px 8px 0 0;
    overflow-x: auto;
}

.tab-btn[b-p8zzbzq4yc] {
    padding: 12px 32px;
    font-size: 1.08em;
    background: none;
    border: none;
    border-bottom: 3px solid transparent;
    cursor: pointer;
    color: #444;
    font-weight: 500;
    transition: background 0.12s, border-bottom 0.12s, color 0.12s;
    outline: none;
    margin-right: 2px;
    border-radius: 8px 8px 0 0;
}

.tab-btn.active[b-p8zzbzq4yc] {
    border-bottom: 3px solid #0078d4;
    background: #fff;
    color: #0078d4;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.tab-btn:not(.active):hover[b-p8zzbzq4yc] {
    background: #eaf3fb;
    color: #222;
}

.tab-content[b-p8zzbzq4yc] {
    padding: 0;
    min-height: 0;
    height: 100%;
    background: #fff;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
}

.file-list[b-p8zzbzq4yc] {
    height: calc(100vh - 120px);
    overflow-y: auto;
    flex: 1;
    min-height: 0;
}

.container-card[b-p8zzbzq4yc] {
    background: #fafdff;
    border-radius: 8px;
    margin-bottom: 14px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
    padding: 10px 14px;
    border: 1px solid #e0e0e0;
}

.container-summary[b-p8zzbzq4yc] {
    font-weight: 600;
    position: sticky;
    top: 0;
    background: #fafdff;
    z-index: 2;
    padding: 6px 0;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #e0e0e0;
    margin-bottom: 6px;
}

.blob-badge[b-p8zzbzq4yc] {
    background: #0078d4;
    color: white;
    border-radius: 12px;
    padding: 2px 10px;
    font-size: 0.95em;
    margin-left: 4px;
    font-weight: 600;
}

.file-list[b-p8zzbzq4yc]  .search-box {
    margin-bottom: 12px;
    width: 100%;
    max-width: 320px;
    padding: 6px 12px;
    border-radius: 8px;
    border: 2px solid #b5c6d6;
    font-size: 1em;
    background: #fafdff;
    transition: border 0.15s;
}

.file-list[b-p8zzbzq4yc]  .search-box:focus {
    border: 2px solid #0078d4;
    outline: none;
}

#button-group button[b-p8zzbzq4yc],
.blob-list button[b-p8zzbzq4yc] {
    background-color: #F7A506;
    border: none;
    color: white;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    cursor: pointer;
    border-radius: 70px;
    padding: 2px 10px;
    margin: 1px;
    font-size: 0.95em;
    font-weight: 500;
    transition: background 0.12s, color 0.12s;
}

#button-group button:hover[b-p8zzbzq4yc],
.blob-list button:hover[b-p8zzbzq4yc] {
    background-color: #0078d4;
    color: #fff;
}

.blob-list button[style*="color:#a00"][b-p8zzbzq4yc] {
    background: #ffe7e7 !important;
    color: #a00 !important;
}

.blob-list button[style*="color:#007800"][b-p8zzbzq4yc] {
    background: #e7ffe7 !important;
    color: #007800 !important;
}

.blob-list button[style*="color:#004080"][b-p8zzbzq4yc] {
    background: #e7f0ff !important;
    color: #004080 !important;
}

.blob-preview-callout[b-p8zzbzq4yc] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(30, 32, 38, 0.75);
    backdrop-filter: blur(2px);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn-b-p8zzbzq4yc 0.2s;
}

@keyframes fadeIn-b-p8zzbzq4yc {
     from {
         opacity: 0;
     }
     to {
         opacity: 1;
     }
 }

.blob-preview-content[b-p8zzbzq4yc] {
    background: #fff;
    border-radius: 16px;
    padding: 24px 24px 18px 24px;
    max-width: 98vw;
    max-height: 96vh;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1.5px solid #e0e0e0;
    min-width: 350px;
    overflow: auto;
}

.blob-preview-embed[b-p8zzbzq4yc] {
    max-width: 95vw;
    max-height: 90vh;
    min-width: 400px;
    min-height: 400px;
    width: 80vw;
    height: 85vh;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.10);
    border: 1px solid #e0e0e0;
    background: #fafbfc;
    display: block;
    margin: 0 auto;
}

.blob-preview-img[b-p8zzbzq4yc] {
    max-width: 95vw;
    max-height: 85vh;
    width: auto;
    height: auto;
    display: block;
    border-radius: 10px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.10);
    border: 1px solid #e0e0e0;
    background: #fafbfc;
    object-fit: contain;
    margin: 0 auto;
}

.blob-preview-loading[b-p8zzbzq4yc] {
    color: #888;
    font-size: 1.1em;
    margin: 40px 0;
}

.blob-preview-unsupported[b-p8zzbzq4yc] {
    color: #c00;
    font-size: 1.05em;
    margin: 40px 0;
}

.tab-upload-form[b-p8zzbzq4yc] {
    margin-bottom: 18px;
    background: #f8f9fa;
    border-radius: 8px;
    padding: 16px 18px 10px 18px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
}

.file-list table[b-p8zzbzq4yc] {
    background: #fafdff;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

.file-list th[b-p8zzbzq4yc], .file-list td[b-p8zzbzq4yc] {
    padding: 8px 12px;
}

.file-list th[b-p8zzbzq4yc] {
    background: #eaf3fb;
    color: #0078d4;
    font-weight: 600;
    border-bottom: 2px solid #e0e0e0;
}

.file-list tr:nth-child(even)[b-p8zzbzq4yc] {
    background: #f3f8fc;
}

.file-list tr:hover[b-p8zzbzq4yc] {
    background: #eaf3fb;
}
/* /Components/Pages/Maintenance/Data/RouteFormulaUpdate.razor.rz.scp.css */

/* Force height of accordion-bodies */
.formula-content[b-lvrj5hz2n6]  .accordion-body {
    max-height: 70vh;
    overflow-y: auto;
}
.formula-content[b-lvrj5hz2n6]  .text-column {
    text-overflow: ellipsis;
    width: 22%;
}

.formula-content[b-lvrj5hz2n6]  .text-column code {
    color: inherit;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
}

.formula-content[b-lvrj5hz2n6]  .date-column{
    width: 5%;
}

.formula-content[b-lvrj5hz2n6]  .type-column{
    width: 12%;
}

.formula-content[b-lvrj5hz2n6]  .btn-column {
    width: 10%;
}

@media (max-width: 1300px) {
    .formula-content[b-lvrj5hz2n6]  .hide-mobile {
        display: none;
    }

}

/* modal form additions */
[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-green,
[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-yellow,
[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-red {
    width: 100%;
    height: calc(3.5rem + calc(var(--bs-border-width) * 2));
    border-radius: var(--bs-border-radius);
}

[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-green {
    background-color: #FFFFFF;
    color: #91A527;
    border: 1px solid #91A527;
}
[b-lvrj5hz2n6] #EditFormulaForm.form-floating button.ssy-btn-green:hover {
    background-color: #91A527;
    color: #FFFFFF;
    border: 1px solid #91A527;
}

[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-yellow {
    background-color: #FFFFFF;
    color: #F7A506;
    border: 1px solid #F7A506;
}
[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-yellow:hover {
    background-color: #F7A506;
    color: #FFFFFF;
    border: 1px solid #F7A506;
}

[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-red {
    background-color: #FFFFFF;
    color: #DB303A;
    border: 1px solid #DB303A;
}
[b-lvrj5hz2n6] #EditFormulaForm .form-floating button.ssy-btn-red:hover {
    background-color: #DB303A;
    color: #FFFFFF;
    border: 1px solid #DB303A;
}

[b-lvrj5hz2n6] #EditFormulaForm fieldset {
    border-top: 1px dashed lightgrey;
    border-bottom: 1px dashed lightgrey;
}

[b-lvrj5hz2n6] #EditFormulaForm fieldset legend {
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
    font-size: 1.25rem;
}

[b-lvrj5hz2n6] #EditFormulaForm fieldset code {
    font-size: 1.1rem;
    padding: 0.7rem 0.25rem;
    display: inline-block;
    color: inherit;
    border-bottom: 1px dotted black;
    background-color: lightgray;
}
/* /Components/Pages/Maintenance/Data/RouteGroups/RouteDataCheckTable.razor.rz.scp.css */
/* Hide the browser's default checkbox */
.rt-grp-main[b-rumpnruh7t]  .custom-checkbox-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.rt-grp-main[b-rumpnruh7t]  .custom-checkbox-container .custom-checkbox-checkmark {
    height: 15px;
    width: 15px;
    border-radius: 3px;
    background-color: #E7EEF2;
}

/* On mouse-over, add a grey background color */
.rt-grp-main[b-rumpnruh7t]  .custom-checkbox-container:hover input ~ .custom-checkbox-checkmark {
    background-color: #CEDCE4;
}

/.rt-grp-main[b-rumpnruh7t]  .custom-checkbox-container input:checked ~ .custom-checkbox-checkmark {
    background-color: #000061;
}
/* /Components/Pages/Maintenance/Data/RouteGroups/RouteGroups.razor.rz.scp.css */
@media only screen and (max-width: 780px) {
    .rgm-hide-mobile[b-gdve6099wm] {
        display: none !important;
    }
    .rgm-page[b-gdve6099wm] {
        display: flex !important;
        flex-direction: column !important;
    }
    .rgm-choose-group-inputs[b-gdve6099wm] {
        flex-direction: column !important;
        align-items: unset !important;
    }
    .rgm-scroll-table[b-gdve6099wm] {
        height: unset !important;
        width: unset !important;
    }
}

@scope (.rgm-page) {
    :scope[b-gdve6099wm] {
        height: 40vh;
        width: 100%;
        display: grid;
        grid-template-columns: 60% 40%;
        grid-template-rows: 40vh 40vh;
        gap: 35px;
    }

    .rgm-choose-group[b-gdve6099wm], .rgm-group-tree[b-gdve6099wm], .rgm-group-content[b-gdve6099wm], .rgm-add-group[b-gdve6099wm] {
        display: flex;
    }

    .rgm-scroll-table[b-gdve6099wm] {
        height: 100%;
        width: 100%;
        text-align: center;
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #000061 transparent;
        scrollbar-gutter: stable;
        margin-top: 1%;
    }

    .rgm-input[b-gdve6099wm] {
        border: 1px solid #dee2e6;
        border-radius: 4px;
        height: 30px;
        width: 100px;
        padding-left: 5px;
    }

    table[b-gdve6099wm] {
        height: 100%;
        width: 100%;
    }

    thead tr[b-gdve6099wm] {
        width: 100%;
        border: 1px solid #000061;
        background-color: #000061;
        color: white;
    }

    tbody[b-gdve6099wm] {
        /*overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #000061 transparent;
    scrollbar-gutter: stable;*/
    }

        tbody tr[b-gdve6099wm] {
            border-bottom: 1px solid #000061;
        }

            tbody tr:hover[b-gdve6099wm] {
                background-color: #ddebf8 !important;
            }

    td[b-gdve6099wm] {
        border: 1px solid #000061;
        padding: 6px;
    }

        td input[b-gdve6099wm] {
            width: 100%;
            /*border-radius: 10px;
        border: 1px solid navy;
        padding: 0 5px;*/
        }
}

.rgm-hide-mobile[b-gdve6099wm] {
    display: content;
}

.rgm-choose-group[b-gdve6099wm] {
    flex-direction: column;
    position: relative;
    height: 100%;
    width: 100%;
}
.rgm-choose-group-inputs[b-gdve6099wm] {
    display: flex;
    flex-direction: row;
    gap:2rem;
    /* justify-content: space-between;*/
}

.rgm-group-list[b-gdve6099wm] {
    display: flex;
    flex-direction: column;
    height: 98%;
    padding: 15px;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: navy transparent;
    scrollbar-gutter: stable;
}


.rgm-group-tree[b-gdve6099wm] {
    flex-direction: column;
    align-items: center;
    padding-bottom: 10px;
}

.rgm-group-tree-children[b-gdve6099wm] {
    width: 80%;
    /*    margin-top: 30px;*/
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}




.rgm-group-content[b-gdve6099wm] {
    height: 100%;
    width: 100%;
    flex-direction: column;
    position: relative;
}

.rgm-group-content-header[b-gdve6099wm] {
    display: flex;
    flex-direction: row;
    background-color: #000061;
    color: white;
    font-weight: 500;
    height: 7%;
}

.rgm-add-group[b-gdve6099wm] {
    flex-direction: column;
}





@scope (.rgm-modal-edit-table) {
    :scope[b-gdve6099wm] {
        width: 100%;
        height: 100%;
        border: 1px solid #000061;
    }

    thead tr[b-gdve6099wm] {
        width: 100%;
        background-color: #000061;
        color: white;
        border-top: 1px solid #000061;
        border-right: 1px solid #000061;
        border-left: 1px solid #000061;
    }

    tbody[b-gdve6099wm] {
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #000061 transparent;
        scrollbar-gutter: stable;
    }

        tbody tr[b-gdve6099wm] {
            border-bottom: 1px solid #000061;
        }

            tbody tr:hover[b-gdve6099wm] {
                background-color: #ddebf8 !important;
            }

    td[b-gdve6099wm] {
        border: 1px solid #000061;
        padding: 6px;
    }

    input[b-gdve6099wm], textarea[b-gdve6099wm] {
        width: 100%;
        border-radius: 10px;
        border: 1px solid navy;
        padding: 0 5px;
    }
}



.rgm-route-data[b-gdve6099wm] {
    height: 100%;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
/* /Components/Pages/Maintenance/Data/Routes.razor.rz.scp.css */
#filters[b-et89gwx32g] {
    background-color: rgba(134, 119, 84, 0.1);
    border-radius: 8px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    overflow: hidden;
    transition: height 0.25s ease-out;
    padding: 0.5rem 0;
    margin-top: 0.5rem;
}

#routes-table[b-et89gwx32g] {
    width: 100%;
    margin-top: 1.5rem;
    table-layout: fixed;
}

#routes-table thead[b-et89gwx32g] {
    font-weight: bold;
    border-right: 1px solid #009DC9;
    border-left: 1px solid #009DC9;
    text-align: center;
}

#routes-table thead th[b-et89gwx32g] {
    padding: 0.5rem 0;
}

#routes-table td[b-et89gwx32g] {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    border-left: 1px solid black;
}

#routes-table td:first-child[b-et89gwx32g] {
    border-left: 1px solid black;
}

#routes-table td:last-child[b-et89gwx32g] {
    border-right: 1px solid black;
}

#routes-table th.text-column[b-et89gwx32g],
#routes-table td.text-column[b-et89gwx32g]{
    text-align: left;
    padding-left: 0.25rem;
}

.edit-column[b-et89gwx32g]{
    width: 35px;
}

.small-column[b-et89gwx32g] {
    width: 60px;
}

.medium-column[b-et89gwx32g] {
    width: 80px;
}

.pointer[b-et89gwx32g] {
    cursor: pointer;
}

.edit[b-et89gwx32g] {
    text-align: center;
    background: none;
    color: inherit;
    border: none;
    padding: 0.2rem;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

.editIcon1[b-et89gwx32g], .arrowIcon1[b-et89gwx32g] {
    vertical-align: middle;
}

#edit-route[b-et89gwx32g] {
    display: grid;
    grid-template-rows: repeat(4, 1fr);
    grid-template-columns: 1fr 2fr;
    row-gap: 5px;
    padding: 10px;
}
/* /Components/Pages/Maintenance/Data/SsyDataInputs/SsyProcessAdd.razor.rz.scp.css */
@scope (.pr-add-page) {
    :scope[b-3qe133b144] {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        height: 75vh;
    }

    div[b-3qe133b144] {
        width: 100%;
/*        border: 1px solid orange;*/
    }
}

.pr-add-content[b-3qe133b144] {
    height: 84%;
}
.pr-add-name[b-3qe133b144] {
    margin-top: 1%;
}
.pr-add-process[b-3qe133b144] {
    height: 90%;
}

.pr-add-routes[b-3qe133b144] {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    height: 50%;
    width: 100%;
}

.pr-add-routes-single[b-3qe133b144] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 15px;
    width: 47%;
}
.pr-add-routes-group[b-3qe133b144] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 15px 0;
    width: 47%;
}
.pr-add-routes-show[b-3qe133b144] {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    height: 50%;
    width: 100%;
}

.pr-add-datatypes[b-3qe133b144]{
    height: 100%;
}

.pr-add-dtypes-table[b-3qe133b144] {
    height: 90%;
    width: 70%;
    text-align: center;
    padding: 5px;
    border: 1px solid lightblue;
    cursor: pointer;
}

.pr-add-dtypes-table-cell[b-3qe133b144] {
    width: 5vw;
    border: 1px solid lightblue;
}
.pr-add-dtypes-table-cell:hover[b-3qe133b144] {
    background: lightgray !important;
    color: black;
}


.pr-add-freq-default[b-3qe133b144] {
    margin: 15px 0;
    display: flex;
    flex-direction: column;
    width: 100%;
}

.pr-add-confirm-table[b-3qe133b144] {
    height: 100%;

}



.pr-add-footer button[b-3qe133b144] {
    float: right;
}
/* /Components/Pages/Maintenance/Email/EmailDistrib/DistributionLists.razor.rz.scp.css */

.distrib-page-container[b-ji3lc1zyge] {
    height: 1vh;
    display: grid;
    grid-template-columns: 200px 1fr;
}

    .distrib-page-container input[type="search"][b-ji3lc1zyge],
    .distrib-page-container input[type="text"][b-ji3lc1zyge],
    .distrib-page-container input[type="number"][b-ji3lc1zyge],
    .distrib-page-container input[type="select"][b-ji3lc1zyge],
    .distrib-page-container input[type="email"][b-ji3lc1zyge],
    .distrib-page-container select[b-ji3lc1zyge] {
        border-radius: 10px;
        border: 1px solid #1AA3E8;
        margin: 0 10px 10px 0;
        height: 25px;
        padding: 0 5px;
    }
    .distrib-page-container-input[b-ji3lc1zyge] {
        border-radius: 10px;
        border: 1px solid #1AA3E8;
        margin: 0 10px 10px 0;
        height: 25px;
        padding: 0 5px;
    }

        .distrib-page-container input:focus[b-ji3lc1zyge],
        .distrib-page-container select:focus[b-ji3lc1zyge] {
            outline-width: 0;
            box-shadow: 0 0 5px #1AA3E8;
        }

    .distrib-page-container table[b-ji3lc1zyge] {
        table-layout: fixed;
        width: 100%;
        background-color: #FAFAFA;
    }

        .distrib-page-container table tbody tr[b-ji3lc1zyge] {
        }
            .distrib-page-container table tbody tr:hover[b-ji3lc1zyge] {
                cursor: pointer;
                background-color: #DEDEDE;
            }

        .distrib-page-container table tr[b-ji3lc1zyge] {
            background-color: #FAFAFA;
            vertical-align: top;
        }

        .distrib-page-container table thead[b-ji3lc1zyge] {
            position: sticky;
            top: 0;
            background-color: #FAFAFA;
        }

.distrib-sidebar[b-ji3lc1zyge] {
    height: 100%;
    width: 200px;
    background-color: #F3F1EE;
    border-radius: 5px;
    padding: 10px;
}




.distrib-page-container .table-container[b-ji3lc1zyge] {
    height: 700px;
    width: 100%;
    overflow-y: scroll;
    border: 1px solid #DEDEDE;
}

.button-container[b-ji3lc1zyge] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}

.checkbox-container[b-ji3lc1zyge] {
    display: grid;
    grid-template-columns: 150px min-content;
    grid-template-rows: repeat(2, 20px);
    align-items: baseline;
}

.ssy-btn-main[b-ji3lc1zyge] {
    width: 160px;
    white-space: nowrap;
}

    .ssy-btn-main.selected[b-ji3lc1zyge] {
        background-color: #000061 !important;
    }

.vertical-text[b-ji3lc1zyge] {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    text-align: end;
    vertical-align: baseline;
    width: 60px;
    height: 200px;
}

.break-word[b-ji3lc1zyge] {
    overflow-wrap: break-word;
}

.align-right[b-ji3lc1zyge] {
    text-align: right;
}

.user-grid[b-ji3lc1zyge] {
    display: grid;
    grid-template-rows: 50px repeat(6, minmax(30px, min-content));
    grid-template-columns: 1fr 1fr;
    padding: 20px;
    border: 2px solid #F3F1EE;
}

.user-tab .tab-container[b-ji3lc1zyge] {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.small-icon[b-ji3lc1zyge] {
    height: 20px;
}

.distrib-page-container table .icon[b-ji3lc1zyge] {
    width: 25px;
    text-align: center;
}

.distrib-page-container table tr.selected[b-ji3lc1zyge] {
    background-color: #FF6961;
}

.distrib-page-container table td.remove:hover[b-ji3lc1zyge] {
    background-color: #FF6961;
}

.distrib-page-container table td.add:hover[b-ji3lc1zyge] {
    background-color: #FF6961;
}



.user-row[b-ji3lc1zyge] {
    height: 30px;
}

    .user-row *[b-ji3lc1zyge] {
        vertical-align: middle;
    }


.top-tab[b-ji3lc1zyge] {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    width: 100%;
    /*overflow-wrap: normal;*/
}

.company-suggestions[b-ji3lc1zyge] {
    width: auto;
    /*z-index: 10;
    position: absolute;
    top: 23%;*/
    border: 1px solid #ccc;
    padding: 10px;
    margin-top: 10px;
    background-color: #f9f9f9;
    border-radius: 5px;
}

    .company-suggestions p[b-ji3lc1zyge] {
        margin: 5px 0;
        cursor: pointer;
        color: #007bff;
    }

        .company-suggestions p:hover[b-ji3lc1zyge] {
            text-decoration: underline;
        }


.desktop-add-user-modal[b-ji3lc1zyge] {
    display: flex;
    flex-direction: row;
    width: 50%;
    align-items: baseline;
}
@media only screen and (max-width: 992px) {
    .top-tab[b-ji3lc1zyge] {
        flex-direction: column;
    }
    .desktop-add-user-modal[b-ji3lc1zyge] {
        margin-top: 3%;
        flex-direction: column;
    }

    /*.desktop-add-user-modal {
        display: none;
    }
    .mobile-add-user-modal {
        display: flex;
        z-index: 1;
        flex-direction: column;
        align-items: center;
        position: absolute;
        top: 20%;
        left: 15%;
        height: 60%;
        width: 70%;
        padding-top: 10%;
        background-color: gainsboro;
        border: 2px solid gray;
        border-radius: 25px;
    }*/
}

.blockout-confirm-button[b-ji3lc1zyge] {
    background-color: lightgray;
    border-radius: 999px;
    cursor: default;
}

/* /Components/Pages/Maintenance/Email/EmailDistrib/EmailDistrib.razor.rz.scp.css */

.distrib-page-container[b-ava3j2p23s] {
    height: 1vh;

   /* display: grid;
    grid-template-columns: 200px 1fr;*/
}

    .distrib-page-container input[type="search"][b-ava3j2p23s],
    .distrib-page-container input[type="text"][b-ava3j2p23s],
    .distrib-page-container input[type="number"][b-ava3j2p23s],
    .distrib-page-container input[type="select"][b-ava3j2p23s],
    .distrib-page-container select[b-ava3j2p23s] {
        border-radius: 10px;
        border: 1px solid #1AA3E8;
        margin: 0 10px 10px 0;
        height: 25px;
        padding: 0 5px;
    }

        .distrib-page-container input:focus[b-ava3j2p23s],
        .distrib-page-container select:focus[b-ava3j2p23s] {
            outline-width: 0;
            box-shadow: 0 0 5px #1AA3E8;
        }

    .distrib-page-container table[b-ava3j2p23s] {
        table-layout: fixed;
        width: 100%;
        background-color: #FAFAFA;
    }

        .distrib-page-container table tbody tr:hover[b-ava3j2p23s] {
            border-top: 1px solid #DEDEDE;
            border-bottom: 1px solid #DEDEDE;
            cursor: pointer;
        }

        .distrib-page-container table tr[b-ava3j2p23s] {
            background-color: #FAFAFA;
            vertical-align: top;
        }

        .distrib-page-container table thead[b-ava3j2p23s] {
            position: sticky;
            top: 0;
            background-color: #FAFAFA;
        }

.distrib-sidebar[b-ava3j2p23s] {
    height: 100%;
    width: 200px;
    background-color: #F3F1EE;
    border-radius: 5px;
    padding: 10px;
}

.tab[b-ava3j2p23s] {
    height: 100%;
}

.tab-container[b-ava3j2p23s] {
    border: 2px solid #F3F1EE;
    width: 100%;
    padding: 10px;
    gap: 10px;
}

.distrib-page-container .table-container[b-ava3j2p23s] {
    height: 700px;
    width: 100%;
    overflow-y: scroll;
    border: 1px solid #DEDEDE;
}

.button-container[b-ava3j2p23s] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
}

.checkbox-container[b-ava3j2p23s] {
    display: grid;
    grid-template-columns: 150px min-content;
    grid-template-rows: repeat(2, 20px);
    align-items: baseline;
}

.ssy-btn-main[b-ava3j2p23s] {
    width: 160px;
    white-space: nowrap;
}

    .ssy-btn-main.selected[b-ava3j2p23s] {
        background-color: #000061 !important;
    }

.vertical-text[b-ava3j2p23s] {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    text-align: end;
    vertical-align: baseline;
    width: 60px;
    height: 200px;
}

.break-word[b-ava3j2p23s] {
    overflow-wrap: break-word;
}

.align-right[b-ava3j2p23s] {
    text-align: right;
}

.user-grid[b-ava3j2p23s] {
    display: grid;
    grid-template-rows: 50px repeat(6, minmax(30px, min-content));
    grid-template-columns: 1fr 1fr;
    padding: 20px;
    border: 2px solid #F3F1EE;
}

.user-tab .tab-container[b-ava3j2p23s] {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.small-icon[b-ava3j2p23s] {
    height: 20px;
}

.distrib-page-container table .icon[b-ava3j2p23s] {
    width: 25px;
    text-align: center;
}

.distrib-page-container table tr.selected[b-ava3j2p23s] {
    background-color: #FF6961;
}

.distrib-page-container table td.remove:hover[b-ava3j2p23s] {
    background-color: #FF6961;
}

.distrib-page-container table td.add:hover[b-ava3j2p23s] {
    background-color: #FF6961;
}

.initial[b-ava3j2p23s] {
    color: #0366d6;
    font-size: 16px;
    text-decoration: underline;
    margin: 0 3px;
    cursor: pointer;
}

.user-row[b-ava3j2p23s] {
    height: 30px;
}

.user-row *[b-ava3j2p23s] {
    vertical-align: middle;
}
/* /Components/Pages/Maintenance/Email/EmailEditor.razor.rz.scp.css */
/*have to explicity set all the h1 rules to avoid override from email's css*/
.h1-override[b-6c2mmk2n9o] {
    text-align: center;
    font-size: 2.5rem;
    font-weight: normal;
    color: black;
    margin: 0 0 10px 0;
    padding: 0;
    line-height: initial;
    vertical-align: initial;
}

h2[b-6c2mmk2n9o] {
    text-align: center;
}

.page-container[b-6c2mmk2n9o] {
    position: relative
}

.select-container[b-6c2mmk2n9o] {
    margin: 1rem auto;
    background-color: #F3F1EE;
    box-shadow: 2px 2px 10px grey;
    padding: 0 10px 10px 10px;
    border-radius: 5px;
    position: relative;
}

.select-container.select-option-container[b-6c2mmk2n9o] {
    height: 230px;
    max-width: 500px;
}

.select-container.email-service-container[b-6c2mmk2n9o],
.select-container.email-service-log-container[b-6c2mmk2n9o] {
    height: 265px;
}

.select-container.email-service-container h2[b-6c2mmk2n9o],
.select-container.email-service-log-container h2[b-6c2mmk2n9o] {
    background: #F3F1EE;
    padding-top: 10px;
    padding-bottom: 0.5rem;
    /*width: 100vw;*/
    top: 0;
    z-index: 2;
    position: sticky;
}

.select-container.email-service-container[b-6c2mmk2n9o] {
    max-width: 850px;
}

.select-container.email-service-container > table[b-6c2mmk2n9o] {
    margin: auto;
}

.select-container.email-service-log-container > table[b-6c2mmk2n9o] {
    width: 100%;
    table-layout: fixed;
}

.select-container.email-service-log-container > table > thead[b-6c2mmk2n9o] {
    position: sticky;
    top: 3rem;
    z-index: 2;
}

.select-container.email-service-log-container > table td[b-6c2mmk2n9o] {
    overflow: hidden;
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
}

/* For screens smaller than 600px */
@media (max-width: 600px) {
    .select-container.select-option[b-6c2mmk2n9o] {
        max-width: 100%; /* Full width on small screens */
        height: auto; /* Auto height on small screens */
    }
}

@media only screen and (max-width: 775px) {
    .not-on-mobile[b-6c2mmk2n9o] {
        display: none;
    }
}

.button-container[b-6c2mmk2n9o] {
    display: flex;
    align-content: center;
    flex-direction: column;
    gap: 10px;
    height: 50%;
}

.select-button:first-child[b-6c2mmk2n9o] {
    margin-top: 25px;
}

.select-button[b-6c2mmk2n9o] {
    width: 50%;
    margin: 0 auto;
}

.id-input[b-6c2mmk2n9o] {
    display: flex;
    justify-content: space-around;
}

.metadata[b-6c2mmk2n9o] {
    position: absolute;
    top: 0;
    right: 50px;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.value[b-6c2mmk2n9o] {
    text-align: right;
}

[b-6c2mmk2n9o] .build-container {
    display: grid;
    grid-template-rows: min-content 630px min-content;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    height: 70vh;
}

.build-form-container[b-6c2mmk2n9o] {
    display: flex;
    justify-content: space-around;
    grid-column: 1/3;
}

.page-container input[b-6c2mmk2n9o] {
    width: 200px;
}

.html-box[b-6c2mmk2n9o] {
    position: relative;
    display: grid;
    grid-template-rows: min-content 1fr;
}

.editor[b-6c2mmk2n9o] {
    resize: none;
}

[b-6c2mmk2n9o] .dist-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 200px 1fr;
    gap: 5px;
    height: 70vh;
    justify-items: center;
    padding-top: 10px;
}

.display-container[b-6c2mmk2n9o] {
    padding: 10px;
    border: 1px solid #4F4F4F;
    background: white;
    overflow-y: auto;
    scrollbar-gutter: stable;
    width: 100%;
}

.review-container[b-6c2mmk2n9o] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-template-rows: 700px 1fr;
    gap: 10px;
    height: 70vh;
}

.review-info-container[b-6c2mmk2n9o] {
    display: grid;
    margin-top: 17px;
    grid-template-columns: 125px 1fr;
    grid-template-rows: repeat(6, min-content);
}

.review-info-container > *[b-6c2mmk2n9o] {
    margin: 10px 0;
    padding: 5px;
}

.review-info-container > *:nth-child(even)[b-6c2mmk2n9o] {
    border: transparent;
    background-color: #F3F1EE;
    border-radius: 5px;
}

.copy-html[b-6c2mmk2n9o] {
    position: absolute;
    top: 33px;
    right: 7px;
}

.arrow-container[b-6c2mmk2n9o] {
    display: flex;
    justify-content: space-between;
    grid-column: 1/3;
    align-items: end;
    width: 100%;
}

.form-button:hover[b-6c2mmk2n9o] {
    cursor: pointer;
    background-color: #F3F1EE;
    border-radius: 5px;
}

.item-row .form-button:hover[b-6c2mmk2n9o] {
    background-color: #FE908F;
}

.clear-button-style[b-6c2mmk2n9o],
.clear-button-style:focus[b-6c2mmk2n9o] {
    border: none;
    background: none;
    outline: none;
}

.height-fit-content[b-6c2mmk2n9o] {
    height: fit-content;
}

.small-button[b-6c2mmk2n9o] {
    height: 20px;
}

.item-row[b-6c2mmk2n9o] {
    border-bottom: 1px solid #F3F1EE;
    padding: 0 10px;
    display: flex;
    justify-content: space-between;
}

.item-row:hover[b-6c2mmk2n9o] {
    background-color: #F3F1EE;
    border-radius: 5px;
}

.warning[b-6c2mmk2n9o] {
    display: none;
    background-color: #FE908F;
    padding: 0 6px;
}

input[type='file'][b-6c2mmk2n9o] {
    color: transparent;
}

#input-file-name[b-6c2mmk2n9o] {
    height: 20px;
}

#file-name[b-6c2mmk2n9o] {
    cursor: pointer;
}

.send[b-6c2mmk2n9o] {
    position: absolute;
    top: 3px;
    right: 185px;
}

.remove-all[b-6c2mmk2n9o] {
    grid-column: 2;
    justify-self: end;
    background-color: #F3F1EE;
    height: max-content;
    padding: 5px;
    border-radius: 5px;
}

.remove-all:hover[b-6c2mmk2n9o] {
    background-color: #FE908F;
    text-decoration: underline;
    cursor: pointer;
}

.popup[b-6c2mmk2n9o] {
    height: 250px;
    width: 500px;
    padding: 10px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: start;
}

.popup .button-container[b-6c2mmk2n9o] {
    display: flex;
    justify-content: end;
    gap: 10px;
    flex-direction: row;
    margin-top: 10px;
    height: 33px;
}

.popup input[b-6c2mmk2n9o] {
    width: initial;
}

.email-table[b-6c2mmk2n9o] {
    width: 100%;
    border-collapse: collapse;
}

.email-table th[b-6c2mmk2n9o], .email-table td[b-6c2mmk2n9o] {
    border: 1px solid #ddd;
    padding: 8px;
}

.email-table th[b-6c2mmk2n9o] {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: #0079c1;
    color: white;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/BasicView/Comps/GkPackages.razor.rz.scp.css */
body[b-7bzfprh825] {
}
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/BasicView/Comps/GkRequests.razor.rz.scp.css */
.gk-section-btn[b-ak4rehov24] {
    cursor: pointer;
    margin-left: 1%;
    border-radius: 16px;
    padding: 8px 0;
    width: 25%;
    text-align: center;
    font-size: 1.05em;
    background-color: #F0F0F0;
    border: 1px solid lightgray;
    transition: background-color 0.4s ease;
    user-select: none;
}
    .gk-section-btn:hover[b-ak4rehov24] {
        background-color: #C2E7F2;
        color: black;
    }

.selected[b-ak4rehov24] {
    background-color: #000061 !important;
    color: white !important;
    border: 1px solid navy !important;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/BasicView/Comps/GkUserInfo.razor.rz.scp.css */
body[b-kzxtk8obvg] {
}
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/BasicView/GkBasicView.razor.rz.scp.css */
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/Comps/GkAddUserMob.razor.rz.scp.css */
.gk-action-btn[b-i84ppycbnh] {
    height: 25px;
    width: 25px;
    margin: 5% 0;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-weight: 500;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/Comps/GkFullView.razor.rz.scp.css */
info-box[b-87xwqr9myg] {
    height: 90%;
    border: 1px solid #000061;
    border-radius: 5px;
    padding: 1%;
    margin: 1%;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/Comps/MenuDisplay.razor.rz.scp.css */
/* styles of menu items when editing */
.not-permd[b-hlcejfsiqp] {
    opacity: 0.6;
    cursor: pointer;
}

.permd[b-hlcejfsiqp] {
    cursor: pointer;
}

.child-permd[b-hlcejfsiqp] {
    color: #3030a9;
    /*    font-style: italic;*/
    pointer-events: none;
}
.always-permd[b-hlcejfsiqp] {
    color: darkgreen;
    font-weight: 500;
    pointer-events: none;
}


/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/Comps/RoleGroupMng.razor.rz.scp.css */
/* /Components/Pages/Maintenance/MenuAndPermissions/Gatekeeper/Gatekeeper.razor.rz.scp.css */
.gk-main[b-5u83hzwn41] {
    display: flex;
    flex-direction: column;
    height: 88vh;
    width: 98%;
    margin: 0.5% 1%;
}

.info-box[b-5u83hzwn41] {
    height: 90%;
    border: 1px solid #000061;
    border-radius: 5px;
    padding: 1%;
    margin: 1%;
}
.gk-web-view[b-5u83hzwn41] {
    display: flex !important;
}

.gk-mob-view[b-5u83hzwn41] {
    display: none !important;
}

@media only screen and (max-width: 780px) {
    .gk-web-view[b-5u83hzwn41] {
        display: none !important;
    }

    .gk-mob-view[b-5u83hzwn41] {
        display: flex !important;
    }
}

.gk-main[b-5u83hzwn41]  .custom-checkbox-container {
    display: flex;
    align-items: center;
    width: 100%;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    /* Hide the browser's default checkbox */
    .gk-main[b-5u83hzwn41]  .custom-checkbox-container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 0;
        width: 0;
    }

    /* Create a custom checkbox */
    .gk-main[b-5u83hzwn41]  .custom-checkbox-container .custom-checkbox-checkmark {
        height: 15px;
        width: 15px;
        border-radius: 3px;
        background-color: #E7EEF2;
    }

    /* On mouse-over, add a grey background color */
    .gk-main[b-5u83hzwn41]  .custom-checkbox-container:hover input ~ .custom-checkbox-checkmark {
        background-color: #CEDCE4;
    }

    /* When the checkbox is checked, add a blue background */
    .gk-main[b-5u83hzwn41]  .custom-checkbox-container input:checked ~ .custom-checkbox-checkmark {
        background-color: #000061;
    }
/* /Components/Pages/Maintenance/MenuAndPermissions/MenuManager.razor.rz.scp.css */
.page-cont[b-puwo639tj7] {
    margin-top: 2%;
    display: flex;
    flex-direction: row;
    font-size: 1.2rem;
}

.contr-cont[b-puwo639tj7] {
    width: 9%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.confirm-changes-modal[b-puwo639tj7] {
    z-index: 10;
    position: fixed;
    background-color: white;
    border: 2px solid #000061;
    border-radius: 10px;
    width: fit-content;
    max-width: 25%;
    top: 33.5%;
    left: 20.5%;
    transform: translate(-50%, -50%);
    margin-top: 1%;
    padding: 2%;
    display: flex;
    flex-direction: column;
}

.changes-list[b-puwo639tj7] {
    margin: 5% 0 5% 0;
    height: 30vh;
    width: 17vw;
    overflow-y: scroll;
    border: 2px solid navy;
    border-radius: 10px;
    padding: 3%;
}

.edit-btn[b-puwo639tj7] {
    margin-top: 10%;
    height: 4vh;
    width: 80%;
    border-radius: 15px;
    background-color: #000061;
    border: 2px solid #000061;
    color: white;
}

.edit-btn:hover[b-puwo639tj7] {
    background-color: white;
    color: #000061;
}

.no-changes-btn[b-puwo639tj7] {
    opacity: 0.4;
    margin-top: 10%;
    height: 4vh;
    width: 80%;
    border-radius: 15px;
    background-color: #000061;
    border: 2px solid #000061;
    color: white;
    cursor: default;
    text-align: center;
    align-content: center;
}

.menu-page-cont[b-puwo639tj7] {
    border: 2px solid #000061;
    width: 90%;
}

.undo-btn[b-puwo639tj7] {
    margin-left: 10%;
    background: white !important;
    border: 1px solid lightgray !important;
    border-radius: 10px !important;
}

.undo-btn:hover[b-puwo639tj7] {
    background-color: gray !important;
    color: white;
}

.changes-btn[b-puwo639tj7] {
    background: #000061 !important;
    border: 1px solid #000061 !important;
    border-radius: 10px !important;
    color: white;
}

.changes-btn:hover[b-puwo639tj7] {
    background-color: white !important;
    color: black;
}

.headers-cont[b-puwo639tj7] {
    display: flex;
    flex-direction: row;
    justify-content: right;
    background-color: #000061;
    padding: 0.5% 0 0.5% 0;
    height: 5vh;
}

.headers-cont .headers-cont-container[b-puwo639tj7]{
    align-content: center;
    border-right: 2px solid white;
}
.headers-cont .headers-cont-container:last-child[b-puwo639tj7]{
    border-right: none;
}

.header-btn[b-puwo639tj7] {
    align-content: center;
    text-align: center;
    color: white;
    font-size: 1.2rem;
    margin: 0 1rem;
}

.header-btn:hover[b-puwo639tj7] {
    cursor: pointer;
    border-bottom: 1px solid white;
    transition: all 1s ease-in-out;
}

.hover-menu-cont[b-puwo639tj7] {
    z-index: 10;
    display: flex;
    flex-direction: column;
    position: absolute;
    background: white;
    border: 2px solid #000061;
    border-radius: 20px;
    padding: 0.5%;
    height: 30vh;
    width: 18vw;
    overflow-y: scroll;
}

.hover-menu-cont button[b-puwo639tj7] {
    width: 99%;
    border: none;
    background: none;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 1.1rem;
}

.hover-menu-cont button:hover[b-puwo639tj7] {
    background-color: #F7F6F6;
}

.menu-items-cont[b-puwo639tj7] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    height: 82vh;
}

.menu-cont[b-puwo639tj7] {
    display: flex;
    flex-direction: column;
    margin: 0 0.5% 0 0.5%;
    padding-bottom: 0.5%;
    padding-right: 0.5%;
    width: 16vw;
    border-right: 2px solid #000061;
}

.menu-cont button[b-puwo639tj7] {
    width: 99%;
    border: none;
    background: none;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 1.1rem;
}

.menu-cont button:hover[b-puwo639tj7] {
    background-color: #F7F6F6;
}

.add-menu-cont[b-puwo639tj7] {
}

.add-menu-cont button[b-puwo639tj7] {
    border-radius: 20px;
    width: 100%;
    margin-bottom: 2%;
    background-color: #000061;
    color: #FCFCFC;
    border: 2px solid #000061;
}

.add-menu-cont button:hover[b-puwo639tj7] {
    color: #000061;
    background-color: white;
}

.add-menu-selections[b-puwo639tj7] {
    background-color: navy;
    border-radius: 5px;
    padding: 2% 3% 3% 3%;
    color: white;
}

.add-menu-selections button[b-puwo639tj7] {
    margin-top: 5%;
    background-color: #EAEAEA;
    color: black;
}

.unused-cont[b-puwo639tj7] {
    display: flex;
    flex-direction: column;
    width: 20vw;
    background-color: #000079;
    border-radius: 15px;
    margin: 1%;
    padding: 1%;
    overflow: hidden;
}

.unused-table[b-puwo639tj7] {
    height: 31vh;
    overflow-y: auto;
    margin-top: 1vh;
    background-color: white;
    border: 2px solid #000061;
    /* border-radius: 8px; */
    padding: 1%;
}

.unused-table button[b-puwo639tj7] {
    width: 100%;
    border: none;
    background: none;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    font-size: 1.1rem;
}

.unused-table button:hover[b-puwo639tj7] {
    background: lightgray;
    border-radius: 5px;
}

.selected-cont[b-puwo639tj7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow-y: auto;
    border-left: 2px solid #000061;
    width: 30vw;
    padding-top: 1%;
    padding-bottom: 2%;
}

.selected-item-cont[b-puwo639tj7] {
    width: 23vw;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/RoleRouteAccess.razor.rz.scp.css */
.first-level-container[b-5iujuotzv5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.first-level-container > button[b-5iujuotzv5] {
    width: 140px;
}

.second-level-container[b-5iujuotzv5] {
    padding-top: 0.5rem;
    display: flex;
    justify-content: space-between;
}
.second-level-container .second-level-filters[b-5iujuotzv5] {
    display: flex;
    align-items: center;
}
.second-level-container .second-level-filters.order-div-1[b-5iujuotzv5] {
    width: 100%;
    justify-content: center;
}
.second-level-container .second-level-filters > div[b-5iujuotzv5] {
    min-width: 200px;
}
.second-level-container .second-level-filters > div:not(:last-child)[b-5iujuotzv5] {
    margin-right: 0.5rem;
}
.order-div-0[b-5iujuotzv5] {
    order: 0;
}
.order-div-1[b-5iujuotzv5] {
    order: 1;
}
.order-div-2[b-5iujuotzv5] {
    order: 2;
}

.content-container[b-5iujuotzv5] {
    padding-top: 0.5rem;
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: 2fr 1fr 2fr;
}
.content-container > .table-container[b-5iujuotzv5]{
    height: calc(100vh - 250px);
    border: 1px solid #DEDEDE;
}
.content-container > .table-container:not(:first-child):not(:last-child)[b-5iujuotzv5] {
    border-left: none;
    border-right: none;
    scrollbar-gutter: stable both-edges;
}

.content-container > .table-container table[b-5iujuotzv5] {
    table-layout: fixed;
    width: 100%;
}
.content-container > .table-container table thead[b-5iujuotzv5] {
    position: sticky;
    top: 0;
    background-color: #FAFAFA;
    z-index: 2;
}
.content-container > .table-container table tbody tr[b-5iujuotzv5] {
    border-top: 1px solid #DEDEDE;
    border-bottom: 1px solid #DEDEDE;
}
.content-container > .table-container table tbody tr:hover[b-5iujuotzv5] {
    background: #DEDEDE;
    cursor: pointer;
}
.content-container > .table-container table tr[b-5iujuotzv5] {
    background-color: #FAFAFA;
    vertical-align: top;
}
.table-container table tr.selected[b-5iujuotzv5] {
    background-color: #DEDEDE;
}
.table-container table .break-word[b-5iujuotzv5] {
    overflow-wrap: break-word;
}
.table-container table .icon[b-5iujuotzv5] {
    width: 35px;
    text-align: center;
    position: relative;
}
.table-container.order-div-0 table .icon[b-5iujuotzv5] {
    display: none;
}
.table-container table .icon[b-5iujuotzv5]  svg {
    vertical-align: middle;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.table-container table .group[b-5iujuotzv5] {
    width: 100px;
}
.table-container table td.remove:hover[b-5iujuotzv5] {
    background-color: #FF6961;
}
.table-container table td.add:hover[b-5iujuotzv5] {
    background-color: #8CD47E;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/UrlComp/UrlCompManager_00.razor.rz.scp.css */
.url-comp-manager[b-4dq6hwrio0]  .title-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.url-comp-manager[b-4dq6hwrio0]  .title-container > .title-outer-section {
    width: 500px;
}

.url-comp-manager[b-4dq6hwrio0]  .title-container > .title-outer-section.title-explaination {
    display: inline-flex;
    justify-content: end;
}

.url-comp-manager[b-4dq6hwrio0]  .tabs-container {
    border-top: 1px solid #DEDEDE;
    padding-top: 0.5rem;
    margin: 0.5rem 0;
}

.url-comp-manager[b-4dq6hwrio0]  .first-level-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.url-comp-manager[b-4dq6hwrio0]  .first-level-container > div {
    display: inline-flex;
    align-items: center;
}
.url-comp-manager[b-4dq6hwrio0]  .first-level-container > div > button {
    width: 140px;
}
.url-comp-manager[b-4dq6hwrio0]  .first-level-container > div > button:not(:last-child) {
    margin-right: 0.5rem;
}

.url-comp-manager[b-4dq6hwrio0]  .second-level-container {
    padding-top: 0.5rem;
    display: flex;
    justify-content: space-between;
}
.url-comp-manager[b-4dq6hwrio0]  .second-level-container .second-level-filters {
    display: flex;
    align-items: center;
}
.url-comp-manager[b-4dq6hwrio0]  .second-level-container .second-level-filters > div {
    margin-right: 0.5rem;
    min-width: 200px;
}
.url-comp-manager[b-4dq6hwrio0]  .order-div-0 {
    order: 0;
}
.url-comp-manager[b-4dq6hwrio0]  .order-div-1 {
    order: 1;
}
.url-comp-manager[b-4dq6hwrio0]  .order-div-2 {
    order: 2;
}

.url-comp-manager[b-4dq6hwrio0]  .content-container {
    padding-top: 0.5rem;
    display: grid;
    grid-template-rows: 1fr;
    grid-template-columns: 2fr 1fr 2fr;
}
.url-comp-manager[b-4dq6hwrio0]  .content-container > .table-container{
    height: calc(100vh - 250px);
    border: 1px solid #DEDEDE;
}
.url-comp-manager[b-4dq6hwrio0]  .content-container > .table-container:not(:first-child):not(:last-child) {
    border-left: none;
    border-right: none;
    scrollbar-gutter: stable both-edges;
}

.url-comp-manager[b-4dq6hwrio0]  .content-container > .table-container table {
    table-layout: fixed;
    width: 100%;
}

.url-comp-manager[b-4dq6hwrio0]  .content-container > .table-container table thead {
    position: sticky;
    top: 0;
    background-color: #FAFAFA;
    z-index: 2;
}

.url-comp-manager[b-4dq6hwrio0]  .content-container > .table-container table tbody tr {
    border-top: 1px solid #DEDEDE;
    border-bottom: 1px solid #DEDEDE;
}
.url-comp-manager[b-4dq6hwrio0]  .content-container > .table-container table tbody tr:hover {
    background: #DEDEDE;
    cursor: pointer;
}

.url-comp-manager[b-4dq6hwrio0]  .content-container > .table-container table tr {
    background-color: #FAFAFA;
    vertical-align: top;
}

.url-comp-manager[b-4dq6hwrio0]  .table-container table tr.selected {
    background-color: #DEDEDE;
}

.url-comp-manager[b-4dq6hwrio0]  .table-container table .break-word {
    overflow-wrap: break-word;
}

.url-comp-manager[b-4dq6hwrio0]  .table-container table .icon {
    width: 35px;
    text-align: center;
    position: relative;
}

.url-comp-manager[b-4dq6hwrio0]  .table-container.order-div-0 table .icon {
    display: none;
}

.url-comp-manager[b-4dq6hwrio0]  .table-container table .icon ::deep svg {
    vertical-align: middle;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}

.url-comp-manager[b-4dq6hwrio0]  .table-container table .group {
    width: 100px;
}

.url-comp-manager[b-4dq6hwrio0]  .table-container table td.remove:hover {
    background-color: #FF6961;
}

.url-comp-manager[b-4dq6hwrio0]  .table-container table td.add:hover {
    background-color: #8CD47E;
}

/* fix form styling */
.url-comp-manager[b-4dq6hwrio0]  .form-floating > .autocomplete > .input-group {
    margin-left: 0;
}

.url-comp-manager[b-4dq6hwrio0]  .form-floating > .autocomplete > .input-group > input.form-control {
    padding-top: 1.625rem;
    padding-bottom: .625rem;
    padding-left: .75rem;
    /* --bs-border-width: 1px; */
    height: calc(3.5rem + calc(1px * 2));
    min-height: calc(3.5rem + calc(1px * 2));
    line-height: 1.25;
}

.url-comp-manager[b-4dq6hwrio0]  .form-floating > .autocomplete:has(.input-group > .form-control:not(:placeholder-shown))~label{
    /* --bs-body-color-rgb: 33, 37, 41; */
    color: rgba(33, 37, 41, .65);
    transform: scale(.85) translateY(-.5rem) translateX(.15rem);
}

.url-comp-manager[b-4dq6hwrio0]  .form-floating > .autocomplete > .input-group > button {
    top: 50% !important;
    transform: translateX(-5%) translateY(-50%);
    background-color: unset;
}

.url-comp-manager[b-4dq6hwrio0]  .form-floating > .autocomplete > .input-group > button:hover {
    color: #DB303A;
}

/* fix footer */
.url-comp-manager[b-4dq6hwrio0]  .modal-footer:has(> button):has(.d-flex) {
    justify-content: space-between;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/UrlComp/UrlCompManager_40_DefaultUrlRole.razor.rz.scp.css */
.edit[b-y8ud8le6k4] {
    text-align: center;
    background: none;
    color: inherit;
    border: none;
    padding: 0.2rem;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

.editIcon1[b-y8ud8le6k4], .arrowIcon1[b-y8ud8le6k4] {
    vertical-align: middle;
}
/* /Components/Pages/Maintenance/MenuAndPermissions/UserRoles/UserRoles.razor.rz.scp.css */
/* =============================== */
/*             TAB LIST            */
/* =============================== */
.user-roles-manager[b-jala9zzcpo]  .title-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #DEDEDE;
    margin-bottom: 0.5rem;
}
.user-roles-manager[b-jala9zzcpo]  .title-container > .title-outer-section {
    width: 550px;
}

.user-roles-manager .tab-container[b-jala9zzcpo] {
    padding: 0 0.25rem;
}

/* =============================== */
/*   General                        */
/* =============================== */
.user-roles-manager[b-jala9zzcpo]  input[type="search"],
.user-roles-manager[b-jala9zzcpo]  input[type="text"],
.user-roles-manager[b-jala9zzcpo]  input[type="number"],
.user-roles-manager[b-jala9zzcpo]  input[type="select"],
.user-roles-manager[b-jala9zzcpo]  select {
    border-radius: 10px;
    border: 1px solid #1AA3E8;
    height: 25px;
    padding: 0 5px;
    max-width: 200px;
    background: white;
}

.user-roles-manager[b-jala9zzcpo]  input:focus,
.user-roles-manager[b-jala9zzcpo]  select:focus {
    outline-width: 0;
    box-shadow: 0 0 5px #1AA3E8;
}

/* stupid lastpass */
.user-roles-manager[b-jala9zzcpo]  div[data-lastpass-icon-root]{
    display: none !important;
}

.is-ssy[b-jala9zzcpo], .red[b-jala9zzcpo] {
    padding: 0 5px;
    font-weight: bold;
    color: black;
}

.is-ssy[b-jala9zzcpo] {
    background-color: #8CD47E;
}

.red[b-jala9zzcpo] {
    background-color: #FF6961;
}

.small-icon[b-jala9zzcpo] {
    height: 20px;
}
.user-roles-manager[b-jala9zzcpo]  .icon {
    text-align: center;
}
.break-word[b-jala9zzcpo] {
    overflow-wrap: break-word;
}

[b-jala9zzcpo] .form-check-input[data-ssy-disabled="true"],
[b-jala9zzcpo] input.form-control[data-ssy-disabled="true"] {
    pointer-events: none;
}

/* =============================== */
/*   Layout                         */
/* =============================== */
.user-roles-manager .first-level-container[b-jala9zzcpo],
.user-roles-manager .second-level-container[b-jala9zzcpo] {
    height: 40px;
    display: grid;
}

.user-roles-manager .users-tab .first-level-container[b-jala9zzcpo],
.user-roles-manager .users-tab .second-level-container[b-jala9zzcpo] {
    grid-template-columns: 2fr 2fr 3fr;
}
.user-roles-manager .roles-tab .first-level-container[b-jala9zzcpo],
.user-roles-manager .roles-tab .second-level-container[b-jala9zzcpo] {
    grid-template-columns: 3fr 2fr 2fr;
}

.user-roles-manager .departmental-tab .first-level-container[b-jala9zzcpo],
.user-roles-manager .departmental-tab .second-level-container[b-jala9zzcpo] {
    grid-template-columns: 2fr 3fr 2fr;
}

.user-roles-manager .claims-tab .first-level-container[b-jala9zzcpo],
.user-roles-manager .claims-tab .second-level-container[b-jala9zzcpo] {
    grid-template-columns: 2fr 5fr;
}

.user-roles-manager .first-level-container .user-title-container[b-jala9zzcpo] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.user-roles-manager .first-level-container .checkbox-stack-container[b-jala9zzcpo],
.user-roles-manager .second-level-container .checkbox-stack-container[b-jala9zzcpo]{
    display: flex;
    flex-direction: column;
    align-items: start;
}

.user-roles-manager .first-level-container .actions-container[b-jala9zzcpo], 
.user-roles-manager .second-level-container .actions-container[b-jala9zzcpo]
{
    display: flex;
    justify-self: flex-start;
    justify-content: center;
    align-items: center;
    margin: 0;
}
.user-roles-manager .first-level-container .actions-container figcaption[b-jala9zzcpo],
.user-roles-manager .second-level-container .actions-container figcaption[b-jala9zzcpo] {
    font-weight: bold;
    font-size: 1.1rem;
}
.user-roles-manager .first-level-container .actions-container ul[b-jala9zzcpo],
.user-roles-manager .second-level-container .actions-container ul[b-jala9zzcpo] {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}
.user-roles-manager .first-level-container .actions-container ul li[b-jala9zzcpo],
.user-roles-manager .second-level-container .actions-container ul li[b-jala9zzcpo] {
    padding-left: 5px;
}

.user-roles-manager .second-level-container .filters-container[b-jala9zzcpo] {
    display: flex;
    align-items: center;
    gap: 5px;
}
.user-roles-manager .second-level-container .filters-container:last-child[b-jala9zzcpo] {
    justify-content: flex-end;
}

.user-roles-manager .departmental-tab .second-level-container .selected-container[b-jala9zzcpo] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* =============================== */
/*  Content containers              */
/* =============================== */
.user-roles-manager .users-tab .content-container[b-jala9zzcpo],
.user-roles-manager .roles-tab .content-container[b-jala9zzcpo],
.user-roles-manager .claims-tab .content-container[b-jala9zzcpo]
{
    display: grid;
}

.user-roles-manager .users-tab .content-container[b-jala9zzcpo] {
    grid-template-columns: 2fr 2fr 3fr;
}
.user-roles-manager .roles-tab .content-container[b-jala9zzcpo] {
    grid-template-columns: 3fr 2fr 2fr;
}
.user-roles-manager .claims-tab .content-container[b-jala9zzcpo] {
    grid-template-columns: 2fr 5fr;
}

.user-roles-manager .table-container[b-jala9zzcpo] {
    height: calc(100vh - 200px);
    border: 1px solid #DEDEDE;
    position: relative;
}

.user-roles-manager .content-container .table-container:nth-child(2)[b-jala9zzcpo] {
    border-left: none;
    border-right: none;
    scrollbar-gutter: stable both-edges;
}

/* =============================== */
/*  Tables  Styling                */
/* =============================== */
.user-roles-manager .table-caption[b-jala9zzcpo] {
    font-weight: normal;
    background-color: #000061;
    color: white;
}

.user-roles-manager table[b-jala9zzcpo] {
    table-layout: fixed;
    width: 100%;
    background-color: #FAFAFA;
}

.user-roles-manager table thead[b-jala9zzcpo] {
    position: sticky;
    top: 0;
    background-color: #FAFAFA;
}

.user-roles-manager table tr:not(.red)[b-jala9zzcpo] {
    background-color: #FAFAFA;
    vertical-align: top;
}

.user-roles-manager[b-jala9zzcpo]  table.quickgrid[theme=ssy-table-dw] tbody tr:has(span.selected) {
    background-color: #DEDEDE;
    font-weight: bold;
}

.user-roles-manager[b-jala9zzcpo]  table tbody tr:hover {
    border-top: 1px solid #DEDEDE;
    border-bottom: 1px solid #DEDEDE;
}
.user-roles-manager .content-container .table-container:first-child[b-jala9zzcpo]  table tbody tr:hover td,
.user-roles-manager .content-container .table-container:not(:first-child)[b-jala9zzcpo]  table tbody td:has(.icon):hover {
    cursor: pointer;
}

.user-roles-manager[b-jala9zzcpo]  table .remove:hover {
    background-color: #FF6961;
}

.user-roles-manager[b-jala9zzcpo]  table .add:hover {
    background-color: #8CD47E;
}

.user-roles-manager[b-jala9zzcpo]  table .edit:hover
{
    background-color: #F7A506;
}

.user-roles-manager[b-jala9zzcpo]  table[theme="ssy-table-dw"] tr th > .col-header-content > span,
.user-roles-manager[b-jala9zzcpo]  table[theme="ssy-table-dw"] tr td > span:not(.cover-area) {
    width: 100%;
    height: 100%;
    display: inline-block;
}

/* force names to be correct width important for virtualization */
.user-roles-manager .departmental-tab[b-jala9zzcpo]  table[theme="ssy-table-dw"] tr td > span.departmental-name {
    width: 250px;
    display: inline-flex;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    
}

/* custom sticky table */
.user-roles-manager .departmental-tab[b-jala9zzcpo]  table thead {
    position: sticky;
    top: 0;
    z-index: 2;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  table .sticky-col {
    position: sticky;
    left: 252px;
    width: 252px;
    z-index: 1;
    background: inherit;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  table thead .sticky-col {
    z-index: 3;
    background: #000061;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  table .sticky-col:first-child {
    left: 0;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  th button.col-title{
    border: none;
    background: none;
    position: relative;
    cursor: pointer;
}
.user-roles-manager .users-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .users-tab[b-jala9zzcpo]  th .col-header-content .col-title,
.user-roles-manager .roles-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .roles-tab[b-jala9zzcpo]  th .col-header-content .col-title,
.user-roles-manager .departmental-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .departmental-tab[b-jala9zzcpo]  th .col-header-content .col-title,
.user-roles-manager .claims-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .claims-tab[b-jala9zzcpo]  th .col-header-content .col-title {
    display: flex;
    justify-content: center;
    align-items: center;
    
}

.user-roles-manager .users-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .users-tab[b-jala9zzcpo]  th .col-header-content .col-title,
.user-roles-manager .roles-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .roles-tab[b-jala9zzcpo]  th .col-header-content .col-title,
.user-roles-manager .claims-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .claims-tab[b-jala9zzcpo]  th .col-header-content .col-title{
    justify-content: flex-start;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  th .col-header-content,
.user-roles-manager .departmental-tab[b-jala9zzcpo]  th .col-header-content .col-title {
    height: 150px;
    width: 100%;
    align-items: end;
}

.user-roles-manager .users-tab[b-jala9zzcpo]  th .col-header-content .col-title .sort-indicator,
.user-roles-manager .roles-tab[b-jala9zzcpo]  th .col-header-content .col-title .sort-indicator,
.user-roles-manager .claims-tab[b-jala9zzcpo]  th .col-header-content .col-title .sort-indicator,
.user-roles-manager .departmental-tab[b-jala9zzcpo]  th:not(.department-vertical-text) .col-header-content .col-title .sort-indicator {
    align-self: end;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  th.department-vertical-text .col-header-content .col-title {
    flex-direction: column;
    justify-content: flex-end;
}

/* force names to be correct width, and vertical. important for virtualization */
.user-roles-manager .departmental-tab[b-jala9zzcpo]  th.department-vertical-text .col-title-text {
    writing-mode: sideways-lr;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-height: calc(150px - 1rem);
}

.user-roles-manager[b-jala9zzcpo]  table[theme="ssy-table-dw"] tr {
    position: relative;
}

.user-roles-manager[b-jala9zzcpo]  table[theme="ssy-table-dw"] tr .cover-area {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}


.user-roles-manager .departmental-tab[b-jala9zzcpo]  td .ssy-custom-checkbox-container .ssy-custom-checkbox-checkmark {
    background-color: #FFFFFF;
    border: 1px solid #000061;
    margin-top: 1px;
    margin-bottom: 1px;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  td .ssy-custom-checkbox-container input:disabled ~ .ssy-custom-checkbox-checkmark,
.user-roles-manager .departmental-tab[b-jala9zzcpo]  td .ssy-custom-checkbox-container:hover input ~ .ssy-custom-checkbox-checkmark {
    background-color: #F4F7F9;
    border: 1px solid #F4F7F9;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  td .ssy-custom-checkbox-container input:checked ~ .ssy-custom-checkbox-checkmark {
    background-color: #000061;
    border: 1px solid #000061;
}

.user-roles-manager .departmental-tab[b-jala9zzcpo]  .paginator {
    position: sticky;
    width: 100%;
    left: 0.25rem;
    margin-left: 0.25rem;
}
/* /Components/Pages/Maintenance/Status/VolumeMonitor.razor.rz.scp.css */
.grid[b-qshob3umoi] {
    display: grid;
    grid-template-columns: auto auto;
    row-gap:50px;
    /*grid-auto-columns: 650px;*/
}

@media (max-width: 1300px) {
    .grid[b-qshob3umoi] {
        grid-template-columns: auto;
    }
}

.flex[b-qshob3umoi] {
    display: flex;
    flex-direction: row;
    gap: 5rem;
    align-items: flex-start;
}

.flex.big-gap[b-qshob3umoi]{
    gap: 1.5rem;
}
.flex-col[b-qshob3umoi] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

h2[b-qshob3umoi], h3[b-qshob3umoi] {
    margin-bottom: 0.5rem;
}

.status-list[b-qshob3umoi]{
    list-style-type: none;
    max-height: 250px;
    overflow-y: auto;
    padding-left: 0;
}
.margin-0[b-qshob3umoi]{
    margin-bottom: 0;
}
.grey[b-qshob3umoi] {
    color: #6c757d;
}
.red[b-qshob3umoi] {
    color: red;
}
.green[b-qshob3umoi] {
    color: green;
}
.orange[b-qshob3umoi] {
    color: orange;
}

.ssy-date-selector[b-qshob3umoi] {
    display: grid;
    grid-template-columns: 2em 9em 2em;
    text-align: center;
}
/* /Components/Pages/Maintenance/User/ComponentSettingsUpdate.razor.rz.scp.css */
.component-settings-content[b-l3544ao3pb]  .type-column span {
    max-width: 200px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}
.component-settings-content[b-l3544ao3pb]  .text-column code {
    color: inherit;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    max-height: 4rem;
    max-width: 80rem;
    display: block;
    overflow-y: auto;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
    scrollbar-color: #000061 transparent;
}

@media (max-width: 1300px) {
    .component-settings-content[b-l3544ao3pb]  .hide-mobile {
        display: none;
    }

}

/* modal form additions */
[b-l3544ao3pb] #EditComponentSettingForm .form-floating textarea {
    height: calc(15rem + 2px);
}
/* /Components/Pages/Maintenance/User/RegisterUser/RegisterUser.razor.rz.scp.css */
.form-signup[b-ez3s5l1mjl] {
    overflow: hidden;
    padding: 20px 20px;
    right: 0;
    left: 0;
    width: 100%;
    max-width: 600px;
    min-height: 500px;
    margin: 0 auto;
    border: #867754;
    outline: 0;
    box-shadow: 0 0 0 0.2rem #000061;
    margin-top: 2%;
}

[b-ez3s5l1mjl] .form-grid {
    display: grid;
    grid-template-columns:auto auto;
    grid-row-gap: 1em;
}

/* Request details popup styling */
[b-ez3s5l1mjl] .request-details-container {
    padding: 1.5rem;
    background-color: #f8f9fa;
    border-radius: 8px;
}

[b-ez3s5l1mjl] .request-section {
    margin-bottom: 1.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e9ecef;
}

[b-ez3s5l1mjl] .request-section:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

[b-ez3s5l1mjl] .request-field {
    display: flex;
    align-items: flex-start;
    margin-bottom: 1rem;
}

[b-ez3s5l1mjl] .request-field:last-child {
    margin-bottom: 0;
}

[b-ez3s5l1mjl] .field-label {
    flex: 0 0 160px;
    font-weight: 600;
    color: #495057;
    position: relative;
    padding-left: 28px;
}

[b-ez3s5l1mjl] .field-value {
    flex: 1;
    padding-left: 1rem;
    color: #212529;
}

[b-ez3s5l1mjl] .field-icon {
    position: absolute;
    left: 0;
    top: 2px;
    color: #000061;
    font-size: 18px;
}

[b-ez3s5l1mjl] .request-list {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
}

[b-ez3s5l1mjl] .request-list-item {
    padding: 0.75rem 1rem;
    background-color: white;
    border-radius: 4px;
    margin-bottom: 0.5rem;
    border-left: 3px solid #000061;
}

[b-ez3s5l1mjl] .request-list-item:last-child {
    margin-bottom: 0;
}

[b-ez3s5l1mjl] .section-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #000061;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #dee2e6;
}

[b-ez3s5l1mjl] .actions-section {
    display: flex;
    justify-content: flex-end;
    margin-top: 1.5rem;
}

[b-ez3s5l1mjl] .close-button {
    background-color: #000061;
    color: white;
    border: none;
    padding: 0.5rem 1.5rem;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
}

[b-ez3s5l1mjl] .close-button:hover {
    background-color: #00004d;
}
/* /Components/Pages/Maintenance/User/RegisterUser/RegisterUserRoleSelect.razor.rz.scp.css */
figcaption[b-jxomhpqbs3] {
    margin-bottom: 0.5rem;
}
small b[b-jxomhpqbs3] {
    font-size: 1.5em;
    line-height: 1;
}
ul[b-jxomhpqbs3] {
    list-style: none;
    padding: 0.5rem 0;
    margin: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    max-height: 350px;
    background-color: #FFFFFF;
    color: #000061;
    outline: 1px solid #000061;
}

ul > li[b-jxomhpqbs3] {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1rem 0 0;
}

ul > li > hr[b-jxomhpqbs3] {
    width: 100%;
}

.small-form-flex[b-jxomhpqbs3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
}

select[b-jxomhpqbs3] {
    border-radius: 3px;
    border: 1px solid #1AA3E8;
    height: 20px;
    padding: 0 5px;
    background: white;
}

.small-icon[b-jxomhpqbs3] {
    height: 20px;
    width: 20px;
}
.remove:hover[b-jxomhpqbs3] {
    background-color: #FF6961;
}

.add:hover[b-jxomhpqbs3] {
    background-color: #8CD47E;
}

/* /Components/Pages/SNP/ApiSetup/SNPRatesSetup.razor.rz.scp.css */
.snpextractbox[b-28rc2pypl5] {
    border: 1px solid #009DC9;
    height: 85vh;
    overflow-y: scroll;
}

.snpextractdatepicker[b-28rc2pypl5] {
}

.snpextractroutepicker[b-28rc2pypl5] {
    display: grid;
    grid-template-columns: 100px auto;
    gap: 10px;
}

.snpextractroutepicker-ul[b-28rc2pypl5] {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.snpextractroutepicker-ul .chkbox[b-28rc2pypl5] {
    margin: 0 3px 0 0;
    vertical-align: middle;
}


.snpextractroutepicker-ul li[b-28rc2pypl5] {
    text-decoration: none;
}

.snpextractroutepicker-ul li:hover[b-28rc2pypl5] {
    background-color: #B5CBD6;
}


.deleterow[b-28rc2pypl5], .editapiclient[b-28rc2pypl5] {
    cursor: pointer;
    padding-right: 3px;
}

.deleterow:hover[b-28rc2pypl5] {
    font-weight: 700;
    color: white;
}

.draggablerow[b-28rc2pypl5] {
    cursor: pointer;
}

.editapiclient[b-28rc2pypl5] {
    color: #163E9F;
}


.editapiclient:hover[b-28rc2pypl5] {
    font-weight: 700;
    color: #91A527;
}
/* /Components/Pages/SNP/Reports/FleetChanges/Components/FleetTable.razor.rz.scp.css */
.fleet-summary-pdf-font[b-ivjx8myn7p] {
    font-size: 1em !important;
}
/* /Components/Pages/SNP/Reports/FleetChanges/Components/OrderBook.razor.rz.scp.css */
.fleet-summary-pdf-font[b-f4x2l7nnhc] {
    font-size: 1em !important;
}
/* /Components/Pages/SNP/Reports/FleetChanges/FleetSummary.razor.rz.scp.css */
.fleet-summary-pdf-footer[b-1gyc738vfa] {
    height: 7% !important;
    font-size: 0.8em !important;
}
.fleet-summary-pdf-main[b-1gyc738vfa] {
    height: 83% !important;
    font-size: 0.85em !important;
}
.fleet-summary-pdf-msg[b-1gyc738vfa] {
    margin-top: 1% !important;
    font-size: 0.8em !important;
}
/* /Components/Pages/SNP/Reports/FleetChanges/FleetSummaryMain.razor.rz.scp.css */
.vessel-search-box[b-f827ah6p23] {
    height: 88%;
    width: 95%;
    border: 2px solid lightgray;
    border-radius: 10px;
    margin: 1%;
    padding: 0.5% 1.5%;
}

.vessel-search-item[b-f827ah6p23] {
    width: 100%;
    margin: 1% 0;
    padding: 1% 2%;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}
    .vessel-search-item:hover[b-f827ah6p23] {
        background-color: #B6EBFD;
    }
/* /Components/Pages/SNP/Reports/NewBuild/NewBuild.razor.rz.scp.css */
.snp-nb-no-pdf[b-gvvyehvtrt] {
    font-size: 1em !important;
}
/* /Components/Pages/SNP/Reports/NewBuild/NewBuildPricingPopup.razor.rz.scp.css */
[b-o7u2andfg2] .inputNumberRightAlign {
    text-align: right;
    font-size: 14px;
    min-width: 5rem;
    max-width: 8rem;
    /*        width: 100%;*/
}

[b-o7u2andfg2] .stalePrice {
    background-color: LightYellow;
}
/* /Components/Pages/SubscriptionsManager/Subscriptions.razor.rz.scp.css */
/* Layout */
.layout-container[b-wmc4o5e3mk] {
    display: flex;
    height: calc(100vh - 180px);  /* Reduced height */
    overflow: hidden;
}

/* Sidebar */
.select-list[b-wmc4o5e3mk] {
    width: 280px;
    position: fixed;
    top: 180px;  /* Adjusted top position */
    bottom: 20px;  /* Added bottom margin */
    left: 0;
    background: white;
    border-right: 1px solid #e0e0e0;
    overflow-y: auto;
    padding: 1rem;
}

/* Main Content Area */
.main-content[b-wmc4o5e3mk] {
    margin-left: 280px;
    flex: 1;
    padding: 1rem;
    overflow-y: auto;
    max-height: calc(100vh - 180px);  /* Added max-height */
}

/* Subscription Items */
.subscription-item[b-wmc4o5e3mk] {
    padding: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-bottom: 8px;
    background: white;
}

.subscription-item:hover[b-wmc4o5e3mk] {
    transform: translateX(2px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    border-color: #000061;
}

.subscription-title[b-wmc4o5e3mk] {
    font-family: 'Soehne Breit', 'Franklin Gothic Book', Arial, sans-serif;
    font-weight: 600;
    margin-bottom: 6px;
    color: #000061;
    font-size: 1.1rem;
}

/* Status Indicators */
.subscription-item-active[b-wmc4o5e3mk] { border-left: 4px solid #91A527; }
.subscription-item-expiring[b-wmc4o5e3mk] { border-left: 4px solid #FF9800; }
.subscription-item-expired[b-wmc4o5e3mk] { border-left: 4px solid #DC3545; }
.subscription-item-inactive[b-wmc4o5e3mk] {
    border-left: 4px solid #6c757d;
    opacity: 0.8;
}

/* Active State Styles */
.subscription-item.active[b-wmc4o5e3mk] {
    background-color: #000061;
    color: white;
    border-color: #000061;
    border-left-width: 4px !important;
}

.subscription-item.active.subscription-item-active[b-wmc4o5e3mk] { border-left-color: #91A527 !important; }
.subscription-item.active.subscription-item-expiring[b-wmc4o5e3mk] { border-left-color: #FF9800 !important; }
.subscription-item.active.subscription-item-expired[b-wmc4o5e3mk] { border-left-color: #DC3545 !important; }
.subscription-item.active.subscription-item-inactive[b-wmc4o5e3mk] { border-left-color: #6c757d !important; }

/* Card Styles */
.card[b-wmc4o5e3mk] {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.card-header[b-wmc4o5e3mk] {
    background-color: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
    padding: 0.75rem 1rem;
}

/* Table Styles */
.billing-table[b-wmc4o5e3mk] {
    width: 100%;
    border-collapse: collapse;
}

.billing-table th[b-wmc4o5e3mk] {
    background: #f5f5f5;
    padding: 0.75rem;
    text-align: left;
    border-bottom: 2px solid #000061;
}

.billing-table td[b-wmc4o5e3mk] {
    padding: 0.75rem;
    border-bottom: 1px solid #e0e0e0;
}

.amount-cell[b-wmc4o5e3mk] {
    font-family: monospace;
}

.status-cell[b-wmc4o5e3mk] {
    width: 100px;
}

.container[b-wmc4o5e3mk] {
    display: flex;
    flex-direction: row;
    height: calc(100vh - 120px);
    gap: 1rem;
    padding: 0 1rem;
}

.subscription-item-active[b-wmc4o5e3mk] {
    border-left: 4px solid #91A527;
}

.subscription-item-expiring[b-wmc4o5e3mk] {
    border-left: 4px solid #FF9800;
}

.subscription-item-expired[b-wmc4o5e3mk] {
    border-left: 4px solid #DC3545;
}

.subscription-item-inactive[b-wmc4o5e3mk] {
    border-left: 4px solid #6c757d;
    opacity: 0.8;
}

.subscription-item.active .text-muted[b-wmc4o5e3mk] {
    color: rgba(255,255,255,0.7) !important;
}

.subscription-info[b-wmc4o5e3mk] {
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
    font-size: 0.85rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2px;
}

.subscription-status[b-wmc4o5e3mk] {
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    padding: 3px 10px;
    border-radius: 12px;
    background: rgba(0,0,0,0.05);
    font-weight: 500;
}

.subscription-item.active .subscription-title[b-wmc4o5e3mk] {
    color: white;
}

.details[b-wmc4o5e3mk] {
    width: 70%;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 1.5rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.details-header[b-wmc4o5e3mk] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid #000061;
}

.details-header h3[b-wmc4o5e3mk] {
    font-family: 'Soehne Breit', 'Franklin Gothic Book', Arial, sans-serif;
    color: #000061;
    font-size: 1.5rem;
    margin: 0;
}

.details-content[b-wmc4o5e3mk] {
    padding: 1rem 0;
}

.billing-list[b-wmc4o5e3mk] {
    list-style: none;
    padding: 0;
}

.billing-item[b-wmc4o5e3mk] {
    display: flex;
    justify-content: space-between;
    padding: 0.75rem;
    border-bottom: 1px solid #e0e0e0;
    align-items: center;
}

.actions-bar[b-wmc4o5e3mk] {
    margin-top: 1rem;
    display: flex;
    gap: 0.5rem;
}

.card-header h6[b-wmc4o5e3mk] {
    font-family: 'Soehne Breit', 'Franklin Gothic Book', Arial, sans-serif;
    font-size: 1rem;
    color: #000061;
}

.card-body[b-wmc4o5e3mk] {
    padding: 1rem;
}

.table-sm[b-wmc4o5e3mk] {
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
}

.table-sm td[b-wmc4o5e3mk] {
    padding: 0.6rem 0.5rem;
    vertical-align: middle;
}

.table-sm td strong[b-wmc4o5e3mk] {
    color: #000061;
    font-weight: 600;
}

.badge[b-wmc4o5e3mk] {
    font-family: 'Soehne', 'Franklin Gothic Book', Arial, sans-serif;
    font-weight: 500;
    padding: 0.4em 0.8em;
}

.text-muted[b-wmc4o5e3mk] {
    color: #6c757d !important;
    font-weight: 400;
}

.input-group .btn-outline-secondary[b-wmc4o5e3mk] {
    border-color: #ced4da;
    color: #000061;
}

.input-group .btn-outline-secondary:hover[b-wmc4o5e3mk] {
    background-color: #f8f9fa;
    color: #000061;
}

.filter-card[b-wmc4o5e3mk] {
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    border-color: #e0e0e0;
}

.tab-buttons[b-wmc4o5e3mk],
.tab-button[b-wmc4o5e3mk],
.tab-button.active[b-wmc4o5e3mk] {
    display: none;
}

[b-wmc4o5e3mk] .nav-tabs {
    margin-bottom: 1rem;
    border-bottom: 2px solid #000061;
}

[b-wmc4o5e3mk] .nav-tabs .nav-link.active {
    color: #000061;
    font-weight: 600;
    border-bottom: 2px solid #000061;
}

.related-approvals[b-wmc4o5e3mk] {
    padding: 0.5rem;
    margin: 0.5rem 0;
    background-color: #f8f9fa;
    border-radius: 4px;
    border-left: 3px solid #000061;
}

.related-approvals h6[b-wmc4o5e3mk] {
    color: #000061;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.related-approvals .table[b-wmc4o5e3mk] {
    margin-bottom: 0;
}

.approval-count[b-wmc4o5e3mk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background-color: #000061;
    color: white;
    font-size: 0.75rem;
    margin-left: 0.5rem;
}

.approval-progress[b-wmc4o5e3mk] {
    display: flex;
    gap: 4px;
    align-items: center;
}

.approval-step[b-wmc4o5e3mk] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 6px;
    border-radius: 12px;
    font-size: 0.75rem;
    background: #f0f0f0;
}

.approval-step.pending[b-wmc4o5e3mk] {
    background: #fff3cd;
    color: #856404;
}

.approval-step.approved[b-wmc4o5e3mk] {
    background: #d4edda;
    color: #155724;
}

.approval-step.rejected[b-wmc4o5e3mk] {
    background: #f8d7da;
    color: #721c24;
}

.step-number[b-wmc4o5e3mk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: rgba(0,0,0,0.1);
    font-size: 0.7rem;
}

.step-approver[b-wmc4o5e3mk] {
    font-weight: 500;
}

/* Workflow Status Styles */
.workflow-status[b-wmc4o5e3mk] {
    display: flex;
    gap: 4px;
    align-items: center;
}

.workflow-step[b-wmc4o5e3mk] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    font-size: 0.75rem;
    font-weight: 500;
    background: #f0f0f0;
    cursor: help;
}

.workflow-step.pending[b-wmc4o5e3mk] {
    background: #fff3cd;
    color: #856404;
}

.workflow-step.approved[b-wmc4o5e3mk] {
    background: #d4edda;
    color: #155724;
}

.workflow-step.rejected[b-wmc4o5e3mk] {
    background: #f8d7da;
    color: #721c24;
}

/* Button Group Styles */
.btn-group[b-wmc4o5e3mk] {
    display: flex;
    gap: 4px;
}

.btn-group .ssy-btn-light[b-wmc4o5e3mk],
.btn-group .ssy-btn-red[b-wmc4o5e3mk] {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.description-box[b-wmc4o5e3mk] {
    padding: 1rem;
    background: #f8f9fa;
    border-radius: 4px;
    border-left: 3px solid #000061;
    margin-bottom: 1.5rem;
}

.description-box :deep(h1)[b-wmc4o5e3mk], 
.description-box :deep(h2)[b-wmc4o5e3mk], 
.description-box :deep(h3)[b-wmc4o5e3mk], 
.description-box :deep(h4)[b-wmc4o5e3mk] {
    color: #000061;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

.description-box :deep(p)[b-wmc4o5e3mk] {
    margin-bottom: 0.75rem;
}

.description-box :deep(ul)[b-wmc4o5e3mk], 
.description-box :deep(ol)[b-wmc4o5e3mk] {
    margin-left: 1.5rem;
    margin-bottom: 0.75rem;
}

@media (max-width: 768px) {
    .layout-container[b-wmc4o5e3mk] {
        flex-direction: column;
        height: calc(100vh - 140px);
    }

    .select-list[b-wmc4o5e3mk] {
        position: fixed;
        width: 100%;
        left: -100%;
        top: 140px;
        bottom: 0;
        z-index: 1000;
        background: white;
        transition: left 0.3s ease;
        box-shadow: 2px 0 5px rgba(0,0,0,0.1);
    }

    .select-list.open[b-wmc4o5e3mk] {
        left: 0;
    }

    .main-content[b-wmc4o5e3mk] {
        margin-left: 0;
        padding: 0.5rem;
        max-height: calc(100vh - 140px);
        margin-top: 60px;
    }

    .mobile-header[b-wmc4o5e3mk] {
        position: fixed;
        top: 50px;
        left: 0;
        right: 0;
        background: white;
        padding: 0.75rem;
        border-bottom: 1px solid #e0e0e0;
        display: flex;
        align-items: center;
        gap: 1rem;
    }

    .mobile-toggle[b-wmc4o5e3mk] {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        padding: 8px;
        border: none;
        background: whitesmoke;
        cursor: pointer;
        z-index: 1001;
        border-radius: 50%;
    }

    .mobile-toggle:hover[b-wmc4o5e3mk] {
        background-color: rgba(0,0,97,0.05);
    }

    .mobile-overlay.open[b-wmc4o5e3mk] {
        display: block;
    }

    .card[b-wmc4o5e3mk] {
        margin-bottom: 1rem;
    }

    .table-responsive-mobile[b-wmc4o5e3mk] {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .col-md-6[b-wmc4o5e3mk] {
        width: 100%;
    }

    [b-wmc4o5e3mk] .nav-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .billing-table-wrapper[b-wmc4o5e3mk] {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        margin: 0 -0.5rem;
        padding: 0 0.5rem;
    }
}

.mobile-overlay[b-wmc4o5e3mk] {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 999;
}

@media (max-width: 768px) {
    .mobile-overlay.open[b-wmc4o5e3mk] {
        display: block;
    }
}

/* Matrix mode styles */
.layout-container.matrix-mode[b-wmc4o5e3mk] {
    padding: 0;
    height: calc(100vh - 120px);
    overflow: hidden;
}

.layout-container.matrix-mode .main-content[b-wmc4o5e3mk] {
    margin-left: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
}

.layout-container.matrix-mode .card[b-wmc4o5e3mk] {
    margin: 0;
    border: none;
    border-radius: 0;
    height: 100%;
}

.layout-container.matrix-mode .card-body[b-wmc4o5e3mk] {
    height: 100%;
}

/* Adjust matrix container in full screen mode */
.layout-container.matrix-mode .matrix-container[b-wmc4o5e3mk] {
    height: calc(100vh - 180px);
    max-height: none;
}

.top-left-clear[b-wmc4o5e3mk] {
    position: absolute;
    top: calc(55px + 32px);
    left: 15px;
}
/* /Components/Pages/SubscriptionsManager/SubscriptionsManagerManageUser.razor.rz.scp.css */
:global(.autocomplete-list-fts)[b-n7x2v7ss4h],
:global(.dropdown-menu.autocomplete-list-fts)[b-n7x2v7ss4h],
:global(.dropdown-menu[class*='autocomplete-list'])[b-n7x2v7ss4h],
:global(ul[class*='autocomplete-list'])[b-n7x2v7ss4h] {
    border: 3px solid red !important;
    border-radius: 0.3rem !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18) !important;
    background: #fff !important;
    margin-top: 2px !important;
    padding: 0 !important;
    z-index: 1002 !important;
    min-width: 220px;
    max-width: 100%;
    outline: none !important;
    transition: border-color 0.18s;
}


:global(.autocomplete-list-fts)[b-n7x2v7ss4h],
:global(.dropdown-menu.autocomplete-list-fts)[b-n7x2v7ss4h] {
    border: 2px solid #2563eb !important;
    border-radius: 0.3rem !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10) !important;
    background: #fff !important;
    margin-top: 2px !important;
    padding: 0 !important;
    z-index: 1002 !important;
    min-width: 220px;
    max-width: 100%;
    outline: none !important;
    transition: border-color 0.18s;
}

.autocomplete-list-fts .dropdown-item[b-n7x2v7ss4h] {
    border-left: 3px solid transparent;
    padding: 0.6rem 1rem;
    font-size: 0.98rem;
    background: none;
    border-radius: 0 !important;
    transition: background 0.15s, border-color 0.15s;
}

.autocomplete-list-fts .dropdown-item:hover[b-n7x2v7ss4h],
.autocomplete-list-fts .dropdown-item:focus[b-n7x2v7ss4h] {
    background-color: #eff6ff !important;
    border-left: 3px solid #2563eb !important;
}

.autocomplete-list-fts .dropdown-item.active[b-n7x2v7ss4h] {
    background-color: #eff6ff !important;
    border-left: 3px solid #2563eb !important;
    color: #2563eb !important;
}

/* SSYFTS-inspired search bar styles */
:root[b-n7x2v7ss4h] {
    --border-color: #d1d5db;
    --header-bg: #f3f4f6;
    --highlight-color: #2563eb;
    --highlight-bg: #eff6ff;
    --accent-color: #000061;
}

.search-container[b-n7x2v7ss4h] {
    width: 100%;
    border-radius: 0.5rem;
    padding: 3px;
    background-color: #f0f4ff;
    box-shadow: 0 2px 6px rgba(0, 0, 97, 0.1);
}

.search-bar-container .input-group[b-n7x2v7ss4h] {
    margin: 0;
    position: relative;
}

.search-bar.form-control[b-n7x2v7ss4h] {
    padding: 0.4rem;
    padding-right: 1.5rem !important;
    font-size: 0.9rem;
    line-height: 1.1;
    border-radius: 0.3rem;
    border: 2px solid #2563eb;
    background-color: white;
    color: black;
    height: 42px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.search-bar.form-control[b-n7x2v7ss4h]::placeholder {
    color: #999999;
}

.search-bar.form-control:focus[b-n7x2v7ss4h] {
    color: black;
    background-color: white;
    border-color: #000061;
    border-width: 2px;
    box-shadow: 0 0 0 0.2rem rgba(0, 0, 97, 0.25);
    outline: none;
}

.search-bar.form-control:focus-visible[b-n7x2v7ss4h] {
    outline: black auto 1px;
}

.input-group > button.btn[b-n7x2v7ss4h] {
    padding: 0.2rem;
    font-size: 0.8rem;
    background: transparent;
    color: var(--accent-color) !important;
    right: 0.3rem !important;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    z-index: 2;
}

.input-group > ul.dropdown-menu.autocomplete-list[b-n7x2v7ss4h] {
    width: 100%;
    transform: translate(0, 2.8rem) !important;
    scrollbar-gutter: stable both-edges;
    scrollbar-width: thin;
    scrollbar-color: var(--accent-color) transparent;
    inset: inherit !important;
    border-radius: 0.4rem;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
    border: 2px solid #2563eb !important;
    padding: 0;
    position: absolute;
    left: 0;
    z-index: 10;
    background: #fff;
    max-height: 260px;
    overflow-y: auto;
    margin-top: 2px;
    transition: box-shadow 0.18s, border-color 0.18s;
}

.dropdown-item[b-n7x2v7ss4h] {
    padding: 0.6rem 0.8rem;
    font-size: 0.9rem;
    border-left: 3px solid transparent;
    transition: all 0.15s ease;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
}

.dropdown-item:hover[b-n7x2v7ss4h],
.dropdown-item:focus[b-n7x2v7ss4h] {
    background-color: var(--highlight-bg);
    border-left: 3px solid var(--highlight-color);
}

.dropdown-item.active[b-n7x2v7ss4h] {
    background-color: var(--highlight-bg);
    border-left: 3px solid var(--highlight-color);
    color: var(--highlight-color);
}

/* User information card */
.card[b-n7x2v7ss4h] {
    border-radius: 0 !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.card-header[b-n7x2v7ss4h] {
    background-color: var(--header-bg) !important;
    border-bottom: 1px solid var(--border-color);
    padding: 1rem 1.25rem;
}

.card-body[b-n7x2v7ss4h] {
    padding: 1.5rem;
}

/* Definition list styling */
dl.row[b-n7x2v7ss4h] {
    margin-bottom: 0;
}

dt[b-n7x2v7ss4h] {
    font-weight: 600;
    color: #4b5563;
}

dd[b-n7x2v7ss4h] {
    margin-bottom: 0.75rem;
}

/* Department selection styles */
.form-select[b-n7x2v7ss4h] {
    height: 46px;
    padding: 0.625rem 1rem;
    border: 2px solid var(--border-color);
    border-radius: 0.3rem;
    background-position: right 0.75rem center;
    transition: border-color 0.2s ease;
    cursor: pointer;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.form-select:focus[b-n7x2v7ss4h] {
    border-color: var(--highlight-color);
    box-shadow: 0 0 0 0.25rem rgba(37, 99, 235, 0.25);
}

.btn-primary[b-n7x2v7ss4h] {
    height: 46px;
    padding: 0.625rem 1.5rem;
    background-color: #2563eb;
    border: none;
    border-radius: 0.3rem;
    font-weight: 500;
    color: white !important;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    opacity: 1;
}

.btn-primary:hover:not(:disabled)[b-n7x2v7ss4h] {
    background-color: #1d4ed8;
    transform: translateY(-1px);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
}

.btn-primary:disabled[b-n7x2v7ss4h] {
    background-color: #93c5fd;
    cursor: not-allowed;
    opacity: 0.7;
}

/* Alert styling */
.alert[b-n7x2v7ss4h] {
    border-radius: 0;
    border-left: 4px solid #60a5fa;
    background-color: #f0f9ff;
    color: #0369a1;
    padding: 1.25rem;
    margin-bottom: 1.5rem;
}

.alert-warning[b-n7x2v7ss4h] {
    border-left: 4px solid #eab308;
    background-color: #fefce8;
    color: #854d0e;
}

/* Table styling */
.user-table-container[b-n7x2v7ss4h] {
    overflow-x: auto;
    margin-bottom: 2rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
    border: 1px solid var(--border-color);
}

.user-table[b-n7x2v7ss4h] {
    min-width: 700px;
    width: 100%;
    border-collapse: collapse;
    background: #fff;
}

.user-table th[b-n7x2v7ss4h], .user-table td[b-n7x2v7ss4h] {
    padding: 1rem;
    text-align: left;
    border-bottom: 1px solid var(--border-color);
}

.user-table th[b-n7x2v7ss4h] {
    background-color: var(--header-bg);
    font-weight: 600;
    color: #374151;
    position: sticky;
    top: 0;
    z-index: 1;
}

.user-table th:not(:last-child)[b-n7x2v7ss4h],
.user-table td:not(:last-child)[b-n7x2v7ss4h] {
    border-right: 1px solid #f3f4f6;
}

.user-table tbody tr:last-child td[b-n7x2v7ss4h] {
    border-bottom: none;
}

.user-table tbody tr:hover[b-n7x2v7ss4h] {
    background-color: #fafafa;
}

.user-table tbody tr:nth-child(even)[b-n7x2v7ss4h] {
    background-color: #fcfcfc;
}

/* Checkbox styling */
input[type="checkbox"][b-n7x2v7ss4h] {
    width: 16px;
    height: 16px;
    cursor: not-allowed;
}

/* Department assignment section */
.department-assignment[b-n7x2v7ss4h] {
    background-color: #f0f7ff;
    border: 2px solid #2563eb;
    border-radius: 0.5rem;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.15);
    margin-bottom: 2rem;
}

/* Department assignment card styling */
.department-assignment-card[b-n7x2v7ss4h] {
    padding: 1.25rem;
    background-color: #f0f7ff;
    border: 1px solid var(--highlight-color);
    border-radius: 0.5rem;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
}

.department-assignment-card h5[b-n7x2v7ss4h] {
    color: var(--highlight-color);
    font-weight: 600;
    font-size: 1.1rem;
}

/* Permission toggle styling */
.permission-toggle[b-n7x2v7ss4h] {
    height: 1.5rem;
    width: 3rem;
    cursor: pointer !important;
    background-color: #ccc;
    border-color: #aaa;
    transition: all 0.2s;
    position: relative;
    opacity: 1 !important;
    pointer-events: all !important;
}

.permission-toggle:checked[b-n7x2v7ss4h] {
    background-color: #2563eb !important;
    border-color: #1d4ed8 !important;
}

.permission-toggle:focus[b-n7x2v7ss4h] {
    box-shadow: 0 0 0 0.25rem rgba(37, 99, 235, 0.25);
    border-color: #2563eb !important;
}

.form-check-label[b-n7x2v7ss4h] {
    margin-left: 0.5rem;
    font-size: 0.9rem;
    font-weight: 500;
    color: #4b5563;
    transition: all 0.2s;
}

@media (max-width: 900px) {
    .user-table th[b-n7x2v7ss4h], .user-table td[b-n7x2v7ss4h] {
        padding: 0.75rem;
        font-size: 0.95rem;
    }

    .user-table[b-n7x2v7ss4h] {
        min-width: 600px;
    }

    .card-body[b-n7x2v7ss4h] {
        padding: 1rem;
    }
}

@media (max-width: 600px) {
    .user-table th[b-n7x2v7ss4h], .user-table td[b-n7x2v7ss4h] {
        padding: 0.5rem;
        font-size: 0.9rem;
    }

    .user-table[b-n7x2v7ss4h] {
        min-width: 450px;
    }

    dt[b-n7x2v7ss4h] {
        margin-bottom: 0.25rem;
    }
}

/* Enhanced department field styling */
.department-field[b-n7x2v7ss4h] {
    position: relative;
}

.department-select[b-n7x2v7ss4h] {
    min-width: 200px;
    transition: all 0.2s ease;
}

.department-select:focus + .save-department-btn[b-n7x2v7ss4h] {
    opacity: 1;
}

.save-department-btn[b-n7x2v7ss4h] {
    height: auto;
    padding: 0.5rem 0.75rem;
    font-size: 0.85rem;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    font-weight: 500;
}

.save-department-btn:hover[b-n7x2v7ss4h] {
    transform: translateY(-1px);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
}

/* Make checkboxes in the table a bit nicer */
.user-table input[type="checkbox"][b-n7x2v7ss4h] {
    width: 18px;
    height: 18px;
    accent-color: #2563eb;
    border: 2px solid #cbd5e1;
    border-radius: 3px;
}

/* Department Assignment Section */
.department-assignment-section[b-n7x2v7ss4h] {
    background-color: #f0f7ff;
    border-top: 1px solid #d1e0ff;
    padding-top: 1.5rem;
    margin-top: 1.5rem;
    border-radius: 0.375rem;
    padding: 1.5rem;
}

.department-assignment-section h5[b-n7x2v7ss4h] {
    color: #2563eb;
    font-weight: 600;
    font-size: 1.1rem;
}

.department-assign-button[b-n7x2v7ss4h] {
    white-space: nowrap;
    min-width: 160px;
}

.department-assign-button:disabled[b-n7x2v7ss4h] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* General card improvements */
.card[b-n7x2v7ss4h] {
    border-radius: 0.375rem !important;
    overflow: hidden;
}

.card-header[b-n7x2v7ss4h] {
    border-top-left-radius: 0.375rem !important;
    border-top-right-radius: 0.375rem !important;
}

/* Make form-select look more like the screenshot */
.form-select[b-n7x2v7ss4h] {
    height: 38px;
    padding: 0.5rem 1rem;
    border: 1px solid #d1d5db;
    border-radius: 0.25rem;
    background-color: #fff;
    flex: 1;
    min-width: 200px;
}

/* Combined form styling */
form[b-n7x2v7ss4h] {
    position: relative;
}

/* Save all button styling */
.save-all-button[b-n7x2v7ss4h] {
    min-width: 140px;
    padding: 0.5rem 1.2rem;
    font-weight: 500;
    background-color: #2563eb;
    border-color: #1d4ed8;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease;
}

.save-all-button:hover:not(:disabled)[b-n7x2v7ss4h] {
    background-color: #1d4ed8;
    border-color: #1e40af;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
    transform: translateY(-1px);
}

.save-all-button:disabled[b-n7x2v7ss4h] {
    background-color: #93c5fd;
    border-color: #60a5fa;
    cursor: not-allowed;
    opacity: 0.7;
}

/* Unified form styling */
.department-field[b-n7x2v7ss4h] {
    position: relative;
    width: 100%;
}

.department-field .form-select[b-n7x2v7ss4h] {
    margin-bottom: 0.3rem;
    border-color: #d1d5db;
    border-radius: 0.25rem;
    height: 38px;
}

.department-field .form-select:focus[b-n7x2v7ss4h] {
    border-color: #2563eb;
    box-shadow: 0 0 0 0.25rem rgba(37, 99, 235, 0.25);
}

/* Make alert nicer */
.alert-success[b-n7x2v7ss4h] {
    background-color: #ecfdf5;
    border-color: #10b981;
    color: #065f46;
    padding: 0.75rem 1rem;
    border-radius: 0.375rem;
    animation: fadeIn-b-n7x2v7ss4h 0.5s;
}

@keyframes fadeIn-b-n7x2v7ss4h {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Make form sections more organized */
h5[b-n7x2v7ss4h] {
    color: #4b5563;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.card-body dl[b-n7x2v7ss4h] {
    margin-bottom: 0;
}

.card-body dt[b-n7x2v7ss4h] {
    color: #4b5563;
    font-weight: 600;
}

/* Form actions styling */
.form-actions[b-n7x2v7ss4h] {
    border-top: 1px solid #e5e7eb;
    padding-top: 1.5rem;
    margin-top: 2rem;
}

.save-all-button[b-n7x2v7ss4h] {
    background-color: #2563eb;
    border-color: #1d4ed8;
    font-weight: 500;
    padding: 0.5rem 1.25rem;
    min-width: 150px;
    border-radius: 0.375rem;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.save-all-button:hover:not(:disabled)[b-n7x2v7ss4h] {
    background-color: #1d4ed8;
    border-color: #1e40af;
    transform: translateY(-1px);
    box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
}

.save-all-button:disabled[b-n7x2v7ss4h] {
    opacity: 0.65;
    cursor: not-allowed;
    background-color: #93c5fd;
    border-color: #60a5fa;
}

/* Status message container */
.status-message-container[b-n7x2v7ss4h] {
    min-height: 76px; /* Height of the alert + margins */
}

/* /Components/Pages/Tankers/ApiSetup/TankerRatesSetup.razor.rz.scp.css */

/* /Components/Pages/Tankers/BrokerDashboard/BrokerDashboard_00.razor.rz.scp.css */
.container-fluid[b-66a1v0wo46] {
    width: calc(100% - 4rem);
}
@media (max-width: 576px) {
    .container-fluid[b-66a1v0wo46] {
        width: 100%;
    }
}

.broker-dashboard-container .vessel-tab-quick-links-container[b-66a1v0wo46]  .quick-links-component {
    background: #000061;
    height: 100%;
}

.vessel-tab-load-container[b-66a1v0wo46],
.vessel-tab-fundamentals-container[b-66a1v0wo46] {
    background: white;
    border: 1px solid #009DC9;
}

.vessel-tab-load-container[b-66a1v0wo46] {
    min-height: 430px;
}

.vessel-tab-fundamentals-container[b-66a1v0wo46] {
    min-height: 350px;
}

.vessel-tab-load-container > .ssy-colour-lw[b-66a1v0wo46],
.vessel-tab-fundamentals-container > .ssy-colour-lw[b-66a1v0wo46]  {
    max-height: fit-content;
}

.vessel-tab-load-container .fcicon[b-66a1v0wo46],
.vessel-tab-ffa-container .fcicon[b-66a1v0wo46],
.vessel-tab-fundamentals-container .fcicon[b-66a1v0wo46] {
    width: 1.5em;
}

.vessel-tab-load-container .fcdesc[b-66a1v0wo46],
.vessel-tab-ffa-container .fcdesc[b-66a1v0wo46],
.vessel-tab-fundamentals-container .fcdesc[b-66a1v0wo46] {
    text-align: left;
    width: 12em;
    padding: 5px 15px 5px 5px;
}

.vessel-tab-load-container .fcprice[b-66a1v0wo46],
.vessel-tab-ffa-container .fcprice[b-66a1v0wo46],
.vessel-tab-fundamentals-container .fcprice[b-66a1v0wo46] {
    text-align: right;
    width: 8em;
    padding: 5px 15px 5px 5px;
}

.vessel-tab-load-container .negNum[b-66a1v0wo46],
.vessel-tab-ffa-container .negNum[b-66a1v0wo46],
.vessel-tab-fundamentals-container .negNum[b-66a1v0wo46] {
    color: red;
}

.vessel-tab-load-container .posNum[b-66a1v0wo46],
.vessel-tab-ffa-container .posNum[b-66a1v0wo46],
.vessel-tab-fundamentals-container .posNum[b-66a1v0wo46] {
    color: darkgreen;
}

.vessel-tab-ffa-container[b-66a1v0wo46]  h2,
.vessel-tab-quick-links-container[b-66a1v0wo46]  h2 {
    padding-top: 0.5rem;
}

.vessel-tab-ffa-container h2[b-66a1v0wo46] {
    /* needed for now can be removed later*/
    text-align: center;
}

.vessel-tab-ffa-container .ssy-radio-main.radio-btns[b-66a1v0wo46] {
    margin: 0.5rem;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(31%, 1fr));
    gap: 0;
    align-items: center;
}

.vessel-tab-ffa-container .ssy-radio-main.radio-btns > div[b-66a1v0wo46] {
    display: flex;
    justify-content: center;
}

.vessel-tab-ffa-container .ssy-radio-main.radio-btns .radio-label[b-66a1v0wo46] {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 7.2vw;
    height: 35px;
    margin: 0;
}

.vessel-tab-ffa-container .ssy-radio-main input:checked + label[b-66a1v0wo46]{
    background-color: #000061;
}

.vessel-tab-fundamentals-container .market-commentary p[b-66a1v0wo46] {
    margin: 0 0.5rem 0.25rem 0.5rem;
    font-size: 0.95rem;
}
.vessel-tab-fundamentals-container .market-commentary p:first-child[b-66a1v0wo46] {
    /*margin-top: 0.5rem;*/
    margin-bottom: 0.5rem;
}

.vessel-tab-quick-links-container[b-66a1v0wo46]  h2 {
    color: white;
}

.ssy-radio-main[b-66a1v0wo46] {
    display: inline-flex;
    overflow: initial;
    margin-bottom: 0;
}

.loading-container[b-66a1v0wo46] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 80vh;
    width: 100%;
}

.loading-spinner[b-66a1v0wo46] {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #000061;
    border-radius: 50%;
    animation: spinner-b-66a1v0wo46 1.5s linear infinite;
    margin-bottom: 15px;
}

@keyframes spinner-b-66a1v0wo46 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/* /Components/Pages/Tankers/Reports/TankerWeekly/SnP.razor.rz.scp.css */
/* /Components/Pages/Tankers/TankerFwdPrices.razor.rz.scp.css */
/* Date Selector */
[b-li3qsaemrt] .ssy-date-selector {
    font-size: 1.5em;
    color: #009DC9;
}
[b-li3qsaemrt] .ssy-date-selector time {
    font-weight: 600;
}

/* Table style */
.positive[b-li3qsaemrt] {
    color: mediumseagreen !important;
}

.negative[b-li3qsaemrt] {
    color: crimson !important;
}
.ssy-table-lw td[b-li3qsaemrt], .ssy-table-lw th[b-li3qsaemrt] {
    padding: .25rem;
}
.cursor-pointer[b-li3qsaemrt] {
    cursor: pointer;
}
.tanker-fwd-prices[b-li3qsaemrt]  .text-bold,
.text-bold[b-li3qsaemrt] {
    font-weight: bold;
}

/* settings modal */
.tanker-fwd-prices[b-li3qsaemrt]  .displayed-routes,
.tanker-fwd-prices[b-li3qsaemrt]  .hidden-routes{
    min-height: 35px;
}
.tanker-fwd-prices[b-li3qsaemrt]  .displayed-routes > div,
.tanker-fwd-prices[b-li3qsaemrt]  .hidden-routes > div {
    background: #009DC9;
    color: white;
    border-left: 1px solid white;
    border-top: 1px solid white;
}
.tanker-fwd-prices[b-li3qsaemrt]  .hidden-routes > div {
    background: #000061;
}



/* loading style */
.loading-container[b-li3qsaemrt] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 80vh;
    width: 100%;
}

.loading-spinner[b-li3qsaemrt] {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #000061;
    border-radius: 50%;
    animation: spinner-b-li3qsaemrt 1.5s linear infinite;
    margin-bottom: 15px;
}

@keyframes spinner-b-li3qsaemrt {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
/* /Components/Pages/Tankers/TankerPriceExtractor/TankerPriceExtractor.razor.rz.scp.css */
.tankerextractPageLayout[b-evuffx5o7g] {
    display: grid;
    grid-template-columns: 320px auto;
    gap: 20px;
}

.tankerextractbox[b-evuffx5o7g] {
    border: 1px solid #009DC9;
}

.tankerextractdatepicker[b-evuffx5o7g] {
}

.tankerextractroutepicker[b-evuffx5o7g] {
    display: grid;
    grid-template-columns: 100px auto;
    gap: 20px;
}

.tankerextractroutepicker-ul[b-evuffx5o7g] {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

    .tankerextractroutepicker-ul .chkbox[b-evuffx5o7g] {
        margin: 0 3px 0 0;
        vertical-align: middle;
    }


    .tankerextractroutepicker-ul li[b-evuffx5o7g] {
        text-decoration: none;
    }

        .tankerextractroutepicker-ul li:hover[b-evuffx5o7g] {
            background-color: #B5CBD6;
        }

.tankerextractroutepicker-tbl tr:hover[b-evuffx5o7g] {
    background-color: #B5CBD6;
}

.tankerextractroutepicker-tbl td[b-evuffx5o7g] {
    padding-right: 30px;
}

.tankerextractroutepicker-tbl .delete[b-evuffx5o7g] {
    cursor: pointer;
    padding-right: 3px;
}

    .tankerextractroutepicker-tbl .delete:hover[b-evuffx5o7g] {
        font-weight: 700;
        color: white;
    }

.tankerextractoutput-tbl th:not(:first-child)[b-evuffx5o7g] {
    text-align: center;
    border: 1px solid #B5CBD6;
}

.tankerextractoutput-tbl[b-evuffx5o7g] {
    text-align: right;
}

    .tankerextractoutput-tbl tr:hover[b-evuffx5o7g] {
        background-color: #B5CBD6;
    }

    .tankerextractoutput-tbl td:first-child[b-evuffx5o7g], .tankerextractoutput-tbl th:first-child[b-evuffx5o7g] {
        text-align: left;
    }

    .tankerextractoutput-tbl th label[b-evuffx5o7g] {
        font-size: 0.8rem;
        font-weight: normal;
        color: #163E9F;
        font-style: italic;
    }

.tankerextractoutpup-btn-text[b-evuffx5o7g] {
    margin-top: 8px;
    display: grid;
    grid-template-columns: 300px auto;
    align-items: center;
}

.tankerextractoutput-c3y[b-evuffx5o7g] {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.disclaimer-accordion[b-evuffx5o7g] {
    background-color: #B5CBD6;
    color: #000061;
    cursor: pointer;
    padding: 2px 0 2px 20px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 0.8rem;
    transition: 0.4s;
}

    .disclaimer-accordion:hover[b-evuffx5o7g] {
        background-color: #405864;
        color: white;
    }
/* /Components/Pages/Towage/Representation.razor.rz.scp.css */
/* /Components/Shared/ExpandableText.razor.rz.scp.css */
.expandable-text[b-2prj5d1wwy] {
    position: relative;
    padding: 1rem;
    margin-bottom: 10px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    background: #f8f9fa;
    border-radius: 4px;
    border-left: 3px solid #000061;
}

.expandable-text h3[b-2prj5d1wwy] {
    margin-top: 0;
    margin-bottom: 1rem;
    color: #000061;
    font-size: 1.25rem;
}

.truncated-text[b-2prj5d1wwy], .full-text[b-2prj5d1wwy] {
    line-height: 1.6;
    color: #333;
}

.expand-button[b-2prj5d1wwy] {
    background: none;
    border: none;
    color: #000061;
    padding: 0;
    margin-top: 0.5rem;
    font-size: 0.9rem;
    cursor: pointer;
    text-decoration: underline;
}

.expand-button:hover[b-2prj5d1wwy] {
    color: #000033;
}

[b-2prj5d1wwy] h1, [b-2prj5d1wwy] h2, [b-2prj5d1wwy] h3, [b-2prj5d1wwy] h4 {
    color: #000061;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

[b-2prj5d1wwy] p {
    margin-bottom: 0.75rem;
}

[b-2prj5d1wwy] ul, [b-2prj5d1wwy] ol {
    margin-left: 1.5rem;
    margin-bottom: 0.75rem;
}

[b-2prj5d1wwy] code {
    background: #eee;
    padding: 0.2rem 0.4rem;
    border-radius: 3px;
    font-size: 0.9em;
}

[b-2prj5d1wwy] blockquote {
    border-left: 2px solid #ccc;
    margin-left: 0;
    padding-left: 1rem;
    color: #666;
}