/* SYSTEM REPLICA GRAPHIC & COLOR CORE CSS - ABSOLUTE BLUE/GRAY PROTOCOL */
* {
    box-sizing: border-box;
}
html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
}
body { 
    font-family: "Segoe UI", Tahoma, Arial, sans-serif; 
    background-color: #f0f0f0; 
    color: #000000; 
    font-size: 13px; 
}
header { 
    background-color: #003366; 
    color: #ffffff; 
    padding: 10px 20px; 
    border-bottom: 4px solid #002244; 
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}
.header-right-block {
    display: flex;
    flex-direction: column;
}
.main-title { 
    margin: 0; 
    font-size: 18px; 
    font-weight: bold; 
}
.user-id-meta { 
    font-size: 12px; 
    margin-top: 5px; 
    color: #cccccc; 
}
.site-status-badge {
    color: #b7d2f3;
}

/* Institutional WTFAQ Blue/Azure Button Style */
.wtfaq-nav-btn {
    background-color: #e4f0fc;
    color: #003366;
    font-weight: bold;
    font-size: 12px;
    padding: 6px 14px;
    border: 1px solid #b7d2f3;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 2px;
    text-decoration: none;
    transition: background-color 0.1s ease;
}
.wtfaq-nav-btn:hover {
    background-color: #dfebf7;
}

/* Institutional Side-Aligned Layout */
main { 
    background: #ffffff; 
    padding: 20px; 
    margin: 20px; 
    border: 1px solid #999999; 
    width: calc(100% - 40px);
}

/* Tab View Switcher Styles (Excel / Net-HaMishpat Style) */
.view-switcher-container {
    display: flex;
    gap: 5px;
    border-bottom: 2px solid #003366;
    padding-bottom: 0;
    margin-bottom: 15px;
}
.view-btn {
    padding: 8px 16px;
    background-color: #e0e0e0;
    color: #000000;
    font-weight: normal;
    font-size: 13px;
    border: 1px solid #999999;
    border-bottom: none;
    cursor: pointer;
    display: inline-block;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    user-select: none;
}
.view-btn:hover {
    background-color: #e4f0fc;
}

/* PURE CSS TAB VIEW SWITCHER MATRIX ROUTING LOGIC */
.view-section {
    display: none; /* הסתרה מוחלטת כברירת מחדל */
}

/* התנהגות כאשר תיקי אכיפה מוצגים */
#view-cases:checked ~ main #section-cases {
    display: block;
}
#view-cases:checked ~ main .view-switcher-container .btn-cases {
    background-color: #003366;
    color: #ffffff;
    font-weight: bold;
    border-color: #003366;
}

/* התנהגות כאשר בקשות חופש מידע מוצגות */
#view-foi:checked ~ main #section-foi {
    display: block;
}
#view-foi:checked ~ main .view-switcher-container .btn-foi {
    background-color: #003366;
    color: #ffffff;
    font-weight: bold;
    border-color: #003366;
}

/* Anti-Scroll Grid Table Interface */
.table-container {
    width: 100%;
    overflow-x: hidden;
    margin-top: 5px;
}
.ngcs-grid-table { 
    width: 100%; 
    border-collapse: collapse; 
    table-layout: fixed; 
}
.ngcs-grid-table th { 
    background-color: #e0e0e0; 
    color: #000000; 
    padding: 8px; 
    text-align: right; 
    border: 1px solid #999999; 
    font-weight: bold; 
}
.ngcs-grid-table td { 
    padding: 8px; 
    border: 1px solid #999999; 
    text-align: right; 
    word-wrap: break-word;
    overflow-wrap: break-word;
    vertical-align: middle;
}
.ngcs-grid-table tr:nth-child(even) { 
    background-color: #f9f9f9; 
}
.ngcs-grid-table tr:hover {
    background-color: #e4f0fc;
}

/* Desktop Width Configurations - Absolute Minimal Footprint */
.col-case-num { width: 110px; }
.col-case-target { width: 120px; }
.col-case-fault { width: auto; }

/* Micro-Layout Inside Case Cell Trigger Link (No underline) */
.engine-open-popup-trigger { 
    color: #003366; 
    text-decoration: none; 
    cursor: pointer; 
    display: block;
    line-height: 1.2;
}
.case-type {
    display: block;
    font-size: 14px;
    font-weight: bold;
}
.case-num {
    display: block;
    font-size: 11px;
    font-weight: normal;
    color: #444444;
    margin-top: 1px;
}

