/* =====================================================================
   Papildus stili W3.CSS bāzei — signālplānu vizualizācijai
   ===================================================================== */

/* Joslas satura konteiners — Flex layout, 1 šūna = 1 sekunde */
.row-flex-container {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    height: 30px;
    box-sizing: border-box;
    /* Visu šūnu kopējais platums = tabulas joslas platums */
}

/* Viena sekundes šūna signāla joslā */
.sec-cell {
    flex: 1;
    /* sadalās vienmērīgi: N šūnas aizpilda 100% */
    height: 100%;
    box-sizing: border-box;
    /* Plāna baltā līnija starp sekundēm */
    border-right: 1px solid rgba(255, 255, 255, 0.25);
    min-width: 0;
    /* ļauj šūnām kļūt ļoti šaurām lielos periodos */
}

/* Biezāka atzīme ik 5 sekundes */
.sec-cell.thick-border {
    border-right: 1px solid rgba(0, 0, 0, 0.35);
}

/* Vēl biezāka atzīme ik 10 sekundes */
.sec-cell.extra-border {
    border-right: 2px solid rgba(0, 0, 0, 0.55);
}

/* Signāla krāsas */
.sig-red {
    background-color: #e53935;
    /* sarkans */
}

.sig-green {
    background-color: #43a047;
    /* zaļš */
}

.sig-yellow {
    background-color: #fdd835;
    /* dzeltens */
}

/* Sarkans + dzeltens (pirms zaļā) — svītrojums */
.sig-ry {
    background: repeating-linear-gradient(45deg,
            #e53935,
            #e53935 4px,
            #fdd835 4px,
            #fdd835 8px);
}

/* Laiku joslas galvene */
.timeline-ticks {
    position: relative;
    height: 30px;
    width: 100%;
    border-bottom: 1px solid #555;
}

/* Laika atzīmes punkts galvenē */
.tick-mark {
    position: absolute;
    bottom: 0;
    text-align: center;
}

/* Virziens kolonnas platums */
.virziens-col {
    width: 100px;
    font-weight: bold;
    border-right: 2px solid #ccc;
    vertical-align: middle;
    white-space: nowrap;
}

/* Laiku joslas kolonna — aizpilda atlikušo platumu */
.timeline-col {
    position: relative;
    width: calc(100% - 100px);
}

/* Signāla konteiners (vecais stils, saglabāts saderībai) */
.signal-container {
    width: 300px;
    height: 20px;
    background-color: #eee;
    border: 1px solid #ccc;
    position: relative;
    overflow: hidden;
}

.signal-block {
    height: 100%;
    position: absolute;
    top: 0;
}