/* ============================================================
   Apple International - Animations CSS
   ============================================================ */

/* Fade In Up */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Fade In Down */
@keyframes fadeInDown {
    from { opacity: 0; transform: translateY(-30px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Fade In Left */
@keyframes fadeInLeft {
    from { opacity: 0; transform: translateX(-40px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Fade In Right */
@keyframes fadeInRight {
    from { opacity: 0; transform: translateX(40px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Zoom In */
@keyframes zoomIn {
    from { opacity: 0; transform: scale(0.85); }
    to   { opacity: 1; transform: scale(1); }
}

/* Hero animations */
.hero-anim-1 { animation: fadeInLeft 0.8s ease forwards; }
.hero-anim-2 { animation: fadeInLeft 0.8s 0.15s ease both; }
.hero-anim-3 { animation: fadeInLeft 0.8s 0.3s ease both; }
.hero-anim-4 { animation: fadeInLeft 0.8s 0.45s ease both; }
.hero-anim-right { animation: fadeInRight 0.9s 0.2s ease both; }

/* Floating animation */
@keyframes float {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-10px); }
}

.float-anim { animation: float 4s ease-in-out infinite; }

/* Pulse */
@keyframes pulseSoft {
    0%, 100% { box-shadow: 0 0 0 0 rgba(214,40,40,0.3); }
    50%       { box-shadow: 0 0 0 12px rgba(214,40,40,0); }
}

.pulse-anim { animation: pulseSoft 2.5s ease infinite; }

/* Shimmer */
@keyframes shimmer {
    0%   { background-position: -200% 0; }
    100% { background-position: 200% 0; }
}

.shimmer {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

/* Truck road animation */
@keyframes truckRoll {
    0%   { transform: translateX(-120px); opacity: 0; }
    10%  { opacity: 1; }
    90%  { opacity: 1; }
    100% { transform: translateX(120px); opacity: 0; }
}

/* Typing cursor */
@keyframes blink {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0; }
}

.typing-cursor {
    display: inline-block;
    width: 2px;
    height: 1em;
    background: currentColor;
    margin-left: 2px;
    vertical-align: text-bottom;
    animation: blink 1s step-end infinite;
}

/* Number counter animation */
.counter-number { transition: all 0.3s ease; }

/* Card hover effects */
.card-hover-lift {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-hover-lift:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(11,61,145,0.15);
}

/* Loading dots */
@keyframes dotBounce {
    0%, 80%, 100% { transform: scale(0); }
    40%           { transform: scale(1); }
}

.loading-dots span {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--navy, #0B3D91);
    animation: dotBounce 1.4s infinite ease-in-out both;
    margin: 0 3px;
}

.loading-dots span:nth-child(1) { animation-delay: -0.32s; }
.loading-dots span:nth-child(2) { animation-delay: -0.16s; }
.loading-dots span:nth-child(3) { animation-delay: 0s; }

/* Page entrance */
.page-enter {
    animation: fadeInUp 0.5s ease forwards;
}

/* Stagger children */
.stagger-children > * {
    opacity: 0;
    animation: fadeInUp 0.5s ease forwards;
}

.stagger-children > *:nth-child(1) { animation-delay: 0.05s; }
.stagger-children > *:nth-child(2) { animation-delay: 0.1s; }
.stagger-children > *:nth-child(3) { animation-delay: 0.15s; }
.stagger-children > *:nth-child(4) { animation-delay: 0.2s; }
.stagger-children > *:nth-child(5) { animation-delay: 0.25s; }
.stagger-children > *:nth-child(6) { animation-delay: 0.3s; }

/* Reduced motion override */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Admin panel animations */
.admin-sidebar-item {
    transition: all 0.2s ease;
}

.admin-sidebar-item:hover {
    transform: translateX(4px);
}

/* Status badge pulse */
.status-live {
    position: relative;
}

.status-live::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -14px;
    transform: translateY(-50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #22c55e;
    animation: pulseSoft 2s infinite;
}

/* Progress bar animation */
@keyframes progressFill {
    from { width: 0; }
    to   { width: var(--target-width, 100%); }
}

.progress-animated .progress-bar {
    animation: progressFill 1.2s ease forwards;
}
