/*
Theme Name:   Ensoul Theme
Description:  North is a child theme of Twenty Twenty-Five designed to deliver a visually advanced and seamless site-building experience. Built exclusively for Ensoul clients, North extends the WordPress Site Editor with pre-built layouts, custom patterns, and a consistent, modular Tailwind-based design system. Ideal for corporate websites, portfolios, landing pages, and editorial projects, North combines creative flexibility with structural solidity while maintaining full compatibility with the parent theme and its support for international typography, accessibility, and advanced customization.
Tags: Tailwind, Accessibility, Custom Menu, Custom Logo, Editor Style, Featured Images, Site Editor, Block Editor Patterns, Wide Blocks, Block Editor Styles, Style Variations, Accessible, Blog, Portfolio, Corporate, Blocks
Author:       Ensoul
Template:     twentytwentyfive
Version:      1.0.3
Text Domain:  twentytwentyfivechild
*/

/* ─── Legacy block compatibility ─── */

/* UIKit classes used in old wp:html blocks */
.uk-width-3-4 { width: min(100%, 1200px); }
.uk-margin-auto { margin-left: auto; margin-right: auto; }

/* Video container (responsive iframe wrapper) — scoped to legacy contexts only.
   .uk-width-3-4 wraps videos in legacy pages. The ensoul video-slider also uses
   .video-container but with position:sticky — the uk-width parent prevents collision. */
.uk-width-3-4 .video-container,
.fantoni-gridtwo-full .video-container,
.wp-block-post-content > .video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  overflow: hidden;
}
.uk-width-3-4 .video-container iframe,
.fantoni-gridtwo-full .video-container iframe,
.wp-block-post-content > .video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* ─── page-fullwidth template ─── */

/* Remove ALL WP padding/margins from root */
body.page-template-page-fullwidth {
  --wp--style--root--padding-right: 0px !important;
  --wp--style--root--padding-left: 0px !important;
}

/* Remove padding from site-blocks and any global-padding containers */
body.page-template-page-fullwidth .wp-site-blocks,
body.page-template-page-fullwidth .has-global-padding,
body.page-template-page-fullwidth .wp-block-group,
body.page-template-page-fullwidth .wp-block-post-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: none !important;
}

/* Ensure all direct children of post-content go full width */
body.page-template-page-fullwidth .wp-block-post-content > * {
  max-width: none !important;
}

/* Blocks that should stay constrained within full-width pages */
body.page-template-page-fullwidth .wp-block-post-content > .fantoni-threecolvar {
  margin-inline: auto !important;
}

/* Remove default WP block spacing — legacy blocks have zero gap in production */
body.page-template-page-fullwidth .wp-block-post-content > * + * {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Safety net: consistent line-height for legacy block headings */
[class*="fantoni-"] h1,
[class*="fantoni-"] h2,
[class*="fantoni-"] h3,
[class*="fantoni-"] h4 {
  line-height: 1.15;
}

/* ─── Pages with hero under fixed header ─── */
/* No body padding, no WP block gap — hero starts from page top behind header */
body.home,
body.tax-tipologia,
body.tax-linea_prodotto,
body.single-variante {
  padding-top: 0 !important;
}
body.home .wp-site-blocks > *,
body.tax-tipologia .wp-site-blocks > *,
body.tax-linea_prodotto .wp-site-blocks > *,
body.single-variante .wp-site-blocks > * {
  margin-block-start: 0 !important;
}
/* Hero section: pad-top = header height so content starts below fixed header */
body.tax-tipologia .wp-site-blocks > header + section .wp-block-ensoul-spacing-wrapper,
body.tax-linea_prodotto .wp-site-blocks > header + section .wp-block-ensoul-spacing-wrapper,
body.single-variante .wp-site-blocks > header + section .wp-block-ensoul-spacing-wrapper {
  padding-top: var(--header-h, 106px) !important;
}

/* ─── Taxonomy archive: hero fallback bg when no featured image ─── */
.wp-block-query ~ .wp-block-ensoul-spacing-wrapper[style*="background-image: url"],
.wp-block-ensoul-spacing-wrapper[style*="80vh"] {
  background-color: var(--color-primary-500, #1a2d4e);
}

/* ─── Variante cards: light bg for transparent PNGs ─── */
.ensoul-image-block img[src$=".png"] {
  background-color: #f8f8f8;
}

/* ─── Textrow prose: heading sizes like Tailwind prose-xl ─── */
.fantoni-prose h1 { font-size: 2em !important; line-height: 1.15 !important; margin-bottom: 0.75em; }
.fantoni-prose h2 { font-size: 1.5em !important; line-height: 1.2 !important; margin-bottom: 0.65em; }
.fantoni-prose h3 { font-size: 1.25em !important; line-height: 1.3 !important; margin-bottom: 0.5em; }
.fantoni-prose p { margin-bottom: 1.25em; }

/* ─── ACF blocks inside ensoul/content: remove self-contained width ───
   The width:min() approach is for page-fullwidth (no parent constraint).
   Inside ensoul/content the parent already constrains to 1600px. */
.wp-block-ensoul-content .fantoni-textrow,
.wp-block-ensoul-content [style*="min(100%"] {
  width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* ─── Varianti grid — rollover effect ─── */
.fantoni-variante-card:hover .fantoni-img-default {
  opacity: 0;
}
.fantoni-variante-card:hover .fantoni-img-rollover {
  opacity: 1 !important;
}
/* Fallback hover when no rollover image */
.fantoni-variante-card:hover .fantoni-rollover-wrap:not(:has(.fantoni-img-rollover)) .fantoni-img-default {
  opacity: 0.85;
}
/* Rollover on ensoul image blocks in query loops */
.fantoni-has-rollover { position: relative; overflow: hidden; }
.fantoni-has-rollover .fantoni-img-default { transition: opacity 300ms ease; }
.fantoni-has-rollover:hover .fantoni-img-default,
[data-dynamic-link]:hover .fantoni-has-rollover .fantoni-img-default { opacity: 0; }
.fantoni-has-rollover:hover .fantoni-img-rollover,
[data-dynamic-link]:hover .fantoni-has-rollover .fantoni-img-rollover { opacity: 1 !important; }

/* ─── end page-fullwidth ─── */

#inactivity_message {
  display: flex;
  align-items: center;
  justify-content: center;
  background: black;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  color: #999;
  padding: 0 2rem;
  text-align: center;
}