/* ==========================================================================
   Log Books & Registers: generator logbook, glance tiles, electricity meter
   ========================================================================== */

.logbook-body { flex: 1; display: flex; gap: 10px; align-items: flex-start; min-height: 0; }

.logbook-art {
    flex: 0 0 300px;
    border: 1px solid var(--panel-border);
    background: var(--surface);
    overflow: hidden;
}

.logbook-art svg { width: 100%; height: auto; display: block; }
.glance-art { flex: 0 0 340px; }
.meter-art { flex: 0 0 340px; }

.logbook-panels {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}

/* -- section frames ------------------------------------------------------- */

.logbook-section {
    border: 1px solid var(--panel-border);
    background: var(--surface);
}

.logbook-section-title {
    padding: 4px 10px;
    border-bottom: 1px solid var(--panel-border);
    font-size: 12px;
    font-weight: 700;
    color: var(--ink);
}

.logbook-section-body { display: flex; gap: 12px; padding: 8px 10px; align-items: flex-start; }

.logbook-entry { flex: 0 0 420px; }
.logbook-side { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }

.logbook-buttons { display: flex; gap: 6px; justify-content: flex-end; }

.logbook-radio { font-size: 12px; font-weight: 700; color: #7a1420; }

/* -- tiles ---------------------------------------------------------------- */

.logbook-tile-caption { font-size: 12px; font-weight: 700; }

.logbook-tile-pair { display: flex; gap: 10px; }

.gen-tile {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 150px;
    text-align: center;
}

.gen-tile > div {
    padding: 5px 8px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.15;
}

.gen-tile-big > div { font-size: 18px; padding: 7px 8px; }

.gen-tile-head { background: #101010; color: #fff; font-size: 12px !important; }
.gen-tile-date { background: #1f8a1f; color: #fff; }
.gen-tile-value { background: #f07d12; color: #fff; }
.gen-tile-qty { background: #f2c200; color: #202020; }
.gen-tile-due { background: #7a1420; color: #fff; }

.logbook-stock { flex: 0 0 180px; display: flex; flex-direction: column; gap: 6px; }
.gen-tile-stock { min-width: 0; }
.logbook-transfer { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }

.logbook-ondue {
    display: flex;
    flex-direction: column;
    gap: 12px;
    font-size: 13px;
    font-weight: 700;
    padding-top: 64px;
}

.glance-ondue { padding-top: 74px; }

/* -- glance --------------------------------------------------------------- */

.glance-row { align-items: flex-start; }
.glance-tiles { flex: 1; }

.glance-detail-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 10px 14px;
    background: linear-gradient(#ffffff, #dfe9f1);
    border: 1px solid #7f9ab1;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 700;
    color: #14507f;
}

.glance-detail-btn svg { width: 22px; height: 22px; }
.glance-detail-btn:hover { background: #eef4f9; }

/* -- electricity meter ----------------------------------------------------- */

.meter-previous { font-size: 12px; color: #96271b; white-space: nowrap; }

.meter-log-grid { flex: 1; }
.meter-log-body { max-height: 320px; }

.mt-col { padding: 3px 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-right: 1px solid #eef2f6; }
.mt-col-sr { width: 60px; flex-shrink: 0; }
.mt-col-date { width: 92px; flex-shrink: 0; }
.mt-col-time { width: 76px; flex-shrink: 0; }
.mt-col-reading { width: 100px; flex-shrink: 0; text-align: right; }
.mt-col-remarks { flex: 1; min-width: 100px; border-right: none; }