/**
 * Ada Webapp - Shared Styles
 * Pro Minimal Design System
 */

@import "./components/buttons.css";
@import "./components/badges.css";
@import "./components/icon-tiles.css";
@import "./components/modals.css";
@import "./components/toasts.css";
@import "./components/tooltips.css";
@import "./components/forms.css";
@import "./components/tables.css";
@import "./components/reports.css";
@import "./components/analytics.css";
@import "./components/metrics.css";
@import "./components/filters.css";
@import "./components/navigation.css";
@import "./components/pagination.css";
@import "./components/cards.css";
@import "./components/avatars.css";
@import "./components/progress.css";
@import "./components/empty-states.css";
@import "./components/charts.css";
@import "./components/tabs.css";
@import "./components/headers.css";
@import "./components/layout-helpers.css";
@import "./components/utilities.css";
@import "./components/shell.css";
@import "./components/responsive.css";
@import "./components/menus.css";
@import "./components/toolbar.css";
@import "./components/settings.css";
@import "./components/lists.css";
@import "./components/playlists.css";
@import "./components/integrations.css";
@import "./components/dashboard.css";
@import "./components/surveys.css";
@import "./components/questions.css";
@import "./components/recipients.css";
@import "./components/profile.css";
@import "./components/game.css";
@import "./components/invites.css";
@import "./components/billing.css";
@import "./components/groups.css";
@import "./components/courses.css";
@import "./components/setup.css";
@import "./components/auth.css";
@import "./components/onboarding.css";
@import "./components/verify.css";
@import "./components/certifications.css";
@import "./components/celebration.css";
@import "./components/skills.css";
@import "./tokens/palette.css";
@import "./tokens/colors.css";
@import "./tokens/typography.css";
@import "./tokens/spacing.css";

/* Component modules live in ./components. components/console.css is the one not imported here:
   The operator console's layout links it after this file (OperatorConsoleLayout.cs). */
/* Design tokens live in ./tokens */

/* ========================================
   RESET & BASE
   ======================================== */
* { box-sizing: border-box; margin: 0; padding: 0; }

/* Pages hide things with the hidden attribute; a component's own display (flex, grid) must not
   bring them back. */
[hidden] { display: none !important; }

body {
    font-family: var(--font-family);
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-primary);
    background: var(--bg-page);
    -webkit-font-smoothing: antialiased;
    /* No --sidebar-width here. Its default lives on :root (tokens/spacing.css) and the
       responsive and preference rules set it on body. This rule comes after every @import, so
       a declaration here beat responsive.css's medium-width `body { collapsed }` at equal
       specificity: the sidebar hid its labels but kept the expanded width (#9/#33). */
}

/* A link with no component class of its own would otherwise take the browser's
   #0000ee: "Make it personal instead", "Back to Help & Support" and others did.
   Standalone links ("View all", "Manage") read like the design system's action links;
   a link inside running text stays underlined so colour is not its only cue. A link that is a
   button (.ada-btn) keeps its button's colours under the pointer: this hover once turned a
   primary link-button's text the colour of its own hover background. :where() keeps the
   hover's specificity what it was, so a component's own link hover still wins. */
a { color: var(--accent); text-decoration: none; }
a:where(:not(.ada-btn)):hover { color: var(--accent-hover); text-decoration: underline; }
p a, li a { text-decoration: underline; }