/* ========================================
   DEVICES PAGE: GATEWAY BMS STATUS AND BATTERY SHARE DIALOG (Devices.razor inline styles)
   ======================================== */

/* ---------- Pages/Devices.razor ---------- */
:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-firmware-panel {
    margin-top: 1rem;
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-firmware-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    min-height: 50px;
    margin: 0;
    padding: 0.72rem 0.85rem;
    background: var(--surface-solid-accent);
    border-bottom: 1px solid rgba(var(--color-primary-rgb), 0.18);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-firmware-header > div {
    min-width: 0;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-title,
:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-type {
    display: block;
    color: rgba(255, 255, 255, 0.92);
    font-weight: 600;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-subtitle,
:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-empty,
:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-row-meta {
    color: rgba(255, 255, 255, 0.62);
    font-size: 0.82rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-empty {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 1.3rem;
    padding: 0.85rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-list {
    display: grid;
    gap: 0.65rem;
    padding: 0.85rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-row {
    display: grid;
    gap: 0.35rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-row-top,
:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-row-meta {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-status {
    font-size: 0.76rem;
    font-weight: 600;
    text-transform: uppercase;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-status.downloading {
    color: #29b6f6;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-status.downloaded {
    color: #66bb6a;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-status.error {
    color: #ef5350;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-status.queued {
    color: rgba(255, 255, 255, 0.7);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-progress-track {
    height: 6px;
    overflow: hidden;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .gateway-bms-progress-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--color-primary), #66bb6a);
    transition: width 180ms ease;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .battery-share-modal-body .lbsa-grid-container {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: var(--form-field-spacing, 0.95rem);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .battery-share-modal-body .share-field {
    margin: 0;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .battery-share-modal-body .lbsa-form-label {
    display: block;
    margin: 0 0 var(--form-label-gap, 0.45rem) 0;
    font-size: var(--form-label-size, 0.78rem);
    letter-spacing: var(--form-label-tracking, 0.04em);
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.8);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .battery-share-sentinel-card {
    margin-bottom: 1rem;
    border: 1px solid rgba(var(--color-primary-rgb), 0.25);
    background: rgba(var(--color-primary-rgb), 0.08);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .battery-share-sentinel-card .lbsa-alert-heading {
    margin-bottom: 0.45rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .share-empty-state {
    padding: 0.75rem;
    border: 1px dashed rgba(255, 255, 255, 0.25);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.85);
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .share-select-all {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
    margin-top: 0.2rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .share-monitor-list {
    max-height: 220px;
    overflow-y: auto;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
}

:where(.devices-page, .devices-page ~ .lbsa-mobile-dialog-host) .share-monitor-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0;
    margin: 0;
    cursor: pointer;
}