/* ===================== ROOT ===================== */
            :root {
                --primary: #6b6a55;
                --secondary: #d6e400;
                --bg: #f4f4f4;
                --card: #ffffff;
                --shadow: 0 15px 40px rgba(0, 0, 0, .15);
                --radius: 18px;
                --transition: .4s ease;
                --success: #4CAF50;
                --success-bg: #e8f5e9;
                --sidebar-brown: #5d5a4d;
                --highlight: #c9e000;
            }

            /* ===================== RESET ===================== */
            * {
                margin: 0;
                padding: 0;
                box-sizing: border-box;
                font-family: 'Segoe UI', sans-serif;
            }

            body {
                background: linear-gradient(135deg, #ececec, #fafafa);
                display: flex;
                align-items: center;
                justify-content: center;
                padding: 20px;
                padding-top: 0px;
            }

            /* ===================== CONTAINER ===================== */
            .app-container {
                width: 800px;/*950px;*/
                height: 620px;
                background: var(--card);
                border-radius: var(--radius);
                box-shadow: var(--shadow);
                padding: 15px;
                display: flex;
                flex-direction: column;
            }

            /* ===================== BREADCRUMBS ===================== */
            .breadcrumbs {
                font-size: 14px;
                color: #888;
                margin-bottom: 15px;
                display: flex;
                gap: 8px;
            }

            .crumb {
                color: #888;
            }

            .crumb.active {
                color: var(--primary);
                font-weight: 700;
            }

            .crumb::after {
                content: ">";
                margin-left: 8px;
                color: #ccc;
                font-weight: 400;
            }

            .crumb:last-child::after {
                content: "";
            }

            /* ===================== LAYOUT ===================== */
            .app-header {
                font-size: 21px;
                font-weight: 700;
                margin-bottom: 10px;
                color: #333;
            }

            .layout {
                display: grid;
                grid-template-columns: 3fr 1.2fr;
                gap: 25px;
                height: 430px;
            }

            .grid {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
                gap: 20px;
            }

            .grid-1 {
                height: 85px;
            }

            .grid-3 {
                grid-template-columns: repeat(3, 1fr);
                height: 430px;
                align-content: start;
            }

            /* ===================== CARDS ===================== */
            .card {
                background: var(--primary);
                color: #fff;
                padding: 35px 20px;
                border-radius: var(--radius);
                cursor: pointer;
                transition: var(--transition);
                border: none;
                text-align: left;
                position: relative;
            }

            .card:hover {
                background: var(--highlight);
                color: black;
            }

            .card-pg2 {
                height: 130px;
            }

            .card-pg2 h3 {
                margin: 0 0 8px 0;
            }

            .card-pg2 p {
                margin: 0;
                display: -webkit-box;
                -webkit-line-clamp: 3;
                -webkit-box-orient: vertical;
                overflow: hidden;
                text-overflow: ellipsis;
                line-height: 1.4;
            }

            /* ===================== HELP PANEL ===================== */
            .help-panel {
                background: #ffffff;
                border-radius: var(--radius);
                padding: 20px;
                box-shadow: var(--shadow);
                position: sticky;
                top: 20px;
                min-height: 200px;
                overflow: hidden;
            }

            .help-title {
                font-weight: 700;
                margin-bottom: 10px;
                font-size: 18px;
                color: var(--primary);
            }

            .help-text {
                color: #555;
                line-height: 1.5;
                font-size: small;
                overflow-y: auto;
                overflow-x: hidden;
                max-height: 100%;
                word-wrap: break-word;
                overflow-wrap: break-word;
                word-break: break-word;
            }

            .help-text * {
                word-wrap: break-word;
                overflow-wrap: break-word;
                max-width: 100%;
            }

            .help-text img,
            .help-text video,
            .help-text iframe {
                max-width: 100%;
                height: auto;
            }

            .help-panelP1 {
                height: 85px;
            }

            .help-panelP2 {
                display: flex;
                flex-direction: column;
            }

            .help-panelP2 .help-text {
                flex: 1;
                overflow-y: auto;
                overflow-x: hidden;
            }

            .help-panelP3 {
                height: 425px;
            }

            .help-panelP4 {
                height: 335px;
                display: flex;
                flex-direction: column;
                width: 180px;
            }

            .help-panelP4 .help-text {
                flex: 1;
                overflow-y: auto;
                overflow-x: hidden;
            }

            /* ===================== PAGE CONTROL ===================== */
            .page {
                display: none;
            }

            .page.active {
                display: block;
            }

            /* ===================== BUTTONS ===================== */
            .btn-back {
                margin-top: 20px;
                display: inline-block;
                padding: 8px 20px;
                background: #333;
                color: #fff;
                border-radius: 20px;
                cursor: pointer;
                transition: .3s;
                border: none;
                font-size: 14px;
            }

            .btn-back-p2 {
                margin-top: 30px;
            }

            .btn-back-p3 {
                margin-top: 15px;
            }

            .btn-back:hover {
                background: #000;
            }

            .btn-next {
                margin-top: 20px;
                display: inline-block;
                padding: 8px 20px;
                background: #333;
                color: #fff;
                border-radius: 20px;
                cursor: pointer;
                transition: .3s;
                border: none;
                font-size: 14px;
                margin-left: 10px;
            }

            .btn-next-p2 {
                margin-top: 30px;
            }

            .btn-next:hover {
                background: #000;
            }

            .remove-btn {
                background: #f44336;
                color: white;
                border: none;
                padding: 4px 8px;
                border-radius: 4px;
                cursor: pointer;
                font-size: 11px;
                transition: 0.3s;
            }

            .remove-btn:hover {
                background: #d32f2f;
            }

            .download-btn {
                background: none;
                border: none;
                padding: 6px 12px;
                border-radius: 20px;
                cursor: pointer;
                font-size: 12px;
                transition: .2s;
                color: #2196F3;
            }

            .download-btn:hover {
                background: #e3f2fd;
                color: #1976D2;
            }

            .download-btn i {
                pointer-events: none;
            }

            .doc-name-link {
                color: #2196F3;
                text-decoration: none;
                font-weight: 500;
                transition: 0.2s;
            }

            .doc-name-link:hover {
                color: #1565C0;
                text-decoration: underline;
            }

            .doc-name-link i {
                margin-left: 6px;
                font-size: 0.85em;
            }

            /* ===================== PAGE 3 & 4 SPECIFICS ===================== */
            .p3-grid-container {
                display: grid;
                grid-template-columns: 200px 1fr 220px;
                gap: 15px;
                align-items: start;
                margin-top: 10px;
                height: 430px;
            }

            .p4-grid-container {
                display: grid;
                grid-template-columns: 1fr 2fr 1fr;
                gap: 15px;
                align-items: start;
                margin-top: 10px;
                height: 335px;
            }

            .selected-proc {
                margin-bottom: 20px;
                font-weight: 600;
                color: var(--primary);
            }

            .category-sidebar {
                display: flex;
                flex-direction: column;
                gap: 8px;
                overflow: auto;
            }

            .category-sidebar-p3 {
                max-height: 430px;
            }

            .category-sidebar-p4 {
                max-height: 335px;
            }

            .category-btn {
                background: var(--sidebar-brown);
                color: white;
                padding: 15px 10px;
                border: none;
                text-align: left;
                font-size: 14px;
                cursor: pointer;
                border-radius: 4px;
                transition: 0.3s;
                position: relative;
            }

            .category-btn.active {
                background: #4a473c;
                border-left: 5px solid var(--secondary);
            }

            .category-btn:hover {
                background: var(--highlight);
                color: black;
            }

            .category-count {
                font-size: 11px;
                font-weight: 700;
                background: #f44336;
                color: white;
                border-radius: 10px;
                margin-left: 5px;
                position: absolute;
                right: 3px;
                transform: translateY(-50%);
                align-items: center;
                justify-content: center;
                width: 18px;
                height: 18px;
                padding: 0 6px;
                display: none;
                /* Hidden by default */
            }

            .doc-list-panel {
                background: #eee;
                border-radius: 4px;
                overflow: auto;
                max-height: 430px;
            }

            .doc-list-header {
                background: var(--secondary);
                padding: 10px;
                font-weight: bold;
                color: #333;
                font-size: 14px;
            }

            .doc-item {
                background: #fff;
                margin: 1px 0;
                padding: 12px;
                display: grid;
                grid-template-columns: 5fr auto 1fr;
                align-items: center;
                cursor: pointer;
                font-size: 14px;
                gap: 5px;
            }

            #docItemsContainer {
                max-height: 300px;
                overflow-y: auto;
            }

            .doc-item.active {
                background: #f9f9f9;
            }

            /* Requirement Type Button (Page 3) - reuses doc-item but needs different layout */
            .requirement-type-btn {
                width: 100%;
                text-align: left;
                border: none;
            }

            .requirement-type-btn.selected-requirement {
                border-left: 4px solid #0066cc;
                padding-left: 12px;
            }

            .card.selected-process {
                border-left: 4px solid #0066cc;
            }

            .doc-item:hover {
                background: var(--highlight);
                color: black;
            }

            .doc-itemP4 {
                border-left: 4px solid #f44336;
            }

            .doc-item.uploaded-row {
                background-color: #f0fff4;
                border: 1px solid #c6f6d5;
                border-left: 4px solid #48bb78;
            }

            .file-name {
                display: block;
                font-size: 10px;
                color: #48bb78;
                margin-top: 2px;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                max-width: 240px;
            }

            /* Document Upload Layout */
            .doc-upload {
                display: flex;
                align-items: center;
                gap: 20px;
            }

            .doc-upload-left {
                display: flex;
                align-items: center;
            }

            .upload-btn {
                background: none;
                border: none;
                padding: 6px 12px;
                border-radius: 20px;
                cursor: pointer;
                font-size: 12px;
                transition: .2s;
                color: grey;
            }

            .upload-btn:hover {
                background: #f0f0f0;
                color: #333;
            }

            .upload-btn i {
                pointer-events: none;
            }

            .doc-actions {
                display: flex;
                align-items: center;
                gap: 8px;
                /*min-width: 48px;*/
            }

            .remove-btn {
                background: transparent;
                border: none;
                cursor: pointer;
                font-size: 12px;
                opacity: 0.7;
                transition: .2s;
                color: grey;
            }

            .remove-btn:hover {
                opacity: 1;
                transform: scale(1.1);
            }

            .info-slot {
                position: relative;
                width: 20px;
                height: 20px;
            }

            .info-slot .info-icon {
                position: static;
            }

            /* Progress & Search */
            .progressAndSearch {
                display: grid;
                grid-template-columns: 2fr 2fr 1fr auto;
            }

            /* ===== PROGRESS BAR ===== */
            .progress-wrapper {
                align-content: center;
            }

            .progress-container {
                background: #e0e0e0;
                border-radius: 10px;
                height: 10px;
                overflow: hidden;
            }

            #progressBar {
                background: var(--success);
                width: 0%;
                height: 100%;
                transition: width 0.4s ease;
            }

            .progress-text {
                display: flex;
                justify-content: space-between;
                font-size: 13px;
                margin-bottom: 5px;
            }

            /* ===== SEARCH BAR ===== */
            .search-container {
                padding: 10px;
                align-content: center;
            }

            #docSearch {
                width: 100%;
                padding: 8px 12px;
                border-radius: 4px;
                border: 1px solid #ccc;
                font-size: 14px;
            }

            /* ===== OBRIGATORIOS CHECKBOX ===== */
            .obg-checkbox {
                align-content: center;
            }

            /* ===== BULK UPLOAD ===== */
            .bulk-upload-wrapper {
                align-content: center;
                text-align: center;
            }

            .btn-bulk-upload {
                background: none;
                border: 1px solid #ccc;
                border-radius: 4px;
                padding: 6px 12px;
                cursor: pointer;
                font-size: 16px;
                color: #666;
                transition: 0.3s;
            }

            .btn-bulk-upload:hover {
                background: #f0f0f0;
                color: #333;
                border-color: #999;
            }

            .bulk-upload-table {
                width: 100%;
                border-collapse: collapse;
                font-size: 13px;
            }

            .bulk-upload-table th {
                text-align: left;
                padding: 8px;
                border-bottom: 2px solid #ddd;
                font-weight: 600;
                color: #555;
            }

            .bulk-upload-table td {
                padding: 8px;
                border-bottom: 1px solid #eee;
                vertical-align: middle;
            }

            .bulk-doctype-select {
                width: 100%;
                padding: 4px 8px;
                border: 1px solid #ccc;
                border-radius: 4px;
                font-size: 12px;
            }

            .bulk-row-ok {
                background: #d4edda;
            }

            .bulk-row-success {
                background: #d4edda;
                opacity: 0.7;
            }

            .bulk-row-error {
                background: #f8d7da;
            }

            .bulk-row-failed {
                background: #fce4e4;
            }

            .bulk-row-unmatched {
                background: #fff3cd;
            }

            .bulk-row-warning {
                background: #ffecd2;
            }

            .bulk-summary {
                padding: 10px;
                text-align: center;
                font-size: 13px;
                border-top: 1px solid #eee;
                color: #555;
            }

            .bulk-filter-btn {
                transition: background 0.2s, font-weight 0.2s;
            }

            .bulk-filter-btn:hover {
                background: rgba(0, 0, 0, 0.08);
            }

            .bulk-filter-active {
                font-weight: bold;
                background: rgba(0, 0, 0, 0.06);
            }

            #onlyRequired {
                accent-color: #999;
            }

            #onlyRequired:checked {
                accent-color: #f44336;
            }

            .btn-bottomP4 {
                display: grid;
                grid-template-columns: 0.5fr 1fr 1fr 1fr;
                gap: 15px;
                align-items: center;
                margin-top: 20px;
                align-self: flex-start;
            }

            /* LOAD Mode button layout - 4 equal columns */
            .btn-bottomP4.load-mode {
                /*grid-template-columns: 1fr 1fr 1fr 1fr;*/
                grid-template-columns: 0.2fr 1fr 1fr 1fr;
                gap: 8px;
                margin-top: 35px;
            }

            .btn-submit {
                 display: inline-block;
                padding: 8px 20px;
                border: none;
                border-radius: 20px;
                background: #ccc;
                color: white;
                font-weight: bold;
                cursor: not-allowed;
                transition: 0.3s;
                font-size: 14px;
            }

            .btn-submit.ready {
                background: #DDDDDD;
                cursor: pointer;
                color: green;
            }

            .btn-submit.ready:hover {
                background: #CCCCCC;
            }

            /* Page 4 Bottom Buttons */
            .btn-backP4 {
                width: 139px;
                padding: 8px 20px;
                margin-top: 0;
            }

            /* ===== NORMAL MODE BUTTONS ===== */
            /* Save Temporary Version Button - Normal Mode */
            .btn-savetemp {
                display: inline-block;
                padding: 8px 20px;
                border: none;
                border-radius: 20px;
                background: #DDDDDD;
                color: navy;
                font-weight: bold;
                transition: 0.3s;
                font-size: 14px;
                cursor: pointer;
                width: 220px;
            }

            .btn-savetemp:hover:not(:disabled) {
                background: #CCCCCC;
            }

            .btn-savetemp:disabled {
                opacity: 0.5;
                cursor: not-allowed;
            }

            /* Cancel Submission Button - Normal Mode */
            .btn-cancelsub {
                display: inline-block;
                padding: 8px 20px;
                border: none;
                border-radius: 20px;
                background: #DDDDDD;
                color: #FF0000;
                font-weight: bold;
                transition: 0.3s;
                font-size: 14px;
                cursor: pointer;
            }

            .btn-cancelsub:hover:not(:disabled) {
                background: #CCCCCC;
            }

            .btn-cancelsub:disabled {
                opacity: 0.5;
                cursor: not-allowed;
            }

            /* ===== LOAD MODE BUTTONS ===== */
            /* Save Temporary Version Button - Load Mode */
            .btn-load-save {
                display: inline-block;
                padding: 8px 20px;
                border: none;
                border-radius: 20px;
                background: #DDDDDD;
                color: navy;
                font-weight: bold;
                transition: 0.3s;
                font-size: 14px;
                cursor: pointer;
            }

            .btn-load-save:hover:not(:disabled) {
                background: #CCCCCC;
            }

            .btn-load-save:disabled {
                opacity: 0.5;
                cursor: not-allowed;
            }

            /* Cancel/Anular Button - Load Mode */
            .btn-load-cancel {
                display: inline-block;
                padding: 8px 20px;
                border: none;
                border-radius: 20px;
                background: #DDDDDD;
                color: #FF0000;
                font-weight: bold;
                transition: 0.3s;
                font-size: 14px;
                cursor: pointer;
            }

            .btn-load-cancel:hover:not(:disabled) {
                background: #CCCCCC;
            }

            .btn-load-cancel:disabled {
                opacity: 0.5;
                cursor: not-allowed;
            }

            /* Load Saved Work Button - Load Mode */
            .btn-load-trabalho {
                display: inline-block;
                padding: 8px 20px;
                border: none;
                border-radius: 20px;
                background: #DDDDDD;
                color: navy;
                font-weight: bold;
                transition: 0.3s;
                font-size: 14px;
                cursor: pointer;
                text-align: center;

                width: 230px;
            }

            .btn-load-trabalho:hover:not(:disabled) {
                background: #CCCCCC;
            }

            .btn-load-trabalho:disabled {
                opacity: 0.5;
                cursor: not-allowed;
            }

            /* Delivery Ready Button - Load Mode */
            .btn-load-delivery {
                display: inline-block;
                padding: 8px 20px;
                border: none;
                border-radius: 20px;
                background: #DDDDDD;
                color: #2e7d32;
                font-weight: bold;
                transition: 0.3s;
                font-size: 14px;
                cursor: pointer;
                text-align: center;

                width: 150px;
            }

            .btn-load-delivery:hover:not(:disabled) {
                background: #CCCCCC;
            }

            .btn-load-delivery:disabled {
                opacity: 0.5;
                cursor: not-allowed;
            }

            /* Upload dependent buttons - hidden in normal mode, shown when files uploaded */
            .btn-upload-dependent {
                visibility: hidden;
            }
            .subgroup-header {
                padding: 10px 15px;
                cursor: pointer;
                display: flex;
                justify-content: space-between;
                align-items: center;
                font-weight: 600;
                background: #f5f5f5;
                border-left: 3px solid #999;
                margin-top: 10px;
                margin-bottom: 5px;
                border-radius: 4px;
                transition: background 0.2s;
                position: relative;
            }

            .subgroup-header .category-count {
                position: relative;
                right: auto;
                transform: none;
                margin-left: 8px;
                display: inline-flex;
            }

            .subgroup-right {
                display: flex;
                align-items: center;
                gap: 6px;
            }

            .subgroup-toggle i {
                transition: transform 0.2s;
                font-size: 12px;
                color: #666;
            }

            .subgroup-content {
                display: none;
                padding-left: 15px;
            }

            .subgroup-content.open {
                display: block;
            }

            .uploaded-row {
                background-color: #e8f5e9 !important;
            }

            .doc-itemP4 {
                border-left: 4px solid #f44336;
            }

            .category-count.zero {
                background: var(--success) !important;
            }

            /* ===================== MODAL STYLES ===================== */
            .modal-overlay {
                display: none;
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.5);
                z-index: 999;
                align-items: center;
                justify-content: center;
            }

            .modal-overlay.active {
                display: flex;
                z-index: 1060;
            }            

            .modal-dialog {
                background: white;
                border-radius: 12px;
                box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
                max-width: 550px;
                padding: 30px;
                animation: slideIn 0.3s ease;
            }

            .modal-header {
                display: flex;
                align-items: center;
                 justify-content: center;
                gap: 10px;
                margin-bottom: 15px;
                font-size: 19px;
                font-weight: 700;
                color: #d32f2f;
            }

            .modal-header-error {
                color: #d32f2f;
            }

            .modal-header-success {
                color: #2e7d32;
            }

            .modal-icon {
                font-size: 24px;
            }

            .modal-body {
                margin-bottom: 20px;
                color: #555;
                line-height: 1.6;
            }

            .modal-footer {
                display: flex;
                justify-content: center;
                gap: 10px;
            }

            .modal-btn {
                padding: 10px 20px;
                border: none;
                border-radius: 4px;
                cursor: pointer;
                font-size: 14px;
                transition: all 0.3s ease;
            }

            .modal-btn:disabled {
                cursor: not-allowed;
            }

            .modal-btn-cancel {
                background-color: #f5f5f5;
                color: #333;
                border: 1px solid #ddd;
            }

            .modal-btn-cancel:hover {
                background-color: #e8e8e8;
                border-color: #999;
                cursor: pointer;
            }

            .modal-btn-confirm {
                background-color: grey;
                color: white;
            }

            .modal-btn-confirm:hover {
                background-color: lightgrey;
                cursor: pointer;
            }

            /* Email modal Enviar button */
            .email-btn-confirm:disabled {
                background-color: #cccccc;
                color: #999999;
                cursor: not-allowed;
                opacity: 0.6;
            }

            .modal-btn-error {
                background-color: #d32f2f;
                color: white;
            }

            .modal-btn-error:hover {
                background-color: #b71c1c;
            }

            .modal-btn-success {
                background-color: #2e7d32;
                color: white;
            }

            .modal-btn-success:hover {
                background-color: #1b5e20;
            }
           
            /* ===================== INFO ICON AND MODAL ===================== */
            .info-icon {
                position: absolute;
                right: 10px;

                width: 18px;
                height: 19px;
                border-radius: 100%;

                display: flex;
                align-items: center;
                justify-content: center;

                background: #fff;
                color: #333;
                font-size: 14px;

                cursor: pointer;
                opacity: 0;
            }

            .info-icon-P2 {
                bottom: 10px;
            }
           
            .card:hover .info-icon,
            .doc-item:hover .info-icon,
            .category-btn:hover .info-icon,
            .info-icon:hover {
                opacity: 1;
                transform: scale(1.1);
            }
            
            .info-icon:active {
                transform: scale(0.95);
            }     
            
            .help-modal {
                position: fixed;
                inset: 0;
                background: rgba(0, 0, 0, 0.5);
                display: none;
                align-items: center;
                justify-content: center;
                z-index: 9999;               
            }

            .help-modal.show {
                display: flex;
            }

            .help-modal-content {
                background: #fff;
                padding: 20px;
                max-width: 550px;
                max-height: 620px;
                min-width: 550px;
                min-height: 278px;
                border-radius: 8px;
                position: relative;
                display: flex;
                flex-direction: column;
            }

            .help-modal-header {
                font-size: 20px;
                font-weight: normal;
                color: var(--primary);
                display: flex;
                align-items: center;               
                gap: 10px;
            }

            .help-modal-content:not(.show-table) {
                overflow: auto;
            }

            .help-modal-content.show-table {
                flex: 1;
            }

            .help-modal-close {
                position: absolute;
                top: 8px;
                right: 10px;
                background: none;
                border: none;
                font-size: 18px;
                cursor: pointer;
            }

            .help-modal-close:hover {
                color: #333;
            }            

             .modal-btn-secondary {
                background: linear-gradient(to bottom, #666 0%, #333 50%, #111 100%);
                color: white;
                border: 1px solid #888;
                padding: 6px 20px;
                border-radius: 4px;
                cursor: pointer;
                font-size: 14px;
                box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
            }

            .modal-btn-secondary:hover {
                background: linear-gradient(to bottom, #777 0%, #444 50%, #222 100%);
            }

            #helpModalText {
                flex: 1;
                overflow-y: auto;
                margin: 15px 0 0 0;
            }

            /* Sticky Button Container */
            .modal-buttons-sticky {
                display: flex;
                justify-content: center;
                gap: 10px;
                padding-top: 10px;
                border-top: 1px solid #eee;
                position: sticky;
                bottom: 0;
                background: #fff;
                z-index: 10;
            }

            /* Table Styling */
            .table-container {
                display: flex;
                flex-direction: column;
                max-height: calc(620px - 280px);
                overflow-y: auto;
            }

            .doc-table {
                width: 100%;
                border-collapse: collapse;
                font-size: 12px;
                text-align: center;
            }

            .doc-table thead {
                position: sticky;
                top: 0;
                background: #fff;
                z-index: 10;
            }

            .doc-table th {
                padding: 10px 5px;
                border-bottom: 2px solid #333;
                font-weight: bold;
            }

            .doc-table th:nth-child(5),
            .doc-table th:nth-child(6) {
                text-align: center;
            }

            .doc-table td {
                padding: 7px;
                font-size: 12px;
                border-bottom: 1px solid #f0f0f0;
            }

            .doc-table td:first-child {
                font-weight: bold;
            }

            .doc-table td:nth-child(5),
            .doc-table td:nth-child(6) {
                text-align: center;
            }

            .doc-table .table-header-row {
                background: #f2f2f2;
                font-weight: bold;
                text-align: center;
            }

            .doc-table .table-header-row td {
                padding: 8px;
            }

            .doc-table .table-subheader-row {
                background: #f9f9f9;
            }

            .doc-table .table-subheader-row td {
                font-weight: 600;
                text-align: center;
                padding: 8px;
                font-size: 12px;
                border-bottom: 1px solid #eee;
            }

            .table-subtitle {
                font-weight: bold;
                font-size: 14px;
                background: #444;
                color: white;
                padding: 5px;
            }

            .table-doc-row {
                border-bottom: 1px solid #eee;
                padding: 5px;
            }
               
            .doc-table .required-row td {
                color: #d32f2f !important;  /* Red text for ALL columns */
                font-weight: bold;
            }

            @keyframes slideIn {
                from { transform: translateY(-20px); opacity: 0; }
                to { transform: translateY(0); opacity: 1; }
            }

            /* Page 5 Styles */
            .p5-container {
                display: flex;
                flex-direction: column;
                align-items: center;
                gap: 30px;
                padding: 20px;
            }

            .p5-success-message {
                text-align: center;
                padding: 20px;
                background: #f0f8f0;
                border-radius: 10px;
                border: 2px solid #4caf50;
            }

            .p5-success-message h2 {
                color: #2e7d32;
                margin: 10px 0;
            }

            .p5-success-message p {
                color: #555;
                margin: 5px 0;
            }

            .p5-success-message i {
                color: green;
                font-size: 48px;
            }

            .p5-actions {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 15px;
                width: 100%;
                max-width: 600px;
            }

            .btn-p5-action {
                padding: 15px 25px;
                font-size: 16px;
                border: none;
                border-radius: 8px;
                background: linear-gradient(to bottom, #4A90E2 0%, #357ABD 100%);
                color: white;
                cursor: pointer;
                transition: all 0.3s ease;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 10px;
            }

            .btn-p5-action:hover {
                transform: translateY(-2px);
                box-shadow: 0 4px 12px rgba(0,0,0,0.2);
            }

            .btn-p5-action:active {
                transform: translateY(0);
            }

            .btn-p5-action i {
                font-size: 19px;
            }

            .p5-navigation {
                display: flex;
                gap: 15px;
                margin-top: 20px;
            }

            .btn-p5-nav {
                padding: 10px 30px;
                font-size: 15px;
                border: 2px solid #333;
                border-radius: 6px;
                background: white;
                color: #333;
                cursor: pointer;
                transition: all 0.3s ease;
            }

            .btn-p5-nav:hover {
                background: #f0f0f0;
            }