/* EDIVIC Professional Motion System
   Safe, lightweight animations only. No backend/database logic changed. */
:root {
    --edivic-motion-fast: 160ms;
    --edivic-motion-normal: 280ms;
    --edivic-motion-slow: 520ms;
    --edivic-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html {
    scroll-behavior: smooth;
}

body {
    animation: edivicPageEnter 520ms var(--edivic-ease) both;
}

@keyframes edivicPageEnter {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes edivicFadeUp {
    from { opacity: 0; transform: translateY(22px); }
    to { opacity: 1; transform: translateY(0); }
}

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

@keyframes edivicScaleIn {
    from { opacity: 0; transform: scale(0.96); }
    to { opacity: 1; transform: scale(1); }
}

@keyframes edivicFloatSoft {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

@keyframes edivicPulseGlow {
    0%, 100% { box-shadow: 0 0 0 rgba(0, 212, 255, 0); }
    50% { box-shadow: 0 12px 34px rgba(0, 212, 255, 0.18); }
}

.edivic-animate-ready {
    opacity: 0;
    transform: translateY(22px);
    will-change: opacity, transform;
}

.edivic-animate-ready.edivic-in-view {
    animation: edivicFadeUp 620ms var(--edivic-ease) both;
    animation-delay: var(--edivic-delay, 0ms);
}

.edivic-animate-scale.edivic-in-view {
    animation-name: edivicScaleIn;
}

/* Navbar motion */
.navbar,
.saas-navbar,
.dashboard-navbar,
.top-navbar,
header {
    transition: background-color var(--edivic-motion-normal) ease,
                box-shadow var(--edivic-motion-normal) ease,
                border-color var(--edivic-motion-normal) ease,
                transform var(--edivic-motion-normal) var(--edivic-ease);
}

.navbar a,
.saas-navbar a,
.dashboard-navbar a,
.nav-link,
.navbar button,
.saas-navbar button,
.dashboard-navbar button {
    transition: color var(--edivic-motion-fast) ease,
                background-color var(--edivic-motion-fast) ease,
                border-color var(--edivic-motion-fast) ease,
                transform var(--edivic-motion-fast) var(--edivic-ease);
}

.navbar a:hover,
.saas-navbar a:hover,
.dashboard-navbar a:hover,
.nav-link:hover,
.navbar button:hover,
.saas-navbar button:hover,
.dashboard-navbar button:hover {
    transform: translateY(-1px);
}

/* Buttons */
button,
.btn,
.primary-btn,
.secondary-btn,
.cta-button,
.btn-primary,
.btn-secondary,
.action-btn,
.submit-btn,
.login-btn,
.register-btn,
.pricing-btn,
.proposal-btn,
.message-btn {
    transition: transform var(--edivic-motion-fast) var(--edivic-ease),
                box-shadow var(--edivic-motion-fast) ease,
                filter var(--edivic-motion-fast) ease,
                background-color var(--edivic-motion-fast) ease,
                border-color var(--edivic-motion-fast) ease;
}

button:hover,
.btn:hover,
.primary-btn:hover,
.secondary-btn:hover,
.cta-button:hover,
.btn-primary:hover,
.btn-secondary:hover,
.action-btn:hover,
.submit-btn:hover,
.login-btn:hover,
.register-btn:hover,
.pricing-btn:hover,
.proposal-btn:hover,
.message-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.04);
}

button:active,
.btn:active,
.primary-btn:active,
.secondary-btn:active,
.cta-button:active,
.btn-primary:active,
.btn-secondary:active,
.action-btn:active,
.submit-btn:active,
.login-btn:active,
.register-btn:active,
.pricing-btn:active,
.proposal-btn:active,
.message-btn:active {
    transform: translateY(0) scale(0.98);
}

/* Cards and panels */
.card,
.stat-card,
.project-card,
.editor-card,
.pricing-card,
.dashboard-card,
.info-card,
.profile-card,
.message-card,
.notification-card,
.setting-card,
.policy-card,
.form-card,
.panel,
.box,
.brief-card,
.application-card,
.chat-contact,
.chat-message,
.table-card {
    transition: transform var(--edivic-motion-normal) var(--edivic-ease),
                box-shadow var(--edivic-motion-normal) ease,
                border-color var(--edivic-motion-normal) ease,
                background-color var(--edivic-motion-normal) ease;
}

.card:hover,
.stat-card:hover,
.project-card:hover,
.editor-card:hover,
.pricing-card:hover,
.dashboard-card:hover,
.info-card:hover,
.profile-card:hover,
.message-card:hover,
.notification-card:hover,
.setting-card:hover,
.form-card:hover,
.panel:hover,
.brief-card:hover,
.application-card:hover,
.table-card:hover {
    transform: translateY(-4px);
}

/* Forms */
input,
select,
textarea {
    transition: border-color var(--edivic-motion-fast) ease,
                box-shadow var(--edivic-motion-fast) ease,
                background-color var(--edivic-motion-fast) ease,
                transform var(--edivic-motion-fast) var(--edivic-ease);
}

input:focus,
select:focus,
textarea:focus {
    transform: translateY(-1px);
}

/* Hero and logo */
.hero,
.hero-section,
.home-hero,
.main-hero {
    animation: edivicFadeIn 700ms ease both;
}

.hero img,
.hero-section img,
.home-hero img,
.main-hero img,
.navbar img,
.saas-navbar img,
.dashboard-navbar img,
.logo img,
.brand img {
    transition: transform var(--edivic-motion-normal) var(--edivic-ease),
                filter var(--edivic-motion-normal) ease,
                opacity var(--edivic-motion-normal) ease;
}

.hero img:hover,
.hero-section img:hover,
.home-hero img:hover,
.main-hero img:hover,
.logo img:hover,
.brand img:hover {
    transform: scale(1.025);
}

/* Dropdowns and menus */
.dropdown-menu,
.profile-menu,
.user-menu,
.mobile-menu,
.nav-menu {
    animation: edivicScaleIn 220ms var(--edivic-ease) both;
    transform-origin: top right;
}

/* Chat/message polish */
.chat-message,
.message-bubble,
.notification-card {
    animation: edivicScaleIn 260ms var(--edivic-ease) both;
}

/* Loading skeleton shimmer upgrade */
.skeleton,
.skeleton-line,
.skeleton-card,
.page-skeleton *[class*="skeleton"] {
    background-size: 220% 100%;
    animation-duration: 1.25s;
}

/* Small premium motion highlights */
.pricing-card.featured,
.pricing-card.popular,
.hero .primary-btn,
.hero-section .primary-btn,
.cta-button {
    animation-duration: 3.8s;
    animation-iteration-count: infinite;
}

/* Make dynamic content reveal smoothly after JS updates */
.edivic-soft-enter {
    animation: edivicScaleIn 320ms var(--edivic-ease) both;
}

/* Respect users who disable motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.001ms !important;
    }

    .edivic-animate-ready {
        opacity: 1 !important;
        transform: none !important;
    }
}

.edivic-nav-scrolled {
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.10);
    backdrop-filter: blur(14px);
}
