/* arvore.css - Custom styling and styles for Árvore Genealógica Ramos */

:root {
  --app-bg: #F5F2ED;
  --app-card-bg: #FAF9F6;
  --app-card-white: #FFFFFF;
  --app-card-border: rgba(26, 26, 26, 0.1);
  --app-text-main: #1A1A1A;
  --app-text-muted: rgba(26, 26, 26, 0.65);
  --app-text-sub: rgba(26, 26, 26, 0.45);
  --app-accent: #0f5132;
  --app-accent-hover: #0a3622;
  --app-nav-bg: #1A1A1A;
  --app-text-nav: #FAF9F6;
  --app-nav-border: transparent;
}

@keyframes slideIn {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.animate-slide-in {
  animation: slideIn 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.animate-fade-in {
  animation: fadeIn 0.15s ease-out forwards;
}

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #aaa;
}

/* Custom Tree lines styling */
.tree-svg-line {
  stroke: var(--app-text-sub);
  stroke-width: 2;
  fill: none;
  stroke-dasharray: 4 4;
  transition: all 0.25s ease;
}

.tree-svg-line-solid {
  stroke: var(--app-accent);
  stroke-width: 2.5;
  fill: none;
  transition: all 0.25s ease;
}

/* Custom interactive components */
.member-node-active {
  box-shadow: 0 0 0 3px var(--app-accent), 0 10px 25px -5px rgba(0,0,0,0.1) !important;
  border-color: var(--app-accent) !important;
}

/* Print optimizations */
@media print {
  body {
    background: white !important;
    color: black !important;
  }
  .no-print {
    display: none !important;
  }
}