/* R1 Crown Theme */
:root {
  --crown-purple: #6f42c1; /* Bootstrap purple */
  --crown-deep-purple: #4b1fa3;
  --crown-gold: #ffd700;
  --crown-gold-dark: #c9a400;
}

.bg-crown {
  background: linear-gradient(90deg, var(--crown-deep-purple), var(--crown-purple));
}

/* Sticky footer layout */
html, body {
  height: 100%;
}

.crown-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.crown-main {
  flex: 1 0 auto;
}

.crown-navbar {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.crown-logo {
  height: 44px;
  width: auto;
  display: block;
  transform: translateY(-2px);
}

.bg-crown-hero {
  background: radial-gradient(circle at 20% 20%, var(--crown-purple), var(--crown-deep-purple));
}

.crown-home-nav {
  padding: 1.25rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(255, 215, 0, 0.35);
  background: rgba(75, 31, 163, 0.08);
}

.crown-form-surface {
  width: 100%;
  max-width: none;
  padding: 3rem 2.5rem;
}

.crown-loader {
  margin: 1.5rem 0 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  --crown-draw-duration: 2.9s;
}

.crown-loader-art {
  width: min(360px, 90vw);
}

.crown-loader-svg {
  width: 100%;
  height: auto;
  display: block;
}

.crown-loader-base {
  stroke: var(--crown-gold);
  stroke-width: 7;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 1px 0 rgba(255, 215, 0, 0.25));
  stroke-dasharray: 650;
  stroke-dashoffset: 650;
  animation: crown-draw var(--crown-draw-duration) ease-out forwards;
}

.crown-loader-fill {
  fill: var(--crown-gold-dark);
  opacity: 0;
  animation: crown-fill 0.55s ease-out forwards;
  animation-delay: var(--crown-draw-duration);
}

.crown-loader-jewel {
  fill: var(--crown-purple);
  stroke: var(--crown-gold);
  stroke-width: 3;
  transform-origin: 120px 36px;
  animation: jewel-pulse 1.6s ease-in-out infinite;
}

.crown-loader-jewel-glint {
  fill: rgba(255, 255, 255, 0.98);
  stroke: var(--crown-deep-purple);
  stroke-width: 2;
  paint-order: stroke fill;
  transform-origin: 120px 36px;
  filter:
    drop-shadow(0 0 10px rgba(255, 255, 255, 0.85))
    drop-shadow(0 0 16px rgba(255, 215, 0, 0.35));
  animation: jewel-star-glint 1.4s ease-in-out infinite;
}

/* Flatpickr (modern date picker) - keep within crown theme */
.flatpickr-calendar {
  border: 1px solid rgba(255, 215, 0, 0.35);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.selected:hover {
  background: var(--crown-purple);
  border-color: var(--crown-purple);
}

.flatpickr-day.today {
  border-color: var(--crown-gold);
}

.flatpickr-months .flatpickr-prev-month:hover svg,
.flatpickr-months .flatpickr-next-month:hover svg {
  fill: var(--crown-purple);
}

.crown-loader-text {
  color: var(--crown-deep-purple);
  font-weight: 700;
  letter-spacing: 0.3px;
  font-size: 2rem;
}

@keyframes crown-draw {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes crown-fill {
  from {
    opacity: 0;
  }
  to {
    opacity: 0.32;
  }
}

@keyframes jewel-pulse {
  0%, 100% {
    transform: scale(1);
    filter: drop-shadow(0 0 0 rgba(111, 66, 193, 0));
  }
  50% {
    transform: scale(1.1);
    filter: drop-shadow(0 0 14px rgba(111, 66, 193, 0.45));
  }
}

@keyframes jewel-star-glint {
  0%, 100% {
    opacity: 0.15;
    transform: translate(0, 0) scale(0.75) rotate(0deg);
  }
  40% {
    opacity: 1;
    transform: translate(8px, -7px) scale(1.25) rotate(18deg);
  }
  52% {
    opacity: 0.8;
    transform: translate(10px, -8px) scale(1.12) rotate(22deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .crown-loader-base,
  .crown-loader-jewel,
  .crown-loader-jewel-glint {
    animation: none;
  }
  .crown-loader-base {
    stroke-dashoffset: 0;
  }
  .crown-loader-fill {
    opacity: 0.32;
  }
}

.crown-home-nav-stack {
  display: flex;
  flex-direction: column;
  gap: 2.25rem;
}

.crown-home-nav-title {
  font-weight: 700;
  color: var(--crown-deep-purple);
  margin: 0 0 0.75rem 0;
}

.text-crown {
  color: var(--crown-purple);
}

.crown-divider {
  height: 4px;
  border: 0;
  background: linear-gradient(90deg, var(--crown-gold), var(--crown-gold-dark));
  border-radius: 2px;
}

.btn-crown {
  background-color: var(--crown-purple);
  color: #fff;
  border: 1px solid var(--crown-gold);
}
.btn-crown:hover {
  background-color: var(--crown-deep-purple);
  color: #fff;
}

.btn-crown-runall {
  background: linear-gradient(90deg, var(--crown-gold-dark), var(--crown-gold));
  color: var(--crown-deep-purple);
  border: 2px solid var(--crown-deep-purple);
  font-weight: 800;
  letter-spacing: 0.2px;
}

.btn-crown-runall:hover {
  background: linear-gradient(90deg, var(--crown-gold), var(--crown-gold-dark));
  color: var(--crown-deep-purple);
  border-color: var(--crown-deep-purple);
}

.crown-back {
  border-color: var(--crown-gold);
}

.crown-card {
  border: 1px solid var(--crown-gold);
}

.navbar-brand span {
  color: var(--crown-gold);
  font-weight: 600;
}

.crown-brand-text {
  font-size: 1.5rem;
  letter-spacing: 0.5px;
}

.nav-link.active, .nav-link:hover {
  color: var(--crown-gold) !important;
}

.navbar-user {
  color: #fff;
  font-size: 1rem;
}

.crown-logout.btn {
  border-color: var(--crown-gold);
  color: #fff;
}
.crown-logout.btn:hover {
  border-color: var(--crown-gold-dark);
  background-color: rgba(255, 215, 0, 0.15);
  color: #fff;
}



.crown-footer {
  margin-top: 0;
  padding: 1.1rem 0;
  border-top: 3px solid var(--crown-gold);
}

.crown-footer-inner {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 calc(1rem + 50px);
}

.crown-version {
  justify-self: start;
  color: rgba(255, 255, 255, 0.85);
  font-weight: 600;
  font-size: 1rem;
  letter-spacing: 0.5px;
}

.crown-footer-spacer {
  justify-self: end;
}

.crown-footer-logo {
  height: 40px;
  width: auto;
  display: block;
}