/* Custom Print Styles for Bootstrap 5.3 */

/* Ensure the body uses the full width available */
@media print {

  html, body {
      font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
      font-size: 11px;
    }
    
    body {
        width: 100%;
        margin: 0;
        padding: 0;
      }
      
      /* Containers */
      .container,
      .container-fluid,
      .container-sm,
      .container-md,
      .container-lg,
      .container-xl,
      .container-xxl {
        width: 100%;
        max-width: 100%;
        padding-right: 0;
        padding-left: 0;
        margin-right: auto;
        margin-left: auto;
      }
    
      /* Correctly display responsive navigation bars */
      .navbar {
        display: none !important;
      }
    
      /* Hide elements that should not be printed */
      .no-print, .d-print-none {
        display: none !important;
      }
    
      .row, .col, .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
        float: none !important;
        width: auto !important;
      }
      .row {
          width: 100%;
          display: inline-block;
          border: none;
          font-size: 10px;
      }

      /* Row */
      .row {
        display: flex;
        flex-wrap: wrap;
      }
    
      /* Adjust the visibility of modal and dropdown elements */
      .modal, .dropdown {
        display: none !important;
      }
    
    table td, table td * {
        vertical-align: top;
    }
    td.text-right, th.text-right {
        text-align: right;
    }
    table.text-center {
        text-align: center;
    }
    tfoot, .card-footer {
        margin: 1px;
    }
    .text-primary {
        color: #007bff !important;
    }
    .text-success {
        color: #28a745 !important;
    }
    .text-danger {
        color: #dc3545 !important;
    }
    i, .btn-tool, .d-md-none, .no-print {
        display: none;
    }
    .card, th {
        border: none;
        padding-top: 10px;
    }
    .bg-secondary {
        background-color: #dee2e6;
    }
    .bg-warning {
        background-color: #ffc107;
    }
    
    .col-1, .col-2, .col-3, .col-4, .col-5, .col-6  {
        display: inline;
        padding-left: 1px;
    }
    .accordion-button {
        display: block;
        font-family: "Source Sans Pro", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    }
    
    
    
    .time-table .table-bordered td {
        padding-bottom: 2px;
        border: 0.15em thin solid #eef5fc;
        background-color: #fff;
    }
    .time-table .bg-light-gray td {
        border: none;
    }
    .bg-light-gray {
        background-color: #92bace;
    }
    .bg-light-gray .text-white {
        color: #000;
        font-weight: bold;
    }
    .bg-light-gray .text-uppercase {
        text-align: center;
    }
    .time-table .text-light-gray {
        color: #b6b5b5;
        font-size: 10px;
    }
    .no-print {
        display: none;
    }
    
    .time-table .bg-sky, .time-table .bg-orange, .time-table .bg-green, .time-table .bg-yellow, .time-table .bg-pink, .time-table .bg-purple, .time-table .bg-lightred {
        background-color: #f7f7f7;
        color: #000;
        font-weight: bold;
        border: 0.15em thin solid #eef5fc;
    }
    
    .fs-6 { font-size: 11px; }
    .fs-5, td { font-size: 10px; }
    .card-title { font-size: 12px; }
    .card-body { font-size: 12px; }
    .list-group-horizontal { text-align: left; margin: 4px; }
    .accordion { padding-top: 10px; }
    .accordion-item { border: 0.15em thin solid #eef5fc; }
    .card-header { padding-top: 10px; border-width: thin; }
    .pb-0 {
        padding-bottom: 0;
    }
    
      .print-border {
          background-color: #f7f7f7;
          color: #000;
          font-weight: bold;
          border: 0.15em thin solid #eef5fc;
      }
      
      .pb-1 {
        padding-bottom: 0.25rem; /* 4px */
      }
      
      .pb-2 {
        padding-bottom: 0.5rem; /* 8px */
      }
      
      .pb-3 {
        padding-bottom: 1rem; /* 16px */
      }
      
      .pb-4 {
        padding-bottom: 1.5rem; /* 24px */
      }
      
      .pb-5 {
        padding-bottom: 3rem; /* 48px */
      }

}

@media screen {
      
      /* Ensure columns maintain their grid-based width */
      .col-1 { width: 8.333333%; }
      .col-2 { width: 16.666667%; }
      .col-3 { width: 25%; }
      .col-4 { width: 33.333333%; }
      .col-5 { width: 41.666667%; }
      .col-6 { width: 50%; }
      .col-7 { width: 58.333333%; }
      .col-8 { width: 66.666667%; }
      .col-9 { width: 75%; }
      .col-10 { width: 83.333333%; }
      .col-11 { width: 91.666667%; }
      .col-12 { width: 100%; }
    
      /* Similar widths for all breakpoints */
      .col-sm-1, .col-md-1, .col-lg-1, .col-xl-1, .col-xxl-1 { width: 8.333333%; }
      .col-sm-2, .col-md-2, .col-lg-2, .col-xl-2, .col-xxl-2 { width: 16.666667%; }
      .col-sm-3, .col-md-3, .col-lg-3, .col-xl-3, .col-xxl-3 { width: 25%; }
      .col-sm-4, .col-md-4, .col-lg-4, .col-xl-4, .col-xxl-4 { width: 33.333333%; }
      .col-sm-5, .col-md-5, .col-lg-5, .col-xl-5, .col-xxl-5 { width: 41.666667%; }
      .col-sm-6, .col-md-6, .col-lg-6, .col-xl-6, .col-xxl-6 { width: 50%; }
      .col-sm-7, .col-md-7, .col-lg-7, .col-xl-7, .col-xxl-7 { width: 58.333333%; }
      .col-sm-8, .col-md-8, .col-lg-8, .col-xl-8, .col-xxl-8 { width: 66.666667%; }
      .col-sm-9, .col-md-9, .col-lg-9, .col-xl-9, .col-xxl-9 { width: 75%; }
      .col-sm-10, .col-md-10, .col-lg-10, .col-xl-10, .col-xxl-10 { width: 83.333333%; }
      .col-sm-11, .col-md-11, .col-lg-11, .col-xl-11, .col-xxl-11 { width: 91.666667%; }
      .col-sm-12, .col-md-12, .col-lg-12, .col-xl-12, .col-xxl-12 { width: 100%; }

}