/* Modal Engine Conditional Architecture */
.radio-secret-engine { 
    display: none; 
}
.modal-overlay { 
    display: none; 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    background: rgba(0, 0, 0, 0.5); 
    align-items: center; 
    justify-content: center; 
    z-index: 1000; 
    padding: 10px;
    cursor: pointer;
}

#popup-act101:checked ~ #overlay-act101,
#popup-act102:checked ~ #overlay-act102,
#popup-act103:checked ~ #overlay-act103,
#popup-act104:checked ~ #overlay-act104,
#popup-act105:checked ~ #overlay-act105,
#popup-act106:checked ~ #overlay-act106,
#popup-act107:checked ~ #overlay-act107,
#popup-act108:checked ~ #overlay-act108,
#popup-act109:checked ~ #overlay-act109,
#popup-act110:checked ~ #overlay-act110,
#popup-act111:checked ~ #overlay-act111,
#popup-act112:checked ~ #overlay-act112,
#popup-act113:checked ~ #overlay-act113,
#popup-info:checked ~ #overlay-info { 
    display: flex; 
}

.modal-content { 
    width: 85%; 
    height: 80%; 
    background: #ffffff; 
    padding: 20px; 
    position: relative; 
    border: 2px solid #003366; 
    cursor: default;
}
.modal-close { 
    position: absolute; 
    top: 5px; 
    left: 5px; 
    cursor: pointer; 
    font-size: 20px; 
    font-weight: bold; 
    background: #eeeeee; 
    padding: 5px; 
    border: 1px solid #333333; 
    line-height: 1;
    color: #000000;
}
iframe { 
    width: 100%; 
    height: 100%; 
    border: none; 
}
.disclosure-box { 
    margin-top: 40px; 
    font-size: 11px; 
    color: #333333; 
    border-top: 1px solid #999999; 
    padding-top: 10px; 
}

/* CRITICAL MOBILE RECONSTRUCTION PROTOCOL */
@media (max-width: 600px) {
    header {
        flex-direction: row;
        justify-content: space-between;
        padding: 10px;
    }
    .main-title {
        font-size: 14px;
    }
    .user-id-meta {
        font-size: 11px;
    }
    main {
        margin: 10px;
        padding: 10px;
        width: calc(100% - 20px);
    }
    
    .view-switcher-container {
        margin-bottom: 10px;
    }
    .view-btn {
        padding: 6px 12px;
        font-size: 12px;
        flex-grow: 1;
        text-align: center;
    }

    .ngcs-grid-table {
        display: block;
    }
    .ngcs-grid-table thead {
        display: none;
    }
    
    .ngcs-grid-table td.cell-case-target {
        display: none !important;
    }
    
    .ngcs-grid-table tbody, 
    .ngcs-grid-table tr, 
    .ngcs-grid-table td { 
        display: block; 
        width: 100% !important; 
    }
    
    .ngcs-grid-table tr {
        margin-bottom: 15px;
        border: 1px solid #999999;
        background-color: #ffffff !important;
        padding: 5px;
    }
    
    .ngcs-grid-table td {
        border: none;
        padding: 6px 8px;
        text-align: right;
        position: relative;
    }
    
    .ngcs-grid-table td.cell-case-num {
        background-color: #e4f0fc;
        padding: 8px;
        display: flex !important;
        justify-content: space-between;
        align-items: center;
    }
    
    .ngcs-grid-table td.cell-case-num::after {
        content: attr(data-target);
        font-weight: bold;
        color: #003366;
        font-size: 13px;
    }
    
    .ngcs-grid-table td.cell-case-fault {
        display: block;
        width: 100% !important;
        font-size: 12px;
        line-height: 1.4;
        padding-top: 10px;
    }
    
    .engine-open-popup-trigger {
        display: inline-block;
    }
    .case-type {
        display: inline;
        font-size: 13px;
        margin-left: 5px;
    }
    .case-num {
        display: inline;
        font-size: 13px;
        color: #003366;
    }

    .modal-content {
        width: 96%;
        height: 92%;
        padding: 10px;
    }
    .modal-close {
        top: 2px;
        left: 2px;
        padding: 6px;
    }
}