/* KrawlX Logo System Styles */

/* Logo container base styles */
.krawlx-logo {
    display: inline-block;
    text-decoration: none;
    transition: all 0.3s ease;
    line-height: 0; /* Prevent extra spacing */
}

.krawlx-logo:hover {
    text-decoration: none;
}

/* Logo image styles */
.krawlx-logo-image {
    display: block;
    object-fit: contain;
    transition: transform 0.3s ease, filter 0.3s ease;
    filter: brightness(1) contrast(1);
    max-width: 100%;
    height: auto;
    border: none; /* Remove any default border */
    outline: none; /* Remove any default outline */
}

.krawlx-logo:hover .krawlx-logo-image {
    transform: scale(1.05);
    filter: brightness(1.1) contrast(1.1);
}

/* Size variations */
.krawlx-logo--small .krawlx-logo-image {
    width: 180px;
    height: 60px;
}

.krawlx-logo--default .krawlx-logo-image {
    width: 240px;
    height: 80px;
}

.krawlx-logo--large .krawlx-logo-image {
    width: 300px;
    height: 100px;
}

/* Layout variations - simplified for image-only logos */
.krawlx-logo--horizontal,
.krawlx-logo--vertical {
    display: inline-block;
}

/* Footer specific styling */
.krawlx-logo--footer {
    opacity: 0.9;
}

.krawlx-logo--footer:hover {
    opacity: 1;
}

/* Dark theme adjustments - simplified */
.dark .krawlx-logo-image {
    filter: brightness(1) contrast(1);
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .krawlx-logo--responsive.krawlx-logo--default .krawlx-logo-image {
        width: 180px;
        height: 60px;
    }
    
    .krawlx-logo--responsive.krawlx-logo--large .krawlx-logo-image {
        width: 240px;
        height: 80px;
    }
    
    .krawlx-logo--responsive.krawlx-logo--small .krawlx-logo-image {
        width: 150px;
        height: 50px;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .krawlx-logo-text {
        color: #ffffff;
    }
    
    .krawlx-logo-tagline {
        color: #94A3B8;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .krawlx-logo,
    .krawlx-logo-image,
    .krawlx-logo-text,
    .krawlx-logo-tagline {
        transition: none;
    }
    
    .krawlx-logo:hover .krawlx-logo-image {
        transform: none;
    }
}

/* Print styles */
@media print {
    .krawlx-logo-image {
        filter: grayscale(1) !important;
    }
}