/* ============================================================================
   AliothPress — Responsive
   
   Mobile-first media queries.
   
   Breakpoints:
     sm:  640px   (large phones, landscape)
     md:  768px   (tablets)
     lg:  1024px  (small desktops)
     xl:  1280px  (desktops)
   ============================================================================ */


/* ============================================================================
   BASE (mobile-first: < 768px)
   ============================================================================ */

/* Show hamburger on mobile */
.ap-hamburger {
  display: flex;
}

/* Hide desktop nav on mobile */
.ap-nav {
  display: none;
}

/* Language switcher — visible on mobile in header (between theme toggle and hamburger) */
.ap-lang {
  display: flex;
}

/* Smaller heading sizes on mobile */
h1, .ap-article__title  { font-size: var(--ap-text-3xl); }
h2                       { font-size: var(--ap-text-2xl); }
h3                       { font-size: var(--ap-text-xl); }

.ap-prose h1             { font-size: var(--ap-text-3xl); }
.ap-prose h2             { font-size: var(--ap-text-2xl); }
.ap-prose h3             { font-size: var(--ap-text-xl); }

/* Tighter prose on mobile */
.ap-prose {
  font-size: var(--ap-text-base);
}

/* Reduce main padding on mobile */
.ap-main {
  padding: var(--ap-space-8) 0;
}

/* Stack post meta vertically on small screens */
.ap-article__meta {
  flex-direction: column;
  gap: var(--ap-space-2);
}

/* Full-width table scroll on mobile */
.ap-prose table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}


/* ============================================================================
   md: 768px+ (Tablets and up)
   ============================================================================ */

@media (min-width: 768px) {
  /* Show desktop nav */
  .ap-nav {
    display: flex;
  }
  
  /* Show language switcher */
  .ap-lang {
    display: block;
  }
  
  /* Hide hamburger */
  .ap-hamburger {
    display: none;
  }
  
  /* Restore heading sizes */
  h1, .ap-article__title  { font-size: var(--ap-text-4xl); }
  h2                       { font-size: var(--ap-text-3xl); }
  h3                       { font-size: var(--ap-text-2xl); }
  
  .ap-prose h1             { font-size: var(--ap-text-4xl); }
  .ap-prose h2             { font-size: var(--ap-text-3xl); }
  .ap-prose h3             { font-size: var(--ap-text-2xl); }
  
  /* Larger prose text on tablet+ */
  .ap-prose {
    font-size: var(--ap-text-lg);
  }
  
  /* Horizontal meta */
  .ap-article__meta {
    flex-direction: row;
    gap: var(--ap-space-4);
  }
  
  /* Larger main padding */
  .ap-main {
    padding: var(--ap-space-12) 0;
  }
}


/* ============================================================================
   lg: 1024px+ (Small desktops)
   ============================================================================ */

@media (min-width: 1024px) {
  /* Slightly larger container padding */
  :root {
    --ap-container-pad: var(--ap-space-8);
  }
}


/* ============================================================================
   xl: 1280px+ (Large desktops)
   ============================================================================ */

@media (min-width: 1280px) {
  /* Title can go larger on big screens */
  .ap-article__title {
    font-size: var(--ap-text-5xl);
  }
}


/* ============================================================================
   PRINT
   ============================================================================ */

@media print {
  .ap-header,
  .ap-footer,
  .ap-sidebar,
  .ap-sidebar-overlay,
  .ap-hamburger,
  .ap-lang,
  .ap-pagination {
    display: none !important;
  }
  
  .ap-main {
    padding: 0;
  }
  
  body {
    font-size: 12pt;
    color: #000;
    background: #fff;
  }
  
  a {
    color: #000;
    text-decoration: underline;
  }
  
  .ap-prose pre {
    background: #f5f5f5;
    border: 1px solid #ddd;
  }
}