/* AppOX brand theme for the quality-appox site.
   Scoped entirely under body.quality-theme so it never affects
   the suivi-consultants app, which shares app.css with this site. */

body.quality-theme {
  --primary: #112653;       /* azul marino principal (AppOX brand) */
  --primary-hover: #001128; /* azul muy oscuro */
  --primary-light: #DDEAF2; /* azul muy claro / gris azulado */

  --accent: #21D4C2;        /* turquesa claro (icons, decorative accents) */
  --accent-strong: #4AEADE; /* turquesa brillante (on dark backgrounds) */
  --link: #11397F;          /* azul corporativo medio — links on white, AA contrast */

  --bg: #F4F8FB;
  --surface: #ffffff;
  --border: #DDEAF2;

  --text: #112653;
  --text-muted: #6E6F70;
  --text-light: #828282;

  font-family: 'Barlow', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

body.quality-theme .doc-content a { color: var(--link); }

/* Tags use the turquoise accent (navy text on light turquoise stays high-contrast) */
body.quality-theme .doc-tag { background: rgba(74,234,222,.25); color: var(--primary); }

body.quality-theme input:focus,
body.quality-theme select:focus,
body.quality-theme textarea:focus {
  box-shadow: 0 0 0 3px rgba(17,38,83,.12);
}

/* ===== Sidebar: solid navy, per brand "fondo azul + logo blanco" ===== */
body.quality-theme .sidebar {
  background: linear-gradient(180deg, #112653 0%, #001128 100%);
  border-right: none;
}
body.quality-theme .sidebar-header { border-bottom-color: rgba(255,255,255,.12); }
body.quality-theme .sidebar-logo img { display: block; }
body.quality-theme .sidebar-subtitle { color: rgba(255,255,255,.55); }

body.quality-theme .nav-section-title { color: rgba(255,255,255,.4); }
body.quality-theme .nav-link { color: rgba(255,255,255,.75); }
body.quality-theme .nav-link:hover { background: rgba(255,255,255,.08); color: #fff; }
body.quality-theme .nav-link.active { background: rgba(74,234,222,.14); color: var(--accent-strong); }

body.quality-theme .sidebar-footer { border-top-color: rgba(255,255,255,.12); }
body.quality-theme .user-name { color: #fff; }
body.quality-theme .user-role { color: rgba(255,255,255,.55); }
body.quality-theme .sidebar-footer .btn-ghost { color: rgba(255,255,255,.75); }
body.quality-theme .sidebar-footer .btn-ghost:hover { background: rgba(255,255,255,.1); color: #fff; }
body.quality-theme .user-avatar { background: var(--accent-strong); color: #001128; }

/* ===== Login page: brand gradient background, white card ===== */
body.quality-theme.auth-page {
  background: linear-gradient(135deg, var(--accent-strong) 0%, #112653 100%);
  position: relative;
  overflow: hidden;
}
/* Decorative empty circles echoing the isotype ring, per the brand's
   "círculos vacíos de distintos tamaños" motif. */
body.quality-theme.auth-page::before,
body.quality-theme.auth-page::after {
  content: '';
  position: absolute;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  pointer-events: none;
}
body.quality-theme.auth-page::before { width: 460px; height: 460px; top: -140px; right: -140px; }
body.quality-theme.auth-page::after { width: 280px; height: 280px; bottom: -90px; left: -70px; border-color: rgba(255,255,255,.12); }
body.quality-theme .auth-card { position: relative; z-index: 1; }
body.quality-theme .auth-logo { display: flex; flex-direction: column; align-items: center; gap: 10px; }
body.quality-theme .auth-logo img { display: block; }
