/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* ==========================================================================
   CSS Architecture - Organized by ITCSS methodology
   ========================================================================== */

/* 1. Theme Variables & Settings
   ========================================================================== */
/*= require theme/variables */
/*= require theme/semantic */

/* 2. Base & Reset Styles
   ========================================================================== */
/*= require base/reset */
/*= require base/typography */
/*= require base/focus */
/*= require base/layout */
/*= require html */
/*= require body */

/* 3. Animations & Utilities
   ========================================================================== */
/*= require theme/animations */

/* 4. Components
   ========================================================================== */
/*= require components/tabs */
/*= require components/cards */
/*= require components/modal */
/*= require header */
/*= require footer */
/*= require sidebar/base */
/*= require toasts/base */
/*= require toasts/alert */
/*= require toasts/error */
/*= require toasts/info */
/*= require toasts/notice */
/*= require toasts/success */
/*= require toasts/warning */

/* 5. Button System
   ========================================================================== */
/*= require buttons/base */
/*= require buttons/accept */
/*= require buttons/reject */
/*= require buttons/default */
/*= require buttons/special */
/*= require buttons/icon */

/* 6. Forms & Interactive Elements
   ========================================================================== */
/*= require forms/base */
/*= require inputs/base */
/*= require labels/base */
/*= require selects/base */
/*= require textarea/base */

/* 7. Utilities
   ========================================================================== */
/*= require utilities/index */

/* 8. Application-Specific Styles
   ========================================================================== */
@font-face {
    font-family: 'Readex Pro';
    src: url("/assets/Readexpro[HEXP,wght]-a591a180.ttf") format('truetype');
    font-weight: 200 700;
    font-style: normal italic;
    font-display: swap;
}

/* Form demo component - should be moved to components if used widely */
.form-controls-demo {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
    max-width: 500px;
}

/* Add any application-specific styles here that don't fit into the above categories */