/* Base styles */
@import 'base/reset.css';

/* Components */
@import 'components/buttons.css';
@import 'components/forms.css';
@import 'components/history.css';
@import 'components/messages.css';

/* Layouts */
@import 'layouts/auth.css';
@import 'layouts/dashboard.css';
@import 'layouts/read.css';

/* HTMX Spinner */
.htmx-indicator {
    display: none;
}

.htmx-request .htmx-indicator {
    display: inline-block;
}

.spinner {
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top-color: white;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Global Responsive Fixes */
@media (max-width: 480px) {
    .container {
        width: 100%;
        padding: 0 15px;
    }
}

/* Fix for notch on iPhone X and newer */
@supports (padding: max(0px)) {
    body {
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
}