/**
 * MAIN STYLESHEET
 * Combines all CSS for the Paleophilatelie.eu website
 *
 * This file imports all necessary stylesheets in the correct order.
 * For production, consider compiling these into a single minified file.
 */

/* ===== GOOGLE FONTS ===== */
@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,500;0,600;0,700;1,400&family=DM+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

/* ===== DESIGN SYSTEM ===== */
@import 'variables.css';

/* ===== BASE STYLES ===== */
@import 'base.css';

/* ===== COMPONENT STYLES ===== */
@import '../components/header/header.css';
@import '../components/footer/footer.css';
/* @import '../components/navigation/navigation.css'; */
@import '../components/gallery/gallery.css';
/* @import '../components/card/card.css'; */
@import 'components/stamp-cards.css';
@import 'components/books-grid.css';
@import 'components/prev-next-nav.css';
@import 'components/callout-box.css';
@import 'components/content-section.css';
@import 'components/references.css';
@import 'components/toc.css';
@import 'components/az-nav.css';
@import 'components/decades-browser.css';
@import 'components/page-hero.css';
@import 'components/fb-promo.css';
@import 'components/breadcrumb.css';
@import 'components/toc-fab.css';
@import 'components/index-letter-headers.css';
@import 'components/section-page-base.css';

/* ===== COMMON PAGE STYLES ===== */
@import 'pages/common-style.css';

/* ===== PAGE-SPECIFIC STYLES ===== */
/*
 * Page-specific styles are loaded separately via link tags in each page.
 * Available page styles:
 * - pages/homepage.css - Homepage styles (Sprint 6)
 * - pages/country.css - Country page styles (Sprint 7)
 * - pages/catalogue.css - Catalogue page styles (pending)
 */

/* ===== GLOBAL STYLES ===== */

/* Print Styles */
@media print {
    .site-header,
    .site-footer,
    .navigation,
    .search-box,
    .btn {
        display: none !important;
    }

    body {
        font-size: 12pt;
        line-height: 1.4;
    }

    a {
        color: inherit;
        text-decoration: underline;
    }

    .container {
        max-width: 100%;
        padding: 0;
    }
}