/* Tanefer brand theme override for Vaultwarden web vault.
   Colors mirror resources/views/layouts/app.blade.php in the Tanefer CRM. */

:root {
  /* newer design-token scale (plain hex) - drives buttons/links via --color-bg-brand / --color-fg-brand */
  --color-brand-050: #fbf7f2 !important;
  --color-brand-100: #f5eadf !important;
  --color-brand-200: #ecd9c0 !important;
  --color-brand-300: #d9b07c !important;
  --color-brand-400: #cba173 !important;
  --color-brand-500: #bd9468 !important;
  --color-brand-600: #a67d4e !important;
  --color-brand-700: #4f3316 !important;
  --color-brand-800: #33210e !important;
  --color-brand-900: #23180d !important;
  --color-brand-950: #120c07 !important;

  /* legacy token scale (RGB triplets, used by rgb(var(...))) */
  --color-background: 250 248 245 !important;      /* #faf8f5 */
  --color-background-alt: 245 234 223 !important;  /* #f5eadf */
  --color-primary-100: 245 234 223 !important;     /* #f5eadf */
  --color-primary-300: 217 176 124 !important;     /* #d9b07c */
  --color-primary-600: 189 148 104 !important;     /* #bd9468 */
  --color-primary-700: 79 51 22 !important;        /* #4f3316 */
  --color-text-main: 47 31 16 !important;          /* #2f1f10 */
  --color-text-muted: 138 114 87 !important;       /* #8a7257 */
  --color-text-contrast: 35 24 13 !important;      /* #23180d, dark text on gold buttons */
}

html.theme_light {
  /* page/card surfaces (separate token family from --color-background) */
  --color-bg-secondary: #faf8f5 !important;
  --color-bg-primary: #fefbf8 !important;
  --color-bg-tertiary: #faf8f5 !important;
  --color-bg-quaternary: #f5eadf !important;
}

.theme_dark {
  --color-background: 18 12 7 !important;          /* #120c07 */
  --color-background-alt: 35 24 13 !important;      /* #23180d */
  --color-primary-100: 79 51 22 !important;         /* #4f3316 */
  --color-primary-300: 217 176 124 !important;      /* #d9b07c */
  --color-primary-600: 189 148 104 !important;      /* #bd9468 */
  --color-primary-700: 217 176 124 !important;      /* #d9b07c */
  --color-text-main: 245 234 223 !important;        /* #f5eadf */
  --color-text-muted: 217 196 173 !important;       /* #d9c4ad */
  --color-text-contrast: 35 24 13 !important;       /* #23180d */
  --color-bg-secondary: #120c07 !important;
  --color-bg-primary: #1a1108 !important;
  --color-bg-tertiary: #120c07 !important;
  --color-bg-quaternary: #23180d !important;
}

/* replace the Vaultwarden wordmark with the Tanefer logo, on a dark chip so the
   white logo stays legible against both light and dark page backgrounds */
a:has(> bit-svg[aria-label="Bitwarden logo"]) {
  background-image: url(../images/tanefer-logo-tight.png) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 78% auto !important;
  background-color: #23180d !important;
  border-radius: 12px !important;
}

a:has(> bit-svg[aria-label="Bitwarden logo"]) bit-svg {
  visibility: hidden !important;
}

/* remove Vaultwarden/Bitwarden branded footer disclaimer and decorative safe icon */
footer.tw-bg-background-alt,
bit-landing-footer {
  display: none !important;
}

.tw-size-20.sm\:tw-size-24 {
  display: none !important;
}

/* ============================================================
   CRM-style login screen: dark gradient + grid backdrop, glass
   card, centered logo, gold button. Mirrors
   resources/views/auth/login.blade.php in the Tanefer CRM.
   Scoped to auth-anon-layout so the logged-in vault app is unaffected.
   ============================================================ */

auth-anon-layout {
  /* force the CRM dark palette regardless of system light/dark theme */
  --color-text-main: 245 234 223 !important;       /* #f5eadf */
  --color-text-muted: 217 196 173 !important;      /* #d9c4ad */
  --color-background: 35 24 13 !important;         /* #23180d, for any lingering tw-bg-background */
  --color-bg-primary: rgba(245, 234, 223, 0.10) !important;
  --color-bg-secondary: transparent !important;
  --color-bg-tertiary: transparent !important;
  --color-bg-quaternary: rgba(245, 234, 223, 0.10) !important;

  /* CRM's sign-in button is always gold, regardless of system theme */
  --color-brand-400: #bd9468 !important;
  --color-brand-700: #bd9468 !important;
  --color-fg-brand: #d9b07c !important;
  --color-fg-brand-strong: #f5eadf !important;
  --color-fg-brand-soft: #d9b07c !important;
  --color-bg-brand: #bd9468 !important;
  --color-bg-brand-strong: #d9b07c !important;
  --color-fg-contrast: #23180d !important;
  --color-border-brand: #bd9468 !important;

  /* secondary/outline buttons ("Back", etc.) use the neutral gray scale by
     default - retint for legibility against our dark card */
  --color-fg-heading: #f5eadf !important;
  --color-border-base: rgba(189, 148, 104, 0.45) !important;

  display: block !important;
  min-height: 100vh !important;
  background-image:
    linear-gradient(rgba(189, 148, 104, .18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(189, 148, 104, .18) 1px, transparent 1px),
    linear-gradient(135deg, #120c07 0%, #23180d 38%, #4f3316 100%) !important;
  background-size: 46px 46px, 46px 46px, 100% 100% !important;
  background-repeat: repeat, repeat, no-repeat !important;
  background-attachment: fixed !important;
}

/* hide the small top logo bar on auth screens - replaced by the large centered logo below */
auth-anon-layout header.tw-bg-background-alt {
  display: none !important;
}

/* the login/register/etc card itself, made into a floating glass panel */
auth-anon-layout bit-landing-content > div {
  background: rgba(245, 234, 223, 0.12) !important;
  border: 1px solid rgba(189, 148, 104, 0.35) !important;
  border-radius: 28px !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.45) !important;
  max-width: 430px !important;
  width: calc(100% - 2rem) !important;
  margin: 48px auto !important;
}

/* large centered Tanefer logo above the "Log in" / "Create account" heading */
auth-anon-layout bit-landing-hero .tw-text-center.tw-mx-auto::before {
  content: "" !important;
  display: block !important;
  height: 64px !important;
  margin: 0 auto 20px !important;
  background-image: url(../images/tanefer-logo-tight.png) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

/* translucent gold-bordered inputs, matching the CRM form fields */
auth-anon-layout .tw-bg-background.tw-rounded-lg {
  background: rgba(245, 234, 223, 0.10) !important;
  border: 1px solid rgba(189, 148, 104, 0.45) !important;
  border-radius: 16px !important;
}

auth-anon-layout .tw-bg-background.tw-rounded-lg:focus-within {
  border-color: #d9b07c !important;
  box-shadow: 0 0 0 3px rgba(189, 148, 104, 0.25) !important;
}

auth-anon-layout input,
auth-anon-layout select {
  color: #ffffff !important;
}

auth-anon-layout input::placeholder {
  color: rgba(217, 196, 173, 0.65) !important;
}

auth-anon-layout input[type="checkbox"] {
  accent-color: #bd9468 !important;
}

/* the inner Bitwarden "card" component would otherwise double-box inside our
   outer glass panel - flatten it so only the outer panel shows */
auth-anon-layout bit-landing-card bit-base-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
