/*
  AcuPower brand tokens for the calendar host (12 BK-ARC-070). Values come from the AcuPower design system
  (tokens/colors.css, typography.css, radii.css). The AcuPower red is reserved for the logo and never used here.
  Montserrat is used when installed; the calendar host loads no third-party font (CSP font-src 'self').
*/
:root {
    --acu-navy-900: #17294f;
    --acu-navy-800: #1a3160;
    --acu-navy-700: #1d376a;
    --acu-navy-600: #2f4f8f;
    --acu-navy-500: #38589b;
    --acu-blue-600: #2f5aa6;
    --acu-blue-500: #3a7bff;
    --acu-gold-500: #f5b84a;
    --acu-gold-100: #fcecc9;
    --acu-gold-050: #fff8ea;
    --acu-ink-700: #3a4458;
    --acu-ink-600: #4a546b;
    --acu-ink-400: #667085;
    --acu-ink-300: #a0a7b5;
    --acu-line-100: #ebf2ff;
    --acu-line-200: #dce5f5;
    --acu-line-300: #d0d7e2;
    --acu-surface-page: #ffffff;
    --acu-surface-50: #f4f7fc;
    --acu-surface-200: #f4f6fa;
    --acu-on-navy: #ffffff;
    --acu-on-navy-muted: #e7ecf8;

    --acu-font-core: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial,
        sans-serif;
    --acu-radius-7: 7px;
    --acu-radius-12: 12px;
    --acu-radius-16: 16px;
    --acu-ring-card: inset 0 0 0 1px var(--acu-line-200);

    --bs-body-font-family: var(--acu-font-core);
    --bs-body-color: var(--acu-ink-700);
    --bs-body-bg: var(--acu-surface-page);
    --bs-primary: var(--acu-navy-700);
    --bs-primary-rgb: 29, 55, 106;
    --bs-link-color: var(--acu-blue-600);
    --bs-link-color-rgb: 47, 90, 166;
    --bs-link-hover-color: var(--acu-navy-700);
    --bs-link-hover-color-rgb: 29, 55, 106;
    --bs-border-color: var(--acu-line-300);
    --bs-border-radius: var(--acu-radius-7);
}

body {
    font-family: var(--acu-font-core);
    font-size: 14px;
    line-height: 22px;
    color: var(--acu-ink-700);
    background-color: var(--acu-surface-page);
}

h1,
h2,
h3,
h4 {
    font-weight: 600;
    color: var(--acu-navy-900);
}

h1 {
    font-size: 28px;
    line-height: 36px;
}

h2 {
    font-size: 18px;
    line-height: 26px;
}

.btn-primary {
    --bs-btn-bg: var(--acu-navy-700);
    --bs-btn-border-color: var(--acu-navy-700);
    --bs-btn-hover-bg: var(--acu-navy-900);
    --bs-btn-hover-border-color: var(--acu-navy-900);
    --bs-btn-active-bg: var(--acu-navy-900);
    --bs-btn-active-border-color: var(--acu-navy-900);
}

.acp-eyebrow {
    font-size: 13px;
    font-weight: 600;
    line-height: 17px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--acu-blue-600);
}

.acp-card {
    padding: 24px;
    border-radius: var(--acu-radius-16);
    background: var(--acu-surface-page);
    box-shadow: var(--acu-ring-card);
}

.acp-meta {
    font-size: 12px;
    color: var(--acu-ink-400);
}

/*
  The "TEST" corner ribbon outside Production (TestCaption, Views/Shared/_TestCaption.cshtml). It is fixed, so it never
  moves the page, lets every click through and is not printed. Its warning red is not the AcuPower brand red.
*/
.acp-test-caption {
    position: fixed;
    top: 24px;
    left: -44px;
    z-index: 2147483647;
    width: 160px;
    padding: 4px 0;
    transform: rotate(-45deg);
    background-color: #b91c1c;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    color: #ffffff;
    font-family: var(--acu-font-core);
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.2em;
    text-align: center;
    text-indent: 0.2em;
    text-transform: uppercase;
    pointer-events: none;
    user-select: none;
}

@media print {
    .acp-test-caption {
        display: none;
    }
}
