/*
 Theme Name:   Starter 2025
 Theme URI:    https://ramaje-studio.com
 Description:  Starter 2025 theme for GeneratePress
 Author:       JR
 Author URI:   https://www.linkedin.com/in/jeremyreboul/
 Template:     generatepress
 Version:      1.0.0
*/

/* =========================
   THEME TWEAKS
========================= */

/* Header padding with responsive clamp */
.site-header {
  padding-inline: clamp(1rem, 0.848rem + 0.758vw, 1.5rem);
}

/* Typography wrapping */
/* Balance headings and elements with `.balance` class */
:is(h1, h2, h3, h4, h5, h6),
.balance {
  text-wrap: balance;
}

/* Use pretty wrapping for body text elements */
p,
blockquote,
li {
  text-wrap: pretty;
}

/* Remove bottom margin from final paragraph */
p:last-child:last-of-type {
  margin-bottom: 0px;
}

.block-editor-block-list_layout .gb-container p:nth-last-child(2) {
  margin-bottom: 0px;
}

/* Hide WooCommerce cart icon when empty (desktop navigation, mobile header, and mobile bar) */
.main-navigation .menu-bar-items .wc-menu-item:not(.has-items),
#mobile-menu-control-wrapper .menu-bar-items .wc-menu-item:not(.has-items),
.mobile-bar-items.wc-mobile-cart-items:not(.has-items) {
  display: none !important;
}

/* =========================
   STICKY FOOTER
========================= */

/* Sticky footer: keep .site-footer at the bottom of the viewport */
html,
body {
  height: 100%;
}

body {
  /* Use dynamic viewport units for mobile browsers */
  min-height: 100dvh;
  min-height: 100vh; /* fallback */
  display: flex;
  flex-direction: column;
}

/* Let the main page area take the remaining height */
#page {
  flex: 1 0 auto;
  width: 100%;
}

/* Push the footer to the bottom when content is short */
.site-footer {
  margin-top: auto;
}

/* =========================
   UTILITIES
========================= */

/* Line Clamping */
.line-limit--2,
.line-limit--3,
.line-limit--4,
.line-limit--5,
.line-limit--6 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.line-limit--2 {
  -webkit-line-clamp: 2;
}

.line-limit--3 {
  -webkit-line-clamp: 3;
}

.line-limit--4 {
  -webkit-line-clamp: 4;
}

.line-limit--5 {
  -webkit-line-clamp: 5;
}

.line-limit--6 {
  -webkit-line-clamp: 6;
}

/* Visually Hidden (accessible to screen readers) */
.visually-hidden:not(:focus):not(:active) {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

/* No underline */
.no-ul,
.no-ul a {
  text-decoration: none;
}

/* Image-as-background pattern
   - Renders the first <img> as a full-cover background inside .image-background
   - Keeps a real <img> for LCP/SEO while pushing it behind content
*/
.image-background {
  position: relative;
  isolation: isolate;

  & img:first-of-type {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
  }
}

/* =========================
   TYPOGRAPHY
========================= */

/* Font Family Utilities */
.ff-body {
  font-family: var(--gp-font--body);
}

.ff-heading {
  font-family: var(--gp-font--headings);
}

/* Heading and utility class font assignment */
h1,
h2,
h3,
h4,
h5,
h6,
[class^="fs-"] {
  font-family: var(--gp-font--headings);
}

.fs-p {
  font-family: var(--gp-font--body);
}

/* Add top margin to headings (H2–H6) only when they follow a paragraph inside .entry-content */
.entry-content p + h2,
.entry-content p + h3,
.entry-content p + h4,
.entry-content p + h5,
.entry-content p + h6 {
  margin-top: 1em;
}

/* =========================
   FLUID TYPOGRAPHY SCALE
   Source: https://theadminbar.com/simple-responsive-font-size-calculator/
========================= */

h1,
.fs-h1 {
  font-size: clamp(3.375rem, 2.9915rem + 1.5341vw, 4.2188rem);
}

h2,
.fs-h2 {
  font-size: clamp(2.5313rem, 2.2436rem + 1.1506vw, 3.1641rem);
}

h3,
.fs-h3 {
  font-size: clamp(2.1094rem, 1.8697rem + 0.9588vw, 2.6367rem);
}

h4,
.fs-h4 {
  font-size: clamp(1.6875rem, 1.4957rem + 0.767vw, 2.1094rem);
}

h5,
.fs-h5 {
  font-size: clamp(1.4063rem, 1.2464rem + 0.6392vw, 1.7578rem);
}

h6,
.fs-h6 {
  font-size: clamp(1.2656rem, 1.1218rem + 0.5753vw, 1.582rem);
}

p,
.fs-p {
  font-size: clamp(0.9rem, 0.7977rem + 0.4091vw, 1.125rem);
}