/* Presago Design System — Primitives
 * Box, Flex, Stack, Inline, Text, Link, Span, Image
 * API modellata su Mantine (Box/Flex/Stack/Group/Text/Anchor).
 * Props esposte come data-* per uso vanilla HTML. */

/* ─── Box ─────────────────────────────────────────────
 * Contenitore generico. Tutte le primitive ereditano da qui.
 * Mantine: <Box> — polymorphic container. */
.presago-box {
  display: block;
  box-sizing: border-box;
  min-width: 0;
}

/* ─── Flex ────────────────────────────────────────────
 * Flexbox con gap/direction/align/justify/wrap.
 * Mantine: <Flex gap direction align justify wrap>. */
.presago-flex {
  display: flex;
  box-sizing: border-box;
  min-width: 0;
}

.presago-flex[data-direction="row"] { flex-direction: row; }
.presago-flex[data-direction="column"] { flex-direction: column; }
.presago-flex[data-direction="row-reverse"] { flex-direction: row-reverse; }
.presago-flex[data-direction="column-reverse"] { flex-direction: column-reverse; }

.presago-flex[data-wrap="wrap"] { flex-wrap: wrap; }
.presago-flex[data-wrap="nowrap"] { flex-wrap: nowrap; }

.presago-flex[data-align="start"] { align-items: flex-start; }
.presago-flex[data-align="center"] { align-items: center; }
.presago-flex[data-align="end"] { align-items: flex-end; }
.presago-flex[data-align="stretch"] { align-items: stretch; }
.presago-flex[data-align="baseline"] { align-items: baseline; }

.presago-flex[data-justify="start"] { justify-content: flex-start; }
.presago-flex[data-justify="center"] { justify-content: center; }
.presago-flex[data-justify="end"] { justify-content: flex-end; }
.presago-flex[data-justify="between"] { justify-content: space-between; }
.presago-flex[data-justify="around"] { justify-content: space-around; }
.presago-flex[data-justify="evenly"] { justify-content: space-evenly; }

.presago-flex[data-gap="xs"] { gap: var(--presago-spacing-100); }
.presago-flex[data-gap="sm"] { gap: var(--presago-spacing-150); }
.presago-flex[data-gap="md"] { gap: var(--presago-spacing-200); }
.presago-flex[data-gap="lg"] { gap: var(--presago-spacing-300); }
.presago-flex[data-gap="xl"] { gap: var(--presago-spacing-400); }

/* ─── Stack ───────────────────────────────────────────
 * Flex verticale. Mantine: <Stack> (== Flex direction=column). */
.presago-stack {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  min-width: 0;
}

.presago-stack[data-align="start"] { align-items: flex-start; }
.presago-stack[data-align="center"] { align-items: center; }
.presago-stack[data-align="end"] { align-items: flex-end; }
.presago-stack[data-align="stretch"] { align-items: stretch; }

.presago-stack[data-gap="xs"] { gap: var(--presago-spacing-100); }
.presago-stack[data-gap="sm"] { gap: var(--presago-spacing-150); }
.presago-stack[data-gap="md"] { gap: var(--presago-spacing-200); }
.presago-stack[data-gap="lg"] { gap: var(--presago-spacing-300); }
.presago-stack[data-gap="xl"] { gap: var(--presago-spacing-400); }

/* ─── Inline ──────────────────────────────────────────
 * Flex orizzontale. Mantine: <Group> (horizontal flex). */
.presago-inline {
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
  min-width: 0;
}

.presago-inline[data-wrap="wrap"] { flex-wrap: wrap; }

.presago-inline[data-align="start"] { align-items: flex-start; }
.presago-inline[data-align="center"] { align-items: center; }
.presago-inline[data-align="end"] { align-items: flex-end; }
.presago-inline[data-align="baseline"] { align-items: baseline; }

.presago-inline[data-justify="start"] { justify-content: flex-start; }
.presago-inline[data-justify="center"] { justify-content: center; }
.presago-inline[data-justify="end"] { justify-content: flex-end; }
.presago-inline[data-justify="between"] { justify-content: space-between; }

.presago-inline[data-gap="xs"] { gap: var(--presago-spacing-100); }
.presago-inline[data-gap="sm"] { gap: var(--presago-spacing-150); }
.presago-inline[data-gap="md"] { gap: var(--presago-spacing-200); }
.presago-inline[data-gap="lg"] { gap: var(--presago-spacing-300); }
.presago-inline[data-gap="xl"] { gap: var(--presago-spacing-400); }

/* ─── Text ────────────────────────────────────────────
 * Testo body. Mantine: <Text> con size/fw/c/truncate/lineClamp/ta. */
.presago-text {
  display: block;
  margin: 0;
  color: var(--presago-color-text-default);
  font-family: var(--presago-font-family-body);
  font-size: var(--presago-font-size-body-md);
  font-weight: var(--presago-font-weight-regular);
  line-height: var(--presago-line-height-md);
}

