/**
 * NextKey SDA Styles
 * Version: 3.0.0
 */

/* Reset and Base Styles */
.nextkey-sda-app * {
    box-sizing: border-box;
}

.nextkey-sda-app {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #333;
    line-height: 1.6;
}

/* Override WordPress admin bar */
.nextkey-sda-app {
    margin-top: 0 !important;
}

/* Navigation Styles */
.nextkey-nav a:hover {
    opacity: 0.8;
}

.nextkey-nav .mobile-menu-btn:hover {
    opacity: 0.8;
}

/* Button Hover Effects */
.nextkey-sda-app button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 25px rgba(0,0,0,0.15) !important;
}

.nextkey-sda-app button:active {
    transform: translateY(0);
}

/* Card Hover Effects */
.nextkey-sda-app [style*="box-shadow"]:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(0,0,0,0.12) !important;
}

/* Link Hover Effects */
.nextkey-sda-app a:hover {
    opacity: 0.8;
}

/* Form Input Focus */
.nextkey-sda-app input:focus,
.nextkey-sda-app textarea:focus,
.nextkey-sda-app select:focus {
    outline: none;
    border-color: #1a5490 !important;
    box-shadow: 0 0 0 3px rgba(26, 84, 144, 0.1);
}

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* Loading Animation */
@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

.nextkey-sda-app .loading {
    animation: pulse 1.5s ease-in-out infinite;
}

/* Mobile Responsive Utilities */
@media (max-width: 768px) {
    .nextkey-nav .desktop-menu {
        display: none !important;
    }
    
    .nextkey-nav .mobile-menu-btn {
        display: block !important;
    }
    
    .nextkey-sda-app h1 {
        font-size: 2rem !important;
    }
    
    .nextkey-sda-app h2 {
        font-size: 1.75rem !important;
    }
    
    .nextkey-sda-app [style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
    }
}

@media (min-width: 769px) {
    .nextkey-nav .mobile-menu-btn {
        display: none !important;
    }
}

/* Print Styles */
@media print {
    .nextkey-nav,
    footer {
        display: none;
    }
}

/* Accessibility */
.nextkey-sda-app *:focus-visible {
    outline: 2px solid #1a5490;
    outline-offset: 2px;
}

/* Image Optimization */
.nextkey-sda-app img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Prevent Layout Shift */
.nextkey-sda-app img[style*="height"] {
    width: 100%;
    object-fit: cover;
}

/* Utility Classes */
.nextkey-sda-app .container {
    width: 100%;
    padding-right: 2rem;
    padding-left: 2rem;
}

@media (max-width: 640px) {
    .nextkey-sda-app .container {
        padding-right: 1rem;
        padding-left: 1rem;
    }
}

/* Animation Classes */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.nextkey-sda-app .fade-in {
    animation: fadeIn 0.6s ease-out;
}

/* Fix for WordPress theme conflicts */
.nextkey-sda-app p {
    margin: 0;
}

.nextkey-sda-app ul {
    margin: 0;
    padding: 0;
}

.nextkey-sda-app a {
    color: inherit;
}

/* Override Twenty Twenty-Four theme if active */
.wp-site-blocks .nextkey-sda-app {
    padding: 0 !important;
    max-width: none !important;
}

/* Ensure full width */
#nextkey-sda-root {
    width: 100%;
    margin: 0;
    padding: 0;
}

/* Fix for block themes */
.wp-block-group.has-global-padding > #nextkey-sda-root {
    margin-left: calc(var(--wp--style--root--padding-left) * -1);
    margin-right: calc(var(--wp--style--root--padding-right) * -1);
}
