.leal-camera-panel {
    padding: 12px 0;
    color: #273442;
}
.leal-camera-panel .camera-toolbar,
.leal-camera-panel .camera-live-actions,
.leal-camera-panel .camera-period,
.leal-camera-panel .camera-searchbar {
    display: flex;
    align-items: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}
.leal-camera-panel .camera-toolbar label,
.leal-camera-panel .camera-period label,
.leal-camera-panel .camera-file-filter {
    margin: 0;
    font-size: 13px;
    font-weight: 600;
}
.leal-camera-panel .camera-channel-field {
    flex: 0 1 220px;
    min-width: 150px;
}
.leal-camera-panel .camera-channel-field select {
    width: 100%;
    margin-top: 4px;
}
.leal-camera-panel .camera-live-actions {
    flex-shrink: 0;
    gap: 8px;
}
.leal-camera-panel .camera-quality {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 0 2px;
    font-weight: 400;
}
.leal-camera-panel .camera-quality input {
    margin: 0;
}
.leal-camera-panel .camera-quality-note {
    padding: 8px 0;
    font-size: 12px;
}
.leal-camera-panel .camera-status-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2px 8px;
    margin-top: 8px;
}
.leal-camera-panel .camera-status {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
}
.leal-camera-panel .camera-status strong {
    font-weight: 600;
}
.leal-camera-panel .camera-refresh {
    padding: 2px 5px;
    font-size: 12px;
}
.leal-camera-panel .camera-hint {
    margin: 6px 0 0;
    font-size: 12px;
    line-height: 1.5;
}
.leal-camera-panel .camera-error {
    margin: 10px 0 0;
    padding: 9px 12px;
    font-size: 13px;
}
.leal-camera-panel .camera-session-status {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 10px;
    padding: 8px 10px;
    border-radius: 5px;
    background: #f0f5fa;
    font-size: 12px;
    line-height: 1.5;
    overflow-wrap: break-word;
}
.leal-camera-panel .camera-session-status > .fa {
    margin-top: 3px;
    color: #4b6983;
}
.leal-camera-panel .camera-section {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #e3e8ed;
}
.leal-camera-panel .camera-section h4 {
    margin: 0 0 10px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
}
.leal-camera-panel .camera-period {
    flex: 1 1 auto;
}
.leal-camera-panel .camera-period label {
    flex: 1 1 185px;
}
.leal-camera-panel .camera-period input {
    width: 100%;
    min-width: 0;
    margin-top: 4px;
}
.leal-camera-panel .camera-query-button {
    flex: 0 0 auto;
}
.leal-camera-panel .camera-query-summary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 3px 12px;
    margin: 10px 0 8px;
    color: #526477;
    font-size: 12px;
    line-height: 1.5;
}
.leal-camera-panel .camera-query-channel .fa {
    margin-right: 3px;
}
.leal-camera-panel .camera-resource-message,
.leal-camera-panel .camera-empty {
    margin: 10px 0 0;
    font-size: 13px;
    line-height: 1.5;
}
.leal-camera-panel .camera-query-progress-card {
    margin: 12px 0;
    padding: 14px 16px;
    border: 1px solid #0e416c;
    border-radius: 7px;
    background: #145285;
    color: #fff;
}
.leal-camera-panel .camera-cloud-recovery {
    border-left-width: 5px;
}
.leal-camera-panel .camera-cloud-overview {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px 18px;
    margin-bottom: 12px;
}
.leal-camera-panel .camera-cloud-overview .camera-status-row {
    margin: 0;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 10px;
}
.leal-camera-panel .camera-cloud-toggle {
    white-space: normal;
}
.leal-camera-panel .camera-cloud-toggle:focus-visible {
    outline: 2px solid #1e40af;
    outline-offset: 3px;
}
.leal-camera-panel .camera-cloud-toggle[aria-checked="true"] .fa {
    color: #13774b;
}
.leal-camera-panel .camera-cloud-toggle[disabled] {
    opacity: .75;
}
.leal-camera-panel .camera-cloud-usage {
    margin: 0;
    font-size: 12px;
}
.leal-camera-panel .camera-cloud-details > summary {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 3px 0;
    color: #1e40af;
    font-size: 12px;
    cursor: pointer;
    list-style: none;
}
.leal-camera-panel .camera-cloud-details > summary::-webkit-details-marker {
    display: none;
}
.leal-camera-panel .camera-cloud-details > summary:focus-visible {
    outline: 2px solid #1e40af;
    outline-offset: 3px;
}
.leal-camera-panel .camera-cloud-details > summary > .fa {
    font-size: 10px;
}
.leal-camera-panel .camera-cloud-details[open] {
    grid-column: 1 / -1;
}
.leal-camera-panel .camera-cloud-details[open] > summary > .fa {
    transform: rotate(180deg);
}
.leal-camera-panel .camera-cloud-details-content {
    padding: 8px 12px 12px;
    margin-top: 5px;
    border: 1px solid #d8e2ed;
    border-radius: 5px;
}
.leal-camera-panel .camera-cloud-pending {
    color: #8a5700;
    font-weight: 600;
}
.leal-camera-panel .camera-cloud-error {
    margin: 0 0 10px;
    font-size: 12px;
}
@media (max-width: 640px) {
    .leal-camera-panel .camera-cloud-overview {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 6px 10px;
    }
    .leal-camera-panel .camera-cloud-details {
        grid-column: 1 / -1;
    }
}
.leal-camera-panel .camera-query-progress-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px 16px;
}
.leal-camera-panel .camera-query-progress-title {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}
.leal-camera-panel .camera-query-progress-title strong,
.leal-camera-panel .camera-query-progress-value strong {
    font-weight: 700;
}
.leal-camera-panel .camera-query-progress-value {
    margin: 12px 0 0;
    color: #fff;
    font-size: 1.05em;
    line-height: 1.55;
    overflow-wrap: anywhere;
}
.leal-camera-panel .camera-query-progress-help {
    margin: 6px 0 0;
    color: #e1eef9;
    line-height: 1.5;
}
.leal-camera-panel .camera-query-cancel.btn {
    flex-shrink: 0;
    border-color: #fff;
    background: #fff;
    color: #144d7a;
    font-weight: 600;
}
.leal-camera-panel .camera-query-cancel.btn:hover,
.leal-camera-panel .camera-query-cancel.btn:focus {
    border-color: #dcecff;
    background: #dcecff;
    color: #103e68;
}
.leal-camera-panel .camera-query-cancel.btn:focus {
    outline: 2px solid #fff;
    outline-offset: 3px;
}
.leal-camera-panel .camera-file-filter {
    display: block;
    max-width: 420px;
    margin: 10px 0 8px;
}
.leal-camera-panel .camera-file-filter input {
    margin-top: 4px;
}
.leal-camera-panel .camera-history-scroll,
.leal-camera-panel .camera-events-scroll {
    max-height: 40vh;
    margin-top: 8px;
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border: 1px solid #e1e7ed;
    border-radius: 6px;
    background: #fff;
}
.leal-camera-panel .camera-events-scroll {
    max-height: 28vh;
}
.leal-camera-panel .camera-history-scroll:focus,
.leal-camera-panel .camera-events-scroll:focus {
    outline: 2px solid #7ba8ca;
    outline-offset: 2px;
}
.leal-camera-panel .camera-history-scroll table,
.leal-camera-panel .camera-events-scroll table {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
    font-size: 12px;
}
.leal-camera-panel .camera-history-table {
    min-width: 530px;
}
.leal-camera-panel .camera-history-scroll thead th,
.leal-camera-panel .camera-events-scroll thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 9px 10px;
    border: 0;
    background: #f2f5f8;
    box-shadow: 0 1px 0 #dce3ea;
    color: #45566a;
    font-weight: 600;
    white-space: nowrap;
}
.leal-camera-panel .camera-history-scroll tbody td,
.leal-camera-panel .camera-events-scroll tbody td {
    padding: 7px 10px;
    vertical-align: middle;
    border-top: 1px solid #edf0f4;
}
.leal-camera-panel .camera-history-table tbody td {
    white-space: nowrap;
}
.leal-camera-panel .camera-table-action {
    width: 120px;
    text-align: right;
    white-space: nowrap;
}
.leal-camera-panel .camera-table-action .btn {
    padding: 4px 9px;
    font-size: 12px;
}
.leal-camera-panel .camera-file-name {
    word-break: break-word;
    overflow-wrap: anywhere;
}
.leal-camera-panel .camera-history-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px 12px;
    padding-top: 10px;
}
.leal-camera-panel .camera-history-footer p {
    margin: 0;
    font-size: 12px;
}
.leal-camera-panel .camera-events {
    margin-top: 12px;
    padding-top: 0;
}
.leal-camera-panel .camera-event-details > summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 0;
    color: #45566a;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}
