/*
 * Sacred Heart master palette
 * Source: Sacred.html supplied as the project theme reference.
 * Loaded after page-level styles so every first-party screen shares one theme.
 */
:root {
  --sacred-red: #980d18;
  --sacred-red-dark: #5e0710;
  --sacred-burgundy: #4a0710;
  --sacred-gold: #d99a12;
  --sacred-gold-soft: #f4d58a;
  --sacred-purple: #6d1b8e;
  --sacred-ink: #2b2022;
  --sacred-muted: #776669;
  --sacred-cream: #fff9f2;
  --sacred-surface: #fffdf9;
  --sacred-soft: #f9eff1;
  --sacred-line: #e8d5d8;
  --sacred-line-strong: #d7bec3;
  --sacred-shadow: 0 18px 42px rgba(83, 7, 18, 0.13);
  --sacred-font: Inter, ui-sans-serif, system-ui, -apple-system,
    BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

  /* Existing project tokens now resolve to the Sacred Heart palette. */
  --navy: var(--sacred-burgundy);
  --navy2: #680a15;
  --blue: var(--sacred-red);
  --cyan: var(--sacred-gold);
  --violet: var(--sacred-purple);
  --orange: var(--sacred-gold);
  --ink: var(--sacred-ink);
  --muted: var(--sacred-muted);
  --line: var(--sacred-line);
  --line2: var(--sacred-line-strong);
  --soft: var(--sacred-cream);
  --soft2: var(--sacred-soft);
  --white: #fff;
  --shadow: var(--sacred-shadow);
  --soft-shadow: 0 10px 26px rgba(83, 7, 18, 0.09);

  --color-bg: var(--sacred-cream);
  --color-sang: var(--sacred-muted);
  --color-gunian: var(--sacred-gold);
  --color-3: var(--sacred-gold);
  --color-grey: var(--sacred-muted);
  --color-green: var(--sacred-purple);
  --color-green2: var(--sacred-purple);
  --color-blue: var(--sacred-red);
  --color-white: #fff;
  --color-black: var(--sacred-ink);
  --color-dark-blue: var(--sacred-red-dark);
  --color-date: var(--sacred-gold);
  --color-seemore: var(--sacred-red);

  /* Bootstrap variables used throughout the project. */
  --bs-body-font-family: var(--sacred-font);
  --bs-body-color: var(--sacred-ink);
  --bs-body-bg: var(--sacred-cream);
  --bs-primary: var(--sacred-red);
  --bs-primary-rgb: 152, 13, 24;
  --bs-secondary: var(--sacred-purple);
  --bs-secondary-rgb: 109, 27, 142;
  --bs-link-color: var(--sacred-red);
  --bs-link-hover-color: var(--sacred-red-dark);
  --bs-border-color: var(--sacred-line);
}

html,
body {
  font-family: var(--sacred-font) !important;
  color: var(--sacred-ink);
  background-color: var(--sacred-cream);
}

body {
  background-image:
    radial-gradient(circle at 12% 8%, rgba(109, 27, 142, 0.06), transparent 30%),
    radial-gradient(circle at 88% 6%, rgba(217, 154, 18, 0.10), transparent 32%);
  background-attachment: fixed;
}

h1,
h2,
h3,
h4,
h5,
h6,
.title,
.page-title,
.section-title {
  color: var(--sacred-burgundy);
}

a {
  color: var(--sacred-red);
}

a:hover,
a:focus {
  color: var(--sacred-red-dark);
}

::selection {
  color: #fff;
  background: var(--sacred-purple);
}

.card,
.modal-content,
.dropdown-menu,
.offcanvas,
.list-group-item,
.accordion-item,
.table,
.content-card,
.form-container,
.login-container,
.register-container {
  --bs-card-color: var(--sacred-ink);
  --bs-card-bg: rgba(255, 253, 249, 0.97);
  --bs-table-color: var(--sacred-ink);
  --bs-table-bg: transparent;
  color: var(--sacred-ink);
  border-color: var(--sacred-line);
}

.card,
.modal-content,
.offcanvas,
.content-card,
.form-container,
.login-container,
.register-container {
  background-color: rgba(255, 253, 249, 0.97);
  box-shadow: var(--sacred-shadow);
}

.text-primary {
  color: var(--sacred-red) !important;
}

.text-secondary,
.text-muted {
  color: var(--sacred-muted) !important;
}

.bg-primary,
.btn-primary,
.btn-blue,
.btn-color-3,
button.primary,
input[type="submit"] {
  color: #fff !important;
  border-color: var(--sacred-red) !important;
  background-color: var(--sacred-red) !important;
  background-image: linear-gradient(135deg, var(--sacred-purple), var(--sacred-red) 56%, var(--sacred-gold)) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-blue:hover,
.btn-color-3:hover,
button.primary:hover,
input[type="submit"]:hover {
  border-color: var(--sacred-red-dark) !important;
  background-color: var(--sacred-red-dark) !important;
  box-shadow: 0 10px 22px rgba(120, 10, 25, 0.22);
}

.btn-outline-primary {
  color: var(--sacred-red) !important;
  border-color: var(--sacred-red) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  color: #fff !important;
  background-color: var(--sacred-red) !important;
}

.badge.bg-primary,
.nav-pills .nav-link.active,
.page-item.active .page-link,
.progress-bar {
  color: #fff !important;
  border-color: var(--sacred-red) !important;
  background-color: var(--sacred-red) !important;
}

.nav-link,
.page-link {
  color: var(--sacred-red);
}

.nav-link:hover,
.nav-link:focus,
.page-link:hover,
.page-link:focus {
  color: var(--sacred-red-dark);
}

.form-control,
.form-select,
input,
select,
textarea {
  color: var(--sacred-ink);
  border-color: var(--sacred-line-strong);
  background-color: #fffefc;
}

.form-control:focus,
.form-select:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--sacred-gold) !important;
  box-shadow: 0 0 0 0.2rem rgba(217, 154, 18, 0.18) !important;
  outline-color: var(--sacred-gold);
}

.table > :not(caption) > * > * {
  color: var(--sacred-ink);
  border-bottom-color: var(--sacred-line);
}

.table thead th,
.table-dark,
thead.table-dark {
  color: #fff;
  border-color: var(--sacred-red-dark);
  background-color: var(--sacred-burgundy);
}

hr,
.dropdown-divider,
.border,
.border-top,
.border-end,
.border-bottom,
.border-start {
  border-color: var(--sacred-line) !important;
}

@media print {
  html,
  body {
    color: #000;
    background: #fff !important;
  }

  .card,
  .modal-content,
  .content-card,
  .form-container {
    box-shadow: none !important;
  }
}