/* ================================================================
   INESC CONTENT — COMMON
   Shared design tokens for the events listing and the news listing.
   The two pieces that must be IDENTICAL across both — the category
   filter bar (.inesc-filter-tabs) and the pagination (.inesc-pagination)
   — are owned by INESC Core and pulled in as dependencies of this
   stylesheet; only this layout's gutter adapter for them lives below.
   Plus the unified external-margin tokens (--ip-gutter / --ip-news-gutter).

   Self-contained: tokens are scoped to the plugin wrapper classes (NOT
   :root), so nothing leaks into the theme. The canonical token set is the
   namespaced --ip-* family; the legacy events names (--green, --text-24,
   --font-main, …) are kept as ALIASES that resolve to the same --ip-* value,
   so there is a single source of truth and the two modules share one
   definition of every font/size.
   ================================================================ */

.inesc-events,
.inesc-event-single,
.inesc-event-related,
.inesc-event-card,
.inesc-post-single,
.inesc-post-related,
.inesc-news-listing,
.inesc-news-card,
.inesc-latest-news,
.inesc-filter-tabs {

  /* Fluid breakpoints (used by the clamp() tokens below) */
  --fluid-min-width: 48rem;     /* 768px */
  --fluid-max-width: 85.375rem; /* 1366px */
  --fluid-range: calc(var(--fluid-max-width) - var(--fluid-min-width));

  /* ---- Canonical colors ---- */
  --ip-blue:           #005f80;
  --ip-dark-blue:      #004d6d;
  --ip-green:          #97ca3d;
  --ip-green-dark:     #84b62f;
  --ip-gray:           #6a858e;
  --ip-text-light:     #ffffff;
  --ip-placeholder-bg: #d9d9d9;

  /* ---- Canonical font family ---- */
  --ip-font: "Titillium Web", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* ---- Canonical font weights ---- */
  --ip-fw-light:   300;
  --ip-fw-regular: 400;
  --ip-fw-semi:    600;
  --ip-fw-bold:    700;

  /* ---- Card radius ---- */
  --ip-radius-card: clamp(0.85714rem, calc(0.85714rem + (1.9286rem - 0.85714rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.9286rem);

  /* ---- Canonical fluid font sizes (union of both modules) ---- */
  --ip-text-11:   clamp(0.625rem, calc(0.625rem + (0.6875rem - 0.625rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 0.6875rem);
  --ip-text-12:   clamp(0.625rem, calc(0.625rem + (0.75rem - 0.625rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 0.75rem);
  --ip-text-14:   clamp(0.75rem, calc(0.75rem + (0.875rem - 0.75rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 0.875rem);
  --ip-text-16:   clamp(0.84375rem, calc(0.84375rem + (1rem - 0.84375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1rem);
  --ip-text-17:   clamp(0.90625rem, calc(0.90625rem + (1.0625rem - 0.90625rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.0625rem);
  --ip-text-17-5: clamp(0.90625rem, calc(0.90625rem + (1.09375rem - 0.90625rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.09375rem);
  --ip-text-18:   clamp(0.9375rem, calc(0.9375rem + (1.125rem - 0.9375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.125rem);
  --ip-text-19:   clamp(1rem, calc(1rem + (1.1875rem - 1rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.1875rem);
  --ip-text-19-5: clamp(1rem, calc(1rem + (1.21875rem - 1rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.21875rem);
  --ip-text-20:   clamp(0.9375rem, calc(0.9375rem + (1.25rem - 0.9375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.25rem);
  --ip-text-21:   clamp(1.09375rem, calc(1.09375rem + (1.3125rem - 1.09375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.3125rem);
  --ip-text-22:   clamp(1.15625rem, calc(1.15625rem + (1.375rem - 1.15625rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.375rem);
  --ip-text-22-5: clamp(1.1875rem, calc(1.1875rem + (1.40625rem - 1.1875rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.40625rem);
  --ip-text-24:   clamp(1.3125rem, calc(1.3125rem + (1.5rem - 1.3125rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.5rem);
  --ip-text-25:   clamp(1.34375rem, calc(1.34375rem + (1.5625rem - 1.34375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.5625rem);
  --ip-text-26:   clamp(1.40625rem, calc(1.40625rem + (1.625rem - 1.40625rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.625rem);
  --ip-text-27-5: clamp(0.9375rem, calc(0.9375rem + (1.71875rem - 0.9375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.71875rem);
  --ip-text-30:   clamp(1.6875rem, calc(1.6875rem + (1.875rem - 1.6875rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.875rem);
  --ip-text-33:   clamp(0.9375rem, calc(0.9375rem + (2.0625rem - 0.9375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 2.0625rem);
  --ip-text-35:   clamp(1.84375rem, calc(1.84375rem + (2.1875rem - 1.84375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 2.1875rem);
  --ip-text-36:   clamp(1.5625rem, calc(1.5625rem + (2.25rem - 1.5625rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 2.25rem);
  --ip-text-38:   clamp(2rem, calc(2rem + (2.375rem - 2rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 2.375rem);
  --ip-text-49:   clamp(2.59375rem, calc(2.59375rem + (3.0625rem - 2.59375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 3.0625rem);

  /* ---- Unified external margin / layout (base Posts) ---- */
  --ip-container:   84.125rem;                /* 1346px */
  --ip-gutter:      clamp(1rem, 10vw, 5rem);  /* matches WPBakery row gutter */
  --ip-news-gutter: clamp(1rem, 5vw, 5rem);

  /* ---- Spacing scale (events) ---- */
  --spacing-xs:  clamp(0.25rem, calc(0.25rem + (0.3125rem - 0.25rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 0.3125rem);
  --spacing-sm:  clamp(0.375rem, calc(0.375rem + (0.5rem - 0.375rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 0.5rem);
  --spacing-md:  clamp(0.75rem, calc(0.75rem + (1rem - 0.75rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1rem);
  --spacing-lg:  clamp(1rem, calc(1rem + (1.5rem - 1rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 1.5rem);
  --spacing-xl:  clamp(1.5rem, calc(1.5rem + (2rem - 1.5rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 2rem);
  --spacing-2xl: clamp(2rem, calc(2rem + (3rem - 2rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 3rem);
  --spacing-3xl: clamp(2rem, calc(2rem + (18.5rem - 2rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 18.5rem);

  /* ---- Misc events-only tokens (no posts equivalent) ---- */
  --accent-color:  #ff6b35;
  --text-dark:     #000000;
  --border-color:  #e0e0e0;
  --bg-light:      #f5f5f5;
  --dark-gray:     #5a5d55;
  --menu-height:   136px;
  --breakpoint-tablet: 48rem;
  --breakpoint-mobile: 30rem;
  --offset:        5%;
  --inner-padding: 5.5vw;
  --radius-sm: 0.2143rem;
  --radius-md: 0.2857rem;
  --radius-lg: var(--ip-radius-card);
  --radius-xl: clamp(1.1071rem, calc(1.1071rem + (2.1429rem - 1.1071rem) * ((100vw - var(--fluid-min-width)) / var(--fluid-range))), 2.1429rem);

  /* ================================================================
     Events-compat aliases → canonical --ip-* (single source of truth).
     These let the events layout CSS keep its original token names while
     resolving to exactly the same value the posts layout uses.
     ================================================================ */
  --primary-color:   var(--ip-blue);
  --secondary-color: var(--ip-green);
  --blue:            var(--ip-blue);
  --dark-blue:       var(--ip-dark-blue);
  --green:           var(--ip-green);
  --gray:            var(--ip-gray);
  --text-light:      var(--ip-text-light);
  --font-main:       var(--ip-font);
  --font-heading:    var(--ip-font);
  --extra-light: 200;
  --light:       300;
  --normal:      400;
  --semi-bold:   600;
  --bold:        700;
  --text-11:   var(--ip-text-11);
  --text-12:   var(--ip-text-12);
  --text-14:   var(--ip-text-14);
  --text-16:   var(--ip-text-16);
  --text-17:   var(--ip-text-17);
  --text-17-5: var(--ip-text-17-5);
  --text-18:   var(--ip-text-18);
  --text-19:   var(--ip-text-19);
  --text-19-5: var(--ip-text-19-5);
  --text-20:   var(--ip-text-20);
  --text-21:   var(--ip-text-21);
  --text-22:   var(--ip-text-22);
  --text-22-5: var(--ip-text-22-5);
  --text-24:   var(--ip-text-24);
  --text-25:   var(--ip-text-25);
  --text-26:   var(--ip-text-26);
  --text-27-5: var(--ip-text-27-5);
  --text-30:   var(--ip-text-30);
  --text-33:   var(--ip-text-33);
  --text-35:   var(--ip-text-35);
  --text-36:   var(--ip-text-36);
  --text-38:   var(--ip-text-38);
  --text-49:   var(--ip-text-49);
  --container-width: var(--ip-container);
}

/* ================================================================
   SHARED COMPONENTS — sourced from INESC Core
   The category filter bar (.inesc-filter-tabs) and pagination
   (.inesc-pagination) are styled by inesc-core (assets/filter-tabs.css +
   assets/pagination.css), enqueued as dependencies of this stylesheet so the
   two listings share one definition of each component. Only the layout bits
   Core intentionally leaves to the consumer live here: the filter bar's
   full-width "bleed" and its gutter padding, expressed via --ip-news-gutter.
   ================================================================ */

/* Accessibility: visible focus ring, scoped so it never touches the theme. */
.inesc-filter-tabs a:focus-visible,
.inesc-pagination a:focus-visible {
  outline: 2px solid var(--ip-green);
  outline-offset: 2px;
}

/* Gutter alignment for the filter bar (Core leaves the layout-specific bits to
   the consumer). No horizontal margin — the bar sits flush to its container,
   0px on the left and right. */
.inesc-filter-tabs {
  --ic-tabs-pad-x: var(--ip-news-gutter);
  min-height: 5.875rem;
  margin: 0 0 2rem;
}

@media (max-width: 768px) {
  .inesc-filter-tabs {
    --ic-tabs-pad-x: 5vw;
    min-height: 0;
    margin: 0 0 1.5rem;
  }
}