/* ============================================================
   YOUpiter Design System — global entry point.
   Consumers link THIS file only. Import order matters:
   fonts → tokens → base.
   ============================================================ */
@import url('./tokens/fonts.css');
@import url('./tokens/colors.css');
@import url('./tokens/typography.css');
@import url('./tokens/spacing.css');
@import url('./tokens/effects.css');
@import url('./tokens/base.css');

/* Cookie consent is shared by the landing page and legal documents. */
.yp-cookie-consent {
  position: fixed;
  inset: auto 0 0;
  z-index: 10000;
  padding: 8px;
  background: rgba(245, 242, 234, 0.98);
  border-top: 1px solid rgba(36, 67, 78, 0.18);
}
.yp-cookie-consent[hidden],
.yp-cookie-settings-trigger[hidden] { display: none; }
.yp-cookie-card {
  width: min(920px, calc(100vw - 32px));
  margin: 0 auto;
  padding: 14px 18px;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 36px rgba(36, 67, 78, 0.16);
  color: #24434e;
  font: 14px/1.4 var(--font-text, system-ui, sans-serif);
}
.yp-cookie-card > strong { display: none; }
.yp-cookie-card p { margin: 0; color: #5b7178; }
.yp-cookie-card > a { display: none; color: #ff6600; }
.yp-cookie-options { display: grid; gap: 9px; margin: 12px 0; }
.yp-cookie-options[hidden] { display: none; }
.yp-cookie-options label { display: flex; align-items: center; gap: 9px; }
.yp-cookie-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.yp-cookie-actions button,
.yp-cookie-settings-trigger {
  border: 1px solid rgba(36, 67, 78, 0.24);
  border-radius: 999px;
  background: #fff;
  color: #24434e;
  padding: 8px 12px;
  font: 600 12px/1 var(--font-text, system-ui, sans-serif);
  cursor: pointer;
}
.yp-cookie-actions .primary { border-color: #ff6600; background: #ff6600; color: #fff; }
.yp-cookie-consent.is-settings {
  inset: 0;
  display: grid;
  place-items: center;
  background: rgba(24, 38, 43, 0.52);
}
.yp-cookie-consent.is-settings .yp-cookie-card { padding: 22px; }
.yp-cookie-consent.is-settings .yp-cookie-card > strong { display: block; font-size: 18px; }
.yp-cookie-consent.is-settings .yp-cookie-card p { margin: 8px 0 12px; }
.yp-cookie-consent.is-settings .yp-cookie-card > a { display: inline-block; margin-top: 12px; }
.yp-cookie-settings-trigger {
  position: fixed;
  left: 10px;
  bottom: 10px;
  z-index: 9998;
  padding: 7px 10px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 4px 16px rgba(36, 67, 78, 0.13);
}

@media (max-width: 640px) {
  .yp-cookie-card { width: calc(100vw - 20px); padding: 12px; }
  .yp-cookie-actions { display: grid; }
  .yp-cookie-actions button { width: 100%; }
}
