/* Design tokens -- extracted from design-handoffs/asportal-public/design-guide/
   Portal_*.css (Figma CSS export). Single source of truth for colors/type/
   spacing shared across asportal-public templates (master-spec section 19.2).

   Every color/radius/letter-spacing value below was cross-checked against
   asportal-admin's already-shipped tokens.css (not just its own raw Figma
   export -- design-handoffs' CSS dumps have been unreliable before, see
   CLAUDE.md) and confirmed identical -- asportal-public reuses the same visual
   language, just with its own copy of the file (separate app/static root,
   nothing shared at import time). Where a Portal_*.css value genuinely
   differs from admin's (not just a coincidental dump inconsistency), it's
   called out explicitly in the component file that uses it, not here.

   Breakpoints (design-handoffs/asportal-public/design-guide/Portal_Resolution.css,
   confirmed against its own .png): PC >=1200px, Tablet <=1199px,
   Mobile <=767px. Unlike asportal-admin (one fixed 1240px floor, mobile support
   deliberately dropped app-wide, see admin's top.css) asportal-public has a real
   3-tier responsive system -- every base/*.css file below defines its own
   @media (max-width: 1199px) / (max-width: 767px) overrides where the guide
   shows one, rather than centralizing breakpoint values here (CSS custom
   properties can't be used inside an @media condition). */

body {
  margin: 0;
}

/* Component-specific hover/pressed/selected styles are the designed
   interaction states. Suppress browser-default focus chrome so it cannot
   introduce an unrelated platform-colored outline. Form controls that need
   focus feedback define their own border treatment in their component CSS. */
button:focus,
a:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus {
  outline: none;
}

:root {
  --font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, sans-serif;

  --color-text-primary: #101011;
  --color-text-secondary: #333333;
  --color-text-muted: #585E6A;
  --color-text-faint: #7D838E;
  --color-text-placeholder: #A5ABB4;
  --color-text-inverse: #FFFFFF;

  --color-border: #DDDFE2;
  --color-border-light: #F2F3F5;
  --color-border-strong: #CDD1D5;
  --color-surface: #FFFFFF;
  --color-surface-muted: #F2F3F5;
  --color-surface-hover: #EBEEF1;
  --color-nav-bg: #F9FAFB;

  --color-table-hover: #F9FAFB;
  --color-table-selected: #FFFCF4;

  --color-accent-blue: #0181E2;
  --color-accent-orange: #ED772F;
  --color-accent-orange-hover: #DA6D2B;
  --color-accent-error: #EA3C3C;

  --color-link: #0670BF;

  --color-button-primary-bg: #101011;
  --color-button-secondary-bg: #333333;

  /* Portal_Navigation.css/Portal_Search.css both show a lighter-toned
     sidebar border and chevron color than admin's equivalents
     (admin: border #F2F3F5 == --color-border-light, chevron inherits
     --color-text-muted #585E6A) -- flagged by the design-guide survey as
     possibly-unintentional Figma sampling drift, not an explicitly
     annotated "new token." Kept as real, separate values here rather than
     silently reusing admin's, since two independent guide files (Nav +
     Search) both show the same lighter tone -- if it turns out to be
     drift once a real screen PNG is available to pixel-check against,
     this is the one place to correct it. */
  --color-border-faint: #EBEEF1;
  --color-icon-chevron: #7D838E;

  /* Portal_Top.css -- the masthead is a dark bar (unlike admin's white
     .topbar), white text/icons on it, with its own hover fill distinct
     from --color-surface-muted (a light-mode-only token that would be
     invisible on a dark background). */
  --color-top-bg: #101011;
  --color-top-hover: rgba(255, 255, 255, 0.25);
  --color-top-divider: rgba(255, 255, 255, 0.25);

  /* Not a general design-system color -- login/login.css's own solid
     color-match for the status-bar/toolbar strips behind the login
     background photo, sampled directly as that photo's single most
     common pixel value (62%+ of the frame), not eyeballed or reused from
     anywhere else. Named here (not left as a bare hex literal in
     login.css) per this app's own convention: no raw color codes outside
     this file. */
  --color-login-bg: #080A13;

  /* Home screen (제품 소개, public-spec §3) -- APP Shields 제품군's 3 SDK
     product cards, one accent pair per product, sampled directly from
     the Zeplin export's own layer fills (design-handoffs/asportal-public/home/
     zeplin-raw/asset-guide.json's Box_Selected instances), not eyeballed. */
  --color-home-android-bg: #E5F3FF;
  --color-home-android-accent: #1395FF;
  --color-home-ios-bg: #ECEBFF;
  --color-home-ios-accent: #695AF0;
  --color-home-pureapp-bg: #E7F6F6;
  --color-home-pureapp-accent: #119781;
  --color-home-card-collapsed-bg: #F2F3F5;
  --color-home-feature-icon-hover-start: #FFE658;
  --color-home-feature-icon-hover-end: #FFCC00;
  --color-home-license-permanent-block: #FFE347;
  --color-home-license-annual-block: #585E6A;
  --color-home-cta-bg: #FFE100;
  --color-home-primary-button-active: #FFA802;

  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 1000px;

  --letter-spacing-tight: -0.02em;
}