/* ================================================
   Custom Theme: eden
   Generated: Jul 30, 2026 — Ki-Admin PHP Template
   Include this file AFTER style.css

   Porta a paleta "Eden" que a landing pública usava antes de
   /temas unificar tudo num só sistema de temas (o do painel admin) —
   mesma estrutura de web/assets/css/themes/novoBlue-theme.css.
   ================================================ */

:root {
  /* Brand */
  --primary: 185, 104, 73;
  --secondary: 53, 71, 54;

  /* Status */
  --success: 10, 185, 100;
  --danger: 225, 78, 90;
  --warning: 249, 193, 35;
  --info: 65, 150, 250;
  --light: 200, 185, 210;
  --dark: 40, 35, 45;

  /* Text & Backgrounds */
  --font-color: #2b3326;
  --body-color: #fbf7ef;
  --bodybg-color: #efe7d9;
  --font-light-color: #6b4b36;
  --light-gray: #dbd5c7;
  --border_color: #dfc1ae;

  /* Typography */
  --font-size: 15px;
  --p-font-size: 15px;
  --btn-font-size: 16px;
  --h1-font-size: 2.9rem;
  --h2-font-size: 2.25rem;
  --h3-font-size: 1.95rem;
  --h4-font-size: 1.7rem;
  --h5-font-size: 1.35rem;
  --h6-font-size: 1.2rem;
  --p-line-height: 1.6;

  /* Layout */
  --app-border-radius: 0.6rem;
  --bs-border-radius: 0.6rem;
  --sidebar-width: 18rem;
}

/* ================================================
   Auto Palette — tint/shade gerado de Primary/Secondary
   (também recalculado ao vivo por palette.css via color-mix() —
   os valores aqui são o fallback estático, igual ao Theme Builder gera)
   ================================================ */
:root {
  --primary-50: #f9f3f0;
  --primary-100: #f4e7e2;
  --primary-200: #ebd5cc;
  --primary-300: #e0bdaf;
  --primary-400: #ce9580;
  --primary-500: #b96849;
  --primary-600: #a35c40;
  --primary-700: #894d36;
  --primary-800: #6f3e2c;
  --primary-900: #553022;
  --secondary-50: #eff0ef;
  --secondary-100: #dfe2df;
  --secondary-200: #c6cbc7;
  --secondary-300: #a6aea7;
  --secondary-400: #727e72;
  --secondary-500: #354736;
  --secondary-600: #2f3e30;
  --secondary-700: #273528;
  --secondary-800: #202b20;
  --secondary-900: #182119;
}

/* ================================================
   Mobile bridge — app_claude/pipetrack.css (--accent / --pt-*)
   ================================================ */
:root {
  --accent: #b96849;
  --accent-rgb: 185, 104, 73;
  --accent-shade: #894d36;
  --accent-soft: #f9f3f0;
  --pt-success: #0ab964;
  --pt-success-rgb: 10, 185, 100;
  --pt-danger: #e14e5a;
  --pt-danger-rgb: 225, 78, 90;
  --pt-warning: #f9c123;
  --pt-warning-rgb: 249, 193, 35;
}

