/* Schedule page (Views/ProjectSchedules/Index.cshtml) - auto-extracted dari <style> block dalam .cshtml, supaya senang cari/edit CSS berasingan dari markup. */

            .schedule-tabs {
                display: flex;
                flex-wrap: wrap;
                gap: 4px;
                border-bottom: 2px solid var(--steel-tint);
                margin: 8px 0 12px;
            }

            .schedule-tab {
                background: transparent;
                border: none;
                padding: 8px 14px;
                font-family: 'Oswald', sans-serif;
                font-size: 0.72rem;
                text-transform: uppercase;
                letter-spacing: 0.03em;
                color: var(--ink);
                opacity: 0.65;
                cursor: pointer;
                border-bottom: 3px solid transparent;
                transition: opacity 0.12s ease, border-color 0.12s ease;
            }

                .schedule-tab:hover {
                    opacity: 1;
                }

                .schedule-tab.active {
                    opacity: 1;
                    color: #FFFFFF;
                    border-bottom-color: var(--steel);
                    font-weight: 600;
                }
        

                .dept-filter-chip {
                    display: inline-flex;
                    align-items: center;
                    gap: 6px;
                    font-size: 0.82rem;
                    cursor: pointer;
                    color: var(--ink);
                }
                /* Override semua butang FullCalendar supaya nampak macam btn-schedule */
                #projectCalendar .fc-button {
                    background: var(--steel-dark);
                    border: 1px solid var(--steel);
                    color: #FFFFFF;
                    font-family: 'Oswald', sans-serif;
                    font-weight: 500;
                    letter-spacing: 0.03em;
                    text-transform: uppercase;
                    font-size: 0.72rem;
                    padding: 6px 12px;
                    border-radius: 6px;
                    box-shadow: none;
                    transition: background-color 0.12s ease;
                }

                    #projectCalendar .fc-button:hover {
                        background: var(--steel-tint);
                        border-color: var(--steel);
                    }

                    #projectCalendar .fc-button:focus {
                        box-shadow: none;
                    }

                /* Butang yang sedang aktif (contoh: bila "Week" dipilih) */
                #projectCalendar .fc-button-active,
                #projectCalendar .fc-button-primary:not(:disabled).fc-button-active {
                    background: var(--steel);
                    border-color: var(--steel);
                }

                /* Butang disabled (contoh: "prev" bila dah di bulan paling awal) */
                #projectCalendar .fc-button:disabled {
                    opacity: 0.5;
                }

                /* Tambah blok baru ni - untuk highlight "today" */
                #projectCalendar .fc-day-today {
                    background-color: darkslategray;
                    box-shadow: inset 0 0 0 2px var(--steel);
                }

                    #projectCalendar .fc-day-today .fc-daygrid-day-number {
                        background: var(--steel);
                        color: #FFFFFF;
                        border-radius: 50%;
                        width: 24px;
                        height: 24px;
                        display: inline-flex;
                        align-items: center;
                        justify-content: center;
                        font-weight: 600;
                        font-family: 'Oswald', sans-serif;
                    }
            

                    #ProjectNo {
                        color: white;
                        text-transform: uppercase;
                    }
                

                    #ProjectName {
                        color: white;
                    }
                

                    #CustomerName {
                        color: white;
                    }
                

                    #NameDesigner {
                        color: white;
                    }
                

                    #NameAssembly {
                        color:white;
                    }
                

                    #NameElectrical {
                        color: white;
                    }
                

                    #StartDesigner {
                        color: white;
                    }

                    #StartDesigner::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #DateDesigner {
                        color: white;
                    }

                    #DateDesigner::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #StartAssembly {
                        color: white;
                    }

                    #StartAssembly::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #DateAssembly {
                        color: white;
                    }

                    #DateAssembly::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #StartElectrical {
                        color: white;
                    }

                    #StartElectrical::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #DateElectrical {
                        color: white;
                    }

                    #DateElectrical::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #StartProgrammer {
                        color: white;
                    }

                    #StartProgrammer::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #DateProgrammer {
                        color: white;
                    }

                    #DateProgrammer::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #StartFabrication {
                        color: white;
                    }

                    #StartFabrication::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #DateFabrication {
                        color: white;
                    }

                    #DateFabrication::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #SummaryDesigner {
                        color: white;
                    }
                

                    #SummaryPurchase {
                        color: white;
                    }
                

                    #SummaryFabricate {
                        color: white;
                    }
                

                    #SummaryAssembly {
                        color: white;
                    }
                

                    #SummaryElectrical {
                        color: white;
                    }
                

                    #SummaryProgrammer {
                        color: white;
                    }
                

                    #PoReceived {
                        color:white;
                    }

                    #PoReceived::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #DateDelivery {
                        color: white;
                    }

                    #DateDelivery::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #DatePdi {
                        color: white;
                    }

                    #DatePdi::-webkit-calendar-picker-indicator {
                        filter: invert(1);
                        cursor: pointer;
                    }
                

                    #ProjectStatus {
                        color: white;
                    }
                

                    #Note {
                        color:white;
                    }
                    #Note::placeholder {
                        color: white;
                    }
                

                /* Guna custom class ni (bukan Bootstrap "d-flex") sebab utility class Bootstrap
                   guna !important pada display, jadi dia akan override inline style="display:none"
                   yang JS letak untuk sorok/papar panel ni ikut ada/tiada project dipilih. */
                .document-upload-area {
                    display: none;
                    flex-wrap: wrap;
                    align-items: center;
                    gap: 0.5rem;
                    margin-bottom: 0.5rem;
                }

                #documentCategory {
                    color: white;
                }

                #documentTable {
                    width: 100%;
                    border-collapse: collapse;
                    font-size: 0.82rem;
                }

                    #documentTable th,
                    #documentTable td {
                        border: 1px solid var(--line);
                        padding: 0.5rem 0.6rem;
                        text-align: left;
                        color: var(--ink);
                    }

                    #documentTable thead th {
                        background: var(--steel-dark);
                        color: #FFFFFF;
                        font-family: 'Oswald', sans-serif;
                        font-weight: 500;
                        letter-spacing: 0.03em;
                        text-transform: uppercase;
                        font-size: 0.72rem;
                    }

                .document-action-link {
                    color: var(--steel);
                    cursor: pointer;
                    margin-right: 0.75rem;
                    text-decoration: underline;
                }

                .document-action-link.delete-link {
                    color: var(--status-red);
                }
            

                #safetyChecklistTable {
                    width: 100%;
                    border-collapse: collapse;
                    font-size: 0.82rem;
                }

                    #safetyChecklistTable th,
                    #safetyChecklistTable td {
                        border: 1px solid var(--line);
                        padding: 0.5rem 0.6rem;
                        text-align: left;
                        color: var(--ink);
                    }

                    #safetyChecklistTable thead th {
                        background: var(--steel-dark);
                        color: #FFFFFF;
                        font-family: 'Oswald', sans-serif;
                        font-weight: 500;
                        letter-spacing: 0.03em;
                        text-transform: uppercase;
                        font-size: 0.72rem;
                    }

                .safety-check-checkbox {
                    transform: scale(1.3);
                    cursor: pointer;
                }

                .safety-check-input {
                    background: var(--surface-sunken);
                    color: white;
                    border: 1px solid var(--line);
                    border-radius: 4px;
                    padding: 0.3rem 0.4rem;
                    font-size: 0.82rem;
                    width: 100%;
                    box-sizing: border-box;
                }
            

            .table-scroll-summary {
                max-height: 500px;
                overflow-y: auto;
            }

            #summaryStatusProject th,
            #summaryStatusProject td {
                border: 1px solid var(--line);
            }

            #summaryStatusProject {
                width: 100%;
                border-collapse: collapse;
                font-size: 0.82rem;
            }

            #summaryStatusProject thead th {
                position: sticky;
                top: 0;
                background: var(--steel-dark);
                color: #FFFFFF;
                font-family: 'Oswald', sans-serif;
                font-weight: 500;
                letter-spacing: 0.03em;
                text-transform: uppercase;
                font-size: 0.72rem;
                padding: 0.6rem 0.6rem;
                text-align: left;
                border-color: var(--steel);
                z-index: 2;
            }

            #summaryStatusProject tbody td {
                padding: 0.5rem 0.6rem;
                vertical-align: middle;
                color: var(--ink);
            }

            #summaryStatusProject tbody tr {
                cursor: pointer;
                transition: background-color 0.12s ease;
            }

            #summaryStatusProject tbody tr:hover {
                background: var(--steel-tint);
            }

            #summaryStatusProject tbody tr.is-selected {
                outline: 2px solid var(--steel);
                outline-offset: -2px;
            }
    
