/* ===== PRINT STYLES - A4 OPTIMIZED ===== */
/* This stylesheet ensures proper printing on A4 paper */

/* ===== Page Setup ===== */
@page {
    size: A4;
    margin: 15mm;
}

@media print {
    /* ===== Reset Body and HTML ===== */
    body {
        width: 100% !important;
        max-width: 210mm !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #000 !important;
        font-family: 'Source Sans Pro', sans-serif;
        font-size: 12pt;
        overflow: visible !important;
        overflow-x: hidden !important;
        position: static !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    html {
        height: auto !important;
        overflow: visible !important;
        position: static !important;
    }

/* ===== Hide Non-Essential Elements ===== */
	.no-print,
	.header,
	.headerbar,  /* <-- ADD: Hide headerbar for login page */
	.navbar,
	.navbar-inverse,
	.navbar-fixed-top,
	.navbar-static-top,
	.sidebar,
	.left-side,
	.content-header,
	.breadcrumb,
	.btn,
	.btn-group,
	.btn-group-vertical,
	.btn-group-justified,
	.btn-group-justified,
	.dropdown-menu,
	.user-menu,
	.footer,
	.main-footer,
    .modal-backdrop,
    .modal,
    .modal-dialog,
    .modal-content,
    .alert,
    .alert-dismissible,
    .close,
    .print-only,
    #activeBlock,
    #entityFilter,
    #img-loading,
    .table-scroll::-webkit-scrollbar,
    .table-scroll::-webkit-scrollbar-thumb,
    .table-scroll::-webkit-scrollbar-track,
    .table-wrapper,
    #mdl-remote,
    #bootstrap-alert-box-modal,
    #bootstrap-confirm-box-modal,
    .xform .toggle,
    .xform .tooltip,
    .xform .label-tooltip,
    .xform .icon-append,
    .xform .icon-prepend,
    .xform .select > i,
    .xform .radio i,
    .xform .checkbox i,
    .xform .radio input + i:after,
    .xform .checkbox input + i:after,
    .xform .toggle input:checked + i:after,
    .xform .toggle input:checked + i:before,
    .xform .state-error,
    .xform .state-mandatory:after,
    .xform .state-error .tooltip,
    .xform .state-error ul,
    .xform .state-error ul li,
    .xform .state-error .icon-append,
    .xform .state-error .icon-prepend,
    .xform .select.state-error > i:after,
    .xform .select.state-error > i:before,
    .xform .state-disabled,
    .xform .state-disabled .radio,
    .xform .state-disabled .checkbox,
    .xform .state-disabled .toggle,
    .xform .state-disabled .radio:hover i,
    .xform .state-disabled .checkbox:hover i,
    .xform .state-disabled .toggle:hover i,
    .xform .ui-slider,
    .xform .ui-slider-handle,
    .xform .input .input-group-btn .btn,
    .upl-img-preview,
    .upl-info,
    .upl-uploading,
    .modal-xl,
    .modal-xl .modal-body,
    .modal-xl .container,
    .modal-xl .container .box,
    .modal-body.modal-no-padding,
    .modal-body.modal-no-padding .box,
    .alert-bottom,
    .btn-group-responsive .fa,
    .btn-group-responsive .btn-text,
    .btn-group-responsive .pull-right,
    .btn-group-responsive .pull-left,
    .btn-group-responsive .btn:has(.fa-question-circle),
    .row[style*="display:flex;align-items:center;"] mark,
    #divTitle,
    #divTitle span,
    #divTitle:hover,
    .hover-image,
    .hover-image:hover,
    .hover-image-activeuseres,
    .user-refresh,
    .refreshiicon,
    .user-timeupdate,
    .bg-orange-time,
    .participant-list,
    .xfom-group,
    .popup-overlay,
    .popup-box,
    .popup-close-btn,
    .popup-header,
    .popup-table,
    .fixed-header,
    .popup-pagination,
    .popup-page-btn,
    .popup-page-btn:disabled,
    .download-btn,
    .download-btn:hover,
    .user-icon,
    .active-block,
    .entity-filter,
    .active-users-popup,
    .active-users-popup .popup-content,
    .active-users-popup .popup-header,
    .active-users-popup .popup-table,
    .active-users-popup .popup-close-btn,
    .active-users-popup .popup-page-btn,
    .active-users-popup .popup-page-select,
    .active-users-popup .download-btn,
    .active-users-popup .hover-image,
    .active-users-popup .user-icon,
    .active-users-popup .user-refresh,
    .active-users-popup .refreshiicon,
    .active-users-popup .user-timeupdate,
    .active-users-popup .bg-orange-time,
    .active-users-popup .participant-list,
    .active-users-popup .xfom-group,
    .active-users-popup .row[style*="display:flex;align-items:center;"],
    .active-users-popup #divTitle,
    .active-users-popup #divTitle span,
    .active-users-popup #divTitle:hover,
    .active-users-popup .hover-image,
    .active-users-popup .hover-image:hover,
    .active-users-popup .hover-image-activeuseres,
    .active-users-popup .user-refresh,
    .active-users-popup .refreshiicon,
    .active-users-popup .user-timeupdate,
    .active-users-popup .bg-orange-time,
    .active-users-popup .participant-list,
    .active-users-popup .xfom-group,
    .active-users-popup .row[style*="display:flex;align-items:center;"] mark,
    .active-users-popup .btn-group-responsive .fa,
    .active-users-popup .btn-group-responsive .btn-text,
    .active-users-popup .btn-group-responsive .pull-right,
    .active-users-popup .btn-group-responsive .pull-left,
    .active-users-popup .btn-group-responsive .btn:has(.fa-question-circle),
    .fixed-header,
    .fixed-header .popup-content,
    .fixed-header .popup-header,
    .fixed-header .popup-table,
    .fixed-header .popup-close-btn,
    .fixed-header .popup-page-btn,
    .fixed-header .popup-page-select,
    .fixed-header .download-btn,
    .fixed-header .hover-image,
    .fixed-header .user-icon,
    .fixed-header .user-refresh,
    .fixed-header .refreshiicon,
    .fixed-header .user-timeupdate,
    .fixed-header .bg-orange-time,
    .fixed-header .participant-list,
    .fixed-header .xfom-group,
    .fixed-header .row[style*="display:flex;align-items:center;"],
    .fixed-header #divTitle,
    .fixed-header #divTitle span,
    .fixed-header #divTitle:hover,
    .fixed-header .hover-image,
    .fixed-header .hover-image:hover,
    .fixed-header .hover-image-activeuseres,
    .fixed-header .user-refresh,
    .fixed-header .refreshiicon,
    .fixed-header .user-timeupdate,
    .fixed-header .bg-orange-time,
    .fixed-header .participant-list,
    .fixed-header .xfom-group,
    .fixed-header .row[style*="display:flex;align-items:center;"] mark,
    .fixed-header .btn-group-responsive .fa,
    .fixed-header .btn-group-responsive .btn-text,
    .fixed-header .btn-group-responsive .pull-right,
    .fixed-header .btn-group-responsive .pull-left,
    .fixed-header .btn-group-responsive .btn:has(.fa-question-circle) {
        display: none !important;
    }

    /* ===== Content Area ===== */
    .wrapper {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        height: auto !important;
        min-height: auto !important;
        overflow: visible !important;
        position: static !important;
    }

    .right-side {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        height: auto !important;
        min-height: auto !important;
        background: #fff !important;
        overflow: visible !important;
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
    }

    .content {
        padding: 15px !important;
        background: #fff !important;
        overflow: visible !important;
        position: static !important;
    }

    /* ===== Typography ===== */
    h1, h2, h3, h4, h5, h6,
    .h1, .h2, .h3, .h4, .h5, .h6 {
        font-family: 'Source Sans Pro', sans-serif;
        color: #000 !important;
        page-break-after: avoid;
        break-after: avoid;
    }

    h1 { font-size: 24pt; margin-bottom: 10pt; }
    h2 { font-size: 20pt; margin-bottom: 8pt; }
    h3 { font-size: 16pt; margin-bottom: 6pt; }
    h4 { font-size: 14pt; margin-bottom: 5pt; }
    h5 { font-size: 12pt; margin-bottom: 4pt; }
    h6 { font-size: 11pt; margin-bottom: 3pt; }

    p {
        font-size: 11pt;
        line-height: 1.5;
        margin-bottom: 10pt;
        page-break-after: avoid;
        break-after: avoid;
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    a {
        color: #000 !important;
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
        font-size: 9pt;
        color: #666;
    }

    /* ===== Tables ===== */
    table {
        width: 100% !important;
        max-width: 100% !important;
        border-collapse: collapse !important;
        border-spacing: 0 !important;
        font-size: 9pt;
        margin-bottom: 15px;
        page-break-inside: auto !important;
        overflow: visible !important;
        table-layout: fixed !important;
    }

    th, td {
        border: 1px solid #ddd !important;
        padding: 6px 8px !important;
        text-align: left !important;
        vertical-align: top !important;
        page-break-inside: avoid !important;
        break-inside: avoid;
        overflow-wrap: break-word;
        word-wrap: break-word;
        white-space: normal !important;
    }

    th {
        background-color: #f5f5f5 !important;
        font-weight: bold !important;
        color: #000 !important;
        page-break-inside: avoid !important;
    }

    tr:nth-child(even) {
        background-color: #fafafa !important;
    }

    /* ===== Responsive Tables ===== */
    .table-responsive {
        overflow: visible !important;
        display: block !important;
    }

    .table-responsive table {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* ===== Box Components ===== */
    .box {
        background: #fff !important;
        border: 1px solid #ddd !important;
        margin-bottom: 15px !important;
        padding: 10px !important;
        page-break-inside: avoid !important;
        break-inside: avoid;
        box-shadow: none !important;
    }

    .box-header {
        border-bottom: 1px solid #ddd !important;
        padding: 10px !important;
        margin-bottom: 10px !important;
        page-break-after: avoid;
        break-after: avoid;
    }

    .box-body {
        padding: 10px !important;
    }

    .box-footer {
        border-top: 1px solid #ddd !important;
        padding: 10px !important;
    }

    /* ===== Forms ===== */
    .xform, .form-horizontal, .form-group {
        display: block !important;
        overflow: visible !important;
        margin-bottom: 15px !important;
    }

    .xform fieldset {
        border: 1px solid #ddd !important;
        padding: 10px !important;
        margin-bottom: 15px !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .xform section {
        margin: 0 0 10px 0 !important;
        padding: 0 !important;
    }

    .xform .label {
        display: block !important;
        font-weight: bold !important;
        margin-bottom: 3px !important;
        color: #000 !important;
    }

    .xform .input input,
    .xform .select select,
    .xform .textarea textarea {
        border: 1px solid #ddd !important;
        background: #fff !important;
        color: #000 !important;
        padding: 4px 8px !important;
        font-size: 10pt !important;
    }

    .xform section.view {
        display: block !important;
    }

    /* ===== Images ===== */
    img {
        max-width: 100% !important;
        max-height: 250px !important;
        height: auto !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    /* ===== Lists ===== */
    ul, ol {
        margin: 0 0 15px 0 !important;
        padding-left: 25px !important;
    }

    li {
        margin-bottom: 3px !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    /* ===== Page Break Controls ===== */
      .page-break {
        page-break-before: always !important;
        break-before: page !important;
    }

    .page-break-before {
        page-break-before: always !important;
        break-before: page !important;
    }

    .page-break-after {
        page-break-after: always !important;
        break-after: page !important;
    }

    .page-break-inside {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    /* ===== Print-Specific Text Colors ===== */
    .text-muted, .text-gray, .text-black {
        color: #666 !important;
    }

    .text-red {
        color: #c94936 !important;
    }

    .text-yellow {
        color: #f39c12 !important;
    }

    .text-aqua {
        color: #00c0ef !important;
    }

    .text-blue {
        color: #0073b7 !important;
    }

    .text-light-blue {
        color: #d13e51 !important;
    }

    .text-green {
        color: #00a65a !important;
    }

    .text-navy {
        color: #001f3f !important;
    }

    .text-teal {
        color: #39cccc !important;
    }

    .text-olive {
        color: #3d9970 !important;
    }

    .text-lime {
        color: #01ff70 !important;
    }

    .text-orange {
        color: #ff851b !important;
    }

    .text-fuchsia {
        color: #f012be !important;
    }

    .text-purple {
        color: #932ab6 !important;
    }

    .text-maroon {
        color: #85144b !important;
    }

    /* ===== Background Colors ===== */
    .bg-red {
        background-color: #c94936 !important;
        color: #fff !important;
    }

    .bg-yellow {
        background-color: #f39c12 !important;
        color: #000 !important;
    }

    .bg-aqua {
        background-color: #00c0ef !important;
        color: #000 !important;
    }

    .bg-blue {
        background-color: #0073b7 !important;
        color: #fff !important;
    }

    .bg-light-blue {
        background-color: #d13e51 !important;
        color: #fff !important;
    }

    .bg-green {
        background-color: #00a65a !important;
        color: #fff !important;
    }

    .bg-navy {
        background-color: #001f3f !important;
        color: #fff !important;
    }

    .bg-teal {
        background-color: #39cccc !important;
        color: #000 !important;
    }

    .bg-olive {
        background-color: #3d9970 !important;
        color: #fff !important;
    }

    .bg-lime {
        background-color: #01ff70 !important;
        color: #000 !important;
    }

    .bg-orange {
        background-color: #ff851b !important;
        color: #000 !important;
    }

    .bg-fuchsia {
        background-color: #f012be !important;
        color: #fff !important;
    }

    .bg-purple {
        background-color: #932ab6 !important;
        color: #fff !important;
    }

    .bg-maroon {
        background-color: #85144b !important;
        color: #fff !important;
    }

    .bg-black {
        background-color: #222 !important;
        color: #fff !important;
    }

    .bg-white {
        background-color: #fff !important;
        color: #000 !important;
    }

    .bg-gray {
        background-color: #eaeaec !important;
        color: #000 !important;
    }

    /* ===== Data Tables ===== */
    .dataTables_wrapper {
        display: block !important;
        overflow: visible !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .dataTables_length, .dataTables_filter, .dataTables_info, .dataTables_paginate {
        display: none !important;
    }

    table.dataTable > thead > tr > th {
        background: #f5f5f5 !important;
        color: #000 !important;
    }

    table.dataTable tbody tr:nth-of-type(odd) {
        background: rgba(248, 248, 248, 0.4) !important;
    }

    table.dataTable tbody tr:nth-of-type(even) {
        background: #fff !important;
    }

    /* ===== Mailbox ===== */
    .mailbox .table-mailbox {
        border: 1px solid #ddd !important;
    }

    .mailbox .table-mailbox tr > td {
        white-space: normal !important;
        overflow-wrap: break-word;
        word-wrap: break-word;
    }

    /* ===== Invoice ===== */
    .invoice {
        width: 100% !important;
        border: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
    }

    /* ===== Callouts and Alerts ===== */
    .callout {
        border-left: 5px solid #ddd !important;
        background: #f9f9f9 !important;
        padding: 15px !important;
        margin-bottom: 15px !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .alert {
        border: 1px solid #ddd !important;
        background: #f9f9f9 !important;
        padding: 10px !important;
        margin-bottom: 15px !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    /* ===== Progress Bars ===== */
    .progress {
        background: #f5f5f5 !important;
        height: 20px !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .progress-bar {
        background-color: #d13e51 !important;
    }

    /* ===== Small Boxes ===== */
    .small-box {
        background: #fff !important;
        border: 1px solid #ddd !important;
        margin-bottom: 15px !important;
        padding: 10px !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    /* ===== Timeline ===== */
    .timeline {
        margin: 0 0 15px 0 !important;
        padding: 0 !important;
    }

    .timeline > li > .timeline-item {
        border: 1px solid #ddd !important;
        background: #fff !important;
        margin-left: 60px !important;
        padding: 10px !important;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    /* ===== Print-Specific Classes ===== */
    .print-only {
        display: none !important;
    }

    /* ===== Flexbox and Grid Layouts ===== */
    .d-flex,
    .flex-row,
    .flex-column,
    .row,
    .col,
    .col-*,
    .flex {
        display: block !important;
        width: 100% !important;
        flex-direction: column !important;
    }

    .flex-grow-0,
    .flex-grow-1,
    .flex-shrink-0,
    .flex-shrink-1 {
        flex-grow: 0 !important;
        flex-shrink: 1 !important;
    }

    .align-items-start,
    .align-items-center,
    .align-items-end,
    .align-items-stretch {
        align-items: flex-start !important;
    }

    .justify-content-start,
    .justify-content-center,
    .justify-content-end,
    .justify-content-between,
    .justify-content-around {
        justify-content: flex-start !important;
    }

    /* ===== Modal Tables ===== */
    .modal-table {
        display: table !important;
        width: 100% !important;
    }

    /* ===== Sidebar Menu (Hidden) ===== */
    .sidebar-menu, .treeview-menu {
        display: none !important;
    }

    /* ===== Responsive Headers (Hidden) ===== */
    .responsive-header, .responsive-header-css {
        display: none !important;
    }

    /* ===== Responsive Header Styles (from responsive-header.css) ===== */
    .navbar.navbar-expand-lg {
        height: auto !important;
    }
    
    .container-fluid {
        display: block !important;
        flex-direction: column !important;
    }
    
    .navbar-collapse {
        display: block !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        padding: 0 !important;
        margin-top: 0 !important;
        justify-content: left !important;
    }
    
    .header-nav-right {
        display: block !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: right !important;
        width: 100% !important;
    }
    
    .header-nav-right .nav.navbar-nav {
        display: block !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: left !important;
    }
    
    .header-nav-right .nav.navbar-nav > li {
        flex-direction: row !important;
        justify-content: center !important;
    }

    /* ===== Sidebar Rightside Fix Styles (from sidebar-rightside-fix.css) ===== */
    .right-side,
    .right-side.strech {
        min-height: auto !important;
        margin-top: 0 !important;
    }
    
    .row-offcanvas-left.active .right-side,
    .row-offcanvas-left.active .right-side.strech {
        min-height: auto !important;
        margin-top: 0 !important;
    }
    
    .left-side.sidebar-offcanvas {
        height: auto !important;
        min-height: auto !important;
        margin-top: 0 !important;
    }
    
    .wrapper {
        min-height: auto !important;
    }

    /* ===== Footer (Hidden) ===== */
    .main-footer, .footer {
        display: none !important;
    }

    /* ===== Print Color Adjust ===== */
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* ===== Long Content Handling ===== */
    pre,
    code,
    kbd,
    samp,
    tt,
    var {
        white-space: pre-wrap !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    /* ===== Table Cell Long Text ===== */
    td,
    th {
        overflow-wrap: break-word !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
    }

    /* ===== Page Break Avoid for Common Elements ===== */
    .box,
    .box-body,
    .box-header,
    .box-footer,
    .callout,
    .alert,
    .progress,
    .small-box,
    .timeline > li > .timeline-item,
    .table-responsive,
    table,
    tr,
    td,
    th,
    ul,
    ol,
    li,
    p,
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    fieldset,
    img {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    /* ===== Page Break Before for Major Sections ===== */
    .page-break-before,
    .page-break {
        page-break-before: always !important;
        break-before: page !important;
    }

    /* ===== Page Break After for Major Sections ===== */
    .page-break-after {
        page-break-after: always !important;
        break-after: page !important;
    }
}


  @media print {
        /* Make buttons visible during printing */
        .btn, .btn-group, .btn-group-vertical, .btn-group-justified {
            display: inline-flex !important;
            flex-direction: row !important;
            flex-wrap: wrap !important;
        }
        
        /* Ensure button content (text, icons) is visible */
        .btn span, .btn i {
            display: inline !important;
            color: #000 !important;
        }
        
        /* Adjust button spacing for print */
        .btn {
            margin-right: 5px !important;
            margin-bottom: 5px !important;
        }
        
        /* Ensure btn-group-responsive displays buttons in row */
        .btn-group-responsive {
            display: flex !important;
            flex-direction: row !important;
            flex-wrap: wrap !important;
        }
    }

    
    
    
    /* ===== FIX: Table Alignment for Printing ===== */
@media print {
    /* Force proper table layout */
    table {
        table-layout: fixed !important;
        width: 100% !important;
        max-width: 100% !important;
        border-collapse: collapse !important;
    }

    /* Ensure headers and cells stay aligned */
    th, td {
        width: auto !important;
        min-width: 50px !important;
        max-width: 200px !important;
        word-break: break-word !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
        text-align: left !important;
        vertical-align: top !important;
    }

    /* Keep header row with body */
    thead {
        display: table-header-group !important;
    }

    tbody {
        display: table-row-group !important;
    }

    /* DataTables specific fix */
    table.dataTable {
        table-layout: fixed !important;
    }

    table.dataTable thead th {
        width: auto !important;
    }

    table.dataTable tbody td {
        width: auto !important;
    }
}