/* AppOX brand theme for the people-appox site.
   Scoped entirely under body.people-theme so it never affects the
   suivi-consultants or quality-appox sites, which each have their own
   equivalent (see public/css/brand-suivi.css and quality/src/assets/brand.css).
   Same AppOX color tokens as brand-suivi.css, just re-scoped. */

body.people-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.people-theme input:focus,
body.people-theme select:focus,
body.people-theme textarea:focus {
  box-shadow: 0 0 0 3px rgba(17,38,83,.12);
}

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

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

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

/* ===== Login page: brand gradient background, white card ===== */
body.people-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.people-theme.auth-page::before,
body.people-theme.auth-page::after {
  content: '';
  position: absolute;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 50%;
  pointer-events: none;
}
body.people-theme.auth-page::before { width: 460px; height: 460px; top: -140px; right: -140px; }
body.people-theme.auth-page::after { width: 280px; height: 280px; bottom: -90px; left: -70px; border-color: rgba(255,255,255,.12); }
body.people-theme .auth-card { position: relative; z-index: 1; }
body.people-theme .auth-logo { display: flex; flex-direction: column; align-items: center; gap: 10px; }
body.people-theme .auth-logo img { display: block; }

/* ===== People-specific layout (not shared with the other sites) ===== */
body.people-theme .people-two-col {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
body.people-theme .people-two-col > .card { margin-bottom: 20px; }
body.people-theme .people-date-row,
body.people-theme .people-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 16px;
}
body.people-theme .people-field-wide { grid-column: 1 / -1; }
body.people-theme .people-summary {
  background: var(--primary-light);
  border-radius: 8px;
  padding: 4px 14px;
}
body.people-theme .people-negative { color: var(--danger); }
body.people-theme .people-nav-count { margin-left: auto; }
body.people-theme input:disabled,
body.people-theme select:disabled,
body.people-theme textarea:disabled {
  background: var(--bg);
  color: var(--text);
  cursor: default;
}

/* ===== Absence calendar (admin) ===== */
body.people-theme .people-cal { border-collapse: collapse; font-size: 12px; width: 100%; }
body.people-theme .people-cal th,
body.people-theme .people-cal td {
  border: 1px solid var(--border);
  min-width: 26px;
  height: 30px;
  text-align: center;
  padding: 0;
}
body.people-theme .people-cal th { font-weight: 600; color: var(--text-muted); padding: 4px 0; line-height: 1.2; }
body.people-theme .people-cal .people-cal-name {
  text-align: left;
  padding: 0 12px;
  min-width: 180px;
  white-space: nowrap;
  position: sticky;
  left: 0;
  background: var(--surface);
  z-index: 1;
}
body.people-theme .people-cal-off { background: var(--bg); }
body.people-theme .people-cal-approved { background: var(--accent); }
body.people-theme .people-cal-pending {
  background: repeating-linear-gradient(45deg, var(--warning-light), var(--warning-light) 4px, #fcd34d 4px, #fcd34d 8px);
}
body.people-theme .people-cal th.people-cal-today,
body.people-theme .people-cal td.people-cal-today { box-shadow: inset 0 0 0 2px var(--primary); }
body.people-theme .people-cal-swatch {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 3px;
  border: 1px solid var(--border);
  vertical-align: middle;
}

@media (max-width: 768px) {
  body.people-theme .people-two-col,
  body.people-theme .people-date-row,
  body.people-theme .people-field-grid { grid-template-columns: 1fr; }
}