.leal-camera-panel .camera-event-details > summary::-webkit-details-marker {
    display: none;
}
.leal-camera-panel .camera-event-details > summary > .fa {
    margin-left: auto;
    font-size: 10px;
}
.leal-camera-panel .camera-event-details[open] > summary > .fa {
    transform: rotate(180deg);
}
.leal-camera-panel .camera-event-count {
    padding: 1px 6px;
    border-radius: 8px;
    background: #edf1f5;
    color: #637489;
    font-size: 11px;
}
.leal-camera-panel .camera-event-content {
    padding-bottom: 4px;
}
.leal-camera-panel .camera-event-content .camera-searchbar > .camera-hint {
    flex: 1 1 auto;
    align-self: center;
    margin: 0;
}
.leal-camera-player-modal .modal-dialog {
    width: calc(100% - 40px);
    max-width: 1100px;
    margin: 24px auto;
}
.leal-camera-player-modal .modal-content {
    display: flex;
    flex-direction: column;
    max-height: 85vh;
    overflow: hidden;
    border: 0;
    border-radius: 9px;
}
.leal-camera-player-modal .leal-camera-player-header,
.leal-camera-player-modal .leal-camera-player-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    gap: 10px;
    padding: 13px 16px;
    background: #fff;
}
.leal-camera-player-modal .leal-camera-player-header {
    border-bottom: 1px solid #e3e8ed;
}
.leal-camera-player-modal .leal-camera-player-title {
    flex: 1 1 auto;
    order: 0;
    min-width: 0;
    margin: 0;
    color: #273442;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.4;
    overflow-wrap: anywhere;
}
.leal-camera-player-modal .leal-camera-player-header .close {
    flex: 0 0 auto;
    order: 1;
    margin: -3px -3px -3px 5px;
    margin-left: auto;
    padding: 5px;
    font-size: 25px;
    opacity: .65;
}
.leal-camera-player-modal .leal-camera-player-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    padding: 0;
    overflow: auto;
    background: #101820;
}
.leal-camera-player-modal .leal-camera-player-video {
    display: block;
    flex: 1 1 auto;
    width: 100%;
    height: auto;
    min-height: 0;
    max-height: 65vh;
    object-fit: contain;
    background: #101820;
}
.leal-camera-player-modal .leal-camera-player-message {
    flex: 0 0 auto;
    margin: 0;
    padding: 9px 16px;
    background: #f0f5fa;
    color: #40566c;
    font-size: 13px;
    line-height: 1.5;
}
.leal-camera-player-modal .leal-camera-player-body .alert {
    flex-shrink: 0;
    margin: 0;
    border-radius: 0;
}
.leal-camera-player-modal .leal-camera-player-footer {
    flex-wrap: wrap;
    border-top: 1px solid #e3e8ed;
    font-size: 12px;
}
.leal-camera-player-modal .leal-camera-player-footer p {
    margin: 0;
}
@media (max-width: 600px) {
    .leal-camera-panel .camera-toolbar {
        gap: 8px;
    }
    .leal-camera-panel .camera-channel-field {
        flex: 1 1 145px;
        min-width: 0;
    }
    .leal-camera-panel .camera-quality,
    .leal-camera-panel .camera-quality-note {
        flex: 1 0 100%;
        min-height: 24px;
        padding: 0;
    }
    .leal-camera-panel .camera-period {
        flex: 1 0 100%;
        gap: 8px;
    }
    .leal-camera-panel .camera-period label {
        flex: 1 1 140px;
        min-width: 0;
    }
    .leal-camera-panel .camera-period input {
        font-size: 12px;
    }
    .leal-camera-panel .camera-query-button {
        width: 100%;
    }
    .leal-camera-panel .camera-history-footer > .btn {
        margin-left: auto;
    }
    .leal-camera-panel .camera-query-cancel.btn {
        width: 100%;
    }
    .leal-camera-player-modal .modal-dialog {
        width: calc(100% - 16px);
        margin: 8px auto;
    }
    .leal-camera-player-modal .leal-camera-player-header,
    .leal-camera-player-modal .leal-camera-player-footer {
        padding: 10px 12px;
    }
    .leal-camera-player-modal .leal-camera-player-title {
        font-size: 14px;
    }
}
@media (prefers-reduced-motion: reduce) {
    .leal-camera-panel .camera-query-progress-card .fa-spin {
        -webkit-animation: none;
        animation: none;
    }
}

