/* ==========================================================================
   Global Reset and Base Styles
   ========================================================================== */

   * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: Arial, sans-serif;
    color: #333;
    margin: 0;
}

.main-router {
    margin-left: 150px;
    padding:10px;
}

/* PDF-specific styling (scoped under .pdf-content) */
.pdf-content {
    display: none; /* Hidden by default in HTML, shown during PDF export */
    padding: 0; /* Remove padding to eliminate extra space */
    background: white;
    border-radius: 0;
    width: 100%; /* Ensure full width in all browsers */
    max-width: 100%; /* Remove fixed max-width to fit all screens */
    margin: 0; /* Remove margin to eliminate white space at the top */
    font-family: 'Arial', 'Helvetica', sans-serif; /* Cross-browser font fallback */
    line-height: 1.0; /* Tighter line spacing for compact layout */
    page-break-before: auto; /* Allow natural breaks */
    page-break-after: auto; /* Allow natural breaks */
    break-before: auto; /* Modern syntax for natural breaks */
    break-after: auto; /* Modern syntax for natural breaks */
    box-sizing: border-box; /* Include padding/border in width calculation */
    overflow-wrap: break-word; /* Prevent text overflow and allow wrapping */
    -webkit-font-smoothing: antialiased; /* Improve text rendering in WebKit browsers (Chrome, Safari) */
    -moz-osx-font-smoothing: grayscale; /* Improve text rendering in Firefox */
}

/* User info styling */
.pdf-content .user-info {
    text-align: center; /* Center user name for PDF */
    margin-bottom: 2px; /* Minimal margin for less white space */
    padding: 2px 0; /* Minimal padding for consistency */
}

.pdf-content .user-info h1 {
    font-size: 16px; /* Reduced for compact layout */
    margin: 0;
    color: #003366; /* Educational blue for consistency */
    font-weight: bold;
}

/* Report header styling */
.pdf-content .report-header {
    text-align: center;
    margin-bottom: 2px;
    padding: 2px 0;
}

.pdf-content .report-header h2 {
    font-size: 14px;
    margin: 0;
    color: #003366;
    font-weight: bold;
}

.pdf-content .report-subtitle {
    font-size: 10px;
    margin: 0;
    color: #666;
}

/* Core group styling */
.pdf-content .core-group {
    margin-bottom: 2px; /* Minimal margin for less white space */
    width: 100%; /* Ensure full width */
    page-break-inside: avoid; /* Prevent mid-group breaks */
    break-inside: avoid; /* Modern syntax for page breaks */
    break-before: auto; /* Allow natural breaks before groups */
    break-after: auto; /* Allow natural breaks after groups */
    overflow-wrap: break-word; /* Prevent text overflow */
}

.pdf-content .core-group h3 {
    font-size: 12px; /* Reduced for compact layout */
    margin: 1px 0; /* Minimal margin for less white space */
    text-align: left;
    color: #003366; /* Match the blue from the screenshot */
    font-weight: bold; /* Ensure headers stand out */
    page-break-before: avoid; /* Prevent page break before group headers */
    break-before: avoid; /* Modern syntax */
}

/* Standards list styling */
.pdf-content .standards-list {
    margin-left: 2px; /* Minimal indentation for less white space */
}

/* Standard item styling */
.pdf-content .standard-item {
    margin-bottom: 1px; /* Minimal margin for less white space */
    width: 100%; /* Ensure full width */
    page-break-inside: avoid; /* Prevent mid-item breaks */
    break-inside: avoid; /* Modern syntax */
    break-before: auto; /* Allow natural breaks before items */
    break-after: auto; /* Allow natural breaks after items */
    overflow-wrap: break-word; /* Prevent text cut-off by allowing text to wrap */
}

.pdf-content .standard-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1px;
}

.pdf-content .standard-item p {
    margin: 0; /* Remove margin for tight spacing */
    font-size: 9px; /* Reduced for compact layout */
    line-height: 1.0; /* Tighter line height for all browsers */
    color: #000; /* Ensure readable text color */
}

.pdf-content .standard-item strong {
    color: #003366; /* Match the blue from the screenshot for consistency */
    font-weight: bold; /* Ensure bold text stands out */
}

/* Separator styling */
.pdf-content .pdf-separator {
    border: 1px solid #ccc; /* Light gray line for separation */
    margin: 1px 0; /* Minimal margin for less white space */
    page-break-after: auto; /* Allow natural breaks after the line */
    break-after: auto; /* Modern syntax */
}

/* Report footer styling */
.pdf-content .report-footer {
    text-align: center;
    margin-top: 2px;
    padding: 2px 0;
    border-top: 1px solid #ccc;
}