.presago-text[data-size="xs"] { font-size: var(--presago-font-size-body-xs); line-height: var(--presago-line-height-sm); }
.presago-text[data-size="sm"] { font-size: var(--presago-font-size-body-sm); line-height: var(--presago-line-height-sm); }
.presago-text[data-size="md"] { font-size: var(--presago-font-size-body-md); line-height: var(--presago-line-height-md); }
.presago-text[data-size="lg"] { font-size: var(--presago-font-size-body-lg); line-height: var(--presago-line-height-lg); }
.presago-text[data-size="xl"] { font-size: var(--presago-font-size-body-xl); line-height: var(--presago-line-height-lg); }

.presago-text[data-fw="light"] { font-weight: var(--presago-font-weight-light); }
.presago-text[data-fw="regular"] { font-weight: var(--presago-font-weight-regular); }
.presago-text[data-fw="medium"] { font-weight: var(--presago-font-weight-medium); }
.presago-text[data-fw="semibold"] { font-weight: var(--presago-font-weight-semibold); }
.presago-text[data-fw="bold"] { font-weight: var(--presago-font-weight-bold); }

.presago-text[data-color="subtle"] { color: var(--presago-color-text-subtle); }
.presago-text[data-color="disabled"] { color: var(--presago-color-text-disabled); }
.presago-text[data-color="selected"] { color: var(--presago-color-text-selected); }
.presago-text[data-color="brand"] { color: var(--presago-color-text-brand); }
.presago-text[data-color="success"] { color: var(--presago-color-text-success); }
.presago-text[data-color="warning"] { color: var(--presago-color-text-warning); }
.presago-text[data-color="danger"] { color: var(--presago-color-text-danger); }
.presago-text[data-color="info"] { color: var(--presago-color-text-info); }

.presago-text[data-align="start"] { text-align: start; }
.presago-text[data-align="center"] { text-align: center; }
.presago-text[data-align="end"] { text-align: end; }

.presago-text[data-truncate="true"] {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ─── Link ────────────────────────────────────────────
 * Mantine: <Anchor>. Colore link + underline, stati completi. */
.presago-link {
  color: var(--presago-color-link-idle);
  text-decoration: underline;
  text-underline-offset: 0.2em;
  background-color: transparent;
  transition: color var(--presago-motion-duration-fast) var(--presago-motion-easing-standard);
}

.presago-link:visited {
  color: var(--presago-color-link-visited);
}

.presago-link:hover {
  color: var(--presago-color-link-hover);
}

.presago-link:active {
  color: var(--presago-color-link-pressed);
}

.presago-link:visited:active {
  color: var(--presago-color-link-visited-pressed);
}

.presago-link[data-underline="hover"] {
  text-decoration: none;
}

.presago-link[data-underline="hover"]:hover,
.presago-link[data-underline="hover"]:focus-visible {
  text-decoration: underline;
}

/* ─── Span ────────────────────────────────────────────
 * Testo inline. No block default. */
.presago-span {
  display: inline;
  color: inherit;
  font: inherit;
}

.presago-span[data-color="subtle"] { color: var(--presago-color-text-subtle); }
.presago-span[data-color="brand"] { color: var(--presago-color-text-brand); }
.presago-span[data-color="success"] { color: var(--presago-color-text-success); }
.presago-span[data-color="warning"] { color: var(--presago-color-text-warning); }
.presago-span[data-color="danger"] { color: var(--presago-color-text-danger); }
.presago-span[data-color="info"] { color: var(--presago-color-text-info); }

.presago-span[data-fw="medium"] { font-weight: var(--presago-font-weight-medium); }
.presago-span[data-fw="semibold"] { font-weight: var(--presago-font-weight-semibold); }
.presago-span[data-fw="bold"] { font-weight: var(--presago-font-weight-bold); }

/* ─── Image ───────────────────────────────────────────
 * Mantine: <Image>. Responsive, fit configurabile. */
.presago-image {
  display: block;
  max-width: 100%;
  height: auto;
  border-radius: var(--presago-radius-none);
}

.presago-image[data-fit="cover"] { object-fit: cover; }
.presago-image[data-fit="contain"] { object-fit: contain; }
.presago-image[data-fit="fill"] { object-fit: fill; }

.presago-image[data-radius="xs"] { border-radius: var(--presago-radius-xs); }
.presago-image[data-radius="sm"] { border-radius: var(--presago-radius-sm); }
.presago-image[data-radius="md"] { border-radius: var(--presago-radius-md); }
.presago-image[data-radius="lg"] { border-radius: var(--presago-radius-lg); }
.presago-image[data-radius="xl"] { border-radius: var(--presago-radius-xl); }
.presago-image[data-radius="full"] { border-radius: var(--presago-radius-full); }
