/*
Theme Name: Mobihub Wordpress
Description: A minimal, mobile-first WordPress theme built with Tailwind CSS and Mapbox GL JS
Version: 1.0.0
Author: Voetgangersbeweging vzw
Text Domain: mobihub-theme
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 8.0
License: GPL v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Tags: mobile-first, responsive, minimal, tailwind, mapbox, multilingual

Mobihub Wordpress is distributed under the terms of the GNU GPL v2 or later.
*/

/* 
 * This file is required by WordPress but most styles are handled by Tailwind CSS.
 * Only custom CSS that can't be achieved with Tailwind utilities should be added here.
 */

/* WordPress Admin Bar Compatibility */
.admin-bar header {
    top: 32px;
}

@media screen and (max-width: 782px) {
    .admin-bar header {
        top: 46px;
    }
}

/* Custom animations */
.fade-in {
    animation: fadeIn 0.5s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Form field focus enhancement */
.form-field-focused {
    transform: scale(1.02);
    transition: transform 0.2s ease-in-out;
}

/* Prose styling improvements for editor content */
.prose img {
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
}

.prose blockquote {
    border-left: 4px solid #2563eb;
    background-color: #f8fafc;
    padding: 1rem 1.5rem;
    border-radius: 0 0.5rem 0.5rem 0;
}

/* Language switcher active state */
.language-switcher-active {
    background-color: #2563eb !important;
    color: white !important;
}

/* Skip link for accessibility */
.skip-link {
    position: absolute;
    top: -40px;
    left: 6px;
    background: #000;
    color: #fff;
    padding: 8px 16px;
    text-decoration: none;
    z-index: 100000;
    border-radius: 0 0 4px 4px;
}

.skip-link:focus {
    top: 6px;
}

/* Print styles */
@media print {

    .no-print,
    header,
    footer,
    .language-switcher,
    .mobile-menu-button {
        display: none !important;
    }

    body {
        font-size: 12pt;
        line-height: 1.4;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        page-break-after: avoid;
    }

    blockquote,
    pre,
    img {
        page-break-inside: avoid;
    }
}