/* ==========================================================================
   MabunCrib — Main stylesheet
   File: css/main.css
   Load order is authoritative. Do not reorder.
   Responsive.css is loaded separately in every HTML page (after main.css).
   ========================================================================== */

/* -------------------------------------------------------------------------
   1. Core tokens & foundations
   ------------------------------------------------------------------------- */
@import url("./core/variables.css");
@import url("./core/reset.css");
@import url("./core/typography.css");
@import url("./core/accessibility.css");

/* -------------------------------------------------------------------------
   2. Reusable component primitives
   ------------------------------------------------------------------------- */
@import url("./components/buttons.css");
@import url("./components/forms.css");
@import url("./components/badges.css");
@import url("./components/alerts.css");
@import url("./components/loading.css");
@import url("./components/cards.css");
@import url("./components/avatar.css");
@import url("./components/status.css");
@import url("./components/empty-state.css");
@import url("./components/pagination.css");
@import url("./components/breadcrumbs.css");
@import url("./components/tables.css");
@import url("./components/header.css");
@import url("./components/footer.css");
@import url("./components/sidebar.css");
@import url("./components/navigation.css");
@import url("./components/mobile-nav.css");
@import url("./components/modals.css");
@import url("./components/dropdown.css");
@import url("./components/toast.css");
@import url("./components/tabs.css");
@import url("./components/upload.css");
@import url("./components/search.css");
@import url("./components/filters.css");
@import url("./components/organization.css");
@import url("./components/analytics.css");

/* -------------------------------------------------------------------------
   3. Page composition (each page owns one file)
   ------------------------------------------------------------------------- */
@import url("./pages/home.css");
@import url("./pages/auth.css");
@import url("./pages/dashboard.css");
@import url("./pages/tasks.css");
@import url("./pages/services.css");
@import url("./pages/jobs.css");
@import url("./pages/profile.css");
@import url("./pages/messages.css");
@import url("./pages/subscription.css");
@import url("./pages/organization.css");
@import url("./pages/business-analytics.css");
@import url("./pages/admin.css");
@import url("./pages/legal.css");
@import url("./pages/notfound.css");

/* -------------------------------------------------------------------------
   4. Global layout primitives used across pages
   ------------------------------------------------------------------------- */

#app-layout {
  display: block;
}

.container {
  width: 100%;
  max-width: var(--content-max);
  margin-inline: auto;
  padding-inline: var(--space-4);
}

.container-narrow {
  max-width: var(--content-narrow);
  margin-inline: auto;
  padding-inline: var(--space-4);
}

.container-wide {
  max-width: var(--content-wide);
  margin-inline: auto;
  padding-inline: var(--space-4);
}

#main-content {
  min-height: calc(100vh - var(--header-height));
  min-height: calc(100dvh - var(--header-height));
  display: block;
}

/* -------------------------------------------------------------------------
   5. Reduced motion safety net
   ------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .container,
  .container-narrow,
  .container-wide {
    transition: none;
  }
}

/* -------------------------------------------------------------------------
   6. Utility: force hide
   ------------------------------------------------------------------------- */

[hidden] {
  display: none !important;
}