﻿/* EDU. NEXA User Responsive Rules */

@media (max-width: 767px) {
  .header-content {
    padding: 0.8rem 1rem;
  }

  .header-center {
    display: none;
  }

  .user-profile {
    max-width: 58vw;
    padding: 0.42rem 0.62rem;
    gap: 0.45rem;
  }

  .user-profile span {
    max-width: 33vw;
  }

  .mobile-menu-btn {
    display: block;
  }

  .main-content {
    margin-top: 76px;
    padding: 1rem;
  }

  .main-content.with-sidebar {
    margin-left: 0;
  }

  .sidebar {
    width: 272px;
  }

  .footer-content {
    flex-direction: column;
    gap: 0.8rem;
    text-align: center;
  }

  .footer-links {
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.9rem;
  }

  .grid-cols-2,
  .grid-cols-3,
  .grid-cols-4 {
    grid-template-columns: 1fr;
  }

  .form-row {
    flex-direction: column;
    gap: 0;
  }

  .table,
  .crypto-table {
    font-size: 0.83rem;
    display: block;
    overflow-x: auto;
    white-space: nowrap;
  }

  .table th,
  .table td,
  .crypto-table th,
  .crypto-table td {
    padding: 0.55rem 0.65rem;
  }

  .card-body,
  .card-header,
  .card-footer {
    padding: 1rem;
  }

  .stats-card {
    text-align: center;
  }

  .pro-id-card,
  .id-card-mini {
    flex-direction: column;
    align-items: flex-start;
  }

  .text-4xl {
    font-size: 2rem;
  }

  .text-5xl {
    font-size: 2.35rem;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .header-content {
    padding: 0.9rem 1.4rem;
  }

  .header-center {
    display: flex;
  }

  .mobile-menu-btn {
    display: none;
  }

  .main-content {
    padding: 1.35rem;
  }

  .main-content.with-sidebar {
    margin-left: 0;
  }

  .sidebar {
    transform: translateX(-100%);
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .grid-cols-3,
  .grid-cols-4 {
    grid-template-columns: repeat(2, 1fr);
  }

  .table,
  .crypto-table {
    font-size: 0.88rem;
  }
}

@media (min-width: 1025px) {
  .header-content {
    padding: 0.95rem 1.8rem;
  }

  .header-center {
    display: flex;
  }

  .mobile-menu-btn {
    display: none;
  }

  .main-content {
    margin-left: 280px;
    padding: 1.8rem;
  }

  .main-content.with-sidebar {
    margin-left: 280px;
  }

  .sidebar {
    transform: translateX(0);
  }

  .sidebar.open {
    transform: translateX(0);
  }

  .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
  .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 768px) {
  .md\:text-5xl { font-size: 3rem; }
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lg\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lg\:grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (min-width: 1440px) {
  .container {
    max-width: 1360px;
  }

  .header-content,
  .footer-content {
    max-width: 1360px;
  }

  .main-content {
    padding: 2.4rem;
  }
}

@media print {
  .header,
  .sidebar,
  .footer,
  .btn,
  .mobile-menu-btn {
    display: none !important;
  }

  .main-content {
    margin: 0 !important;
    padding: 0 !important;
  }

  .card {
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    background: #fff !important;
    color: #111 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

