/* assets/css/domain-guide.css
   DOMAIN GUIDE page only. */

/* Hero backdrop */
.dg-hero-glow {
    position: absolute;
    top: -6rem;
    left: 50%;
    transform: translateX(-50%);
    width: 46rem;
    height: 30rem;
    background: radial-gradient(ellipse at center, rgba(79,70,229,0.14) 0%, transparent 65%);
    z-index: 0;
    pointer-events: none;
}
.dark .dg-hero-glow {
    background: radial-gradient(ellipse at center, rgba(99,102,241,0.22) 0%, transparent 65%);
}

/* Filter tabs */
.dg-tab {
    font-size: 0.875rem;
    font-weight: 600;
    padding: 0.5rem 1rem;
    border-radius: 0.75rem;
    color: #475569;
    background: transparent;
    border: 1px solid #e2e8f0;
    transition: all var(--transition-base);
}
.dg-tab:hover { border-color: #c7d2fe; color: var(--color-primary); }
.dg-tab.active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
    box-shadow: 0 4px 14px 0 rgba(79,70,229,0.25);
}
.dark .dg-tab { color: #cbd5e1; border-color: #334155; }
.dark .dg-tab:hover { color: #a5b4fc; border-color: #4f46e5; }
.dark .dg-tab.active { color: #fff; }

/* Registrar accordion */
.reg-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
}
.reg-item.is-open { border-color: rgba(79,70,229,0.4); }
.reg-item.is-open .reg-chevron { transform: rotate(180deg); }

/* Step connector line */
.reg-steps { position: relative; }
.reg-steps > li { position: relative; }
.reg-steps > li:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 0.875rem;           /* center of the 1.75rem number badge */
    top: 2rem;
    bottom: -1rem;
    width: 2px;
    background: linear-gradient(to bottom, rgba(79,70,229,0.25), transparent);
}
.dark .reg-steps > li:not(:last-child)::before {
    background: linear-gradient(to bottom, rgba(129,140,248,0.3), transparent);
}

/* Copy button success state */
.copy-btn.copied {
    color: #059669 !important;
    border-color: rgba(5,150,105,0.4) !important;
}
.copy-btn.copied i { color: #059669 !important; }
.dark .copy-btn.copied { color: #34d399 !important; }
.dark .copy-btn.copied i { color: #34d399 !important; }