/* ---- Card Background ---- */
.card { background-color: #ffffff !important; }

/* ================================================
   Card Border Classes — apply to any .card element
   ================================================ */
:root {
  --bd-anim-color: rgba(var(--primary), 1);
  --bd-custom-color: rgba(var(--primary), 1);
}
.card-bd-primary  { border: 2px solid rgba(var(--primary),1) !important; }
.card-bd-success  { border: 2px solid rgba(var(--success),1) !important; }
.card-bd-danger   { border: 2px solid rgba(var(--danger),1) !important; }
.card-bd-warning  { border: 2px solid rgba(var(--warning),1) !important; }
.card-bd-info     { border: 2px solid rgba(var(--info),1) !important; }
.card-bd-custom   { border: 2px solid var(--bd-custom-color) !important; }
.card-bd-left-primary { border-left: 4px solid rgba(var(--primary),1) !important; }
.card-bd-left-success  { border-left: 4px solid rgba(var(--success),1) !important; }
.card-bd-left-danger   { border-left: 4px solid rgba(var(--danger),1) !important; }
.card-bd-left-warning  { border-left: 4px solid rgba(var(--warning),1) !important; }
.card-bd-gradient { border: 2px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, linear-gradient(135deg, rgba(var(--primary),1) 0%, rgba(var(--secondary),0.7) 50%, rgba(var(--warning),1) 100%) border-box; }
@keyframes bdRainbow { 0%{border-color:var(--bd-anim-color)} 25%{border-color:rgba(var(--success),1)} 50%{border-color:rgba(var(--warning),1)} 75%{border-color:rgba(var(--danger),1)} 100%{border-color:var(--bd-anim-color)} }
.card-bd-rainbow { border: 2px solid var(--bd-anim-color) !important; animation: bdRainbow 3s linear infinite; }
@keyframes bdGlow { 0%,100%{box-shadow:0 0 4px var(--bd-anim-color);border-color:var(--bd-anim-color)} 50%{box-shadow:0 0 18px var(--bd-anim-color),0 0 36px var(--bd-anim-color);border-color:var(--bd-anim-color)} }
.card-bd-glow { border: 2px solid var(--bd-anim-color) !important; animation: bdGlow 2s ease-in-out infinite; }
@keyframes bdPulse { 0%,100%{box-shadow:0 0 0 0 var(--bd-anim-color)} 50%{box-shadow:0 0 0 7px transparent} }
.card-bd-pulse { border: 2px solid var(--bd-anim-color) !important; animation: bdPulse 2s ease infinite; }
.card-bd-dashed { border: 2px dashed var(--bd-anim-color) !important; animation: bdRainbow 6s linear infinite; }
/* ---- Moving borders (requires Chrome 85+ / Firefox 128+ / Safari 15.4+) ---- */
@property --bd-run-angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
@keyframes bdRun { to { --bd-run-angle: 360deg; } }
.card-bd-run { border: 3px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), transparent 0deg, var(--bd-anim-color) 60deg, transparent 90deg) border-box; animation: bdRun 2s linear infinite; }
.card-bd-snake { border: 3px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), transparent 0deg, var(--bd-anim-color) 160deg, transparent 200deg) border-box; animation: bdRun 3s linear infinite; }
.card-bd-chase { border: 3px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), transparent 0deg, var(--bd-anim-color) 55deg, transparent 90deg, transparent 180deg, var(--bd-anim-color) 235deg, transparent 270deg) border-box; animation: bdRun 2s linear infinite; }
.card-bd-sweep { border: 3px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), var(--bd-anim-color) 0deg, transparent 90deg, transparent 270deg, var(--bd-anim-color) 360deg) border-box; animation: bdRun 4s linear infinite; }
/* ---- Moving gradient borders ---- */
:root { --bd-mv-c1: rgba(var(--primary),1); --bd-mv-c2: rgba(var(--secondary),1); --bd-mv-c3: rgba(var(--primary),0.6); --bd-mv-c4: rgba(var(--secondary),0.6); }
.card-bd-grad-spin { border: 3px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), var(--bd-mv-c1) 0deg, var(--bd-mv-c2) 90deg, var(--bd-mv-c3) 180deg, var(--bd-mv-c4) 270deg, var(--bd-mv-c1) 360deg) border-box; animation: bdRun 3s linear infinite; }
.card-bd-grad-run { border: 3px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), transparent 0deg, var(--bd-mv-c1) 30deg, var(--bd-mv-c2) 60deg, var(--bd-mv-c3) 90deg, transparent 120deg) border-box; animation: bdRun 2s linear infinite; }
.card-bd-grad-chase, .toolbarLiquidGlass { border: 3px solid transparent !important; background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), transparent 0deg, var(--bd-mv-c1) 30deg, var(--bd-mv-c2) 55deg, transparent 80deg, transparent 180deg, var(--bd-mv-c3) 210deg, var(--bd-mv-c4) 235deg, transparent 260deg) border-box; animation: bdRun 2s linear infinite; }
.bg-custom-gradient { background: linear-gradient(135deg, rgba(var(--primary),1) 0%, rgba(var(--secondary),0.7) 50%, rgba(var(--warning),1) 100%) !important; }

/* ================================================
   Toolbar Mobile — Liquid Glass
   Requer o filtro SVG #toolbar-liquid-glass no HTML do projeto
   (copie o snippet do card "Toolbar Mobile — Liquid Glass" no
   customizador) — sem ele, cai no fallback de blur simples.
   ================================================ */
.toolbarLiquidGlass {
  border-radius: 999px;
  border: 3px solid transparent;
  background: linear-gradient(var(--body-color),var(--body-color)) padding-box, conic-gradient(from var(--bd-run-angle), transparent 0deg, var(--bd-mv-c1) 30deg, var(--bd-mv-c2) 55deg, transparent 80deg, transparent 180deg, var(--bd-mv-c3) 210deg, var(--bd-mv-c4) 235deg, transparent 260deg) border-box;
  animation: bdRun 2s linear infinite;
  box-shadow: inset 0 0 2px 1px rgba(255,255,255,.55), inset 0 0 10px 4px rgba(255,255,255,.22), 0 6px 24px rgba(17,17,26,.06), 0 12px 40px rgba(17,17,26,.05);
}

/* ================================================
   Liquid Glass
   ================================================ */
:root { --glass-blur: 25px; --glass-opacity: 0.60; --glass-border-opacity: 0.35; }
.card-glass {
    background: rgba(255,255,255,var(--glass-opacity,.18)) !important;
    backdrop-filter: blur(var(--glass-blur,15px)) saturate(1.8);
    -webkit-backdrop-filter: blur(var(--glass-blur,15px)) saturate(1.8);
    border: 1px solid rgba(255,255,255,var(--glass-border-opacity,.35)) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.5) !important;
}

/* ================================================
   Fix: hardcoded teal colors herdados do template
   ================================================ */

/* Substitui o login-bg.png (onda teal) por gradiente temático */
.sign-in-bg .main-container .main-content-box {
  background-image: linear-gradient(145deg, rgba(var(--primary), 0.10) 0%, rgba(var(--secondary), 0.22) 100%) !important;
}