/* South Valley University brand: the official crest and its colours. Loaded last so it can finish the look
   of shared components. Buttons, links, focus rings and success states take these colours from the tokens
   in svu-ui.css (--svu-blue is the crest navy, --svu-green the ribbon green). */
:root {
  --svu-brand-navy: #021A3C;
  --svu-brand-navy-hover: #0B2D5E;
  /* Bright gold is for lines, dots and fills only: it is too light for text (2.99:1). Use the text shade. */
  --svu-brand-gold: #E27A06;
  --svu-brand-gold-text: #A85A00;
  --svu-brand-green: #0A612C;
  --svu-brand-cream: #F8F4ED;
}

/* Crest in place of the old text badge (header, ID card). */
.brand-mark.brand-logo { width: 40px; height: 40px; padding: 0; border-radius: 50%; background: #fff; box-shadow: none; object-fit: contain; }
.brand { color: var(--svu-brand-navy); }

/* Header: a thin gold rule under the bar. */
.top-nav { border-bottom: 0; box-shadow: inset 0 -2px 0 var(--svu-brand-gold); }

/* Selected tabs carry a gold underline; the label stays navy. */
.workspace-tabs a.is-active { color: var(--svu-brand-navy); box-shadow: inset 0 -3px var(--svu-brand-gold); }
.admissions-tabs a[aria-current] { border-bottom-color: var(--svu-brand-gold); color: var(--svu-brand-navy); }

/* Sign-in: crest, name and motto centred above the form. */
.signin-card { border-top: 4px solid var(--svu-brand-navy); }
.signin-identity { display: grid; justify-items: center; gap: var(--svu-space-1); margin: 0 0 var(--svu-space-2); text-align: center; }
.signin-crest { width: 112px; height: 112px; object-fit: contain; margin-bottom: var(--svu-space-2); }
.signin-name { margin: 0; color: var(--svu-brand-navy); font-size: 20px; font-weight: 700; letter-spacing: 0.01em; }
.signin-motto { margin: 0; color: var(--svu-brand-green); font-size: 13px; font-style: italic; letter-spacing: 0.04em; }
.signin-identity::after { content: ""; width: 48px; height: 3px; margin-top: var(--svu-space-3); border-radius: 2px; background: var(--svu-brand-gold); }
.signin-card .page-title { text-align: center; color: var(--svu-brand-navy); }
.signin-card .button-primary { background: var(--svu-brand-navy); box-shadow: none; }
.signin-card .button-primary:hover { background: var(--svu-brand-navy-hover); }
.signin-card .link-button, .signin-card a { color: var(--svu-brand-navy); }

/* Home greeting: a navy band over the campus photo, with the crest and a gold rule. */
.home-ui.ui-home .dashboard-head, .student-greeting { color: #fff; border-bottom: 3px solid var(--svu-brand-gold); }
.home-ui.ui-home .dashboard-head::before, .student-greeting::before,
.home-ui.ui-home .dashboard-head.is-scrolled::before, .student-greeting.is-scrolled::before { background: linear-gradient(100deg, rgba(2,26,60,.96) 0%, rgba(2,26,60,.90) 55%, rgba(11,45,94,.80) 100%); }
.home-ui.ui-home .dashboard-head .page-title, .student-greeting .ui-display { color: #fff; }
.home-ui.ui-home .dashboard-head .ui-meta, .student-greeting .ui-body, .student-greeting .ui-meta { color: rgba(255,255,255,.82); }
.home-ui.ui-home .dashboard-head .eyebrow, .student-greeting .ui-eyebrow { display: inline-flex; align-items: center; gap: 8px; color: #F6C27A; }
.home-ui.ui-home .dashboard-head .eyebrow::before, .student-greeting .ui-eyebrow::before {
  content: ""; width: 28px; height: 28px; flex: none; border-radius: 50%; background: #fff url('assets/icons/svu-logo-64.png') center / 26px no-repeat;
}
/* On the navy band the main action is gold (navy text on gold is 5.8:1). */
.home-ui.ui-home .dashboard-head .button-primary, .student-greeting .button-primary { background: var(--svu-brand-gold); color: var(--svu-brand-navy); }
.home-ui.ui-home .dashboard-head .button-primary:hover, .student-greeting .button-primary:hover { background: #F08A1A; }
.home-ui.ui-home .dashboard-head .student-date-widget, .student-greeting .student-date-widget { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.24); color: #fff; }
.home-ui.ui-home .dashboard-head .student-date-widget svg, .student-greeting .student-date-widget svg { color: #F6C27A; }

/* Student ID card: navy card, crest, gold rule under the heading, green status. */
.id-card-head { padding-bottom: 10px; border-bottom: 2px solid var(--svu-brand-gold); }
.id-card-head .brand-mark.brand-logo { width: 44px; height: 44px; }

/* Official documents and the verification page. */
.document-crest { width: 64px; height: 64px; object-fit: contain; flex: none; }
.transcript-head { border-bottom: 2px solid var(--svu-brand-gold); align-items: center; }
.transcript-head .document-brand { display: flex; align-items: center; gap: 12px; }
.transcript-document h2, .certificate-document h2, .certificate-document h3 { color: var(--svu-brand-navy); }
.certificate-document { border-top: 4px solid var(--svu-brand-navy); }
.certificate-document .document-crest { width: 96px; height: 96px; }
.document-motto { margin: 0; color: var(--svu-brand-green); font-style: italic; font-size: 13px; letter-spacing: 0.04em; }

@media (max-width: 640px) {
  .signin-crest { width: 96px; height: 96px; }
  .signin-name { font-size: 18px; }
}