/* Modular Architecture Imports */
@import url('variables.css');
@import url('reset.css');
@import url('common.css');
@import url('components.css');
@import url('forms.css');
@import url('tables.css');
@import url('layout.css');

/* Google Fonts & Bengali Typography */
@import url('https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@400;500;600;700&family=Inter:wght@400;500;600;700;800&family=Noto+Sans+Bengali:wght@400;500;600;700;800&display=swap');


:root {
  --font-bangla: 'Noto Sans Bengali', 'Hind Siliguri', 'Kalpurush', 'SolaimanLipi', sans-serif;
  --font-sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-sans);
  background-color: #f8fafc;
  color: #0f172a;
}

.font-bangla {
  font-family: var(--font-bangla) !important;
}

/* Custom Scrollbars */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Dark Navigation Custom Scrollbar */
.custom-scrollbar::-webkit-scrollbar {
  width: 5px;
}
.custom-scrollbar::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.4);
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: rgba(51, 65, 85, 0.6);
  border-radius: 9999px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: rgba(16, 185, 129, 0.8);
}
.custom-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: rgba(51, 65, 85, 0.6) rgba(15, 23, 42, 0.4);
}

/* Modal and Fade In Animations */
@keyframes fadeIn {
  from { opacity: 0; transform: scale(0.98); }
  to { opacity: 1; transform: scale(1); }
}

.animate-fade-in {
  animation: fadeIn 0.2s ease-out forwards;
}

/* Toast Notification Animation */
@keyframes slideUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

.animate-slide-up {
  animation: slideUp 0.3s ease-out forwards;
}

/* PWA Mobile Navigation & Safe Area Adjustments */
#mobile-bottom-nav {
  padding-bottom: calc(0.375rem + env(safe-area-inset-bottom, 0px));
}

@supports (padding: max(0px)) {
  #mobile-bottom-nav {
    padding-bottom: max(0.375rem, env(safe-area-inset-bottom));
  }
}

/* Off-canvas sidebar transitions */
#admin-sidebar {
  will-change: transform;
}

#sidebar-backdrop,
#admin-sidebar-backdrop {
  will-change: opacity;
}

/* Touch action optimization */
button, a, input, select, textarea {
  touch-action: manipulation;
}

/* Print-Specific Stylesheet for Bangladeshi School ID Cards, Slips & Fee Receipts */
@media screen {
  .print-only {
    display: none !important;
  }
}

@media print {
  * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
    color-adjust: exact !important;
  }

  @page {
    size: A4 portrait;
    margin: 8mm;
  }

  nav,
  aside,
  header,
  footer,
  .no-print,
  button:not(.allow-print),
  .admin-sidebar {
    display: none !important;
  }

  body,
  main {
    background: #ffffff !important;
    color: #000000 !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }

  .print-only {
    display: block !important;
  }

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

  /* A4 ID Card & Admit Card Print Layout */
  .id-card-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 4mm !important;
    justify-items: center !important;
  }

  .id-card-box {
    width: 85.6mm !important;
    height: 54mm !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }

  .admit-card-item {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    margin-bottom: 6mm !important;
  }

  /* 2-Part Money Receipt Print Layout */
  .two-part-receipt-wrapper,
  .three-part-receipt-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 3mm !important;
    width: 100% !important;
  }

  .receipt-single-copy {
    border: 1px solid #64748b !important;
    border-radius: 6px !important;
    padding: 6px 10px !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    background: #ffffff !important;
    box-shadow: none !important;
  }

  .receipt-cut-line {
    margin: 2mm 0 !important;
    color: #94a3b8 !important;
  }

  /* Exam Routine Print */
  .routine-card {
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    border: 2px solid #0f172a !important;
    box-shadow: none !important;
  }

  /* Progress Report Marksheet Print */
  .marksheet-card-wrapper {
    page-break-after: always !important;
    break-after: page !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    border: 2px solid #0f172a !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
  }

  /* Staff Salary Voucher Print */
  .voucher-copy {
    box-shadow: none !important;
    border: 1.5px solid #0f172a !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }

  /* Daybook Ledger Sheet Print */
  .daybook-card {
    box-shadow: none !important;
    border: 2px solid #0f172a !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
  }
}

/* ==========================================================================
   Responsive Accordion Navigation & Mobile Drawer Styles
   ========================================================================== */
.accordion-arrow {
  display: inline-block;
  transition: transform 0.2s ease-in-out;
}

.accordion-arrow.rotate-180 {
  transform: rotate(180deg);
}

.accordion-group {
  border-radius: 0.75rem;
  transition: background-color 0.15s ease;
}

@media (max-width: 1023px) {
  aside.mobile-sidebar-open {
    transform: translateX(0) !important;
    z-index: 50 !important;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.75) !important;
  }
}

.table-responsive-container {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}