/*
 * OneAcademia theme tokens.
 * Values are taken 1:1 from the OneAcademia demo app (oneacademia.tech/demo). Every page links this
 * file first; the shell, component and page stylesheets build on these variables.
 */

:root {
  /* brand */
  --oa-orange: #F0541E;
  --oa-orange-light: #FF7A35;
  --oa-orange-dark: #EA4F11;
  --oa-ink: #141413;
  --oa-wood: #FFD5BF;
  --oa-deep: #C2410C;
  --oa-tint: #FFF0E8;
  --oa-ground: #E9ECF2;

  /* text */
  --oa-text: #1D1D1F;
  --oa-text-2: #3A3A3C;
  --oa-text-3: #6E6E73;
  --oa-text-4: #86868B;

  /* states */
  --oa-ok: #1E7B34;
  --oa-ok-t: #E6F6EA;
  --oa-warn: #B4540A;
  --oa-warn-t: #FFF1E6;
  --oa-info: #6E3DD6;
  --oa-info-t: #EDE7FB;
  --oa-bad: #B42318;
  --oa-bad-t: #FDECEA;
  --oa-line: rgba(0, 0, 0, .06);
  --oa-ease: cubic-bezier(.22, 1, .36, 1);

  /* form layout: one pill width so rows of fields line up in columns on every page */
  --oa-field-w: 280px;

  --oa-font: 'Geist', 'Noto Sans Bengali', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --oa-font-bn: 'Noto Sans Bengali', 'Geist', system-ui, sans-serif;
  --oa-font-brand: 'Outfit', 'Geist', system-ui, sans-serif;

  --oa-bg:
    radial-gradient(1100px 650px at 8% -10%, #FFE2D0 0%, rgba(255, 226, 208, 0) 58%),
    radial-gradient(900px 600px at 100% 15%, #DDE7FA 0%, rgba(221, 231, 250, 0) 58%),
    radial-gradient(900px 520px at 55% 115%, #FFF0E1 0%, rgba(255, 240, 225, 0) 58%);

  /* surfaces */
  --oa-card-bg: linear-gradient(180deg, rgba(255, 255, 255, .84), rgba(255, 255, 255, .62));
  --oa-card-border: rgba(255, 255, 255, .85);
  --oa-card-shadow: 0 10px 30px rgba(30, 30, 50, .08), inset 0 1px 0 rgba(255, 255, 255, .95);
  --oa-pri-grad: linear-gradient(180deg, #FF7A35, #EA4F11);
  --oa-pri-shadow: 0 8px 18px rgba(234, 79, 17, .3), inset 0 1px 0 rgba(255, 255, 255, .5);
}

html[lang="bn"] body { font-family: var(--oa-font-bn); }

/* Wordmark: "One" orange, "Academia" ink. Size comes from font-size. */
.oa-brand {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  font-family: var(--oa-font-brand);
  font-weight: 700;
  letter-spacing: -.015em;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
}

.oa-brand img, .oa-brand svg { width: 1.5em; height: 1.5em; flex: none; }
.oa-brand .oa-one { color: var(--oa-orange); }
.oa-brand .oa-acad { color: var(--oa-ink); }
.oa-brand:hover { text-decoration: none; }

/* Glass surface */
.oa-glass {
  background: var(--oa-card-bg);
  -webkit-backdrop-filter: blur(24px) saturate(160%);
  backdrop-filter: blur(24px) saturate(160%);
  border: 1px solid var(--oa-card-border);
  border-radius: 20px;
  box-shadow: var(--oa-card-shadow);
}

/* Buttons (demo: .pri and .ctl) */
.oa-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  font: 500 13px/1 var(--oa-font);
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: filter .15s, transform .15s, background .15s;
}

.oa-btn:hover { text-decoration: none; }
.oa-btn:active { transform: scale(.98); }

.oa-btn-primary {
  background: var(--oa-pri-grad);
  box-shadow: var(--oa-pri-shadow);
  color: #fff;
}
.oa-btn-primary:hover { color: #fff; filter: brightness(1.05); }
.oa-btn-primary[disabled] { opacity: .45; cursor: default; box-shadow: none; filter: none; transform: none; }

.oa-btn-ghost {
  background: rgba(255, 255, 255, .82);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .07), inset 0 1px 0 #fff;
  color: var(--oa-text);
}
.oa-btn-ghost:hover { color: var(--oa-text); background: #fff; }

.oa-btn.lg { height: 44px; padding: 0 22px; font-size: 14px; }
