/**
 * File: framework/assets/css/base.css
 * Conpacts - Global Resets & Shields
 *
 * Provides global resets, universal box-sizing rules, dark mode background initializations, 
 * and defensive CSS shields. These shields protect the framework's components against CSS 
 * bleed from external site builders.
 *
 * @link https://m3.material.io/
 *
 * @package Conturalis
 * @subpackage Framework
 */

/* --- Dark mode support --- */
:root[data-theme="dark"] body {
  background-color: var(--cts-theme-color-neutral-0);
  color: var(--cts-theme-color-neutral-900);
}

/* --- Universal Box Sizing for Conturalis Components (Prevents horizontal scrollbars) --- */
.cts-section-base,
.cts-section-base *,
.cts-section-base *::before,
.cts-section-base *::after {
  box-sizing: border-box;
}

/* --- Base Variables for Sections --- */
.cts-section-base {
  font-family: var(--cts-theme-font-sans);
  background-color: var(--sect-bg, transparent);
  color: var(--sect-text, inherit);
  transition: background-color 0.2s, color 0.2s;
}

/* --- Global Link Reset --- */
a {
  text-decoration: none;
  color: inherit;
  transition: color 0.2s ease;
}
a:hover {
  /* Updated token reference */
  color: var(--cts-theme-color-primary-600);
}

/* --- Hide while Alpine mounts --- */
[x-cloak] { display: none !important; }

/* --- Defensive CSS Shield (Protects against Builder Bleed) --- */

/* 1. Global Specificity Armor (Layout & Typography) - KEEP DOUBLE SYNTAX */
body :is(
  :is(button, a, input, select, textarea).cts-theme-btn-standard,
  :is(input, select, textarea).cts-theme-input,
  button:is(.cts-theme-modal-close, .cts-theme-pw-toggle, .cts-theme-notice-close)
),
body :is(
  :is(button, a, input, select, textarea).cts-theme-btn-standard,
  :is(input, select, textarea).cts-theme-input,
  button:is(.cts-theme-modal-close, .cts-theme-pw-toggle, .cts-theme-notice-close)
):is(:hover, :focus, :focus-visible, :active) {
  box-sizing: border-box !important;
  margin: 0;
  text-transform: none;
  letter-spacing: normal;
  text-decoration: none;
  font-family: var(--cts-theme-font-sans);
  outline: none !important;
}

/* 2. Icon Button Strict Resets (Nukes theme borders, backgrounds, and padding) */
body button:is(.cts-theme-modal-close, .cts-theme-pw-toggle, .cts-theme-notice-close) {
  border: none !important;
  padding: 0 !important;
}

/* Force transparent background ONLY when not hovering/active so our own hover effects work */
body button:is(.cts-theme-modal-close, .cts-theme-pw-toggle, .cts-theme-notice-close):not(:hover):not(:active) {
  background: transparent !important;
}