/* Ryft Technical Consulting skin for Zammad (help.ryft.net).
   Injected by nginx on CT 102 (sub_filter in /etc/nginx/sites-available/zammad.conf), served from /var/www/ryft-brand/.
   Overrides Zammad's own CSS variables only, so Zammad updates don't break it. Palette from www.ryft.ca. */
/* Inter, self-hosted: Zammad's Content-Security-Policy blocks Google Fonts */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(/ryft-brand/inter-latin.woff2) format('woff2');
}

:root {
  --ryft-teal: #0fa3b1;
  --ryft-teal-dark: #0b8793;
  --ryft-blue: #1a6fc4;
  --ryft-navy: #0a1428;
  --ryft-navy-2: #0d2044;
  --ryft-deep: #060d1c;
  --ryft-slate: #425066;
  --ryft-muted: #6b7a94;
  --ryft-bg: #f8f9fc;

  --button-primary-background: var(--ryft-teal);
  --button-primary-background-active: var(--ryft-teal-dark);
  --text-link: var(--ryft-blue);
  --highlight: var(--ryft-teal);
  --border-highlight: var(--ryft-teal);
  --shadow-highlight: hsl(185, 70%, 88%);
  --background-highlight: hsl(185, 70%, 92%);
  --text-muted-highlight: hsl(185, 70%, 90%);
  --background-primary: var(--ryft-bg);
  --background-tertiary: var(--ryft-navy-2);
  --background-quaternary: var(--ryft-deep);
  --menu-background-primary: var(--ryft-deep);
  --menu-background-secondary: var(--ryft-navy);
  --menu-close-tab-background: var(--ryft-navy);
  --menu-background-active: var(--ryft-teal);
  --menu-switch-pointer: var(--ryft-navy);
  --menu-text: hsl(218, 20%, 75%);
  --menu-icon: hsl(218, 15%, 52%);
  --fullscreen-background: var(--ryft-navy);
  --fullscreen-text: hsl(218, 20%, 72%);
}

[data-theme='dark'] {
  --button-primary-background: var(--ryft-teal);
  --button-primary-background-active: var(--ryft-teal-dark);
  --text-link: hsl(186, 70%, 55%);
  --highlight: var(--ryft-teal);
  --border-highlight: var(--ryft-teal);
  --menu-background-primary: var(--ryft-deep);
  --menu-background-secondary: #08111f;
  --menu-background-active: var(--ryft-teal);
  --fullscreen-background: var(--ryft-deep);
}

body, input, textarea, select, button, .btn {
  font-family: 'Inter', 'Segoe UI', Arial, sans-serif;
}

/* login / password reset / signup: ryft.ca hero gradient */
body.fit:has(.login), body:has(> #app .login), .login, .reset_password, .signup {
  background: linear-gradient(160deg, var(--ryft-navy) 0%, var(--ryft-navy-2) 100%);
}
#app:has(.login), #app:has(.reset_password), #app:has(.signup) {
  background: linear-gradient(160deg, var(--ryft-navy) 0%, var(--ryft-navy-2) 100%);
}
.hero-unit {
  border: none;
  border-radius: 14px;
  border-top: 4px solid var(--ryft-teal);
  box-shadow: 0 20px 50px rgba(0, 0, 0, .35);
}
.login .btn--primary, .hero-unit .btn--primary {
  background: linear-gradient(135deg, var(--ryft-blue), var(--ryft-teal));
  border-radius: 8px;
  font-weight: 600;
}

/* buttons */
.btn--primary { border-radius: 6px; font-weight: 600; }
.btn--primary:hover { filter: brightness(1.06); }

/* left navigation: thin teal accent on the active item */
.menu-item.is-active { box-shadow: inset 3px 0 0 #fff3; }

/* headings in Ryft navy */
.page-header h1, .ticketZoom-header .ticket-title-update, h1, h2 { font-weight: 700; }
:root:not([data-theme='dark']) .page-header h1,
:root:not([data-theme='dark']) .ticket-title-update { color: var(--ryft-navy); }

/* "Sign in with Authentik" button in Ryft navy instead of Zammad grey */
.auth-provider, .hero-unit .auth-provider, .login .btn.auth-provider {
  background: var(--ryft-navy-2) !important;
  color: #fff !important;
  border-radius: 8px;
}
.auth-provider:hover { background: var(--ryft-navy) !important; }
