/**
 * Magic University — Tenant CSS Overrides
 *
 * Colors from shop.magiccastle.com/pages/magic-university
 * Font: Lora (Google Fonts)
 */

@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&display=swap');

:root {
  /* Brand primitives */
  --color-brand-primary:        #a71924;
  --color-brand-primary-dark:   #8a1420;
  --color-brand-primary-light:  #c41f2e;
  --color-brand-accent:         #e2c58e;
  --color-brand-accent-dark:    #c9a96b;
  --color-brand-accent-light:   #ecdba9;
  --color-brand-accent-contrast: #151515; /* dark text on gold backgrounds */

  /* Page background — warm parchment */
  --background: #e2c58e;

  /* Header */
  --header-bg: #a71924;

  /* Typography */
  --heading-font: 'Lora', Georgia, serif;

  /* Hero button — gold on red gradient */
  --hero-button-primary-bg:    var(--color-brand-accent);
  --hero-button-primary-text:  var(--color-brand-accent-contrast);
  --hero-button-primary-hover: var(--color-brand-accent-dark);

  /* CTA button — red on parchment */
  --cta-primary-bg:       var(--color-brand-primary);
  --cta-primary-bg-hover: var(--color-brand-primary-dark);
  --cta-primary-text:     #ffffff;
}

body {
  font-family: 'Lora', Georgia, serif;
}

/* Nav link size override */
header .nav-link {
  font-size: 18px;
}

/* Dropdown panel — matches header color */
header .nav-dropdown-menu {
  background-color: var(--header-bg);
  border-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  border-radius: 0;
}

header .nav-dropdown-item {
  color: var(--text-inverted);
  font-size: 16px;
}

header .nav-dropdown-item:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: var(--text-inverted);
}

/* Dashboard nav — match header red */
@media (min-width: 768px) {
  body.dashboard-nav-ready {
    background: linear-gradient(to right, var(--header-bg) 0%, var(--header-bg) 64px, var(--background) 64px) !important;
  }

  body.dashboard-nav-ready.dashboard-nav-pinned {
    background: linear-gradient(to right, var(--header-bg) 0%, var(--header-bg) 240px, var(--background) 240px) !important;
  }
}

.dashboard-sidebar,
.dashboard-bottombar {
  background-color: var(--header-bg) !important;
}

/* Hero button: gold on red gradient (overrides cta-primary in hero context) */
.section-hero--branded .cta-primary {
  background-color: var(--hero-button-primary-bg);
  color: var(--hero-button-primary-text);
}

.section-hero--branded .cta-primary:hover {
  background-color: var(--hero-button-primary-hover);
}