/**
 * Custom CSS overrides for The X theme
 */

/* Target every possible selector for the page title with maximum specificity */
body #block-thex-page-title h1.page-title,
body .page-title-wrap h1.page-title,
body h1.page-title,
body .page-title,
#block-thex-page-title h1,
.page-title-wrap h1 {
  font-family: sans-serif !important;
  font-size: 2.2rem !important;
  line-height: 1.2 !important;
}

/* Target any spans inside the page title */
body #block-thex-page-title h1.page-title span,
body .page-title-wrap h1.page-title span,
body h1.page-title span,
body .page-title span {
  font-family: sans-serif !important;
  font-size: inherit !important;
}

/* Preserve heading sizes but ensure sans-serif font */
h1, h2, h3, h4, h5, h6, .block-title {
  font-family: sans-serif !important;
}

/* Typography settings - all text should be sans-serif and 16px except headings and titles */
body:not(.toolbar-fixed):not(.toolbar-horizontal):not(.toolbar-vertical),
p,
div:not(.toolbar):not(.toolbar-tray):not([class*="toolbar-"]),
span:not([class*="toolbar-"]),
li:not([class*="toolbar-"]):not(.toolbar-tab):not(.menu-item),
td,
blockquote,
figcaption,
label,
input,
select,
textarea,
button:not([class*="toolbar-"]),
.field,
.field-item,
.field-label,
.node-content,
.views-field,
.taxonomy-term,
.comment-content,
.comment-text,
.comment-body {
  font-family: sans-serif !important;
  /*font-size: 16px !important;*/
}

/* Tab elements - keep Olivero styling */
.tabs--primary li,
.tabs--secondary li,
.tabs__tab,
.tabs__link {
  font-family: unset !important;
  font-size: unset !important;
  line-height: unset !important;
  font-weight: unset !important;
  letter-spacing: unset !important;
}

/* Olivero-inspired button styling */
.button,
button,
[type="button"],
[type="reset"],
[type="submit"] {
  background-color: var(--primary);
  color: white;
  border-radius: 0.1875rem; /* Olivero border-radius */
  transition: background-color 0.2s;
}

.button:hover,
button:hover,
[type="button"]:hover,
[type="reset"]:hover,
[type="submit"]:hover {
  background-color: var(--secondary);
}

/* Olivero-inspired link styling */
a {
  color: var(--primary);
  transition: color 0.2s;
}

a:hover {
  color: var(--secondary);
}

/* Make the header region full width */
.region-header {
  width: 100%;
  flex: 1 1 100%;
  max-width: 100%;
  background-color: var(--light);
  border-bottom: 1px solid var(--border);
}

.site-brand {
  width: 100%;
  display: block;
}

/* Ensure header container spans full width */
.header-container {
  width: 100%;
}

/* Ensure the header blocks are properly displayed */
.region-header .block {
  width: 100%;
  text-align: center;
}