/* ============================================================
   Ulgamda CMS — Desktop Stylesheet  v9-improved
   Breakpoints: min-width queries (≥ 1025px devices)
   Import after style.css in <head>
   ============================================================ */

/* ── Standard desktop (1025px+): sidebar always visible ──── */
@media (min-width: 1025px) {
  /* Search bar always visible */
  .header-search { display: block !important; }

  /* Better hover states (only on pointer devices) */
  .post-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
  .member-card:hover { transform: translateY(-3px); }
  .stat-card:hover  { transform: translateY(-2px); }
  .widget:hover     { box-shadow: var(--shadow-md); }

  /* Sidebar always visible */
  .sidebar { display: flex !important; }

  /* Admin sidebar sticky */
  .admin-sidebar { position: sticky; top: 0; }

  /* Post card image larger on desktop */
  .post-card.has-image { grid-template-columns: 1fr 220px; }

  /* Better post full body padding */
  .post-full-header { padding: 44px 48px 28px; }
  .post-full-body   { padding: 36px 48px 48px; font-size: 1.08rem; }
  .post-full-title  { font-size: 2.2rem; }
  .post-full-tags   { padding: 0 48px 32px; }
  .post-actions     { padding: 22px 48px; }
  .comments-header, .comment-form-wrap { padding-left: 36px; padding-right: 36px; }
  .comment-list     { padding: 24px 36px; }

  /* Featured hero: taller on desktop */
  .featured-hero { min-height: 380px; }
  .featured-hero-body h2 { font-size: 2rem; }

  /* Auth card better centered */
  .auth-card { padding: 48px; }
  .auth-title { font-size: 1.9rem; }

  /* Write page wider */
  .write-page { max-width: 920px; }
  .write-card { padding: 44px; }
  .write-title-input { font-size: 2rem; }

  /* Members grid: more columns */
  .members-grid { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }

  /* Profile hero */
  .profile-hero img { width: 108px; height: 108px; }
  .profile-hero-info h1 { font-size: 1.8rem; }

  /* Profile page centered & constrained on desktop */
  .user-profile-wrap {
    max-width: 860px;
    margin: 0 auto;
    padding: 36px 24px 72px;
  }
  .profile-hero {
    padding: 44px 52px;
    border-radius: 20px;
  }
  .profile-hero img {
    width: 120px;
    height: 120px;
  }
  .profile-edit-wrap {
    max-width: 720px;
  }

  /* PM layout: full sidebar visible */
  .pm-layout { height: calc(100vh - 96px); }
  .pm-sidebar { width: 320px; }

  /* Notification dropdown */
  .notif-dropdown { width: 400px; }

  /* Stats grid: 4 columns on large desktop */
  .stats-grid { grid-template-columns: repeat(4, 1fr); }

  /* Better admin layout */
  .admin-layout { grid-template-columns: 240px 1fr; }
  .admin-main   { padding: 36px; }
}

/* ── Wide desktop (1280px+) ──────────────────────────────── */
@media (min-width: 1280px) {
  .page-wrap { gap: 36px; padding: 32px 24px 72px; }
  :root { --sidebar-w: 320px; }

  /* Post list: more breathing room */
  .posts-list { gap: 24px; }
  .post-card-body { padding: 26px 28px; }

  /* Widget spacing */
  .widget-body { padding: 18px 22px; }
  .widget-title { padding: 14px 22px 12px; }

  /* Featured hero: extra large */
  .featured-hero { min-height: 420px; }
  .featured-hero-body { padding: 40px; }
  .featured-hero-body h2 { font-size: 2.2rem; }

  /* Members page: 5 columns */
  .members-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
}

/* ── Ultra-wide (1440px+) ────────────────────────────────── */
@media (min-width: 1440px) {
  :root { --max-w: 1280px; }
  .page-wrap { gap: 40px; }
}

/* ── Tablet range (900–1023px): narrow sidebar ───────────── */
@media (min-width: 900px) and (max-width: 1023px) {
  .page-wrap { grid-template-columns: 1fr 240px; gap: 20px; }
  .sidebar { display: flex; }
  .header-search { max-width: 240px; }
}

/* ── Tablet range (1024–1279px): normal sidebar ─────────── */
@media (min-width: 1024px) and (max-width: 1279px) {
  .page-wrap { gap: 28px; }
  .post-full-header { padding: 36px 44px 24px; }
  .post-full-body   { padding: 30px 44px 44px; }
  .admin-main { padding: 28px; }
  .stats-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ── Desktop-only: smooth hover on post image ────────────── */
@media (hover: hover) and (pointer: fine) {
  .post-card:hover .post-card-image img {
    transform: scale(1.06);
  }
  .tag-cloud a:hover {
    transform: translateY(-1px);
  }
  .btn-ghost:hover {
    transform: translateY(-1px);
  }
  .member-card:hover {
    transform: translateY(-3px);
  }
}

/* ── Desktop: improved comment layout ────────────────────── */
@media (min-width: 900px) {
  .comment-avatar img { width: 42px; height: 42px; }
  .comment-body { font-size: .95rem; }
  .comment-replies { padding-left: 24px; }
}

/* ── Desktop: admin table extra columns ──────────────────── */
@media (min-width: 1024px) {
  .admin-table th, .admin-table td { padding: 13px 16px; }
  .admin-title { font-size: 1.7rem; }
}

/* ── Desktop: notification dropdown better positioned ─────── */
@media (min-width: 1025px) {
  .notif-dropdown {
    top: calc(var(--header-h) + 14px);
    right: 24px;
  }
}

/* ── Desktop: profile drawer wider ───────────────────────── */
@media (min-width: 1025px) {
  .profile-drawer { width: 320px; }
}

/* ── Desktop-specific PM layout ──────────────────────────── */
@media (min-width: 1025px) {
  .pm-layout {
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-md);
  }
}
