@inntechcorp/it-design 4.0.0-beta.2 → 4.0.0-beta.4

package/dist/css/button.css

@@ -1,380 +1,9 @@
-/* ================================= */
-/* BUTTON COMPONENT STYLES           */
-/* ================================= */
-@layer components {
-
-  /* ===== BASE ===== */
-  .itd-button {
-    position: relative;
-    cursor: pointer;
-    -webkit-user-select: none;
-    user-select: none;
-    box-sizing: border-box;
-    background: none;
-    border: 1px solid transparent;
-    outline: 0 solid transparent;
-    outline-offset: var(--itd-ring-offset);
-    transition:
-      outline 100ms linear,
-      border var(--itd-transition-duration) var(--itd-transition-timing-function),
-      background-color var(--itd-transition-duration) var(--itd-transition-timing-function);
-
-    & span,
-    & svg {
-      transition-property: color;
-      transition-duration: var(--itd-transition-duration);
-      transition-timing-function: var(--itd-transition-timing-function);
-    }
-
-    & svg {
-      flex-shrink: 0;
-      pointer-events: none;
-    }
-
-    & svg:not([class*='size-']):not(.itd-spinner) {
-      width: var(--itd-size-df-icon);
-      height: var(--itd-size-df-icon);
-    }
-
-    & .itd-button-content {
-      display: inline-flex;
-      align-items: center;
-      gap: inherit;
-    }
-  }
-
-  /* ===== SIZES (icon sizing from tokens) ===== */
-  .itd-button.itd-button-xs {
-    & svg:not([class*='size-']):not(.itd-spinner) {
-      width: var(--itd-size-xs-icon);
-      height: var(--itd-size-xs-icon);
-    }
-  }
-
-  .itd-button.itd-button-sm {
-    & svg:not([class*='size-']):not(.itd-spinner) {
-      width: var(--itd-size-sm-icon);
-      height: var(--itd-size-sm-icon);
-    }
-  }
-
-  .itd-button.itd-button-md,
-  .itd-button.itd-button-icon-sm,
-  .itd-button.itd-button-icon {
-    & svg:not([class*='size-']):not(.itd-spinner) {
-      width: var(--itd-size-md-icon);
-      height: var(--itd-size-md-icon);
-    }
-  }
-
-  .itd-button.itd-button-lg,
-  .itd-button.itd-button-icon-lg {
-    & svg:not([class*='size-']):not(.itd-spinner) {
-      width: var(--itd-size-lg-icon);
-      height: var(--itd-size-lg-icon);
-    }
-  }
-
-  .itd-button.itd-button-xlg {
-    & svg:not([class*='size-']):not(.itd-spinner) {
-      width: var(--itd-size-xlg-icon);
-      height: var(--itd-size-xlg-icon);
-    }
-  }
-
-  /* ===== DEFAULT VARIANT ===== */
-  .itd-button.itd-button-default {
-    box-shadow: var(--itd-box-shadow);
-    background-color: var(--itd-primary);
-    border: 1px solid transparent;
-    color: var(--itd-primary-foreground);
-
-    & svg { color: var(--itd-primary-foreground); }
-
-    &:hover, &.active { background-color: var(--itd-primary-hover); }
-
-    &[disabled] {
-      background-color: var(--itd-color-disabled-bg);
-      border: 1px solid var(--itd-color-disabled-border);
-      box-shadow: none;
-      color: var(--itd-color-disabled-text);
-      & svg { color: var(--itd-color-disabled-text); }
-    }
-  }
-
-  /* ===== GHOST VARIANT ===== */
-  .itd-button.itd-button-ghost {
-    background-color: transparent;
-    border: 1px solid transparent;
-
-    & span, & div.icon svg { color: var(--itd-color-text); }
-
-    &:hover, &.active {
-      background-color: var(--itd-color-button-ghost-hover-bg);
-      color: var(--itd-accent-foreground);
-      & svg { color: var(--itd-accent-foreground); }
-    }
-
-    &[disabled] {
-      background-color: var(--itd-color-disabled-bg);
-      border: 1px solid var(--itd-color-disabled-border);
-      color: var(--itd-color-disabled-text);
-      & svg { color: var(--itd-color-disabled-text); }
-    }
-  }
-
-  /* ===== SOLID VARIANT ===== */
-  .itd-button.itd-button-solid {
-    background-color: var(--itd-color-background-alt-hover);
-    border: 1px solid transparent;
-    box-shadow: none;
-    color: var(--itd-secondary-foreground);
-
-    & svg { color: var(--itd-secondary-foreground); }
-
-    &:hover, &.active {
-      background-color: var(--itd-secondary-hover);
-      color: var(--itd-primary);
-      & svg { color: var(--itd-primary); }
-    }
-
-    &[disabled] {
-      background-color: var(--itd-color-disabled-bg);
-      border: 1px solid var(--itd-color-disabled-border);
-      color: var(--itd-color-disabled-text);
-      & svg { color: var(--itd-color-disabled-text); }
-    }
-  }
-
-  /* ===== FILLED VARIANT ===== */
-  .itd-button.itd-button-filled {
-    background-color: var(--itd-color-button-filled-bg);
-    border: 1px solid transparent;
-    color: var(--itd-primary);
-
-    & svg { color: var(--itd-primary); }
-
-    &:hover, &.active {
-      background-color: var(--itd-primary);
-      color: var(--itd-primary-foreground);
-      & svg { color: var(--itd-primary-foreground); }
-    }
-
-    &[disabled] {
-      background-color: var(--itd-color-disabled-bg);
-      border: 1px solid var(--itd-color-disabled-border);
-      box-shadow: none;
-      color: var(--itd-color-disabled-text);
-      & svg { color: var(--itd-color-disabled-text); }
-    }
-  }
-
-  /* ===== OUTLINE VARIANT ===== */
-  .itd-button.itd-button-outline {
-    box-shadow: var(--itd-box-shadow);
-    border: 1px solid var(--itd-color-border);
-    background-color: var(--itd-color-button-outline-bg);
-    color: var(--itd-color-text);
-
-    & svg { color: var(--itd-color-text); }
-
-    &:hover, &.active {
-      background-color: var(--itd-color-button-outline-hover-bg);
-      border-color: var(--itd-color-border);
-      color: var(--itd-color-text);
-      & svg { color: var(--itd-color-text); }
-    }
-
-    &[disabled] {
-      background-color: var(--itd-color-disabled-bg);
-      border: 1px solid var(--itd-color-disabled-border);
-      box-shadow: none;
-      color: var(--itd-color-disabled-text);
-      & svg { color: var(--itd-color-disabled-text); }
-    }
-  }
-
-  /* ===== LINK VARIANT ===== */
-  .itd-button.itd-button-link {
-    background-color: transparent;
-    border: 1px solid transparent;
-    color: var(--itd-color-text);
-
-    & svg { color: var(--itd-color-text); }
-
-    &:hover, &.active {
-      color: var(--itd-primary);
-      text-underline-offset: 4px;
-      text-decoration: underline;
-      & svg { color: var(--itd-primary); }
-    }
-
-    &[disabled] {
-      background-color: var(--itd-color-disabled-bg);
-      border: 1px solid var(--itd-color-disabled-border);
-      color: var(--itd-color-disabled-text);
-      & svg { color: var(--itd-color-disabled-text); }
-    }
-  }
-
-  /* ===== PRIMARY VARIANT ===== */
-  .itd-button.itd-button-primary {
-    background: linear-gradient(-45deg, var(--itd-primary-gradient-start), var(--itd-primary-gradient-end));
-
-    & span, & div.icon svg { color: #ffffff; }
-
-    &:hover {
-      background: linear-gradient(-45deg, var(--itd-primary-hover-start), var(--itd-primary-hover-end));
-      & span, & div.icon svg { color: #ffffff; }
-    }
-
-    &[disabled] {
-      background: linear-gradient(-45deg, #477db4, #215283);
-      & span, & div.icon svg { color: var(--itd-button-disabled-text); }
-    }
-  }
-
-  /* ===== SECONDARY VARIANT ===== */
-  .itd-button.itd-button-secondary {
-    background: linear-gradient(-45deg, #ebebeb, #ffffff);
-
-    & span, & div.icon svg { color: #000000; }
-
-    &:hover {
-      background: linear-gradient(-45deg, #CDCDCD, #ebebeb);
-      & span, & div.icon svg { color: #000000; }
-    }
-
-    &[disabled] {
-      background: linear-gradient(-45deg, #CDCDCD, #A7A7A7);
-      & span, & div.icon svg { color: rgb(0, 0, 0, 30); }
-    }
-  }
-
-  /* ===== GENERIC VARIANT ===== */
-  .itd-button.itd-button-generic {
-    background-color: var(--itd-button-generic-bg);
-
-    & span, & div.icon svg { color: #ffffff; }
-
-    &:hover {
-      background: var(--itd-button-generic-hover-bg);
-      & span, & div.icon svg { color: #ffffff; }
-    }
-
-    &[disabled] {
-      background: var(--itd-button-disabled-bg);
-      & span, & div.icon svg { color: rgb(255, 255, 255, 30); }
-    }
-  }
-
-  /* ===== REQUEST VARIANT ===== */
-  .itd-button.itd-button-request {
-    background: linear-gradient(90deg, #0BE881 0%, #02B964 99%);
-
-    & span, & div.icon svg { color: var(--itd-color-text); }
-
-    &:hover {
-      background: linear-gradient(90deg, #16E886 0%, #0DD578 99%);
-      & span, & div.icon svg { color: var(--itd-color-text); }
-    }
-
-    &[disabled] {
-      background: linear-gradient(90deg, #05B663 0%, #028246 97%);
-      & span, & div.icon svg { color: rgb(29, 38, 73, 30); }
-    }
-  }
-
-  /* ===== APPROVE VARIANT ===== */
-  .itd-button.itd-button-approve {
-    background: linear-gradient(90deg, #FFB142 0%, #D88A1C 100%);
-
-    & span, & div.icon svg { color: var(--itd-color-text); }
-
-    &:hover {
-      background: linear-gradient(90deg, #FFC067 0%, #FFB346 100%);
-      & span, & div.icon svg { color: var(--itd-color-text); }
-    }
-
-    &[disabled] {
-      background: linear-gradient(90deg, #C88930 0%, #A86A13 98%);
-      & span, & div.icon svg { color: rgb(29, 38, 73, 30); }
-    }
-  }
-
-  /* ===== REJECT VARIANT ===== */
-  .itd-button.itd-button-reject {
-    background: linear-gradient(90deg, #B33939 0%, #971B1B 100%);
-
-    & span, & div.icon svg { color: #ffffff; }
-
-    &:hover {
-      background: linear-gradient(90deg, #DC5050 0%, #C52D2D 100%);
-      & span, & div.icon svg { color: #ffffff; }
-    }
-
-    &[disabled] {
-      background: linear-gradient(90deg, #872626 0%, #731010 100%);
-      & span, & div.icon svg { color: rgb(29, 38, 73, 30); }
-    }
-  }
-
-  /* ===== PENDING VARIANT ===== */
-  .itd-button.itd-button-pending {
-    cursor: default;
-    background-color: #1F2952;
-
-    & span, & div.icon svg { color: #ffffff99; }
-
-    &:hover {
-      background-color: #1F2952;
-      & span, & div.icon svg { color: #ffffff99; }
-    }
-
-    &[disabled] {
-      background-color: #1F2952;
-      & span, & div.icon svg { color: rgb(29, 38, 73, 30); }
-    }
-  }
-
-  /* ===== REQUESTED VARIANT ===== */
-  .itd-button.itd-button-requested {
-    cursor: default;
-    background-color: #1F295280;
-
-    & span, & div.icon svg { color: var(--itd-button-disabled-text); }
-
-    &:hover {
-      background-color: #1F295280;
-      & span, & div.icon svg { color: var(--itd-button-disabled-text); }
-    }
-
-    &[disabled] {
-      background-color: #1F295280;
-      & span, & div.icon svg { color: rgb(29, 38, 73, 30); }
-    }
-  }
-
-  /* ===== STATES ===== */
-  .itd-button[disabled] {
-    cursor: not-allowed;
-    border: 1px solid var(--itd-color-disabled-border);
-
-    & button { pointer-events: none; }
-  }
-
-  .itd-button.itd-button-loading {
-    cursor: progress;
-
-    & > *:not(.itd-spin-spinner) { opacity: 0; }
-  }
-
-  .itd-button:active:not([disabled]) {
-    transform: translateY(1px);
-  }
-
-  .itd-button:focus-visible {
-    outline: var(--itd-ring-width) solid var(--itd-color-border-focus-ring);
-  }
-
-}
+@layer components{.itd-button{--itd-button-disabled-ink:#1d2649;background:none;background-origin:border-box;border:1px solid #0000;border-radius:var(--itd-radius-button,var(--itd-radius-control));box-sizing:border-box;cursor:pointer;outline:0 solid #0000;outline-offset:var(--itd-ring-offset);position:relative;transition:outline .1s linear,border var(--itd-transition-duration) var(--itd-transition-timing-function),background-color var(--itd-transition-duration) var(--itd-transition-timing-function);-webkit-user-select:none;user-select:none;white-space:nowrap}
+
+@supports (color: oklab(0% 0 0%)){
+.itd-button{--itd-button-disabled-ink:oklch(0.28 0.066 270.8)}
+}.itd-button span,.itd-button svg{transition-duration:var(--itd-transition-duration);transition-property:color;transition-timing-function:var(--itd-transition-timing-function)}.itd-button svg{flex-shrink:0;pointer-events:none}.itd-button svg:not([class*=size-]):not(.itd-spinner){height:var(--itd-size-df-icon);width:var(--itd-size-df-icon)}.itd-button .itd-button-content{align-items:center;display:inline-flex;gap:inherit}.itd-button.itd-button-xs svg:not([class*=size-]):not(.itd-spinner){height:var(--itd-size-xs-icon);width:var(--itd-size-xs-icon)}.itd-button.itd-button-sm svg:not([class*=size-]):not(.itd-spinner){height:var(--itd-size-sm-icon);width:var(--itd-size-sm-icon)}:is(.itd-button.itd-button-md,.itd-button.itd-button-icon-sm,.itd-button.itd-button-icon) svg:not([class*=size-]):not(.itd-spinner){height:var(--itd-size-md-icon);width:var(--itd-size-md-icon)}:is(.itd-button.itd-button-lg,.itd-button.itd-button-icon-lg) svg:not([class*=size-]):not(.itd-spinner){height:var(--itd-size-lg-icon);width:var(--itd-size-lg-icon)}.itd-button.itd-button-xlg svg:not([class*=size-]):not(.itd-spinner){height:var(--itd-size-xlg-icon);width:var(--itd-size-xlg-icon)}.itd-button.itd-button-icon-square{aspect-ratio:1;padding-inline:0}.itd-button.itd-button-default{background-color:var(--itd-primary);border:1px solid #0000;box-shadow:var(--itd-box-shadow)}.itd-button.itd-button-default,.itd-button.itd-button-default svg{color:var(--itd-primary-foreground)}.itd-button.itd-button-default.active,.itd-button.itd-button-default:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-default[aria-expanded=true]{background-color:var(--itd-primary-hover)}.itd-button.itd-button-default[aria-disabled=true],.itd-button.itd-button-default[disabled]{background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);box-shadow:none;color:var(--itd-color-disabled-text)}:is(.itd-button.itd-button-default[disabled],.itd-button.itd-button-default[aria-disabled=true]) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-ghost{background-color:initial;border:1px solid #0000}.itd-button.itd-button-ghost div.icon svg,.itd-button.itd-button-ghost span{color:var(--itd-color-text)}.itd-button.itd-button-ghost.active,.itd-button.itd-button-ghost:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-ghost[aria-expanded=true]{background-color:var(--itd-color-button-ghost-hover-bg);color:var(--itd-color-button-ghost-hover-text,var(--itd-accent-foreground))}:is(.itd-button.itd-button-ghost:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-ghost.active,.itd-button.itd-button-ghost[aria-expanded=true]) span,:is(.itd-button.itd-button-ghost:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-ghost.active,.itd-button.itd-button-ghost[aria-expanded=true]) svg{color:var(--itd-color-button-ghost-hover-text,var(--itd-accent-foreground))}.itd-button.itd-button-ghost[aria-disabled=true],.itd-button.itd-button-ghost[disabled]{background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);color:var(--itd-color-disabled-text)}:is(.itd-button.itd-button-ghost[disabled],.itd-button.itd-button-ghost[aria-disabled=true]) span,:is(.itd-button.itd-button-ghost[disabled],.itd-button.itd-button-ghost[aria-disabled=true]) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-solid{background-color:var(--itd-color-background-alt-hover);border:1px solid #0000;box-shadow:none}.itd-button.itd-button-solid,.itd-button.itd-button-solid svg{color:var(--itd-secondary-foreground)}.itd-button.itd-button-solid.active,.itd-button.itd-button-solid:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-solid[aria-expanded=true]{background-color:var(--itd-secondary-hover);color:var(--itd-primary)}:is(.itd-button.itd-button-solid:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-solid.active,.itd-button.itd-button-solid[aria-expanded=true]) svg{color:var(--itd-primary)}.itd-button.itd-button-solid[aria-disabled=true],.itd-button.itd-button-solid[disabled]{background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);color:var(--itd-color-disabled-text)}:is(.itd-button.itd-button-solid[disabled],.itd-button.itd-button-solid[aria-disabled=true]) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-filled{background-color:var(--itd-color-button-filled-bg);border:1px solid #0000;color:var(--itd-primary)}.itd-button.itd-button-filled svg{color:var(--itd-primary)}.itd-button.itd-button-filled.active,.itd-button.itd-button-filled:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-filled[aria-expanded=true]{background-color:var(--itd-primary);color:var(--itd-primary-foreground)}:is(.itd-button.itd-button-filled:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-filled.active,.itd-button.itd-button-filled[aria-expanded=true]) svg{color:var(--itd-primary-foreground)}.itd-button.itd-button-filled[aria-disabled=true],.itd-button.itd-button-filled[disabled]{background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);box-shadow:none;color:var(--itd-color-disabled-text)}:is(.itd-button.itd-button-filled[disabled],.itd-button.itd-button-filled[aria-disabled=true]) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive{--_c:var(--itd-button-soft-color,var(--itd-primary));background-color:color-mix(in srgb,var(--_c) 12%,#0000);border:1px solid #0000;box-shadow:none;color:var(--_c)}:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive) svg{color:var(--_c)}.active:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive),:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive):hover:where(:root:not(.itd-touch) *),[aria-expanded=true]:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive){background-color:color-mix(in srgb,var(--_c) 18%,#0000);color:var(--_c)}:is(:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive):hover:where(:root:not(.itd-touch) *),.active:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive),[aria-expanded=true]:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive)) svg{color:var(--_c)}[aria-disabled=true]:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive),[disabled]:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive){background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);box-shadow:none;color:var(--itd-color-disabled-text)}:is([disabled]:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive),[aria-disabled=true]:is(.itd-button.itd-button-soft,.itd-button.itd-button-soft-destructive)) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-soft-destructive{--itd-button-soft-color:var(--itd-color-error)}.itd-button.itd-button-outline{background-color:var(--itd-color-button-outline-bg);border:1px solid var(--itd-color-border);box-shadow:var(--itd-box-shadow);color:var(--itd-color-text)}.itd-button.itd-button-outline svg{color:var(--itd-color-text)}.itd-button.itd-button-outline.active,.itd-button.itd-button-outline:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-outline[aria-expanded=true]{background-color:var(--itd-color-button-outline-hover-bg);border-color:var(--itd-color-button-outline-hover-border,var(--itd-color-border));color:var(--itd-color-button-outline-hover-text,var(--itd-color-text))}:is(.itd-button.itd-button-outline:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-outline.active,.itd-button.itd-button-outline[aria-expanded=true]) svg{color:var(--itd-color-button-outline-hover-text,var(--itd-color-text))}.itd-button.itd-button-outline[aria-disabled=true],.itd-button.itd-button-outline[disabled]{background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);box-shadow:none;color:var(--itd-color-disabled-text)}:is(.itd-button.itd-button-outline[disabled],.itd-button.itd-button-outline[aria-disabled=true]) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-outline-accent{--_c:var(
+      --itd-button-outline-accent-color,var(--itd-color-button-outline-accent,var(--itd-primary))
+    );background-color:var(--itd-color-button-outline-bg);border:1px solid color-mix(in srgb,var(--_c) 50%,#0000);box-shadow:var(--itd-box-shadow);color:var(--_c)}.itd-button.itd-button-outline-accent svg{color:var(--_c)}.itd-button.itd-button-outline-accent.active,.itd-button.itd-button-outline-accent:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-outline-accent[aria-expanded=true]{--_c:var(
+        --itd-button-outline-accent-color,var(--itd-color-button-outline-accent-hover,var(--itd-primary-hover))
+      );background-color:color-mix(in srgb,var(--_c) 8%,var(--itd-color-button-outline-bg));border-color:var(--_c)}.itd-button.itd-button-outline-accent[aria-disabled=true],.itd-button.itd-button-outline-accent[disabled]{background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);box-shadow:none;color:var(--itd-color-disabled-text)}:is(.itd-button.itd-button-outline-accent[disabled],.itd-button.itd-button-outline-accent[aria-disabled=true]) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-link{background-color:initial;border:1px solid #0000;color:var(--itd-color-text)}.itd-button.itd-button-link svg{color:var(--itd-color-text)}.itd-button.itd-button-link.active,.itd-button.itd-button-link:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-link[aria-expanded=true]{color:var(--itd-primary)}:is(.itd-button.itd-button-link:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-link.active,.itd-button.itd-button-link[aria-expanded=true]):not(.itd-button-has-icon){text-decoration-line:underline;text-underline-offset:4px}:is(.itd-button.itd-button-link:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-link.active,.itd-button.itd-button-link[aria-expanded=true]) svg{color:var(--itd-primary)}.itd-button.itd-button-link[aria-disabled=true],.itd-button.itd-button-link[disabled]{background-color:var(--itd-color-disabled-bg);border:1px solid var(--itd-color-disabled-border);color:var(--itd-color-disabled-text)}:is(.itd-button.itd-button-link[disabled],.itd-button.itd-button-link[aria-disabled=true]) svg{color:var(--itd-color-disabled-text)}.itd-button.itd-button-primary{background-image:linear-gradient(-45deg,var(--itd-primary-gradient-start),var(--itd-primary-gradient-end))}.itd-button.itd-button-primary div.icon svg,.itd-button.itd-button-primary span{color:#fff;color:oklch(1 0 0)}.itd-button.itd-button-primary:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-primary[aria-expanded=true]{background-image:linear-gradient(-45deg,var(--itd-primary-hover-start),var(--itd-primary-hover-end))}:is(.itd-button.itd-button-primary:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-primary[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-primary:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-primary[aria-expanded=true]) span{color:#fff;color:oklch(1 0 0)}.itd-button.itd-button-primary[aria-disabled=true],.itd-button.itd-button-primary[disabled]{background-image:linear-gradient(-45deg,#477db4,#215283);background-image:linear-gradient(-45deg,oklch(.577 .103 250.4),oklch(.431 .097 251.1))}:is(.itd-button.itd-button-primary[disabled],.itd-button.itd-button-primary[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-primary[disabled],.itd-button.itd-button-primary[aria-disabled=true]) span{color:var(--itd-button-disabled-text)}.itd-button.itd-button-secondary{background-image:linear-gradient(-45deg,#ebebeb,#fff);background-image:linear-gradient(-45deg,oklch(.94 0 0),oklch(1 0 0))}.itd-button.itd-button-secondary div.icon svg,.itd-button.itd-button-secondary span{color:#000;color:oklch(0 0 0)}.itd-button.itd-button-secondary:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-secondary[aria-expanded=true]{background-image:linear-gradient(-45deg,#cdcdcd,#ebebeb);background-image:linear-gradient(-45deg,oklch(.848 0 0),oklch(.94 0 0))}:is(.itd-button.itd-button-secondary:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-secondary[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-secondary:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-secondary[aria-expanded=true]) span{color:#000;color:oklch(0 0 0)}.itd-button.itd-button-secondary[aria-disabled=true],.itd-button.itd-button-secondary[disabled]{background-image:linear-gradient(-45deg,#cdcdcd,#a7a7a7);background-image:linear-gradient(-45deg,oklch(.848 0 0),oklch(.728 0 0))}:is(.itd-button.itd-button-secondary[disabled],.itd-button.itd-button-secondary[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-secondary[disabled],.itd-button.itd-button-secondary[aria-disabled=true]) span{color:#000;color:oklch(0 0 0)}.itd-button.itd-button-generic{background-color:var(--itd-button-generic-bg)}.itd-button.itd-button-generic div.icon svg,.itd-button.itd-button-generic span{color:#fff;color:oklch(1 0 0)}.itd-button.itd-button-generic:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-generic[aria-expanded=true]{background-color:var(--itd-button-generic-hover-bg)}:is(.itd-button.itd-button-generic:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-generic[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-generic:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-generic[aria-expanded=true]) span{color:#fff;color:oklch(1 0 0)}.itd-button.itd-button-generic[aria-disabled=true],.itd-button.itd-button-generic[disabled]{background-color:var(--itd-button-disabled-bg)}:is(.itd-button.itd-button-generic[disabled],.itd-button.itd-button-generic[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-generic[disabled],.itd-button.itd-button-generic[aria-disabled=true]) span{color:#fff;color:oklch(1 0 0)}.itd-button.itd-button-request{background-image:linear-gradient(90deg,#0be881,#02b964 99%);background-image:linear-gradient(90deg,oklch(.8172 .2064 153.6),oklch(.689 .176 153.3) 99%)}.itd-button.itd-button-request div.icon svg,.itd-button.itd-button-request span{color:var(--itd-color-text)}.itd-button.itd-button-request:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-request[aria-expanded=true]{background-image:linear-gradient(90deg,#17e886,#0dd578 99%);background-image:linear-gradient(90deg,oklch(.819 .201 154.5),oklch(.7669 .1915 154) 99%)}:is(.itd-button.itd-button-request:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-request[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-request:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-request[aria-expanded=true]) span{color:var(--itd-color-text)}.itd-button.itd-button-request[aria-disabled=true],.itd-button.itd-button-request[disabled]{background-image:linear-gradient(90deg,#05b663,#028246 97%);background-image:linear-gradient(90deg,oklch(.681 .173 153.4),oklch(.532 .134 153.8) 97%)}:is(.itd-button.itd-button-request[disabled],.itd-button.itd-button-request[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-request[disabled],.itd-button.itd-button-request[aria-disabled=true]) span{color:var(--itd-button-disabled-ink)}.itd-button.itd-button-approve{background-image:linear-gradient(90deg,#ffb143,#d88a1b);background-image:linear-gradient(90deg,oklch(.817 .151 71.7),oklch(.698 .146 68.1))}.itd-button.itd-button-approve div.icon svg,.itd-button.itd-button-approve span{color:var(--itd-color-text)}.itd-button.itd-button-approve:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-approve[aria-expanded=true]{background-image:linear-gradient(90deg,#ffc067,#ffb346);background-image:linear-gradient(90deg,#ffc067,color(display-p3 .95594 .71501 .35909));background-image:linear-gradient(90deg,oklch(.848 .128 74),oklch(.821 .149 72.3))}:is(.itd-button.itd-button-approve:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-approve[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-approve:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-approve[aria-expanded=true]) span{color:var(--itd-color-text)}.itd-button.itd-button-approve[aria-disabled=true],.itd-button.itd-button-approve[disabled]{background-image:linear-gradient(90deg,#c88930,#a86a13 98%);background-image:linear-gradient(90deg,oklch(.678 .127 71.3),oklch(.578 .121 67.9) 98%)}:is(.itd-button.itd-button-approve[disabled],.itd-button.itd-button-approve[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-approve[disabled],.itd-button.itd-button-approve[aria-disabled=true]) span{color:var(--itd-button-disabled-ink)}.itd-button.itd-button-reject{background-image:linear-gradient(90deg,#b33939,#971b1b);background-image:linear-gradient(90deg,oklch(.523 .158 24.4),oklch(.44 .159 26.8))}.itd-button.itd-button-reject div.icon svg,.itd-button.itd-button-reject span{color:#fff;color:oklch(1 0 0)}.itd-button.itd-button-reject:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-reject[aria-expanded=true]{background-image:linear-gradient(90deg,#dc5050,#c52d2d);background-image:linear-gradient(90deg,oklch(.62 .176 23.8),oklch(.541 .189 26.2))}:is(.itd-button.itd-button-reject:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-reject[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-reject:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-reject[aria-expanded=true]) span{color:#fff;color:oklch(1 0 0)}.itd-button.itd-button-reject[aria-disabled=true],.itd-button.itd-button-reject[disabled]{background-image:linear-gradient(90deg,#872626,#730f10);background-image:linear-gradient(90deg,oklch(.422 .132 24.8),oklch(.359 .133 27.1))}:is(.itd-button.itd-button-reject[disabled],.itd-button.itd-button-reject[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-reject[disabled],.itd-button.itd-button-reject[aria-disabled=true]) span{color:var(--itd-button-disabled-ink)}.itd-button.itd-button-pending{background-color:#1f2952;background-color:oklch(.296 .075 270.9);cursor:default}.itd-button.itd-button-pending div.icon svg,.itd-button.itd-button-pending span{color:#fff9;color:oklch(1 0 0/.6)}.itd-button.itd-button-pending:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-pending[aria-expanded=true]{background-color:#1f2952;background-color:oklch(.296 .075 270.9)}:is(.itd-button.itd-button-pending:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-pending[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-pending:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-pending[aria-expanded=true]) span{color:#fff9;color:oklch(1 0 0/.6)}.itd-button.itd-button-pending[aria-disabled=true],.itd-button.itd-button-pending[disabled]{background-color:#1f2952;background-color:oklch(.296 .075 270.9)}:is(.itd-button.itd-button-pending[disabled],.itd-button.itd-button-pending[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-pending[disabled],.itd-button.itd-button-pending[aria-disabled=true]) span{color:var(--itd-button-disabled-ink)}.itd-button.itd-button-requested{background-color:rgba(31,41,82,.502);background-color:oklch(.296 .075 270.9/.502);cursor:default}.itd-button.itd-button-requested div.icon svg,.itd-button.itd-button-requested span{color:var(--itd-button-disabled-text)}.itd-button.itd-button-requested:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-requested[aria-expanded=true]{background-color:rgba(31,41,82,.502);background-color:oklch(.296 .075 270.9/.502)}:is(.itd-button.itd-button-requested:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-requested[aria-expanded=true]) div.icon svg,:is(.itd-button.itd-button-requested:hover:where(:root:not(.itd-touch) *),.itd-button.itd-button-requested[aria-expanded=true]) span{color:var(--itd-button-disabled-text)}.itd-button.itd-button-requested[aria-disabled=true],.itd-button.itd-button-requested[disabled]{background-color:rgba(31,41,82,.502);background-color:oklch(.296 .075 270.9/.502)}:is(.itd-button.itd-button-requested[disabled],.itd-button.itd-button-requested[aria-disabled=true]) div.icon svg,:is(.itd-button.itd-button-requested[disabled],.itd-button.itd-button-requested[aria-disabled=true]) span{color:var(--itd-button-disabled-ink)}.itd-button[aria-disabled=true],.itd-button[disabled]{cursor:not-allowed;pointer-events:none}.itd-button[aria-disabled=true]:not(.itd-button-custom),.itd-button[disabled]:not(.itd-button-custom){border:1px solid var(--itd-color-disabled-border)}.itd-button.itd-button-loading{cursor:progress}.itd-button.itd-button-loading>:not(.itd-spin-spinner){opacity:0}.itd-button:active:not([disabled]){transform:translateY(1px)}.itd-button:focus-visible{outline:var(--itd-ring-width) solid var(--itd-color-border-focus-ring)}}

package/dist/css/calendar.css

@@ -0,0 +1 @@
+@layer components{.itd-calendar:not(.itd-calendar-range){background-color:var(--itd-color-background-select);border-radius:var(--itd-radius-sm);padding:.25rem .875rem .875rem;width:17.5rem}.itd-calendar:not(.itd-calendar-range)[data-has-time]{width:auto}.itd-calendar-body{align-items:flex-start;display:flex}.itd-calendar-main{flex:0 0 auto;width:15.75rem}.itd-calendar-footer,.itd-calendar-range-footer{align-items:center;border-top:1px solid var(--itd-color-border);display:flex;gap:calc(var(--itd-spacing)*2);justify-content:flex-end;margin-top:calc(var(--itd-spacing)*2.5);padding-top:calc(var(--itd-spacing)*2.5)}.itd-calendar-footer .itd-calendar-now{margin-right:auto}.itd-calendar-separator{background-color:var(--itd-color-border);height:1px;margin:.25rem 0;width:100%}.itd-calendar-header{align-items:center;display:flex;height:2.5rem}.itd-calendar-middle{align-items:center;display:flex;flex:auto;flex-direction:row;justify-content:center}.itd-calendar-middle div{border-radius:var(--itd-radius-sm);color:var(--itd-color-text);cursor:pointer;font-size:var(--itd-text-sm);font-weight:var(--itd-font-weight-semibold);padding:.125rem .375rem;transition:color .15s ease-out}.itd-calendar-middle div:hover:where(:root:not(.itd-touch) *){color:var(--itd-primary)}.itd-calendar-middle div:focus-visible{outline:var(--itd-ring-width) solid var(--itd-ring);outline-offset:.125rem}.itd-calendar-next-month,.itd-calendar-next-year,.itd-calendar-prev-month,.itd-calendar-prev-year{align-items:center;border-radius:var(--itd-radius-sm);color:var(--itd-color-text-muted);cursor:pointer;display:flex;flex:none;height:1.75rem;justify-content:center;transition:color .15s ease-out;width:1.75rem}.itd-calendar-next-month:hover:where(:root:not(.itd-touch) *),.itd-calendar-next-year:hover:where(:root:not(.itd-touch) *),.itd-calendar-prev-month:hover:where(:root:not(.itd-touch) *),.itd-calendar-prev-year:hover:where(:root:not(.itd-touch) *){color:var(--itd-color-text)}.itd-calendar-next-month:focus-visible,.itd-calendar-next-year:focus-visible,.itd-calendar-prev-month:focus-visible,.itd-calendar-prev-year:focus-visible{outline:var(--itd-ring-width) solid var(--itd-ring);outline-offset:.125rem}.itd-calendar-next-month span,.itd-calendar-next-year span,.itd-calendar-prev-month span,.itd-calendar-prev-year span{display:inline-block;height:.4375rem;position:relative;width:.4375rem}.itd-calendar-prev-month span,.itd-calendar-prev-year span{transform:rotate(-45deg)}.itd-calendar-next-month span,.itd-calendar-next-year span{transform:rotate(135deg)}.itd-calendar-next-month span:after,.itd-calendar-next-month span:before,.itd-calendar-next-year span:after,.itd-calendar-next-year span:before,.itd-calendar-prev-month span:after,.itd-calendar-prev-month span:before,.itd-calendar-prev-year span:after,.itd-calendar-prev-year span:before{border:0 solid;border-width:.125rem 0 0 .125rem;content:"";display:inline-block;height:.4375rem;left:0;position:absolute;top:0;width:.4375rem}.itd-calendar-next-year span:after,.itd-calendar-prev-year span:after{left:.25rem;top:.25rem}.itd-calendar-weekdays{grid-gap:0;display:grid;font-size:var(--itd-text-13);grid-template-columns:repeat(7,1fr);line-height:1.875rem;text-align:center}.itd-calendar-weekdays>div{align-items:center;display:flex;justify-content:center}.itd-calendar-weekdays>div span{color:var(--itd-color-text);font-weight:var(--itd-font-weight-bold)}.itd-calendar-days{grid-gap:.25rem 0;display:grid;grid-template-columns:repeat(7,1fr)}.itd-calendar-day{align-items:center;appearance:none;-webkit-appearance:none;background:#0000;border:0;border-radius:var(--itd-radius-sm);cursor:pointer;display:flex;font:inherit;justify-content:center;margin:0;padding:0;position:relative;width:100%}.itd-calendar-day:before{content:"";height:1.875rem;left:0;position:absolute;right:0;top:50%;transform:translateY(-50%);transition:background-color .15s ease-out}@media (prefers-reduced-motion:reduce){.itd-calendar-day:before{transition:none}}.itd-calendar-day span{align-items:center;border-radius:calc(infinity*1px);display:flex;font-size:var(--itd-text-13);font-weight:var(--itd-font-weight-medium);height:1.875rem;justify-content:center;letter-spacing:-.5;line-height:1.875rem;min-width:1.875rem;position:relative;transition:background-color .15s ease-out}.itd-calendar-day:hover:where(:root:not(.itd-touch) *){z-index:2}.itd-calendar-day:hover:where(:root:not(.itd-touch) *) span{background-color:var(--itd-color-background-select-item-hover);color:var(--itd-primary)}.itd-calendar-day:focus-visible{outline:none;z-index:3}.itd-calendar-day:focus-visible span{outline:var(--itd-ring-width) solid var(--itd-ring);outline-offset:.125rem}.itd-calendar-day-range-end,.itd-calendar-day-range-start,.itd-calendar-day-selected,.itd-calendar-day-today{z-index:2}.itd-calendar-day-today span{border:1px solid var(--itd-primary)}.itd-calendar-day-selected span{background-color:var(--itd-color-background-select-item-selected);color:var(--itd-primary)}.itd-calendar-day-current span{color:var(--itd-color-text)}.itd-calendar-day:where(:not(.itd-calendar-day-current)) span{color:var(--itd-color-text-muted)}.itd-calendar-day-in-range:before{background-color:var(--itd-color-background-select-item-selected)}.itd-calendar-day-in-range span{color:var(--itd-color-text)}.itd-calendar-day-range-start:where(:not(.itd-calendar-day-range-end)):before{background-color:var(--itd-color-background-select-item-selected);left:50%;right:0}.itd-calendar-day-range-end:where(:not(.itd-calendar-day-range-start)):before{background-color:var(--itd-color-background-select-item-selected);left:0;right:50%}.itd-calendar-day-range-end span,.itd-calendar-day-range-start span{background-color:var(--itd-primary);color:var(--itd-primary-foreground)}.itd-calendar-day-range-end:hover:where(:root:not(.itd-touch) *) span,.itd-calendar-day-range-start:hover:where(:root:not(.itd-touch) *) span{background-color:var(--itd-primary-hover);color:var(--itd-primary-foreground)}.itd-calendar-day-disabled{pointer-events:none}.itd-calendar-day-disabled:before{background-color:var(--itd-color-disabled-bg)}.itd-calendar-day-disabled span{background:0 0;color:var(--itd-color-disabled-text)}.itd-calendar-months{grid-gap:.5rem;display:grid;grid-template-columns:repeat(3,1fr)}.itd-calendar-years{grid-gap:.5rem;display:grid;grid-template-columns:repeat(4,1fr)}.itd-calendar-months .itd-calendar-month,.itd-calendar-years .itd-calendar-year{background:#0000;border:0;border-radius:var(--itd-radius-sm);color:var(--itd-color-text);cursor:pointer;font-size:var(--itd-text-sm);height:2.25rem}.itd-calendar-months .itd-calendar-month:focus-visible,.itd-calendar-years .itd-calendar-year:focus-visible{outline:var(--itd-ring-width) solid var(--itd-ring);outline-offset:.125rem}.itd-calendar-months .itd-calendar-month-selected,.itd-calendar-years .itd-calendar-year-selected{background-color:var(--itd-color-background-select-item-selected);color:var(--itd-primary)}.itd-calendar-years .itd-calendar-year-outside{color:var(--itd-color-text-muted)}.itd-calendar-time{align-self:stretch;border-left:1px solid var(--itd-color-border);display:flex;gap:calc(var(--itd-spacing)*.5);margin-left:calc(var(--itd-spacing)*2);padding-left:calc(var(--itd-spacing)*2)}.itd-calendar-time-column{display:flex;flex-direction:column;max-height:14.125rem;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:var(--itd-scrollbar-thumb) #0000;scrollbar-width:thin;width:calc(var(--itd-spacing)*12)}.itd-calendar-time-column[data-fill]{max-height:16.875rem}.itd-calendar-time-column::-webkit-scrollbar{width:.375rem}.itd-calendar-time-column::-webkit-scrollbar-thumb{background:var(--itd-scrollbar-thumb);border-radius:calc(var(--itd-border-radius)*.8)}.itd-calendar-time-cell{appearance:none;-webkit-appearance:none;background:#0000;border:0;border-radius:var(--itd-radius-sm);color:var(--itd-color-text-muted);cursor:pointer;flex:0 0 auto;font:inherit;font-size:var(--itd-text-13);font-weight:var(--itd-font-weight-medium);height:1.875rem;line-height:1.875rem;margin:1px 0;text-align:center;transition:background-color .15s ease-out}.itd-calendar-time-cell:hover:where(:root:not(.itd-touch) *){background-color:var(--itd-color-background-select-item-hover);color:var(--itd-primary)}.itd-calendar-time-cell:focus-visible{outline:var(--itd-ring-width) solid var(--itd-ring);outline-offset:-.125rem}.itd-calendar-time-cell-selected{background-color:var(--itd-color-background-select-item-selected);color:var(--itd-primary);font-weight:var(--itd-font-weight-semibold)}.itd-calendar-range{align-items:stretch;background-color:var(--itd-color-background-select);border-radius:var(--itd-radius-sm);display:flex;overflow:hidden}.itd-calendar-range-presets{border-right:1px solid var(--itd-color-border);display:flex;flex:0 0 auto;flex-direction:column;gap:calc(var(--itd-spacing)*.5);max-height:calc(var(--itd-spacing)*90);max-width:calc(var(--itd-spacing)*44);min-width:calc(var(--itd-spacing)*30);overflow-y:auto;padding:calc(var(--itd-spacing)*2)}.itd-calendar-range-preset{appearance:none;background:#0000;border:0;border-radius:var(--itd-radius-sm);color:var(--itd-color-text);cursor:pointer;font-size:var(--itd-text-sm);padding:calc(var(--itd-spacing)*1.5) calc(var(--itd-spacing)*2.5);text-align:left;transition:background-color .15s ease,color .15s ease;white-space:nowrap}.itd-calendar-range-preset:hover:where(:root:not(.itd-touch) *){background-color:var(--itd-color-background-select-item-hover);color:var(--itd-primary)}.itd-calendar-range-preset:focus-visible{outline:var(--itd-ring-width) solid var(--itd-ring);outline-offset:-.125rem}.itd-calendar-range-preset:where([data-active]){background-color:var(--itd-color-background-select-item-selected);color:var(--itd-primary)}.itd-calendar-range-calendars{padding:.25rem .875rem .875rem}.itd-calendar-range-panels{align-items:flex-start;display:flex;gap:calc(var(--itd-spacing)*6)}.itd-calendar-range-panel{flex:0 0 auto;width:15.75rem}.itd-calendar-range-picker-panel{width:15.75rem}.itd-calendar-range-picker-panel[data-dual]{width:calc(31.5rem + var(--itd-spacing)*6)}.itd-calendar[data-compact] .itd-calendar-middle-decade,.itd-calendar[data-compact] .itd-calendar-middle-month,.itd-calendar[data-compact] .itd-calendar-middle-year{font-size:var(--itd-text-xs)}.itd-calendar[data-compact] .itd-calendar-weekdays{font-size:calc(var(--itd-text-xs) - .0625rem);line-height:1.5rem}.itd-calendar[data-compact] .itd-calendar-weekdays>div{height:1.5rem}.itd-calendar[data-compact] .itd-calendar-days{grid-gap:.125rem 0}.itd-calendar[data-compact] .itd-calendar-day:before{height:1.5rem}.itd-calendar[data-compact] .itd-calendar-day span{font-size:calc(var(--itd-text-xs) - .0625rem);height:1.5rem;line-height:1.5rem;min-width:1.5rem}.itd-calendar[data-compact] .itd-calendar-months,.itd-calendar[data-compact] .itd-calendar-years{grid-gap:.375rem}.itd-calendar[data-compact] .itd-calendar-month,.itd-calendar[data-compact] .itd-calendar-year{font-size:var(--itd-text-xs);height:1.875rem}.itd-calendar[data-compact]:not(.itd-calendar-range){padding:.25rem .625rem .625rem;width:14.5rem}.itd-calendar[data-compact] .itd-calendar-main{width:12.25rem}[data-compact] .itd-calendar-time-column{max-height:13.625rem}[data-compact] .itd-calendar-time-cell{font-size:calc(var(--itd-text-xs) - .0625rem);height:1.5rem;line-height:1.5rem}[data-compact] .itd-calendar-range-presets{padding:calc(var(--itd-spacing)*1.25)}[data-compact] .itd-calendar-range-preset{font-size:var(--itd-text-13);padding:calc(var(--itd-spacing)*1.25) calc(var(--itd-spacing)*2)}[data-compact] .itd-calendar-range-calendars{padding:.125rem .625rem .625rem}[data-compact] .itd-calendar-range-panels{gap:calc(var(--itd-spacing)*4)}[data-compact] .itd-calendar-range-panel,[data-compact] .itd-calendar-range-picker-panel{width:12.25rem}[data-compact] .itd-calendar-range-picker-panel[data-dual]{width:calc(24.5rem + var(--itd-spacing)*4)}[data-compact] .itd-calendar-range-footer{margin-top:calc(var(--itd-spacing)*1.5);padding-top:calc(var(--itd-spacing)*1.5)}}

package/dist/css/card.css

@@ -1,58 +1 @@
-/* ================================= */
-/* CARD COMPONENT STYLES             */
-/* ================================= */
-@layer components {
-
-  .itd-card > .itd-spin {
-    height: 100%;
-  }
-
-  .itd-card.itd-card-default {
-    border: 1px solid var(--itd-color-border);
-  }
-
-  .itd-card.itd-card-filled {
-    box-shadow: var(--itd-card-shadow);
-  }
-
-  .itd-card.itd-card-default,
-  .itd-card.itd-card-filled {
-    background-color: var(--itd-card);
-    color: var(--itd-card-foreground);
-    border-radius: calc(var(--itd-border-radius) + 4px);
-    font-size: var(--itd-text-sm);
-    line-height: var(--itd-text-sm--line-height);
-  }
-
-  .itd-card-content {
-    padding-block: calc(var(--itd-spacing) * 6);
-  }
-
-  .itd-card-header:not(.itd-card-header-separator) + .itd-card-content {
-    padding-block-start: 0;
-  }
-
-  .itd-card .itd-card-description {
-    color: var(--itd-color-text-muted-foreground);
-  }
-
-  .itd-card .itd-card-overlay {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: var(--itd-color-card-overlay);
-    z-index: 1000;
-  }
-
-  .itd-card-header-separator {
-    border-bottom: 1px solid var(--itd-color-border);
-  }
-
-  .itd-card-footer {
-    border-top: 1px solid var(--itd-color-border);
-    background-color: var(--itd-color-background-footer);
-  }
-
-}
+@layer components{.itd-card>.itd-spin{height:100%}.itd-card.itd-card-default{border:1px solid var(--itd-color-border)}.itd-card.itd-card-filled{box-shadow:var(--itd-card-shadow)}.itd-card.itd-card-default,.itd-card.itd-card-filled{background-color:var(--itd-card);border-radius:calc(var(--itd-border-radius)*1.4);color:var(--itd-card-foreground);font-size:var(--itd-text-sm);line-height:var(--itd-text-sm--line-height)}.itd-card-content{padding-block:calc(var(--itd-spacing)*6)}.itd-card-header:not(.itd-card-header-separator)+.itd-card-content{padding-block-start:0}.itd-card-title{--itd-tracking:var(--itd-tracking-tight);font-size:var(--itd-text-default);font-weight:var(--itd-font-weight-medium);letter-spacing:var(--itd-tracking-tight);line-height:var(--itd-text-default--line-height)}.itd-card .itd-card-body{display:flex;flex-direction:column}.itd-card-description{font-size:var(--itd-text-sm);line-height:var(--itd-text-sm--line-height)}.itd-card .itd-card-description{color:var(--itd-color-text-muted-foreground)}.itd-card .itd-card-overlay{background-color:var(--itd-color-card-overlay);height:100%;left:0;position:absolute;top:0;width:100%;z-index:1000}.itd-card-header-separator{border-bottom:1px solid var(--itd-color-border)}.itd-card-footer{background-color:var(--itd-color-background-footer);border-top:1px solid var(--itd-color-border)}}

package/dist/css/casino-featured.css

@@ -0,0 +1 @@
+@layer components{.itd-casino-featured{display:grid;gap:.75rem;grid-template-columns:17.75rem repeat(var(--itd-casino-featured-cols,3),1fr) 17.75rem;height:var(--itd-casino-featured-height,23.75rem);min-height:var(--itd-casino-featured-height,23.75rem)}.itd-casino-featured[data-empty=true]{grid-template-columns:17.75rem 1fr 17.75rem}.itd-casino-panel{background-color:var(--itd-surface-box);border-radius:var(--itd-radius-md);display:grid;grid-template-rows:3.375rem 1fr;height:100%;min-height:0;overflow:hidden}.itd-casino-panel-head{align-items:center;border-bottom:1px solid color-mix(in srgb,var(--itd-color-text) 6%,#0000);display:flex;gap:.375rem;padding:0 .9375rem}.itd-casino-panel-head>svg{color:var(--itd-color-text);height:1rem;width:1rem}.itd-casino-panel-title{color:var(--itd-color-text);flex:1;font-size:var(--itd-text-13);font-weight:var(--itd-font-weight-semibold);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.itd-casino-panel-body{display:flex;flex-direction:column;min-height:0;min-width:0}.itd-casino-panel-scroll{flex:1;margin:.625rem .3125rem .625rem 0;min-height:0;overflow-y:scroll;scrollbar-color:auto;scrollbar-width:auto}@supports not selector(::-webkit-scrollbar){.itd-casino-panel-scroll{scrollbar-color:oklch(from var(--itd-background) calc(min(l + .145, .85)) c h) oklch(from var(--itd-background) calc(min(l + .08, .93)) c h);scrollbar-width:thin}}.itd-casino-panel-scroll::-webkit-scrollbar{width:.375rem}.itd-casino-panel-scroll::-webkit-scrollbar-track{background-color:oklch(from var(--itd-background) calc(min(l + .08, var(--itd-elev-nested, .93))) c h);border-radius:var(--itd-radius-lg)}.itd-casino-panel-scroll::-webkit-scrollbar-thumb{background-clip:initial;background-color:oklch(from var(--itd-background) calc(min(l + .145, var(--itd-elev-deep, .85))) c h);border:0;border-radius:var(--itd-radius-lg)}.itd-casino-panel-scroll::-webkit-scrollbar-thumb:hover:where(:root:not(.itd-touch) *){background-color:oklch(from var(--itd-background) calc(min(l + .23, var(--itd-elev-deep, .8))) c h)}.itd-casino-panel-list{display:flex;flex-direction:column;gap:.3125rem;list-style:none;margin:0;padding:0 .3125rem 0 .9375rem}.itd-casino-panel-row{align-items:center;background-color:oklch(from var(--itd-background) calc(min(l + .145, var(--itd-elev-nested, .94))) c h);border:0;border-radius:var(--itd-radius-lg);color:inherit;cursor:pointer;display:flex;font:inherit;gap:.625rem;outline:2px solid oklch(from var(--itd-primary) l c h/0);outline-offset:-2px;padding:.5rem .625rem;text-align:start;transition:transform var(--itd-transition-duration) var(--itd-transition-timing-function),outline-color var(--itd-transition-duration) var(--itd-transition-timing-function);width:100%}.itd-casino-panel-row:hover:where(:root:not(.itd-touch) *){outline-color:var(--itd-primary);transform:scale(.975)}.itd-casino-row-thumb{background-color:oklch(from var(--itd-background) calc(min(l + .05, .9)) c h/50%);border-radius:var(--itd-radius-sm);flex:none;height:2.25rem;object-fit:cover;width:2.25rem}.itd-casino-row-thumb--wide{height:2.5rem;width:3.5rem}.itd-casino-row-body{display:flex;flex:1;flex-direction:column;gap:.0625rem;min-width:0}.itd-casino-row-name{color:var(--itd-color-text);font-weight:var(--itd-font-weight-bold)}.itd-casino-row-name,.itd-casino-row-sub{font-size:var(--itd-text-11);line-height:var(--itd-text-11--line-height);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.itd-casino-row-sub{color:var(--itd-color-text-neutral)}.itd-casino-row-amount{font-feature-settings:"tnum";color:var(--itd-primary);flex:none;font-size:var(--itd-text-11);font-variant-numeric:tabular-nums;font-weight:var(--itd-font-weight-bold);line-height:var(--itd-text-11--line-height)}.itd-casino-tournament .itd-casino-row-body .itd-casino-row-amount{align-self:flex-start;font-size:var(--itd-text-13);margin-top:.125rem}.itd-casino-winners-tabs{display:inline-flex;gap:.3125rem}.itd-casino-see-all.itd-button,.itd-casino-winners-tab.itd-button{border-radius:var(--itd-radius-sm);font-size:var(--itd-text-10);font-weight:var(--itd-font-weight-semibold);line-height:var(--itd-text-10--line-height);padding:.125rem .375rem}.itd-casino-winners-tab.itd-button{border-radius:var(--itd-radius-chip)}[data-theme=light] .itd-casino-see-all.itd-button:hover:where(:root:not(.itd-touch) *):not(:disabled),[data-theme=light] .itd-casino-winners-tab.itd-button:not([aria-pressed=true]):hover:where(:root:not(.itd-touch) *):not(:disabled){background:oklch(from var(--itd-background) calc(min(l + .068, .9)) calc(c * .8) h)}[data-itd-elevation=raised] .itd-casino-see-all.itd-button:hover:where(:root:not(.itd-touch) *):not(:disabled),[data-itd-elevation=raised] .itd-casino-winners-tab.itd-button:not([aria-pressed=true]):hover:where(:root:not(.itd-touch) *):not(:disabled){background:oklch(from var(--itd-background) .96 c h)}.itd-casino-winners-tab.itd-button[aria-pressed=true]:hover:where(:root:not(.itd-touch) *):not(:disabled){background-color:var(--itd-primary)}.itd-casino-featured-box{background:none;border:0;border-radius:var(--itd-radius-md);cursor:pointer;display:block;margin:0;min-height:0;min-width:0;padding:0}.itd-casino-featured-empty{align-items:center;display:flex;height:100%;justify-content:center}.itd-casino-featured-empty>span{color:var(--itd-color-text-neutral);display:block;font-size:var(--itd-text-13);font-weight:var(--itd-font-weight-medium);max-width:25rem;padding:1.25rem .625rem;text-align:center}}.itd-casino-see-all.itd-button,.itd-casino-winners-tab.itd-button{height:1.5rem;min-height:1.5rem;min-width:0}

package/dist/css/chart.css

@@ -0,0 +1 @@
+@layer components{.itd-chart{--_chart-s1:var(--itd-chart-series-1,var(--itd-primary));--_chart-s2:var(--itd-chart-series-2,var(--itd-color-progress-success-fill));--_chart-s3:var(--itd-chart-series-3,var(--itd-color-alert-error-title));--_chart-s4:var(--itd-chart-series-4,var(--itd-color-text-neutral));--_chart-grid:var(--itd-chart-grid,var(--itd-color-border));--_chart-tick:var(--itd-chart-tick,var(--itd-color-text-neutral));display:flex;flex-direction:column;gap:calc(var(--itd-spacing)*2);width:100%}.itd-chart .recharts-text{fill:var(--_chart-tick);font-size:var(--itd-text-xs)}.itd-chart .recharts-cartesian-grid line{stroke:var(--_chart-grid)}.itd-chart .recharts-tooltip-cursor{stroke:var(--_chart-grid);fill:none}.itd-chart-tip{background:var(--itd-popover);border:1px solid var(--itd-color-border);border-radius:var(--itd-radius);box-shadow:var(--itd-floating-shadow);color:var(--itd-color-text);display:grid;font-size:var(--itd-text-13);gap:calc(var(--itd-spacing)*1.5);line-height:var(--itd-text-13--line-height);padding:calc(var(--itd-spacing)*2.5) calc(var(--itd-spacing)*3)}.itd-chart-tip-title{color:var(--itd-color-text-muted);font-weight:var(--itd-font-weight-medium)}.itd-chart-tip-row{align-items:center;display:flex;gap:calc(var(--itd-spacing)*1.5)}.itd-chart-tip-name{color:var(--itd-color-text-muted)}.itd-chart-tip-value{margin-left:auto;padding-left:calc(var(--itd-spacing)*3)}.itd-chart-tip-value,.itd-chart-tip-value .itd-amount{font-weight:var(--itd-font-weight-semibold)}.itd-chart-swatch{border-radius:50%;flex:none;height:.5rem;width:.5rem}.itd-chart-legend{align-items:center;color:var(--itd-color-text-muted);display:flex;flex-wrap:wrap;font-size:var(--itd-text-13);gap:calc(var(--itd-spacing)*1) calc(var(--itd-spacing)*4);justify-content:center;line-height:var(--itd-text-13--line-height)}.itd-chart-legend-item{align-items:center;display:inline-flex;gap:calc(var(--itd-spacing)*1.5)}.itd-chart-expand-poster{cursor:pointer;position:relative;width:100%}.itd-chart-expand-preview{inset:0;opacity:.5;pointer-events:none;position:absolute}.itd-chart-expand-scrim{background:oklch(from var(--itd-background) l c h/.45);inset:0;position:absolute}.itd-chart-expand{left:50%;position:absolute;top:50%;translate:-50% -50%}.itd-chart-fullscreen-hint{align-items:center;background:var(--itd-popover);border:1px solid var(--itd-color-border);border-radius:var(--itd-radius);box-shadow:var(--itd-floating-shadow);color:var(--itd-color-text);display:none;font-size:var(--itd-text-13);gap:calc(var(--itd-spacing)*1.5);left:50%;line-height:var(--itd-text-13--line-height);padding:calc(var(--itd-spacing)*1.5) calc(var(--itd-spacing)*3);pointer-events:none;position:absolute;top:calc(var(--itd-spacing)*3);translate:-50% 0;z-index:1}.itd-chart-fullscreen-hint svg{flex:none;height:1em;width:1em}@media (orientation:portrait){.itd-chart-fullscreen-hint{animation:itd-chart-hint-fade 4s ease forwards;display:inline-flex}}@media (prefers-reduced-motion:reduce){.itd-chart-fullscreen-hint{animation:none}}@keyframes itd-chart-hint-fade{0%{opacity:0}10%{opacity:1}75%{opacity:1}to{opacity:0}}.itd-chart-fullscreen{background:var(--itd-background);inset:0;position:fixed;z-index:9999}.itd-chart-fullscreen-stage{display:flex;flex-direction:column;gap:calc(var(--itd-spacing)*2);inset:0;padding:calc(var(--itd-spacing)*4) calc(var(--itd-spacing)*4) calc(var(--itd-spacing)*3);position:absolute;width:auto}@media (orientation:portrait){.itd-chart-fullscreen-stage{height:100vw;height:100dvw;inset:auto;left:0;top:0;transform:rotate(90deg) translateY(-100%);transform-origin:top left;width:100vh;width:100dvh}}.itd-chart-fullscreen-scroller{-webkit-overflow-scrolling:touch;flex:1;min-height:0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}.itd-chart-fullscreen-scroller::-webkit-scrollbar{display:none}.itd-chart-fullscreen-canvas{height:100%;min-width:100%}.itd-chart-fullscreen-close{position:absolute;right:calc(var(--itd-spacing)*2);top:calc(var(--itd-spacing)*2);z-index:1}}