/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */ @layer properties; :root, :host { --form-py: calc(var(--spacing) * 2); --form-px: calc(var(--spacing) * 3); --form-radius: var(--radius-sm); --form-stroke: currentcolor; --form-bg: #fff; --form-color: currentcolor; --form-active-color: var(--color-blue-600); --select-icon: url('data:image/svg+xml,'); --select-icon-size: 1.25em; --select-icon-offset: 0.8rem; --font-sans: "Segoe UI", "Helvetica Neue", "Arial", "sans-serif"; --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --color-red-50: oklch(97.1% 0.013 17.38); --color-red-100: oklch(93.6% 0.032 17.717); --color-red-200: oklch(88.5% 0.062 18.334); --color-red-300: oklch(80.8% 0.114 19.571); --color-red-400: oklch(70.4% 0.191 22.216); --color-red-500: oklch(63.7% 0.237 25.331); --color-red-600: oklch(57.7% 0.245 27.325); --color-red-700: oklch(50.5% 0.213 27.518); --color-red-800: oklch(44.4% 0.177 26.899); --color-red-900: oklch(39.6% 0.141 25.723); --color-orange-50: oklch(98% 0.016 73.684); --color-orange-200: oklch(90.1% 0.076 70.697); --color-orange-400: oklch(75% 0.183 55.934); --color-orange-500: oklch(70.5% 0.213 47.604); --color-orange-600: oklch(64.6% 0.222 41.116); --color-orange-700: oklch(55.3% 0.195 38.402); --color-yellow-50: oklch(98.7% 0.026 102.212); --color-yellow-100: oklch(97.3% 0.071 103.193); --color-yellow-400: oklch(85.2% 0.199 91.936); --color-yellow-500: oklch(79.5% 0.184 86.047); --color-yellow-600: oklch(68.1% 0.162 75.834); --color-yellow-700: oklch(55.4% 0.135 66.442); --color-yellow-800: oklch(47.6% 0.114 61.907); --color-green-50: oklch(98.2% 0.018 155.826); --color-green-100: oklch(96.2% 0.044 156.743); --color-green-200: oklch(92.5% 0.084 155.995); --color-green-400: oklch(79.2% 0.209 151.711); --color-green-500: oklch(72.3% 0.219 149.579); --color-green-600: oklch(62.7% 0.194 149.214); --color-green-700: oklch(52.7% 0.154 150.069); --color-green-800: oklch(44.8% 0.119 151.328); --color-emerald-100: oklch(95% 0.052 163.051); --color-emerald-600: oklch(59.6% 0.145 163.225); --color-emerald-700: oklch(50.8% 0.118 165.612); --color-sky-100: oklch(95.1% 0.026 236.824); --color-blue-50: oklch(97% 0.014 254.604); --color-blue-100: oklch(93.2% 0.032 255.585); --color-blue-200: oklch(88.2% 0.059 254.128); --color-blue-300: oklch(80.9% 0.105 251.813); --color-blue-400: oklch(70.7% 0.165 254.624); --color-blue-500: oklch(62.3% 0.214 259.815); --color-blue-600: oklch(54.6% 0.245 262.881); --color-blue-700: oklch(48.8% 0.243 264.376); --color-blue-800: oklch(42.4% 0.199 265.638); --color-blue-900: oklch(37.9% 0.146 265.522); --color-indigo-50: oklch(96.2% 0.018 272.314); --color-indigo-500: oklch(58.5% 0.233 277.117); --color-indigo-600: oklch(51.1% 0.262 276.966); --color-indigo-700: oklch(45.7% 0.24 277.023); --color-purple-50: oklch(97.7% 0.014 308.299); --color-purple-100: oklch(94.6% 0.033 307.174); --color-purple-200: oklch(90.2% 0.063 306.703); --color-purple-600: oklch(55.8% 0.288 302.321); --color-purple-700: oklch(49.6% 0.265 301.924); --color-pink-100: oklch(94.8% 0.028 342.258); --color-slate-50: oklch(98.4% 0.003 247.858); --color-slate-100: oklch(96.8% 0.007 247.896); --color-slate-200: oklch(92.9% 0.013 255.508); --color-slate-300: oklch(86.9% 0.022 252.894); --color-slate-400: oklch(70.4% 0.04 256.788); --color-slate-500: oklch(55.4% 0.046 257.417); --color-slate-600: oklch(44.6% 0.043 257.281); --color-slate-700: oklch(37.2% 0.044 257.287); --color-slate-800: oklch(27.9% 0.041 260.031); --color-slate-900: oklch(20.8% 0.042 265.755); --color-slate-950: oklch(12.9% 0.042 264.695); --color-gray-50: oklch(98.5% 0.002 247.839); --color-gray-100: oklch(96.7% 0.003 264.542); --color-gray-200: oklch(92.8% 0.006 264.531); --color-gray-300: oklch(87.2% 0.01 258.338); --color-gray-400: oklch(70.7% 0.022 261.325); --color-gray-500: oklch(55.1% 0.027 264.364); --color-gray-600: oklch(44.6% 0.03 256.802); --color-gray-700: oklch(37.3% 0.034 259.733); --color-gray-800: oklch(27.8% 0.033 256.848); --color-gray-900: oklch(21% 0.034 264.665); --color-neutral-100: oklch(97% 0 0); --color-neutral-200: oklch(92.2% 0 0); --color-neutral-700: oklch(37.1% 0 0); --color-black: #000; --color-white: #fff; --spacing: 0.25rem; --breakpoint-lg: 64rem; --container-xs: 20rem; --container-sm: 24rem; --container-md: 28rem; --container-lg: 32rem; --container-xl: 36rem; --container-2xl: 42rem; --container-3xl: 48rem; --container-4xl: 56rem; --container-5xl: 64rem; --container-6xl: 72rem; --container-7xl: 80rem; --text-xs: 0.75rem; --text-xs--line-height: calc(1 / 0.75); --text-sm: 0.875rem; --text-sm--line-height: calc(1.25 / 0.875); --text-base: 1rem; --text-base--line-height: calc(1.5 / 1); --text-lg: 1.125rem; --text-lg--line-height: calc(1.75 / 1.125); --text-xl: 1.25rem; --text-xl--line-height: calc(1.75 / 1.25); --text-2xl: 1.5rem; --text-2xl--line-height: calc(2 / 1.5); --text-3xl: 1.875rem; --text-3xl--line-height: calc(2.25 / 1.875); --text-4xl: 2.25rem; --text-4xl--line-height: calc(2.5 / 2.25); --text-5xl: 3rem; --text-5xl--line-height: 1; --text-6xl: 3.75rem; --text-6xl--line-height: 1; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --font-weight-extrabold: 800; --font-weight-black: 900; --tracking-tight: -0.025em; --tracking-wide: 0.025em; --tracking-wider: 0.05em; --tracking-widest: 0.1em; --leading-tight: 1.25; --leading-snug: 1.375; --leading-normal: 1.5; --leading-relaxed: 1.625; --leading-loose: 2; --radius-sm: 0.25rem; --radius-md: 0.375rem; --radius-lg: 0.5rem; --radius-xl: 0.75rem; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --ease-in: cubic-bezier(0.4, 0, 1, 1); --ease-out: cubic-bezier(0, 0, 0.2, 1); --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); --animate-spin: spin 1s linear infinite; --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite; --animate-bounce: bounce 1s infinite; --blur-sm: 8px; --default-transition-duration: 150ms; --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); --color-fg: var(--color-slate-950); --color-fg-secondary: var(--color-slate-600); --color-surface: var(--color-white); --color-primary: var(--color-blue-700); --color-secondary: #1d4ed8; --color-cta: #f7931a; --color-light: var(--color-gray-100); --text-md: .938rem; --color-container-lighter: var(--color-white); --color-container: var(--color-gray-50); --color-container-darker: var(--color-gray-100); } @layer base { :is( input:where(:not([type])), [type="text"], [type="email"], [type="url"], [type="password"], [type="number"], [type="date"], [type="datetime-local"], [type="month"], [type="search"], [type="tel"], [type="time"], [type="week"], textarea, select, .form-input, .form-textarea, .form-select, .form-multiselect ) { appearance: none; padding-block: var(--form-py); padding-inline: var(--form-px); border-radius: var(--form-radius); border-width: 1px; border-color: var(--form-stroke); background-color: var(--form-bg); color: var(--form-color); --outline-size: 1px; --outline-offset: 0px; &:focus { border-color: var(--form-active-color); outline-color: var(--form-active-color); } } :is(select:where(:not([size]:not([size="1"]), [multiple])), .form-select) { --_icon-position: right; padding-inline-end: calc( var(--select-icon-size) + var(--select-icon-offset) + 0.5ch ); background: var(--select-icon) var(--form-bg) var(--_icon-position) var(--select-icon-offset) center/var(--select-icon-size) no-repeat; -webkit-print-color-adjust: exact; print-color-adjust: exact; &:dir(rtl) { --_icon-position: left; } } :is([type="checkbox"], [type="radio"], .form-checkbox, .form-radio) { appearance: none; flex-shrink: 0; display: inline-block; block-size: calc(var(--spacing) * 4); inline-size: calc(var(--spacing) * 4); padding: 0; border-width: 2px; border-color: var(--form-stroke); background-color: var(--form-bg); color: var(--form-color); background-origin: border-box; vertical-align: middle; user-select: none; print-color-adjust: exact; block-size: calc(var(--spacing) * 4.5); inline-size: calc(var(--spacing) * 4.5); &:focus { outline-color: var(--form-active-color); } &:focus, &:checked { border-color: var(--form-active-color); } } :is([type="checkbox"], .form-checkbox) { &:checked, &:indeterminate { border-color: transparent; background: var(--form-active-color, currentColor) center/contain no-repeat; } &:indeterminate { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E"); } &:checked { background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3E%3C/svg%3E"); } } :is([type="radio"], .form-radio) { border-radius: 50%; &:checked { border-color: transparent; background: var(--form-active-color, currentColor) center/contain no-repeat; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E"); } } } @layer theme, base, components, utilities; @layer theme; @layer base { *, ::after, ::before, ::backdrop, ::file-selector-button { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; } html, :host { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; } hr { height: 0; color: inherit; border-top-width: 1px; } abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } a { color: inherit; -webkit-text-decoration: inherit; text-decoration: inherit; } b, strong { font-weight: bolder; } code, kbd, samp, pre { font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings, normal); font-variation-settings: var(--default-mono-font-variation-settings, normal); font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } table { text-indent: 0; border-color: inherit; border-collapse: collapse; } :-moz-focusring { outline: auto; } progress { vertical-align: baseline; } summary { display: list-item; } ol, ul, menu { list-style: none; } img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; } img, video { max-width: 100%; height: auto; } button, input, select, optgroup, textarea, ::file-selector-button { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; border-radius: 0; background-color: transparent; opacity: 1; } :where(select:is([multiple], [size])) optgroup { font-weight: bolder; } :where(select:is([multiple], [size])) optgroup option { padding-inline-start: 20px; } ::file-selector-button { margin-inline-end: 4px; } ::placeholder { opacity: 1; } @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) { ::placeholder { color: currentcolor; @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, currentcolor 50%, transparent); } } } textarea { resize: vertical; } ::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; } ::-webkit-datetime-edit { display: inline-flex; } ::-webkit-datetime-edit-fields-wrapper { padding: 0; } ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { padding-block: 0; } ::-webkit-calendar-picker-indicator { line-height: 1; } :-moz-ui-invalid { box-shadow: none; } button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button { appearance: button; } ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } [hidden]:where(:not([hidden="until-found"])) { display: none !important; } } @layer utilities { .pointer-events-auto { pointer-events: auto; } .pointer-events-none { pointer-events: none; } .\!visible { visibility: visible !important; } .invisible { visibility: hidden; } .visible { visibility: visible; } .backdrop { position: fixed; inset: 0; background-color: var(--backdrop, hsl(0 0 0 / 20%)); } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } .absolute { position: absolute; } .fixed { position: fixed; } .relative { position: relative; } .static { position: static; } .sticky { position: sticky; } .-inset-4 { inset: calc(var(--spacing) * -4); } .inset-0 { inset: calc(var(--spacing) * 0); } .inset-x-0 { inset-inline: calc(var(--spacing) * 0); } .inset-x-4 { inset-inline: calc(var(--spacing) * 4); } .inset-y-0 { inset-block: calc(var(--spacing) * 0); } .start { inset-inline-start: var(--spacing); } .end { inset-inline-end: var(--spacing); } .-top-0 { top: calc(var(--spacing) * -0); } .-top-1\.5 { top: calc(var(--spacing) * -1.5); } .-top-2 { top: calc(var(--spacing) * -2); } .-top-3 { top: calc(var(--spacing) * -3); } .top-0 { top: calc(var(--spacing) * 0); } .top-0\.5 { top: calc(var(--spacing) * 0.5); } .top-1\/2 { top: calc(1 / 2 * 100%); } .top-2 { top: calc(var(--spacing) * 2); } .top-2\.5 { top: calc(var(--spacing) * 2.5); } .top-3\.5 { top: calc(var(--spacing) * 3.5); } .top-4 { top: calc(var(--spacing) * 4); } .top-6 { top: calc(var(--spacing) * 6); } .top-full { top: 100%; } .-right-0\.5 { right: calc(var(--spacing) * -0.5); } .-right-1\.5 { right: calc(var(--spacing) * -1.5); } .-right-2 { right: calc(var(--spacing) * -2); } .-right-2\.5 { right: calc(var(--spacing) * -2.5); } .right-0 { right: calc(var(--spacing) * 0); } .right-2 { right: calc(var(--spacing) * 2); } .right-2\.5 { right: calc(var(--spacing) * 2.5); } .right-3 { right: calc(var(--spacing) * 3); } .right-3\.5 { right: calc(var(--spacing) * 3.5); } .right-4 { right: calc(var(--spacing) * 4); } .right-8 { right: calc(var(--spacing) * 8); } .bottom-0 { bottom: calc(var(--spacing) * 0); } .bottom-3 { bottom: calc(var(--spacing) * 3); } .bottom-3\.5 { bottom: calc(var(--spacing) * 3.5); } .bottom-4 { bottom: calc(var(--spacing) * 4); } .bottom-\[calc\(theme\(spacing\.5\)_\/_2_-_2px\)\] { bottom: calc(1.25rem / 2 - 2px); } .-left-2 { left: calc(var(--spacing) * -2); } .left-0 { left: calc(var(--spacing) * 0); } .left-0\.5 { left: calc(var(--spacing) * 0.5); } .left-1\/2 { left: calc(1 / 2 * 100%); } .left-4 { left: calc(var(--spacing) * 4); } .left-\[calc\(100\%-1\.25rem\)\] { left: calc(100% - 1.25rem); } .isolate { isolation: isolate; } .-z-10 { z-index: calc(10 * -1); } .z-0 { z-index: 0; } .z-10 { z-index: 10; } .z-20 { z-index: 20; } .z-30 { z-index: 30; } .z-40 { z-index: 40; } .z-50 { z-index: 50; } .z-60 { z-index: 60; } .z-\[70\] { z-index: 70; } .z-\[9999\] { z-index: 9999; } .order-1 { order: 1; } .order-2 { order: 2; } .order-3 { order: 3; } .order-last { order: 9999; } .col-span-1 { grid-column: span 1 / span 1; } .col-span-2 { grid-column: span 2 / span 2; } .col-span-3 { grid-column: span 3 / span 3; } .col-span-4 { grid-column: span 4 / span 4; } .col-span-5 { grid-column: span 5 / span 5; } .col-span-6 { grid-column: span 6 / span 6; } .col-span-8 { grid-column: span 8 / span 8; } .col-span-12 { grid-column: span 12 / span 12; } .col-span-full { grid-column: 1 / -1; } .row-span-1 { grid-row: span 1 / span 1; } .row-span-3 { grid-row: span 3 / span 3; } .float-end { float: inline-end; } .float-left { float: left; } .float-right { float: right; } .clear-left { clear: left; } .container { width: 100%; @media (width >= 40rem) { max-width: 40rem; } @media (width >= 48rem) { max-width: 48rem; } @media (width >= 64rem) { max-width: 64rem; } @media (width >= 71.25rem) { max-width: 71.25rem; } @media (width >= 82.5rem) { max-width: 82.5rem; } } .\!m-0 { margin: calc(var(--spacing) * 0) !important; } .-m-2 { margin: calc(var(--spacing) * -2); } .-m-4 { margin: calc(var(--spacing) * -4); } .m-0 { margin: calc(var(--spacing) * 0); } .m-1 { margin: calc(var(--spacing) * 1); } .m-4 { margin: calc(var(--spacing) * 4); } .m-auto { margin: auto; } .prose { --text-flow: 1em 1rem; --separator-flow: 2.5em; --list-flow: 0.5em; --h-color: initial; --h-family: initial; --h-size: 1.125em; --h-weight: 600; --h-line: 1.1; --h1-size: 3em; --h2-size: 2em; --h3-size: 1.625em; --h4-size: 1.375em; --marker-color: var(--color-primary); --link-color: var(--color-primary); --link-weight: 500; --blockquote-color: var(--color-primary); --table-py: calc(var(--spacing) * 3); --table-px: calc(var(--spacing) * 2); --table-stroke: var(--color-gray-400); --table-bg: canvas; --table-color: canvastext; :where(h1, h2, h3, h4, h5, h6, p, dl, ul, ol, pre, hgroup) { margin-block: var(--text-flow); } :where(blockquote, figure, hr) { margin-block: var(--separator-flow); margin-inline: 0; } :where([class~="lead"]) { font-size: 1.25em; } :where(h1, h2, h3, h4, h5, h6) { color: var(--h-color); font-family: var(--h-family); font-size: var(--h-size); font-weight: var(--h-weight); line-height: var(--h-line); text-wrap: balance; } :where(h1) { --h-size: var(--h1-size); } :where(h2) { --h-size: var(--h2-size); } :where(h3) { --h-size: var(--h3-size); } :where(h4) { --h-size: var(--h4-size); } ::marker { color: var(--marker-color); } :where(ul, ol) { list-style: revert; padding-inline-start: 2em; } :where(ol[type="a"]) { list-style-type: lower-alpha; } :where(ol[type="i"]) { list-style-type: lower-roman; } :where(ol[type="1"]) { list-style-type: decimal; } :where(blockquote) { border-inline-start: 4px solid var(--blockquote-color); padding-inline-start: 1.5em; padding-block: 0.25em; } :where(:any-link) { color: var(--link-color); font-weight: var(--link-weight); &:hover { text-decoration: underline; } } :where(table) { border-collapse: separate; border-spacing: 0; border-color: var(--table-stroke); } :where(thead, tbody, tfoot, tr, th, td) { border-color: inherit; text-align: inherit; } :where(th, td) { padding-block: var(--table-py); padding-inline: var(--table-px); background: var(--table-bg); color: var(--table-color); } :where(tr + tr :is(th, td)) { border-block-start-width: 1px; } :where(thead tr:last-child :is(th, td)) { border-block-end-width: 2px; } :where(tfoot tr:first-child :is(th, td)) { border-block-start-width: 2px; } :where(table:not(:has(.table-wrapper, [class*="overflow-"]))) { word-break: break-all; } > :where(:first-child) { margin-block-start: 0; } > :where(:last-child) { margin-block-end: 0; } } .container { margin-inline: auto; padding-inline: calc(var(--spacing) * 4); @media (width >= 0) { max-width: var(--container-7xl); } } .-mx-1 { margin-inline: calc(var(--spacing) * -1); } .-mx-2 { margin-inline: calc(var(--spacing) * -2); } .-mx-3 { margin-inline: calc(var(--spacing) * -3); } .mx-1 { margin-inline: calc(var(--spacing) * 1); } .mx-2 { margin-inline: calc(var(--spacing) * 2); } .mx-4 { margin-inline: calc(var(--spacing) * 4); } .mx-6 { margin-inline: calc(var(--spacing) * 6); } .mx-auto { margin-inline: auto; } .my-0 { margin-block: calc(var(--spacing) * 0); } .my-1 { margin-block: calc(var(--spacing) * 1); } .my-2 { margin-block: calc(var(--spacing) * 2); } .my-3 { margin-block: calc(var(--spacing) * 3); } .my-4 { margin-block: calc(var(--spacing) * 4); } .my-6 { margin-block: calc(var(--spacing) * 6); } .my-8 { margin-block: calc(var(--spacing) * 8); } .my-12 { margin-block: calc(var(--spacing) * 12); } .-ms-0\.5 { margin-inline-start: calc(var(--spacing) * -0.5); } .ms-0 { margin-inline-start: calc(var(--spacing) * 0); } .ms-7 { margin-inline-start: calc(var(--spacing) * 7); } .ms-8 { margin-inline-start: calc(var(--spacing) * 8); } .-me-4 { margin-inline-end: calc(var(--spacing) * -4); } .me-0 { margin-inline-end: calc(var(--spacing) * 0); } .me-1\.5 { margin-inline-end: calc(var(--spacing) * 1.5); } .me-2 { margin-inline-end: calc(var(--spacing) * 2); } .me-3 { margin-inline-end: calc(var(--spacing) * 3); } .me-auto { margin-inline-end: auto; } .prose { color: var(--tw-prose-body); max-width: 65ch; :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; margin-bottom: 1.25em; } :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-lead); font-size: 1.25em; line-height: 1.6; margin-top: 1.2em; margin-bottom: 1.2em; } :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-links); text-decoration: underline; font-weight: 500; } :where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-bold); font-weight: 600; } :where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: decimal; margin-top: 1.25em; margin-bottom: 1.25em; padding-inline-start: 1.625em; } :where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-alpha; } :where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-alpha; } :where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-alpha; } :where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-alpha; } :where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-roman; } :where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-roman; } :where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-roman; } :where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-roman; } :where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: decimal; } :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: disc; margin-top: 1.25em; margin-bottom: 1.25em; padding-inline-start: 1.625em; } :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker { font-weight: 400; color: var(--tw-prose-counters); } :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker { color: var(--tw-prose-bullets); } :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; margin-top: 1.25em; } :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-color: var(--tw-prose-hr); border-top-width: 1px; margin-top: 3em; margin-bottom: 3em; } :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 500; font-style: italic; color: var(--tw-prose-quotes); border-inline-start-width: 0.25rem; border-inline-start-color: var(--tw-prose-quote-borders); quotes: "\201C""\201D""\2018""\2019"; margin-top: 1.6em; margin-bottom: 1.6em; padding-inline-start: 1em; } :where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before { content: open-quote; } :where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after { content: close-quote; } :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 800; font-size: 2.25em; margin-top: 0; margin-bottom: 0.8888889em; line-height: 1.1111111; } :where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 900; color: inherit; } :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 700; font-size: 1.5em; margin-top: 2em; margin-bottom: 1em; line-height: 1.3333333; } :where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 800; color: inherit; } :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; font-size: 1.25em; margin-top: 1.6em; margin-bottom: 0.6em; line-height: 1.6; } :where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 700; color: inherit; } :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; margin-top: 1.5em; margin-bottom: 0.5em; line-height: 1.5; } :where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 700; color: inherit; } :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) { display: block; margin-top: 2em; margin-bottom: 2em; } :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 500; font-family: inherit; color: var(--tw-prose-kbd); box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows); font-size: 0.875em; border-radius: 0.3125rem; padding-top: 0.1875em; padding-inline-end: 0.375em; padding-bottom: 0.1875em; padding-inline-start: 0.375em; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-code); font-weight: 600; font-size: 0.875em; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before { content: "`"; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after { content: "`"; } :where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; font-size: 0.875em; } :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; font-size: 0.9em; } :where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-pre-code); background-color: var(--tw-prose-pre-bg); overflow-x: auto; font-weight: 400; font-size: 0.875em; line-height: 1.7142857; margin-top: 1.7142857em; margin-bottom: 1.7142857em; border-radius: 0.375rem; padding-top: 0.8571429em; padding-inline-end: 1.1428571em; padding-bottom: 0.8571429em; padding-inline-start: 1.1428571em; } :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { background-color: transparent; border-width: 0; border-radius: 0; padding: 0; font-weight: inherit; color: inherit; font-size: inherit; font-family: inherit; line-height: inherit; } :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before { content: none; } :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after { content: none; } :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) { width: 100%; table-layout: auto; margin-top: 2em; margin-bottom: 2em; font-size: 0.875em; line-height: 1.7142857; } :where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-bottom-width: 1px; border-bottom-color: var(--tw-prose-th-borders); } :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; vertical-align: bottom; padding-inline-end: 0.5714286em; padding-bottom: 0.5714286em; padding-inline-start: 0.5714286em; } :where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-bottom-width: 1px; border-bottom-color: var(--tw-prose-td-borders); } :where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-bottom-width: 0; } :where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { vertical-align: baseline; } :where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-top-width: 1px; border-top-color: var(--tw-prose-th-borders); } :where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { vertical-align: top; } :where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { text-align: start; } :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-captions); font-size: 0.875em; line-height: 1.4285714; margin-top: 0.8571429em; } --tw-prose-body: oklch(37.3% 0.034 259.733); --tw-prose-headings: oklch(21% 0.034 264.665); --tw-prose-lead: oklch(44.6% 0.03 256.802); --tw-prose-links: oklch(21% 0.034 264.665); --tw-prose-bold: oklch(21% 0.034 264.665); --tw-prose-counters: oklch(55.1% 0.027 264.364); --tw-prose-bullets: oklch(87.2% 0.01 258.338); --tw-prose-hr: oklch(92.8% 0.006 264.531); --tw-prose-quotes: oklch(21% 0.034 264.665); --tw-prose-quote-borders: oklch(92.8% 0.006 264.531); --tw-prose-captions: oklch(55.1% 0.027 264.364); --tw-prose-kbd: oklch(21% 0.034 264.665); --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent); --tw-prose-code: oklch(21% 0.034 264.665); --tw-prose-pre-code: oklch(92.8% 0.006 264.531); --tw-prose-pre-bg: oklch(27.8% 0.033 256.848); --tw-prose-th-borders: oklch(87.2% 0.01 258.338); --tw-prose-td-borders: oklch(92.8% 0.006 264.531); --tw-prose-invert-body: oklch(87.2% 0.01 258.338); --tw-prose-invert-headings: #fff; --tw-prose-invert-lead: oklch(70.7% 0.022 261.325); --tw-prose-invert-links: #fff; --tw-prose-invert-bold: #fff; --tw-prose-invert-counters: oklch(70.7% 0.022 261.325); --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802); --tw-prose-invert-hr: oklch(37.3% 0.034 259.733); --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542); --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733); --tw-prose-invert-captions: oklch(70.7% 0.022 261.325); --tw-prose-invert-kbd: #fff; --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%); --tw-prose-invert-code: #fff; --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338); --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%); --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802); --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733); font-size: 1rem; line-height: 1.75; :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.5em; margin-bottom: 0.5em; } :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.375em; } :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.375em; } :where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.75em; margin-bottom: 0.75em; } :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; } :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.25em; } :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; } :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.25em; } :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.75em; margin-bottom: 0.75em; } :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; margin-bottom: 1.25em; } :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.5em; padding-inline-start: 1.625em; } :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-top: 0.5714286em; padding-inline-end: 0.5714286em; padding-bottom: 0.5714286em; padding-inline-start: 0.5714286em; } :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 0; } } .prose-lg { font-size: 1.125rem; line-height: 1.7777778; :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; margin-bottom: 1.3333333em; } :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 1.2222222em; line-height: 1.4545455; margin-top: 1.0909091em; margin-bottom: 1.0909091em; } :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.6666667em; margin-bottom: 1.6666667em; padding-inline-start: 1em; } :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 2.6666667em; margin-top: 0; margin-bottom: 0.8333333em; line-height: 1; } :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 1.6666667em; margin-top: 1.8666667em; margin-bottom: 1.0666667em; line-height: 1.3333333; } :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 1.3333333em; margin-top: 1.6666667em; margin-bottom: 0.6666667em; line-height: 1.5; } :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7777778em; margin-bottom: 0.4444444em; line-height: 1.5555556; } :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7777778em; margin-bottom: 1.7777778em; } :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7777778em; margin-bottom: 1.7777778em; } :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7777778em; margin-bottom: 1.7777778em; } :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8888889em; border-radius: 0.3125rem; padding-top: 0.2222222em; padding-inline-end: 0.4444444em; padding-bottom: 0.2222222em; padding-inline-start: 0.4444444em; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8888889em; } :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8666667em; } :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.875em; } :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8888889em; line-height: 1.75; margin-top: 2em; margin-bottom: 2em; border-radius: 0.375rem; padding-top: 1em; padding-inline-end: 1.5em; padding-bottom: 1em; padding-inline-start: 1.5em; } :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; margin-bottom: 1.3333333em; padding-inline-start: 1.5555556em; } :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; margin-bottom: 1.3333333em; padding-inline-start: 1.5555556em; } :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.6666667em; margin-bottom: 0.6666667em; } :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.4444444em; } :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.4444444em; } :where(.prose-lg > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.8888889em; margin-bottom: 0.8888889em; } :where(.prose-lg > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; } :where(.prose-lg > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.3333333em; } :where(.prose-lg > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; } :where(.prose-lg > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.3333333em; } :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.8888889em; margin-bottom: 0.8888889em; } :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; margin-bottom: 1.3333333em; } :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; } :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.6666667em; padding-inline-start: 1.5555556em; } :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 3.1111111em; margin-bottom: 3.1111111em; } :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8888889em; line-height: 1.5; } :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0.75em; padding-bottom: 0.75em; padding-inline-start: 0.75em; } :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-top: 0.75em; padding-inline-end: 0.75em; padding-bottom: 0.75em; padding-inline-start: 0.75em; } :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7777778em; margin-bottom: 1.7777778em; } :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8888889em; line-height: 1.5; margin-top: 1em; } :where(.prose-lg > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(.prose-lg > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 0; } } .prose-sm { font-size: 0.875rem; line-height: 1.7142857; :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.1428571em; margin-bottom: 1.1428571em; } :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 1.2857143em; line-height: 1.5555556; margin-top: 0.8888889em; margin-bottom: 0.8888889em; } :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.3333333em; margin-bottom: 1.3333333em; padding-inline-start: 1.1111111em; } :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 2.1428571em; margin-top: 0; margin-bottom: 0.8em; line-height: 1.2; } :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 1.4285714em; margin-top: 1.6em; margin-bottom: 0.8em; line-height: 1.4; } :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 1.2857143em; margin-top: 1.5555556em; margin-bottom: 0.4444444em; line-height: 1.5555556; } :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.4285714em; margin-bottom: 0.5714286em; line-height: 1.4285714; } :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7142857em; margin-bottom: 1.7142857em; } :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7142857em; margin-bottom: 1.7142857em; } :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7142857em; margin-bottom: 1.7142857em; } :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8571429em; border-radius: 0.3125rem; padding-top: 0.1428571em; padding-inline-end: 0.3571429em; padding-bottom: 0.1428571em; padding-inline-start: 0.3571429em; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8571429em; } :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.9em; } :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8888889em; } :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8571429em; line-height: 1.6666667; margin-top: 1.6666667em; margin-bottom: 1.6666667em; border-radius: 0.25rem; padding-top: 0.6666667em; padding-inline-end: 1em; padding-bottom: 0.6666667em; padding-inline-start: 1em; } :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.1428571em; margin-bottom: 1.1428571em; padding-inline-start: 1.5714286em; } :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.1428571em; margin-bottom: 1.1428571em; padding-inline-start: 1.5714286em; } :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.2857143em; margin-bottom: 0.2857143em; } :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.4285714em; } :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.4285714em; } :where(.prose-sm > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.5714286em; margin-bottom: 0.5714286em; } :where(.prose-sm > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.1428571em; } :where(.prose-sm > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.1428571em; } :where(.prose-sm > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.1428571em; } :where(.prose-sm > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.1428571em; } :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.5714286em; margin-bottom: 0.5714286em; } :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.1428571em; margin-bottom: 1.1428571em; } :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.1428571em; } :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.2857143em; padding-inline-start: 1.5714286em; } :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 2.8571429em; margin-bottom: 2.8571429em; } :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8571429em; line-height: 1.5; } :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 1em; padding-bottom: 0.6666667em; padding-inline-start: 1em; } :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-top: 0.6666667em; padding-inline-end: 1em; padding-bottom: 0.6666667em; padding-inline-start: 1em; } :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.7142857em; margin-bottom: 1.7142857em; } :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-size: 0.8571429em; line-height: 1.3333333; margin-top: 0.6666667em; } :where(.prose-sm > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(.prose-sm > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 0; } } .\!mt-0 { margin-top: calc(var(--spacing) * 0) !important; } .-mt-1 { margin-top: calc(var(--spacing) * -1); } .-mt-2 { margin-top: calc(var(--spacing) * -2); } .-mt-3 { margin-top: calc(var(--spacing) * -3); } .-mt-5 { margin-top: calc(var(--spacing) * -5); } .-mt-6 { margin-top: calc(var(--spacing) * -6); } .-mt-8 { margin-top: calc(var(--spacing) * -8); } .-mt-px { margin-top: -1px; } .mt-0 { margin-top: calc(var(--spacing) * 0); } .mt-0\.5 { margin-top: calc(var(--spacing) * 0.5); } .mt-1 { margin-top: calc(var(--spacing) * 1); } .mt-1\.5 { margin-top: calc(var(--spacing) * 1.5); } .mt-2 { margin-top: calc(var(--spacing) * 2); } .mt-2\.5 { margin-top: calc(var(--spacing) * 2.5); } .mt-3 { margin-top: calc(var(--spacing) * 3); } .mt-4 { margin-top: calc(var(--spacing) * 4); } .mt-5 { margin-top: calc(var(--spacing) * 5); } .mt-6 { margin-top: calc(var(--spacing) * 6); } .mt-8 { margin-top: calc(var(--spacing) * 8); } .mt-10 { margin-top: calc(var(--spacing) * 10); } .mt-12 { margin-top: calc(var(--spacing) * 12); } .mt-16 { margin-top: calc(var(--spacing) * 16); } .mt-\[3px\] { margin-top: 3px; } .mt-\[auto\] { margin-top: auto; } .mt-auto { margin-top: auto; } .\!mr-2 { margin-right: calc(var(--spacing) * 2) !important; } .-mr-1 { margin-right: calc(var(--spacing) * -1); } .-mr-2 { margin-right: calc(var(--spacing) * -2); } .-mr-3 { margin-right: calc(var(--spacing) * -3); } .-mr-4 { margin-right: calc(var(--spacing) * -4); } .-mr-6 { margin-right: calc(var(--spacing) * -6); } .-mr-px { margin-right: -1px; } .mr-0 { margin-right: calc(var(--spacing) * 0); } .mr-1 { margin-right: calc(var(--spacing) * 1); } .mr-1\.5 { margin-right: calc(var(--spacing) * 1.5); } .mr-2 { margin-right: calc(var(--spacing) * 2); } .mr-3 { margin-right: calc(var(--spacing) * 3); } .mr-4 { margin-right: calc(var(--spacing) * 4); } .mr-5 { margin-right: calc(var(--spacing) * 5); } .mr-8 { margin-right: calc(var(--spacing) * 8); } .mr-10 { margin-right: calc(var(--spacing) * 10); } .mr-auto { margin-right: auto; } .mb-0 { margin-bottom: calc(var(--spacing) * 0); } .mb-1 { margin-bottom: calc(var(--spacing) * 1); } .mb-2 { margin-bottom: calc(var(--spacing) * 2); } .mb-3 { margin-bottom: calc(var(--spacing) * 3); } .mb-4 { margin-bottom: calc(var(--spacing) * 4); } .mb-5 { margin-bottom: calc(var(--spacing) * 5); } .mb-6 { margin-bottom: calc(var(--spacing) * 6); } .mb-8 { margin-bottom: calc(var(--spacing) * 8); } .mb-10 { margin-bottom: calc(var(--spacing) * 10); } .mb-12 { margin-bottom: calc(var(--spacing) * 12); } .mb-24 { margin-bottom: calc(var(--spacing) * 24); } .\!ml-0 { margin-left: calc(var(--spacing) * 0) !important; } .-ml-4 { margin-left: calc(var(--spacing) * -4); } .-ml-px { margin-left: -1px; } .ml-0 { margin-left: calc(var(--spacing) * 0); } .ml-1 { margin-left: calc(var(--spacing) * 1); } .ml-1\.5 { margin-left: calc(var(--spacing) * 1.5); } .ml-2 { margin-left: calc(var(--spacing) * 2); } .ml-3 { margin-left: calc(var(--spacing) * 3); } .ml-4 { margin-left: calc(var(--spacing) * 4); } .ml-6 { margin-left: calc(var(--spacing) * 6); } .ml-10 { margin-left: calc(var(--spacing) * 10); } .ml-auto { margin-left: auto; } .box-border { box-sizing: border-box; } .box-content { box-sizing: content-box; } .snap { scroll-snap-type: x var(--tw-scroll-snap-strictness); --tw-scroll-snap-strictness: mandatory; scroll-behavior: smooth; &>* { scroll-snap-align: start; } scrollbar-width: none; &::-webkit-scrollbar { display: none; } } .btn { --btn-stroke: #0000; --btn-bg: color-mix(in srgb, oklch(48.8% 0.243 264.376) 10%, #0000); @supports (color: color-mix(in lab, red, red)) { --btn-bg: color-mix(in srgb, var(--color-primary) 10%, #0000); } --btn-hover-bg: color-mix(in srgb, oklch(48.8% 0.243 264.376) 20%, #0000); @supports (color: color-mix(in lab, red, red)) { --btn-hover-bg: color-mix(in srgb, var(--color-primary) 20%, #0000); } --btn-active-bg: color-mix(in srgb, oklch(48.8% 0.243 264.376) 30%, #0000); @supports (color: color-mix(in lab, red, red)) { --btn-active-bg: color-mix(in srgb, var(--color-primary) 30%, #0000); } --btn-color: var(--color-fg); display: inline-flex; justify-content: center; align-items: center; gap: calc(var(--spacing) * 1.5); padding-block: calc(var(--spacing) * 2); padding-inline: calc(var(--spacing) * 4); border-radius: var(--radius-lg); border-width: 2px; border-color: var(--btn-stroke); background-color: var(--btn-bg); color: var(--btn-color); font-weight: 500; user-select: none; vertical-align: middle; transition-property: color, background-color, border-color, outline-color; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); &:hover { border-color: var(--btn-hover-stroke, var(--btn-stroke)); background-color: var(--btn-hover-bg, var(--btn-bg)); color: var(--btn-hover-color, var(--btn-color)); text-decoration: none; } &:is(:active, .is-active, [aria-current="page"], [aria-current="true"]) { border-color: var(--btn-active-stroke, var(--btn-stroke)); background-color: var(--btn-active-bg, var(--btn-bg)); color: var(--btn-active-color, var(--btn-color)); } &:is(:disabled, [aria-disabled="true"]) { border-color: var(--btn-disabled-stroke, var(--color-gray-200)); background-color: var(--btn-disabled-bg, var(--color-gray-50)); color: var(--btn-disabled-color, var(--color-gray-500)); } } .line-clamp-2 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .line-clamp-3 { overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } .\!flex { display: flex !important; } .\!hidden { display: none !important; } .block { display: block; } .contents { display: contents; } .flex { display: flex; } .flow-root { display: flow-root; } .grid { display: grid; } .hidden { display: none; } .inline { display: inline; } .inline-block { display: inline-block; } .inline-flex { display: inline-flex; } .list-none { &::-webkit-details-marker { display: none; } } .table { display: table; } .table-caption { display: table-caption; } .table-cell { display: table-cell; } .table-row { display: table-row; } .aspect-1\/1 { aspect-ratio: 1/1; } .aspect-4\/3 { aspect-ratio: 4/3; } .aspect-\[16\/9\] { aspect-ratio: 16/9; } .aspect-\[16\/10\] { aspect-ratio: 16/10; } .aspect-\[var\(--gallery-ratio\)\] { aspect-ratio: var(--gallery-ratio); } .aspect-square { aspect-ratio: 1 / 1; } .size-5 { width: calc(var(--spacing) * 5); height: calc(var(--spacing) * 5); } .size-full { width: 100%; height: 100%; } .h-1 { height: calc(var(--spacing) * 1); } .h-2 { height: calc(var(--spacing) * 2); } .h-2\.5 { height: calc(var(--spacing) * 2.5); } .h-3 { height: calc(var(--spacing) * 3); } .h-3\.5 { height: calc(var(--spacing) * 3.5); } .h-4 { height: calc(var(--spacing) * 4); } .h-5 { height: calc(var(--spacing) * 5); } .h-6 { height: calc(var(--spacing) * 6); } .h-7 { height: calc(var(--spacing) * 7); } .h-8 { height: calc(var(--spacing) * 8); } .h-9 { height: calc(var(--spacing) * 9); } .h-10 { height: calc(var(--spacing) * 10); } .h-11 { height: calc(var(--spacing) * 11); } .h-12 { height: calc(var(--spacing) * 12); } .h-14 { height: calc(var(--spacing) * 14); } .h-16 { height: calc(var(--spacing) * 16); } .h-20 { height: calc(var(--spacing) * 20); } .h-24 { height: calc(var(--spacing) * 24); } .h-28 { height: calc(var(--spacing) * 28); } .h-40 { height: calc(var(--spacing) * 40); } .h-44 { height: calc(var(--spacing) * 44); } .h-48 { height: calc(var(--spacing) * 48); } .h-52 { height: calc(var(--spacing) * 52); } .h-96 { height: calc(var(--spacing) * 96); } .h-\[1\.125rem\] { height: 1.125rem; } .h-\[4px\] { height: 4px; } .h-\[25px\] { height: 25px; } .h-auto { height: auto; } .h-full { height: 100%; } .h-screen { height: 100vh; } .max-h-8 { max-height: calc(var(--spacing) * 8); } .max-h-12 { max-height: calc(var(--spacing) * 12); } .max-h-16 { max-height: calc(var(--spacing) * 16); } .max-h-\[50vh\] { max-height: 50vh; } .max-h-\[60vh\] { max-height: 60vh; } .max-h-\[75vh\] { max-height: 75vh; } .max-h-\[min\(1024px\,\(100\%_-_2rem\)\)\] { max-height: min(1024px, (100% - 2rem)); } .max-h-full { max-height: 100%; } .max-h-screen { max-height: 100vh; } .min-h-14 { min-height: calc(var(--spacing) * 14); } .min-h-80 { min-height: calc(var(--spacing) * 80); } .min-h-\[20px\] { min-height: 20px; } .min-h-screen { min-height: 100vh; } .w-0 { width: calc(var(--spacing) * 0); } .w-1 { width: calc(var(--spacing) * 1); } .w-1\/2 { width: calc(1 / 2 * 100%); } .w-2 { width: calc(var(--spacing) * 2); } .w-2\.5 { width: calc(var(--spacing) * 2.5); } .w-3 { width: calc(var(--spacing) * 3); } .w-3\.5 { width: calc(var(--spacing) * 3.5); } .w-3\/4 { width: calc(3 / 4 * 100%); } .w-4 { width: calc(var(--spacing) * 4); } .w-4\/12 { width: calc(4 / 12 * 100%); } .w-5 { width: calc(var(--spacing) * 5); } .w-5\/12 { width: calc(5 / 12 * 100%); } .w-6 { width: calc(var(--spacing) * 6); } .w-7\/12 { width: calc(7 / 12 * 100%); } .w-8 { width: calc(var(--spacing) * 8); } .w-8\/12 { width: calc(8 / 12 * 100%); } .w-9 { width: calc(var(--spacing) * 9); } .w-10 { width: calc(var(--spacing) * 10); } .w-10\/12 { width: calc(10 / 12 * 100%); } .w-11 { width: calc(var(--spacing) * 11); } .w-11\/12 { width: calc(11 / 12 * 100%); } .w-12 { width: calc(var(--spacing) * 12); } .w-14 { width: calc(var(--spacing) * 14); } .w-16 { width: calc(var(--spacing) * 16); } .w-20 { width: calc(var(--spacing) * 20); } .w-24 { width: calc(var(--spacing) * 24); } .w-28 { width: calc(var(--spacing) * 28); } .w-32 { width: calc(var(--spacing) * 32); } .w-36 { width: calc(var(--spacing) * 36); } .w-40 { width: calc(var(--spacing) * 40); } .w-44 { width: calc(var(--spacing) * 44); } .w-52 { width: calc(var(--spacing) * 52); } .w-56 { width: calc(var(--spacing) * 56); } .w-60 { width: calc(var(--spacing) * 60); } .w-64 { width: calc(var(--spacing) * 64); } .w-80 { width: calc(var(--spacing) * 80); } .w-96 { width: calc(var(--spacing) * 96); } .w-100 { width: calc(var(--spacing) * 100); } .w-\[1\.125rem\] { width: 1.125rem; } .w-\[480px\] { width: 480px; } .w-\[var\(--gallery-width\)\] { width: var(--gallery-width); } .w-auto { width: auto; } .w-fit { width: fit-content; } .w-full { width: 100%; } .w-screen { width: 100vw; } .w-xl { width: var(--container-xl); } .max-w-2xl { max-width: var(--container-2xl); } .max-w-3xl { max-width: var(--container-3xl); } .max-w-4xl { max-width: var(--container-4xl); } .max-w-5xl { max-width: var(--container-5xl); } .max-w-6xl { max-width: var(--container-6xl); } .max-w-7xl { max-width: var(--container-7xl); } .max-w-80 { max-width: calc(var(--spacing) * 80); } .max-w-\[6rem\] { max-width: 6rem; } .max-w-\[25\%\] { max-width: 25%; } .max-w-\[85vw\] { max-width: 85vw; } .max-w-\[95vw\] { max-width: 95vw; } .max-w-\[min\(1280px\,\(100\%_-_2rem\)\)\] { max-width: min(1280px, (100% - 2rem)); } .max-w-\[theme\(spacing\.20\)\] { max-width: 5rem; } .max-w-fit { max-width: fit-content; } .max-w-full { max-width: 100%; } .max-w-lg { max-width: var(--container-lg); } .max-w-md { max-width: var(--container-md); } .max-w-none { max-width: none; } .max-w-prose { max-width: 65ch; } .max-w-screen-lg { max-width: var(--breakpoint-lg); } .max-w-xl { max-width: var(--container-xl); } .max-w-xs { max-width: var(--container-xs); } .\!min-w-0 { min-width: calc(var(--spacing) * 0) !important; } .min-w-0 { min-width: calc(var(--spacing) * 0); } .min-w-4 { min-width: calc(var(--spacing) * 4); } .min-w-9\.5 { min-width: calc(var(--spacing) * 9.5); } .min-w-16 { min-width: calc(var(--spacing) * 16); } .min-w-20 { min-width: calc(var(--spacing) * 20); } .min-w-40 { min-width: calc(var(--spacing) * 40); } .min-w-48 { min-width: calc(var(--spacing) * 48); } .min-w-80 { min-width: calc(var(--spacing) * 80); } .min-w-\[1\.25rem\] { min-width: 1.25rem; } .min-w-\[25px\] { min-width: 25px; } .min-w-\[80\%\] { min-width: 80%; } .min-w-\[100px\] { min-width: 100px; } .min-w-full { min-width: 100%; } .flex-1 { flex: 1; } .flex-\[0_0_10\%\] { flex: 0 0 10%; } .flex-\[0_0_80\%\] { flex: 0 0 80%; } .flex-\[0_0_85px\] { flex: 0 0 85px; } .flex-auto { flex: auto; } .flex-none { flex: none; } .flex-shrink-0 { flex-shrink: 0; } .flex-shrink-0 { flex-shrink: 0; } .shrink { flex-shrink: 1; } .shrink-0 { flex-shrink: 0; } .flex-grow { flex-grow: 1; } .flex-grow { flex-grow: 1; } .grow { flex-grow: 1; } .grow-0 { flex-grow: 0; } .grow-1 { flex-grow: 1; } .table-auto { table-layout: auto; } .origin-bottom-left { transform-origin: 0 100%; } .origin-top-left { transform-origin: 0 0; } .origin-top-right { transform-origin: 100% 0; } .-translate-x-1\/2 { --tw-translate-x: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-x-5 { --tw-translate-x: calc(var(--spacing) * -5); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-x-full { --tw-translate-x: -100%; translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-0 { --tw-translate-x: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-4 { --tw-translate-x: calc(var(--spacing) * 4); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-5 { --tw-translate-x: calc(var(--spacing) * 5); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-8 { --tw-translate-x: calc(var(--spacing) * 8); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-x-full { --tw-translate-x: 100%; translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-y-1\/2 { --tw-translate-y: calc(calc(1 / 2 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-y-8 { --tw-translate-y: calc(var(--spacing) * -8); translate: var(--tw-translate-x) var(--tw-translate-y); } .-translate-y-full { --tw-translate-y: -100%; translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-0 { --tw-translate-y: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-1\/2 { --tw-translate-y: calc(1 / 2 * 100%); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-3 { --tw-translate-y: calc(var(--spacing) * 3); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-4 { --tw-translate-y: calc(var(--spacing) * 4); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-12 { --tw-translate-y: calc(var(--spacing) * 12); translate: var(--tw-translate-x) var(--tw-translate-y); } .translate-y-full { --tw-translate-y: 100%; translate: var(--tw-translate-x) var(--tw-translate-y); } .scale-0 { --tw-scale-x: 0%; --tw-scale-y: 0%; --tw-scale-z: 0%; scale: var(--tw-scale-x) var(--tw-scale-y); } .scale-80 { --tw-scale-x: 80%; --tw-scale-y: 80%; --tw-scale-z: 80%; scale: var(--tw-scale-x) var(--tw-scale-y); } .scale-95 { --tw-scale-x: 95%; --tw-scale-y: 95%; --tw-scale-z: 95%; scale: var(--tw-scale-x) var(--tw-scale-y); } .scale-100 { --tw-scale-x: 100%; --tw-scale-y: 100%; --tw-scale-z: 100%; scale: var(--tw-scale-x) var(--tw-scale-y); } .-rotate-180 { rotate: calc(180deg * -1); } .rotate-45 { rotate: 45deg; } .rotate-180 { rotate: 180deg; } .transform { transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,); } .animate-bounce { animation: var(--animate-bounce); } .animate-ping { animation: var(--animate-ping); } .animate-spin { animation: var(--animate-spin); } .cursor-default { cursor: default; } .cursor-not-allowed { cursor: not-allowed; } .cursor-pointer { cursor: pointer; } .cursor-wait { cursor: wait; } .resize { resize: both; } .list-outside { list-style-position: outside; } .list-disc { list-style-type: disc; } .list-none { list-style-type: none; } .appearance-none { appearance: none; } .grid-flow-row { grid-auto-flow: row; } .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .grid-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); } .grid-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } .grid-cols-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); } .grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .grid-cols-\[1\.5fr_1fr\] { grid-template-columns: 1.5fr 1fr; } .grid-cols-\[auto_1fr\] { grid-template-columns: auto 1fr; } .grid-cols-\[auto_minmax\(0px\,1fr\)_auto\] { grid-template-columns: auto minmax(0px,1fr) auto; } .flex-col { flex-direction: column; } .flex-col-reverse { flex-direction: column-reverse; } .flex-row { flex-direction: row; } .flex-row-reverse { flex-direction: row-reverse; } .flex-nowrap { flex-wrap: nowrap; } .flex-wrap { flex-wrap: wrap; } .place-items-center { place-items: center; } .content-center { align-content: center; } .items-baseline { align-items: baseline; } .items-center { align-items: center; } .items-end { align-items: flex-end; } .items-start { align-items: flex-start; } .items-stretch { align-items: stretch; } .justify-between { justify-content: space-between; } .justify-center { justify-content: center; } .justify-end { justify-content: flex-end; } .justify-evenly { justify-content: space-evenly; } .justify-start { justify-content: flex-start; } .gap-1 { gap: calc(var(--spacing) * 1); } .gap-1\.5 { gap: calc(var(--spacing) * 1.5); } .gap-2 { gap: calc(var(--spacing) * 2); } .gap-2\.5 { gap: calc(var(--spacing) * 2.5); } .gap-3 { gap: calc(var(--spacing) * 3); } .gap-4 { gap: calc(var(--spacing) * 4); } .gap-6 { gap: calc(var(--spacing) * 6); } .gap-7 { gap: calc(var(--spacing) * 7); } .gap-8 { gap: calc(var(--spacing) * 8); } .gap-12 { gap: calc(var(--spacing) * 12); } .gap-20 { gap: calc(var(--spacing) * 20); } .space-y-1 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-2 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-2\.5 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 2.5) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 2.5) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-3 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-4 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-5 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 5) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 5) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-6 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))); } } .space-y-10 { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse))); } } .gap-x-1 { column-gap: calc(var(--spacing) * 1); } .gap-x-1\.5 { column-gap: calc(var(--spacing) * 1.5); } .gap-x-2 { column-gap: calc(var(--spacing) * 2); } .gap-x-2\.5 { column-gap: calc(var(--spacing) * 2.5); } .gap-x-3 { column-gap: calc(var(--spacing) * 3); } .gap-x-4 { column-gap: calc(var(--spacing) * 4); } .gap-x-6 { column-gap: calc(var(--spacing) * 6); } .gap-x-7 { column-gap: calc(var(--spacing) * 7); } .gap-x-8 { column-gap: calc(var(--spacing) * 8); } .gap-x-12 { column-gap: calc(var(--spacing) * 12); } .-space-x-0\.5 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * -0.5) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * -0.5) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-0\.5 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 0.5) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 0.5) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-0\.25 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 0.25) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 0.25) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-1 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-2 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-4 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-6 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 6) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-8 { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 8) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-x-reverse))); } } .space-x-reverse { :where(& > :not(:last-child)) { --tw-space-x-reverse: 1; } } .gap-y-0 { row-gap: calc(var(--spacing) * 0); } .gap-y-2 { row-gap: calc(var(--spacing) * 2); } .gap-y-3 { row-gap: calc(var(--spacing) * 3); } .gap-y-4 { row-gap: calc(var(--spacing) * 4); } .gap-y-6 { row-gap: calc(var(--spacing) * 6); } .gap-y-10 { row-gap: calc(var(--spacing) * 10); } .gap-y-12 { row-gap: calc(var(--spacing) * 12); } .gap-y-16 { row-gap: calc(var(--spacing) * 16); } .divide-x { :where(& > :not(:last-child)) { --tw-divide-x-reverse: 0; border-inline-style: var(--tw-border-style); border-inline-start-width: calc(1px * var(--tw-divide-x-reverse)); border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse))); } } .divide-y { :where(& > :not(:last-child)) { --tw-divide-y-reverse: 0; border-bottom-style: var(--tw-border-style); border-top-style: var(--tw-border-style); border-top-width: calc(1px * var(--tw-divide-y-reverse)); border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse))); } } .divide-container { :where(& > :not(:last-child)) { border-color: var(--color-container); } } .divide-gray-100 { :where(& > :not(:last-child)) { border-color: var(--color-gray-100); } } .divide-gray-200 { :where(& > :not(:last-child)) { border-color: var(--color-gray-200); } } .divide-gray-900\/10 { :where(& > :not(:last-child)) { border-color: color-mix(in srgb, oklch(21% 0.034 264.665) 10%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-gray-900) 10%, transparent); } } } .divide-slate-200 { :where(& > :not(:last-child)) { border-color: var(--color-slate-200); } } .self-center { align-self: center; } .self-end { align-self: flex-end; } .self-start { align-self: flex-start; } .self-stretch { align-self: stretch; } .justify-self-center { justify-self: center; } .justify-self-end { justify-self: flex-end; } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .overflow-auto { overflow: auto; } .overflow-hidden { overflow: hidden; } .overflow-visible { overflow: visible; } .overflow-x-auto { overflow-x: auto; } .overflow-x-clip { overflow-x: clip; } .overflow-x-hidden { overflow-x: hidden; } .overflow-y-auto { overflow-y: auto; } .overflow-y-scroll { overflow-y: scroll; } .overscroll-contain { overscroll-behavior: contain; } .overscroll-y-contain { overscroll-behavior-y: contain; } .scroll-smooth { scroll-behavior: smooth; } .rounded { border-radius: 0.25rem; } .rounded-2xl { border-radius: var(--radius-2xl); } .rounded-3xl { border-radius: var(--radius-3xl); } .rounded-\[inherit\] { border-radius: inherit; } .rounded-full { border-radius: calc(infinity * 1px); } .rounded-lg { border-radius: var(--radius-lg); } .rounded-md { border-radius: var(--radius-md); } .rounded-none { border-radius: 0; } .rounded-sm { border-radius: var(--radius-sm); } .rounded-xl { border-radius: var(--radius-xl); } .rounded-s-none { border-start-start-radius: 0; border-end-start-radius: 0; } .rounded-e-none { border-start-end-radius: 0; border-end-end-radius: 0; } .rounded-t-md { border-top-left-radius: var(--radius-md); border-top-right-radius: var(--radius-md); } .rounded-t-xl { border-top-left-radius: var(--radius-xl); border-top-right-radius: var(--radius-xl); } .rounded-l { border-top-left-radius: 0.25rem; border-bottom-left-radius: 0.25rem; } .rounded-l-md { border-top-left-radius: var(--radius-md); border-bottom-left-radius: var(--radius-md); } .rounded-r { border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; } .rounded-r-md { border-top-right-radius: var(--radius-md); border-bottom-right-radius: var(--radius-md); } .rounded-br-lg { border-bottom-right-radius: var(--radius-lg); } .rounded-bl-lg { border-bottom-left-radius: var(--radius-lg); } .\!border { border-style: var(--tw-border-style) !important; border-width: 1px !important; } .\!border-0 { border-style: var(--tw-border-style) !important; border-width: 0px !important; } .\!border-1 { border-style: var(--tw-border-style) !important; border-width: 1px !important; } .\!border-2 { border-style: var(--tw-border-style) !important; border-width: 2px !important; } .border { border-style: var(--tw-border-style); border-width: 1px; } .border-0 { border-style: var(--tw-border-style); border-width: 0px; } .border-1 { border-style: var(--tw-border-style); border-width: 1px; } .border-2 { border-style: var(--tw-border-style); border-width: 2px; } .border-4 { border-style: var(--tw-border-style); border-width: 4px; } .border-y { border-block-style: var(--tw-border-style); border-block-width: 1px; } .border-t { border-top-style: var(--tw-border-style); border-top-width: 1px; } .border-t-2 { border-top-style: var(--tw-border-style); border-top-width: 2px; } .border-r-0 { border-right-style: var(--tw-border-style); border-right-width: 0px; } .border-b { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } .border-b-2 { border-bottom-style: var(--tw-border-style); border-bottom-width: 2px; } .border-l { border-left-style: var(--tw-border-style); border-left-width: 1px; } .border-l-0 { border-left-style: var(--tw-border-style); border-left-width: 0px; } .border-l-2 { border-left-style: var(--tw-border-style); border-left-width: 2px; } .border-l-4 { border-left-style: var(--tw-border-style); border-left-width: 4px; } .border-dashed { --tw-border-style: dashed; border-style: dashed; } .border-solid { --tw-border-style: solid; border-style: solid; } .border-black { border-color: var(--color-black); } .border-blue-100 { border-color: var(--color-blue-100); } .border-blue-200 { border-color: var(--color-blue-200); } .border-blue-300 { border-color: var(--color-blue-300); } .border-blue-400 { border-color: var(--color-blue-400); } .border-blue-500 { border-color: var(--color-blue-500); } .border-blue-600 { border-color: var(--color-blue-600); } .border-container { border-color: var(--color-container); } .border-container-darker { border-color: var(--color-container-darker); } .border-container-lighter { border-color: var(--color-container-lighter); } .border-current { border-color: currentcolor; } .border-gray-100 { border-color: var(--color-gray-100); } .border-gray-200 { border-color: var(--color-gray-200); } .border-gray-300 { border-color: var(--color-gray-300); } .border-gray-400 { border-color: var(--color-gray-400); } .border-gray-600 { border-color: var(--color-gray-600); } .border-green-400 { border-color: var(--color-green-400); } .border-light { border-color: var(--color-light); } .border-primary { border-color: var(--color-primary); } .border-red-200 { border-color: var(--color-red-200); } .border-red-400 { border-color: var(--color-red-400); } .border-red-500 { border-color: var(--color-red-500); } .border-red-600 { border-color: var(--color-red-600); } .border-red-700 { border-color: var(--color-red-700); } .border-secondary { border-color: var(--color-secondary); } .border-slate-200 { border-color: var(--color-slate-200); } .border-slate-300 { border-color: var(--color-slate-300); } .border-slate-400 { border-color: var(--color-slate-400); } .border-transparent { border-color: transparent; } .border-white { border-color: var(--color-white); } .border-yellow-400 { border-color: var(--color-yellow-400); } .border-l-green-400 { border-left-color: var(--color-green-400); } .bg-\[\#00D856\] { background-color: #00D856; } .bg-black { background-color: var(--color-black); } .bg-black\/20 { background-color: color-mix(in srgb, #000 20%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-black) 20%, transparent); } } .bg-black\/40 { background-color: color-mix(in srgb, #000 40%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-black) 40%, transparent); } } .bg-black\/50 { background-color: color-mix(in srgb, #000 50%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-black) 50%, transparent); } } .bg-blue-50 { background-color: var(--color-blue-50); } .bg-blue-100 { background-color: var(--color-blue-100); } .bg-blue-500 { background-color: var(--color-blue-500); } .bg-blue-600 { background-color: var(--color-blue-600); } .bg-blue-700 { background-color: var(--color-blue-700); } .bg-container-darker { background-color: var(--color-container-darker); } .bg-container-lighter { background-color: var(--color-container-lighter); } .bg-cta { background-color: var(--color-cta); } .bg-emerald-100 { background-color: var(--color-emerald-100); } .bg-gray-50 { background-color: var(--color-gray-50); } .bg-gray-100 { background-color: var(--color-gray-100); } .bg-gray-200 { background-color: var(--color-gray-200); } .bg-gray-300 { background-color: var(--color-gray-300); } .bg-gray-500 { background-color: var(--color-gray-500); } .bg-gray-800 { background-color: var(--color-gray-800); } .bg-gray-800\/40 { background-color: color-mix(in srgb, oklch(27.8% 0.033 256.848) 40%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-gray-800) 40%, transparent); } } .bg-gray-900 { background-color: var(--color-gray-900); } .bg-green-50 { background-color: var(--color-green-50); } .bg-green-100 { background-color: var(--color-green-100); } .bg-green-200 { background-color: var(--color-green-200); } .bg-green-500 { background-color: var(--color-green-500); } .bg-green-600 { background-color: var(--color-green-600); } .bg-indigo-50 { background-color: var(--color-indigo-50); } .bg-inherit { background-color: inherit; } .bg-light { background-color: var(--color-light); } .bg-orange-50 { background-color: var(--color-orange-50); } .bg-orange-500 { background-color: var(--color-orange-500); } .bg-pink-100 { background-color: var(--color-pink-100); } .bg-primary { &[class*="bg-opacity-"] { background-color: oklch(48.8% 0.243 264.376); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix( in srgb, var(--color-primary) calc(100% / var(--tw-bg-opacity)), #0000 ); } } } .bg-primary { background-color: var(--color-primary); } .bg-primary\/\[\.08\] { background-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-primary) 8%, transparent); } } .bg-purple-50 { background-color: var(--color-purple-50); } .bg-purple-100 { background-color: var(--color-purple-100); } .bg-red-50 { background-color: var(--color-red-50); } .bg-red-100 { background-color: var(--color-red-100); } .bg-red-200 { background-color: var(--color-red-200); } .bg-red-500 { background-color: var(--color-red-500); } .bg-red-600 { background-color: var(--color-red-600); } .bg-secondary { background-color: var(--color-secondary); } .bg-sky-100 { background-color: var(--color-sky-100); } .bg-slate-100 { background-color: var(--color-slate-100); } .bg-slate-200 { background-color: var(--color-slate-200); } .bg-surface { background-color: var(--color-surface); } .bg-transparent { background-color: transparent; } .bg-white { background-color: var(--color-white); } .bg-white\/20 { background-color: color-mix(in srgb, #fff 20%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 20%, transparent); } } .bg-white\/25 { background-color: color-mix(in srgb, #fff 25%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 25%, transparent); } } .bg-white\/30 { background-color: color-mix(in srgb, #fff 30%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 30%, transparent); } } .bg-white\/60 { background-color: color-mix(in srgb, #fff 60%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 60%, transparent); } } .bg-white\/70 { background-color: color-mix(in srgb, #fff 70%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 70%, transparent); } } .bg-white\/90 { background-color: color-mix(in srgb, #fff 90%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 90%, transparent); } } .bg-white\/95 { background-color: color-mix(in srgb, #fff 95%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 95%, transparent); } } .bg-yellow-50 { background-color: var(--color-yellow-50); } .bg-yellow-100 { background-color: var(--color-yellow-100); } .bg-yellow-500 { background-color: var(--color-yellow-500); } .bg-gradient-to-l { --tw-gradient-position: to left in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-r { --tw-gradient-position: to right in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); } .bg-gradient-to-t { --tw-gradient-position: to top in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); } .from-black\/10 { --tw-gradient-from: color-mix(in srgb, #000 10%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-from: color-mix(in oklab, var(--color-black) 10%, transparent); } --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-black\/65 { --tw-gradient-from: color-mix(in srgb, #000 65%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-from: color-mix(in oklab, var(--color-black) 65%, transparent); } --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-cta { --tw-gradient-from: var(--color-cta); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-gray-900 { --tw-gradient-from: var(--color-gray-900); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-surface { --tw-gradient-from: var(--color-surface); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .from-white { --tw-gradient-from: var(--color-white); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .via-black\/30 { --tw-gradient-via: color-mix(in srgb, #000 30%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-via: color-mix(in oklab, var(--color-black) 30%, transparent); } --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-via-stops); } .via-gray-900\/5 { --tw-gradient-via: color-mix(in srgb, oklch(21% 0.034 264.665) 5%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-via: color-mix(in oklab, var(--color-gray-900) 5%, transparent); } --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-via-stops); } .to-black\/10 { --tw-gradient-to: color-mix(in srgb, #000 10%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-to: color-mix(in oklab, var(--color-black) 10%, transparent); } --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .to-primary { --tw-gradient-to: var(--color-primary); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .to-transparent { --tw-gradient-to: transparent; --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .mask-b-from-80\% { mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic); mask-composite: intersect; --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top); --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position)); --tw-mask-bottom-from-position: 80%; } .fill-black\/20 { fill: color-mix(in srgb, #000 20%, transparent); @supports (color: color-mix(in lab, red, red)) { fill: color-mix(in oklab, var(--color-black) 20%, transparent); } } .fill-current { fill: currentcolor; } .fill-white { fill: var(--color-white); } .stroke-current { stroke: currentcolor; } .stroke-white { stroke: var(--color-white); } .stroke-white\/75 { stroke: color-mix(in srgb, #fff 75%, transparent); @supports (color: color-mix(in lab, red, red)) { stroke: color-mix(in oklab, var(--color-white) 75%, transparent); } } .stroke-1 { stroke-width: 1; } .stroke-2 { stroke-width: 2; } .object-contain { object-fit: contain; } .object-cover { object-fit: cover; } .object-center { object-position: center; } .\!p-0 { padding: calc(var(--spacing) * 0) !important; } .p-0 { padding: calc(var(--spacing) * 0); } .p-0\.5 { padding: calc(var(--spacing) * 0.5); } .p-1 { padding: calc(var(--spacing) * 1); } .p-1\.5 { padding: calc(var(--spacing) * 1.5); } .p-2 { padding: calc(var(--spacing) * 2); } .p-2\.5 { padding: calc(var(--spacing) * 2.5); } .p-3 { padding: calc(var(--spacing) * 3); } .p-4 { padding: calc(var(--spacing) * 4); } .p-5 { padding: calc(var(--spacing) * 5); } .p-6 { padding: calc(var(--spacing) * 6); } .p-8 { padding: calc(var(--spacing) * 8); } .p-10 { padding: calc(var(--spacing) * 10); } .px-0 { padding-inline: calc(var(--spacing) * 0); } .px-0\.5 { padding-inline: calc(var(--spacing) * 0.5); } .px-1 { padding-inline: calc(var(--spacing) * 1); } .px-1\.5 { padding-inline: calc(var(--spacing) * 1.5); } .px-2 { padding-inline: calc(var(--spacing) * 2); } .px-2\.5 { padding-inline: calc(var(--spacing) * 2.5); } .px-3 { padding-inline: calc(var(--spacing) * 3); } .px-3\.5 { padding-inline: calc(var(--spacing) * 3.5); } .px-4 { padding-inline: calc(var(--spacing) * 4); } .px-5 { padding-inline: calc(var(--spacing) * 5); } .px-6 { padding-inline: calc(var(--spacing) * 6); } .px-8 { padding-inline: calc(var(--spacing) * 8); } .px-10 { padding-inline: calc(var(--spacing) * 10); } .px-12 { padding-inline: calc(var(--spacing) * 12); } .\!py-6 { padding-block: calc(var(--spacing) * 6) !important; } .py-0 { padding-block: calc(var(--spacing) * 0); } .py-0\.5 { padding-block: calc(var(--spacing) * 0.5); } .py-1 { padding-block: calc(var(--spacing) * 1); } .py-1\.5 { padding-block: calc(var(--spacing) * 1.5); } .py-2 { padding-block: calc(var(--spacing) * 2); } .py-2\.5 { padding-block: calc(var(--spacing) * 2.5); } .py-3 { padding-block: calc(var(--spacing) * 3); } .py-3\.5 { padding-block: calc(var(--spacing) * 3.5); } .py-4 { padding-block: calc(var(--spacing) * 4); } .py-6 { padding-block: calc(var(--spacing) * 6); } .py-8 { padding-block: calc(var(--spacing) * 8); } .py-10 { padding-block: calc(var(--spacing) * 10); } .py-12 { padding-block: calc(var(--spacing) * 12); } .py-24 { padding-block: calc(var(--spacing) * 24); } .pe-2 { padding-inline-end: calc(var(--spacing) * 2); } .pe-4 { padding-inline-end: calc(var(--spacing) * 4); } .pt-0 { padding-top: calc(var(--spacing) * 0); } .pt-1 { padding-top: calc(var(--spacing) * 1); } .pt-2 { padding-top: calc(var(--spacing) * 2); } .pt-3 { padding-top: calc(var(--spacing) * 3); } .pt-4 { padding-top: calc(var(--spacing) * 4); } .pt-5 { padding-top: calc(var(--spacing) * 5); } .pt-6 { padding-top: calc(var(--spacing) * 6); } .pt-8 { padding-top: calc(var(--spacing) * 8); } .pt-10 { padding-top: calc(var(--spacing) * 10); } .pt-16 { padding-top: calc(var(--spacing) * 16); } .pr-0 { padding-right: calc(var(--spacing) * 0); } .pr-1 { padding-right: calc(var(--spacing) * 1); } .pr-2 { padding-right: calc(var(--spacing) * 2); } .pr-4 { padding-right: calc(var(--spacing) * 4); } .pr-5 { padding-right: calc(var(--spacing) * 5); } .pr-6 { padding-right: calc(var(--spacing) * 6); } .pr-7 { padding-right: calc(var(--spacing) * 7); } .pr-9 { padding-right: calc(var(--spacing) * 9); } .pr-12 { padding-right: calc(var(--spacing) * 12); } .pr-24 { padding-right: calc(var(--spacing) * 24); } .pb-0 { padding-bottom: calc(var(--spacing) * 0); } .pb-1 { padding-bottom: calc(var(--spacing) * 1); } .pb-1\.5 { padding-bottom: calc(var(--spacing) * 1.5); } .pb-2 { padding-bottom: calc(var(--spacing) * 2); } .pb-3 { padding-bottom: calc(var(--spacing) * 3); } .pb-4 { padding-bottom: calc(var(--spacing) * 4); } .pb-5 { padding-bottom: calc(var(--spacing) * 5); } .pb-6 { padding-bottom: calc(var(--spacing) * 6); } .pb-8 { padding-bottom: calc(var(--spacing) * 8); } .pb-9 { padding-bottom: calc(var(--spacing) * 9); } .pb-10 { padding-bottom: calc(var(--spacing) * 10); } .pb-12 { padding-bottom: calc(var(--spacing) * 12); } .pb-16 { padding-bottom: calc(var(--spacing) * 16); } .pl-1 { padding-left: calc(var(--spacing) * 1); } .pl-2 { padding-left: calc(var(--spacing) * 2); } .pl-2\.5 { padding-left: calc(var(--spacing) * 2.5); } .pl-3 { padding-left: calc(var(--spacing) * 3); } .pl-3\.5 { padding-left: calc(var(--spacing) * 3.5); } .pl-4 { padding-left: calc(var(--spacing) * 4); } .pl-5 { padding-left: calc(var(--spacing) * 5); } .pl-6 { padding-left: calc(var(--spacing) * 6); } .pl-11 { padding-left: calc(var(--spacing) * 11); } .text-center { text-align: center; } .text-end { text-align: end; } .text-left { text-align: left; } .text-right { text-align: right; } .text-start { text-align: start; } .align-bottom { vertical-align: bottom; } .align-middle { vertical-align: middle; } .align-top { vertical-align: top; } .font-mono { font-family: var(--font-mono); } .font-sans { font-family: var(--font-sans); } .text-2xl { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); } .text-3xl { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); } .text-4xl { font-size: var(--text-4xl); line-height: var(--tw-leading, var(--text-4xl--line-height)); } .text-base { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); } .text-lg { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); } .text-sm { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); } .text-xl { font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); } .text-xs { font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); } .text-\[11px\] { font-size: 11px; } .text-md { font-size: var(--text-md); } .leading-4 { --tw-leading: calc(var(--spacing) * 4); line-height: calc(var(--spacing) * 4); } .leading-5 { --tw-leading: calc(var(--spacing) * 5); line-height: calc(var(--spacing) * 5); } .leading-6 { --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); } .leading-7 { --tw-leading: calc(var(--spacing) * 7); line-height: calc(var(--spacing) * 7); } .leading-8 { --tw-leading: calc(var(--spacing) * 8); line-height: calc(var(--spacing) * 8); } .leading-10 { --tw-leading: calc(var(--spacing) * 10); line-height: calc(var(--spacing) * 10); } .leading-loose { --tw-leading: var(--leading-loose); line-height: var(--leading-loose); } .leading-none { --tw-leading: 1; line-height: 1; } .leading-normal { --tw-leading: var(--leading-normal); line-height: var(--leading-normal); } .leading-relaxed { --tw-leading: var(--leading-relaxed); line-height: var(--leading-relaxed); } .leading-snug { --tw-leading: var(--leading-snug); line-height: var(--leading-snug); } .leading-tight { --tw-leading: var(--leading-tight); line-height: var(--leading-tight); } .font-black { --tw-font-weight: var(--font-weight-black); font-weight: var(--font-weight-black); } .font-bold { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } .font-extrabold { --tw-font-weight: var(--font-weight-extrabold); font-weight: var(--font-weight-extrabold); } .font-medium { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } .font-normal { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); } .font-semibold { --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } .tracking-tight { --tw-tracking: var(--tracking-tight); letter-spacing: var(--tracking-tight); } .tracking-wide { --tw-tracking: var(--tracking-wide); letter-spacing: var(--tracking-wide); } .tracking-wider { --tw-tracking: var(--tracking-wider); letter-spacing: var(--tracking-wider); } .tracking-widest { --tw-tracking: var(--tracking-widest); letter-spacing: var(--tracking-widest); } .text-nowrap { text-wrap: nowrap; } .break-words { overflow-wrap: break-word; } .wrap-break-word { overflow-wrap: break-word; } .break-all { word-break: break-all; } .text-ellipsis { text-overflow: ellipsis; } .hyphens-auto { -webkit-hyphens: auto; hyphens: auto; } .whitespace-nowrap { white-space: nowrap; } .whitespace-pre-line { white-space: pre-line; } .\!text-red-500 { color: var(--color-red-500) !important; } .text-black { color: var(--color-black); } .text-blue-100 { color: var(--color-blue-100); } .text-blue-400 { color: var(--color-blue-400); } .text-blue-500 { color: var(--color-blue-500); } .text-blue-600 { color: var(--color-blue-600); } .text-blue-700 { color: var(--color-blue-700); } .text-blue-800 { color: var(--color-blue-800); } .text-blue-900 { color: var(--color-blue-900); } .text-cta { color: var(--color-cta); } .text-current { color: currentcolor; } .text-emerald-600 { color: var(--color-emerald-600); } .text-emerald-700 { color: var(--color-emerald-700); } .text-fg { color: var(--color-fg); } .text-fg-secondary { color: var(--color-fg-secondary); } .text-fg\/30 { color: color-mix(in srgb, oklch(12.9% 0.042 264.695) 30%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-fg) 30%, transparent); } } .text-gray-200 { color: var(--color-gray-200); } .text-gray-300 { color: var(--color-gray-300); } .text-gray-400 { color: var(--color-gray-400); } .text-gray-500 { color: var(--color-gray-500); } .text-gray-600 { color: var(--color-gray-600); } .text-gray-700 { color: var(--color-gray-700); } .text-gray-800 { color: var(--color-gray-800); } .text-gray-900 { color: var(--color-gray-900); } .text-green-400 { color: var(--color-green-400); } .text-green-500 { color: var(--color-green-500); } .text-green-600 { color: var(--color-green-600); } .text-green-700 { color: var(--color-green-700); } .text-green-800 { color: var(--color-green-800); } .text-indigo-600 { color: var(--color-indigo-600); } .text-indigo-700 { color: var(--color-indigo-700); } .text-inherit { color: inherit; } .text-orange-400 { color: var(--color-orange-400); } .text-orange-600 { color: var(--color-orange-600); } .text-primary { color: var(--color-primary); } .text-purple-600 { color: var(--color-purple-600); } .text-purple-700 { color: var(--color-purple-700); } .text-red-500 { color: var(--color-red-500); } .text-red-600 { color: var(--color-red-600); } .text-red-700 { color: var(--color-red-700); } .text-red-800 { color: var(--color-red-800); } .text-secondary { color: var(--color-secondary); } .text-slate-300 { color: var(--color-slate-300); } .text-slate-400 { color: var(--color-slate-400); } .text-slate-500 { color: var(--color-slate-500); } .text-slate-600 { color: var(--color-slate-600); } .text-slate-700 { color: var(--color-slate-700); } .text-slate-800 { color: var(--color-slate-800); } .text-slate-900 { color: var(--color-slate-900); } .text-white { color: var(--color-white); } .text-white\/85 { color: color-mix(in srgb, #fff 85%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 85%, transparent); } } .text-white\/90 { color: color-mix(in srgb, #fff 90%, transparent); @supports (color: color-mix(in lab, red, red)) { color: color-mix(in oklab, var(--color-white) 90%, transparent); } } .text-yellow-400 { color: var(--color-yellow-400); } .text-yellow-500 { color: var(--color-yellow-500); } .text-yellow-600 { color: var(--color-yellow-600); } .text-yellow-700 { color: var(--color-yellow-700); } .text-yellow-800 { color: var(--color-yellow-800); } .lowercase { text-transform: lowercase; } .uppercase { text-transform: uppercase; } .italic { font-style: italic; } .not-italic { font-style: normal; } .tabular-nums { --tw-numeric-spacing: tabular-nums; font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,); } .line-through { text-decoration-line: line-through; } .no-underline { text-decoration-line: none; } .underline { text-decoration-line: underline; } .placeholder-gray-500 { &::placeholder { color: var(--color-gray-500); } } .opacity-0 { opacity: 0%; } .opacity-25 { opacity: 25%; } .opacity-30 { opacity: 30%; } .opacity-50 { opacity: 50%; } .opacity-60 { opacity: 60%; } .opacity-75 { opacity: 75%; } .opacity-80 { opacity: 80%; } .opacity-100 { opacity: 100%; } .mix-blend-multiply { mix-blend-mode: multiply; } .shadow { --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-2xl { --tw-shadow: 0 25px 50px -12px var(--tw-shadow-color, rgb(0 0 0 / 0.25)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_-2px_12px_rgba\(0\,0\,0\,0\.04\)\] { --tw-shadow: 0 -2px 12px var(--tw-shadow-color, rgba(0,0,0,0.04)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_2px_12px_rgba\(0\,0\,0\,0\.04\)\] { --tw-shadow: 0 2px 12px var(--tw-shadow-color, rgba(0,0,0,0.04)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[0_4px_3px_0_rgba\(0\,0\,0\,0\.02\)\] { --tw-shadow: 0 4px 3px 0 var(--tw-shadow-color, rgba(0,0,0,0.02)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgba\(0\,0\,0\,0\.12\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgba(0,0,0,0.12)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-\[inset_0_0_0_1px_rgba\(0\,0\,0\,0\.32\)\] { --tw-shadow: inset 0 0 0 1px var(--tw-shadow-color, rgba(0,0,0,0.32)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-lg { --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-md { --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-none { --tw-shadow: 0 0 #0000; box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-sm { --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .shadow-xl { --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 8px 10px -6px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring-1 { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } .ring-black { --tw-ring-color: var(--color-black); } .ring-black\/5 { --tw-ring-color: color-mix(in srgb, #000 5%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-black) 5%, transparent); } } .ring-blue-200 { --tw-ring-color: var(--color-blue-200); } .ring-blue-500\/50 { --tw-ring-color: color-mix(in srgb, oklch(62.3% 0.214 259.815) 50%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-blue-500) 50%, transparent); } } .ring-blue-600 { --tw-ring-color: var(--color-blue-600); } .ring-blue-700\/10 { --tw-ring-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 10%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-blue-700) 10%, transparent); } } .ring-gray-200 { --tw-ring-color: var(--color-gray-200); } .ring-gray-300 { --tw-ring-color: var(--color-gray-300); } .ring-gray-900\/10 { --tw-ring-color: color-mix(in srgb, oklch(21% 0.034 264.665) 10%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-gray-900) 10%, transparent); } } .ring-green-600\/20 { --tw-ring-color: color-mix(in srgb, oklch(62.7% 0.194 149.214) 20%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-green-600) 20%, transparent); } } .ring-indigo-600\/20 { --tw-ring-color: color-mix(in srgb, oklch(51.1% 0.262 276.966) 20%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-indigo-600) 20%, transparent); } } .ring-orange-200 { --tw-ring-color: var(--color-orange-200); } .ring-primary { --tw-ring-color: var(--color-primary); } .ring-primary\/10 { --tw-ring-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 10%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-primary) 10%, transparent); } } .ring-primary\/50 { --tw-ring-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 50%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-primary) 50%, transparent); } } .ring-primary\/75 { --tw-ring-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 75%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-primary) 75%, transparent); } } .ring-purple-200 { --tw-ring-color: var(--color-purple-200); } .ring-white { --tw-ring-color: var(--color-white); } .ring-offset-2 { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } .outline-0 { outline-style: var(--tw-outline-style); outline-width: 0px; } .outline-2 { outline-style: var(--tw-outline-style); outline-width: 2px; } .-outline-offset-2 { outline-offset: calc(2px * -1); } .outline-offset-0 { outline-offset: 0px; } .outline-offset-2 { outline-offset: 2px; } .outline-offset-8 { outline-offset: 8px; } .outline-blue-300 { outline-color: var(--color-blue-300); } .outline-primary { outline-color: var(--color-primary); } .blur { --tw-blur: blur(8px); filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); } .filter { filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,); } .backdrop-blur { --tw-backdrop-blur: blur(8px); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); } .backdrop-blur-sm { --tw-backdrop-blur: blur(var(--blur-sm)); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); } .transition { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-all { transition-property: all; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-colors { transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-opacity { transition-property: opacity; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-shadow { transition-property: box-shadow; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .transition-transform { transition-property: transform, translate, scale, rotate; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); } .duration-75 { --tw-duration: 75ms; transition-duration: 75ms; } .duration-100 { --tw-duration: 100ms; transition-duration: 100ms; } .duration-150 { --tw-duration: 150ms; transition-duration: 150ms; } .duration-200 { --tw-duration: 200ms; transition-duration: 200ms; } .duration-250 { --tw-duration: 250ms; transition-duration: 250ms; } .duration-300 { --tw-duration: 300ms; transition-duration: 300ms; } .duration-500 { --tw-duration: 500ms; transition-duration: 500ms; } .duration-600 { --tw-duration: 600ms; transition-duration: 600ms; } .duration-1000 { --tw-duration: 1000ms; transition-duration: 1000ms; } .ease-in { --tw-ease: var(--ease-in); transition-timing-function: var(--ease-in); } .ease-in-out { --tw-ease: var(--ease-in-out); transition-timing-function: var(--ease-in-out); } .ease-linear { --tw-ease: linear; transition-timing-function: linear; } .ease-out { --tw-ease: var(--ease-out); transition-timing-function: var(--ease-out); } .prose-gray { --tw-prose-body: oklch(37.3% 0.034 259.733); --tw-prose-headings: oklch(21% 0.034 264.665); --tw-prose-lead: oklch(44.6% 0.03 256.802); --tw-prose-links: oklch(21% 0.034 264.665); --tw-prose-bold: oklch(21% 0.034 264.665); --tw-prose-counters: oklch(55.1% 0.027 264.364); --tw-prose-bullets: oklch(87.2% 0.01 258.338); --tw-prose-hr: oklch(92.8% 0.006 264.531); --tw-prose-quotes: oklch(21% 0.034 264.665); --tw-prose-quote-borders: oklch(92.8% 0.006 264.531); --tw-prose-captions: oklch(55.1% 0.027 264.364); --tw-prose-kbd: oklch(21% 0.034 264.665); --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent); --tw-prose-code: oklch(21% 0.034 264.665); --tw-prose-pre-code: oklch(92.8% 0.006 264.531); --tw-prose-pre-bg: oklch(27.8% 0.033 256.848); --tw-prose-th-borders: oklch(87.2% 0.01 258.338); --tw-prose-td-borders: oklch(92.8% 0.006 264.531); --tw-prose-invert-body: oklch(87.2% 0.01 258.338); --tw-prose-invert-headings: #fff; --tw-prose-invert-lead: oklch(70.7% 0.022 261.325); --tw-prose-invert-links: #fff; --tw-prose-invert-bold: #fff; --tw-prose-invert-counters: oklch(70.7% 0.022 261.325); --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802); --tw-prose-invert-hr: oklch(37.3% 0.034 259.733); --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542); --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733); --tw-prose-invert-captions: oklch(70.7% 0.022 261.325); --tw-prose-invert-kbd: #fff; --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%); --tw-prose-invert-code: #fff; --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338); --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%); --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802); --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733); } .btn-cta { --btn-stroke: var(--color-cta); --btn-bg: var(--color-cta); --btn-color: var(--color-white); --btn-hover-bg: color-mix(in srgb, #f7931a, black 15%); @supports (color: color-mix(in lab, red, red)) { --btn-hover-bg: color-mix(in srgb, var(--color-cta), black 15%); } --btn-hover-stroke: color-mix(in srgb, #f7931a, black 15%); @supports (color: color-mix(in lab, red, red)) { --btn-hover-stroke: color-mix(in srgb, var(--color-cta), black 15%); } --btn-hover-color: var(--color-white); --btn-active-stroke: #0000; --btn-active-bg: var(--color-cta); --btn-active-color: var(--color-cta); } .btn-primary { --btn-stroke: #0000; --btn-bg: var(--color-primary); --btn-color: var(--color-on-primary); --btn-hover-stroke: #0000; --btn-hover-bg: var(--color-primary-lighter); --btn-hover-color: var(--color-on-primary); --btn-active-stroke: #0000; --btn-active-bg: var(--color-primary); --btn-active-color: var(--color-on-primary); } .btn-secondary { --btn-stroke: var(--color-primary-lighter); --btn-bg: var(--color-on-primary); --btn-color: var(--color-primary-darker); --btn-hover-stroke: var(--color-primary-lighter); --btn-hover-bg: var(--color-on-primary); --btn-hover-color: var(--color-primary-lighter); --btn-active-stroke: #0000; --btn-active-bg: var(--color-primary); --btn-active-color: var(--color-on-primary); } .outline-dashed { --tw-outline-style: dashed; outline-style: dashed; } .outline-none { --tw-outline-style: none; outline-style: none; } .select-none { -webkit-user-select: none; user-select: none; } .\[--line-after\:theme\(colors\.primary\.DEFAULT\)\] { --line-after: var(--color-blue-700); } .\[--line-before\:\#0000\] { --line-before: #0000; } .\[--line-before\:theme\(colors\.primary\.DEFAULT\)\] { --line-before: var(--color-blue-700); } .\[-moz-appearance\:_textfield\] { -moz-appearance: textfield; } .\[wire\:auto-save\] { wire: auto-save; } .\[wire\:model\.defer\] { wire: model.defer; } .\[wire\:model\] { wire: model; } .\[wire\:select\] { wire: select; } .bg-opacity-0 { --tw-bg-opacity: 0; } .bg-opacity-10 { --tw-bg-opacity: 10; } .bg-opacity-25 { --tw-bg-opacity: 25; } .bg-opacity-50 { --tw-bg-opacity: 50; } .bg-opacity-75 { --tw-bg-opacity: 75; } .bg-opacity-90 { --tw-bg-opacity: 90; } .bg-opacity-100 { --tw-bg-opacity: 100; } .ring-inset { --tw-ring-inset: inset; } .ring-opacity-5 { --tw-ring-opacity: 5; } .ring-opacity-25 { --tw-ring-opacity: 25; } .ring-opacity-50 { --tw-ring-opacity: 50; } .group-open\:rotate-180 { &:is(:where(.group):is([open], :popover-open, :open) *) { rotate: 180deg; } } .group-focus-within\:visible { &:is(:where(.group):focus-within *) { visibility: visible; } } .group-focus-within\:opacity-100 { &:is(:where(.group):focus-within *) { opacity: 100%; } } .group-hover\:pointer-events-auto { &:is(:where(.group):hover *) { @media (hover: hover) { pointer-events: auto; } } } .group-hover\:visible { &:is(:where(.group):hover *) { @media (hover: hover) { visibility: visible; } } } .group-hover\:block { &:is(:where(.group):hover *) { @media (hover: hover) { display: block; } } } .group-hover\:-translate-x-0\.5 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-translate-x: calc(var(--spacing) * -0.5); translate: var(--tw-translate-x) var(--tw-translate-y); } } } .group-hover\:translate-x-0\.5 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-translate-x: calc(var(--spacing) * 0.5); translate: var(--tw-translate-x) var(--tw-translate-y); } } } .group-hover\:scale-105 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-scale-x: 105%; --tw-scale-y: 105%; --tw-scale-z: 105%; scale: var(--tw-scale-x) var(--tw-scale-y); } } } .group-hover\:scale-110 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-scale-x: 110%; --tw-scale-y: 110%; --tw-scale-z: 110%; scale: var(--tw-scale-x) var(--tw-scale-y); } } } .group-hover\:border-primary { &:is(:where(.group):hover *) { @media (hover: hover) { border-color: var(--color-primary); } } } .group-hover\:bg-gray-300 { &:is(:where(.group):hover *) { @media (hover: hover) { background-color: var(--color-gray-300); } } } .group-hover\:bg-white\/30 { &:is(:where(.group):hover *) { @media (hover: hover) { background-color: color-mix(in srgb, #fff 30%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-white) 30%, transparent); } } } } .group-hover\:via-gray-900\/20 { &:is(:where(.group):hover *) { @media (hover: hover) { --tw-gradient-via: color-mix(in srgb, oklch(21% 0.034 264.665) 20%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-via: color-mix(in oklab, var(--color-gray-900) 20%, transparent); } --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-via-stops); } } } .group-hover\:text-blue-600 { &:is(:where(.group):hover *) { @media (hover: hover) { color: var(--color-blue-600); } } } .group-hover\:text-blue-700 { &:is(:where(.group):hover *) { @media (hover: hover) { color: var(--color-blue-700); } } } .group-hover\:text-gray-600 { &:is(:where(.group):hover *) { @media (hover: hover) { color: var(--color-gray-600); } } } .group-hover\:text-gray-800 { &:is(:where(.group):hover *) { @media (hover: hover) { color: var(--color-gray-800); } } } .group-hover\:text-orange-700 { &:is(:where(.group):hover *) { @media (hover: hover) { color: var(--color-orange-700); } } } .group-hover\:text-primary { &:is(:where(.group):hover *) { @media (hover: hover) { color: var(--color-primary); } } } .group-hover\:text-secondary { &:is(:where(.group):hover *) { @media (hover: hover) { color: var(--color-secondary); } } } .group-hover\:underline { &:is(:where(.group):hover *) { @media (hover: hover) { text-decoration-line: underline; } } } .group-hover\:opacity-80 { &:is(:where(.group):hover *) { @media (hover: hover) { opacity: 80%; } } } .group-hover\:opacity-100 { &:is(:where(.group):hover *) { @media (hover: hover) { opacity: 100%; } } } .group-focus\:border-gray-400 { &:is(:where(.group):focus *) { border-color: var(--color-gray-400); } } .group-disabled\:invisible { &:is(:where(.group):disabled *) { visibility: hidden; } } .group-disabled\:flex { &:is(:where(.group):disabled *) { display: flex; } } .group-aria-expanded\:rotate-180 { &:is(:where(.group)[aria-expanded="true"] *) { rotate: 180deg; } } .placeholder\:text-gray-400 { &::placeholder { color: var(--color-gray-400); } } .backdrop\:backdrop { &::backdrop { position: fixed; inset: 0; background-color: var(--backdrop, hsl(0 0 0 / 20%)); } } .backdrop\:bg-black\/25 { &::backdrop { background-color: color-mix(in srgb, #000 25%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-black) 25%, transparent); } } } .backdrop\:bg-black\/75 { &::backdrop { background-color: color-mix(in srgb, #000 75%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-black) 75%, transparent); } } } .backdrop\:backdrop-blur-sm { &::backdrop { --tw-backdrop-blur: blur(var(--blur-sm)); -webkit-backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,); } } .before\:absolute { &::before { content: var(--tw-content); position: absolute; } } .before\:inset-0 { &::before { content: var(--tw-content); inset: calc(var(--spacing) * 0); } } .before\:block { &::before { content: var(--tw-content); display: block; } } .before\:h-3 { &::before { content: var(--tw-content); height: calc(var(--spacing) * 3); } } .before\:w-1 { &::before { content: var(--tw-content); width: calc(var(--spacing) * 1); } } .before\:w-3 { &::before { content: var(--tw-content); width: calc(var(--spacing) * 3); } } .before\:shrink-0 { &::before { content: var(--tw-content); flex-shrink: 0; } } .before\:rounded-full { &::before { content: var(--tw-content); border-radius: calc(infinity * 1px); } } .before\:bg-green-400 { &::before { content: var(--tw-content); background-color: var(--color-green-400); } } .before\:bg-green-500 { &::before { content: var(--tw-content); background-color: var(--color-green-500); } } .before\:bg-red-500 { &::before { content: var(--tw-content); background-color: var(--color-red-500); } } .before\:text-\[11px\] { &::before { content: var(--tw-content); font-size: 11px; } } .before\:font-normal { &::before { content: var(--tw-content); --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); } } .before\:content-\[\'x\'\] { &::before { --tw-content: 'x'; content: var(--tw-content); } } .after\:\!content-none { &::after { content: var(--tw-content); --tw-content: none !important; content: none !important; } } .first\:pt-0 { &:first-child { padding-top: calc(var(--spacing) * 0); } } .first\:\[--line-before\:\#0000\] { &:first-child { --line-before: #0000; } } .last\:mr-0 { &:last-child { margin-right: calc(var(--spacing) * 0); } } .last\:mb-0 { &:last-child { margin-bottom: calc(var(--spacing) * 0); } } .last\:mb-6 { &:last-child { margin-bottom: calc(var(--spacing) * 6); } } .last\:border-0 { &:last-child { border-style: var(--tw-border-style); border-width: 0px; } } .last\:border-b { &:last-child { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } } .last\:border-b-0 { &:last-child { border-bottom-style: var(--tw-border-style); border-bottom-width: 0px; } } .last\:pb-0 { &:last-child { padding-bottom: calc(var(--spacing) * 0); } } .last\:\[--line-after\:\#0000\] { &:last-child { --line-after: #0000; } } .even\:bg-gray-50 { &:nth-child(even) { background-color: var(--color-gray-50); } } .even\:bg-gray-100 { &:nth-child(even) { background-color: var(--color-gray-100); } } .even\:bg-light { &:nth-child(even) { background-color: var(--color-light); } } .visited\:text-purple-600 { &:visited { color: var(--color-purple-600); } } .open\:flex { &:is([open], :popover-open, :open) { display: flex; } } .checked\:bg-green-500 { &:checked { background-color: var(--color-green-500); } } .invalid\:ring-2 { &:invalid { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .invalid\:ring-red-500 { &:invalid { --tw-ring-color: var(--color-red-500); } } .focus-within\:border-gray-700 { &:focus-within { border-color: var(--color-gray-700); } } .focus-within\:border-primary { &:focus-within { border-color: var(--color-primary); } } .focus-within\:bg-gray-50 { &:focus-within { background-color: var(--color-gray-50); } } .focus-within\:opacity-100 { &:focus-within { opacity: 100%; } } .focus-within\:ring-1 { &:focus-within { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .focus-within\:ring-2 { &:focus-within { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .focus-within\:ring-blue-300 { &:focus-within { --tw-ring-color: var(--color-blue-300); } } .focus-within\:ring-primary { &:focus-within { --tw-ring-color: var(--color-primary); } } .hover\:-translate-y-0\.5 { &:hover { @media (hover: hover) { --tw-translate-y: calc(var(--spacing) * -0.5); translate: var(--tw-translate-x) var(--tw-translate-y); } } } .hover\:scale-105 { &:hover { @media (hover: hover) { --tw-scale-x: 105%; --tw-scale-y: 105%; --tw-scale-z: 105%; scale: var(--tw-scale-x) var(--tw-scale-y); } } } .hover\:cursor-pointer { &:hover { @media (hover: hover) { cursor: pointer; } } } .hover\:border-blue-300 { &:hover { @media (hover: hover) { border-color: var(--color-blue-300); } } } .hover\:border-container { &:hover { @media (hover: hover) { border-color: var(--color-container); } } } .hover\:border-gray-200 { &:hover { @media (hover: hover) { border-color: var(--color-gray-200); } } } .hover\:border-gray-300 { &:hover { @media (hover: hover) { border-color: var(--color-gray-300); } } } .hover\:border-gray-400 { &:hover { @media (hover: hover) { border-color: var(--color-gray-400); } } } .hover\:border-gray-700 { &:hover { @media (hover: hover) { border-color: var(--color-gray-700); } } } .hover\:border-primary { &:hover { @media (hover: hover) { border-color: var(--color-primary); } } } .hover\:border-secondary { &:hover { @media (hover: hover) { border-color: var(--color-secondary); } } } .hover\:\!bg-green-600 { &:hover { @media (hover: hover) { background-color: var(--color-green-600) !important; } } } .hover\:bg-blue-100 { &:hover { @media (hover: hover) { background-color: var(--color-blue-100); } } } .hover\:bg-blue-700 { &:hover { @media (hover: hover) { background-color: var(--color-blue-700); } } } .hover\:bg-container-darker { &:hover { @media (hover: hover) { background-color: var(--color-container-darker); } } } .hover\:bg-container-lighter { &:hover { @media (hover: hover) { background-color: var(--color-container-lighter); } } } .hover\:bg-gray-50 { &:hover { @media (hover: hover) { background-color: var(--color-gray-50); } } } .hover\:bg-gray-100 { &:hover { @media (hover: hover) { background-color: var(--color-gray-100); } } } .hover\:bg-gray-200 { &:hover { @media (hover: hover) { background-color: var(--color-gray-200); } } } .hover\:bg-light { &:hover { @media (hover: hover) { background-color: var(--color-light); } } } .hover\:bg-primary\/80 { &:hover { @media (hover: hover) { background-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 80%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-primary) 80%, transparent); } } } } .hover\:bg-primary\/\[\.08\] { &:hover { @media (hover: hover) { background-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 8%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-primary) 8%, transparent); } } } } .hover\:bg-red-300 { &:hover { @media (hover: hover) { background-color: var(--color-red-300); } } } .hover\:bg-slate-50 { &:hover { @media (hover: hover) { background-color: var(--color-slate-50); } } } .hover\:text-black { &:hover { @media (hover: hover) { color: var(--color-black); } } } .hover\:text-blue-600 { &:hover { @media (hover: hover) { color: var(--color-blue-600); } } } .hover\:text-blue-700 { &:hover { @media (hover: hover) { color: var(--color-blue-700); } } } .hover\:text-blue-800 { &:hover { @media (hover: hover) { color: var(--color-blue-800); } } } .hover\:text-fg { &:hover { @media (hover: hover) { color: var(--color-fg); } } } .hover\:text-gray-200 { &:hover { @media (hover: hover) { color: var(--color-gray-200); } } } .hover\:text-gray-400 { &:hover { @media (hover: hover) { color: var(--color-gray-400); } } } .hover\:text-gray-500 { &:hover { @media (hover: hover) { color: var(--color-gray-500); } } } .hover\:text-gray-600 { &:hover { @media (hover: hover) { color: var(--color-gray-600); } } } .hover\:text-gray-700 { &:hover { @media (hover: hover) { color: var(--color-gray-700); } } } .hover\:text-gray-800 { &:hover { @media (hover: hover) { color: var(--color-gray-800); } } } .hover\:text-gray-900 { &:hover { @media (hover: hover) { color: var(--color-gray-900); } } } .hover\:text-green-700 { &:hover { @media (hover: hover) { color: var(--color-green-700); } } } .hover\:text-indigo-500 { &:hover { @media (hover: hover) { color: var(--color-indigo-500); } } } .hover\:text-red-600 { &:hover { @media (hover: hover) { color: var(--color-red-600); } } } .hover\:text-red-800 { &:hover { @media (hover: hover) { color: var(--color-red-800); } } } .hover\:text-secondary { &:hover { @media (hover: hover) { color: var(--color-secondary); } } } .hover\:text-slate-500 { &:hover { @media (hover: hover) { color: var(--color-slate-500); } } } .hover\:text-slate-700 { &:hover { @media (hover: hover) { color: var(--color-slate-700); } } } .hover\:text-slate-800 { &:hover { @media (hover: hover) { color: var(--color-slate-800); } } } .hover\:text-white { &:hover { @media (hover: hover) { color: var(--color-white); } } } .hover\:text-yellow-500 { &:hover { @media (hover: hover) { color: var(--color-yellow-500); } } } .hover\:text-yellow-600 { &:hover { @media (hover: hover) { color: var(--color-yellow-600); } } } .hover\:no-underline { &:hover { @media (hover: hover) { text-decoration-line: none; } } } .hover\:underline { &:hover { @media (hover: hover) { text-decoration-line: underline; } } } .hover\:opacity-75 { &:hover { @media (hover: hover) { opacity: 75%; } } } .hover\:opacity-100 { &:hover { @media (hover: hover) { opacity: 100%; } } } .hover\:shadow-md { &:hover { @media (hover: hover) { --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .hover\:shadow-none { &:hover { @media (hover: hover) { --tw-shadow: 0 0 #0000; box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .hover\:shadow-sm { &:hover { @media (hover: hover) { --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .hover\:ring-2 { &:hover { @media (hover: hover) { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .hover\:ring-blue-300 { &:hover { @media (hover: hover) { --tw-ring-color: var(--color-blue-300); } } } .hover\:ring-blue-700\/20 { &:hover { @media (hover: hover) { --tw-ring-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 20%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-blue-700) 20%, transparent); } } } } .hover\:ring-gray-300 { &:hover { @media (hover: hover) { --tw-ring-color: var(--color-gray-300); } } } .hover\:ring-primary { &:hover { @media (hover: hover) { --tw-ring-color: var(--color-primary); } } } .hover\:\[-moz-appearance\:auto\] { &:hover { @media (hover: hover) { -moz-appearance: auto; } } } .focus\:not-sr-only { &:focus { position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip-path: none; white-space: normal; } } .focus\:absolute { &:focus { position: absolute; } } .focus\:z-10 { &:focus { z-index: 10; } } .focus\:z-30 { &:focus { z-index: 30; } } .focus\:z-40 { &:focus { z-index: 40; } } .focus\:border-0 { &:focus { border-style: var(--tw-border-style); border-width: 0px; } } .focus\:border-blue-300 { &:focus { border-color: var(--color-blue-300); } } .focus\:border-gray-200 { &:focus { border-color: var(--color-gray-200); } } .focus\:border-primary { &:focus { border-color: var(--color-primary); } } .focus\:border-red-500 { &:focus { border-color: var(--color-red-500); } } .focus\:border-transparent { &:focus { border-color: transparent; } } .focus\:\!bg-green-500 { &:focus { background-color: var(--color-green-500) !important; } } .focus\:bg-white { &:focus { background-color: var(--color-white); } } .focus\:bg-none { &:focus { background-image: none; } } .focus\:p-2 { &:focus { padding: calc(var(--spacing) * 2); } } .focus\:text-gray-600 { &:focus { color: var(--color-gray-600); } } .focus\:text-slate-500 { &:focus { color: var(--color-slate-500); } } .focus\:ring-0 { &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .focus\:ring-1 { &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .focus\:ring-2 { &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .focus\:ring-4 { &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .focus\:shadow-primary\/30 { &:focus { --tw-shadow-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 30%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-primary) 30%, transparent) var(--tw-shadow-alpha), transparent); } } } .focus\:ring-blue-200 { &:focus { --tw-ring-color: var(--color-blue-200); } } .focus\:ring-blue-300 { &:focus { --tw-ring-color: var(--color-blue-300); } } .focus\:ring-blue-500 { &:focus { --tw-ring-color: var(--color-blue-500); } } .focus\:ring-blue-700 { &:focus { --tw-ring-color: var(--color-blue-700); } } .focus\:ring-gray-200 { &:focus { --tw-ring-color: var(--color-gray-200); } } .focus\:ring-primary { &:focus { --tw-ring-color: var(--color-primary); } } .focus\:ring-red-500 { &:focus { --tw-ring-color: var(--color-red-500); } } .focus\:ring-secondary { &:focus { --tw-ring-color: var(--color-secondary); } } .focus\:ring-white\/60 { &:focus { --tw-ring-color: color-mix(in srgb, #fff 60%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-ring-color: color-mix(in oklab, var(--color-white) 60%, transparent); } } } .focus\:ring-offset-2 { &:focus { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } .focus\:outline-red-300 { &:focus { outline-color: var(--color-red-300); } } .focus\:outline-none { &:focus { --tw-outline-style: none; outline-style: none; } } .focus\:ring-inset { &:focus { --tw-ring-inset: inset; } } .focus-visible\:outline { &:focus-visible { outline-style: var(--tw-outline-style); outline-width: 1px; } } .focus-visible\:outline-0 { &:focus-visible { outline-style: var(--tw-outline-style); outline-width: 0px; } } .focus-visible\:outline-2 { &:focus-visible { outline-style: var(--tw-outline-style); outline-width: 2px; } } .focus-visible\:outline-offset-2 { &:focus-visible { outline-offset: 2px; } } .focus-visible\:outline-primary { &:focus-visible { outline-color: var(--color-primary); } } .active\:border-blue-500 { &:active { border-color: var(--color-blue-500); } } .active\:bg-gray-100 { &:active { background-color: var(--color-gray-100); } } .active\:bg-red-400 { &:active { background-color: var(--color-red-400); } } .active\:bg-slate-100 { &:active { background-color: var(--color-slate-100); } } .active\:text-gray-500 { &:active { color: var(--color-gray-500); } } .active\:text-gray-700 { &:active { color: var(--color-gray-700); } } .active\:text-gray-800 { &:active { color: var(--color-gray-800); } } .active\:text-red-900 { &:active { color: var(--color-red-900); } } .active\:ring-0 { &:active { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .active\:ring-2 { &:active { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .active\:ring-blue-500 { &:active { --tw-ring-color: var(--color-blue-500); } } .disabled\:pointer-events-none { &:disabled { pointer-events: none; } } .disabled\:invisible { &:disabled { visibility: hidden; } } .disabled\:bg-gray-100 { &:disabled { background-color: var(--color-gray-100); } } .disabled\:opacity-30 { &:disabled { opacity: 30%; } } .disabled\:opacity-60 { &:disabled { opacity: 60%; } } .disabled\:opacity-75 { &:disabled { opacity: 75%; } } .has-\[\:focus-visible\]\:outline-2 { &:has(*:is(:focus-visible)) { outline-style: var(--tw-outline-style); outline-width: 2px; } } .aria-\[current\=page\]\:font-medium { &[aria-current="page"] { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } } .aria-\[current\=step\]\:font-bold { &[aria-current="step"] { --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } } .data-\[active\]\:border-primary { &[data-active] { border-color: var(--color-primary); } } .data-\[checked\]\:border-blue-500 { &[data-checked] { border-color: var(--color-blue-500); } } .data-\[checked\]\:text-blue-800 { &[data-checked] { color: var(--color-blue-800); } } .data-\[checked\]\:ring-2 { &[data-checked] { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .data-\[checked\]\:ring-blue-500 { &[data-checked] { --tw-ring-color: var(--color-blue-500); } } .data-\[checked\]\:focus-within\:border-blue-400 { &[data-checked] { &:focus-within { border-color: var(--color-blue-400); } } } .data-\[checked\]\:focus-within\:ring { &[data-checked] { &:focus-within { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .data-\[checked\]\:focus-within\:ring-2 { &[data-checked] { &:focus-within { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .data-\[checked\]\:focus-within\:ring-blue-100 { &[data-checked] { &:focus-within { --tw-ring-color: var(--color-blue-100); } } } .data-\[checked\]\:focus-within\:ring-blue-500 { &[data-checked] { &:focus-within { --tw-ring-color: var(--color-blue-500); } } } .data-\[checked\]\:focus-within\:ring-offset-2 { &[data-checked] { &:focus-within { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } } .data-\[checked\]\:focus-within\:ring-offset-blue-200 { &[data-checked] { &:focus-within { --tw-ring-offset-color: var(--color-blue-200); } } } .data-\[checked\]\:focus\:border-blue-400 { &[data-checked] { &:focus { border-color: var(--color-blue-400); } } } .data-\[checked\]\:focus\:ring { &[data-checked] { &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .data-\[checked\]\:focus\:ring-2 { &[data-checked] { &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } .data-\[checked\]\:focus\:ring-blue-100 { &[data-checked] { &:focus { --tw-ring-color: var(--color-blue-100); } } } .data-\[checked\]\:focus\:ring-blue-500 { &[data-checked] { &:focus { --tw-ring-color: var(--color-blue-500); } } } .data-\[checked\]\:focus\:ring-offset-2 { &[data-checked] { &:focus { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } } .data-\[checked\]\:focus\:ring-offset-blue-200 { &[data-checked] { &:focus { --tw-ring-offset-color: var(--color-blue-200); } } } .data-\[expanded\=true\]\:mb-3 { &[data-expanded="true"] { margin-bottom: calc(var(--spacing) * 3); } } .data-\[expanded\=true\]\:h-auto { &[data-expanded="true"] { height: auto; } } .data-\[expanded\=true\]\:mask-none { &[data-expanded="true"] { mask-image: none; } } .motion-reduce\:duration-0 { @media (prefers-reduced-motion: reduce) { --tw-duration: 0ms; transition-duration: 0ms; } } .sm\:not-sr-only { @media (width >= 40rem) { position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip-path: none; white-space: normal; } } .sm\:order-1 { @media (width >= 40rem) { order: 1; } } .sm\:order-2 { @media (width >= 40rem) { order: 2; } } .sm\:order-3 { @media (width >= 40rem) { order: 3; } } .sm\:col-span-2 { @media (width >= 40rem) { grid-column: span 2 / span 2; } } .sm\:col-span-4 { @media (width >= 40rem) { grid-column: span 4 / span 4; } } .sm\:col-span-6 { @media (width >= 40rem) { grid-column: span 6 / span 6; } } .sm\:-mx-4 { @media (width >= 40rem) { margin-inline: calc(var(--spacing) * -4); } } .sm\:mt-0 { @media (width >= 40rem) { margin-top: calc(var(--spacing) * 0); } } .sm\:mt-6 { @media (width >= 40rem) { margin-top: calc(var(--spacing) * 6); } } .sm\:mt-8 { @media (width >= 40rem) { margin-top: calc(var(--spacing) * 8); } } .sm\:mr-1 { @media (width >= 40rem) { margin-right: calc(var(--spacing) * 1); } } .sm\:mr-8 { @media (width >= 40rem) { margin-right: calc(var(--spacing) * 8); } } .sm\:mb-0 { @media (width >= 40rem) { margin-bottom: calc(var(--spacing) * 0); } } .sm\:ml-2 { @media (width >= 40rem) { margin-left: calc(var(--spacing) * 2); } } .sm\:ml-3 { @media (width >= 40rem) { margin-left: calc(var(--spacing) * 3); } } .sm\:ml-4 { @media (width >= 40rem) { margin-left: calc(var(--spacing) * 4); } } .sm\:ml-6 { @media (width >= 40rem) { margin-left: calc(var(--spacing) * 6); } } .sm\:block { @media (width >= 40rem) { display: block; } } .sm\:flex { @media (width >= 40rem) { display: flex; } } .sm\:grid { @media (width >= 40rem) { display: grid; } } .sm\:hidden { @media (width >= 40rem) { display: none; } } .sm\:inline-block { @media (width >= 40rem) { display: inline-block; } } .sm\:h-28 { @media (width >= 40rem) { height: calc(var(--spacing) * 28); } } .sm\:h-56 { @media (width >= 40rem) { height: calc(var(--spacing) * 56); } } .sm\:w-1\/2 { @media (width >= 40rem) { width: calc(1 / 2 * 100%); } } .sm\:w-1\/3 { @media (width >= 40rem) { width: calc(1 / 3 * 100%); } } .sm\:w-20 { @media (width >= 40rem) { width: calc(var(--spacing) * 20); } } .sm\:w-28 { @media (width >= 40rem) { width: calc(var(--spacing) * 28); } } .sm\:w-40 { @media (width >= 40rem) { width: calc(var(--spacing) * 40); } } .sm\:w-44 { @media (width >= 40rem) { width: calc(var(--spacing) * 44); } } .sm\:w-48 { @media (width >= 40rem) { width: calc(var(--spacing) * 48); } } .sm\:w-96 { @media (width >= 40rem) { width: calc(var(--spacing) * 96); } } .sm\:w-\[28rem\] { @media (width >= 40rem) { width: 28rem; } } .sm\:w-\[auto\] { @media (width >= 40rem) { width: auto; } } .sm\:w-auto { @media (width >= 40rem) { width: auto; } } .sm\:w-full { @media (width >= 40rem) { width: 100%; } } .sm\:max-w-\[theme\(spacing\.24\)\] { @media (width >= 40rem) { max-width: 6rem; } } .sm\:max-w-prose { @media (width >= 40rem) { max-width: 65ch; } } .sm\:flex-shrink-0 { @media (width >= 40rem) { flex-shrink: 0; } } .sm\:flex-shrink-0 { @media (width >= 40rem) { flex-shrink: 0; } } .sm\:table-fixed { @media (width >= 40rem) { table-layout: fixed; } } .sm\:translate-y-0 { @media (width >= 40rem) { --tw-translate-y: calc(var(--spacing) * 0); translate: var(--tw-translate-x) var(--tw-translate-y); } } .sm\:scale-95 { @media (width >= 40rem) { --tw-scale-x: 95%; --tw-scale-y: 95%; --tw-scale-z: 95%; scale: var(--tw-scale-x) var(--tw-scale-y); } } .sm\:scale-100 { @media (width >= 40rem) { --tw-scale-x: 100%; --tw-scale-y: 100%; --tw-scale-z: 100%; scale: var(--tw-scale-x) var(--tw-scale-y); } } .sm\:cursor-default { @media (width >= 40rem) { cursor: default; } } .sm\:columns-2 { @media (width >= 40rem) { columns: 2; } } .sm\:grid-cols-2 { @media (width >= 40rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .sm\:grid-cols-3 { @media (width >= 40rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } .sm\:grid-cols-4 { @media (width >= 40rem) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .sm\:grid-cols-8 { @media (width >= 40rem) { grid-template-columns: repeat(8, minmax(0, 1fr)); } } .sm\:flex-row { @media (width >= 40rem) { flex-direction: row; } } .sm\:flex-wrap { @media (width >= 40rem) { flex-wrap: wrap; } } .sm\:items-baseline { @media (width >= 40rem) { align-items: baseline; } } .sm\:items-center { @media (width >= 40rem) { align-items: center; } } .sm\:items-start { @media (width >= 40rem) { align-items: flex-start; } } .sm\:justify-between { @media (width >= 40rem) { justify-content: space-between; } } .sm\:justify-end { @media (width >= 40rem) { justify-content: flex-end; } } .sm\:gap-2 { @media (width >= 40rem) { gap: calc(var(--spacing) * 2); } } .sm\:gap-4 { @media (width >= 40rem) { gap: calc(var(--spacing) * 4); } } .sm\:gap-6 { @media (width >= 40rem) { gap: calc(var(--spacing) * 6); } } .sm\:gap-10 { @media (width >= 40rem) { gap: calc(var(--spacing) * 10); } } .sm\:gap-x-6 { @media (width >= 40rem) { column-gap: calc(var(--spacing) * 6); } } .sm\:space-x-4 { @media (width >= 40rem) { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } } .sm\:rounded-lg { @media (width >= 40rem) { border-radius: var(--radius-lg); } } .sm\:p-8 { @media (width >= 40rem) { padding: calc(var(--spacing) * 8); } } .sm\:p-10 { @media (width >= 40rem) { padding: calc(var(--spacing) * 10); } } .sm\:p-16 { @media (width >= 40rem) { padding: calc(var(--spacing) * 16); } } .sm\:px-0 { @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 0); } } .sm\:px-4 { @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 4); } } .sm\:px-6 { @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 6); } } .sm\:px-8 { @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 8); } } .sm\:px-10 { @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 10); } } .sm\:py-0 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 0); } } .sm\:py-1 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 1); } } .sm\:py-2 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 2); } } .sm\:py-6 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 6); } } .sm\:py-8 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 8); } } .sm\:py-10 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 10); } } .sm\:py-14 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 14); } } .sm\:py-16 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 16); } } .sm\:py-32 { @media (width >= 40rem) { padding-block: calc(var(--spacing) * 32); } } .sm\:pt-4 { @media (width >= 40rem) { padding-top: calc(var(--spacing) * 4); } } .sm\:pt-48 { @media (width >= 40rem) { padding-top: calc(var(--spacing) * 48); } } .sm\:pr-0 { @media (width >= 40rem) { padding-right: calc(var(--spacing) * 0); } } .sm\:pr-9 { @media (width >= 40rem) { padding-right: calc(var(--spacing) * 9); } } .sm\:pb-0 { @media (width >= 40rem) { padding-bottom: calc(var(--spacing) * 0); } } .sm\:text-right { @media (width >= 40rem) { text-align: right; } } .sm\:text-2xl { @media (width >= 40rem) { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); } } .sm\:text-3xl { @media (width >= 40rem) { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); } } .sm\:text-4xl { @media (width >= 40rem) { font-size: var(--text-4xl); line-height: var(--tw-leading, var(--text-4xl--line-height)); } } .sm\:text-5xl { @media (width >= 40rem) { font-size: var(--text-5xl); line-height: var(--tw-leading, var(--text-5xl--line-height)); } } .sm\:text-lg { @media (width >= 40rem) { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); } } .sm\:text-sm { @media (width >= 40rem) { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); } } .sm\:text-xl { @media (width >= 40rem) { font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); } } .sm\:leading-6 { @media (width >= 40rem) { --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); } } .sm\:text-clip { @media (width >= 40rem) { text-overflow: clip; } } .sm\:whitespace-normal { @media (width >= 40rem) { white-space: normal; } } .sm\:text-\[0\] { @media (width >= 40rem) { color: 0; } } .sm\:opacity-100 { @media (width >= 40rem) { opacity: 100%; } } .sm\:duration-700 { @media (width >= 40rem) { --tw-duration: 700ms; transition-duration: 700ms; } } .md\:visible { @media (width >= 48rem) { visibility: visible; } } .md\:sr-only { @media (width >= 48rem) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } } .md\:relative { @media (width >= 48rem) { position: relative; } } .md\:top-4 { @media (width >= 48rem) { top: calc(var(--spacing) * 4); } } .md\:top-6 { @media (width >= 48rem) { top: calc(var(--spacing) * 6); } } .md\:right-2 { @media (width >= 48rem) { right: calc(var(--spacing) * 2); } } .md\:right-5 { @media (width >= 48rem) { right: calc(var(--spacing) * 5); } } .md\:bottom-2 { @media (width >= 48rem) { bottom: calc(var(--spacing) * 2); } } .md\:left-2 { @media (width >= 48rem) { left: calc(var(--spacing) * 2); } } .md\:left-3 { @media (width >= 48rem) { left: calc(var(--spacing) * 3); } } .md\:left-6 { @media (width >= 48rem) { left: calc(var(--spacing) * 6); } } .md\:order-1 { @media (width >= 48rem) { order: 1; } } .md\:order-2 { @media (width >= 48rem) { order: 2; } } .md\:order-3 { @media (width >= 48rem) { order: 3; } } .md\:col-span-1 { @media (width >= 48rem) { grid-column: span 1 / span 1; } } .md\:col-span-2 { @media (width >= 48rem) { grid-column: span 2 / span 2; } } .md\:col-span-3 { @media (width >= 48rem) { grid-column: span 3 / span 3; } } .md\:col-span-6 { @media (width >= 48rem) { grid-column: span 6 / span 6; } } .md\:col-span-7 { @media (width >= 48rem) { grid-column: span 7 / span 7; } } .md\:col-span-9 { @media (width >= 48rem) { grid-column: span 9 / span 9; } } .md\:col-span-12 { @media (width >= 48rem) { grid-column: span 12 / span 12; } } .md\:col-start-1 { @media (width >= 48rem) { grid-column-start: 1; } } .md\:col-start-8 { @media (width >= 48rem) { grid-column-start: 8; } } .md\:row-span-1 { @media (width >= 48rem) { grid-row: span 1 / span 1; } } .md\:row-span-8 { @media (width >= 48rem) { grid-row: span 8 / span 8; } } .md\:row-start-1 { @media (width >= 48rem) { grid-row-start: 1; } } .md\:mx-0 { @media (width >= 48rem) { margin-inline: calc(var(--spacing) * 0); } } .md\:my-0 { @media (width >= 48rem) { margin-block: calc(var(--spacing) * 0); } } .md\:my-12 { @media (width >= 48rem) { margin-block: calc(var(--spacing) * 12); } } .md\:me-0 { @media (width >= 48rem) { margin-inline-end: calc(var(--spacing) * 0); } } .md\:-mt-1 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * -1); } } .md\:-mt-px { @media (width >= 48rem) { margin-top: -1px; } } .md\:mt-0 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 0); } } .md\:mt-3 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 3); } } .md\:mt-4 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 4); } } .md\:mt-5 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 5); } } .md\:mt-6 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 6); } } .md\:mt-8 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 8); } } .md\:mt-10 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 10); } } .md\:mt-20 { @media (width >= 48rem) { margin-top: calc(var(--spacing) * 20); } } .md\:-mr-1 { @media (width >= 48rem) { margin-right: calc(var(--spacing) * -1); } } .md\:-mr-4 { @media (width >= 48rem) { margin-right: calc(var(--spacing) * -4); } } .md\:mr-0 { @media (width >= 48rem) { margin-right: calc(var(--spacing) * 0); } } .md\:mr-4 { @media (width >= 48rem) { margin-right: calc(var(--spacing) * 4); } } .md\:mr-5 { @media (width >= 48rem) { margin-right: calc(var(--spacing) * 5); } } .md\:mb-0 { @media (width >= 48rem) { margin-bottom: calc(var(--spacing) * 0); } } .md\:mb-2 { @media (width >= 48rem) { margin-bottom: calc(var(--spacing) * 2); } } .md\:mb-3 { @media (width >= 48rem) { margin-bottom: calc(var(--spacing) * 3); } } .md\:mb-6 { @media (width >= 48rem) { margin-bottom: calc(var(--spacing) * 6); } } .md\:mb-16 { @media (width >= 48rem) { margin-bottom: calc(var(--spacing) * 16); } } .md\:ml-0 { @media (width >= 48rem) { margin-left: calc(var(--spacing) * 0); } } .md\:ml-2 { @media (width >= 48rem) { margin-left: calc(var(--spacing) * 2); } } .md\:ml-6 { @media (width >= 48rem) { margin-left: calc(var(--spacing) * 6); } } .md\:ml-auto { @media (width >= 48rem) { margin-left: auto; } } .md\:\!hidden { @media (width >= 48rem) { display: none !important; } } .md\:block { @media (width >= 48rem) { display: block; } } .md\:flex { @media (width >= 48rem) { display: flex; } } .md\:grid { @media (width >= 48rem) { display: grid; } } .md\:hidden { @media (width >= 48rem) { display: none; } } .md\:inline { @media (width >= 48rem) { display: inline; } } .md\:inline-block { @media (width >= 48rem) { display: inline-block; } } .md\:inline-flex { @media (width >= 48rem) { display: inline-flex; } } .md\:aspect-auto { @media (width >= 48rem) { aspect-ratio: auto; } } .md\:h-5 { @media (width >= 48rem) { height: calc(var(--spacing) * 5); } } .md\:h-6 { @media (width >= 48rem) { height: calc(var(--spacing) * 6); } } .md\:h-24 { @media (width >= 48rem) { height: calc(var(--spacing) * 24); } } .md\:h-48 { @media (width >= 48rem) { height: calc(var(--spacing) * 48); } } .md\:h-\[30rem\] { @media (width >= 48rem) { height: 30rem; } } .md\:h-auto { @media (width >= 48rem) { height: auto; } } .md\:min-h-\[140px\] { @media (width >= 48rem) { min-height: 140px; } } .md\:w-1\/2 { @media (width >= 48rem) { width: calc(1 / 2 * 100%); } } .md\:w-1\/3 { @media (width >= 48rem) { width: calc(1 / 3 * 100%); } } .md\:w-1\/4 { @media (width >= 48rem) { width: calc(1 / 4 * 100%); } } .md\:w-2\/3 { @media (width >= 48rem) { width: calc(2 / 3 * 100%); } } .md\:w-2\/4 { @media (width >= 48rem) { width: calc(2 / 4 * 100%); } } .md\:w-2\/6 { @media (width >= 48rem) { width: calc(2 / 6 * 100%); } } .md\:w-3\/4 { @media (width >= 48rem) { width: calc(3 / 4 * 100%); } } .md\:w-4\/4 { @media (width >= 48rem) { width: calc(4 / 4 * 100%); } } .md\:w-4\/6 { @media (width >= 48rem) { width: calc(4 / 6 * 100%); } } .md\:w-5 { @media (width >= 48rem) { width: calc(var(--spacing) * 5); } } .md\:w-6 { @media (width >= 48rem) { width: calc(var(--spacing) * 6); } } .md\:w-8\/12 { @media (width >= 48rem) { width: calc(8 / 12 * 100%); } } .md\:w-24 { @media (width >= 48rem) { width: calc(var(--spacing) * 24); } } .md\:w-\[50rem\] { @media (width >= 48rem) { width: 50rem; } } .md\:w-\[50vw\] { @media (width >= 48rem) { width: 50vw; } } .md\:w-\[640px\] { @media (width >= 48rem) { width: 640px; } } .md\:w-auto { @media (width >= 48rem) { width: auto; } } .md\:w-full { @media (width >= 48rem) { width: 100%; } } .md\:max-w-\[7rem\] { @media (width >= 48rem) { max-width: 7rem; } } .md\:max-w-\[320px\] { @media (width >= 48rem) { max-width: 320px; } } .md\:max-w-sm { @media (width >= 48rem) { max-width: var(--container-sm); } } .md\:max-w-xl { @media (width >= 48rem) { max-width: var(--container-xl); } } .md\:max-w-xs { @media (width >= 48rem) { max-width: var(--container-xs); } } .md\:min-w-\[120px\] { @media (width >= 48rem) { min-width: 120px; } } .md\:min-w-full { @media (width >= 48rem) { min-width: 100%; } } .md\:flex-1 { @media (width >= 48rem) { flex: 1; } } .md\:flex-\[0_0_180px\] { @media (width >= 48rem) { flex: 0 0 180px; } } .md\:flex-\[none\] { @media (width >= 48rem) { flex: none; } } .md\:shrink-0 { @media (width >= 48rem) { flex-shrink: 0; } } .md\:-translate-x-1\/3 { @media (width >= 48rem) { --tw-translate-x: calc(calc(1 / 3 * 100%) * -1); translate: var(--tw-translate-x) var(--tw-translate-y); } } .md\:grid-cols-1 { @media (width >= 48rem) { grid-template-columns: repeat(1, minmax(0, 1fr)); } } .md\:grid-cols-2 { @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .md\:grid-cols-3 { @media (width >= 48rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } .md\:grid-cols-4 { @media (width >= 48rem) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .md\:grid-cols-\[42\%_minmax\(0px\,1fr\)\] { @media (width >= 48rem) { grid-template-columns: 42% minmax(0px,1fr); } } .md\:grid-rows-1 { @media (width >= 48rem) { grid-template-rows: repeat(1, minmax(0, 1fr)); } } .md\:flex-col { @media (width >= 48rem) { flex-direction: column; } } .md\:flex-col-reverse { @media (width >= 48rem) { flex-direction: column-reverse; } } .md\:flex-row { @media (width >= 48rem) { flex-direction: row; } } .md\:flex-row-reverse { @media (width >= 48rem) { flex-direction: row-reverse; } } .md\:flex-wrap { @media (width >= 48rem) { flex-wrap: wrap; } } .md\:items-center { @media (width >= 48rem) { align-items: center; } } .md\:items-end { @media (width >= 48rem) { align-items: flex-end; } } .md\:items-start { @media (width >= 48rem) { align-items: flex-start; } } .md\:justify-between { @media (width >= 48rem) { justify-content: space-between; } } .md\:justify-center { @media (width >= 48rem) { justify-content: center; } } .md\:justify-end { @media (width >= 48rem) { justify-content: flex-end; } } .md\:justify-start { @media (width >= 48rem) { justify-content: flex-start; } } .md\:gap-0 { @media (width >= 48rem) { gap: calc(var(--spacing) * 0); } } .md\:gap-1 { @media (width >= 48rem) { gap: calc(var(--spacing) * 1); } } .md\:gap-4 { @media (width >= 48rem) { gap: calc(var(--spacing) * 4); } } .md\:gap-6 { @media (width >= 48rem) { gap: calc(var(--spacing) * 6); } } .md\:gap-8 { @media (width >= 48rem) { gap: calc(var(--spacing) * 8); } } .md\:space-y-0 { @media (width >= 48rem) { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 0) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 0) * calc(1 - var(--tw-space-y-reverse))); } } } .md\:space-y-4 { @media (width >= 48rem) { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse))); } } } .md\:space-y-6 { @media (width >= 48rem) { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))); } } } .md\:gap-x-2 { @media (width >= 48rem) { column-gap: calc(var(--spacing) * 2); } } .md\:gap-x-6 { @media (width >= 48rem) { column-gap: calc(var(--spacing) * 6); } } .md\:gap-x-8 { @media (width >= 48rem) { column-gap: calc(var(--spacing) * 8); } } .md\:gap-x-10 { @media (width >= 48rem) { column-gap: calc(var(--spacing) * 10); } } .md\:space-x-4 { @media (width >= 48rem) { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } } .md\:gap-y-14 { @media (width >= 48rem) { row-gap: calc(var(--spacing) * 14); } } .md\:self-auto { @media (width >= 48rem) { align-self: auto; } } .md\:justify-self-end { @media (width >= 48rem) { justify-self: flex-end; } } .md\:justify-self-start { @media (width >= 48rem) { justify-self: flex-start; } } .md\:overflow-y-visible { @media (width >= 48rem) { overflow-y: visible; } } .md\:rounded-2xl { @media (width >= 48rem) { border-radius: var(--radius-2xl); } } .md\:rounded-md { @media (width >= 48rem) { border-radius: var(--radius-md); } } .md\:rounded-xl { @media (width >= 48rem) { border-radius: var(--radius-xl); } } .md\:border { @media (width >= 48rem) { border-style: var(--tw-border-style); border-width: 1px; } } .md\:border-0 { @media (width >= 48rem) { border-style: var(--tw-border-style); border-width: 0px; } } .md\:border-b { @media (width >= 48rem) { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; } } .md\:border-gray-200 { @media (width >= 48rem) { border-color: var(--color-gray-200); } } .md\:bg-transparent { @media (width >= 48rem) { background-color: transparent; } } .md\:bg-white { @media (width >= 48rem) { background-color: var(--color-white); } } .md\:p-0 { @media (width >= 48rem) { padding: calc(var(--spacing) * 0); } } .md\:p-4\.5 { @media (width >= 48rem) { padding: calc(var(--spacing) * 4.5); } } .md\:p-6 { @media (width >= 48rem) { padding: calc(var(--spacing) * 6); } } .md\:p-8 { @media (width >= 48rem) { padding: calc(var(--spacing) * 8); } } .md\:p-12 { @media (width >= 48rem) { padding: calc(var(--spacing) * 12); } } .md\:px-0 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 0); } } .md\:px-2 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 2); } } .md\:px-6 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 6); } } .md\:px-8 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 8); } } .md\:px-12 { @media (width >= 48rem) { padding-inline: calc(var(--spacing) * 12); } } .md\:py-0 { @media (width >= 48rem) { padding-block: calc(var(--spacing) * 0); } } .md\:py-3 { @media (width >= 48rem) { padding-block: calc(var(--spacing) * 3); } } .md\:py-4 { @media (width >= 48rem) { padding-block: calc(var(--spacing) * 4); } } .md\:py-5 { @media (width >= 48rem) { padding-block: calc(var(--spacing) * 5); } } .md\:py-6 { @media (width >= 48rem) { padding-block: calc(var(--spacing) * 6); } } .md\:pt-6 { @media (width >= 48rem) { padding-top: calc(var(--spacing) * 6); } } .md\:pt-8 { @media (width >= 48rem) { padding-top: calc(var(--spacing) * 8); } } .md\:pt-10 { @media (width >= 48rem) { padding-top: calc(var(--spacing) * 10); } } .md\:pt-12 { @media (width >= 48rem) { padding-top: calc(var(--spacing) * 12); } } .md\:pt-16 { @media (width >= 48rem) { padding-top: calc(var(--spacing) * 16); } } .md\:pr-4 { @media (width >= 48rem) { padding-right: calc(var(--spacing) * 4); } } .md\:pb-2 { @media (width >= 48rem) { padding-bottom: calc(var(--spacing) * 2); } } .md\:pb-6 { @media (width >= 48rem) { padding-bottom: calc(var(--spacing) * 6); } } .md\:pb-8 { @media (width >= 48rem) { padding-bottom: calc(var(--spacing) * 8); } } .md\:pb-12 { @media (width >= 48rem) { padding-bottom: calc(var(--spacing) * 12); } } .md\:pb-20 { @media (width >= 48rem) { padding-bottom: calc(var(--spacing) * 20); } } .md\:pl-0 { @media (width >= 48rem) { padding-left: calc(var(--spacing) * 0); } } .md\:pl-5 { @media (width >= 48rem) { padding-left: calc(var(--spacing) * 5); } } .md\:pl-6 { @media (width >= 48rem) { padding-left: calc(var(--spacing) * 6); } } .md\:text-center { @media (width >= 48rem) { text-align: center; } } .md\:text-left { @media (width >= 48rem) { text-align: left; } } .md\:text-start { @media (width >= 48rem) { text-align: start; } } .md\:text-2xl { @media (width >= 48rem) { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); } } .md\:text-3xl { @media (width >= 48rem) { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); } } .md\:text-base { @media (width >= 48rem) { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); } } .md\:text-lg { @media (width >= 48rem) { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); } } .md\:text-sm { @media (width >= 48rem) { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); } } .md\:text-xl { @media (width >= 48rem) { font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); } } .md\:shadow-none { @media (width >= 48rem) { --tw-shadow: 0 0 #0000; box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .md\:\[--snap-cols\:2\] { @media (width >= 48rem) { --snap-cols: 2; } } .md\:focus-within\:bg-white { @media (width >= 48rem) { &:focus-within { background-color: var(--color-white); } } } .lg\:sr-only { @media (width >= 64rem) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } } .lg\:absolute { @media (width >= 64rem) { position: absolute; } } .lg\:sticky { @media (width >= 64rem) { position: sticky; } } .lg\:inset-x-0 { @media (width >= 64rem) { inset-inline: calc(var(--spacing) * 0); } } .lg\:inset-y-0 { @media (width >= 64rem) { inset-block: calc(var(--spacing) * 0); } } .lg\:inset-y-auto { @media (width >= 64rem) { inset-block: auto; } } .lg\:top-0 { @media (width >= 64rem) { top: calc(var(--spacing) * 0); } } .lg\:top-4 { @media (width >= 64rem) { top: calc(var(--spacing) * 4); } } .lg\:top-6 { @media (width >= 64rem) { top: calc(var(--spacing) * 6); } } .lg\:top-24 { @media (width >= 64rem) { top: calc(var(--spacing) * 24); } } .lg\:top-\[calc\(100\%\+0\.5rem\)\] { @media (width >= 64rem) { top: calc(100% + 0.5rem); } } .lg\:top-\[var\(--msrp-block-offset\)\] { @media (width >= 64rem) { top: var(--msrp-block-offset); } } .lg\:right-4 { @media (width >= 64rem) { right: calc(var(--spacing) * 4); } } .lg\:right-6 { @media (width >= 64rem) { right: calc(var(--spacing) * 6); } } .lg\:right-auto { @media (width >= 64rem) { right: auto; } } .lg\:bottom-0 { @media (width >= 64rem) { bottom: calc(var(--spacing) * 0); } } .lg\:bottom-4 { @media (width >= 64rem) { bottom: calc(var(--spacing) * 4); } } .lg\:bottom-auto { @media (width >= 64rem) { bottom: auto; } } .lg\:left-0 { @media (width >= 64rem) { left: calc(var(--spacing) * 0); } } .lg\:left-4 { @media (width >= 64rem) { left: calc(var(--spacing) * 4); } } .lg\:left-\[var\(--msrp-inline-offset\)\] { @media (width >= 64rem) { left: var(--msrp-inline-offset); } } .lg\:order-0 { @media (width >= 64rem) { order: 0; } } .lg\:order-2 { @media (width >= 64rem) { order: 2; } } .lg\:order-first { @media (width >= 64rem) { order: -9999; } } .lg\:col-span-1 { @media (width >= 64rem) { grid-column: span 1 / span 1; } } .lg\:col-span-2 { @media (width >= 64rem) { grid-column: span 2 / span 2; } } .lg\:col-span-3 { @media (width >= 64rem) { grid-column: span 3 / span 3; } } .lg\:col-span-4 { @media (width >= 64rem) { grid-column: span 4 / span 4; } } .lg\:col-span-5 { @media (width >= 64rem) { grid-column: span 5 / span 5; } } .lg\:col-span-6 { @media (width >= 64rem) { grid-column: span 6 / span 6; } } .lg\:col-span-7 { @media (width >= 64rem) { grid-column: span 7 / span 7; } } .lg\:col-span-8 { @media (width >= 64rem) { grid-column: span 8 / span 8; } } .lg\:col-start-1 { @media (width >= 64rem) { grid-column-start: 1; } } .lg\:col-start-3 { @media (width >= 64rem) { grid-column-start: 3; } } .lg\:col-start-5 { @media (width >= 64rem) { grid-column-start: 5; } } .lg\:row-start-1 { @media (width >= 64rem) { grid-row-start: 1; } } .lg\:row-end-1 { @media (width >= 64rem) { grid-row-end: 1; } } .lg\:mx-0 { @media (width >= 64rem) { margin-inline: calc(var(--spacing) * 0); } } .lg\:mx-3 { @media (width >= 64rem) { margin-inline: calc(var(--spacing) * 3); } } .lg\:mx-4 { @media (width >= 64rem) { margin-inline: calc(var(--spacing) * 4); } } .lg\:me-3 { @media (width >= 64rem) { margin-inline-end: calc(var(--spacing) * 3); } } .lg\:mt-0 { @media (width >= 64rem) { margin-top: calc(var(--spacing) * 0); } } .lg\:mt-2 { @media (width >= 64rem) { margin-top: calc(var(--spacing) * 2); } } .lg\:mt-3 { @media (width >= 64rem) { margin-top: calc(var(--spacing) * 3); } } .lg\:mt-6 { @media (width >= 64rem) { margin-top: calc(var(--spacing) * 6); } } .lg\:mt-10 { @media (width >= 64rem) { margin-top: calc(var(--spacing) * 10); } } .lg\:mr-0 { @media (width >= 64rem) { margin-right: calc(var(--spacing) * 0); } } .lg\:mr-3 { @media (width >= 64rem) { margin-right: calc(var(--spacing) * 3); } } .lg\:mr-4 { @media (width >= 64rem) { margin-right: calc(var(--spacing) * 4); } } .lg\:ml-0 { @media (width >= 64rem) { margin-left: calc(var(--spacing) * 0); } } .lg\:ml-2 { @media (width >= 64rem) { margin-left: calc(var(--spacing) * 2); } } .lg\:ml-4 { @media (width >= 64rem) { margin-left: calc(var(--spacing) * 4); } } .lg\:ml-5 { @media (width >= 64rem) { margin-left: calc(var(--spacing) * 5); } } .lg\:block { @media (width >= 64rem) { display: block; } } .lg\:flex { @media (width >= 64rem) { display: flex; } } .lg\:grid { @media (width >= 64rem) { display: grid; } } .lg\:hidden { @media (width >= 64rem) { display: none; } } .lg\:inline { @media (width >= 64rem) { display: inline; } } .lg\:inline-block { @media (width >= 64rem) { display: inline-block; } } .lg\:inline-flex { @media (width >= 64rem) { display: inline-flex; } } .lg\:table-cell { @media (width >= 64rem) { display: table-cell; } } .lg\:h-36 { @media (width >= 64rem) { height: calc(var(--spacing) * 36); } } .lg\:h-\[280px\] { @media (width >= 64rem) { height: 280px; } } .lg\:w-1\/2 { @media (width >= 64rem) { width: calc(1 / 2 * 100%); } } .lg\:w-1\/3 { @media (width >= 64rem) { width: calc(1 / 3 * 100%); } } .lg\:w-1\/4 { @media (width >= 64rem) { width: calc(1 / 4 * 100%); } } .lg\:w-2\/3 { @media (width >= 64rem) { width: calc(2 / 3 * 100%); } } .lg\:w-3\/5 { @media (width >= 64rem) { width: calc(3 / 5 * 100%); } } .lg\:w-6\/12 { @media (width >= 64rem) { width: calc(6 / 12 * 100%); } } .lg\:w-36 { @media (width >= 64rem) { width: calc(var(--spacing) * 36); } } .lg\:w-56 { @media (width >= 64rem) { width: calc(var(--spacing) * 56); } } .lg\:w-80 { @media (width >= 64rem) { width: calc(var(--spacing) * 80); } } .lg\:w-\[37\%\] { @media (width >= 64rem) { width: 37%; } } .lg\:w-auto { @media (width >= 64rem) { width: auto; } } .lg\:max-w-none { @media (width >= 64rem) { max-width: none; } } .lg\:max-w-xs { @media (width >= 64rem) { max-width: var(--container-xs); } } .lg\:flex-1 { @media (width >= 64rem) { flex: 1; } } .lg\:table-auto { @media (width >= 64rem) { table-layout: auto; } } .lg\:-translate-y-0 { @media (width >= 64rem) { --tw-translate-y: calc(var(--spacing) * -0); translate: var(--tw-translate-x) var(--tw-translate-y); } } .lg\:columns-3 { @media (width >= 64rem) { columns: 3; } } .lg\:grid-cols-1 { @media (width >= 64rem) { grid-template-columns: repeat(1, minmax(0, 1fr)); } } .lg\:grid-cols-2 { @media (width >= 64rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .lg\:grid-cols-3 { @media (width >= 64rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } .lg\:grid-cols-4 { @media (width >= 64rem) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .lg\:grid-cols-5 { @media (width >= 64rem) { grid-template-columns: repeat(5, minmax(0, 1fr)); } } .lg\:grid-cols-6 { @media (width >= 64rem) { grid-template-columns: repeat(6, minmax(0, 1fr)); } } .lg\:grid-cols-8 { @media (width >= 64rem) { grid-template-columns: repeat(8, minmax(0, 1fr)); } } .lg\:grid-cols-12 { @media (width >= 64rem) { grid-template-columns: repeat(12, minmax(0, 1fr)); } } .lg\:grid-cols-\[minmax\(0px\,1fr\)_26rem\] { @media (width >= 64rem) { grid-template-columns: minmax(0px,1fr) 26rem; } } .lg\:flex-col { @media (width >= 64rem) { flex-direction: column; } } .lg\:flex-row { @media (width >= 64rem) { flex-direction: row; } } .lg\:flex-row-reverse { @media (width >= 64rem) { flex-direction: row-reverse; } } .lg\:flex-nowrap { @media (width >= 64rem) { flex-wrap: nowrap; } } .lg\:items-center { @media (width >= 64rem) { align-items: center; } } .lg\:items-end { @media (width >= 64rem) { align-items: flex-end; } } .lg\:items-start { @media (width >= 64rem) { align-items: flex-start; } } .lg\:justify-between { @media (width >= 64rem) { justify-content: space-between; } } .lg\:justify-center { @media (width >= 64rem) { justify-content: center; } } .lg\:justify-end { @media (width >= 64rem) { justify-content: flex-end; } } .lg\:justify-start { @media (width >= 64rem) { justify-content: flex-start; } } .lg\:gap-4 { @media (width >= 64rem) { gap: calc(var(--spacing) * 4); } } .lg\:gap-6 { @media (width >= 64rem) { gap: calc(var(--spacing) * 6); } } .lg\:gap-8 { @media (width >= 64rem) { gap: calc(var(--spacing) * 8); } } .lg\:gap-10 { @media (width >= 64rem) { gap: calc(var(--spacing) * 10); } } .lg\:gap-12 { @media (width >= 64rem) { gap: calc(var(--spacing) * 12); } } .lg\:gap-16 { @media (width >= 64rem) { gap: calc(var(--spacing) * 16); } } .lg\:gap-x-6 { @media (width >= 64rem) { column-gap: calc(var(--spacing) * 6); } } .lg\:gap-x-8 { @media (width >= 64rem) { column-gap: calc(var(--spacing) * 8); } } .lg\:gap-x-10 { @media (width >= 64rem) { column-gap: calc(var(--spacing) * 10); } } .lg\:space-x-4 { @media (width >= 64rem) { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } } .lg\:space-x-8 { @media (width >= 64rem) { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 8) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 8) * calc(1 - var(--tw-space-x-reverse))); } } } .lg\:border-0 { @media (width >= 64rem) { border-style: var(--tw-border-style); border-width: 0px; } } .lg\:border-t-0 { @media (width >= 64rem) { border-top-style: var(--tw-border-style); border-top-width: 0px; } } .lg\:p-12 { @media (width >= 64rem) { padding: calc(var(--spacing) * 12); } } .lg\:px-4 { @media (width >= 64rem) { padding-inline: calc(var(--spacing) * 4); } } .lg\:px-5 { @media (width >= 64rem) { padding-inline: calc(var(--spacing) * 5); } } .lg\:px-8 { @media (width >= 64rem) { padding-inline: calc(var(--spacing) * 8); } } .lg\:py-2 { @media (width >= 64rem) { padding-block: calc(var(--spacing) * 2); } } .lg\:py-8 { @media (width >= 64rem) { padding-block: calc(var(--spacing) * 8); } } .lg\:pb-0 { @media (width >= 64rem) { padding-bottom: calc(var(--spacing) * 0); } } .lg\:pl-0 { @media (width >= 64rem) { padding-left: calc(var(--spacing) * 0); } } .lg\:pl-\[var\(--thumb-size\)\] { @media (width >= 64rem) { padding-left: var(--thumb-size); } } .lg\:text-center { @media (width >= 64rem) { text-align: center; } } .lg\:text-left { @media (width >= 64rem) { text-align: left; } } .lg\:text-4xl { @media (width >= 64rem) { font-size: var(--text-4xl); line-height: var(--tw-leading, var(--text-4xl--line-height)); } } .lg\:text-5xl { @media (width >= 64rem) { font-size: var(--text-5xl); line-height: var(--tw-leading, var(--text-5xl--line-height)); } } .lg\:text-xl { @media (width >= 64rem) { font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); } } .lg\:font-normal { @media (width >= 64rem) { --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); } } .lg\:text-gray-400 { @media (width >= 64rem) { color: var(--color-gray-400); } } .lg\:shadow-lg { @media (width >= 64rem) { --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } .lg\:\[--snap-cols\:3\] { @media (width >= 64rem) { --snap-cols: 3; } } .xl\:right-8 { @media (width >= 71.25rem) { right: calc(var(--spacing) * 8); } } .xl\:bottom-8 { @media (width >= 71.25rem) { bottom: calc(var(--spacing) * 8); } } .xl\:left-8 { @media (width >= 71.25rem) { left: calc(var(--spacing) * 8); } } .xl\:order-1 { @media (width >= 71.25rem) { order: 1; } } .xl\:order-2 { @media (width >= 71.25rem) { order: 2; } } .xl\:col-span-1 { @media (width >= 71.25rem) { grid-column: span 1 / span 1; } } .xl\:col-span-2 { @media (width >= 71.25rem) { grid-column: span 2 / span 2; } } .xl\:col-span-3 { @media (width >= 71.25rem) { grid-column: span 3 / span 3; } } .xl\:col-span-9 { @media (width >= 71.25rem) { grid-column: span 9 / span 9; } } .xl\:col-start-4 { @media (width >= 71.25rem) { grid-column-start: 4; } } .xl\:mx-2 { @media (width >= 71.25rem) { margin-inline: calc(var(--spacing) * 2); } } .xl\:mx-4 { @media (width >= 71.25rem) { margin-inline: calc(var(--spacing) * 4); } } .xl\:mt-0 { @media (width >= 71.25rem) { margin-top: calc(var(--spacing) * 0); } } .xl\:mt-20 { @media (width >= 71.25rem) { margin-top: calc(var(--spacing) * 20); } } .xl\:ml-0 { @media (width >= 71.25rem) { margin-left: calc(var(--spacing) * 0); } } .xl\:block { @media (width >= 71.25rem) { display: block; } } .xl\:flex { @media (width >= 71.25rem) { display: flex; } } .xl\:grid { @media (width >= 71.25rem) { display: grid; } } .xl\:w-1\/2 { @media (width >= 71.25rem) { width: calc(1 / 2 * 100%); } } .xl\:w-1\/4 { @media (width >= 71.25rem) { width: calc(1 / 4 * 100%); } } .xl\:w-\[70rem\] { @media (width >= 71.25rem) { width: 70rem; } } .xl\:w-auto { @media (width >= 71.25rem) { width: auto; } } .xl\:grid-cols-2 { @media (width >= 71.25rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .xl\:grid-cols-3 { @media (width >= 71.25rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } .xl\:grid-cols-4 { @media (width >= 71.25rem) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .xl\:flex-row { @media (width >= 71.25rem) { flex-direction: row; } } .xl\:flex-nowrap { @media (width >= 71.25rem) { flex-wrap: nowrap; } } .xl\:items-start { @media (width >= 71.25rem) { align-items: flex-start; } } .xl\:justify-between { @media (width >= 71.25rem) { justify-content: space-between; } } .xl\:gap-4 { @media (width >= 71.25rem) { gap: calc(var(--spacing) * 4); } } .xl\:space-y-0 { @media (width >= 71.25rem) { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 0) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 0) * calc(1 - var(--tw-space-y-reverse))); } } } .xl\:gap-x-8 { @media (width >= 71.25rem) { column-gap: calc(var(--spacing) * 8); } } .xl\:space-x-4 { @media (width >= 71.25rem) { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } } .xl\:border-none { @media (width >= 71.25rem) { --tw-border-style: none; border-style: none; } } .xl\:p-2 { @media (width >= 71.25rem) { padding: calc(var(--spacing) * 2); } } .xl\:p-12 { @media (width >= 71.25rem) { padding: calc(var(--spacing) * 12); } } .xl\:px-0 { @media (width >= 71.25rem) { padding-inline: calc(var(--spacing) * 0); } } .xl\:py-32 { @media (width >= 71.25rem) { padding-block: calc(var(--spacing) * 32); } } .xl\:text-6xl { @media (width >= 71.25rem) { font-size: var(--text-6xl); line-height: var(--tw-leading, var(--text-6xl--line-height)); } } .xl\:text-base { @media (width >= 71.25rem) { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); } } .xl\:\[--snap-cols\:4\] { @media (width >= 71.25rem) { --snap-cols: 4; } } .xl\:focus-within\:relative { @media (width >= 71.25rem) { &:focus-within { position: relative; } } } .\32 xl\:block { @media (width >= 82.5rem) { display: block; } } .\32 xl\:w-96 { @media (width >= 82.5rem) { width: calc(var(--spacing) * 96); } } .\32 xl\:grid-cols-5 { @media (width >= 82.5rem) { grid-template-columns: repeat(5, minmax(0, 1fr)); } } .\32 xl\:flex-row { @media (width >= 82.5rem) { flex-direction: row; } } .\32 xl\:\[--snap-cols\:5\] { @media (width >= 82.5rem) { --snap-cols: 5; } } .rtl\:-rotate-180 { &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) { rotate: calc(180deg * -1); } } .rtl\:rotate-180 { &:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) { rotate: 180deg; } } .dark\:bg-blue-200 { @media (prefers-color-scheme: dark) { background-color: var(--color-blue-200); } } .dark\:bg-gray-500 { @media (prefers-color-scheme: dark) { background-color: var(--color-gray-500); } } .dark\:text-blue-800 { @media (prefers-color-scheme: dark) { color: var(--color-blue-800); } } .dark\:text-gray-400 { @media (prefers-color-scheme: dark) { color: var(--color-gray-400); } } .print\:mt-0 { @media print { margin-top: calc(var(--spacing) * 0); } } .print\:ml-5 { @media print { margin-left: calc(var(--spacing) * 5); } } .print\:flex { @media print { display: flex; } } .print\:grid-cols-2 { @media print { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .print\:text-left { @media print { text-align: left; } } .sm\:\[\&_\.label-street\.sr-only\]\:invisible { @media (width >= 40rem) { & .label-street.sr-only { visibility: hidden; } } } .sm\:\[\&_\.label-street\.sr-only\]\:not-sr-only { @media (width >= 40rem) { & .label-street.sr-only { position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip-path: none; white-space: normal; } } } .sm\:\[\&_\.label-street\.sr-only\]\:mb-2 { @media (width >= 40rem) { & .label-street.sr-only { margin-bottom: calc(var(--spacing) * 2); } } } .\[\&_\.price-label\]\:sr-only { & .price-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } } .\[\&_\.price-wrapper\]\:\[font-size\:inherit\] { & .price-wrapper { font-size: inherit; } } .\[\&_\.price-wrapper\]\:text-inherit { & .price-wrapper { color: inherit; } } .md\:\[\&_label\.sr-only\]\:invisible { @media (width >= 48rem) { & label.sr-only { visibility: hidden; } } } .md\:\[\&_label\.sr-only\]\:not-sr-only { @media (width >= 48rem) { & label.sr-only { position: static; width: auto; height: auto; padding: 0; margin: 0; overflow: visible; clip-path: none; white-space: normal; } } } .md\:\[\&_label\.sr-only\]\:mb-2 { @media (width >= 48rem) { & label.sr-only { margin-bottom: calc(var(--spacing) * 2); } } } .\[\&\:\:-webkit-calendar-picker-indicator\]\:\!hidden { &::-webkit-calendar-picker-indicator { display: none !important; } } .\[\&\:\:-webkit-details-marker\]\:hidden { &::-webkit-details-marker { display: none; } } .\[\&\:\:-webkit-inner-spin-button\]\:invisible { &::-webkit-inner-spin-button { visibility: hidden; } } .\[\&\:\:-webkit-inner-spin-button\]\:m-0 { &::-webkit-inner-spin-button { margin: calc(var(--spacing) * 0); } } .\[\&\:\:-webkit-inner-spin-button\]\:hidden { &::-webkit-inner-spin-button { display: none; } } .\[\&\:\:-webkit-inner-spin-button\]\:appearance-none { &::-webkit-inner-spin-button { appearance: none; } } .\[\&\:\:-webkit-inner-spin-button\]\:hover\:visible { &::-webkit-inner-spin-button { &:hover { @media (hover: hover) { visibility: visible; } } } } .\[\&\:\:-webkit-list-button\]\:w-0 { &::-webkit-list-button { width: calc(var(--spacing) * 0); } } .\[\&\:\:-webkit-outer-spin-button\]\:appearance-none { &::-webkit-outer-spin-button { appearance: none; } } .\[\&\:active\:not\(\[data-checked\]\)\]\:ring-offset-2 { &:active:not([data-checked]) { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } .\[\&\:focus-within\:not\(\[data-checked\]\)\]\:ring-offset-2 { &:focus-within:not([data-checked]) { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } .\[\&\:focus\:not\(\[data-checked\]\)\]\:ring-offset-2 { &:focus:not([data-checked]) { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } .\[\&\:hover\:not\(\[data-checked\]\)\]\:ring-offset-2 { &:hover:not([data-checked]) { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } .\[\&\>\:not\(\.loader\)\]\:invisible { &>:not(.loader) { visibility: hidden; } } .\[\&\[data-checked\]\:not\(\:focus\)\]\:bg-blue-50 { &[data-checked]:not(:focus) { background-color: var(--color-blue-50); } } .\[\&\[data-checked\]\:not\(\:focus\)\]\:ring-offset-2 { &[data-checked]:not(:focus) { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } .\[\&\[data-checked\]\:not\(\:focus-within\)\]\:bg-blue-50 { &[data-checked]:not(:focus-within) { background-color: var(--color-blue-50); } } .\[\&\[data-checked\]\:not\(\:focus-within\)\]\:ring-offset-2 { &[data-checked]:not(:focus-within) { --tw-ring-offset-width: 2px; --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); } } } @layer base { :where(:focus-visible) { outline: var(--outline-size, 2px) solid var(--color-primary); outline-offset: var(--outline-offset, 2px); } :where(:active:focus-visible) { outline-offset: 0; transition: var( --outline-transition, outline-offset 150ms cubic-bezier(0.25, 0, 0.4, 1) ); } :disabled { cursor: not-allowed; } :target { scroll-margin-block: var(--anchor-offset, 6ex); } @media (prefers-reduced-motion: no-preference) { :where(html):has(:target) { scroll-behavior: smooth; } } html { block-size: 100%; scrollbar-gutter: stable; } body { min-block-size: 100%; } :where( :any-link, button, input, label[for], select, summary, textarea, [tabindex]:not([tabindex^="-"]) ) { touch-action: manipulation; } :where( :any-link, button, label[for], label:has(input:is([type="radio"], [type="checkbox"]):enabled), select:has(option:enabled), summary ) { cursor: pointer; } :where(dialog) { position: fixed; max-block-size: calc(100% - 2rem); max-inline-size: calc(100% - 2rem); background-color: var(--color-surface, canvas); color: var(--color-fg, canvastext); margin: auto; box-shadow: var(--shadow-lg); &::backdrop { background-color: var(--backdrop, hsl(0 0% 0% / 20%)); } } :where(:root:has(dialog[open]:modal)) { overflow: hidden; } address { font-style: normal; } } @media print { *, *::before, *::after { box-shadow: none !important; text-shadow: none !important; } :is(h1, h2, h3, h4, h5, h6) { page-break-after: avoid; } :is(h2, h3, h4, h5, h6, p) { orphans: 3; widows: 3; } :is(tr, img, svg, pre, blockquote) { page-break-inside: avoid; } abbr[title]::after { content: " (" attr(title) ")"; } :is(.columns, .container) { max-width: 100% !important; } } @layer base { @view-transition { navigation: auto; } :root { accent-color: var(--color-primary); caret-color: var(--color-primary); interpolate-size: allow-keywords; } body { color: var(--color-fg); } .border, .border-t, .border-b, .border-x, .border-y, .border-s, .border-l { border-color: var(--color-gray-200); } } [x-cloak] { display: none !important; } @layer components { .actions-toolbar { display: flex; gap: calc(var(--spacing) * 4); flex-direction: column; margin-block-start: calc(var(--spacing) * 6); padding-block-start: calc(var(--spacing) * 4); border-block-start-width: 1px; border-block-start-color: var(--color-gray-300); @media (width >= 48rem) { flex-direction: row-reverse; align-items: center; } & a.back { text-decoration-line: underline; } } } .btn-size-lg { padding-inline: calc(var(--spacing) * 10); padding-block: calc(var(--spacing) * 4); font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); } .btn-size-sm { padding-inline: calc(var(--spacing) * 2); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); } @layer components { .card { position: relative; border-radius: var(--card-radius, var(--radius-lg)); border-width: 1px; padding-block: var(--card-py, calc(var(--spacing) * 6)); padding-inline: var(--card-px, calc(var(--spacing) * 6)); border-color: var(--card-stroke, var(--color-gray-300)); background-color: var(--card-bg, var(--color-surface)); color: var(--card-color, var(--color-fg)); transition-property: color, background-color, border-color, box-shadow, outline-color; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); } .card-interactive:is(:hover, :focus-within) { --card-stroke: #0000; box-shadow: var(--shadow-lg); } } @layer base { [type="checkbox"][role="switch"] { --switch-width: calc(var(--spacing) * 9); --switch-height: calc(var(--spacing) * 5); --switch-thumb-offset: calc(var(--switch-width) - var(--switch-height)); border-radius: calc(infinity * 1px); border-width: 2px; block-size: var(--switch-height); inline-size: var(--switch-width); &:not(:disabled) { cursor: pointer; } &::after { content: ""; display: block; aspect-ratio: 1; height: 100%; border-radius: calc(infinity * 1px); border: 1px solid var(--form-bg); background-color: var(--form-stroke); transition: background-color 150ms, border-color 150ms, translate 150ms; } &:checked { background-image: none; &::after { background-color: var(--form-bg); translate: var(--switch-thumb-offset) 0%; } } &:dir(rtl):checked { translate: calc(var(--switch-thumb-offset) / -1) 0%; } } } @layer components { .form-input.qty { max-inline-size: calc(6ch + var(--form-px)); } .field { margin-top: calc(var(--spacing) * 4); &.field-reserved { --reserved-space: calc(var(--spacing) * 7); margin-block-end: var(--reserved-space); ul { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); &:last-of-type { margin-block-end: calc(var(--reserved-space) * -1); } } } &.choice { display: flex; align-items: center; label { margin-bottom: calc(var(--spacing) * 0); } input { margin-right: calc(var(--spacing) * 3); } } &.field-error .messages { color: var(--color-red-600); max-width: fit-content; } &.required > label { &::after { content: var(--tw-content); position: relative; } &::after { content: var(--tw-content); top: calc(var(--spacing) * -1); } &::after { content: var(--tw-content); --tw-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2'%3E%3Cpath d='M12 6v12M17.196 9 6.804 15M6.804 9l10.392 6'/%3E%3C/svg%3E"); --tw-icon-size: 1em; display: inline-block; width: var(--tw-icon-size); height: var(--tw-icon-size); background-color: currentcolor; mask-repeat: no-repeat; mask-size: contain; mask-image: var(--tw-icon); } &::after { content: var(--tw-content); font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); } &::after { content: var(--tw-content); color: var(--color-red-600); } } } .field .label { display: block; font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-900); } .form-input, .form-email, .form-select, .form-multiselect, .form-textarea { width: 100%; border-radius: var(--radius-md); border-style: var(--tw-border-style); border-width: 1px; border-color: var(--color-gray-300); font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); &:focus { border-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 50%, transparent); @supports (color: color-mix(in lab, red, red)) { border-color: color-mix(in oklab, var(--color-primary) 50%, transparent); } --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); --tw-ring-color: var(--color-primary); --tw-ring-opacity: 50; } } .actions-toolbar { margin-top: calc(var(--spacing) * 3); display: flex; align-items: center; gap: calc(var(--spacing) * 4); border-top-style: var(--tw-border-style); border-top-width: 1px; padding-top: calc(var(--spacing) * 3); .action { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); &.back { color: var(--color-gray-800); &:hover { @media (hover: hover) { color: var(--color-gray-800); } } } } .primary button { border-radius: var(--radius-md); &[class*="bg-opacity-"] { background-color: oklch(48.8% 0.243 264.376); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix( in srgb, var(--color-primary) calc(100% / var(--tw-bg-opacity)), #0000 ); } } background-color: var(--color-primary); padding-inline: calc(var(--spacing) * 3); padding-block: calc(var(--spacing) * 2); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-white); &:hover { @media (hover: hover) { background-color: color-mix(in srgb, oklch(48.8% 0.243 264.376) 900%, transparent); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix(in oklab, var(--color-primary) 900%, transparent); } } } } } } #password-strength-meter-container { display: none; } #password-strength-meter-container.password-weak, #password-strength-meter-container.password-medium, #password-strength-meter-container.password-strong, #password-strength-meter-container.password-very-strong { display: block; } #password-strength-meter-container #password-strength-meter-label { display: inline-flex; align-items: center; border-radius: var(--radius-md); padding-inline: calc(var(--spacing) * 1.5); padding-block: calc(var(--spacing) * 0.5); font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } .password-weak #password-strength-meter-label { background-color: var(--color-red-100); color: var(--color-red-700); } .password-medium #password-strength-meter-label { background-color: var(--color-yellow-100); color: var(--color-yellow-800); } .password-strong #password-strength-meter-label, .password-very-strong #password-strength-meter-label { background-color: var(--color-green-100); color: var(--color-green-700); } #password-strength-meter-container #password-strength-meter-label { display: inline-flex; align-items: center; border-radius: var(--radius-md); padding-inline: calc(var(--spacing) * 1.5); padding-block: calc(var(--spacing) * 0.5); font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } @layer components { .message { margin-bottom: calc(var(--spacing) * 2); display: flex; width: 100%; align-items: center; justify-content: space-between; border-radius: 0.25rem; background-color: var(--color-gray-100); padding: calc(var(--spacing) * 2); padding-left: calc(var(--spacing) * 5); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); color: var(--color-black); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); &.error { border-style: var(--tw-border-style); border-width: 2px; border-color: var(--color-red-500); background-color: var(--color-red-50); } &.success { border-style: var(--tw-border-style); border-width: 2px; border-color: var(--color-green-500); background-color: var(--color-green-50); } &.info, &.notice { border-style: var(--tw-border-style); border-width: 2px; border-color: var(--color-blue-500); background-color: var(--color-blue-50); } &.warning { border-style: var(--tw-border-style); border-width: 2px; border-color: var(--color-yellow-500); background-color: var(--color-yellow-50); } a { text-decoration-line: underline; } } } .page.messages { position: sticky; top: calc(var(--spacing) * 0); z-index: 20; .messages section#messages { width: 100%; @media (width >= 40rem) { max-width: 40rem; } @media (width >= 48rem) { max-width: 48rem; } @media (width >= 64rem) { max-width: 64rem; } @media (width >= 71.25rem) { max-width: 71.25rem; } @media (width >= 82.5rem) { max-width: 82.5rem; } padding-inline: calc(var(--spacing) * 4); @media (width >= 0) { max-width: var(--container-7xl); } margin-inline: auto; padding-block: calc(var(--spacing) * 3); } } @layer components { .rating-summary { display: flex; color: var(--color-primary); } } @layer components { .snap-track { --snap-cols: 1; --snap-gap: calc(var(--spacing) * 4); --snap-size: calc( (100% - var(--snap-gap) * (var(--snap-cols) - 1)) / var(--snap-cols) ); position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: var(--snap-size); gap: var(--snap-gap); padding-block: calc(var(--spacing) * 6); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; @media (prefers-reduced-motion: no-preference) { scroll-behavior: smooth; } & > * { scroll-snap-align: start; } } .snap-pager { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: calc(var(--spacing) * 3); min-block-size: calc(var(--spacing) * 11); padding-block: calc(var(--spacing) * 2); } .snap-marker { flex-shrink: 0; block-size: calc(var(--spacing) * 4); inline-size: calc(var(--spacing) * 4); border-width: 1px; border-color: var(--color-slate-600); border-radius: 1rem; transition-duration: 300ms; transition-property: border-color, background-color; @media (prefers-reduced-motion: no-preference) { transition-property: inline-size, border-color, background-color; will-change: inline-size; } &[aria-current="true"] { inline-size: calc(var(--spacing) * 7); border-color: #0000; background-color: var(--color-primary); } } } @layer components { .swatch-attribute-options { display: flex; flex-direction: row; flex-wrap: wrap; } .swatch-option { margin: calc(var(--spacing) * 1); display: flex; justify-content: center; border-style: var(--tw-border-style); border-width: 1px; padding-inline: calc(var(--spacing) * 2); padding-block: calc(var(--spacing) * 1); min-width: 40px; } } @layer components { :where(main:not(.product-main-full-width, .page-main-full-width)) { & .columns { width: 100%; @media (width >= 40rem) { max-width: 40rem; } @media (width >= 48rem) { max-width: 48rem; } @media (width >= 64rem) { max-width: 64rem; } @media (width >= 71.25rem) { max-width: 71.25rem; } @media (width >= 82.5rem) { max-width: 82.5rem; } margin-inline: auto; padding-inline: calc(var(--spacing) * 4); @media (width >= 0) { max-width: var(--container-7xl); } } } } .breadcrumbs-wrapper { display: flex; align-items: center; padding-block: calc(var(--spacing) * 2); @media (width >= 48rem) { padding-block: calc(var(--spacing) * 3); } button { position: relative; z-index: 10; display: block; flex-shrink: 0; overflow: hidden; padding-right: calc(var(--spacing) * 2); padding-left: calc(var(--spacing) * 4); font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); color: var(--color-gray-800); line-height: 34px !important; &:hover { &:before, &:after { &:hover { @media (hover: hover) { background-color: var(--color-gray-300); } } } } &:before, &:after { content: ""; position: absolute; z-index: calc(10 * -1); border-style: var(--tw-border-style); border-width: 1px; border-color: var(--color-gray-300); background-color: var(--color-white); } &:before { right: calc(var(--spacing) * 0); left: calc(var(--spacing) * 0); margin-left: 17px; height: 34px; border-top-right-radius: var(--radius-md); border-bottom-right-radius: var(--radius-md); border-left-style: var(--tw-border-style); border-left-width: 0px; } &:after { top: 3.5px; left: 3px; height: 27px; width: 27px; rotate: 45deg; border-radius: var(--radius-md); border-top-style: var(--tw-border-style); border-top-width: 0px; border-right-style: var(--tw-border-style); border-right-width: 0px; } } .breadcrumbs { margin-left: calc(var(--spacing) * 6); display: flex; align-items: center; :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse))); } font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-500); @media (width >= 64rem) { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } } li { display: flex; align-items: center; a { &:hover { @media (hover: hover) { color: var(--color-gray-700); } } } &:not(.breadcrumb-item-last) { &:after { content: ""; display: inline-block; width: 100%; height: inherit; background-color: currentColor; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-5 w-5 flex-shrink-0 text-gray-400' viewBox='0 0 20 20' fill='currentColor' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z' clip-rule='evenodd'%3E%3C/path%3E%3C/svg%3E"); mask-size: contain; mask-repeat: no-repeat; mask-position: center; margin-left: calc(var(--spacing) * 4); height: calc(var(--spacing) * 5); width: calc(var(--spacing) * 5); color: var(--color-gray-400); } } } .breadcrumb-item-first { a { display: flex; align-items: center; &:hover { &:after { &:hover { @media (hover: hover) { color: var(--color-gray-500); } } } } span { display: none; } &:after { content: ""; height: inherit; background-color: currentColor; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='h-4 w-4 flex-shrink-0' viewBox='0 0 20 20' fill='currentColor' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M9.293 2.293a1 1 0 011.414 0l7 7A1 1 0 0117 11h-1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-3a1 1 0 00-1-1H9a1 1 0 00-1 1v3a1 1 0 01-1 1H5a1 1 0 01-1-1v-6H3a1 1 0 01-.707-1.707l7-7z' clip-rule='evenodd'%3E%3C/path%3E%3C/svg%3E"); mask-size: contain; mask-repeat: no-repeat; mask-position: center; display: inline-block; height: calc(var(--spacing) * 4); width: calc(var(--spacing) * 4); color: var(--color-gray-400); } } } } } .catalog-product-view { .breadcrumbs-wrapper { .breadcrumbs { display: none; @media (width >= 48rem) { display: flex; } } } } .faq-search-index, .faq-category-view { .page-title { padding: calc(var(--spacing) * 0); } } .am-no-items { border-left-style: var(--tw-border-style); border-left-width: 4px; border-color: var(--color-yellow-400); background-color: var(--color-yellow-50); padding: calc(var(--spacing) * 4); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); color: var(--color-yellow-700); } .am-widget-categories-1 { margin-inline: auto; max-width: var(--container-4xl); } .cms-amasty-faq-home-page { #amfaq_search { width: 100%; @media (width >= 64rem) { width: calc(var(--spacing) * 96); } } } .faq-category-view { dl { dd { div { padding: calc(var(--spacing) * 0) !important; } } } } .snowdog-menu-link-topmenu-mobile { --tw-outline-style: none; outline-style: none; } @layer base { :where(form label) { margin-bottom: calc(var(--spacing) * 2); display: block; color: var(--color-fg-secondary); } :where(form legend) { margin-bottom: calc(var(--spacing) * 3); font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); & + br { display: none; } } :where(fieldset ~ fieldset) { margin-top: calc(var(--spacing) * 8); } } .price-box { .old-price, .special-price { display: block; .price-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } } .old-price { --price-font-size: 0.875em; --price-font-weight: normal; .price { text-decoration: line-through; } } .price-excluding-tax { display: block; &::after { content: " " attr(data-label); font-size: var(--price-font-size-label, 0.875rem); font-weight: var(--price-font-weight, normal); } } .price-tax-label { font-size: var(--price-font-size-label, 0.875rem); } } .price-including-tax + .price-excluding-tax { --price-font-size: 1rem; font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); &::before { content: attr(data-label) ': '; } } .price-excluding-tax, .price-including-tax { white-space: nowrap; .price { --tw-leading: var(--leading-relaxed); line-height: var(--leading-relaxed); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } } .price-excluding-tax { display: block; } .price-container.price-tier_price { display: flex; gap: calc(var(--spacing) * 1); } .price-container.price-tier_price > .price-including-tax + .price-excluding-tax { &::before { content: '(' attr(data-label) ': '; } &::after { content: ')'; } } .price-container.price-tier_price { display: flex; gap: calc(var(--spacing) * 1); & > .price-including-tax + .price-excluding-tax { &::before { content: "(" attr(data-label) ": "; } &::after { content: ")"; } } } .amrelated-content-container { .container { margin-bottom: calc(var(--spacing) * 0); padding: calc(var(--spacing) * 0); h3 { margin-top: calc(var(--spacing) * 5); font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); --tw-leading: calc(var(--spacing) * 10); line-height: calc(var(--spacing) * 10); --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); --tw-tracking: var(--tracking-tight); letter-spacing: var(--tracking-tight); color: var(--color-gray-900); } } .card { border-style: var(--tw-border-style); border-width: 0px; } .amrelated-content-wrapper { margin-top: calc(var(--spacing) * 0); padding-inline: calc(var(--spacing) * 0); } .amrelated-summary-content-container { .amrelated-equal { display: none; } .amrelated-price-wrapper { border-style: var(--tw-border-style); border-width: 0px; } } } .grecaptcha-badge { visibility: hidden; } .page-wrapper { display: flex; min-height: 100vh; flex-direction: column; } .page-main { flex-grow: 1; } .page-title { margin-bottom: calc(var(--spacing) * 6); padding-inline: calc(var(--spacing) * 4); font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); --tw-leading: calc(var(--spacing) * 9); line-height: calc(var(--spacing) * 9); --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } .columns { display: grid; grid-template-columns: minmax(0px, 1fr); gap: calc(var(--spacing) * 4) calc(var(--spacing) * 8); } @media (width >= 48rem) { :is([class*="page-layout-2columns-"], .page-layout-3columns) { --sidebar-width: 240px; --main-width: minmax(0px, 1fr); --page-layout: var(--sidebar-width) var(--main-width); .columns { grid-template-columns: var(--page-layout); grid-template-rows: auto 1fr; & > .column.main { grid-row: span 2; } } } .page-layout-2columns-left { .columns > .column.main { grid-column-start: 2; } } .page-layout-2columns-right { --page-layout: var(--main-width) var(--sidebar-width); .columns > .column.main { order: -1; } } } @media (width >= 64rem) { [class*="page-layout-2columns-"], .page-layout-3columns { --sidebar-width: 320px; } } @media (width >= 71.25rem) { .page-layout-3columns { --sidebar-width: 240px; --page-layout: var(--sidebar-width) var(--main-width) var(--sidebar-width); } } @layer components { .cms-content { --text-flow: 1em 1rem; --separator-flow: 2.5em; --list-flow: 0.5em; --h-color: initial; --h-family: initial; --h-size: 1.125em; --h-weight: 600; --h-line: 1.1; --h1-size: 3em; --h2-size: 2em; --h3-size: 1.625em; --h4-size: 1.375em; --marker-color: var(--color-primary); --link-color: var(--color-primary); --link-weight: 500; --blockquote-color: var(--color-primary); --table-py: calc(var(--spacing) * 3); --table-px: calc(var(--spacing) * 2); --table-stroke: var(--color-gray-400); --table-bg: canvas; --table-color: canvastext; :where(h1, h2, h3, h4, h5, h6, p, dl, ul, ol, pre, hgroup) { margin-block: var(--text-flow); } :where(blockquote, figure, hr) { margin-block: var(--separator-flow); margin-inline: 0; } :where([class~="lead"]) { font-size: 1.25em; } :where(h1, h2, h3, h4, h5, h6) { color: var(--h-color); font-family: var(--h-family); font-size: var(--h-size); font-weight: var(--h-weight); line-height: var(--h-line); text-wrap: balance; } :where(h1) { --h-size: var(--h1-size); } :where(h2) { --h-size: var(--h2-size); } :where(h3) { --h-size: var(--h3-size); } :where(h4) { --h-size: var(--h4-size); } ::marker { color: var(--marker-color); } :where(ul, ol) { list-style: revert; padding-inline-start: 2em; } :where(ol[type="a"]) { list-style-type: lower-alpha; } :where(ol[type="i"]) { list-style-type: lower-roman; } :where(ol[type="1"]) { list-style-type: decimal; } :where(blockquote) { border-inline-start: 4px solid var(--blockquote-color); padding-inline-start: 1.5em; padding-block: 0.25em; } :where(:any-link) { color: var(--link-color); font-weight: var(--link-weight); &:hover { text-decoration: underline; } } :where(table) { border-collapse: separate; border-spacing: 0; border-color: var(--table-stroke); } :where(thead, tbody, tfoot, tr, th, td) { border-color: inherit; text-align: inherit; } :where(th, td) { padding-block: var(--table-py); padding-inline: var(--table-px); background: var(--table-bg); color: var(--table-color); } :where(tr + tr :is(th, td)) { border-block-start-width: 1px; } :where(thead tr:last-child :is(th, td)) { border-block-end-width: 2px; } :where(tfoot tr:first-child :is(th, td)) { border-block-start-width: 2px; } :where(table:not(:has(.table-wrapper, [class*="overflow-"]))) { word-break: break-all; } > :where(:first-child) { margin-block-start: 0; } > :where(:last-child) { margin-block-end: 0; } color: var(--tw-prose-body); max-width: 65ch; :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; margin-bottom: 1.25em; } :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-lead); font-size: 1.25em; line-height: 1.6; margin-top: 1.2em; margin-bottom: 1.2em; } :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-links); text-decoration: underline; font-weight: 500; } :where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-bold); font-weight: 600; } :where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: decimal; margin-top: 1.25em; margin-bottom: 1.25em; padding-inline-start: 1.625em; } :where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-alpha; } :where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-alpha; } :where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-alpha; } :where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-alpha; } :where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-roman; } :where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-roman; } :where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: upper-roman; } :where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: lower-roman; } :where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: decimal; } :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) { list-style-type: disc; margin-top: 1.25em; margin-bottom: 1.25em; padding-inline-start: 1.625em; } :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker { font-weight: 400; color: var(--tw-prose-counters); } :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker { color: var(--tw-prose-bullets); } :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; margin-top: 1.25em; } :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-color: var(--tw-prose-hr); border-top-width: 1px; margin-top: 3em; margin-bottom: 3em; } :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 500; font-style: italic; color: var(--tw-prose-quotes); border-inline-start-width: 0.25rem; border-inline-start-color: var(--tw-prose-quote-borders); quotes: "\201C""\201D""\2018""\2019"; margin-top: 1.6em; margin-bottom: 1.6em; padding-inline-start: 1em; } :where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before { content: open-quote; } :where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after { content: close-quote; } :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 800; font-size: 2.25em; margin-top: 0; margin-bottom: 0.8888889em; line-height: 1.1111111; } :where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 900; color: inherit; } :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 700; font-size: 1.5em; margin-top: 2em; margin-bottom: 1em; line-height: 1.3333333; } :where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 800; color: inherit; } :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; font-size: 1.25em; margin-top: 1.6em; margin-bottom: 0.6em; line-height: 1.6; } :where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 700; color: inherit; } :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; margin-top: 1.5em; margin-bottom: 0.5em; line-height: 1.5; } :where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 700; color: inherit; } :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) { display: block; margin-top: 2em; margin-bottom: 2em; } :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { font-weight: 500; font-family: inherit; color: var(--tw-prose-kbd); box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows); font-size: 0.875em; border-radius: 0.3125rem; padding-top: 0.1875em; padding-inline-end: 0.375em; padding-bottom: 0.1875em; padding-inline-start: 0.375em; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-code); font-weight: 600; font-size: 0.875em; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before { content: "`"; } :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after { content: "`"; } :where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; font-size: 0.875em; } :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; font-size: 0.9em; } :where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: inherit; } :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-pre-code); background-color: var(--tw-prose-pre-bg); overflow-x: auto; font-weight: 400; font-size: 0.875em; line-height: 1.7142857; margin-top: 1.7142857em; margin-bottom: 1.7142857em; border-radius: 0.375rem; padding-top: 0.8571429em; padding-inline-end: 1.1428571em; padding-bottom: 0.8571429em; padding-inline-start: 1.1428571em; } :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) { background-color: transparent; border-width: 0; border-radius: 0; padding: 0; font-weight: inherit; color: inherit; font-size: inherit; font-family: inherit; line-height: inherit; } :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before { content: none; } :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after { content: none; } :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) { width: 100%; table-layout: auto; margin-top: 2em; margin-bottom: 2em; font-size: 0.875em; line-height: 1.7142857; } :where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-bottom-width: 1px; border-bottom-color: var(--tw-prose-th-borders); } :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-headings); font-weight: 600; vertical-align: bottom; padding-inline-end: 0.5714286em; padding-bottom: 0.5714286em; padding-inline-start: 0.5714286em; } :where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-bottom-width: 1px; border-bottom-color: var(--tw-prose-td-borders); } :where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-bottom-width: 0; } :where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { vertical-align: baseline; } :where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) { border-top-width: 1px; border-top-color: var(--tw-prose-th-borders); } :where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { vertical-align: top; } :where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { text-align: start; } :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) { color: var(--tw-prose-captions); font-size: 0.875em; line-height: 1.4285714; margin-top: 0.8571429em; } --tw-prose-body: oklch(37.3% 0.034 259.733); --tw-prose-headings: oklch(21% 0.034 264.665); --tw-prose-lead: oklch(44.6% 0.03 256.802); --tw-prose-links: oklch(21% 0.034 264.665); --tw-prose-bold: oklch(21% 0.034 264.665); --tw-prose-counters: oklch(55.1% 0.027 264.364); --tw-prose-bullets: oklch(87.2% 0.01 258.338); --tw-prose-hr: oklch(92.8% 0.006 264.531); --tw-prose-quotes: oklch(21% 0.034 264.665); --tw-prose-quote-borders: oklch(92.8% 0.006 264.531); --tw-prose-captions: oklch(55.1% 0.027 264.364); --tw-prose-kbd: oklch(21% 0.034 264.665); --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent); --tw-prose-code: oklch(21% 0.034 264.665); --tw-prose-pre-code: oklch(92.8% 0.006 264.531); --tw-prose-pre-bg: oklch(27.8% 0.033 256.848); --tw-prose-th-borders: oklch(87.2% 0.01 258.338); --tw-prose-td-borders: oklch(92.8% 0.006 264.531); --tw-prose-invert-body: oklch(87.2% 0.01 258.338); --tw-prose-invert-headings: #fff; --tw-prose-invert-lead: oklch(70.7% 0.022 261.325); --tw-prose-invert-links: #fff; --tw-prose-invert-bold: #fff; --tw-prose-invert-counters: oklch(70.7% 0.022 261.325); --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802); --tw-prose-invert-hr: oklch(37.3% 0.034 259.733); --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542); --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733); --tw-prose-invert-captions: oklch(70.7% 0.022 261.325); --tw-prose-invert-kbd: #fff; --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%); --tw-prose-invert-code: #fff; --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338); --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%); --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802); --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733); font-size: 1rem; line-height: 1.75; :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; margin-bottom: 0; } :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.5em; margin-bottom: 0.5em; } :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.375em; } :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0.375em; } :where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.75em; margin-bottom: 0.75em; } :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; } :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.25em; } :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; } :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 1.25em; } :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.75em; margin-bottom: 0.75em; } :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 1.25em; margin-bottom: 1.25em; } :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0.5em; padding-inline-start: 1.625em; } :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-top: 0.5714286em; padding-inline-end: 0.5714286em; padding-bottom: 0.5714286em; padding-inline-start: 0.5714286em; } :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-start: 0; } :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { padding-inline-end: 0; } :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 2em; margin-bottom: 2em; } :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-top: 0; } :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) { margin-bottom: 0; } max-width: 100%; } .table-wrapper { overflow: auto; } } #customer-login-container { display: grid; grid-template-columns: repeat(1, minmax(0, 1fr)); column-gap: calc(var(--spacing) * 8); row-gap: calc(var(--spacing) * 8); @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .order-links { display: flex; flex-wrap: wrap; gap: calc(var(--spacing) * 4); a { text-decoration: underline; } } .customer-account-login, body.account, .customer-account-forgotpassword, .customer-account-create, .cms-index-defaultnoroute, .checkout-onepage-success { background-color: var(--color-gray-50); } body { &.account, &.customer-account-login, &.customer-account-forgotpassword, &.customer-account-create { .page-main { margin: calc(var(--spacing) * 0); border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; border-color: var(--color-gray-200); padding-block: calc(var(--spacing) * 4); @media (width >= 48rem) { padding-block: calc(var(--spacing) * 12); } } .columns { row-gap: calc(var(--spacing) * 0); } } } .sales-order-view { .column.main { .card { .mt-12 { margin: calc(var(--spacing) * 0); } } } } .account { .page-title { padding: calc(var(--spacing) * 0); } .card { border-radius: var(--radius-xl); border-style: var(--tw-border-style); border-width: 1px; border-color: var(--color-gray-200); background-color: var(--color-white); padding: calc(var(--spacing) * 6); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); .card-title { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; border-color: var(--color-gray-200); padding: calc(var(--spacing) * 6); padding-block: calc(var(--spacing) * 4); h3 { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); color: var(--color-gray-900); } } .card-body { flex: 1; padding: calc(var(--spacing) * 6); .field { margin-top: calc(var(--spacing) * 0); } address { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); color: var(--color-gray-900); font-style: normal; } } .card-footer { border-top-style: var(--tw-border-style); border-top-width: 1px; border-color: var(--color-gray-200); } .btn-link { display: flex; align-items: center; justify-content: center; padding-inline: calc(var(--spacing) * 4); padding-block: calc(var(--spacing) * 3); text-align: center; font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-blue-600); &:hover { @media (hover: hover) { color: var(--color-blue-700); } } &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } &:focus { --tw-ring-color: var(--color-blue-500); } &:focus { --tw-outline-style: none; outline-style: none; } } .btn-primary { display: inline-flex; align-items: center; border-radius: var(--radius-lg); background-color: var(--color-blue-600); padding-inline: calc(var(--spacing) * 4); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-white); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); &:hover { @media (hover: hover) { background-color: var(--color-blue-700); } } &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } &:focus { --tw-ring-color: var(--color-blue-300); } &:focus { --tw-outline-style: none; outline-style: none; } } } .sidebar { order: 1; } } #account-nav-mobile { padding-inline: calc(var(--spacing) * 0) !important; } #account-nav, #account-nav-mobile { flex: none; padding-inline: calc(var(--spacing) * 4); @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 6); } @media (width >= 64rem) { padding-inline: calc(var(--spacing) * 0); } .items { display: flex; flex-direction: column; column-gap: calc(var(--spacing) * 3); row-gap: calc(var(--spacing) * 1); white-space: nowrap; .item { a, strong { display: flex; align-items: center; border-radius: var(--radius-md); padding-inline: calc(var(--spacing) * 3); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-700); &:hover { @media (hover: hover) { background-color: var(--color-gray-200); } } &:hover { @media (hover: hover) { color: var(--color-primary); } } &:before { content: ""; display: inline-block; inline-size: 1.25rem; block-size: 1.25rem; margin-inline-end: .5rem; background-color: currentColor; -webkit-mask: var(--svg-icon-mask) no-repeat center / 100% 100%; mask: var(--svg-icon-mask) no-repeat center / 100% 100%; } } &.current { border-radius: var(--radius-md); background-color: var(--color-gray-200); strong { color: var(--color-primary); } a { &:before { color: var(--color-primary); } } } a { strong { padding: calc(var(--spacing) * 0); &:before { display: none; } } } &[data-element="dashboard"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M600-160q-12.75 0-21.37-8.63Q570-177.25 570-190v-230q0-12.75 8.63-21.38Q587.25-450 600-450h250q12.75 0 21.38 8.62Q880-432.75 880-420v230q0 12.75-8.62 21.37Q862.75-160 850-160H600ZM480-510q-12.75 0-21.37-8.63Q450-527.25 450-540v-230q0-12.75 8.63-21.38Q467.25-800 480-800h370q12.75 0 21.38 8.62Q880-782.75 880-770v230q0 12.75-8.62 21.37Q862.75-510 850-510H480ZM110-160q-12.75 0-21.37-8.63Q80-177.25 80-190v-230q0-12.75 8.63-21.38Q97.25-450 110-450h370q12.75 0 21.38 8.62Q510-432.75 510-420v230q0 12.75-8.62 21.37Q492.75-160 480-160H110Zm0-350q-12.75 0-21.37-8.63Q80-527.25 80-540v-230q0-12.75 8.63-21.38Q97.25-800 110-800h250q12.75 0 21.38 8.62Q390-782.75 390-770v230q0 12.75-8.62 21.37Q372.75-510 360-510H110Zm400-60h310v-170H510v170ZM140-220h310v-170H140v170Zm490 0h190v-170H630v170ZM140-570h190v-170H140v170Zm370 0Zm-60 180Zm180 0ZM330-570Z'/%3E%3C/svg%3E"); } &[data-element="accountgegevens"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M234-276q51-39 114-61.5T480-360q69 0 132 22.5T726-276q35-41 54.5-93T800-480q0-133-93.5-226.5T480-800q-133 0-226.5 93.5T160-480q0 59 19.5 111t54.5 93Zm246-164q-59 0-99.5-40.5T340-580q0-59 40.5-99.5T480-720q59 0 99.5 40.5T620-580q0 59-40.5 99.5T480-440Zm0 360q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q53 0 100-15.5t86-44.5q-39-29-86-44.5T480-280q-53 0-100 15.5T294-220q39 29 86 44.5T480-160Zm0-360q26 0 43-17t17-43q0-26-17-43t-43-17q-26 0-43 17t-17 43q0 26 17 43t43 17Zm0-60Zm0 360Z'/%3E%3C/svg%3E"); } &[data-element="adresboek"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M560-564v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-600q-38 0-73 9.5T560-564Zm0 220v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-380q-38 0-73 9t-67 27Zm0-110v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-490q-38 0-73 9.5T560-454ZM260-320q47 0 91.5 10.5T440-278v-394q-41-24-87-36t-93-12q-36 0-71.5 7T120-692v396q35-12 69.5-18t70.5-6Zm260 42q44-21 88.5-31.5T700-320q36 0 70.5 6t69.5 18v-396q-33-14-68.5-21t-71.5-7q-47 0-93 12t-87 36v394Zm-40 118q-48-38-104-59t-116-21q-42 0-82.5 11T100-198q-21 11-40.5-1T40-234v-482q0-11 5.5-21T62-752q46-24 96-36t102-12q58 0 113.5 15T480-740q51-30 106.5-45T700-800q52 0 102 12t96 36q11 5 16.5 15t5.5 21v482q0 23-19.5 35t-40.5 1q-37-20-77.5-31T700-240q-60 0-116 21t-104 59ZM280-494Z'/%3E%3C/svg%3E"); } &[data-element="mijn-bestellingen"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-120H640q-30 38-71.5 59T480-240q-47 0-88.5-21T320-320H200v120Zm280-120q38 0 69-22t43-58h168v-360H200v360h168q12 36 43 58t69 22ZM200-200h560-560Z'/%3E%3C/svg%3E"); } &[data-element="mijn-verlanglijst"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m480-120-58-52q-101-91-167-157T150-447.5Q111-500 95.5-544T80-634q0-94 63-157t157-63q52 0 99 22t81 62q34-40 81-62t99-22q94 0 157 63t63 157q0 46-15.5 90T810-447.5Q771-395 705-329T538-172l-58 52Zm0-108q96-86 158-147.5t98-107q36-45.5 50-81t14-70.5q0-60-40-100t-100-40q-47 0-87 26.5T518-680h-76q-15-41-55-67.5T300-774q-60 0-100 40t-40 100q0 35 14 70.5t50 81q36 45.5 98 107T480-228Zm0-273Z'/%3E%3C/svg%3E"); } &[data-element="opgeslagen-betalingsmethoden"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M880-740v520q0 24-18 42t-42 18H140q-24 0-42-18t-18-42v-520q0-24 18-42t42-18h680q24 0 42 18t18 42ZM140-631h680v-109H140v109Zm0 129v282h680v-282H140Zm0 282v-520 520Z'/%3E%3C/svg%3E"); } &[data-element="productreviews"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m363-390 117-71 117 71-31-133 104-90-137-11-53-126-53 126-137 11 104 90-31 133ZM80-80v-740q0-24 18-42t42-18h680q24 0 42 18t18 42v520q0 24-18 42t-42 18H240L80-80Zm134-220h606v-520H140v600l74-80Zm-74 0v-520 520Z'/%3E%3C/svg%3E"); } &[data-element="nieuwsbrieven"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M180-120q-24 0-42-18t-18-42v-600q0-24 18-42t42-18h462l198 198v462q0 24-18 42t-42 18H180Zm0-60h600v-428.57H609V-780H180v600Zm99-111h402v-60H279v60Zm0-318h201v-60H279v60Zm0 159h402v-60H279v60Zm-99-330v171.43V-780v600-600Z'/%3E%3C/svg%3E"); } &[data-element="uitloggen"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h240q17 0 28.5 11.5T480-800q0 17-11.5 28.5T440-760H200v560h240q17 0 28.5 11.5T480-160q0 17-11.5 28.5T440-120H200Zm487-320H400q-17 0-28.5-11.5T360-480q0-17 11.5-28.5T400-520h287l-75-75q-11-11-11-27t11-28q11-12 28-12.5t29 11.5l143 143q12 12 12 28t-12 28L669-309q-12 12-28.5 11.5T612-310q-11-12-10.5-28.5T613-366l74-74Z'/%3E%3C/svg%3E"); } } } } form { .field { ul { margin-top: calc(var(--spacing) * 0); margin-bottom: calc(var(--spacing) * 0) !important; &.postcode-warning { margin-top: calc(var(--spacing) * 2); border-left-style: var(--tw-border-style); border-left-width: 4px; border-color: var(--color-yellow-400); background-color: var(--color-yellow-50); padding: calc(var(--spacing) * 4) !important; li { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); color: var(--color-yellow-700); } } } } } .order-details-items { .order-links { display: flex; :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } background-color: transparent; .nav { border-radius: var(--radius-md); padding-inline: calc(var(--spacing) * 3); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-500); &:hover { @media (hover: hover) { color: var(--color-gray-700); } } &.current { flex-grow: 0; background-color: var(--color-gray-100); color: var(--color-gray-700); } a { text-decoration-line: none; } } } } .products-grid { &.wishlist { .product-item { position: relative; } .product-item-info { padding: calc(var(--spacing) * 4); .product-image-container { aspect-ratio: unset; } .product-image-photo { height: calc(var(--spacing) * 40); object-fit: contain; mix-blend-mode: multiply; transition-property: all; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); &:hover { @media (hover: hover) { opacity: 75%; } } @media (width >= 48rem) { height: calc(var(--spacing) * 48); } } .price-box { margin-top: calc(var(--spacing) * 2); display: flex; align-items: flex-end; @media (width >= 48rem) { margin-top: calc(var(--spacing) * 4); } } .stock { &.unavailable { display: inline-flex; align-items: center; border-radius: calc(infinity * 1px); background-color: var(--color-red-100); padding-inline: calc(var(--spacing) * 2); padding-block: calc(var(--spacing) * 1); font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-red-700); } } } } } #category-view-container { margin-inline: auto; display: flex; flex-direction: column; align-items: center; padding-inline: calc(var(--spacing) * 0); } .toolbar-products { .modes-mode { height: calc(var(--spacing) * 6); width: calc(var(--spacing) * 6); span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border-width: 0; } &.mode-grid { background-image: url('data:image/svg+xml;utf8,'); } &.mode-list { background-image: url('data:image/svg+xml;utf8, '); } } } .row-type-categories { &.custom_mode { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); @media (width >= 48rem) { grid-template-columns: repeat(4, minmax(0, 1fr)); } @media (width >= 64rem) { grid-template-columns: repeat(5, minmax(0, 1fr)); } } &.subcategories_products { display: flex; .subcategory-item { display: flex; width: auto; &__image { background-color: transparent !important; padding: calc(var(--spacing) * 2); img { max-height: calc(var(--spacing) * 10); padding: calc(var(--spacing) * 0); aspect-ratio: auto; } } } } } .catalog-category-view { .page-title { padding: calc(var(--spacing) * 0); } .page-main { margin: calc(var(--spacing) * 0); } .category-short-description, .category-description { [data-content-type='row'][data-appearance='full-width'] > .row-full-width-inner, [data-content-type='row'][data-appearance='contained'] { padding: calc(var(--spacing) * 0); } } .category-short-description { display: none; @media (width >= 48rem) { display: block; } &.prose :where(p):not(:where([class~="not-prose"] *)) { margin-top: calc(var(--spacing) * 0); } p:last-of-type { margin: calc(var(--spacing) * 0); } } .category-description { margin-block: calc(var(--spacing) * 10); @media (width >= 48rem) { margin-block: calc(var(--spacing) * 16); } p { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); } } } [data-content-type="row"] { &[data-appearance="contained"] { width: 100%; @media (width >= 40rem) { max-width: 40rem; } @media (width >= 48rem) { max-width: 48rem; } @media (width >= 64rem) { max-width: 64rem; } @media (width >= 71.25rem) { max-width: 71.25rem; } @media (width >= 82.5rem) { max-width: 82.5rem; } padding-inline: calc(var(--spacing) * 4); @media (width >= 0) { max-width: var(--container-7xl); } margin-inline: auto; [data-element="inner"] { background-attachment: scroll !important; } } &[data-appearance="full-bleed"], &[data-appearance="full-width"] { background-attachment: scroll !important; } &[data-appearance="full-width"] > .row-full-width-inner { width: 100%; @media (width >= 40rem) { max-width: 40rem; } @media (width >= 48rem) { max-width: 48rem; } @media (width >= 64rem) { max-width: 64rem; } @media (width >= 71.25rem) { max-width: 71.25rem; } @media (width >= 82.5rem) { max-width: 82.5rem; } margin-inline: auto; padding-inline: calc(var(--spacing) * 4); @media (width >= 0) { max-width: var(--container-7xl); } } } body:where(:not([class*="-full-width"])) [data-content-type="row"][data-appearance="contained"] { padding-inline: calc(var(--spacing) * 0); } [data-content-type="column-group"], [data-content-type="column-line"] { flex-wrap: wrap; @media (width >= 48rem) { flex-wrap: nowrap; } } [data-content-type="column"] { width: 100%; max-width: 100%; background-attachment: scroll !important; flex-basis: 100%; @media (width >= 48rem) { flex-basis: auto; } } [data-content-type="tabs"] { .tabs-navigation { margin-bottom: -1px; display: block; padding: calc(var(--spacing) * 0); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); li.tab-header { position: relative; margin-block: calc(var(--spacing) * 0); margin-right: calc(var(--spacing) * 0); margin-left: -1px; display: inline-block; max-width: 100%; border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-style: var(--tw-border-style); border-width: 1px; border-bottom-style: var(--tw-border-style); border-bottom-width: 0px; --tw-border-style: solid; border-style: solid; border-color: var(--color-gray-300); background-color: var(--color-gray-100); overflow-wrap: break-word; &:first-child { margin-left: calc(var(--spacing) * 0); } &.active { z-index: 20; background-color: var(--color-white); border-bottom: 1px solid white; } a.tab-title { position: relative; display: block; cursor: pointer; padding-inline: calc(var(--spacing) * 5); padding-block: calc(var(--spacing) * 3); vertical-align: middle; font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); white-space: normal; span { --tw-leading: calc(var(--spacing) * 5); line-height: calc(var(--spacing) * 5); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); color: var(--color-black); } } } } .tabs-content { position: relative; z-index: 10; overflow: hidden; border-radius: var(--radius-sm); border-style: var(--tw-border-style); border-width: 1px; --tw-border-style: solid; border-style: solid; border-color: var(--color-gray-300); background-color: var(--color-container-lighter); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); [data-content-type="tab-item"] { padding: calc(var(--spacing) * 8); min-height: inherit; background-attachment: scroll !important; } } &.tab-align-left .tabs-content { border-top-left-radius: 0 !important; } &.tab-align-right .tabs-content { border-top-right-radius: 0 !important; } } [data-content-type="text"], [data-content-type="heading"], [data-content-type="html"] { overflow-wrap: break-word; } [data-content-type="buttons"] { max-width: 100%; [data-content-type="button-item"] { margin-right: calc(var(--spacing) * 2); margin-bottom: calc(var(--spacing) * 2); max-width: 100%; [data-element="link"], [data-element="empty_link"] { max-width: 100%; overflow-wrap: break-word; } [data-element="empty_link"] { cursor: default; } a, button, div { display: inline-block; --tw-shadow: 0 0 #0000; box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } } } a.pagebuilder-button-primary, button.pagebuilder-button-primary, div.pagebuilder-button-primary { --btn-bg: color-mix(in srgb, var(--color-primary) 10%, #0000); --btn-hover-bg: color-mix(in srgb, var(--color-primary) 20%, #0000); --btn-active-bg: color-mix(in srgb, var(--color-primary) 30%, #0000); --btn-color: var(--color-fg); display: inline-flex; justify-content: center; align-items: center; gap: calc(var(--spacing) * 1.5); padding-block: calc(var(--spacing) * 2); padding-inline: calc(var(--spacing) * 4); border-radius: var(--radius-lg); border-width: 2px; border-color: var(--btn-stroke); background-color: var(--btn-bg); color: var(--btn-color); font-weight: 500; user-select: none; vertical-align: middle; transition-property: color, background-color, border-color, outline-color; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); &:hover { border-color: var(--btn-hover-stroke, var(--btn-stroke)); background-color: var(--btn-hover-bg, var(--btn-bg)); color: var(--btn-hover-color, var(--btn-color)); text-decoration: none; } &:is(:active, .is-active, [aria-current="page"], [aria-current="true"]) { border-color: var(--btn-active-stroke, var(--btn-stroke)); background-color: var(--btn-active-bg, var(--btn-bg)); color: var(--btn-active-color, var(--btn-color)); } &:is(:disabled, [aria-disabled="true"]) { border-color: var(--btn-disabled-stroke, var(--color-gray-200)); background-color: var(--btn-disabled-bg, var(--color-gray-50)); color: var(--btn-disabled-color, var(--color-gray-500)); } --btn-stroke: #0000; --btn-bg: var(--color-primary); --btn-color: var(--color-on-primary); --btn-hover-stroke: #0000; --btn-hover-bg: var(--color-primary-lighter); --btn-hover-color: var(--color-on-primary); --btn-active-stroke: #0000; --btn-active-bg: var(--color-primary); --btn-active-color: var(--color-on-primary); } a.pagebuilder-button-secondary, button.pagebuilder-button-secondary, div.pagebuilder-button-secondary { --btn-stroke: #0000; --btn-bg: color-mix(in srgb, oklch(48.8% 0.243 264.376) 10%, #0000); @supports (color: color-mix(in lab, red, red)) { --btn-bg: color-mix(in srgb, var(--color-primary) 10%, #0000); } --btn-hover-bg: color-mix(in srgb, oklch(48.8% 0.243 264.376) 20%, #0000); @supports (color: color-mix(in lab, red, red)) { --btn-hover-bg: color-mix(in srgb, var(--color-primary) 20%, #0000); } --btn-active-bg: color-mix(in srgb, oklch(48.8% 0.243 264.376) 30%, #0000); @supports (color: color-mix(in lab, red, red)) { --btn-active-bg: color-mix(in srgb, var(--color-primary) 30%, #0000); } --btn-color: var(--color-fg); display: inline-flex; justify-content: center; align-items: center; gap: calc(var(--spacing) * 1.5); padding-block: calc(var(--spacing) * 2); padding-inline: calc(var(--spacing) * 4); border-radius: var(--radius-lg); border-width: 2px; border-color: var(--btn-stroke); background-color: var(--btn-bg); color: var(--btn-color); font-weight: 500; user-select: none; vertical-align: middle; transition-property: color, background-color, border-color, outline-color; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); &:hover { border-color: var(--btn-hover-stroke, var(--btn-stroke)); background-color: var(--btn-hover-bg, var(--btn-bg)); color: var(--btn-hover-color, var(--btn-color)); text-decoration: none; } &:is(:active, .is-active, [aria-current="page"], [aria-current="true"]) { border-color: var(--btn-active-stroke, var(--btn-stroke)); background-color: var(--btn-active-bg, var(--btn-bg)); color: var(--btn-active-color, var(--btn-color)); } &:is(:disabled, [aria-disabled="true"]) { border-color: var(--btn-disabled-stroke, var(--color-gray-200)); background-color: var(--btn-disabled-bg, var(--color-gray-50)); color: var(--btn-disabled-color, var(--color-gray-500)); } --btn-stroke: var(--color-primary-lighter); --btn-bg: var(--color-on-primary); --btn-color: var(--color-primary-darker); --btn-hover-stroke: var(--color-primary-lighter); --btn-hover-bg: var(--color-on-primary); --btn-hover-color: var(--color-primary-lighter); --btn-active-stroke: #0000; --btn-active-bg: var(--color-primary); --btn-active-color: var(--color-on-primary); } [data-content-type="divider"] hr { border-block-end: 0; border-inline: 0; } [data-content-type="image"] { > [data-element="link"], > [data-element="link"] img { border-radius: inherit; } .pagebuilder-mobile-hidden { display: none; @media (width >= 48rem) { display: inline-block; } } .pagebuilder-mobile-only { display: inline-block; @media (width >= 48rem) { display: none; } } figcaption { overflow-wrap: break-word; } } [data-content-type="video"] { font-size: 0; .pagebuilder-video-inner { display: inline-block; width: 100%; } .pagebuilder-video-container { position: relative; overflow: hidden; border-radius: inherit; padding-top: 56.25%; } iframe, video { position: absolute; top: calc(var(--spacing) * 0); left: calc(var(--spacing) * 0); height: 100%; width: 100%; } } [data-content-type="banner"] { > [data-element="link"], > [data-element="empty_link"] { color: inherit; text-decoration: inherit; &:hover { color: inherit; text-decoration: inherit; } } .pagebuilder-banner-wrapper { overflow-wrap: break-word; background-clip: padding-box; border-radius: inherit; background-attachment: scroll !important; .pagebuilder-overlay { position: relative; padding: calc(var(--spacing) * 8); transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); --tw-duration: 500ms; transition-duration: 500ms; --tw-ease: var(--ease-in-out); transition-timing-function: var(--ease-in-out); &.pagebuilder-poster-overlay { display: flex; align-items: center; justify-content: center; } &:not(.pagebuilder-poster-overlay) { max-width: none; @media (width >= 48rem) { max-width: var(--container-xl); } } } &.jarallax .video-overlay { z-index: 0; } [data-element="content"] { overflow: auto; min-height: 50px; } .pagebuilder-banner-button { margin: calc(var(--spacing) * 0); margin-top: calc(var(--spacing) * 5); display: inline-block; max-width: 100%; overflow-wrap: break-word; transition-property: opacity; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); --tw-duration: 500ms; transition-duration: 500ms; --tw-ease: var(--ease-in-out); transition-timing-function: var(--ease-in-out); text-align: inherit; } .pagebuilder-poster-content { width: 100%; } } &[data-appearance="collage-centered"] .pagebuilder-banner-wrapper .pagebuilder-overlay { margin-inline: auto; } &[data-appearance="collage-left"] .pagebuilder-banner-wrapper .pagebuilder-overlay { margin-right: auto; } &[data-appearance="collage-right"] .pagebuilder-banner-wrapper .pagebuilder-overlay { margin-left: auto; } } [data-content-type="slider"] { position: relative; padding-block-end: 3rem; &:not(:has(.snap-track)) { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; padding-block: 1.5rem calc(1.5rem + 3rem); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; @media (prefers-reduced-motion: no-preference) { scroll-behavior: smooth; } > * { scroll-snap-align: start; } } [data-page-builder-slider-nav] { position: absolute; inset: auto 0 0; } } [data-content-type="slide"] { position: relative; --overlay-align: initial; .pagebuilder-slide-wrapper { border-radius: inherit; min-block-size: inherit; overflow-wrap: break-word; &.jarallax { .video-overlay { -webkit-transform: unset; z-index: 1; } .pagebuilder-overlay { position: relative; z-index: 2; } [id*="jarallax-container"] > :is(div, img, video, iframe) { margin: auto !important; transform: none !important; } } } .pagebuilder-poster-content { inline-size: 100%; } [data-element="content"] { min-height: 50px; overflow: auto; } .pagebuilder-overlay { max-inline-size: 32rem; padding: 2rem; border-radius: inherit; transition: background-color 500ms ease; &.pagebuilder-poster-overlay { display: flex; align-items: center; justify-content: center; max-inline-size: 100%; min-block-size: inherit; } } &[data-appearance="collage-centered"] .pagebuilder-overlay { margin-inline: auto; } &[data-appearance="collage-left"] .pagebuilder-overlay { margin-inline: 0 auto; } &[data-appearance="collage-right"] .pagebuilder-overlay { margin-inline: auto 0; } } [data-content-type="map"] { height: calc(var(--spacing) * 72); } [data-content-type$="block"] .block p:last-child { margin-top: calc(var(--spacing) * 0); margin-bottom: calc(var(--spacing) * 4); } [data-content-type="dynamic_block"] { [data-content-type="image"] img { display: inline; } .block-banners .banner-item-content, .block-banners-inline .banner-item-content { margin-bottom: auto; } } .glider-contain { position: relative; margin-inline: auto; margin-block: calc(var(--spacing) * 0); width: 100%; } .glider { overflow-y: hidden; &.draggable { -webkit-user-select: none; user-select: none; cursor: grab; .glider-slide img { pointer-events: none; -webkit-user-select: none; user-select: none; } } &.drag { cursor: grabbing; } &::-webkit-scrollbar { height: calc(var(--spacing) * 0); opacity: 0%; } .glider-track { z-index: 10; margin: calc(var(--spacing) * 0); display: flex; width: 100%; padding: calc(var(--spacing) * 0); } } .glider-slide { margin: calc(var(--spacing) * 2); width: 100%; align-content: center; justify-content: center; -webkit-user-select: none; user-select: none; min-width: 150px; img { max-width: 100%; } } .glider-hide { opacity: 0%; } .glider-prev, .glider-next { &.disabled { cursor: default; color: var(--color-gray-500); opacity: 25%; } } .glider-dot { margin: calc(var(--spacing) * 1); display: block; height: calc(var(--spacing) * 3); width: calc(var(--spacing) * 3); cursor: pointer; border-radius: calc(infinity * 1px); background-color: var(--color-black); opacity: 25%; --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); &.active { opacity: 100%; } } @media (max-width: 36em) { .glider::-webkit-scrollbar { height: calc(var(--spacing) * 1); width: calc(var(--spacing) * 2); appearance: none; opacity: 100%; } .glider::-webkit-scrollbar-thumb { opacity: 100%; border-radius: 99px; background-color: rgba(156, 156, 156, 0.25); -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.25); box-shadow: 0 0 1px rgba(255, 255, 255, 0.25); } } [data-show-arrows="false"] .glider-prev, [data-show-arrows="false"] .glider-next { display: none; } [data-show-dots="false"] .glider-dots { display: none; } .row-type-blog { padding-block: calc(var(--spacing) * 10); @media (width >= 48rem) { padding-block: calc(var(--spacing) * 16); } .row-type-blog__inner { grid-template-columns: repeat(1, minmax(0, 1fr)); @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } @media (width >= 64rem) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } &.blog-items-1 .row-type-blog__inner { grid-template-columns: repeat(1, minmax(0, 1fr)); } &.blog-items-2 .row-type-blog__inner, &.blog-items-4 .row-type-blog__inner, &.blog-items-6 .row-type-blog__inner, &.blog-items-8 .row-type-blog__inner { grid-template-columns: repeat(1, minmax(0, 1fr)); @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } h2[data-content-type='heading'] { margin: calc(var(--spacing) * 0); font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } .blog-content { margin-top: calc(var(--spacing) * 8); picture, img { margin: calc(var(--spacing) * 0); } h3 a { color: var(--color-white) !important; text-decoration-line: none; } } [data-content-type='buttons'] { margin-top: calc(var(--spacing) * 8); [data-element='link'] { margin-inline: auto; margin-top: calc(var(--spacing) * 0); --btn-stroke: #0000; --btn-bg: color-mix(in srgb, var(--color-primary) 10%, #0000); --btn-hover-bg: color-mix(in srgb, var(--color-primary) 20%, #0000); --btn-active-bg: color-mix(in srgb, var(--color-primary) 30%, #0000); --btn-color: var(--color-fg); display: inline-flex; justify-content: center; align-items: center; gap: calc(var(--spacing) * 1.5); border-radius: var(--radius-lg); border-width: 2px; border-color: var(--btn-stroke); background-color: var(--btn-bg); color: var(--btn-color); font-weight: 500; user-select: none; vertical-align: middle; transition-property: color, background-color, border-color, outline-color; transition-timing-function: var(--default-transition-timing-function); transition-duration: var(--default-transition-duration); &:hover { border-color: var(--btn-hover-stroke, var(--btn-stroke)); background-color: var(--btn-hover-bg, var(--btn-bg)); color: var(--btn-hover-color, var(--btn-color)); text-decoration: none; } &:is(:active, .is-active, [aria-current="page"], [aria-current="true"]) { border-color: var(--btn-active-stroke, var(--btn-stroke)); background-color: var(--btn-active-bg, var(--btn-bg)); color: var(--btn-active-color, var(--btn-color)); } &:is(:disabled, [aria-disabled="true"]) { border-color: var(--btn-disabled-stroke, var(--color-gray-200)); background-color: var(--btn-disabled-bg, var(--color-gray-50)); color: var(--btn-disabled-color, var(--color-gray-500)); } display: inline-block; border-radius: calc(infinity * 1px); padding-inline: calc(var(--spacing) * 4); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); text-decoration-line: none; --btn-stroke: var(--color-cta); --btn-bg: var(--color-cta); --btn-color: var(--color-white); --btn-hover-bg: color-mix(in srgb, var(--color-cta), black 15%); --btn-hover-stroke: color-mix(in srgb, var(--color-cta), black 15%); --btn-hover-color: var(--color-white); --btn-active-stroke: #0000; --btn-active-bg: var(--color-cta); --btn-active-color: var(--color-cta); &:after { content: url("data:image/svg+xml,%3Csvg version='1.1' id='Laag_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='15px' height='10px' viewBox='0 0 10.6 7.1' style='enable-background:new 0 0 10.6 7.1;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23FFFFFF;%7D%0A%3C/style%3E%3Cpath class='st0' d='M7,7.1C6.8,7.1,6.7,7,6.5,6.9C6.4,6.8,6.3,6.6,6.3,6.4S6.3,6,6.5,5.9L8,4.3H0.7C0.3,4.3,0,4,0,3.5v0 c0-0.4,0.3-0.7,0.7-0.7H8L6.5,1.3C6.4,1.1,6.3,0.9,6.3,0.7c0-0.2,0.1-0.4,0.2-0.5c0.3-0.3,0.8-0.3,1.1,0L10.4,3 c0.3,0.3,0.3,0.8,0,1.1L7.6,6.9C7.4,7,7.3,7.1,7,7.1C7,7.1,7,7.1,7,7.1z'/%3E%3C/svg%3E"); line-height: 0; margin-left: calc(var(--spacing) * 2); } } } } [data-content-type='spits_banners'] { margin-block: calc(var(--spacing) * 4); &[data-appearance='one-two'] .banner { &--big { grid-column: span 4 / span 4; grid-row: span 2 / span 2; figure { padding: calc(var(--spacing) * 8); @media (width >= 48rem) { padding: calc(var(--spacing) * 20); } } } &--small { grid-column: span 2 / span 2; grid-row: span 1 / span 1; figure { padding: calc(var(--spacing) * 8); } .banner-content { &__title { margin-top: calc(var(--spacing) * 0); font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); } &__text { margin-top: calc(var(--spacing) * 0); } } } .btn { display: inline-flex; } } &[data-appearance='half-half'] .banner { grid-column: span 3 / span 3; figure { aspect-ratio: 16/9; } .banner-content { padding: calc(var(--spacing) * 8); @media (width >= 48rem) { padding: calc(var(--spacing) * 20); } } } &[data-appearance='one-four'] .banner { &--big { grid-column: span 12 / span 12; figure { padding: calc(var(--spacing) * 8); @media (width >= 48rem) { padding: calc(var(--spacing) * 20); } } } &--small { grid-column: span 3 / span 3; figure { padding: calc(var(--spacing) * 8); } } } } .row-type-categories { margin-block: calc(var(--spacing) * 8); display: grid; grid-auto-flow: row dense; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--spacing) * 4); @media (width >= 48rem) { grid-template-columns: repeat(5, minmax(0, 1fr)); } h2[data-content-type='heading'] { margin-block: calc(var(--spacing) * 6); } [data-content-type='column-line'] { column-gap: calc(var(--spacing) * 4); @media (width >= 64rem) { column-gap: calc(var(--spacing) * 6); } } [data-content-type='column'] { position: relative; gap: calc(var(--spacing) * 0) !important; border-radius: var(--radius-md); border-style: var(--tw-border-style); border-width: 1px; border-color: var(--color-gray-200); @media (width >= 48rem) { overflow: hidden; } &:hover { [data-content-type='image'] img { opacity: 75%; } [data-content-type='heading'] { color: var(--color-gray-800); } } [data-link-type='category']::before { content: ''; position: absolute; top: calc(var(--spacing) * 0); left: calc(var(--spacing) * 0); z-index: 10; height: 100%; width: 100%; } [data-content-type='image'] { margin: calc(var(--spacing) * 0); background-color: var(--color-light); picture { margin: calc(var(--spacing) * 0); } } img { aspect-ratio: 1/1; height: 100%; width: 100%; object-fit: contain; padding-inline: calc(var(--spacing) * 5); padding-block: calc(var(--spacing) * 10); @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 2.5); } @media (width >= 40rem) { padding-block: calc(var(--spacing) * 5); } @media (width >= 64rem) { padding-inline: calc(var(--spacing) * 5); } @media (width >= 64rem) { padding-block: calc(var(--spacing) * 10); } } [data-content-type='heading'] { margin: calc(var(--spacing) * 0); display: flex; flex: 1; align-items: center; justify-content: center; padding: calc(var(--spacing) * 3); text-align: center; font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); --tw-leading: calc(var(--spacing) * 4); line-height: calc(var(--spacing) * 4); @media (width >= 48rem) { --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); } } } } @media (max-width: 640px) { .row-type-categories { width: auto !important; [data-element='inner'] { padding-right: calc(var(--spacing) * 0) !important; [data-content-type='column-group'] { display: flex; --tw-scroll-snap-strictness: mandatory; flex-wrap: nowrap; overflow-x: scroll; padding-bottom: calc(var(--spacing) * 4); [data-content-type='column-line'] { width: auto; flex-wrap: nowrap; } [data-content-type='column'] { min-width: 40%; max-width: 40%; } } } } } h2[data-content-type='heading'] { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); } h3[data-content-type='heading'] { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-800); } .catalog-product-view { #maincontent.page-main { margin-top: calc(var(--spacing) * 0); } .page-title { margin-bottom: calc(var(--spacing) * 2); padding-inline: calc(var(--spacing) * 0); font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); --tw-leading: calc(var(--spacing) * 6); line-height: calc(var(--spacing) * 6); @media (width >= 48rem) { flex-direction: column; } @media (width >= 48rem) { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); } @media (width >= 64rem) { margin-top: calc(var(--spacing) * 0); } } } .page-product-bundle .price-final_price { .price-from, .price-to { .price-container { margin-bottom: calc(var(--spacing) * 4); display: block; color: var(--color-gray-700); .price-label { display: block; font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } .price { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); --tw-leading: var(--leading-tight); line-height: var(--leading-tight); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); color: var(--color-gray-800); } } .price-including-tax + .price-excluding-tax { margin-top: calc(var(--spacing) * 1); .price { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); } } .old-price .price-container { .price, .price-label { display: inline; font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); color: var(--color-gray-800); } } } } #product-content { .prose p { margin-top: calc(var(--spacing) * 0); } #description .row-full-width-inner, #description [data-content-type="row"], #amasty_faq_product_tab .row-full-width-inner, #amasty_faq_product_tab [data-content-type="row"] { padding: calc(var(--spacing) * 0); } } table .feature::before { content: attr(data-th) ": "; --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-900); } @screen lg { table .feature::before { display: none; } } .cart-summary { .cart-summary-actions { margin-top: calc(var(--spacing) * 0); } .cart-totals { margin-bottom: calc(var(--spacing) * 0); } .checkout { .btn { width: 100%; } } } .page-header { .logo { img { max-height: calc(var(--spacing) * 14); width: calc(var(--spacing) * 56); @media (width >= 48rem) { max-height: 100%; } } } [data-content-type='row'] { padding: 0; } } @layer utilities { .svg-icon { display: block; width: 1em; height: 1rem; } .svg-icon::after { content: ""; display: inline-block; width: 100%; height: inherit; background-color: currentColor; mask-image: var(--svg-icon-mask); mask-size: contain; mask-repeat: no-repeat; mask-position: center; } } .icon-facebook { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='currentColor'%3E%3Cpath d='M13.157 10.0485L13.6529 6.81553H10.551V4.71751C10.551 3.83302 10.9843 2.97088 12.3736 2.97088H13.784V0.218461C13.784 0.218461 12.504 0 11.2804 0C8.72557 0 7.05583 1.54835 7.05583 4.35146V6.81553H4.21601V10.0485H7.05583V17.8641C7.62525 17.9535 8.20888 18 8.80341 18C9.39794 18 9.98153 17.9535 10.551 17.8641V10.0485H13.157Z' /%3E%3C/svg%3E"); } .icon-twitter { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32' fill='currentColor'%3E%3Cpath d='M18.42,14.009L27.891,3h-2.244l-8.224,9.559L10.855,3H3.28l9.932,14.455L3.28,29h2.244l8.684-10.095,6.936,10.095h7.576l-10.301-14.991h0Zm-3.074,3.573l-1.006-1.439L6.333,4.69h3.447l6.462,9.243,1.006,1.439,8.4,12.015h-3.447l-6.854-9.804h0Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-pinterest { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32' fill='currentColor'%3E%3Cpath d='M16,2C8.268,2,2,8.268,2,16c0,5.931,3.69,11.001,8.898,13.041-.122-1.108-.233-2.811,.049-4.02,.254-1.093,1.642-6.959,1.642-6.959,0,0-.419-.839-.419-2.079,0-1.947,1.128-3.4,2.533-3.4,1.194,0,1.771,.897,1.771,1.972,0,1.201-.765,2.997-1.16,4.661-.33,1.393,.699,2.53,2.073,2.53,2.488,0,4.401-2.624,4.401-6.411,0-3.352-2.409-5.696-5.848-5.696-3.983,0-6.322,2.988-6.322,6.076,0,1.203,.464,2.494,1.042,3.195,.114,.139,.131,.26,.097,.402-.106,.442-.342,1.393-.389,1.588-.061,.256-.203,.311-.468,.187-1.749-.814-2.842-3.37-2.842-5.424,0-4.416,3.209-8.472,9.25-8.472,4.857,0,8.631,3.461,8.631,8.086,0,4.825-3.042,8.708-7.265,8.708-1.419,0-2.752-.737-3.209-1.608,0,0-.702,2.673-.872,3.328-.316,1.216-1.169,2.74-1.74,3.67,1.31,.406,2.702,.624,4.145,.624,7.732,0,14-6.268,14-14S23.732,2,16,2Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-linkedin { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 448 512' fill='currentColor'%3E%3Cpath d='M100.28 448H7.4V148.9h92.88zm-46.44-341a53.36 53.36 0 1 1 53.36-53.35A53.36 53.36 0 0 1 53.84 107zm393.78 341h-92.68V303.5c0-34.54-12.41-58.13-43.44-58.13-23.66 0-37.75 15.92-43.96 31.3-2.26 5.5-2.82 13.18-2.82 20.89V448h-92.79s1.24-266.88 0-294.88h92.79v41.78c-2.84 4.42-7 10.73-10.87 14.88h.07V194c12.33-19.04 34.42-46.18 83.58-46.18 60.91 0 106.56 39.73 106.56 125.17V448z'/%3E%3C/svg%3E"); } .icon-instagram { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='currentColor'%3E%3Cpath d='M6.79167 2.08301C4.15266 2.08301 2 4.23567 2 6.87467V13.1247C2 15.7633 4.15259 17.9163 6.79167 17.9163H13.0417C15.6804 17.9163 17.8333 15.7634 17.8333 13.1247V6.87467C17.8333 4.23559 15.6803 2.08301 13.0417 2.08301H6.79167ZM6.79167 3.33301H13.0417C15.0047 3.33301 16.5833 4.91125 16.5833 6.87467V13.1247C16.5833 15.0876 15.0046 16.6663 13.0417 16.6663H6.79167C4.82825 16.6663 3.25 15.0877 3.25 13.1247V6.87467C3.25 4.91118 4.82817 3.33301 6.79167 3.33301ZM14.0833 4.99967C13.6229 4.99967 13.25 5.37259 13.25 5.83301C13.25 6.29342 13.6229 6.66634 14.0833 6.66634C14.5437 6.66634 14.9167 6.29342 14.9167 5.83301C14.9167 5.37259 14.5437 4.99967 14.0833 4.99967ZM9.91667 5.83301C7.62299 5.83301 5.75 7.706 5.75 9.99967C5.75 12.2934 7.62299 14.1663 9.91667 14.1663C12.2103 14.1663 14.0833 12.2934 14.0833 9.99967C14.0833 7.706 12.2103 5.83301 9.91667 5.83301ZM9.91667 7.08301C11.5347 7.08301 12.8333 8.38168 12.8333 9.99967C12.8333 11.6177 11.5347 12.9163 9.91667 12.9163C8.29868 12.9163 7 11.6177 7 9.99967C7 8.38168 8.29868 7.08301 9.91667 7.08301Z'/%3E%3C/svg%3E"); } .icon-youtube { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32' fill='currentColor'%3E%3Cpath d='M31.331,8.248c-.368-1.386-1.452-2.477-2.829-2.848-2.496-.673-12.502-.673-12.502-.673,0,0-10.007,0-12.502,.673-1.377,.37-2.461,1.462-2.829,2.848-.669,2.512-.669,7.752-.669,7.752,0,0,0,5.241,.669,7.752,.368,1.386,1.452,2.477,2.829,2.847,2.496,.673,12.502,.673,12.502,.673,0,0,10.007,0,12.502-.673,1.377-.37,2.461-1.462,2.829-2.847,.669-2.512,.669-7.752,.669-7.752,0,0,0-5.24-.669-7.752ZM12.727,20.758V11.242l8.364,4.758-8.364,4.758Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-snapchat { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32' fill='currentColor'%3E%3Cpath d='M30.893,22.837c-.208-.567-.606-.871-1.058-1.122-.085-.05-.163-.09-.23-.12-.135-.07-.273-.137-.41-.208-1.41-.747-2.51-1.69-3.274-2.808-.217-.315-.405-.648-.562-.996-.065-.186-.062-.292-.015-.389,.046-.074,.108-.138,.18-.188,.242-.16,.492-.323,.661-.432,.302-.195,.541-.35,.695-.46,.579-.405,.983-.835,1.236-1.315,.357-.672,.404-1.466,.13-2.175-.383-1.009-1.336-1.635-2.49-1.635-.243,0-.486,.025-.724,.077-.064,.014-.127,.028-.189,.044,.011-.69-.005-1.418-.066-2.135-.218-2.519-1.1-3.84-2.02-4.893-.589-.66-1.283-1.218-2.053-1.653-1.396-.797-2.979-1.202-4.704-1.202s-3.301,.405-4.698,1.202c-.773,.434-1.468,.994-2.057,1.656-.92,1.053-1.802,2.376-2.02,4.893-.061,.717-.077,1.449-.067,2.135-.062-.016-.125-.031-.189-.044-.238-.051-.481-.077-.724-.077-1.155,0-2.109,.626-2.491,1.635-.276,.71-.23,1.505,.126,2.178,.254,.481,.658,.911,1.237,1.315,.153,.107,.393,.262,.695,.46,.163,.106,.402,.261,.635,.415,.082,.053,.151,.123,.204,.205,.049,.1,.051,.208-.022,.408-.155,.341-.34,.668-.553,.976-.747,1.092-1.815,2.018-3.179,2.759-.723,.383-1.474,.639-1.791,1.502-.239,.651-.083,1.391,.525,2.015h0c.223,.233,.482,.429,.766,.58,.592,.326,1.222,.578,1.876,.75,.135,.035,.263,.092,.379,.169,.222,.194,.19,.486,.485,.914,.148,.221,.336,.412,.555,.564,.619,.428,1.315,.455,2.053,.483,.666,.025,1.421,.054,2.283,.339,.357,.118,.728,.346,1.158,.613,1.032,.635,2.446,1.503,4.811,1.503s3.789-.873,4.829-1.51c.427-.262,.796-.488,1.143-.603,.862-.285,1.617-.313,2.283-.339,.737-.028,1.433-.055,2.053-.483,.259-.181,.475-.416,.632-.69,.212-.361,.207-.613,.406-.789,.109-.074,.229-.129,.356-.162,.662-.173,1.301-.428,1.901-.757,.302-.162,.575-.375,.805-.63l.008-.009c.57-.61,.714-1.329,.48-1.964Zm-2.102,1.13c-1.282,.708-2.135,.632-2.798,1.059-.563,.363-.23,1.144-.639,1.426-.503,.347-1.989-.025-3.909,.609-1.584,.524-2.594,2.029-5.442,2.029s-3.835-1.502-5.444-2.033c-1.916-.634-3.406-.262-3.909-.609-.409-.282-.077-1.064-.639-1.426-.664-.427-1.516-.351-2.798-1.055-.816-.451-.353-.73-.081-.862,4.645-2.249,5.386-5.721,5.419-5.979,.04-.312,.084-.557-.259-.875-.332-.307-1.804-1.218-2.213-1.503-.676-.472-.973-.944-.754-1.523,.153-.401,.527-.552,.92-.552,.124,0,.248,.014,.369,.041,.742,.161,1.462,.533,1.879,.633,.05,.013,.102,.02,.153,.021,.222,0,.3-.112,.285-.366-.048-.812-.162-2.394-.034-3.872,.176-2.034,.831-3.042,1.61-3.934,.374-.428,2.132-2.286,5.493-2.286s5.123,1.85,5.497,2.276c.78,.891,1.436,1.899,1.61,3.934,.128,1.479,.018,3.061-.034,3.872-.018,.268,.063,.366,.285,.366,.052,0,.103-.008,.153-.021,.417-.1,1.137-.472,1.879-.633,.121-.027,.245-.041,.369-.041,.395,0,.766,.153,.92,.552,.219,.579-.077,1.051-.753,1.523-.409,.285-1.881,1.196-2.213,1.503-.344,.317-.299,.563-.259,.875,.033,.261,.773,3.734,5.419,5.979,.274,.137,.737,.416-.079,.871Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-vimeo { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32' fill='currentColor'%3E%3Cpath d='M29.236,9.481c-.125,2.731-2.028,6.47-5.711,11.216-3.807,4.958-7.028,7.436-9.662,7.436-1.632,0-3.013-1.509-4.141-4.529-.754-2.768-1.507-5.535-2.26-8.303-.838-3.018-1.736-4.529-2.697-4.529-.209,0-.942,.442-2.197,1.321l-1.317-1.7c1.382-1.217,2.745-2.433,4.086-3.651,1.843-1.596,3.227-2.435,4.149-2.519,2.179-.21,3.521,1.283,4.024,4.477,.544,3.447,.92,5.591,1.132,6.43,.628,2.86,1.319,4.288,2.074,4.288,.586,0,1.466-.928,2.64-2.782,1.173-1.855,1.801-3.267,1.885-4.236,.167-1.601-.461-2.404-1.885-2.404-.67,0-1.361,.155-2.072,.46,1.376-4.516,4.005-6.71,7.886-6.584,2.877,.085,4.233,1.954,4.068,5.609Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-whatsapp { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32' fill='currentColor'%3E%3Cpath d=' M19.11 17.205c-.372 0-1.088 1.39-1.518 1.39a.63.63 0 0 1-.315-.1c-.802-.402-1.504-.817-2.163-1.447-.545-.516-1.146-1.29-1.46-1.963a.426.426 0 0 1-.073-.215c0-.33.99-.945.99-1.49 0-.143-.73-2.09-.832-2.335-.143-.372-.214-.487-.6-.487-.187 0-.36-.043-.53-.043-.302 0-.53.115-.746.315-.688.645-1.032 1.318-1.06 2.264v.114c-.015.99.472 1.977 1.017 2.78 1.23 1.82 2.506 3.41 4.554 4.34.616.287 2.035.888 2.722.888.817 0 2.15-.515 2.478-1.318.13-.33.244-.73.244-1.088 0-.058 0-.144-.03-.215-.1-.172-2.434-1.39-2.678-1.39zm-2.908 7.593c-1.747 0-3.48-.53-4.942-1.49L7.793 24.41l1.132-3.337a8.955 8.955 0 0 1-1.72-5.272c0-4.955 4.04-8.995 8.997-8.995S25.2 10.845 25.2 15.8c0 4.958-4.04 8.998-8.998 8.998zm0-19.798c-5.96 0-10.8 4.842-10.8 10.8 0 1.964.53 3.898 1.546 5.574L5 27.176l5.974-1.92a10.807 10.807 0 0 0 16.03-9.455c0-5.958-4.842-10.8-10.802-10.8z' fill-rule='evenodd'%3E%3C/path%3E%3C/svg%3E"); } .icon-tiktok { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 32 32' fill='currentColor'%3E%3Cpath d='M24.562,7.613c-1.508-.983-2.597-2.557-2.936-4.391-.073-.396-.114-.804-.114-1.221h-4.814l-.008,19.292c-.081,2.16-1.859,3.894-4.039,3.894-.677,0-1.315-.169-1.877-.465-1.288-.678-2.169-2.028-2.169-3.582,0-2.231,1.815-4.047,4.046-4.047,.417,0,.816,.069,1.194,.187v-4.914c-.391-.053-.788-.087-1.194-.087-4.886,0-8.86,3.975-8.86,8.86,0,2.998,1.498,5.65,3.783,7.254,1.439,1.01,3.19,1.606,5.078,1.606,4.886,0,8.86-3.975,8.86-8.86V11.357c1.888,1.355,4.201,2.154,6.697,2.154v-4.814c-1.345,0-2.597-.4-3.647-1.085Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-ideal { background-image: url("data:image/svg+xml,%3Csvg width='64' height='48' viewBox='0 0 64 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='64' height='48' rx='8' fill='%23E664A5' style='fill:%23E664A5;fill:color(display-p3 0.9020 0.3922 0.6471);fill-opacity:1;'/%3E%3Cpath d='M15 11.2248V36.7752C15 38.003 15.9952 39 17.2218 39H32.4751C44.0016 39 49 32.5377 49 23.9701C49 15.4355 44.0016 9 32.4751 9H17.2197C15.9972 9 15 9.99499 15 11.2248Z' fill='white' style='fill:white;fill-opacity:1;'/%3E%3Cpath d='M32.4715 36.9544H19.2065C18.6427 36.9555 18.1015 36.7317 17.7016 36.332C17.3016 35.9324 17.0755 35.3894 17.0728 34.8223V13.1777C17.0733 12.8964 17.1289 12.6179 17.2364 12.3582C17.3439 12.0985 17.5013 11.8626 17.6994 11.664C17.8975 11.4655 18.1326 11.3081 18.3912 11.2009C18.6498 11.0938 18.9268 11.0389 19.2065 11.0394H32.4715C45.0525 11.0394 46.9323 19.1394 46.9323 23.9681C46.9323 32.3441 41.7967 36.9544 32.4715 36.9544ZM19.2065 11.7563C18.8306 11.7558 18.4699 11.905 18.2031 12.1714C17.9364 12.4378 17.7855 12.7996 17.7833 13.1777V34.8244C17.7833 35.6092 18.4201 36.2458 19.2065 36.2458H32.4715C41.338 36.2458 46.2218 31.8868 46.2218 23.9722C46.2218 13.3425 37.6071 11.7563 32.4715 11.7563H19.2065Z' fill='black' style='fill:black;fill-opacity:1;'/%3E%3Cpath d='M25.2054 15.2727V34.1486H33.4147C40.8724 34.1486 44.1037 29.9297 44.1037 23.9804C44.1037 18.2804 40.8724 13.8513 33.4147 13.8513H26.6265C26.2509 13.8508 25.8904 14.0001 25.624 14.2665C25.3576 14.533 25.2071 14.8948 25.2054 15.2727Z' fill='%23CC0066' style='fill:%23CC0066;fill:color(display-p3 0.8000 0.0000 0.4000);fill-opacity:1;'/%3E%3Cpath d='M40.8538 21.4322V25.1072H43.049V25.9415H39.8648V21.4301L40.8538 21.4322ZM37.5571 21.4322L39.2423 25.9415H38.2144L37.8744 24.9404H36.1871L35.8349 25.9415H34.8336L36.5393 21.4301L37.5571 21.4322ZM37.6144 24.1967L37.0451 22.5425H37.0328L36.4472 24.1967H37.6144ZM34.164 21.4322V22.2644H31.7846V23.2326H33.9674V24.001H31.7846V25.1072H34.2152V25.9415H30.7955V21.4301L34.164 21.4322ZM28.0946 21.4322C28.3711 21.4301 28.6475 21.4754 28.9055 21.5702C29.1575 21.6612 29.3855 21.8086 29.5725 22.0013C29.7595 22.194 29.9004 22.427 29.9847 22.6826C30.1816 23.2946 30.1916 23.9519 30.0133 24.5696C29.9367 24.8336 29.8071 25.079 29.6325 25.2906C29.4576 25.4953 29.2393 25.658 28.9936 25.7664C28.7097 25.8885 28.4033 25.9482 28.0946 25.9415H26.1514V21.4301H28.0967L28.0946 21.4322ZM28.025 25.1072C28.1684 25.1072 28.3076 25.0846 28.4427 25.0372C28.5784 24.9895 28.7012 24.9105 28.8011 24.8065C28.9143 24.6868 29.0008 24.5442 29.055 24.3883C29.123 24.1847 29.1549 23.9706 29.1492 23.7559C29.1492 23.5499 29.1287 23.3439 29.0837 23.1399C29.0437 22.969 28.9676 22.8088 28.8605 22.6702C28.7551 22.5364 28.6167 22.4327 28.4591 22.3695C28.2631 22.2949 28.0543 22.2599 27.8448 22.2665H27.1384V25.1072H28.025Z' fill='white' style='fill:white;fill-opacity:1;'/%3E%3Cpath d='M21.495 26.9633C22.3652 26.9633 23.0697 27.6678 23.0697 28.5372V34.1487C21.3291 34.1487 19.9203 32.7375 19.9203 30.9968V28.5372C19.92 28.3294 19.9607 28.1236 20.04 27.9317C20.1193 27.7398 20.2356 27.5656 20.3822 27.4193C20.5289 27.2729 20.7029 27.1573 20.8942 27.079C21.0856 27.0007 21.2905 26.9614 21.497 26.9633H21.495Z' fill='black' style='fill:black;fill-opacity:1;'/%3E%3Cpath d='M21.4958 25.7665C22.6436 25.7665 23.5742 24.8349 23.5742 23.6858C23.5742 22.5367 22.6436 21.6052 21.4958 21.6052C20.3479 21.6052 19.4174 22.5367 19.4174 23.6858C19.4174 24.8349 20.3479 25.7665 21.4958 25.7665Z' fill='black' style='fill:black;fill-opacity:1;'/%3E%3C/svg%3E%0A"); background-size: contain; background-repeat: no-repeat; width: 32px; height: 24px; &:after { background-color: unset; } } .icon-mastercard { background-image: url("data:image/svg+xml,%3Csvg width='64' height='48' viewBox='0 0 64 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='64' height='48' rx='8' fill='black' style='fill:black;fill-opacity:1;'/%3E%3Cpath d='M26 34C31.5228 34 35.9999 29.5228 35.9999 24C35.9999 18.4772 31.5228 14 26 14C20.4771 14 16 18.4772 16 24C16 29.5228 20.4771 34 26 34Z' fill='%23E7001A' style='fill:%23E7001A;fill:color(display-p3 0.9059 0.0000 0.1020);fill-opacity:1;'/%3E%3Cpath d='M38 34C43.5228 34 47.9999 29.5228 47.9999 24C47.9999 18.4772 43.5228 14 38 14C32.4771 14 28 18.4772 28 24C28 29.5228 32.4771 34 38 34Z' fill='%23F49B1C' style='fill:%23F49B1C;fill:color(display-p3 0.9569 0.6078 0.1098);fill-opacity:1;'/%3E%3Cpath opacity='0.3' fill-rule='evenodd' clip-rule='evenodd' d='M32 15.9993C34.4289 17.8237 36 20.7283 36 24C36 27.2716 34.4289 30.1763 32 32.0007C29.5711 30.1763 28 27.2716 28 24C28 20.7283 29.5711 17.8237 32 15.9993Z' fill='%23E7001A' style='fill:%23E7001A;fill:color(display-p3 0.9059 0.0000 0.1020);fill-opacity:1;'/%3E%3C/svg%3E%0A"); background-size: contain; background-repeat: no-repeat; width: 32px; height: 24px; &:after { background-color: unset; } } .icon-visa { background-image: url("data:image/svg+xml,%3Csvg width='64' height='48' viewBox='0 0 64 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='64' height='48' rx='8' fill='%231B16E6' style='fill:%231B16E6;fill:color(display-p3 0.1059 0.0863 0.9020);fill-opacity:1;'/%3E%3Cpath d='M32.8245 21.1151C32.7971 23.3439 34.7485 24.5877 36.2189 25.3271C37.7293 26.0859 38.2368 26.5724 38.2309 27.2509C38.2195 28.2894 37.0261 28.7476 35.9091 28.7655C33.9602 28.7967 32.8273 28.2224 31.9265 27.788L31.2246 31.1787C32.1283 31.6087 33.8017 31.9836 35.5371 32C39.6104 32 42.2755 29.9245 42.2899 26.7063C42.3056 22.6223 36.8171 22.3961 36.8544 20.5706C36.8675 20.0171 37.3792 19.4265 38.5005 19.2762C39.0555 19.2003 40.5875 19.1423 42.3245 19.968L43.0061 16.6874C42.0723 16.3362 40.8715 16 39.3768 16C35.5429 16 32.8461 18.1038 32.8245 21.1151ZM49.5571 16.2827C48.8133 16.2827 48.1864 16.7305 47.9067 17.4179L42.088 31.759H46.1584L46.9685 29.4484H51.9427L52.4125 31.759H56L52.8693 16.2827H49.5571ZM50.1264 20.4635L51.3011 26.2749H48.084L50.1264 20.4635ZM27.8893 16.2827L24.6808 31.759H28.5595L31.7665 16.2827H27.8893ZM22.1512 16.2827L18.114 26.8164L16.4809 17.8598C16.2892 16.8599 15.5325 16.2827 14.6922 16.2827H8.09225L8 16.732C9.35487 17.0355 10.8942 17.525 11.8268 18.0487C12.3976 18.3686 12.5605 18.6483 12.7478 19.4086L15.841 31.759H19.9402L26.2245 16.2827H22.1512Z' fill='white' style='fill:white;fill-opacity:1;'/%3E%3C/svg%3E%0A"); background-size: contain; background-repeat: no-repeat; width: 32px; height: 24px; &:after { background-color: unset; } } .icon-bancontact { background-image: url("data:image/svg+xml,%3Csvg width='64' height='48' viewBox='0 0 64 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='1' y='1' width='62' height='46' rx='7' fill='white' style='fill:white;fill-opacity:1;'/%3E%3Crect x='1' y='1' width='62' height='46' rx='7' stroke='%23ECECF0' style='stroke:%23ECECF0;stroke:color(display-p3 0.9255 0.9255 0.9412);stroke-opacity:1;' stroke-width='2'/%3E%3Cpath d='M18 34C25.2328 34 28.3836 28.822 32 24H8V34H18Z' fill='url(%23paint0_linear_2740_2254)' style=''/%3E%3Cpath d='M46 14C38.7672 14 35.6164 19.1781 32 24H56V14H46Z' fill='url(%23paint1_linear_2740_2254)' style=''/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_2740_2254' x1='12.8544' y1='28.911' x2='30.4114' y2='22.3898' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23005AB9' style='stop-color:%23005AB9;stop-color:color(display-p3 0.0000 0.3529 0.7255);stop-opacity:1;'/%3E%3Cstop offset='1' stop-color='%231E3764' style='stop-color:%231E3764;stop-color:color(display-p3 0.1176 0.2157 0.3922);stop-opacity:1;'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_2740_2254' x1='33.453' y1='24.4802' x2='52.095' y2='18.1201' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23FBA900' style='stop-color:%23FBA900;stop-color:color(display-p3 0.9843 0.6627 0.0000);stop-opacity:1;'/%3E%3Cstop offset='1' stop-color='%23FFD800' style='stop-color:%23FFD800;stop-color:color(display-p3 1.0000 0.8471 0.0000);stop-opacity:1;'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E%0A"); background-size: contain; background-repeat: no-repeat; width: 32px; height: 24px; &:after { background-color: unset; } } .icon-vvv-cadeaukaart { background-image: url("data:image/svg+xml,%3Csvg width='64' height='48' viewBox='0 0 64 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_2740_2286)'%3E%3Crect width='64' height='48' rx='8' fill='url(%23paint0_linear_2740_2286)' style=''/%3E%3Cpath d='M94.332 0L66.2 48.666C62.8 54.534 54.332 54.534 51 48.666L31.666 15.266L40.6 0H94.332Z' fill='url(%23paint1_linear_2740_2286)' style=''/%3E%3Cpath d='M40.6 0L31.732 15.266L22.934 0H40.6Z' fill='url(%23paint2_linear_2740_2286)' style=''/%3E%3Cpath d='M22.934 0L31.734 15.266L22.934 30.534C19.868 35.866 12.068 35.866 8.99998 30.534L-8.66602 0H22.934Z' fill='url(%23paint3_linear_2740_2286)' style=''/%3E%3Cpath d='M13.468 72.2H49.6C53.666 72.2 56.2 67.8 54.2 64.266L36.066 33C34 29.466 28.932 29.466 26.932 33L8.86801 64.266C6.86801 67.8 9.40201 72.2 13.468 72.2Z' fill='url(%23paint4_linear_2740_2286)' style=''/%3E%3Cg filter='url(%23filter0_d_2740_2286)'%3E%3Cpath d='M15.5 11.6844L18.5 8H44.666L48.5 11.6844L33.5 38.5454H29.666L15.5 11.6844Z' fill='black' style='fill:black;fill-opacity:1;'/%3E%3C/g%3E%3Cpath d='M15.5 11.6844L18.5 8H44.666L48.5 11.6844L33.5 38.5454H29.666L15.5 11.6844Z' fill='%2320419A' style='fill:%2320419A;fill:color(display-p3 0.1255 0.2549 0.6039);fill-opacity:1;'/%3E%3Cpath d='M42.1294 21.9576C41.8264 22.4667 41.2698 22.783 40.668 22.7811C40.066 22.7793 39.5094 22.465 39.2074 21.953L33.9838 13.0482C33.519 12.259 33.7974 11.248 34.6056 10.7926C35.413 10.3382 36.4428 10.6108 36.9066 11.4011C36.9066 11.4011 39.162 15.2427 40.6756 17.8247C42.1994 15.2482 44.468 11.414 44.468 11.414C44.9348 10.6257 45.9674 10.3549 46.7738 10.8121C47.5783 11.2721 47.8529 12.2822 47.3853 13.0714L42.1294 21.9576ZM33.4046 36.723C33.1026 37.234 32.546 37.5466 31.9432 37.5457C31.3412 37.5447 30.7846 37.2284 30.4846 36.7183L25.259 27.8146C24.7962 27.0225 25.0736 26.0144 25.8818 25.5581C26.6892 25.1035 27.72 25.3771 28.1828 26.1665C28.1828 26.1665 30.4382 30.008 31.9516 32.5892C33.4774 30.0127 35.7434 26.1804 35.7434 26.1804C36.211 25.3901 37.2426 25.1221 38.048 25.5794C38.8536 26.0365 39.128 27.0475 38.6614 27.8359L33.4046 36.723ZM21.7618 22.0493L16.5371 13.1456C16.0724 12.3545 16.3497 11.3445 17.1571 10.8891C17.9645 10.4355 18.9952 10.7073 19.458 11.4984C19.458 11.4984 21.7136 15.3391 23.2298 17.9221C24.7526 15.3447 27.0196 11.5105 27.0196 11.5105C27.489 10.7221 28.5198 10.4522 29.3242 10.9104C30.1306 11.3695 30.4052 12.3795 29.9376 13.1679L24.6818 22.054C24.3798 22.565 23.8214 22.8794 23.2194 22.8777C22.6174 22.8767 22.0618 22.5604 21.7618 22.0493ZM45.6284 8H18.3714C16.822 8 15.3881 8.8032 14.6035 10.1119C13.8179 11.4205 13.798 13.038 14.5514 14.3653L27.8534 37.7988C28.6172 39.1437 30.0588 39.9831 31.629 39.9998C33.1992 40.0155 34.6578 39.2048 35.45 37.8757L49.4041 14.4422C50.1935 13.1169 50.1991 11.4799 49.4183 10.1499C48.6393 8.82081 47.194 8 45.6284 8Z' fill='white' style='fill:white;fill-opacity:1;'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_2740_2286' x='7.5' y='2' width='49.0001' height='46.5454' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dy='2'/%3E%3CfeGaussianBlur stdDeviation='4'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.29563 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_2740_2286'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_2740_2286' result='shape'/%3E%3C/filter%3E%3ClinearGradient id='paint0_linear_2740_2286' x1='41.4139' y1='31.4196' x2='19.4739' y2='39.8672' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0.002' stop-color='%2383D0F5' style='stop-color:%2383D0F5;stop-color:color(display-p3 0.5137 0.8157 0.9608);stop-opacity:1;'/%3E%3Cstop offset='0.467' stop-color='%230F99D6' style='stop-color:%230F99D6;stop-color:color(display-p3 0.0588 0.6000 0.8392);stop-opacity:1;'/%3E%3Cstop offset='1' stop-color='%23263680' style='stop-color:%23263680;stop-color:color(display-p3 0.1490 0.2118 0.5020);stop-opacity:1;'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_2740_2286' x1='72.586' y1='-6.262' x2='79.1553' y2='17.2522' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%230F99D6' style='stop-color:%230F99D6;stop-color:color(display-p3 0.0588 0.6000 0.8392);stop-opacity:1;'/%3E%3Cstop offset='1' stop-color='%23263680' style='stop-color:%23263680;stop-color:color(display-p3 0.1490 0.2118 0.5020);stop-opacity:1;'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint2_linear_2740_2286' x1='26.684' y1='13.9147' x2='25.2085' y2='1.5032' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23E3127E' style='stop-color:%23E3127E;stop-color:color(display-p3 0.8902 0.0706 0.4941);stop-opacity:1;'/%3E%3Cstop offset='0.005' stop-color='%23E3127E' style='stop-color:%23E3127E;stop-color:color(display-p3 0.8902 0.0706 0.4941);stop-opacity:1;'/%3E%3Cstop offset='1' stop-color='%236F237F' style='stop-color:%236F237F;stop-color:color(display-p3 0.4353 0.1373 0.4980);stop-opacity:1;'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint3_linear_2740_2286' x1='4.09314' y1='31.0694' x2='-4.94275' y2='3.65285' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23FBBF07' style='stop-color:%23FBBF07;stop-color:color(display-p3 0.9843 0.7490 0.0275);stop-opacity:1;'/%3E%3Cstop offset='0.47' stop-color='%23EF8A09' style='stop-color:%23EF8A09;stop-color:color(display-p3 0.9373 0.5412 0.0353);stop-opacity:1;'/%3E%3Cstop offset='1' stop-color='%23E74517' style='stop-color:%23E74517;stop-color:color(display-p3 0.9059 0.2706 0.0902);stop-opacity:1;'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint4_linear_2740_2286' x1='35.148' y1='33.704' x2='37.358' y2='49.9769' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%2398C12C' style='stop-color:%2398C12C;stop-color:color(display-p3 0.5961 0.7569 0.1725);stop-opacity:1;'/%3E%3Cstop offset='0.999' stop-color='%230A873C' style='stop-color:%230A873C;stop-color:color(display-p3 0.0392 0.5294 0.2353);stop-opacity:1;'/%3E%3Cstop offset='1' stop-color='%230A873C' style='stop-color:%230A873C;stop-color:color(display-p3 0.0392 0.5294 0.2353);stop-opacity:1;'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_2740_2286'%3E%3Crect width='64' height='48' rx='8' fill='white' style='fill:white;fill-opacity:1;'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); background-size: contain; background-repeat: no-repeat; width: 32px; height: 24px; &:after { background-color: unset; } } .icon-belfius { background-image: url("data:image/svg+xml,%3Csvg width='64' height='48' viewBox='0 0 64 48' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='64' height='48' rx='8' fill='%23D50043' style='fill:%23D50043;fill:color(display-p3 0.8353 0.0000 0.2627);fill-opacity:1;'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M22 17.3927C22 15.519 23.5033 14 25.3927 14H38.6073C40.481 14 42 15.5033 42 17.3927V34H25.3927C23.519 34 22 32.4967 22 30.6073V17.3927ZM26.2857 20.9758V21.3099C26.2857 22.0205 26.8528 22.5714 27.5524 22.5714H36.4476C37.1631 22.5714 37.7143 22.0066 37.7143 21.3099V20.9758C37.7143 20.2652 37.1472 19.7143 36.4476 19.7143H27.5524C26.8369 19.7143 26.2857 20.2791 26.2857 20.9758ZM26.2857 26.6901V27.0242C26.2857 27.7348 26.8528 28.2857 27.5524 28.2857H36.4476C37.1631 28.2857 37.7143 27.7209 37.7143 27.0242V26.6901C37.7143 25.9795 37.1472 25.4286 36.4476 25.4286H27.5524C26.8369 25.4286 26.2857 25.9934 26.2857 26.6901Z' fill='white' style='fill:white;fill-opacity:1;'/%3E%3C/svg%3E%0A"); background-size: contain; background-repeat: no-repeat; width: 32px; height: 24px; &:after { background-color: unset; } } .icon-phone { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-telephone-fill' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M1.885.511a1.745 1.745 0 0 1 2.61.163L6.29 2.98c.329.423.445.974.315 1.494l-.547 2.19a.68.68 0 0 0 .178.643l2.457 2.457a.68.68 0 0 0 .644.178l2.189-.547a1.75 1.75 0 0 1 1.494.315l2.306 1.794c.829.645.905 1.87.163 2.611l-1.034 1.034c-.74.74-1.846 1.065-2.877.702a18.6 18.6 0 0 1-7.01-4.42 18.6 18.6 0 0 1-4.42-7.009c-.362-1.03-.037-2.137.703-2.877z'/%3E%3C/svg%3E"); } .icon-mail { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='currentColor' class='text-white' width='24' height='24' role='img'%3E%3Cpath d='M2.003 5.884L10 9.882l7.997-3.998A2 2 0 0016 4H4a2 2 0 00-1.997 1.884z'%3E%3C/path%3E%3Cpath d='M18 8.118l-8 4-8-4V14a2 2 0 002 2h12a2 2 0 002-2V8.118z'%3E%3C/path%3E%3Ctitle%3Email%3C/title%3E%3C/svg%3E"); } .icon-questionMark { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='currentColor' class='text-white' width='24' height='24' role='img'%3E%3Cpath fill-rule='evenodd' d='M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z' clip-rule='evenodd'%3E%3C/path%3E%3Ctitle%3Equestion-mark-circle%3C/title%3E%3C/svg%3E"); } .icon-warning { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='w-5 h-5 text-yellow-400' viewBox='0 0 20 20' fill='currentColor' aria-hidden='true' data-slot='icon'%3E%3Cpath fill-rule='evenodd' d='M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495ZM10 5a.75.75 0 0 1 .75.75v3.5a.75.75 0 0 1-1.5 0v-3.5A.75.75 0 0 1 10 5Zm0 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z' clip-rule='evenodd'%3E%3C/path%3E%3C/svg%3E"); } .icon-home { --svg-icon-mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' class='h-4 w-4 flex-shrink-0' viewBox='0 0 20 20' fill='currentColor' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M9.293 2.293a1 1 0 011.414 0l7 7A1 1 0 0117 11h-1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-3a1 1 0 00-1-1H9a1 1 0 00-1 1v3a1 1 0 01-1 1H5a1 1 0 01-1-1v-6H3a1 1 0 01-.707-1.707l7-7z' clip-rule='evenodd' /%3E%3C/svg%3E"); height: 1rem; width: 1rem; } .icon-chevron-right { --svg-icon-mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' class='h-5 w-5 flex-shrink-0 text-gray-400' viewBox='0 0 20 20' fill='currentColor' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M7.21 14.77a.75.75 0 01.02-1.06L11.168 10 7.23 6.29a.75.75 0 111.04-1.08l4.5 4.25a.75.75 0 010 1.08l-4.5 4.25a.75.75 0 01-1.06-.02z' clip-rule='evenodd' /%3E%3C/svg%3E"); } .icon-plus-solid { --svg-icon-mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512' class='w-4 h-4 fill-current' width='24' height='24' role='img'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'%3E%3C/path%3E%3Ctitle%3Eplus-solid%3C/title%3E%3C/svg%3E"); } .icon-plus { --svg-icon-mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='currentColor' aria-hidden='true'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 6v12m6-6H6'%3E%3C/path%3E%3C/svg%3E"); } .icon-min { --svg-icon-mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='currentColor' aria-hidden='true'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M18 12H6'%3E%3C/path%3E%3C/svg%3E"); } .icon-add-shopping-cart { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23fff'%3E%3Cpath d='M0 0h24v24H0V0z' fill='none'/%3E%3Cpath d='M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-8.9-5h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4l-3.87 7H8.53L4.27 2H1v2h2l3.6 7.59-1.35 2.44C4.52 15.37 5.48 17 7 17h12v-2H7l1.1-2z'/%3E%3C/svg%3E"); } .icon-heart { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m480-120-58-52q-101-91-167-157T150-447.5Q111-500 95.5-544T80-634q0-94 63-157t157-63q52 0 99 22t81 62q34-40 81-62t99-22q94 0 157 63t63 157q0 46-15.5 90T810-447.5Q771-395 705-329T538-172l-58 52Zm0-108q96-86 158-147.5t98-107q36-45.5 50-81t14-70.5q0-60-40-100t-100-40q-47 0-87 26.5T518-680h-76q-15-41-55-67.5T300-774q-60 0-100 40t-40 100q0 35 14 70.5t50 81q36 45.5 98 107T480-228Zm0-273Z'/%3E%3C/svg%3E"); } .icon-compare { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M80-120v-80h360v-447q-26-9-45-28t-28-45H240l120 280q0 50-41 85t-99 35q-58 0-99-35t-41-85l120-280h-80v-80h247q12-35 43-57.5t70-22.5q39 0 70 22.5t43 57.5h247v80h-80l120 280q0 50-41 85t-99 35q-58 0-99-35t-41-85l120-280H593q-9 26-28 45t-45 28v447h360v80H80Zm585-320h150l-75-174-75 174Zm-520 0h150l-75-174-75 174Zm335-280q17 0 28.5-11.5T520-760q0-17-11.5-28.5T480-800q-17 0-28.5 11.5T440-760q0 17 11.5 28.5T480-720Z'/%3E%3C/svg%3E"); } .icon-search { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' width='24' height='24' role='img'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'%3E%3C/path%3E%3Ctitle%3Esearch%3C/title%3E%3C/svg%3E"); } .icon-logout { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h240q17 0 28.5 11.5T480-800q0 17-11.5 28.5T440-760H200v560h240q17 0 28.5 11.5T480-160q0 17-11.5 28.5T440-120H200Zm487-320H400q-17 0-28.5-11.5T360-480q0-17 11.5-28.5T400-520h287l-75-75q-11-11-11-27t11-28q11-12 28-12.5t29 11.5l143 143q12 12 12 28t-12 28L669-309q-12 12-28.5 11.5T612-310q-11-12-10.5-28.5T613-366l74-74Z'/%3E%3C/svg%3E"); } .icon-dashboard { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M600-160q-12.75 0-21.37-8.63Q570-177.25 570-190v-230q0-12.75 8.63-21.38Q587.25-450 600-450h250q12.75 0 21.38 8.62Q880-432.75 880-420v230q0 12.75-8.62 21.37Q862.75-160 850-160H600ZM480-510q-12.75 0-21.37-8.63Q450-527.25 450-540v-230q0-12.75 8.63-21.38Q467.25-800 480-800h370q12.75 0 21.38 8.62Q880-782.75 880-770v230q0 12.75-8.62 21.37Q862.75-510 850-510H480ZM110-160q-12.75 0-21.37-8.63Q80-177.25 80-190v-230q0-12.75 8.63-21.38Q97.25-450 110-450h370q12.75 0 21.38 8.62Q510-432.75 510-420v230q0 12.75-8.62 21.37Q492.75-160 480-160H110Zm0-350q-12.75 0-21.37-8.63Q80-527.25 80-540v-230q0-12.75 8.63-21.38Q97.25-800 110-800h250q12.75 0 21.38 8.62Q390-782.75 390-770v230q0 12.75-8.62 21.37Q372.75-510 360-510H110Zm400-60h310v-170H510v170ZM140-220h310v-170H140v170Zm490 0h190v-170H630v170ZM140-570h190v-170H140v170Zm370 0Zm-60 180Zm180 0ZM330-570Z'/%3E%3C/svg%3E"); } .icon-edit { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h261q20 0 30 12.5t10 27.5q0 15-10.5 27.5T460-760H200v560h560v-261q0-20 12.5-30t27.5-10q15 0 27.5 10t12.5 30v261q0 33-23.5 56.5T760-120H200Zm280-360Zm-120 80v-97q0-16 6-30.5t17-25.5l344-344q12-12 27-18t30-6q16 0 30.5 6t26.5 18l56 57q11 12 17 26.5t6 29.5q0 15-5.5 29.5T897-728L553-384q-11 11-25.5 17.5T497-360h-97q-17 0-28.5-11.5T360-400Zm481-384-56-56 56 56ZM440-440h56l232-232-28-28-29-28-231 231v57Zm260-260-29-28 29 28 28 28-28-28Z'/%3E%3C/svg%3E"); } .icon-view { --svg-icon-mask: url("data:image/svg+xml,%3Csvg class='-ms-0.5 me-1.5 eVNhx7m5tjSVbfYQzDdT kbeH5ty3CtPKxXm5TXph' aria-hidden='true' xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='currentColor' stroke-width='2' d='M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z'%3E%3C/path%3E%3Cpath stroke='currentColor' stroke-width='2' d='M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-plus { --svg-icon-mask: url("data:image/svg+xml, %3Csvg class='hidden sm:block e731n b9gop' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'%3E%3C/path%3E%3Cpath d='M12 5v14'%3E%3C/path%3E%3C/svg%3E"); } .icon-reload { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M207.5-325q-21-36.5-31.25-75.25T166-479q0-131.5 91.25-223.25T481-794h10l-65-65 53-53 155 156-155 155-53-53 65-65h-10q-100.5 0-170.25 69.75T241-479q0 25.5 5.5 49.75t17 48.25l-56 56ZM481-50 326-206l155-155 53 53-65 65h10q100.5 0 170.25-69.75T719-483q0-25.5-5.5-49.75t-17-48.25l56-56q21 36.5 31.25 75.25T794-483q0 131.5-91.25 223.25T479-168h-10l65 65-53 53Z'/%3E%3C/svg%3E"); } .icon-print { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M638-635v-118H322v118h-75v-193h466v193h-75Zm-471 75h626-626Zm548 96.5q15.5 0 26.5-11t11-26.5q0-15.5-11-26.5t-26.5-11q-15.5 0-26.5 11t-11 26.5q0 15.5 11 26.5t26.5 11ZM638-204v-160H322v160h316Zm75 75H247.25v-157H92v-235q0-48 33.25-81T206-635h548q48 0 81 33t33 81v235.2H713V-129Zm80-232v-160q0-16.58-11.25-27.79T753.88-560H206.13q-16.63 0-27.88 11.21T167-521v160h80v-78h466v78h80Z'/%3E%3C/svg%3E"); } .icon-trash { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' width='18' height='18' role='img'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16'%3E%3C/path%3E%3Ctitle%3Etrash%3C/title%3E%3C/svg%3E"); } .icon-info { --svg-icon-mask: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='currentColor' data-slot='icon' aria-hidden='true' class='size-5 text-blue-400'%3E%3Cpath d='M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-7-4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM9 9a.75.75 0 0 0 0 1.5h.253a.25.25 0 0 1 .244.304l-.459 2.066A1.75 1.75 0 0 0 10.747 15H11a.75.75 0 0 0 0-1.5h-.253a.25.25 0 0 1-.244-.304l.459-2.066A1.75 1.75 0 0 0 9.253 9H9Z' clip-rule='evenodd' fill-rule='evenodd' /%3E%3C/svg%3E"); } @layer components { .btn-secondary { color: var(--color-white); } .btn-cta { padding-inline: calc(var(--spacing) * 4); } .btn-outline { display: inline-flex; align-items: center; justify-content: center; border-radius: var(--radius-lg); border-style: var(--tw-border-style); border-width: 1px; border-color: var(--color-neutral-200); background-color: var(--color-white); padding-inline: calc(var(--spacing) * 4); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-neutral-700); &:hover { @media (hover: hover) { background-color: var(--color-neutral-100); } } &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } &:focus { --tw-ring-color: var(--color-primary); } &:focus { --tw-outline-style: none; outline-style: none; } &:disabled { pointer-events: none; } &:disabled { opacity: 50%; } } } .account { .page-title { padding: calc(var(--spacing) * 0); } .card { border-radius: var(--radius-xl); border-style: var(--tw-border-style); border-width: 1px; border-color: var(--color-gray-200); background-color: var(--color-white); padding: calc(var(--spacing) * 6); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); .card-title { border-bottom-style: var(--tw-border-style); border-bottom-width: 1px; border-color: var(--color-gray-200); padding: calc(var(--spacing) * 6); padding-block: calc(var(--spacing) * 4); h3 { font-size: var(--text-lg); line-height: var(--tw-leading, var(--text-lg--line-height)); --tw-font-weight: var(--font-weight-semibold); font-weight: var(--font-weight-semibold); color: var(--color-gray-900); } } .card-body { flex: 1; padding: calc(var(--spacing) * 6); address { font-size: var(--text-md); color: var(--color-gray-900); font-style: normal; } } .card-footer { border-top-style: var(--tw-border-style); border-top-width: 1px; border-color: var(--color-gray-200); } .btn-link { display: flex; align-items: center; justify-content: center; padding-inline: calc(var(--spacing) * 4); padding-block: calc(var(--spacing) * 3); text-align: center; font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-blue-600); &:hover { @media (hover: hover) { color: var(--color-blue-700); } } &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } &:focus { --tw-ring-color: var(--color-blue-500); } &:focus { --tw-outline-style: none; outline-style: none; } } .btn-primary { display: inline-flex; align-items: center; border-radius: var(--radius-lg); background-color: var(--color-blue-600); padding-inline: calc(var(--spacing) * 4); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-white); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); &:hover { @media (hover: hover) { background-color: var(--color-blue-700); } } &:focus { --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); } &:focus { --tw-ring-color: var(--color-blue-300); } &:focus { --tw-outline-style: none; outline-style: none; } } } .sidebar { order: 1; } } #account-nav-mobile { padding-inline: calc(var(--spacing) * 0) !important; } #account-nav, #account-nav-mobile { flex: none; padding-inline: calc(var(--spacing) * 4); @media (width >= 40rem) { padding-inline: calc(var(--spacing) * 6); } @media (width >= 64rem) { padding-inline: calc(var(--spacing) * 0); } .items { display: flex; flex-direction: column; column-gap: calc(var(--spacing) * 3); row-gap: calc(var(--spacing) * 1); white-space: nowrap; .item { a, strong { display: flex; align-items: center; border-radius: var(--radius-md); padding-inline: calc(var(--spacing) * 3); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: calc(var(--spacing) * 6); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-700); &:hover { @media (hover: hover) { background-color: var(--color-gray-200); } } &:hover { @media (hover: hover) { color: var(--color-primary); } } &:before { content: ""; display: inline-block; inline-size: 1.25rem; block-size: 1.25rem; margin-inline-end: .5rem; background-color: currentColor; -webkit-mask: var(--svg-icon-mask) no-repeat center / 100% 100%; mask: var(--svg-icon-mask) no-repeat center / 100% 100%; } } &.current { border-radius: var(--radius-md); background-color: var(--color-gray-200); strong { color: var(--color-primary); } a { &:before { color: var(--color-primary); } } } a { strong { padding: calc(var(--spacing) * 0); &:before { display: none; } } } &[data-element="dashboard"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M600-160q-12.75 0-21.37-8.63Q570-177.25 570-190v-230q0-12.75 8.63-21.38Q587.25-450 600-450h250q12.75 0 21.38 8.62Q880-432.75 880-420v230q0 12.75-8.62 21.37Q862.75-160 850-160H600ZM480-510q-12.75 0-21.37-8.63Q450-527.25 450-540v-230q0-12.75 8.63-21.38Q467.25-800 480-800h370q12.75 0 21.38 8.62Q880-782.75 880-770v230q0 12.75-8.62 21.37Q862.75-510 850-510H480ZM110-160q-12.75 0-21.37-8.63Q80-177.25 80-190v-230q0-12.75 8.63-21.38Q97.25-450 110-450h370q12.75 0 21.38 8.62Q510-432.75 510-420v230q0 12.75-8.62 21.37Q492.75-160 480-160H110Zm0-350q-12.75 0-21.37-8.63Q80-527.25 80-540v-230q0-12.75 8.63-21.38Q97.25-800 110-800h250q12.75 0 21.38 8.62Q390-782.75 390-770v230q0 12.75-8.62 21.37Q372.75-510 360-510H110Zm400-60h310v-170H510v170ZM140-220h310v-170H140v170Zm490 0h190v-170H630v170ZM140-570h190v-170H140v170Zm370 0Zm-60 180Zm180 0ZM330-570Z'/%3E%3C/svg%3E"); } &[data-element="accountgegevens"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M234-276q51-39 114-61.5T480-360q69 0 132 22.5T726-276q35-41 54.5-93T800-480q0-133-93.5-226.5T480-800q-133 0-226.5 93.5T160-480q0 59 19.5 111t54.5 93Zm246-164q-59 0-99.5-40.5T340-580q0-59 40.5-99.5T480-720q59 0 99.5 40.5T620-580q0 59-40.5 99.5T480-440Zm0 360q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-80q53 0 100-15.5t86-44.5q-39-29-86-44.5T480-280q-53 0-100 15.5T294-220q39 29 86 44.5T480-160Zm0-360q26 0 43-17t17-43q0-26-17-43t-43-17q-26 0-43 17t-17 43q0 26 17 43t43 17Zm0-60Zm0 360Z'/%3E%3C/svg%3E"); } &[data-element="adresboek"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M560-564v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-600q-38 0-73 9.5T560-564Zm0 220v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-380q-38 0-73 9t-67 27Zm0-110v-68q33-14 67.5-21t72.5-7q26 0 51 4t49 10v64q-24-9-48.5-13.5T700-490q-38 0-73 9.5T560-454ZM260-320q47 0 91.5 10.5T440-278v-394q-41-24-87-36t-93-12q-36 0-71.5 7T120-692v396q35-12 69.5-18t70.5-6Zm260 42q44-21 88.5-31.5T700-320q36 0 70.5 6t69.5 18v-396q-33-14-68.5-21t-71.5-7q-47 0-93 12t-87 36v394Zm-40 118q-48-38-104-59t-116-21q-42 0-82.5 11T100-198q-21 11-40.5-1T40-234v-482q0-11 5.5-21T62-752q46-24 96-36t102-12q58 0 113.5 15T480-740q51-30 106.5-45T700-800q52 0 102 12t96 36q11 5 16.5 15t5.5 21v482q0 23-19.5 35t-40.5 1q-37-20-77.5-31T700-240q-60 0-116 21t-104 59ZM280-494Z'/%3E%3C/svg%3E"); } &[data-element="mijn-bestellingen"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h560q33 0 56.5 23.5T840-760v560q0 33-23.5 56.5T760-120H200Zm0-80h560v-120H640q-30 38-71.5 59T480-240q-47 0-88.5-21T320-320H200v120Zm280-120q38 0 69-22t43-58h168v-360H200v360h168q12 36 43 58t69 22ZM200-200h560-560Z'/%3E%3C/svg%3E"); } &[data-element="mijn-verlanglijst"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m480-120-58-52q-101-91-167-157T150-447.5Q111-500 95.5-544T80-634q0-94 63-157t157-63q52 0 99 22t81 62q34-40 81-62t99-22q94 0 157 63t63 157q0 46-15.5 90T810-447.5Q771-395 705-329T538-172l-58 52Zm0-108q96-86 158-147.5t98-107q36-45.5 50-81t14-70.5q0-60-40-100t-100-40q-47 0-87 26.5T518-680h-76q-15-41-55-67.5T300-774q-60 0-100 40t-40 100q0 35 14 70.5t50 81q36 45.5 98 107T480-228Zm0-273Z'/%3E%3C/svg%3E"); } &[data-element="opgeslagen-betalingsmethoden"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M880-740v520q0 24-18 42t-42 18H140q-24 0-42-18t-18-42v-520q0-24 18-42t42-18h680q24 0 42 18t18 42ZM140-631h680v-109H140v109Zm0 129v282h680v-282H140Zm0 282v-520 520Z'/%3E%3C/svg%3E"); } &[data-element="productreviews"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m363-390 117-71 117 71-31-133 104-90-137-11-53-126-53 126-137 11 104 90-31 133ZM80-80v-740q0-24 18-42t42-18h680q24 0 42 18t18 42v520q0 24-18 42t-42 18H240L80-80Zm134-220h606v-520H140v600l74-80Zm-74 0v-520 520Z'/%3E%3C/svg%3E"); } &[data-element="nieuwsbrieven"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M180-120q-24 0-42-18t-18-42v-600q0-24 18-42t42-18h462l198 198v462q0 24-18 42t-42 18H180Zm0-60h600v-428.57H609V-780H180v600Zm99-111h402v-60H279v60Zm0-318h201v-60H279v60Zm0 159h402v-60H279v60Zm-99-330v171.43V-780v600-600Z'/%3E%3C/svg%3E"); } &[data-element="uitloggen"] { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h240q17 0 28.5 11.5T480-800q0 17-11.5 28.5T440-760H200v560h240q17 0 28.5 11.5T480-160q0 17-11.5 28.5T440-120H200Zm487-320H400q-17 0-28.5-11.5T360-480q0-17 11.5-28.5T400-520h287l-75-75q-11-11-11-27t11-28q11-12 28-12.5t29 11.5l143 143q12 12 12 28t-12 28L669-309q-12 12-28.5 11.5T612-310q-11-12-10.5-28.5T613-366l74-74Z'/%3E%3C/svg%3E"); } } } } form { .field { ul { margin-top: calc(var(--spacing) * 0); margin-bottom: calc(var(--spacing) * 0) !important; &.postcode-warning { margin-top: calc(var(--spacing) * 2); border-left-style: var(--tw-border-style); border-left-width: 4px; border-color: var(--color-yellow-400); background-color: var(--color-yellow-50); padding: calc(var(--spacing) * 4) !important; li { font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); color: var(--color-yellow-700); } } } } } .order-details-items { .order-links { display: flex; :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 4) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))); } background-color: transparent; .nav { border-radius: var(--radius-md); padding-inline: calc(var(--spacing) * 3); padding-block: calc(var(--spacing) * 2); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-gray-500); &:hover { @media (hover: hover) { color: var(--color-gray-700); } } &.current { flex-grow: 0; background-color: var(--color-gray-100); color: var(--color-gray-700); } a { text-decoration-line: none; } } } } .products-grid { &.wishlist { .product-item { position: relative; } .product-item-info { padding: calc(var(--spacing) * 4); .product-image-container { aspect-ratio: unset; } .product-image-photo { height: calc(var(--spacing) * 40); object-fit: contain; mix-blend-mode: multiply; transition-property: all; transition-timing-function: var(--tw-ease, var(--default-transition-timing-function)); transition-duration: var(--tw-duration, var(--default-transition-duration)); &:hover { @media (hover: hover) { opacity: 75%; } } @media (width >= 48rem) { height: calc(var(--spacing) * 48); } } .price-box { margin-top: calc(var(--spacing) * 2); display: flex; align-items: flex-end; @media (width >= 48rem) { margin-top: calc(var(--spacing) * 4); } } .stock { &.unavailable { display: inline-flex; align-items: center; border-radius: calc(infinity * 1px); background-color: var(--color-red-100); padding-inline: calc(var(--spacing) * 2); padding-block: calc(var(--spacing) * 1); font-size: var(--text-xs); line-height: var(--tw-leading, var(--text-xs--line-height)); --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); color: var(--color-red-700); } } } } } .field.required > label { &::after { content: var(--tw-content); display: none; } } .page-header { .header-top { .vat-switcher { margin-left: calc(var(--spacing) * 4); display: none; border-left-style: var(--tw-border-style); border-left-width: 1px; padding-left: calc(var(--spacing) * 4); @media (width >= 64rem) { display: flex; } } } .header-main { #menu-cart-icon { span { &.text-cta { background-color: var(--color-cta); color: var(--color-white); } } } } .logo { img { width: auto; } } .snowdog-topmenu-mobile { .vat-switcher { display: flex; } .store-switcher { display: flex; align-items: center; } .snowdog-menu-link-topmenu-mobile { padding-inline: calc(var(--spacing) * 4); } } } [aria-labelledby="customer-menu"] { z-index: 50; } [data-content-type="spits_banners"] { margin-block: calc(var(--spacing) * 4); figure { justify-content: flex-end; --tw-gradient-position: to top in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); --tw-gradient-from: var(--color-gray-800); --tw-gradient-via: color-mix(in oklab, var(--color-gray-800) 20%, transparent); --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-via-stops); --tw-gradient-to: color-mix(in oklab, var(--color-gray-800) 0%, transparent); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .banner-content { width: auto; &::after { content: var(--tw-content); position: absolute; } &::after { content: var(--tw-content); inset: calc(var(--spacing) * 0); } &::after { content: var(--tw-content); z-index: calc(10 * -1); } &::after { content: var(--tw-content); --tw-gradient-position: to top in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); } &::after { content: var(--tw-content); --tw-gradient-from: var(--color-gray-800); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } &::after { content: var(--tw-content); --tw-gradient-via: color-mix(in srgb, oklch(27.8% 0.033 256.848) 20%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-via: color-mix(in oklab, var(--color-gray-800) 20%, transparent); } --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-via-stops); } &::after { content: var(--tw-content); --tw-gradient-to: color-mix(in srgb, oklch(27.8% 0.033 256.848) 0%, transparent); @supports (color: color-mix(in lab, red, red)) { --tw-gradient-to: color-mix(in oklab, var(--color-gray-800) 0%, transparent); } --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } position: unset; .banner-content__title { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } .banner-content__text { color: var(--color-white); } .banner-content__btn { border-color: var(--color-primary); &[class*="bg-opacity-"] { background-color: oklch(48.8% 0.243 264.376); @supports (color: color-mix(in lab, red, red)) { background-color: color-mix( in srgb, var(--color-primary) calc(100% / var(--tw-bg-opacity)), #0000 ); } } background-color: var(--color-primary); color: var(--color-white); } } .banner--big { aspect-ratio: 16/9; .banner__img { --tw-gradient-position: to top in oklab; background-image: linear-gradient(var(--tw-gradient-stops)); --tw-gradient-from: var(--color-gray-800); --tw-gradient-via: color-mix(in oklab, var(--color-gray-800) 20%, transparent); --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position); --tw-gradient-stops: var(--tw-gradient-via-stops); --tw-gradient-to: color-mix(in oklab, var(--color-gray-800) 0%, transparent); --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position)); } .banner-content__title { font-size: var(--text-2xl); line-height: var(--tw-leading, var(--text-2xl--line-height)); --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); @media (width >= 48rem) { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); } } .banner-content__text { margin-top: calc(var(--spacing) * 0); } } &[data-appearance='one-two'] { .banner--big { grid-column: span 4 / span 4; grid-row: span 2 / span 2; figure { padding: calc(var(--spacing) * 8); @media (width >= 48rem) { padding: calc(var(--spacing) * 20); } } } .banner--small { grid-column: span 2 / span 2; grid-row: span 1 / span 1; figure { padding: calc(var(--spacing) * 8); } .banner-content__title { margin-top: calc(var(--spacing) * 0); font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); } .banner-content__text { margin-top: calc(var(--spacing) * 0); } } .btn { display: inline-flex; } } &[data-appearance='half-half'] { .banner { grid-column: span 3 / span 3; figure { aspect-ratio: 16/9; } .banner-content { padding: calc(var(--spacing) * 8); @media (width >= 48rem) { padding: calc(var(--spacing) * 20); } } } } &[data-appearance='one-four'] { .banner--big { grid-column: span 12 / span 12; figure { padding: calc(var(--spacing) * 8); @media (width >= 48rem) { padding: calc(var(--spacing) * 20); } } } .banner--small { grid-column: span 3 / span 3; figure { padding: calc(var(--spacing) * 8); } } } } [data-content-type='spits_blog'] { .row-type-blog { padding: calc(var(--spacing) * 0); } } .product-info-main { .product.alert.stock { margin-top: calc(var(--spacing) * 4); .alert { display: flex; align-items: center; border-left-style: var(--tw-border-style); border-left-width: 4px; border-color: var(--color-yellow-400); background-color: var(--color-yellow-50); padding: calc(var(--spacing) * 4); text-align: left; &:hover { @media (hover: hover) { background-color: var(--color-yellow-100); } } .underline { margin-left: calc(var(--spacing) * 3); font-size: var(--text-sm); line-height: var(--tw-leading, var(--text-sm--line-height)); color: var(--color-yellow-700); text-decoration-line: none; } svg { flex-shrink: 0; color: var(--color-yellow-400); } } } .qty-increment { margin-right: calc(var(--spacing) * 0); } } #stickyAddToCart { #add-to-wishlist { width: calc(var(--spacing) * 12); } } .price-box { .price-including-tax + .price-excluding-tax { &:before { display: none; } } .price-excluding-tax, .price-including-tax { --tw-leading: 1; line-height: 1; .price { font-size: var(--text-base); line-height: var(--tw-leading, var(--text-base--line-height)); --tw-font-weight: var(--font-weight-normal); font-weight: var(--font-weight-normal); } } } .product-item { .price-box { line-height: unset; } } .product-info-main { .price-box { .price-excluding-tax, .price-including-tax { --tw-leading: 1; line-height: 1; .price { font-size: var(--text-3xl); line-height: var(--tw-leading, var(--text-3xl--line-height)); --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); color: var(--color-black); } } } } @layer utilities { .svg-icon { width: 1em; height: 1em; } } .icon-add-shopping-cart { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%23fff'%3E%3Cpath d='M0 0h24v24H0V0z' fill='none'/%3E%3Cpath d='M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-8.9-5h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4l-3.87 7H8.53L4.27 2H1v2h2l3.6 7.59-1.35 2.44C4.52 15.37 5.48 17 7 17h12v-2H7l1.1-2z'/%3E%3C/svg%3E"); } .icon-heart { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m480-120-58-52q-101-91-167-157T150-447.5Q111-500 95.5-544T80-634q0-94 63-157t157-63q52 0 99 22t81 62q34-40 81-62t99-22q94 0 157 63t63 157q0 46-15.5 90T810-447.5Q771-395 705-329T538-172l-58 52Zm0-108q96-86 158-147.5t98-107q36-45.5 50-81t14-70.5q0-60-40-100t-100-40q-47 0-87 26.5T518-680h-76q-15-41-55-67.5T300-774q-60 0-100 40t-40 100q0 35 14 70.5t50 81q36 45.5 98 107T480-228Zm0-273Z'/%3E%3C/svg%3E"); } .icon-compare { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M80-120v-80h360v-447q-26-9-45-28t-28-45H240l120 280q0 50-41 85t-99 35q-58 0-99-35t-41-85l120-280h-80v-80h247q12-35 43-57.5t70-22.5q39 0 70 22.5t43 57.5h247v80h-80l120 280q0 50-41 85t-99 35q-58 0-99-35t-41-85l120-280H593q-9 26-28 45t-45 28v447h360v80H80Zm585-320h150l-75-174-75 174Zm-520 0h150l-75-174-75 174Zm335-280q17 0 28.5-11.5T520-760q0-17-11.5-28.5T480-800q-17 0-28.5 11.5T440-760q0 17 11.5 28.5T480-720Z'/%3E%3C/svg%3E"); } .icon-search { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' width='24' height='24' role='img'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'%3E%3C/path%3E%3Ctitle%3Esearch%3C/title%3E%3C/svg%3E"); } .icon-logout { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h240q17 0 28.5 11.5T480-800q0 17-11.5 28.5T440-760H200v560h240q17 0 28.5 11.5T480-160q0 17-11.5 28.5T440-120H200Zm487-320H400q-17 0-28.5-11.5T360-480q0-17 11.5-28.5T400-520h287l-75-75q-11-11-11-27t11-28q11-12 28-12.5t29 11.5l143 143q12 12 12 28t-12 28L669-309q-12 12-28.5 11.5T612-310q-11-12-10.5-28.5T613-366l74-74Z'/%3E%3C/svg%3E"); } .icon-dashboard { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M600-160q-12.75 0-21.37-8.63Q570-177.25 570-190v-230q0-12.75 8.63-21.38Q587.25-450 600-450h250q12.75 0 21.38 8.62Q880-432.75 880-420v230q0 12.75-8.62 21.37Q862.75-160 850-160H600ZM480-510q-12.75 0-21.37-8.63Q450-527.25 450-540v-230q0-12.75 8.63-21.38Q467.25-800 480-800h370q12.75 0 21.38 8.62Q880-782.75 880-770v230q0 12.75-8.62 21.37Q862.75-510 850-510H480ZM110-160q-12.75 0-21.37-8.63Q80-177.25 80-190v-230q0-12.75 8.63-21.38Q97.25-450 110-450h370q12.75 0 21.38 8.62Q510-432.75 510-420v230q0 12.75-8.62 21.37Q492.75-160 480-160H110Zm0-350q-12.75 0-21.37-8.63Q80-527.25 80-540v-230q0-12.75 8.63-21.38Q97.25-800 110-800h250q12.75 0 21.38 8.62Q390-782.75 390-770v230q0 12.75-8.62 21.37Q372.75-510 360-510H110Zm400-60h310v-170H510v170ZM140-220h310v-170H140v170Zm490 0h190v-170H630v170ZM140-570h190v-170H140v170Zm370 0Zm-60 180Zm180 0ZM330-570Z'/%3E%3C/svg%3E"); } .icon-edit { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M200-120q-33 0-56.5-23.5T120-200v-560q0-33 23.5-56.5T200-840h261q20 0 30 12.5t10 27.5q0 15-10.5 27.5T460-760H200v560h560v-261q0-20 12.5-30t27.5-10q15 0 27.5 10t12.5 30v261q0 33-23.5 56.5T760-120H200Zm280-360Zm-120 80v-97q0-16 6-30.5t17-25.5l344-344q12-12 27-18t30-6q16 0 30.5 6t26.5 18l56 57q11 12 17 26.5t6 29.5q0 15-5.5 29.5T897-728L553-384q-11 11-25.5 17.5T497-360h-97q-17 0-28.5-11.5T360-400Zm481-384-56-56 56 56ZM440-440h56l232-232-28-28-29-28-231 231v57Zm260-260-29-28 29 28 28 28-28-28Z'/%3E%3C/svg%3E"); } .icon-view { --svg-icon-mask: url("data:image/svg+xml,%3Csvg class='-ms-0.5 me-1.5 eVNhx7m5tjSVbfYQzDdT kbeH5ty3CtPKxXm5TXph' aria-hidden='true' xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' viewBox='0 0 24 24'%3E%3Cpath stroke='currentColor' stroke-width='2' d='M21 12c0 1.2-4.03 6-9 6s-9-4.8-9-6c0-1.2 4.03-6 9-6s9 4.8 9 6Z'%3E%3C/path%3E%3Cpath stroke='currentColor' stroke-width='2' d='M15 12a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z'%3E%3C/path%3E%3C/svg%3E"); } .icon-plus { --svg-icon-mask: url("data:image/svg+xml, %3Csvg class='hidden sm:block e731n b9gop' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'%3E%3C/path%3E%3Cpath d='M12 5v14'%3E%3C/path%3E%3C/svg%3E"); } .icon-reload { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M207.5-325q-21-36.5-31.25-75.25T166-479q0-131.5 91.25-223.25T481-794h10l-65-65 53-53 155 156-155 155-53-53 65-65h-10q-100.5 0-170.25 69.75T241-479q0 25.5 5.5 49.75t17 48.25l-56 56ZM481-50 326-206l155-155 53 53-65 65h10q100.5 0 170.25-69.75T719-483q0-25.5-5.5-49.75t-17-48.25l56-56q21 36.5 31.25 75.25T794-483q0 131.5-91.25 223.25T479-168h-10l65 65-53 53Z'/%3E%3C/svg%3E"); } .icon-print { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M638-635v-118H322v118h-75v-193h466v193h-75Zm-471 75h626-626Zm548 96.5q15.5 0 26.5-11t11-26.5q0-15.5-11-26.5t-26.5-11q-15.5 0-26.5 11t-11 26.5q0 15.5 11 26.5t26.5 11ZM638-204v-160H322v160h316Zm75 75H247.25v-157H92v-235q0-48 33.25-81T206-635h548q48 0 81 33t33 81v235.2H713V-129Zm80-232v-160q0-16.58-11.25-27.79T753.88-560H206.13q-16.63 0-27.88 11.21T167-521v160h80v-78h466v78h80Z'/%3E%3C/svg%3E"); } .icon-trash { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='2' stroke='currentColor' width='18' height='18' role='img'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16'%3E%3C/path%3E%3Ctitle%3Etrash%3C/title%3E%3C/svg%3E"); } @layer components { .am-crosslink, .prose .am-crosslink { color: var(--color-blue-600); text-decoration-line: none; &:hover { @media (hover: hover) { text-decoration-line: underline; } } } } .mollie-buttons { margin-top: 10%; text-align: center; opacity: 0; animation: fadeIn 1s; animation-delay: 1s; animation-fill-mode: forwards; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .mollie-buttons .button { display: inline-block; margin: 20px; max-width: 100%; padding: 0 16px; border: 0; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .19); border-radius: 6px; background-color: #0095FF; color: #FFF; font-size: 1.8rem; font-weight: 700; line-height: 4.4rem; text-align: center; text-decoration: none; outline: none; overflow: hidden; text-overflow: ellipsis; transition: background .15s; white-space: nowrap; user-select: none; } .mollie-buttons { opacity: 0; transition: opacity 2s ease-in; } .mollie-buttons .button:hover { background-color: #0077CB; } .mollie-loading .redirect-block { padding: 10%; text-align: center; } .checkout-payment-method #mollie_methods_ideal-form .label { height: 35px; display: inline-block; } .checkout-payment-method #mollie_methods_ideal-form .payment-icon { width: 35px; max-height: 30px; } .checkout-payment-method #mollie_methods_kbc-form .label { height: 35px; display: inline-block; } .checkout-payment-method #mollie_methods_kbc-form .payment-icon { width: 35px; max-height: 30px; } .checkout-payment-method #mollie_methods_giftcard-form .label { height: 40px; display: inline-block; } .checkout-payment-method #mollie_methods_giftcard-form .payment-icon { width: 35px; max-height: 30px; } .mollie-payment-icon { width: 25px; margin-right: 5px; vertical-align: middle; } .mollie-loading .loader { border: 16px solid #E3F0FA; border-top: 16px solid #31A8F0; border-radius: 50%; width: 50px; height: 50px; animation: spin 2s linear infinite; margin-left: auto; margin-right: auto; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .payment-method-content .card-container { max-width: 400px; overflow: auto; background-color: #FFF; border-radius: 10px; border: 1px solid rgba(0, 0, 0, 0.1); display: block; padding: 20px; margin-bottom: 10px; } .apple-pay-button { -webkit-appearance: -apple-pay-button; } @supports (-webkit-appearance: -apple-pay-button) { .apple-pay-button-with-text { -webkit-appearance: -apple-pay-button; -apple-pay-button-type: buy; } .apple-pay-button-with-text > * { visibility: hidden; } .apple-pay-button-black-with-text { -apple-pay-button-style: black; } .apple-pay-button-white-with-text { -apple-pay-button-style: white; cursor: pointer; } .apple-pay-button-white-with-line-with-text { -apple-pay-button-style: white-outline; } .apple-pay-button-color-black { -apple-pay-button-style: black; } .apple-pay-button-color-white { -apple-pay-button-style: white; } .apple-pay-button-color-white-outline { -apple-pay-button-style: white-outline; } .apple-pay-button-text-buy { -apple-pay-button-type: buy; } .apple-pay-button-text-donate { -apple-pay-button-type: donate; } .apple-pay-button-text-plain { -apple-pay-button-type: plain; } .apple-pay-button-text-book { -apple-pay-button-type: book; } .apple-pay-button-text-check-out { -apple-pay-button-type: check-out; } .apple-pay-button-text-subscribe { -apple-pay-button-type: subscribe; } .apple-pay-button-text-add-money { -apple-pay-button-type: add-money; } .apple-pay-button-text-contribute { -apple-pay-button-type: contribute; } .apple-pay-button-text-order { -apple-pay-button-type: order; } .apple-pay-button-text-reload { -apple-pay-button-type: reload; } .apple-pay-button-text-rent { -apple-pay-button-type: rent; } .apple-pay-button-text-support { -apple-pay-button-type: support; } .apple-pay-button-text-tip { -apple-pay-button-type: tip; } .apple-pay-button-text-top-up { -apple-pay-button-type: top-up; } } .mollie-applepay-button-hidden { display: none; } .mollie-applepay-minicart-button { height: 40px; } [wire\:loading], [wire\:loading\.delay], [wire\:loading\.inline-block], [wire\:loading\.inline], [wire\:loading\.block], [wire\:loading\.flex], [wire\:loading\.table], [wire\:loading\.grid], [wire\:loading\.inline-flex] { display: none; } [wire\:loading\.delay\.shortest], [wire\:loading\.delay\.shorter], [wire\:loading\.delay\.short], [wire\:loading\.delay\.long], [wire\:loading\.delay\.longer], [wire\:loading\.delay\.longest] { display: none; } [wire\:offline] { display: none; } [wire\:dirty]:not(textarea):not(input):not(select) { display: none; } input:-webkit-autofill, select:-webkit-autofill, textarea:-webkit-autofill { animation-duration: 50000s; animation-name: livewireautofill; } #livewire-error iframe { background-color: rgb(255 255 255) !important; border-radius: 0.375rem !important; padding: 0.75rem 1rem !important; } .atc-modal { section { margin-block: calc(var(--spacing) * 0); } .product-slider { padding: calc(var(--spacing) * 6); h3 { margin-bottom: calc(var(--spacing) * 3); font-size: var(--text-xl); line-height: var(--tw-leading, var(--text-xl--line-height)); } .js_slide { margin-right: calc(var(--spacing) * 0); @media (width >= 64rem) { width: calc(1 / 2 * 100%); } @media (width >= 82.5rem) { width: calc(1 / 3 * 100%); } } .product-image-photo { height: calc(var(--spacing) * 40); } } } .icon-check { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='currentColor' class='fill-current' width='25' height='25' role='img'%3E%3Cpath fill-rule='evenodd' d='M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z' clip-rule='evenodd'%3E%3C/path%3E%3Ctitle%3Echeck-circle%3C/title%3E%3C/svg%3E"); } .icon-grid { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='w-4 h-4' fill='currentColor' viewBox='0 0 20 20' aria-hidden='true'%3E%3Cpath d='M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z'%3E%3C/path%3E%3C/svg%3E"); } .icon-list { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='w-4 h-4' fill='currentColor' viewBox='0 0 20 20' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M3 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z' clip-rule='evenodd'%3E%3C/path%3E%3C/svg%3E"); } .icon-calendar { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M291.5-411.5Q280-423 280-440t11.5-28.5Q303-480 320-480t28.5 11.5Q360-457 360-440t-11.5 28.5Q337-400 320-400t-28.5-11.5Zm160 0Q440-423 440-440t11.5-28.5Q463-480 480-480t28.5 11.5Q520-457 520-440t-11.5 28.5Q497-400 480-400t-28.5-11.5Zm160 0Q600-423 600-440t11.5-28.5Q623-480 640-480t28.5 11.5Q680-457 680-440t-11.5 28.5Q657-400 640-400t-28.5-11.5ZM200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Z'/%3E%3C/svg%3E"); } .icon-timer { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M360-840v-80h240v80H360Zm80 440h80v-240h-80v240Zm-99.5 291.5Q275-137 226-186t-77.5-114.5Q120-366 120-440t28.5-139.5Q177-645 226-694t114.5-77.5Q406-800 480-800q62 0 119 20t107 58l56-56 56 56-56 56q38 50 58 107t20 119q0 74-28.5 139.5T734-186q-49 49-114.5 77.5T480-80q-74 0-139.5-28.5ZM678-242q82-82 82-198t-82-198q-82-82-198-82t-198 82q-82 82-82 198t82 198q82 82 198 82t198-82ZM480-440Z'/%3E%3C/svg%3E"); } .icon-updated { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M204-318q-22-38-33-78t-11-82q0-134 93-228t227-94h7l-64-64 56-56 160 160-160 160-56-56 64-64h-7q-100 0-170 70.5T240-478q0 26 6 51t18 49l-60 60ZM481-40 321-200l160-160 56 56-64 64h7q100 0 170-70.5T720-482q0-26-6-51t-18-49l60-60q22 38 33 78t11 82q0 134-93 228t-227 94h-7l64 64-56 56Z'/%3E%3C/svg%3E"); } .icon-share { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M680-80q-50 0-85-35t-35-85q0-6 3-28L282-392q-16 15-37 23.5t-45 8.5q-50 0-85-35t-35-85q0-50 35-85t85-35q24 0 45 8.5t37 23.5l281-164q-2-7-2.5-13.5T560-760q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35q-24 0-45-8.5T598-672L317-508q2 7 2.5 13.5t.5 14.5q0 8-.5 14.5T317-452l281 164q16-15 37-23.5t45-8.5q50 0 85 35t35 85q0 50-35 85t-85 35Zm0-80q17 0 28.5-11.5T720-200q0-17-11.5-28.5T680-240q-17 0-28.5 11.5T640-200q0 17 11.5 28.5T680-160ZM200-440q17 0 28.5-11.5T240-480q0-17-11.5-28.5T200-520q-17 0-28.5 11.5T160-480q0 17 11.5 28.5T200-440Zm508.5-291.5Q720-743 720-760t-11.5-28.5Q697-800 680-800t-28.5 11.5Q640-777 640-760t11.5 28.5Q663-720 680-720t28.5-11.5ZM680-200ZM200-480Zm480-280Z'/%3E%3C/svg%3E"); } .icon-trending { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m136-240-56-56 296-298 160 160 208-206H640v-80h240v240h-80v-104L536-320 376-480 136-240Z'/%3E%3C/svg%3E"); } .icon-kiyoh { background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 25.2.2, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='svg2' xmlns:cc='http://creativecommons.org/ns%23' xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 527.4 530.6' style='enable-background:new 0 0 527.4 530.6;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bclip-path:url(%23SVGID_2_);%7D .st1%7Bfill:%23FECB04;%7D .st2%7Bfill:%23F7901F;%7D .st3%7Bfill:%23FAA61B;%7D .st4%7Bfill:%23F26623;%7D .st5%7Bfill:%238CC63E;%7D .st6%7Bfill:%23BFD730;%7D .st7%7Bfill:%2361BB45;%7D .st8%7Bfill:%23E2E419;%7D%0A%3C/style%3E%3Cg id='g10' transform='matrix(1.3333333,0,0,-1.3333333,0,803.95067)'%3E%3Cg id='g12'%3E%3Cg%3E%3Cdefs%3E%3Crect id='SVGID_1_' x='-998.3' y='-86.8' width='1624.7' height='804'/%3E%3C/defs%3E%3CclipPath id='SVGID_2_'%3E%3Cuse xlink:href='%23SVGID_1_' style='overflow:visible;'/%3E%3C/clipPath%3E%3Cg id='g14' class='st0'%3E%3Cg id='g24' transform='translate(900.915,567.6626)'%3E%3Cpath id='path26' class='st1' d='M-795.2,13.7l32.2-60.1c-32.5-17.4-56.1-49.1-62.6-86.7l-71.7,12.4 C-885.8-62-847.7-12.9-795.2,13.7'/%3E%3C/g%3E%3Cg id='g28' transform='translate(795.2148,395.8623)'%3E%3Cpath id='path30' class='st2' d='M-795.2,13.7c0,12.8,1.2,25.3,3.6,37.4l71.7-12.5c-1.2-6.8-1.8-13.8-1.8-20.9 c0-9.6,1.1-19,3.2-28l-72.3-17C-793.7-14-795.2-0.3-795.2,13.7'/%3E%3C/g%3E%3Cg id='g32' transform='translate(888.0146,334.1426)'%3E%3Cpath id='path34' class='st3' d='M-795.2,13.7l-63.1-40.4c-11.8,18.6-20.4,39.2-25.3,61.3l72.3,17 C-808.1,37.9-802.6,25.2-795.2,13.7'/%3E%3C/g%3E%3Cg id='g36' transform='translate(935.3652,291.2314)'%3E%3Cpath id='path38' class='st4' d='M-795.2,13.7l-46.4-91c-32.6,8.2-64.5,22.1-93.8,41.2c0,0,29.3,6.1,61.1,14.3 c-12,11.3-22.6,24-31.5,37.9l63.1,40.4C-830.9,38.5-814.5,23.6-795.2,13.7'/%3E%3C/g%3E%3Cg id='g40' transform='translate(990.7549,277.9619)'%3E%3Cpath id='path42' class='st3' d='M-795.2,13.7v-84.9C-828.5-75-863.1-72.6-897-64l46.4,91C-834,18.5-815.2,13.7-795.2,13.7'/%3E%3C/g%3E%3Cg id='g44' transform='translate(1054.0146,295.6221)'%3E%3Cpath id='path46' class='st5' d='M-795.2,13.7l39.5-65.2c-30.6-20.7-65.9-32.9-102.8-37.3v84.9 C-835.3-3.9-813.7,2.5-795.2,13.7'/%3E%3C/g%3E%3Cg id='g48' transform='translate(1112.7549,399.9624)'%3E%3Cpath id='path50' class='st6' d='M-795.2,13.7c0,7.8-0.7,15.4-2.1,22.8l70.9,13.5c10.1-50,0.6-103.8-31-149.4 c-16-23.2-35.3-41.9-57-56.5L-854-90.6C-818.7-69.2-795.2-30.5-795.2,13.7'/%3E%3C/g%3E%3Cg id='g52' transform='translate(889.7549,461.9624)'%3E%3Cpath id='path54' class='st7' d='M-795.2,13.7l84-128.5h50.5c0,0,6.5,39.5,22.5,85.8c18.3,52.8,51.5,115.3,144,153.7 c0,0-138,12.5-204-163l-32.5,52H-795.2z'/%3E%3C/g%3E%3Cg id='g56' transform='translate(990.7549,521.9624)'%3E%3Cpath id='path58' class='st8' d='M-795.2,13.7c19.8,0,38.6-4.7,55.1-13.1c20.2,21.6,41.5,36,61.4,45.5c-3.9,3-7.9,5.8-12.1,8.6 C-722.4,75.4-767.4,81-794,81c-33.1,0-64-7.8-91.1-21.6l32.2-60.1C-835.7,8.5-816.1,13.7-795.2,13.7 M-658.6,28.6 c28.2-28.2,46.6-63.3,54.1-100.5l-70.9-13.5c-4.5,23.8-15.9,45.2-32.1,61.9C-695.2-5.3-679.5,12.4-658.6,28.6'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-size: contain; &:after { background-color: unset; } } .cms-klantenservice { #maincontent { .column.main { display: grid; gap: calc(var(--spacing) * 8); padding-bottom: calc(var(--spacing) * 16); @media (width >= 48rem) { gap: calc(var(--spacing) * 16); } } } [data-content-type="row"][data-appearance="contained"] { margin-inline: auto; max-width: var(--container-6xl); } } .icon-chevron-right { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m560-240-56-58 142-142H160v-80h486L504-662l56-58 240 240-240 240Z'/%3E%3C/svg%3E"); } .servicehub-faq { #amfaq_search { margin-top: calc(var(--spacing) * 4); .form-input { width: calc(var(--spacing) * 96); } button { margin: calc(var(--spacing) * 0); color: var(--color-gray-900); } } h2 { text-align: center; } .am-widget-categories-3 { margin-top: calc(var(--spacing) * 8); display: grid; align-items: flex-start; gap: calc(var(--spacing) * 8); @media (width >= 48rem) { grid-template-columns: repeat(2, minmax(0, 1fr)); } > div { margin-bottom: calc(var(--spacing) * 0); border-radius: var(--radius-2xl); border-style: var(--tw-border-style); border-width: 1px; border-color: var(--color-gray-200); background-color: var(--color-white); padding: calc(var(--spacing) * 6); --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)); box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow); > div { &.text-right { margin-bottom: calc(var(--spacing) * 0); } } } dl { margin-top: calc(var(--spacing) * 4); :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse))); } > div { padding-top: calc(var(--spacing) * 3); } button { span { --tw-font-weight: var(--font-weight-medium); font-weight: var(--font-weight-medium); } } } } } .servicehub-faq #amfaq_search .flex { gap: .75rem; } .servicehub-faq #amfaq_search input[type="search"] { height: 3rem; border-radius: 0.9rem; padding: 0 1rem; border: 1px solid #e5e7eb; background: #fff; } .servicehub-faq #amfaq_search button.btn { height: 3rem; border-radius: 0.9rem; padding: 0 1rem; white-space: nowrap; } #stickyAddToCart { .qty-increment { button { display: none; @media (width >= 48rem) { display: block; } } input { width: calc(var(--spacing) * 12); @media (width >= 48rem) { width: auto; } } } } .icon-grid { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='w-4 h-4' fill='currentColor' viewBox='0 0 20 20' aria-hidden='true'%3E%3Cpath d='M5 3a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2V5a2 2 0 00-2-2H5zM5 11a2 2 0 00-2 2v2a2 2 0 002 2h2a2 2 0 002-2v-2a2 2 0 00-2-2H5zM11 5a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V5zM11 13a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z'%3E%3C/path%3E%3C/svg%3E"); } .icon-list { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' class='w-4 h-4' fill='currentColor' viewBox='0 0 20 20' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M3 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm0 4a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z' clip-rule='evenodd'%3E%3C/path%3E%3C/svg%3E"); } .icon-calendar { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M291.5-411.5Q280-423 280-440t11.5-28.5Q303-480 320-480t28.5 11.5Q360-457 360-440t-11.5 28.5Q337-400 320-400t-28.5-11.5Zm160 0Q440-423 440-440t11.5-28.5Q463-480 480-480t28.5 11.5Q520-457 520-440t-11.5 28.5Q497-400 480-400t-28.5-11.5Zm160 0Q600-423 600-440t11.5-28.5Q623-480 640-480t28.5 11.5Q680-457 680-440t-11.5 28.5Q657-400 640-400t-28.5-11.5ZM200-80q-33 0-56.5-23.5T120-160v-560q0-33 23.5-56.5T200-800h40v-80h80v80h320v-80h80v80h40q33 0 56.5 23.5T840-720v560q0 33-23.5 56.5T760-80H200Zm0-80h560v-400H200v400Zm0-480h560v-80H200v80Zm0 0v-80 80Z'/%3E%3C/svg%3E"); } .icon-timer { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M360-840v-80h240v80H360Zm80 440h80v-240h-80v240Zm-99.5 291.5Q275-137 226-186t-77.5-114.5Q120-366 120-440t28.5-139.5Q177-645 226-694t114.5-77.5Q406-800 480-800q62 0 119 20t107 58l56-56 56 56-56 56q38 50 58 107t20 119q0 74-28.5 139.5T734-186q-49 49-114.5 77.5T480-80q-74 0-139.5-28.5ZM678-242q82-82 82-198t-82-198q-82-82-198-82t-198 82q-82 82-82 198t82 198q82 82 198 82t198-82ZM480-440Z'/%3E%3C/svg%3E"); } .icon-updated { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M204-318q-22-38-33-78t-11-82q0-134 93-228t227-94h7l-64-64 56-56 160 160-160 160-56-56 64-64h-7q-100 0-170 70.5T240-478q0 26 6 51t18 49l-60 60ZM481-40 321-200l160-160 56 56-64 64h7q100 0 170-70.5T720-482q0-26-6-51t-18-49l60-60q22 38 33 78t11 82q0 134-93 228t-227 94h-7l64 64-56 56Z'/%3E%3C/svg%3E"); } .icon-share { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='M680-80q-50 0-85-35t-35-85q0-6 3-28L282-392q-16 15-37 23.5t-45 8.5q-50 0-85-35t-35-85q0-50 35-85t85-35q24 0 45 8.5t37 23.5l281-164q-2-7-2.5-13.5T560-760q0-50 35-85t85-35q50 0 85 35t35 85q0 50-35 85t-85 35q-24 0-45-8.5T598-672L317-508q2 7 2.5 13.5t.5 14.5q0 8-.5 14.5T317-452l281 164q16-15 37-23.5t45-8.5q50 0 85 35t35 85q0 50-35 85t-85 35Zm0-80q17 0 28.5-11.5T720-200q0-17-11.5-28.5T680-240q-17 0-28.5 11.5T640-200q0 17 11.5 28.5T680-160ZM200-440q17 0 28.5-11.5T240-480q0-17-11.5-28.5T200-520q-17 0-28.5 11.5T160-480q0 17 11.5 28.5T200-440Zm508.5-291.5Q720-743 720-760t-11.5-28.5Q697-800 680-800t-28.5 11.5Q640-777 640-760t11.5 28.5Q663-720 680-720t28.5-11.5ZM680-200ZM200-480Zm480-280Z'/%3E%3C/svg%3E"); } .icon-trending { --svg-icon-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 -960 960 960' width='24px' fill='%23fff'%3E%3Cpath d='m136-240-56-56 296-298 160 160 208-206H640v-80h240v240h-80v-104L536-320 376-480 136-240Z'/%3E%3C/svg%3E"); } @layer components { :where(#hyva-checkout-main) { & .btn { border-style: var(--tw-border-style); border-width: 2px; &:disabled { cursor: not-allowed; } &:disabled { opacity: 60%; } &:not(.btn-secondary) { border-color: transparent; } } } } :where(.step-layout-3columns) { .btn-place-order { width: 100%; } } .checkout-nav { display: flex; flex-direction: column-reverse; gap: calc(var(--spacing) * 2); & .checkout-nav-main, & .checkout-nav-secondary { display: flex; flex-direction: column; gap: calc(var(--spacing) * 2); } } .area-main .checkout-nav { @media (width >= 48rem) { flex-direction: row; } & .checkout-nav-main, & .checkout-nav-secondary { @media (width >= 48rem) { flex-direction: row; } @media (width >= 48rem) { align-items: center; } @media (width >= 48rem) { flex-grow: 1; } } & .checkout-nav-main { @media (width >= 48rem) { justify-content: space-between; } & > button:only-child { @media (width >= 48rem) { margin-left: auto; } } } } .checkout-summary { :where(& > :not(:last-child)) { --tw-space-y-reverse: 0; margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse)); margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))); } background-color: var(--color-container-darker); padding: calc(var(--spacing) * 6); & .checkout-nav { & .btn { width: 100%; } } } :where(#hyva-checkout-main) { .breadcrumbs { .item { display: inline-flex; align-items: center; &.active { :where(& > :not(:last-child)) { --tw-space-x-reverse: 0; margin-inline-start: calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse)); margin-inline-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse))); } --tw-font-weight: var(--font-weight-bold); font-weight: var(--font-weight-bold); } &.locked { cursor: not-allowed; color: var(--color-gray-500); } &.completed { color: var(--color-gray-700); } } } } .checkout-default:where(:has(#hyva-checkout-main)) { .columns, .page.messages .messages { max-width: var(--breakpoint-lg); } } :where(#hyva-checkout-main) { & .form-checkbox, & .form-radio { flex: none; } & .input-group { gap: 0; & > :not(:last-child) { border-inline-end-width: 0; } } } @layer components { .form-input-addon { appearance: none; padding-block: var(--form-py); padding-inline: var(--form-px); border-radius: var(--form-radius); border-width: 1px; border-color: var(--form-stroke); background-color: var(--form-bg); color: var(--form-color); --outline-size: 1px; --outline-offset: 0px; &:first-child { padding-inline-end: 0; border-inline-end: 0; } &:last-child { padding-inline-start: 0; border-inline-start: 0; } } .input-group { position: relative; display: flex; border-radius: var(--form-radius); vertical-align: middle; &:focus-within { --form-stroke: var(--form-active-color); outline: var(--outline-size, 1px) solid var(--form-active-color); outline-offset: var(--outline-offset, 0px); } & > * { margin: 0; border-radius: 0; outline: none; } & > :first-child { border-start-start-radius: inherit; border-end-start-radius: inherit; } & > :last-child { border-start-end-radius: inherit; border-end-end-radius: inherit; } & > :not(template, [hidden]:where(:not([hidden="until-found"]))) + :not(button, .btn) { border-inline-start-width: 0; } } } @layer base { :where(#hyva-checkout-main) { --form-stroke: var(--color-slate-300, currentColor); } :where(#hyva-checkout-main) *, :where(#hyva-checkout-main) ::after, :where(#hyva-checkout-main) ::before, :where(#hyva-checkout-main) ::backdrop, :where(#hyva-checkout-main) ::file-selector-button { border-color: var(--color-gray-200, currentColor); } } @property --tw-scroll-snap-strictness { syntax: "*"; inherits: false; initial-value: proximity; } @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-translate-z { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-scale-x { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-scale-y { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-scale-z { syntax: "*"; inherits: false; initial-value: 1; } @property --tw-rotate-x { syntax: "*"; inherits: false; } @property --tw-rotate-y { syntax: "*"; inherits: false; } @property --tw-rotate-z { syntax: "*"; inherits: false; } @property --tw-skew-x { syntax: "*"; inherits: false; } @property --tw-skew-y { syntax: "*"; inherits: false; } @property --tw-space-y-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-space-x-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-divide-x-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-divide-y-reverse { syntax: "*"; inherits: false; initial-value: 0; } @property --tw-gradient-position { syntax: "*"; inherits: false; } @property --tw-gradient-from { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-via { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-to { syntax: ""; inherits: false; initial-value: #0000; } @property --tw-gradient-stops { syntax: "*"; inherits: false; } @property --tw-gradient-via-stops { syntax: "*"; inherits: false; } @property --tw-gradient-from-position { syntax: ""; inherits: false; initial-value: 0%; } @property --tw-gradient-via-position { syntax: ""; inherits: false; initial-value: 50%; } @property --tw-gradient-to-position { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-mask-linear { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff, #fff); } @property --tw-mask-radial { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff, #fff); } @property --tw-mask-conic { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff, #fff); } @property --tw-mask-left { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff, #fff); } @property --tw-mask-right { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff, #fff); } @property --tw-mask-bottom { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff, #fff); } @property --tw-mask-top { syntax: "*"; inherits: false; initial-value: linear-gradient(#fff, #fff); } @property --tw-mask-bottom-from-position { syntax: "*"; inherits: false; initial-value: 0%; } @property --tw-mask-bottom-to-position { syntax: "*"; inherits: false; initial-value: 100%; } @property --tw-mask-bottom-from-color { syntax: "*"; inherits: false; initial-value: black; } @property --tw-mask-bottom-to-color { syntax: "*"; inherits: false; initial-value: transparent; } @property --tw-leading { syntax: "*"; inherits: false; } @property --tw-font-weight { syntax: "*"; inherits: false; } @property --tw-tracking { syntax: "*"; inherits: false; } @property --tw-ordinal { syntax: "*"; inherits: false; } @property --tw-slashed-zero { syntax: "*"; inherits: false; } @property --tw-numeric-figure { syntax: "*"; inherits: false; } @property --tw-numeric-spacing { syntax: "*"; inherits: false; } @property --tw-numeric-fraction { syntax: "*"; inherits: false; } @property --tw-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-shadow-color { syntax: "*"; inherits: false; } @property --tw-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-inset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-shadow-color { syntax: "*"; inherits: false; } @property --tw-inset-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-ring-color { syntax: "*"; inherits: false; } @property --tw-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-inset-ring-color { syntax: "*"; inherits: false; } @property --tw-inset-ring-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-ring-inset { syntax: "*"; inherits: false; } @property --tw-ring-offset-width { syntax: ""; inherits: false; initial-value: 0px; } @property --tw-ring-offset-color { syntax: "*"; inherits: false; initial-value: #fff; } @property --tw-ring-offset-shadow { syntax: "*"; inherits: false; initial-value: 0 0 #0000; } @property --tw-outline-style { syntax: "*"; inherits: false; initial-value: solid; } @property --tw-blur { syntax: "*"; inherits: false; } @property --tw-brightness { syntax: "*"; inherits: false; } @property --tw-contrast { syntax: "*"; inherits: false; } @property --tw-grayscale { syntax: "*"; inherits: false; } @property --tw-hue-rotate { syntax: "*"; inherits: false; } @property --tw-invert { syntax: "*"; inherits: false; } @property --tw-opacity { syntax: "*"; inherits: false; } @property --tw-saturate { syntax: "*"; inherits: false; } @property --tw-sepia { syntax: "*"; inherits: false; } @property --tw-drop-shadow { syntax: "*"; inherits: false; } @property --tw-drop-shadow-color { syntax: "*"; inherits: false; } @property --tw-drop-shadow-alpha { syntax: ""; inherits: false; initial-value: 100%; } @property --tw-drop-shadow-size { syntax: "*"; inherits: false; } @property --tw-backdrop-blur { syntax: "*"; inherits: false; } @property --tw-backdrop-brightness { syntax: "*"; inherits: false; } @property --tw-backdrop-contrast { syntax: "*"; inherits: false; } @property --tw-backdrop-grayscale { syntax: "*"; inherits: false; } @property --tw-backdrop-hue-rotate { syntax: "*"; inherits: false; } @property --tw-backdrop-invert { syntax: "*"; inherits: false; } @property --tw-backdrop-opacity { syntax: "*"; inherits: false; } @property --tw-backdrop-saturate { syntax: "*"; inherits: false; } @property --tw-backdrop-sepia { syntax: "*"; inherits: false; } @property --tw-duration { syntax: "*"; inherits: false; } @property --tw-ease { syntax: "*"; inherits: false; } @property --tw-content { syntax: "*"; initial-value: ""; inherits: false; } @keyframes spin { to { transform: rotate(360deg); } } @keyframes ping { 75%, 100% { transform: scale(2); opacity: 0; } } @keyframes bounce { 0%, 100% { transform: translateY(-25%); animation-timing-function: cubic-bezier(0.8, 0, 1, 1); } 50% { transform: none; animation-timing-function: cubic-bezier(0, 0, 0.2, 1); } } @layer properties { @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) { *, ::before, ::after, ::backdrop { --tw-scroll-snap-strictness: proximity; --tw-translate-x: 0; --tw-translate-y: 0; --tw-translate-z: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-scale-z: 1; --tw-rotate-x: initial; --tw-rotate-y: initial; --tw-rotate-z: initial; --tw-skew-x: initial; --tw-skew-y: initial; --tw-space-y-reverse: 0; --tw-space-x-reverse: 0; --tw-divide-x-reverse: 0; --tw-border-style: solid; --tw-divide-y-reverse: 0; --tw-gradient-position: initial; --tw-gradient-from: #0000; --tw-gradient-via: #0000; --tw-gradient-to: #0000; --tw-gradient-stops: initial; --tw-gradient-via-stops: initial; --tw-gradient-from-position: 0%; --tw-gradient-via-position: 50%; --tw-gradient-to-position: 100%; --tw-mask-linear: linear-gradient(#fff, #fff); --tw-mask-radial: linear-gradient(#fff, #fff); --tw-mask-conic: linear-gradient(#fff, #fff); --tw-mask-left: linear-gradient(#fff, #fff); --tw-mask-right: linear-gradient(#fff, #fff); --tw-mask-bottom: linear-gradient(#fff, #fff); --tw-mask-top: linear-gradient(#fff, #fff); --tw-mask-bottom-from-position: 0%; --tw-mask-bottom-to-position: 100%; --tw-mask-bottom-from-color: black; --tw-mask-bottom-to-color: transparent; --tw-leading: initial; --tw-font-weight: initial; --tw-tracking: initial; --tw-ordinal: initial; --tw-slashed-zero: initial; --tw-numeric-figure: initial; --tw-numeric-spacing: initial; --tw-numeric-fraction: initial; --tw-shadow: 0 0 #0000; --tw-shadow-color: initial; --tw-shadow-alpha: 100%; --tw-inset-shadow: 0 0 #0000; --tw-inset-shadow-color: initial; --tw-inset-shadow-alpha: 100%; --tw-ring-color: initial; --tw-ring-shadow: 0 0 #0000; --tw-inset-ring-color: initial; --tw-inset-ring-shadow: 0 0 #0000; --tw-ring-inset: initial; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-offset-shadow: 0 0 #0000; --tw-outline-style: solid; --tw-blur: initial; --tw-brightness: initial; --tw-contrast: initial; --tw-grayscale: initial; --tw-hue-rotate: initial; --tw-invert: initial; --tw-opacity: initial; --tw-saturate: initial; --tw-sepia: initial; --tw-drop-shadow: initial; --tw-drop-shadow-color: initial; --tw-drop-shadow-alpha: 100%; --tw-drop-shadow-size: initial; --tw-backdrop-blur: initial; --tw-backdrop-brightness: initial; --tw-backdrop-contrast: initial; --tw-backdrop-grayscale: initial; --tw-backdrop-hue-rotate: initial; --tw-backdrop-invert: initial; --tw-backdrop-opacity: initial; --tw-backdrop-saturate: initial; --tw-backdrop-sepia: initial; --tw-duration: initial; --tw-ease: initial; --tw-content: ""; } } }