/* Define CSS variables for consistent colors */
:root {
  --color-gold: #BE830E;
  --color-gold-tint: #F5EDDE;
  --color-gold-primary: #9C6800;
  --color-dark-gold: #6B4700;
  --color-black: #000;
  --color-white: #FFF;
}

/* ------------Gold------------------------- */

/* Background color and text color for gold sections */
.bg-gold {
  background-color: var(--color-gold) !important;
  color: var(--color-black);
}

/* Gold background heading colors */
.bg-gold h1,
.bg-gold h2,
.bg-gold h3,
.bg-gold h4,
.bg-gold h5,
.bg-gold h6 {
  color: var(--color-black);
}

/* Gold background link colors, excluding buttons */
.bg-gold a:not(.btn),
.bg-gold a:not(.btn):visited,
.bg-gold a:not(.btn):hover,
.bg-gold a:not(.btn):focus {
  color: var(--color-black);
  text-decoration: underline;
}

/* ---------------Gold Tint------------------- */

/* Light gold/tint background color and text color */
.bg-gold-tint,
.bg-tint {
  background-color: var(--color-gold-tint) !important;
  color: var(--color-black);
}

/* Gold-tint background heading colors */
.bg-gold-tint h1,
.bg-gold-tint h2,
.bg-gold-tint h3,
.bg-gold-tint h4,
.bg-gold-tint h5,
.bg-gold-tint h6,
.bg-tint h1,
.bg-tint h2,
.bg-tint h3,
.bg-tint h4,
.bg-tint h5,
.bg-tint h6 {
  color: var(--color-black);
}

/* Gold-tint background link colors, excluding buttons */
.bg-gold-tint a:not(.btn),
.bg-gold-tint a:not(.btn):visited,
.bg-gold-tint a:not(.btn):hover,
.bg-gold-tint a:not(.btn):focus,
.bg-tint a:not(.btn),
.bg-tint a:not(.btn):visited,
.bg-tint a:not(.btn):hover,
.bg-tint a:not(.btn):focus {
  color: var(--color-black);
  text-decoration: underline;
}

/* ---------------Dark Gold------------------- */

.bg-gold-dark {
  background-color: var(--color-dark-gold) !important;
  color: var(--color-white);
}

/* Dark gold background heading colors */
.bg-gold-dark h1,
.bg-gold-dark h2,
.bg-gold-dark h3,
.bg-gold-dark h4,
.bg-gold-dark h5,
.bg-gold-dark h6 {
  color: var(--color-white);
}

/* Dark gold background link colors, excluding buttons */
.bg-gold-dark a:not(.btn),
.bg-gold-dark a:not(.btn):visited,
.bg-gold-dark a:not(.btn):hover,
.bg-gold-dark a:not(.btn):focus {
  color: var(--color-white);
  text-decoration: underline;
}

/* -------------White-------------------------- */

/* White background and black text */
.bg-white {
  background-color: var(--color-white) !important;
  color: var(--color-black);
}

/* White background heading colors */
.bg-white h1,
.bg-white h2,
.bg-white h3,
.bg-white h4,
.bg-white h5,
.bg-white h6 {
  color: var(--color-black);
}

/* White background link colors, excluding buttons */
.bg-white a:not(.btn),
.bg-white a:not(.btn):visited,
.bg-white a:not(.btn):hover,
.bg-white a:not(.btn):focus {
  color: var(--color-black);
  text-decoration: underline;
}

/* -----------------Transparent Backgrounds------------------- */

.bg-transparent-dark {
  background-color: rgba(0, 0, 0, 0.6) !important;
}

.bg-transparent-light {
  background-color: rgba(255, 255, 255, 0.6) !important;
}

/* ------------------- Text Colors ----------------------- */

/* Gold text color */
.text-gold {
  color: var(--color-gold) !important;
}

/* Black text color */
.text-black {
  color: var(--color-black) !important;
}

/* White text color */
.text-white {
  color: var(--color-white) !important;
}

/* Dark gold text color */
.text-gold-dark {
  color: var(--color-dark-gold) !important;
}

/* ----------------- Border Colors ------------------- */

/* Gold-tint border color */
.border-color-gold-tint,
.border-gold-tint {
  border-color: var(--color-gold-tint) !important;
}

/* Gold border color */
.border-color-gold,
.border-primary {
  border-color: var(--color-gold) !important;
}

/* Dark gold border color */
.border-color-gold-dark {
  border-color: var(--color-dark-gold) !important;
}

/* Black border color */
.border-color-black,
.border-dark {
  border-color: var(--color-black) !important;
}

/* White border color */
.border-color-white,
.border-light {
  border-color: var(--color-white) !important;
}

/* Prevent global section link styling from making card headings look like body links */
.card .card-title a,
.card .card-title a:visited,
.card .card-title a:hover,
.card .card-title a:focus,
.card h1 a,
.card h2 a,
.card h3 a,
.card h4 a,
.card h5 a,
.card h6 a,
.card h1 a:visited,
.card h2 a:visited,
.card h3 a:visited,
.card h4 a:visited,
.card h5 a:visited,
.card h6 a:visited,
.card h1 a:hover,
.card h2 a:hover,
.card h3 a:hover,
.card h4 a:hover,
.card h5 a:hover,
.card h6 a:hover,
.card h1 a:focus,
.card h2 a:focus,
.card h3 a:focus,
.card h4 a:focus,
.card h5 a:focus,
.card h6 a:focus {
  color: inherit;
  text-decoration: none;
}

.card .card-title a:hover,
.card .card-title a:focus,
.card h1 a:hover,
.card h2 a:hover,
.card h3 a:hover,
.card h4 a:hover,
.card h5 a:hover,
.card h6 a:hover,
.card h1 a:focus,
.card h2 a:focus,
.card h3 a:focus,
.card h4 a:focus,
.card h5 a:focus,
.card h6 a:focus {
  text-decoration: underline;
}

/* Shared component design tokens.
 * Screen-only scopes preserve editor, signage, print and opt-out behaviour. */
@media screen {
:where(body:not(.path-admin):not([data-acton-refresh="off"]):not(:has(.xibo-wall, #rsb-kiosk-search, #layout-builder, .ck-editor, .node-form))) {
  
  --acton-refresh-radius: var(--acton-radius);
  --acton-refresh-border: var(--acton-border);
  --acton-refresh-shadow: var(--acton-shadow);
  --acton-refresh-shadow-hover: var(--acton-shadow-hover);
  --acton-body-size: clamp(1rem, .975rem + .125vw, 1.0625rem);
  --acton-h1-size: clamp(2.25rem, 1.75rem + 2vw, 3.5rem);
  --acton-h2-size: clamp(1.75rem, 1.55rem + 1vw, 2.25rem);
  --acton-h3-size: clamp(1.375rem, 1.25rem + .625vw, 1.625rem);
  --acton-card-title-size: clamp(1.25rem, 1.15rem + .5vw, 1.5rem);
  --acton-radius: .625rem;
  --acton-border: #dcd8cf;
  --acton-shadow: 0 2px 8px rgb(0 0 0 / 4%);
  --acton-shadow-hover: 0 4px 12px rgb(0 0 0 / 6%);
  --acton-control-height: 2.75rem;
  --acton-control-radius: .375rem;
  --acton-control-border: #827e76;
  --acton-control-focus: var(--color-gold-primary);
}

}

/* White date labels use the existing darker UI gold, not the lighter brand
 * swatch. Keep the core gold token and all other section colours unchanged. */
.card-header.bg-gold.text-white {
  background-color: var(--color-gold-primary) !important;
  color: var(--color-white) !important;
}