/* Barbara look & feel para Zammad (UI clásica: login, portal de cliente y agentes).
   Paleta y tipografía de barbara_panel_frontend (_colors.scss, _fonts.scss) y del
   tema de login de Keycloak (v26_2). Se inyecta con sub_filter desde el Ingress.
   Zammad expone su tema como variables CSS: se sobrescriben, no se reescriben reglas.
   Solo tema claro, como el panel: ui-defaults.js impide que Zammad pase a oscuro. */

@font-face { font-family: Inter; font-weight: 400; font-display: swap; src: url(inter-400.woff2) format("woff2"); }
@font-face { font-family: Inter; font-weight: 500; font-display: swap; src: url(inter-500.woff2) format("woff2"); }
@font-face { font-family: Inter; font-weight: 600 700; font-display: swap; src: url(inter-600.woff2) format("woff2"); }

/* marca (no cambian con el tema) */
:root {
  --bbr-navy-950: #061829;
  --bbr-navy-900: #081F36;
  --bbr-navy-800: #0B2945;
  --bbr-navy-750: #15324C;
  --bbr-navy-700: #2B455D;
  --bbr-blue-dark: #00344F;
  --bbr-blue-darker: #001E30;
  --bbr-blue: #006494;
  --bbr-coral: #FB3449;
  --bbr-orange: #FB8649;
  --bbr-orange-soft: #FDC2A4;
  --bbr-orange-tint: #FFF1EA;

  --highlight: var(--bbr-orange);
  --border-highlight: var(--bbr-orange);
  --supergood-color: #0AAE4C;
  --menu-background-active: var(--bbr-coral);
  --menu-text: #B1BAC3;
  --menu-icon: #8A99A6;
  --fullscreen-background: var(--bbr-navy-800);
  --fullscreen-text: #D9E2EA;
}

:root {
  --button-primary-background: var(--bbr-blue-dark);
  --button-primary-background-active: var(--bbr-blue-darker);
  --header-primary: var(--bbr-navy-800);
  --header-secondary: #8A99A6;
  --text-normal: #1C1B1F;
  --text-muted: #637688;
  --text-muted-alt: #8A99A6;
  --text-link: var(--bbr-blue);
  --text-nav: var(--bbr-blue);
  --interactive-muted: #B1BAC3;
  --interactive-muted-alt: #D9E2EA;
  --interactive-muted-alt-selected: var(--bbr-navy-700);

  --background-primary: #F5F7F8;
  --background-primary-alt: #E1E5E8;
  --background-secondary-hover: #F5F7F8;
  --background-tertiary: var(--bbr-navy-800);
  --background-quaternary: var(--bbr-navy-900);
  --background-active: var(--bbr-navy-800);
  --background-highlight: var(--bbr-orange-tint);
  --background-article-customer: #EEF3F7;
  --background-article-customer-meta: #F5F7F8;

  --border: #E1E5E8;
  --border-alt: #CBD5E1;
  --border-article-customer: #D9E2EA;
  --border-article-customer-selected: #B1BAC3;
  --shadow-highlight: var(--bbr-orange-soft);

  --danger-color: #F44336;
  --tag-text: var(--bbr-navy-700);
  --tag-background: #E1E5E8;
  --elevation-low: 0 0 8px 0 rgba(0,0,0,.08), 0 2px 2px 0 rgba(22,34,51,.06), 0 4px 4px 0 rgba(22,34,51,.03);
}

/* ---------- Comunes ---------- */
body, input, textarea, select, button, .btn {
  font-family: Inter, "Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing: -0.1px;
}
.btn { border-radius: 5px; font-weight: 500; }
.form-control, .tokenfield.form-control, .searchableSelect-main { border-radius: 4px; }
.form-control:focus, .form-control.focus { border-color: var(--button-primary-background); box-shadow: 0 0 0 1px var(--button-primary-background); }

/* Botones "crear/positivo" de Zammad (verde) → primario de Barbara */
.btn--positive, .btn--create, .btn--success { background: var(--button-primary-background); }
.btn--positive:active, .btn--create:active, .btn--success:active { background: var(--button-primary-background-active); }
.btn--positive.btn--secondary, .btn--create.btn--secondary, .btn--success.btn--secondary { color: var(--button-primary-background); }
.btn--text.btn--positive, a.create { color: var(--button-primary-background); }
/* resto de verdes "crear/nuevo" de Zammad (los de éxito/estado se quedan en verde) */
.user-menu-icon.icon-plus { fill: var(--bbr-coral); }
.dropdown-menu > li.create:hover, .dropdown-menu > li.create.is-active,
.recipientList--new, .avatar--new, .loading.icon { background: var(--bbr-coral); }

/* Logo de Zammad (pájaro: menú y avatar de sistema) → "b" de Barbara */
.icon-logo { background: url(avatar.svg) center / 82% no-repeat; }
.icon-logo use { display: none; }

/* ---------- Login (igual que el de Keycloak: el salto entre ambos no se nota) ---------- */
.login.fullscreen, .reset_password.fullscreen, .request_admin_password_auth.fullscreen {
  background: var(--bbr-navy-800) url(background-login.jpg) right top / cover no-repeat fixed;
}
.login .fullscreen-body > p:first-child { color: #fff; font-size: 24px; font-weight: 500; }
.login .hero-unit {
  --text-normal: #111111;
  --text-muted: #637688;
  --border: #E1E5E8;
  --background-secondary: #FFFFFF;
  background: #FFFFFF;
  color: #111111;
  border: 0;
  border-radius: 12px;
  padding: 32px 40px 28px;
  box-shadow: 0 8px 32px rgba(8, 31, 54, .35);
}
.login .company-logo { display: none; }
.login .hero-unit::before {
  content: "";
  display: block;
  height: 160px;
  margin: 0 auto 8px;
  background: url(login-node.svg) center / contain no-repeat;
}
.login .separator-text { font-weight: 500; letter-spacing: .4px; color: var(--text-muted); }
.auth-provider.auth-provider--openid-connect {
  height: 44px;
  margin: 7px 0;
  border-radius: 6px;
  background: var(--bbr-navy-900);
  font-weight: 500;
}
.auth-provider.auth-provider--openid-connect:hover { background: var(--bbr-blue-dark); }
.auth-provider--openid-connect .provider-icon { display: none; }
.login .js-footer, .login .js-footer a { color: #B1BAC3; }
.poweredBy { visibility: hidden; }