/* Custom stylesheet Helpdesk PKA.
   Simpan override visual umum di sini agar perubahan tampilan tidak perlu menyentuh file page/*.php. */

:root {
  --pka-navy: #0f2a44;
  --pka-ocean: #155eaa;
  --pka-mist: #f4f7fb;
  --pka-border: #e2e8f0;
  --pka-scroll-thumb: #cbd5e1;
}

.app-scroll::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.app-scroll::-webkit-scrollbar-thumb {
  background: var(--pka-scroll-thumb);
  border-radius: 999px;
}

.app-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.photo-thumb {
  aspect-ratio: 1 / 1;
}

.table-empty {
  min-height: 96px;
}

.shadow-soft {
  box-shadow: 0 18px 45px rgba(15, 42, 68, 0.10);
}

@media (min-width: 1024px) {
  #sidebar.sidebar-collapsed > div > div:first-child {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
  }
  
  #sidebar.sidebar-collapsed > div > div:first-child button {
    margin: 0;
  }

  /* Ensure nav items are properly centered when sidebar collapsed */
  #sidebar.sidebar-collapsed .nav-item {
    padding-left: 0;
    padding-right: 0;
  }

  /* Ensure nav container padding is removed when collapsed */
  #sidebar.sidebar-collapsed > div > nav {
    padding-left: 0;
    padding-right: 0;
  }

  /* Center nav items flex content when collapsed */
  #sidebar.sidebar-collapsed .nav-item {
    justify-content: center;
  }

  /* Center section headers when collapsed */
  #sidebar.sidebar-collapsed .section-header {
    padding-left: 0;
    padding-right: 0;
  }

  /* Ensure header maintains proper height */
  #sidebar.sidebar-collapsed > div > div:first-child {
    height: 80px;
  }

  /* Remove gap from nav items when collapsed to ensure proper centering */
  #sidebar.sidebar-collapsed .nav-item.lg:justify-center {
    gap: 0;
  }
}

@media print {
  @page {
    size: landscape;
    margin: 10mm;
  }

  body {
    background: #ffffff !important;
  }

  #sidebar,
  header,
  .no-print,
  #mobileBackdrop {
    display: none !important;
  }

  #mainContent {
    padding-left: 0 !important;
  }

  body * {
    visibility: hidden;
  }

  #printArea,
  #printArea * {
    visibility: visible;
  }

  #printArea {
    position: absolute;
    inset: 0 auto auto 0;
    width: 100%;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
  }

  .app-scroll {
    overflow: visible !important;
  }

  .print-table {
    min-width: 0 !important;
    width: 100% !important;
    font-size: 10px !important;
  }

  .attendance-matrix th,
  .attendance-matrix td {
    padding: 4px 5px !important;
  }

  .report-table-block {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  .report-table-block + .report-table-block {
    break-before: page;
    page-break-before: always;
  }
}


.section-title-row {
  @apply mb-4 flex items-center justify-between gap-3;
}

.section-title-row h2 {
  @apply m-0 text-lg font-bold text-navy;
}

.section-title-row a {
  @apply font-bold text-ocean;
}