.pdf-content .report-footer p {
    font-size: 8px;
    margin: 0;
    color: #666;
}

.export-pdf-btn {
  max-width: 165px;
}

/* Hide interactive elements in PDF */
.pdf-content .close,
.pdf-content .export-pdf-btn,
.pdf-content .inlineHeader,
.pdf-content img,
.pdf-content .user-info h4,
.pdf-content .user-profile-pic {
    display: none !important;
}

/* Cross-browser compatibility */
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE-specific styles if needed */
    .pdf-content {
        font-family: 'Arial', sans-serif; /* Fallback for IE */
    }
}

@media print {
    .pdf-content {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        -webkit-print-color-adjust: exact; /* Ensure colors print correctly in WebKit browsers */
        print-color-adjust: exact; /* Ensure colors print correctly in Firefox/Edge */
    }

    .pdf-content .core-group,
    .pdf-content .standard-item,
    .pdf-content .user-info,
    .pdf-content .report-header,
    .pdf-content .report-footer {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        overflow-wrap: break-word !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }
}

/* Chrome-specific fixes */
@-webkit-document url-prefix() {
    .pdf-content {
        -webkit-font-smoothing: antialiased; /* Improve text rendering in Chrome */
        position: relative; /* Ensure proper positioning in Chrome */
        top: 0; /* Prevent content from being pushed down */
    }
}

/* Firefox-specific fixes */
@-moz-document url-prefix() {
    .pdf-content {
        font-family: 'Arial', sans-serif; /* Ensure consistency in Firefox */
        position: relative; /* Ensure proper positioning in Firefox */
        top: 0; /* Prevent content from being pushed down */
    }
}



.ac-select {
    margin-right:15px;
}

.attendance-container {
    padding: 20px;
    font-family: Arial, sans-serif;
  }
  
  .standards-list {
    margin-top: 15px;
  }
  
  .standard-section {
    margin-bottom: 20px;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 10px;
    background-color: #ffffff; /* Clean white for content */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle shadow for depth */
  }
  
  .standard-title {
    color: #2c5282; /* Rich blue for authority and knowledge */
    margin-bottom: 15px;
    font-size: 1.1em;
    padding: 10px;
    background-color: #edf2f7; /* Light blue-gray for header, educational feel */
    border-bottom: 1px solid #ddd;
    font-weight: bold;
  }
  
  .students-list {
    margin-top: 10px;
  }
  
  .student-section {
    padding: 15px 0;
    border-bottom: 1px solid #e2e8f0; /* Light gray border, educational tone */
  }
  
  .student-section:last-child {
    border-bottom: none;
  }
  
  .student-name {
    font-weight: 600; /* Slightly bolder for emphasis */
    display: block;
    margin-bottom: 10px;
    font-size: 1em;
    color: #4a5568; /* Dark gray for readability and professionalism */
  }
  
  .score-radio {
    padding: 5px 0;
  }
  
  .radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Increased spacing for clarity */
    align-items: center;
    justify-content: space-between; /* Evenly distribute radio buttons */
    padding: 10px;
  }
  
  .radio-label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.9em;
    color: #4a5568; /* Dark gray for text, professional and educational */
    white-space: nowrap;
  }
  
  .radio-label input[type="radio"] {
    margin: 0;
    transform: scale(1.2); /* Slightly larger for better interaction */
    accent-color: #2d3748; /* Deep blue-gray for selected state, authoritative */
  }
  
  .radio-label input[type="radio"]:checked {
    background-color: #2d3748; /* Deep blue-gray for checked state, empowering */
    border-color: #2d3748; /* Ensure border matches */
  }
  
  /* Mobile Responsiveness */
  @media (max-width: 768px) {
    .standard-title {
      font-size: 1em;
      padding: 8px;
    }
  
    .student-name {
      font-size: 0.9em;
      margin-bottom: 8px;
    }
  
    .radio-group {
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
      padding: 10px 20px;
        font-size: 1.2em;
    }
  
    .radio-label {
      font-size: 0.8em;
      gap: 3px;
    }
  
    .radio-label input[type="radio"] {
      transform: scale(1.1);
    }
  
    .standard-section {
      padding: 8px;
    }
  
    .student-section {
      padding: 10px 0;
    }
  }
  
  @media (max-width: 480px) {
    .standard-title {
      font-size: 0.9em;
    }
  
    .student-name {
      font-size: 0.8em;
    }
  
    .radio-label {
      font-size: 0.7em;
    }
  
    .radio-group {
      gap: 5px;
    }
  }