/* ==========================================================================
   Desktop overrides
   Loaded after mobile.css; every rule here is scoped to desktop breakpoints.
   ========================================================================== */

@media (min-width: 769px) {
  html,
  body {
    min-width: 0;
  }

  .container {
    width: 100%;
    max-width: 1120px;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .section {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .main-content {
    min-height: calc(100vh - 180px);
  }

  /* Navbar */
  .nav-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    height: 56px;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .nav-logo {
    flex: 0 1 auto;
    min-width: 0;
    max-width: 220px;
  }

  .logo-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .nav-toggle {
    display: none;
  }

  .nav-links {
    position: static;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex: 1 1 auto;
    min-width: 0;
    gap: 0.15rem;
    padding: 0;
    overflow: visible;
    background: transparent;
    border: 0;
    box-shadow: none;
  }

  .nav-links.active {
    display: flex;
  }

  .nav-item {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 0;
  }

  .nav-item-placeholder {
    visibility: hidden;
    pointer-events: none;
  }

  .nav-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: auto;
    max-width: 120px;
    padding: 0.4rem 0.7rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .btn-nav-outline,
  .btn-nav-logout {
    min-width: 72px;
    max-width: 105px;
  }

  .nav-item-auth form {
    display: inline-flex !important;
  }

  .nav-item-theme-lang {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-left: 0.35rem;
  }

  .nav-item-theme-lang .language-selector,
  .nav-item-theme-lang .theme-selector {
    width: auto;
    min-width: 68px;
    max-width: 132px;
  }

  .nav-item-theme-lang .effect-speed-container {
    flex: 0 0 auto;
  }

  .nav-item-theme-lang .effect-speed-slider {
    width: 55px;
    min-width: 55px;
  }

  /* Layout grids */
  .news-grid {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  }

  .server-grid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }

  .resources-grid {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  }

  .profile-grid {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  }

  .detail-grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }

  .footer-grid {
    grid-template-columns: minmax(0, 2fr) minmax(150px, 1fr) minmax(150px, 1fr);
  }

  .stats-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }

  .stats-grid-7 {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }

  .stats-grid-4x2 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

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

  .chart-card-wide {
    grid-column: 1 / -1;
  }

  .hero-actions,
  .detail-actions,
  .form-actions,
  .analytics-controls {
    flex-direction: row;
    align-items: center;
  }

  .hero-actions,
  .form-actions {
    justify-content: center;
  }

  .detail-actions,
  .analytics-controls {
    justify-content: flex-start;
  }

  .admin-section-header .analytics-controls {
    justify-content: flex-end;
  }

  /* Cards and buttons */
  .server-card,
  .news-card,
  .resource-card,
  .profile-card,
  .chart-card,
  .admin-table-wrapper,
  .form-card {
    min-width: 0;
  }

  .server-card-header,
  .server-card-footer,
  .resource-header,
  .admin-section-header {
    flex-direction: row;
    align-items: center;
  }

  .server-card-footer,
  .admin-section-header {
    justify-content: space-between;
  }

  .btn {
    width: auto;
  }

  .hero-actions .btn {
    min-width: 160px;
  }

  .detail-actions .btn {
    min-width: 140px;
  }

  .actions-cell .btn {
    width: auto;
  }

  /* Admin */
  .admin-header {
    padding: 2rem 0 1rem;
  }

  .admin-nav {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  .admin-tab {
    flex: 0 0 auto;
    min-width: 90px;
  }

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

  .data-table {
    width: 100%;
    table-layout: fixed;
  }

  .data-table th,
  .data-table td {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  td.actions-cell {
    overflow: visible;
  }

  .actions-cell {
    justify-content: flex-start;
  }

  .visitor-pages-cell {
    white-space: normal !important;
  }

  /* Modals */
  .modal {
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
  }

  .modal-content {
    width: min(90vw, 720px);
    height: auto;
    max-height: 88vh;
    border-radius: var(--radius);
    display: block;
  }

  .modal-body {
    max-height: calc(88vh - 100px);
    overflow-y: auto;
  }

  .modal-body-scroll {
    max-height: calc(88vh - 130px);
    overflow-y: auto;
  }

  .preview-tabs,
  .crop-controls {
    flex-direction: row;
  }

  /* Page-specific desktop helpers */
  .bilingual-form-unified {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .settings-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .style-options {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  }

  .chat-layout {
    grid-template-columns: minmax(0, 1fr) 250px !important;
  }

  .chat-form,
  .chat-nickname-bar {
    flex-direction: row;
    align-items: center;
  }
}

@media (min-width: 1024px) {
  .nav-logo {
    max-width: 260px;
  }

  .nav-link {
    max-width: none;
    padding-left: 0.85rem;
    padding-right: 0.85rem;
  }

  .btn-nav-outline,
  .btn-nav-logout {
    max-width: none;
  }

  .admin-nav {
    overflow-x: visible;
    flex-wrap: wrap;
  }

  .modal-content {
    width: min(90vw, 760px);
  }
}

@media (min-width: 1200px) {
  .container,
  .nav-container {
    max-width: 1180px;
  }

  .charts-grid {
    gap: 1.5rem;
  }

  .admin-table-wrapper,
  .chart-card,
  .form-card {
    border-radius: var(--radius);
  }

  .modal-content {
    width: min(86vw, 820px);
  }
}

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

  .settings-container {
    max-width: 1400px;
  }

  .news-grid {
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  }

  .server-grid,
  .resources-grid {
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  }

  .modal-content {
    width: min(82vw, 880px);
  }
}