/* Local POJ Fonts (Self-hosted for complete character support) */
@font-face {
  font-family: 'Charis';
  src: url('/fonts/Charis-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Charis';
  src: url('/fonts/Charis-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Charis';
  src: url('/fonts/Charis-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Charis';
  src: url('/fonts/Charis-Italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'TauhuOo';
  src: url('/fonts/TauhuOo20.05-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'SourceSans3';
  src: url('/fonts/SourceSans3VF-Upright.ttf.woff2') format('woff2');
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'SourceSans3';
  src: url('/fonts/SourceSans3VF-Italic.ttf.woff2') format('woff2');
  font-weight: 200 900;
  font-style: italic;
  font-display: swap;
}

body {
  font-family: var(--font-body);
  /* Lāi-bûn ēng Sans */
  color: var(--text-main);

  background: var(--bg-page);
  background-attachment: fixed;
  /* kò͘-tēng pōe-kéng ōe-bīn */
  background-repeat: no-repeat;
  background-size: cover;

  /* Fonts */
  /* Châi-ēng "Charis" tùi POJ hián-sī khah hó (Self-hosted) */
  --font-body: "TauhuOo", "SourceSans3", "Inter", "Noto Sans TC", system-ui, sans-serif;
  --font-heading: "Charis", "Noto Serif TC", serif;
  --font-ui: "TauhuOo", "SourceSans3", "Inter", "Noto Sans TC", sans-serif;
  --font-mono: "Menlo", monospace;

  /* POJ Opentype Settings to fix diacritics */
  font-feature-settings: "cv01", "ss01";
  -webkit-font-smoothing: antialiased;

  /* Ta̍k chōa lī khah hn̄g */
  font-size: calc(1rem * var(--font-scale));

  /* Sticky Footer */
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

h1,
h2,
h3 {
  line-height: 1.3;
}

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

/* ---------------------------------------------------
    Screen-reader only link (for accessibility)
    Bô-chiòng-gāi-tàng siat-tēng (WCAG 2.2). Hong-piān keyboard(Tab)/ JAWS/NVDA téng-téng ê iōng-hō͘
-----------------------------------------------------*/
.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.sr-only:focus,
.sr-only:active {
  position: static !important;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

/* Utility: Hidden */
.hidden {
  display: none !important;
}

/* Auth Visibility Utilities 
   Relies on 'is-auth' class on body managed by account.js 
*/
body.is-auth .login-only {
  display: none !important;
}

body:not(.is-auth) .auth-only {
  display: none !important;
}