/*
 * ACE (Automation Control Engineering) Suite
 * Copyright (c) 2026 ACE Systems. All rights reserved.
 * Property of ACE Systems - Whakatane, Bay of Plenty, New Zealand.
 *
 * Proprietary and confidential. Unauthorised copying, distribution or
 * modification of this file, in whole or in part, is prohibited.
 */

/* ============================================================
   Bingo / Matrix Bit Array Tables (parser-style, isolated)
   ============================================================ */

.bingo-root {
    font-family: "Consolas", "Courier New", monospace;
    color: #333;
}

.bingo-root .bingo-section > h3 {
    margin: 0 0 8px;
    font-size: 1.0rem;
    border-bottom: 1px solid #ddd;
    padding-bottom: 4px;
    font-weight: 600;
}

.bingo-root .bingo-array-block {
    margin: 10px 0 22px 0;
    padding: 8px 10px 10px;
    background: #fafafa;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.bingo-root .bingo-array-title {
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 6px;
}

.bingo-root .bingo-array-table-wrapper {
    overflow-x: auto;
}

.bingo-root table.bingo-array-table {
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 0.8rem;
    width: max-content;
    min-width: 100%;
}

.bingo-root table.bingo-array-table th,
.bingo-root table.bingo-array-table td {
    border: 1px solid #ccc;
    padding: 3px 4px;
    text-align: center;
    white-space: nowrap;
}

.bingo-root table.bingo-array-table td:first-child {
    background: #f7f7f7;
    font-weight: 600;
}

.bingo-root .bit-zero {
    color: #666;
    background: #ffffff;
}

.bingo-root .bit-one {
    color: #c00;
    font-weight: 700;
    background: #ffe8e8;
}

.bingo-root .bingo-value-cell {
    font-weight: 600;
    color: #444;
}

.bingo-root .bingo-empty-note {
    margin: 4px 0 0;
    font-size: 0.85rem;
    color: #a15c00;
    background: #fff8ec;
    border: 1px solid #f0d9a8;
    border-radius: 4px;
    padding: 6px 8px;
    white-space: normal;
}

/* Auto-derived bit tag-name header row (rotated, spreadsheet-style) */
.bingo-root .bingo-derived-note {
    font-size: 0.78rem; color: #777; font-style: italic; margin: 2px 0 6px;
}
.bingo-root table.bingo-array-table tr.bingo-label-row th {
    border: 1px solid #ccc; background: #fff; padding: 2px 1px;
    vertical-align: bottom; height: 130px;   /* floor — row grows to fit longest label */
}
.bingo-root .bingo-corner { font-size: 0.7rem; color: #999; font-weight: 400; }
.bingo-root .bingo-bit-label-cell { max-width: 24px; }
.bingo-root .bingo-bit-label {
    display: inline-block; writing-mode: vertical-rl; text-orientation: sideways;
    transform: rotate(180deg);
    white-space: nowrap; max-height: 320px; overflow: hidden; text-overflow: ellipsis;
    font-size: 0.8rem; line-height: 1.0; letter-spacing: 0.2px;
    color: #005a9c; font-weight: 600;
}
.bingo-root .bingo-bit-label.bingo-tag-clickable { cursor: pointer; }
.bingo-root .bingo-bit-label.bingo-tag-clickable:hover { color: #003056; text-decoration: underline; background: #eaf3fb; border-radius: 2px; }

/* Tag search / filter */
.bingo-root .bingo-search-bar { margin: 2px 0 12px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bingo-root .bingo-search-input {
    padding: 6px 10px; font-size: 0.9rem; border: 1px solid #bbb; border-radius: 4px;
    width: 340px; max-width: 70%;
}
.bingo-root .bingo-search-input:focus { outline: none; border-color: #005a9c; box-shadow: 0 0 0 2px rgba(0,90,156,.15); }
.bingo-root .bingo-search-count { font-size: 0.8rem; color: #666; }
.bingo-root .bingo-jump-code {
    padding: 5px 10px; font-size: 0.82rem; cursor: pointer;
    border: 1px solid #005a9c; background: #eaf3fb; color: #004a82; border-radius: 4px;
}
.bingo-root .bingo-jump-code:hover { background: #d8e9f8; }
/* Floating return button — JS positions it next to the active code match */
.bingo-back-btn {
    position: fixed; top: 12px; left: 50%; transform: translateX(-50%); z-index: 1000;
    padding: 7px 12px; font-size: 0.85em; font-weight: bold; cursor: pointer;
    color: #fff; background: #00497e; border: 1.5px solid #fff; border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0,0,0,.35); white-space: nowrap;
}
.bingo-back-btn:hover { background: #003056; }
.bingo-root .bingo-bit-label.bingo-match { background: #ffe98a; color: #6b5200; border-radius: 2px; }
.bingo-root .bingo-array-title.bingo-title-match { background: #ffe98a; padding: 0 4px; border-radius: 2px; }
.bingo-root td.bingo-col-match,
.bingo-root th.bingo-col-match { box-shadow: inset 2px 0 0 #e0a800, inset -2px 0 0 #e0a800; }
.bingo-root .bingo-array-block.bingo-dim { opacity: 0.3; transition: opacity .15s; }
.bingo-root th.bingo-steptime-head { background: #eef6ec; color: #2c5d2c; border-left: 2px solid #b9d6b0; white-space: nowrap; }
.bingo-root td.bingo-steptime-cell { background: #f4faf2; color: #2c5d2c; font-weight: 700; text-align: center; border-left: 2px solid #b9d6b0; }