/**
 * Cross-system responsive utilities for admin, student, and public pages.
 */

html,
body {
  max-width: 100%;
  overflow-x: clip;
}

body.admin-dashboard {
  overflow-x: hidden;
}

.admin-layout,
.admin-main-content,
.admin-content,
.admin-card {
  max-width: 100%;
  min-width: 0;
}

img,
video,
canvas,
iframe {
  max-width: 100%;
}

/* Student navbar collapse */
@media (max-width: 991.98px) {
  .modern-navbar .navbar-collapse {
    margin-top: 12px;
    padding: 12px 0 4px;
    border-top: 1px solid rgba(58, 146, 98, 0.15);
  }

  .modern-navbar .navbar-collapse .d-flex {
    flex-direction: column;
    align-items: stretch !important;
    width: 100%;
    gap: 12px;
  }

  .student-account {
    width: 100%;
  }

  .student-account-btn {
    width: 100%;
    justify-content: flex-start;
  }

  .student-account-name,
  .student-account-meta {
    max-width: none;
  }

  .modern-navbar .auth-buttons {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
  }

  .modern-navbar .auth-buttons .btn {
    width: 100%;
    margin: 0 !important;
  }
}

@media (max-width: 575.98px) {
  .modern-navbar .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .logo-text {
    font-size: 1rem;
  }

  .student-account-menu {
    min-width: min(280px, calc(100vw - 24px));
  }
}

/* Student dashboard containers */
@media (max-width: 768px) {
  .dashboard-container,
  .week-content-container,
  .learning-content-container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .container {
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* Auth pages */
@media (max-width: 768px) {
  .auth-container {
    padding: 96px 12px 40px;
    align-items: flex-start;
  }

  .auth-card {
    border-radius: 18px;
    max-width: 100%;
  }

  .auth-form .input-group:focus-within {
    transform: none;
  }
}

/* Public flash alerts */
.system-flash-alert {
  margin-top: 84px;
  margin-left: 12px;
  margin-right: 12px;
}

body.student-portal .system-flash-alert {
  margin-top: 0;
}

@media (max-width: 575.98px) {
  .system-flash-alert {
    margin-top: 76px;
    font-size: 0.92rem;
  }

  body.student-portal .system-flash-alert {
    margin-top: 0;
  }
}

/* Touch-friendly controls */
@media (hover: none) and (pointer: coarse) {
  .admin-btn,
  .admin-sidebar-toggle,
  .admin-nav-item,
  .student-account-btn,
  .navbar-toggler {
    min-height: 44px;
  }
}