.camera-event-summary{display:flex;flex-wrap:wrap;gap:6px 16px;margin:8px 0 12px;font-size:12px}.camera-event-filters label{min-width:120px}.camera-event-date{white-space:nowrap}.camera-event-state,.camera-event-speed{display:inline-block;margin-left:8px;font-size:12px;color:#59667a}.camera-event-more{font-size:12px;margin-top:4px}.camera-event-more>summary{cursor:pointer;color:#2454a6}.camera-event-more dl{margin:6px 0}.camera-event-more dl>div{display:flex;gap:8px}.camera-event-more dt{font-weight:600}.camera-event-more dd{margin:0}.camera-event-level{display:inline-block;white-space:nowrap;padding:3px 7px;background:#edf2ff;color:#214d9c;border-radius:4px;font-weight:700}.camera-event-level-2{background:#fff0e7;color:#a44200}

.camera-event-notification-settings{margin:8px 0 12px;padding:8px 10px;border:1px solid #dce4f1;border-radius:5px}.camera-event-notification-settings>summary{cursor:pointer;color:#2454a6;font-weight:600}.camera-event-policy-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:10px 0}.camera-event-policy-fields label{display:block}.camera-event-policy-channels label{margin-bottom:8px}.camera-event-policy-feedback{margin:8px 0 0;font-size:12px}

.camera-event-center{max-height:70vh;overflow:auto}.camera-event-center-tools{display:flex;align-items:center;justify-content:space-between;gap:12px}.camera-event-inbox-list{margin:10px 0}.camera-event-inbox-item{display:block;width:100%;text-align:left;padding:12px;border:0;border-bottom:1px solid #dce4f1;background:#fff;line-height:1.5}.camera-event-inbox-item:hover{background:#f4f7ff}.camera-event-unread{border-left:4px solid #2559b3;background:#edf3ff}.camera-event-center dl>div{display:flex;gap:10px}.camera-event-center video{width:100%;max-height:50vh;background:#101a2a}

/* Explicit audio controls share the native player mute state. */
.leal-camera-player-audio { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.camera-audio-note { color:#8a4b08; font-size:12px; line-height:1.4; }
.vc-audio-note { display:block; padding:0 10px 6px; }

/* Camera health and context maps. */
.camera-context-map-canvas{height:240px;width:100%;border:1px solid #d8e1ef;border-radius:8px;z-index:0}.camera-context-map-caption{margin:8px 0;font-size:12px;color:#41536b}.camera-context-map-message{margin:6px 0}.camera-context-vehicle-modal details{margin-bottom:12px}.camera-context-vehicle-modal summary{cursor:pointer;color:#1940a3;font-weight:600}
@media(max-width:600px){.camera-context-map-canvas{height:190px}}

/* Keep fleet health independent from the map sidebar panel styles. */
.camera-event-center .camera-health-item{width:100%;box-sizing:border-box;border:1px solid #d8e1ef;border-radius:6px;background:#fff;margin-bottom:8px}.camera-event-center .camera-health-content{display:block;width:100%;max-width:none;min-width:0;box-sizing:border-box;padding:12px}.camera-event-center .camera-health-header{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-bottom:8px}.camera-event-center .camera-health-facts{display:grid;width:100%;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.camera-event-center .camera-health-fact{min-width:0;overflow-wrap:anywhere}.camera-event-center .camera-health-item details{margin-top:8px}.camera-event-center .camera-health-item summary{cursor:pointer}
@media(max-width:767px){.camera-event-center .camera-health-facts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:420px){.camera-event-center .camera-health-facts{grid-template-columns:1fr}}

/* Full viewport workspace for the two camera centers. */
.leal-camera-layout-window.leal-camera-layout-maximized{padding:0!important;overflow:hidden}
.leal-camera-layout-window.leal-camera-layout-maximized>.modal-dialog{width:100%;max-width:none;height:100vh;margin:0;box-sizing:border-box}
.leal-camera-layout-window.leal-camera-layout-maximized>.modal-dialog>.modal-content{display:flex;flex-direction:column;height:100%;max-height:none;border:0;border-radius:0}
.leal-camera-layout-window.leal-camera-layout-maximized>.modal-dialog>.modal-content>.modal-header,
.leal-camera-layout-window.leal-camera-layout-maximized>.modal-dialog>.modal-content>.modal-footer{flex:0 0 auto}
.leal-camera-layout-window.leal-camera-layout-maximized>.modal-dialog>.modal-content>.modal-body{flex:1 1 auto;min-height:0;max-height:none!important;overflow:auto}
.leal-camera-layout-window.leal-camera-layout-maximized>.modal-dialog>.modal-content>.vc-shell{flex:1 1 auto;width:100%;height:100%;max-height:none;min-height:0;border-radius:0}
.leal-camera-layout-window.leal-camera-layout-maximized .vc-shell>.vc-body{flex:1 1 auto;min-height:0;max-height:none}
.leal-camera-layout-window.leal-camera-layout-maximized .vc-shell>.vc-header,
.leal-camera-layout-window.leal-camera-layout-maximized .vc-shell>.vc-toolbar,
.leal-camera-layout-window.leal-camera-layout-maximized .vc-shell>.vc-footer{flex:0 0 auto}
.leal-camera-layout-window.leal-camera-layout-maximized .vc-sidebar{min-height:0;max-height:none;overflow:auto}
.leal-camera-layout-window .camera-modal-layout-toggle{position:relative;z-index:2;float:right;margin-right:10px;border:1px solid rgba(255,255,255,.45);border-radius:7px;background:rgba(255,255,255,.12);color:#fff;padding:7px 11px;font:inherit;line-height:18px}
.leal-camera-layout-window .camera-modal-layout-toggle:hover,.leal-camera-layout-window .camera-modal-layout-toggle:focus{background:rgba(255,255,255,.24);color:#fff}
.leal-camera-layout-window .camera-modal-layout-toggle:focus-visible{outline:2px solid #fff;outline-offset:2px}
@supports(height:100dvh){.leal-camera-layout-window.leal-camera-layout-maximized>.modal-dialog{height:100dvh}}
/* Compact cards inspired by the supplied dashboard reference. */
.camera-event-center .camera-health-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 18px}
.camera-event-center .camera-health-cards>div{width:auto;max-width:none;padding:0;float:none;margin:0!important;min-width:0}
.camera-event-center .camera-health-summary-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:12px;row-gap:4px;min-height:105px;padding:18px!important;border:1px solid #dce4ef!important;border-top:3px solid var(--camera-card-color,#355ce0)!important;border-radius:10px;background:#fff!important;color:#243650;text-align:left;box-shadow:0 2px 6px rgba(26,53,104,.04);white-space:normal}
.camera-event-center .camera-health-summary-card.is-total{--camera-card-color:#6272ee}
.camera-event-center .camera-health-summary-card.is-recording{--camera-card-color:#249b6c}
.camera-event-center .camera-health-summary-card.is-attention{--camera-card-color:#cb8500}
.camera-event-center .camera-health-summary-card.is-pending{--camera-card-color:#337bc6}
.camera-event-center .camera-health-summary-card .fa{grid-row:1/span 2;grid-column:1;font-size:25px;color:var(--camera-card-color,#355ce0);background:#f0f4fa;border-radius:10px;padding:12px}
.camera-event-center .camera-health-summary-card strong{grid-column:2;grid-row:1;align-self:end;text-align:right;font-size:27px!important;line-height:1.15;color:var(--camera-card-color,#355ce0)}
.camera-event-center .camera-health-summary-card>span{grid-column:2;grid-row:2;align-self:start;text-align:right;font-size:13px;line-height:1.35}
.camera-event-center .camera-health-summary-card.active{background:#f5f8fe!important;border-color:var(--camera-card-color,#355ce0)!important;box-shadow:0 0 0 1px var(--camera-card-color,#355ce0)}
.camera-event-center .camera-health-summary-card:hover{box-shadow:0 3px 12px rgba(26,53,104,.12)}
.camera-event-center .camera-health-item{box-shadow:0 2px 5px rgba(26,53,104,.035)}
.camera-event-center .camera-health-header>strong{font-size:15px;color:#15366d}
.camera-event-center .camera-health-quota{height:6px;background:#e9eef6;border-radius:8px;overflow:hidden;margin:7px 0 4px;max-width:240px}
.camera-event-center .camera-health-quota>span{display:block;height:100%;background:#4077d5;border-radius:8px}
.camera-event-center .camera-health-fact>small{display:block}
.camera-event-center .camera-health-quota-caption{margin-bottom:4px;color:#566981}
@media(max-width:767px){.camera-event-center .camera-health-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.camera-event-center .camera-health-summary-card{padding:12px!important;min-height:95px}.leal-camera-layout-window .camera-modal-layout-toggle{font-size:12px;padding:6px 8px}}
@media(max-width:420px){.camera-event-center .camera-health-summary-card{flex-wrap:wrap;gap:6px}.camera-event-center .camera-health-summary-card .fa{padding:8px;font-size:20px}}

.leal-camera-layout-window .vc-header p,.leal-camera-layout-window .vc-header .vc-eyebrow{color:#e7efff}

/* Reuse the camera-center close button, keeping the controls in visual order. */
.leal-camera-layout-window .vc-header-actions{display:flex;align-items:center;gap:10px;position:relative;z-index:2}
.leal-camera-layout-window .vc-header-actions>.camera-modal-layout-toggle{float:none;margin-right:0}
.leal-camera-layout-window .modal-header.vc-header .vc-header-actions>.close{position:static;transform:none;top:auto;right:auto;float:none;margin:0;flex:0 0 auto}
/* Clear primary and secondary navigation for camera health, media and alerts. */
.camera-event-center .camera-central-tabs{padding:5px;background:#eaf0fa;border:1px solid #dbe4f3;border-radius:11px;align-items:center;margin-bottom:18px!important}
.camera-event-center .camera-central-tabs>.btn{min-height:40px;padding:9px 17px;border:0;border-radius:8px;background:transparent;background-image:none;box-shadow:none;color:#425675;font-weight:600;line-height:22px}
.camera-event-center .camera-central-tabs>.btn:hover{background:#dce6f8;color:#214aa9}
.camera-event-center .camera-central-tabs>.btn.active{background:#214db7;color:#fff;box-shadow:0 2px 5px rgba(30,65,140,.16)}
.camera-event-center .camera-central-tabs>.btn:focus-visible,.camera-event-center>.btn-group[aria-label="Eventos e avisos"]>.btn:focus-visible{outline:2px solid #3472d6;outline-offset:2px}
.camera-event-center>.btn-group[aria-label="Eventos e avisos"]{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px;padding:4px;border:1px solid #dce4f0;border-radius:9px;background:#f1f5fb}
.camera-event-center>.btn-group[aria-label="Eventos e avisos"]>.btn{float:none;min-height:36px;padding:7px 15px;margin:0;border:0;border-radius:6px;background:transparent;background-image:none;box-shadow:none;color:#50617a;font-weight:600}
.camera-event-center>.btn-group[aria-label="Eventos e avisos"]>.btn.active{background:#dbe7ff;color:#1945a9}
.camera-event-center>.btn-group[aria-label="Eventos e avisos"]>.btn:hover{background:#e0e9f7;color:#1945a9}
.camera-event-center .camera-event-center-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:13px 0}
.camera-event-center .camera-event-center-tools label{display:inline-flex;align-items:center;gap:7px;margin:0;font-weight:500}
.camera-event-center .camera-event-center-tools input[type="checkbox"]{margin:0}
@media(max-width:600px){.camera-event-center .camera-central-tabs>.btn{flex:1 1 auto;padding:8px 10px;font-size:13px;white-space:normal}.camera-event-center>.btn-group[aria-label="Eventos e avisos"]>.btn{padding:7px 11px;font-size:13px}}

/* Context workspace: opt-in wrappers only; the previous camera UI stays intact. */
.camera-context-workspace{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-items:start;margin:12px 0}
.camera-context-workspace>.camera-context-main,.camera-context-workspace>.camera-context-aside{min-width:0;max-width:100%;box-sizing:border-box}
.camera-context-workspace .camera-context-media{min-width:0;border-radius:8px;overflow:hidden;background:#101820}
.camera-context-workspace .camera-context-media>video{display:block;width:100%;height:auto;max-height:56vh;object-fit:contain;background:#101820}
.camera-context-workspace .camera-context-media-message{margin:0;padding:10px 12px;background:#edf3fc;color:#314862;font-size:13px;line-height:1.5}
.camera-context-workspace .camera-context-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:240px;padding:22px;text-align:center;color:#dce8f8;background:#101820;box-sizing:border-box}
.camera-context-workspace .camera-context-empty>.fa{font-size:30px;color:#b9cbed}
.camera-context-workspace .camera-context-empty p{max-width:36em;margin:0;line-height:1.5}
.camera-context-workspace .camera-context-facts{display:flex;flex-wrap:wrap;gap:6px 16px;margin:10px 0;color:#425675;font-size:12px;line-height:1.5}
.camera-context-workspace .camera-context-facts>span{min-width:0;overflow-wrap:anywhere}
.camera-context-workspace .camera-context-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:10px 0}
.camera-context-workspace .camera-context-aside{padding:12px;border:1px solid #d8e1ef;border-radius:8px;background:#f7f9fd}
.camera-context-workspace .camera-context-aside-title{margin:0 0 8px;color:#1f3f72;font-size:14px;font-weight:700;line-height:1.5}
.camera-context-workspace .camera-context-aside>leal-camera-context-map{display:block;min-width:0}
.camera-context-workspace .camera-context-map-caption{margin:0 0 9px;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.camera-context-workspace .camera-context-map-canvas{height:300px;min-height:220px;max-width:100%}
.camera-context-workspace .camera-context-map-message,.camera-context-workspace .camera-context-aside-note{margin:9px 0 0;font-size:12px;line-height:1.5;color:#53657d}
.camera-context-workspace .camera-context-clip-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.camera-context-workspace .camera-context-clip-card{flex:1 1 220px;min-width:0;padding:10px;border:1px solid #d8e1ef;border-radius:7px;background:#fff;box-sizing:border-box}
.camera-context-workspace .camera-context-clip-card p{margin:0 0 8px;font-size:12px;line-height:1.5;overflow-wrap:anywhere}
.camera-context-workspace .camera-context-clip-card .camera-context-actions{margin:0}
.camera-event-center .camera-context-event-metrics{display:flex;flex-wrap:wrap;gap:6px 18px;margin:8px 0 12px;font-size:12px}
.camera-event-center .camera-context-event-metrics>div{min-width:0;overflow-wrap:anywhere}
.camera-event-center .camera-context-event-metrics dt{color:#52647f}
.camera-event-center .camera-context-event-metrics dd{margin:0;color:#233e65}

/* Only context players opt into the wider dialog. No close/header rules change. */
.camera-context-player-window>.modal-dialog{width:calc(100% - 32px);max-width:1440px;margin:16px auto}
.camera-context-player-window .modal-body.camera-context-player-body{padding:16px;background:#f8fafd}
.camera-context-player-window .camera-context-player-body>.camera-context-workspace{margin:0}
.leal-camera-player-modal.camera-context-player-window .leal-camera-player-body.camera-context-player-body{display:block;padding:16px;background:#f8fafd}

/* Metadata gallery: previews are icons until an actual thumbnail source exists. */
.camera-context-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:14px;margin:14px 0}
.camera-context-gallery>.camera-context-gallery-card{display:flex;flex-direction:column;min-width:0;border:1px solid #d8e1ef;border-radius:9px;overflow:hidden;background:#fff;box-sizing:border-box}
.camera-context-gallery .camera-context-gallery-preview{display:flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:10px;background:#eaf0fa;color:#31558c;box-sizing:border-box}
.camera-context-gallery .camera-context-gallery-preview>.fa{font-size:22px}
.camera-context-gallery .camera-context-gallery-preview>span{font-size:13px;font-weight:600}
.camera-context-gallery .camera-context-gallery-body{flex:1 1 auto;padding:12px;min-width:0}
.camera-context-gallery .camera-context-gallery-title{margin:0 0 8px;color:#203f70;font-size:14px;font-weight:700;line-height:1.5;overflow-wrap:anywhere}
.camera-context-gallery .camera-context-gallery-facts{margin:0;color:#52647f;font-size:12px;line-height:1.6;overflow-wrap:anywhere}
.camera-context-gallery .camera-context-gallery-actions{display:flex;flex-wrap:wrap;gap:7px;padding:0 12px 12px}
.camera-context-gallery .camera-context-gallery-actions>.btn{margin:0}
.camera-context-gallery .camera-context-gallery-actions>.btn:focus-visible,.camera-context-workspace .camera-context-actions>.btn:focus-visible{outline:2px solid #3472d6;outline-offset:2px}

@media(min-width:1000px){
    .camera-context-workspace{grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr)}
    .camera-context-workspace .camera-context-map-canvas{height:340px}
    .camera-context-workspace.camera-context-workspace-no-map{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:767px){
    .camera-context-player-window>.modal-dialog{width:calc(100% - 16px);margin:8px auto}
    .camera-context-player-window .modal-body.camera-context-player-body,.leal-camera-player-modal.camera-context-player-window .leal-camera-player-body.camera-context-player-body{padding:10px}
    .camera-context-workspace{gap:12px}
    .camera-context-workspace .camera-context-map-canvas{height:220px;min-height:180px}
    .camera-context-workspace .camera-context-media>video{max-height:50vh}
    .camera-context-workspace .camera-context-empty{min-height:180px;padding:18px}
    .camera-context-gallery{grid-template-columns:repeat(auto-fill,minmax(215px,1fr));gap:10px}
}
@media(max-width:479px){.camera-context-gallery{grid-template-columns:minmax(0,1fr)}}