/* busbar-report.css — Reports > subpestana Bus Bar (2026-10-16b) */

#reports-module[hidden], #busbar-report-module[hidden], #reports-subtabs[hidden], .bbr [hidden] { display: none !important; }

.bbr-subtabs { display: flex; width: max-content; margin: 0 auto 14px; }

.bbr-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; flex-wrap: wrap; }
.bbr .bbr-title { margin: 0 !important; padding: 0 !important; font-size: 18px; color: #222 !important; text-align: left !important; background: none !important; }
.bbr-head > div { text-align: left; }
.bbr-sub { font-size: 12.5px; color: #777; margin-top: 2px; }
.bbr-download {
    background: #3C3489; color: #fff; border: none; border-radius: 8px; padding: 9px 16px; font-size: 13px; font-weight: 600;
    cursor: pointer; display: inline-flex; align-items: center; gap: 6px; width: auto !important; margin: 0 !important;
}
.bbr-download:hover { background: #2f2970; }

.bbr-nav { display: flex; align-items: center; gap: 8px; }
.bbr-period-label { font-size: 13px; font-weight: 600; color: #333; min-width: 220px; text-align: center; }
.bbr-filters { margin-top: -6px; }
.bbr-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #555; cursor: pointer; }
.bbr-check input { width: auto !important; margin: 0 !important; }

.bbr-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin-bottom: 16px; }
.bbr-tile { background: #fff; border: 1px solid #e6e6ee; border-radius: 10px; padding: 10px 12px; }
.bbr-tile b { display: block; font-size: 22px; color: #222; }
.bbr-tile b small { font-size: 12px; color: #888; font-weight: 500; }
.bbr-tile span { font-size: 10.5px; color: #888; text-transform: uppercase; letter-spacing: .3px; }
.bbr-red { color: #C62828 !important; }
.bbr-amber { color: #a16207 !important; }

.bbr-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(460px, 1fr)); gap: 12px; }
.bbr-empty { grid-column: 1 / -1; text-align: center; color: #888; padding: 36px 12px; border: 1px dashed #ddd; border-radius: 10px; font-size: 13px; }
.bbr-card { background: #fff; border: 1px solid #e6e6ee; border-left: 4px solid #C62828; border-radius: 10px; padding: 12px 14px; }
.bbr-card-norep { border-left-color: #E8C670; }
.bbr-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.bbr-card-id { font-weight: 700; font-size: 14px; color: #222; }
.bbr-type { font-weight: 600; color: #3C3489; margin-left: 4px; }
.bbr-rep { font-size: 10.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; }
.bbr-rep.yes { background: rgba(27,126,63,.1); color: #1b7e3f; }
.bbr-rep.no { background: #FFF4D6; color: #7A5600; }
.bbr-card-loc { font-size: 12.5px; color: #555; margin: 6px 0 10px; }
.bbr-card-loc .bb-reason-badge { margin-left: 6px; }
.bbr-card-body { display: flex; gap: 12px; }
.bbr-card-main { flex: 1; min-width: 0; }
.bbr-people { display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; margin-bottom: 10px; }
.bbr-people div { display: flex; flex-direction: column; font-size: 12px; }
.bbr-people span { font-size: 9.5px; color: #999; text-transform: uppercase; letter-spacing: .3px; font-weight: 600; }
.bbr-people strong { color: #222; }
.bbr-people em { font-style: normal; color: #777; font-size: 11px; }
.bbr-comment { font-size: 12.5px; color: #333; background: #f6f6fa; border-left: 3px solid #3C3489; border-radius: 5px; padding: 7px 10px; white-space: pre-wrap; word-break: break-word; }
.bbr-comment.empty { color: #999; font-style: italic; border-left-color: #ccc; }
.bbr-photo { width: 110px; height: 110px; flex-shrink: 0; border-radius: 8px; overflow: hidden; padding: 0; border: 1px solid #e6e6ee; background: #fafafa; cursor: zoom-in; margin: 0 !important; }
.bbr-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bbr-photo-none { cursor: default; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: #aaa; font-size: 10.5px; border-style: dashed; }
.bbr-photo-none i { font-size: 20px; }

.bbr-lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.85); z-index: 10040; display: flex; align-items: center; justify-content: center; padding: 20px; cursor: zoom-out; }
.bbr-lightbox img { max-width: 100%; max-height: 100%; border-radius: 8px; box-shadow: 0 10px 40px rgba(0,0,0,.5); }

@media (max-width: 600px) {
    .bbr-cards { grid-template-columns: 1fr; }
    .bbr-card-body { flex-direction: column; }
    .bbr-photo { width: 100%; height: 180px; }
    .bbr-people { grid-template-columns: 1fr 1fr; }
    .bbr-period-label { min-width: 0; }
    #bbr-scope { flex-wrap: wrap; border-radius: 14px; }
    .bbr-photo-none { height: 56px; flex-direction: row; }
    .bbr-download { width: 100% !important; justify-content: center; }
}

/* ===== Dark mode ===== */
body.dark-mode .bbr .bbr-title { color: #f0f2f5 !important; }
body.dark-mode .bbr-sub, body.dark-mode .bbr-check { color: #a0a4ab; }
body.dark-mode .bbr-period-label { color: #e2e4e8; }
body.dark-mode .bbr-download { background: #5a4fb8; }
body.dark-mode .bbr-tile, body.dark-mode .bbr-card { background: #1e222a; border-color: #383d47; }
body.dark-mode .bbr-card { border-left-color: #F87171; }
body.dark-mode .bbr-card-norep { border-left-color: #F3D27A; }
body.dark-mode .bbr-tile b, body.dark-mode .bbr-card-id, body.dark-mode .bbr-people strong { color: #f0f2f5; }
body.dark-mode .bbr-red { color: #F87171 !important; }
body.dark-mode .bbr-amber { color: #F3D27A !important; }
body.dark-mode .bbr-type { color: #b8b0ea; }
body.dark-mode .bbr-card-loc, body.dark-mode .bbr-people em { color: #a0a4ab; }
body.dark-mode .bbr-rep.yes { background: rgba(74,222,128,.12); color: #86efac; }
body.dark-mode .bbr-rep.no { background: #3a3016; color: #F3D27A; }
body.dark-mode .bbr-comment { background: #252a33; color: #e2e4e8; border-left-color: #8b7fd6; }
body.dark-mode .bbr-comment.empty { color: #6b717c; border-left-color: #444; }
body.dark-mode .bbr-photo { background: #20242c; border-color: #383d47; }
body.dark-mode .bbr-photo-none { color: #6b717c; }
body.dark-mode .bbr-empty { border-color: #383d47; color: #a0a4ab; }

/* Editar nota (2026-10-16c) */
.bbr-card-actions { display: flex; align-items: center; gap: 6px; }
.bbr-edit {
    font-size: 11px; font-weight: 600; padding: 3px 9px; border-radius: 999px; cursor: pointer;
    border: 1px solid #c9c5ea; background: #fff; color: #3C3489; width: auto !important; margin: 0 !important;
    display: inline-flex; align-items: center; gap: 4px;
}
.bbr-edit:hover { background: rgba(60,52,137,0.07); }
.bbr-edited { margin-top: 6px; font-size: 11px; color: #888; font-style: italic; }
body.dark-mode .bbr-edit { background: #252a33; border-color: #4a4380; color: #b8b0ea; }
body.dark-mode .bbr-edited { color: #8a919c; }
