tinacms 0.68.7 → 0.68.10

package/dist/index.es.js

@@ -29,7 +29,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import { useCMS, Form, GlobalFormPlugin, EventBus, Modal, ModalPopup, ModalHeader, ModalBody, ModalActions, Button as Button$1, LoadingDots, useLocalStorage, TinaCMS, BranchSwitcherPlugin, BranchDataProvider, TinaProvider, Nav, LocalWarning, OverflowMenu, FormStatus, FormBuilder } from "@tinacms/toolkit";
+import { useCMS, Form, GlobalFormPlugin, EventBus, Modal, ModalPopup, ModalHeader, ModalBody, ModalActions, Button as Button$1, LoadingDots, useLocalStorage, TinaCMS, BranchSwitcherPlugin, BranchDataProvider, TinaProvider, TinaMediaStore, DummyMediaStore, Nav, LocalWarning, OverflowMenu, PopupModal, FormStatus, FormBuilder } from "@tinacms/toolkit";
 export * from "@tinacms/toolkit";
 import * as G from "graphql";
 import { TypeInfo, visit, visitWithTypeInfo, getNamedType, GraphQLObjectType, isLeafType, GraphQLUnionType, isScalarType as isScalarType$1, getIntrospectionQuery, buildClientSchema, print, parse } from "graphql";
@@ -2206,11 +2206,12 @@ mutation addPendingDocumentMutation(
     return this.contentApiUrl.includes("localhost");
   }
   setBranch(branchName) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const encodedBranch = encodeURIComponent(branchName);
-    this.frontendUrl = ((_a = this.options.tinaioConfig) == null ? void 0 : _a.frontendUrlOverride) || "https://app.tina.io";
-    this.identityApiUrl = ((_b = this.options.tinaioConfig) == null ? void 0 : _b.identityApiUrlOverride) || "https://identity.tinajs.io";
-    this.contentApiBase = ((_c = this.options.tinaioConfig) == null ? void 0 : _c.contentApiUrlOverride) || `https://content.tinajs.io`;
+    this.assetsApiUrl = ((_a = this.options.tinaioConfig) == null ? void 0 : _a.assetsApiUrlOverride) || "https://assets.tinajs.io";
+    this.frontendUrl = ((_b = this.options.tinaioConfig) == null ? void 0 : _b.frontendUrlOverride) || "https://app.tina.io";
+    this.identityApiUrl = ((_c = this.options.tinaioConfig) == null ? void 0 : _c.identityApiUrlOverride) || "https://identity.tinajs.io";
+    this.contentApiBase = ((_d = this.options.tinaioConfig) == null ? void 0 : _d.contentApiUrlOverride) || `https://content.tinajs.io`;
     this.contentApiUrl = this.options.customContentApiUrl || `${this.contentApiBase}/content/${this.options.clientId}/github/${encodedBranch}`;
   }
   async requestWithForm(query, {
@@ -2662,7 +2663,7 @@ const TinaCloudProvider = (props) => {
     cms.registerApi("admin", new TinaAdminApi(cms));
   }
   const setupMedia = async () => {
-    var _a;
+    var _a, _b, _c;
     if (props.mediaStore) {
       if ((_a = props.mediaStore.prototype) == null ? void 0 : _a.persist) {
         cms.media.store = new props.mediaStore(cms.api.tina);
@@ -2670,6 +2671,12 @@ const TinaCloudProvider = (props) => {
         const MediaClass = await props.mediaStore();
         cms.media.store = new MediaClass(cms.api.tina);
       }
+    } else {
+      if ((_c = (_b = props.schema.config) == null ? void 0 : _b.media) == null ? void 0 : _c.tina) {
+        cms.media.store = new TinaMediaStore(cms);
+      } else {
+        cms.media.store = new DummyMediaStore();
+      }
     }
   };
   const handleListBranches = async () => {
@@ -2725,7 +2732,885 @@ const TinaCloudProvider = (props) => {
   }))));
 };
 const TinaCloudAuthWall = TinaCloudProvider;
-var styles = '*, ::before, ::after {\n      --tw-translate-x: 0;\n      --tw-translate-y: 0;\n      --tw-rotate: 0;\n      --tw-skew-x: 0;\n      --tw-skew-y: 0;\n      --tw-scale-x: 1;\n      --tw-scale-y: 1;\n      --tw-pan-x:  ;\n      --tw-pan-y:  ;\n      --tw-pinch-zoom:  ;\n      --tw-scroll-snap-strictness: proximity;\n      --tw-ordinal:  ;\n      --tw-slashed-zero:  ;\n      --tw-numeric-figure:  ;\n      --tw-numeric-spacing:  ;\n      --tw-numeric-fraction:  ;\n      --tw-ring-inset:  ;\n      --tw-ring-offset-width: 0px;\n      --tw-ring-offset-color: #fff;\n      --tw-ring-color: rgb(0 132 255 / 0.5);\n      --tw-ring-offset-shadow: 0 0 #0000;\n      --tw-ring-shadow: 0 0 #0000;\n      --tw-shadow: 0 0 #0000;\n      --tw-shadow-colored: 0 0 #0000;\n      --tw-blur:  ;\n      --tw-brightness:  ;\n      --tw-contrast:  ;\n      --tw-grayscale:  ;\n      --tw-hue-rotate:  ;\n      --tw-invert:  ;\n      --tw-saturate:  ;\n      --tw-sepia:  ;\n      --tw-drop-shadow:  ;\n      --tw-backdrop-blur:  ;\n      --tw-backdrop-brightness:  ;\n      --tw-backdrop-contrast:  ;\n      --tw-backdrop-grayscale:  ;\n      --tw-backdrop-hue-rotate:  ;\n      --tw-backdrop-invert:  ;\n      --tw-backdrop-opacity:  ;\n      --tw-backdrop-saturate:  ;\n      --tw-backdrop-sepia:  ;\n}\n.tina-tailwind .pointer-events-auto {\n      pointer-events: auto;\n}\n.tina-tailwind .static {\n      position: static;\n}\n.tina-tailwind .fixed {\n      position: fixed;\n}\n.tina-tailwind .absolute {\n      position: absolute;\n}\n.tina-tailwind .relative {\n      position: relative;\n}\n.tina-tailwind .inset-0 {\n      top: 0px;\n      right: 0px;\n      bottom: 0px;\n      left: 0px;\n}\n.tina-tailwind .left-0 {\n      left: 0px;\n}\n.tina-tailwind .top-0 {\n      top: 0px;\n}\n.tina-tailwind .top-8 {\n      top: 32px;\n}\n.tina-tailwind .right-0 {\n      right: 0px;\n}\n.tina-tailwind .top-10 {\n      top: 40px;\n}\n.tina-tailwind .top-4 {\n      top: 16px;\n}\n.tina-tailwind .z-overlay {\n      z-index: 10600;\n}\n.tina-tailwind .z-menu {\n      z-index: 9800;\n}\n.tina-tailwind .z-50 {\n      z-index: 50;\n}\n.tina-tailwind .mx-auto {\n      margin-left: auto;\n      margin-right: auto;\n}\n.tina-tailwind .-ml-px {\n      margin-left: -1px;\n}\n.tina-tailwind .mr-2 {\n      margin-right: 8px;\n}\n.tina-tailwind .mb-2 {\n      margin-bottom: 8px;\n}\n.tina-tailwind .mb-1 {\n      margin-bottom: 4px;\n}\n.tina-tailwind .-mt-0\\.5 {\n      margin-top: -2px;\n}\n.tina-tailwind .-mt-0 {\n      margin-top: -0px;\n}\n.tina-tailwind .ml-1 {\n      margin-left: 4px;\n}\n.tina-tailwind .mt-2 {\n      margin-top: 8px;\n}\n.tina-tailwind .mr-1\\.5 {\n      margin-right: 6px;\n}\n.tina-tailwind .mr-1 {\n      margin-right: 4px;\n}\n.tina-tailwind .block {\n      display: block;\n}\n.tina-tailwind .inline-block {\n      display: inline-block;\n}\n.tina-tailwind .inline {\n      display: inline;\n}\n.tina-tailwind .flex {\n      display: flex;\n}\n.tina-tailwind .inline-flex {\n      display: inline-flex;\n}\n.tina-tailwind .table {\n      display: table;\n}\n.tina-tailwind .h-screen {\n      height: 100vh;\n}\n.tina-tailwind .h-auto {\n      height: auto;\n}\n.tina-tailwind .h-full {\n      height: 100%;\n}\n.tina-tailwind .h-6 {\n      height: 24px;\n}\n.tina-tailwind .h-7 {\n      height: 28px;\n}\n.tina-tailwind .h-10 {\n      height: 40px;\n}\n.tina-tailwind .h-5 {\n      height: 20px;\n}\n.tina-tailwind .h-12 {\n      height: 48px;\n}\n.tina-tailwind .w-full {\n      width: 100%;\n}\n.tina-tailwind .w-10 {\n      width: 40px;\n}\n.tina-tailwind .w-auto {\n      width: auto;\n}\n.tina-tailwind .w-5 {\n      width: 20px;\n}\n.tina-tailwind .w-56 {\n      width: 224px;\n}\n.tina-tailwind .w-0 {\n      width: 0px;\n}\n.tina-tailwind .w-6 {\n      width: 24px;\n}\n.tina-tailwind .max-w-lg {\n      max-width: 32rem;\n}\n.tina-tailwind .max-w-screen-xl {\n      max-width: 1280px;\n}\n.tina-tailwind .max-w-form {\n      max-width: 900px;\n}\n.tina-tailwind .max-w-full {\n      max-width: 100%;\n}\n.tina-tailwind .flex-1 {\n      flex: 1 1 0%;\n}\n.tina-tailwind .flex-shrink-0 {\n      flex-shrink: 0;\n}\n.tina-tailwind .flex-grow-0 {\n      flex-grow: 0;\n}\n.tina-tailwind .table-auto {\n      table-layout: auto;\n}\n.tina-tailwind .origin-top-right {\n      transform-origin: top right;\n}\n.tina-tailwind .-translate-x-full {\n      --tw-translate-x: -100%;\n      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .translate-x-0 {\n      --tw-translate-x: 0px;\n      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .translate-x-full {\n      --tw-translate-x: 100%;\n      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .scale-95 {\n      --tw-scale-x: .95;\n      --tw-scale-y: .95;\n      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .scale-100 {\n      --tw-scale-x: 1;\n      --tw-scale-y: 1;\n      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .transform {\n      transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.tina-tailwind .cursor-pointer {\n      cursor: pointer;\n}\n.tina-tailwind .flex-col {\n      flex-direction: column;\n}\n.tina-tailwind .items-end {\n      align-items: flex-end;\n}\n.tina-tailwind .items-center {\n      align-items: center;\n}\n.tina-tailwind .items-stretch {\n      align-items: stretch;\n}\n.tina-tailwind .justify-end {\n      justify-content: flex-end;\n}\n.tina-tailwind .justify-center {\n      justify-content: center;\n}\n.tina-tailwind .justify-between {\n      justify-content: space-between;\n}\n.tina-tailwind .gap-0\\.5 {\n      gap: 2px;\n}\n.tina-tailwind .gap-0 {\n      gap: 0px;\n}\n.tina-tailwind .gap-4 {\n      gap: 16px;\n}\n.tina-tailwind .gap-3 {\n      gap: 12px;\n}\n.tina-tailwind .divide-y > :not([hidden]) ~ :not([hidden]) {\n      --tw-divide-y-reverse: 0;\n      border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));\n      border-bottom-width: calc(1px * var(--tw-divide-y-reverse));\n}\n.tina-tailwind .divide-gray-150 > :not([hidden]) ~ :not([hidden]) {\n      --tw-divide-opacity: 1;\n      border-color: rgb(230 227 239 / var(--tw-divide-opacity));\n}\n.tina-tailwind .overflow-hidden {\n      overflow: hidden;\n}\n.tina-tailwind .overflow-y-auto {\n      overflow-y: auto;\n}\n.tina-tailwind .whitespace-nowrap {\n      white-space: nowrap;\n}\n.tina-tailwind .rounded-lg {\n      border-radius: 8px;\n}\n.tina-tailwind .rounded {\n      border-radius: 4px;\n}\n.tina-tailwind .rounded-full {\n      border-radius: 9999px;\n}\n.tina-tailwind .rounded-md {\n      border-radius: 6px;\n}\n.tina-tailwind .rounded-r-md {\n      border-top-right-radius: 6px;\n      border-bottom-right-radius: 6px;\n}\n.tina-tailwind .border {\n      border-width: 1px;\n}\n.tina-tailwind .border-b {\n      border-bottom-width: 1px;\n}\n.tina-tailwind .border-gray-150 {\n      --tw-border-opacity: 1;\n      border-color: rgb(230 227 239 / var(--tw-border-opacity));\n}\n.tina-tailwind .border-gray-200 {\n      --tw-border-opacity: 1;\n      border-color: rgb(225 221 236 / var(--tw-border-opacity));\n}\n.tina-tailwind .bg-white {\n      --tw-bg-opacity: 1;\n      background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-gray-50 {\n      --tw-bg-opacity: 1;\n      background-color: rgb(246 246 249 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-blue-500 {\n      --tw-bg-opacity: 1;\n      background-color: rgb(0 132 255 / var(--tw-bg-opacity));\n}\n.tina-tailwind .bg-gradient-to-b {\n      background-image: linear-gradient(to bottom, var(--tw-gradient-stops));\n}\n.tina-tailwind .bg-gradient-to-br {\n      background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));\n}\n.tina-tailwind .from-blue-900 {\n      --tw-gradient-from: #1D2C6C;\n      --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(29 44 108 / 0));\n}\n.tina-tailwind .from-gray-800 {\n      --tw-gradient-from: #363145;\n      --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(54 49 69 / 0));\n}\n.tina-tailwind .via-gray-900 {\n      --tw-gradient-stops: var(--tw-gradient-from), #252336, var(--tw-gradient-to, rgb(37 35 54 / 0));\n}\n.tina-tailwind .to-gray-900 {\n      --tw-gradient-to: #252336;\n}\n.tina-tailwind .to-black {\n      --tw-gradient-to: #000;\n}\n.tina-tailwind .px-4 {\n      padding-left: 16px;\n      padding-right: 16px;\n}\n.tina-tailwind .py-6 {\n      padding-top: 24px;\n      padding-bottom: 24px;\n}\n.tina-tailwind .px-5 {\n      padding-left: 20px;\n      padding-right: 20px;\n}\n.tina-tailwind .py-4 {\n      padding-top: 16px;\n      padding-bottom: 16px;\n}\n.tina-tailwind .px-12 {\n      padding-left: 48px;\n      padding-right: 48px;\n}\n.tina-tailwind .py-10 {\n      padding-top: 40px;\n      padding-bottom: 40px;\n}\n.tina-tailwind .px-20 {\n      padding-left: 80px;\n      padding-right: 80px;\n}\n.tina-tailwind .px-6 {\n      padding-left: 24px;\n      padding-right: 24px;\n}\n.tina-tailwind .py-1 {\n      padding-top: 4px;\n      padding-bottom: 4px;\n}\n.tina-tailwind .py-2 {\n      padding-top: 8px;\n      padding-bottom: 8px;\n}\n.tina-tailwind .py-5 {\n      padding-top: 20px;\n      padding-bottom: 20px;\n}\n.tina-tailwind .pt-4 {\n      padding-top: 16px;\n}\n.tina-tailwind .pb-4 {\n      padding-bottom: 16px;\n}\n.tina-tailwind .pt-18 {\n      padding-top: 72px;\n}\n.tina-tailwind .pt-3 {\n      padding-top: 12px;\n}\n.tina-tailwind .pl-18 {\n      padding-left: 72px;\n}\n.tina-tailwind .text-left {\n      text-align: left;\n}\n.tina-tailwind .text-center {\n      text-align: center;\n}\n.tina-tailwind .font-sans {\n      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n}\n.tina-tailwind .text-2xl {\n      font-size: 24px;\n      line-height: 1.33;\n}\n.tina-tailwind .text-base {\n      font-size: 16px;\n      line-height: 1.5;\n}\n.tina-tailwind .text-sm {\n      font-size: 14px;\n      line-height: 1.43;\n}\n.tina-tailwind .text-xl {\n      font-size: 20px;\n      line-height: 1.4;\n}\n.tina-tailwind .text-md {\n      font-size: 16px;\n      line-height: 1.5;\n}\n.tina-tailwind .text-xs {\n      font-size: 13px;\n      line-height: 1.33;\n}\n.tina-tailwind .font-medium {\n      font-weight: 500;\n}\n.tina-tailwind .uppercase {\n      text-transform: uppercase;\n}\n.tina-tailwind .italic {\n      font-style: italic;\n}\n.tina-tailwind .leading-normal {\n      line-height: 1.5;\n}\n.tina-tailwind .leading-tight {\n      line-height: 1.25;\n}\n.tina-tailwind .leading-5 {\n      line-height: 20px;\n}\n.tina-tailwind .tracking-wide {\n      letter-spacing: 0.025em;\n}\n.tina-tailwind .text-gray-600 {\n      --tw-text-opacity: 1;\n      color: rgb(86 81 101 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-700 {\n      --tw-text-opacity: 1;\n      color: rgb(67 62 82 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-blue-600 {\n      --tw-text-opacity: 1;\n      color: rgb(5 116 228 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-500 {\n      --tw-text-opacity: 1;\n      color: rgb(113 108 127 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-400 {\n      --tw-text-opacity: 1;\n      color: rgb(145 140 158 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-current {\n      color: currentColor;\n}\n.tina-tailwind .text-white {\n      --tw-text-opacity: 1;\n      color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-800 {\n      --tw-text-opacity: 1;\n      color: rgb(54 49 69 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-gray-900 {\n      --tw-text-opacity: 1;\n      color: rgb(37 35 54 / var(--tw-text-opacity));\n}\n.tina-tailwind .text-red-500 {\n      --tw-text-opacity: 1;\n      color: rgb(239 68 68 / var(--tw-text-opacity));\n}\n.tina-tailwind .underline {\n      text-decoration-line: underline;\n}\n.tina-tailwind .opacity-100 {\n      opacity: 1;\n}\n.tina-tailwind .opacity-0 {\n      opacity: 0;\n}\n.tina-tailwind .opacity-80 {\n      opacity: .8;\n}\n.tina-tailwind .opacity-90 {\n      opacity: .9;\n}\n.tina-tailwind .opacity-50 {\n      opacity: .5;\n}\n.tina-tailwind .opacity-70 {\n      opacity: .7;\n}\n.tina-tailwind .shadow-lg {\n      --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);\n      --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);\n      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .shadow-2xl {\n      --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);\n      --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);\n      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .shadow {\n      --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n      --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tina-tailwind .ring-1 {\n      --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n      --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n      box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.tina-tailwind .ring-black {\n      --tw-ring-opacity: 1;\n      --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));\n}\n.tina-tailwind .ring-opacity-5 {\n      --tw-ring-opacity: .05;\n}\n.tina-tailwind .filter {\n      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);\n}\n.tina-tailwind .transition-opacity {\n      transition-property: opacity;\n      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n      transition-duration: 150ms;\n}\n.tina-tailwind .transition-all {\n      transition-property: all;\n      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n      transition-duration: 150ms;\n}\n.tina-tailwind .transition-colors {\n      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;\n      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n      transition-duration: 150ms;\n}\n.tina-tailwind .transition {\n      transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n      transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n      transition-duration: 150ms;\n}\n.tina-tailwind .duration-300 {\n      transition-duration: 300ms;\n}\n.tina-tailwind .duration-200 {\n      transition-duration: 200ms;\n}\n.tina-tailwind .duration-150 {\n      transition-duration: 150ms;\n}\n.tina-tailwind .duration-100 {\n      transition-duration: 100ms;\n}\n.tina-tailwind .duration-75 {\n      transition-duration: 75ms;\n}\n.tina-tailwind .ease-out {\n      transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\n.tina-tailwind .ease-in {\n      transition-timing-function: cubic-bezier(0.4, 0, 1, 1);\n}\n.tina-tailwind .icon-parent svg {\n      fill: currentColor;\n    }\n\n.tina-tailwind {\n      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";\n      font-size: 16px;\n      line-height: 1.5;\n      --tw-text-opacity: 1;\n      color: rgb(86 81 101 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:bg-blue-600:hover {\n      --tw-bg-opacity: 1;\n      background-color: rgb(5 116 228 / var(--tw-bg-opacity));\n}\n\n.tina-tailwind .hover\\:text-blue-600:hover {\n      --tw-text-opacity: 1;\n      color: rgb(5 116 228 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:text-blue-400:hover {\n      --tw-text-opacity: 1;\n      color: rgb(34 150 254 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .hover\\:opacity-100:hover {\n      opacity: 1;\n}\n\n.tina-tailwind .focus\\:text-blue-400:focus {\n      --tw-text-opacity: 1;\n      color: rgb(34 150 254 / var(--tw-text-opacity));\n}\n\n.tina-tailwind .focus\\:underline:focus {\n      text-decoration-line: underline;\n}\n\n.tina-tailwind .focus\\:shadow-outline:focus {\n      --tw-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);\n      --tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);\n      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n\n.tina-tailwind .focus\\:outline-none:focus {\n      outline: 2px solid transparent;\n      outline-offset: 2px;\n}\n\n.tina-tailwind .focus\\:ring-2:focus {\n      --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n      --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n      box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.tina-tailwind .focus\\:ring-blue-500:focus {\n      --tw-ring-opacity: 1;\n      --tw-ring-color: rgb(0 132 255 / var(--tw-ring-opacity));\n}\n';
+var styles = `.tina-tailwind {
+  line-height: 1.5;
+  -webkit-text-size-adjust: 100%;
+  -moz-tab-size: 4;
+  tab-size: 4;
+}
+
+  .tina-tailwind *,
+  .tina-tailwind ::before,
+  .tina-tailwind ::after {
+    box-sizing: border-box;
+    border-width: 0;
+    border-style: solid;
+    border-color: transparent;
+  }
+
+  .tina-tailwind ::before,
+  .tina-tailwind ::after {
+    --tw-content: '';
+  }
+
+  .tina-tailwind hr {
+    height: 0; /* 1 */
+    color: inherit; /* 2 */
+    border-top-width: 1px; /* 3 */
+  }
+
+  .tina-tailwind abbr:where([title]) {
+    text-decoration: underline dotted;
+  }
+
+  .tina-tailwind h1,
+  .tina-tailwind h2,
+  .tina-tailwind h3,
+  .tina-tailwind h4,
+  .tina-tailwind h5,
+  .tina-tailwind h6 {
+    font-size: inherit;
+    font-weight: inherit;
+  }
+
+  .tina-tailwind a {
+    color: inherit;
+    text-decoration: inherit;
+  }
+
+  .tina-tailwind b,
+  .tina-tailwind strong {
+    font-weight: bolder;
+  }
+
+  .tina-tailwind code,
+  .tina-tailwind kbd,
+  .tina-tailwind samp,
+  .tina-tailwind pre {
+    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
+    font-size: 1em; /* 2 */
+  }
+
+  .tina-tailwind small {
+    font-size: 80%;
+  }
+
+  .tina-tailwind sub,
+  .tina-tailwind sup {
+    font-size: 75%;
+    line-height: 0;
+    position: relative;
+    vertical-align: baseline;
+  }
+
+  .tina-tailwind sub {
+    bottom: -0.25em;
+  }
+
+  .tina-tailwind sup {
+    top: -0.5em;
+  }
+
+  .tina-tailwind table {
+    text-indent: 0; /* 1 */
+    border-color: inherit; /* 2 */
+    border-collapse: collapse; /* 3 */
+  }
+
+  .tina-tailwind button,
+  .tina-tailwind input,
+  .tina-tailwind optgroup,
+  .tina-tailwind select,
+  .tina-tailwind textarea {
+    font-family: inherit; /* 1 */
+    font-size: 100%; /* 1 */
+    line-height: inherit; /* 1 */
+    color: inherit; /* 1 */
+    margin: 0; /* 2 */
+    padding: 0; /* 3 */
+  }
+
+  .tina-tailwind button,
+  .tina-tailwind select {
+    text-transform: none;
+  }
+
+  .tina-tailwind button,
+  .tina-tailwind [type='button'],
+  .tina-tailwind [type='reset'],
+  .tina-tailwind [type='submit'] {
+    -webkit-appearance: button; /* 1 */
+    background-color: transparent; /* 2 */
+    background-image: none; /* 2 */
+  }
+
+  .tina-tailwind :-moz-focusring {
+    outline: auto;
+  }
+
+  .tina-tailwind :-moz-ui-invalid {
+    box-shadow: none;
+  }
+
+  .tina-tailwind progress {
+    vertical-align: baseline;
+  }
+
+  .tina-tailwind ::-webkit-inner-spin-button,
+  .tina-tailwind ::-webkit-outer-spin-button {
+    height: auto;
+  }
+
+  .tina-tailwind [type='search'] {
+    -webkit-appearance: textfield; /* 1 */
+    outline-offset: -2px; /* 2 */
+  }
+
+  .tina-tailwind ::-webkit-search-decoration {
+    -webkit-appearance: none;
+  }
+
+  .tina-tailwind ::-webkit-file-upload-button {
+    -webkit-appearance: button; /* 1 */
+    font: inherit; /* 2 */
+  }
+
+  .tina-tailwind summary {
+    display: list-item;
+  }
+
+  .tina-tailwind blockquote,
+  .tina-tailwind dl,
+  .tina-tailwind dd,
+  .tina-tailwind h1,
+  .tina-tailwind h2,
+  .tina-tailwind h3,
+  .tina-tailwind h4,
+  .tina-tailwind h5,
+  .tina-tailwind h6,
+  .tina-tailwind hr,
+  .tina-tailwind figure,
+  .tina-tailwind p,
+  .tina-tailwind pre {
+    margin: 0;
+  }
+
+  .tina-tailwind fieldset {
+    margin: 0;
+    padding: 0;
+  }
+
+  .tina-tailwind legend {
+    padding: 0;
+  }
+
+  .tina-tailwind ol,
+  .tina-tailwind ul,
+  .tina-tailwind menu {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  .tina-tailwind li:before {
+    display: none;
+  }
+
+  .tina-tailwind textarea {
+    resize: vertical;
+  }
+
+  .tina-tailwind input::placeholder,
+  .tina-tailwind textarea::placeholder {
+    opacity: 1; /* 1 */
+    color: #918c9e; /* 2 */
+  }
+
+  .tina-tailwind button,
+  .tina-tailwind [role='button'] {
+    cursor: pointer;
+  }
+
+  .tina-tailwind :disabled {
+    cursor: default;
+  }
+
+  .tina-tailwind img,
+  .tina-tailwind svg,
+  .tina-tailwind video,
+  .tina-tailwind canvas,
+  .tina-tailwind audio,
+  .tina-tailwind iframe,
+  .tina-tailwind embed,
+  .tina-tailwind object {
+    display: block; /* 1 */
+    vertical-align: middle; /* 2 */
+  }
+
+  .tina-tailwind img,
+  .tina-tailwind video {
+    max-width: 100%;
+    height: auto;
+  }
+
+  .tina-tailwind [hidden] {
+    display: none;
+  }
+*, ::before, ::after {
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(0 132 255 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+.tina-tailwind .pointer-events-auto {
+  pointer-events: auto;
+}
+.tina-tailwind .static {
+  position: static;
+}
+.tina-tailwind .fixed {
+  position: fixed;
+}
+.tina-tailwind .absolute {
+  position: absolute;
+}
+.tina-tailwind .relative {
+  position: relative;
+}
+.tina-tailwind .inset-0 {
+  top: 0px;
+  right: 0px;
+  bottom: 0px;
+  left: 0px;
+}
+.tina-tailwind .left-0 {
+  left: 0px;
+}
+.tina-tailwind .top-0 {
+  top: 0px;
+}
+.tina-tailwind .top-8 {
+  top: 32px;
+}
+.tina-tailwind .right-0 {
+  right: 0px;
+}
+.tina-tailwind .top-10 {
+  top: 40px;
+}
+.tina-tailwind .top-4 {
+  top: 16px;
+}
+.tina-tailwind .z-overlay {
+  z-index: 10600;
+}
+.tina-tailwind .z-menu {
+  z-index: 9800;
+}
+.tina-tailwind .z-50 {
+  z-index: 50;
+}
+.tina-tailwind .mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
+.tina-tailwind .-ml-px {
+  margin-left: -1px;
+}
+.tina-tailwind .mr-2 {
+  margin-right: 8px;
+}
+.tina-tailwind .mb-2 {
+  margin-bottom: 8px;
+}
+.tina-tailwind .mb-1 {
+  margin-bottom: 4px;
+}
+.tina-tailwind .-mt-0\\.5 {
+  margin-top: -2px;
+}
+.tina-tailwind .-mt-0 {
+  margin-top: -0px;
+}
+.tina-tailwind .ml-1 {
+  margin-left: 4px;
+}
+.tina-tailwind .mt-2 {
+  margin-top: 8px;
+}
+.tina-tailwind .mr-1\\.5 {
+  margin-right: 6px;
+}
+.tina-tailwind .mr-1 {
+  margin-right: 4px;
+}
+.tina-tailwind .block {
+  display: block;
+}
+.tina-tailwind .inline-block {
+  display: inline-block;
+}
+.tina-tailwind .inline {
+  display: inline;
+}
+.tina-tailwind .flex {
+  display: flex;
+}
+.tina-tailwind .inline-flex {
+  display: inline-flex;
+}
+.tina-tailwind .table {
+  display: table;
+}
+.tina-tailwind .h-screen {
+  height: 100vh;
+}
+.tina-tailwind .h-auto {
+  height: auto;
+}
+.tina-tailwind .h-full {
+  height: 100%;
+}
+.tina-tailwind .h-6 {
+  height: 24px;
+}
+.tina-tailwind .h-7 {
+  height: 28px;
+}
+.tina-tailwind .h-10 {
+  height: 40px;
+}
+.tina-tailwind .h-5 {
+  height: 20px;
+}
+.tina-tailwind .h-12 {
+  height: 48px;
+}
+.tina-tailwind .w-full {
+  width: 100%;
+}
+.tina-tailwind .w-10 {
+  width: 40px;
+}
+.tina-tailwind .w-auto {
+  width: auto;
+}
+.tina-tailwind .w-5 {
+  width: 20px;
+}
+.tina-tailwind .w-56 {
+  width: 224px;
+}
+.tina-tailwind .w-0 {
+  width: 0px;
+}
+.tina-tailwind .w-6 {
+  width: 24px;
+}
+.tina-tailwind .max-w-lg {
+  max-width: 32rem;
+}
+.tina-tailwind .max-w-screen-xl {
+  max-width: 1280px;
+}
+.tina-tailwind .max-w-form {
+  max-width: 900px;
+}
+.tina-tailwind .max-w-full {
+  max-width: 100%;
+}
+.tina-tailwind .flex-1 {
+  flex: 1 1 0%;
+}
+.tina-tailwind .flex-shrink-0 {
+  flex-shrink: 0;
+}
+.tina-tailwind .flex-grow-0 {
+  flex-grow: 0;
+}
+.tina-tailwind .table-auto {
+  table-layout: auto;
+}
+.tina-tailwind .origin-top-right {
+  transform-origin: top right;
+}
+.tina-tailwind .-translate-x-full {
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.tina-tailwind .translate-x-0 {
+  --tw-translate-x: 0px;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.tina-tailwind .translate-x-full {
+  --tw-translate-x: 100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.tina-tailwind .scale-95 {
+  --tw-scale-x: .95;
+  --tw-scale-y: .95;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.tina-tailwind .scale-100 {
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.tina-tailwind .transform {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+.tina-tailwind .cursor-pointer {
+  cursor: pointer;
+}
+.tina-tailwind .flex-col {
+  flex-direction: column;
+}
+.tina-tailwind .items-end {
+  align-items: flex-end;
+}
+.tina-tailwind .items-center {
+  align-items: center;
+}
+.tina-tailwind .items-stretch {
+  align-items: stretch;
+}
+.tina-tailwind .justify-end {
+  justify-content: flex-end;
+}
+.tina-tailwind .justify-center {
+  justify-content: center;
+}
+.tina-tailwind .justify-between {
+  justify-content: space-between;
+}
+.tina-tailwind .gap-0\\.5 {
+  gap: 2px;
+}
+.tina-tailwind .gap-0 {
+  gap: 0px;
+}
+.tina-tailwind .gap-4 {
+  gap: 16px;
+}
+.tina-tailwind .gap-3 {
+  gap: 12px;
+}
+.tina-tailwind .divide-y > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-y-reverse: 0;
+  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
+  border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
+}
+.tina-tailwind .divide-gray-150 > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-opacity: 1;
+  border-color: rgb(230 227 239 / var(--tw-divide-opacity));
+}
+.tina-tailwind .overflow-hidden {
+  overflow: hidden;
+}
+.tina-tailwind .overflow-y-auto {
+  overflow-y: auto;
+}
+.tina-tailwind .whitespace-nowrap {
+  white-space: nowrap;
+}
+.tina-tailwind .rounded-lg {
+  border-radius: 8px;
+}
+.tina-tailwind .rounded {
+  border-radius: 4px;
+}
+.tina-tailwind .rounded-full {
+  border-radius: 9999px;
+}
+.tina-tailwind .rounded-md {
+  border-radius: 6px;
+}
+.tina-tailwind .rounded-r-md {
+  border-top-right-radius: 6px;
+  border-bottom-right-radius: 6px;
+}
+.tina-tailwind .border {
+  border-width: 1px;
+}
+.tina-tailwind .border-b {
+  border-bottom-width: 1px;
+}
+.tina-tailwind .border-gray-150 {
+  --tw-border-opacity: 1;
+  border-color: rgb(230 227 239 / var(--tw-border-opacity));
+}
+.tina-tailwind .border-gray-200 {
+  --tw-border-opacity: 1;
+  border-color: rgb(225 221 236 / var(--tw-border-opacity));
+}
+.tina-tailwind .bg-white {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}
+.tina-tailwind .bg-gray-50 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(246 246 249 / var(--tw-bg-opacity));
+}
+.tina-tailwind .bg-blue-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(0 132 255 / var(--tw-bg-opacity));
+}
+.tina-tailwind .bg-gradient-to-b {
+  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
+}
+.tina-tailwind .bg-gradient-to-br {
+  background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
+}
+.tina-tailwind .from-blue-900 {
+  --tw-gradient-from: #1D2C6C;
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(29 44 108 / 0));
+}
+.tina-tailwind .from-gray-800 {
+  --tw-gradient-from: #363145;
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(54 49 69 / 0));
+}
+.tina-tailwind .via-gray-900 {
+  --tw-gradient-stops: var(--tw-gradient-from), #252336, var(--tw-gradient-to, rgb(37 35 54 / 0));
+}
+.tina-tailwind .to-gray-900 {
+  --tw-gradient-to: #252336;
+}
+.tina-tailwind .to-black {
+  --tw-gradient-to: #000;
+}
+.tina-tailwind .px-4 {
+  padding-left: 16px;
+  padding-right: 16px;
+}
+.tina-tailwind .py-6 {
+  padding-top: 24px;
+  padding-bottom: 24px;
+}
+.tina-tailwind .px-5 {
+  padding-left: 20px;
+  padding-right: 20px;
+}
+.tina-tailwind .py-4 {
+  padding-top: 16px;
+  padding-bottom: 16px;
+}
+.tina-tailwind .px-12 {
+  padding-left: 48px;
+  padding-right: 48px;
+}
+.tina-tailwind .py-10 {
+  padding-top: 40px;
+  padding-bottom: 40px;
+}
+.tina-tailwind .px-20 {
+  padding-left: 80px;
+  padding-right: 80px;
+}
+.tina-tailwind .px-6 {
+  padding-left: 24px;
+  padding-right: 24px;
+}
+.tina-tailwind .py-1 {
+  padding-top: 4px;
+  padding-bottom: 4px;
+}
+.tina-tailwind .py-2 {
+  padding-top: 8px;
+  padding-bottom: 8px;
+}
+.tina-tailwind .py-5 {
+  padding-top: 20px;
+  padding-bottom: 20px;
+}
+.tina-tailwind .pt-4 {
+  padding-top: 16px;
+}
+.tina-tailwind .pb-4 {
+  padding-bottom: 16px;
+}
+.tina-tailwind .pt-18 {
+  padding-top: 72px;
+}
+.tina-tailwind .pt-3 {
+  padding-top: 12px;
+}
+.tina-tailwind .pl-18 {
+  padding-left: 72px;
+}
+.tina-tailwind .text-left {
+  text-align: left;
+}
+.tina-tailwind .text-center {
+  text-align: center;
+}
+.tina-tailwind .font-sans {
+  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+.tina-tailwind .text-2xl {
+  font-size: 24px;
+  line-height: 1.33;
+}
+.tina-tailwind .text-base {
+  font-size: 16px;
+  line-height: 1.5;
+}
+.tina-tailwind .text-sm {
+  font-size: 14px;
+  line-height: 1.43;
+}
+.tina-tailwind .text-xl {
+  font-size: 20px;
+  line-height: 1.4;
+}
+.tina-tailwind .text-md {
+  font-size: 16px;
+  line-height: 1.5;
+}
+.tina-tailwind .text-xs {
+  font-size: 13px;
+  line-height: 1.33;
+}
+.tina-tailwind .font-medium {
+  font-weight: 500;
+}
+.tina-tailwind .uppercase {
+  text-transform: uppercase;
+}
+.tina-tailwind .italic {
+  font-style: italic;
+}
+.tina-tailwind .leading-normal {
+  line-height: 1.5;
+}
+.tina-tailwind .leading-tight {
+  line-height: 1.25;
+}
+.tina-tailwind .leading-5 {
+  line-height: 20px;
+}
+.tina-tailwind .tracking-wide {
+  letter-spacing: 0.025em;
+}
+.tina-tailwind .text-gray-600 {
+  --tw-text-opacity: 1;
+  color: rgb(86 81 101 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-gray-700 {
+  --tw-text-opacity: 1;
+  color: rgb(67 62 82 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-blue-600 {
+  --tw-text-opacity: 1;
+  color: rgb(5 116 228 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-gray-500 {
+  --tw-text-opacity: 1;
+  color: rgb(113 108 127 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-gray-400 {
+  --tw-text-opacity: 1;
+  color: rgb(145 140 158 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-current {
+  color: currentColor;
+}
+.tina-tailwind .text-white {
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-gray-800 {
+  --tw-text-opacity: 1;
+  color: rgb(54 49 69 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-gray-900 {
+  --tw-text-opacity: 1;
+  color: rgb(37 35 54 / var(--tw-text-opacity));
+}
+.tina-tailwind .text-red-500 {
+  --tw-text-opacity: 1;
+  color: rgb(239 68 68 / var(--tw-text-opacity));
+}
+.tina-tailwind .underline {
+  text-decoration-line: underline;
+}
+.tina-tailwind .opacity-100 {
+  opacity: 1;
+}
+.tina-tailwind .opacity-0 {
+  opacity: 0;
+}
+.tina-tailwind .opacity-80 {
+  opacity: .8;
+}
+.tina-tailwind .opacity-90 {
+  opacity: .9;
+}
+.tina-tailwind .opacity-50 {
+  opacity: .5;
+}
+.tina-tailwind .opacity-70 {
+  opacity: .7;
+}
+.tina-tailwind .shadow-lg {
+  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.tina-tailwind .shadow-2xl {
+  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
+  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.tina-tailwind .shadow {
+  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.tina-tailwind .ring-1 {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.tina-tailwind .ring-black {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));
+}
+.tina-tailwind .ring-opacity-5 {
+  --tw-ring-opacity: .05;
+}
+.tina-tailwind .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);
+}
+.tina-tailwind .transition-opacity {
+  transition-property: opacity;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+.tina-tailwind .transition-all {
+  transition-property: all;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+.tina-tailwind .transition-colors {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+.tina-tailwind .transition {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+.tina-tailwind .duration-300 {
+  transition-duration: 300ms;
+}
+.tina-tailwind .duration-200 {
+  transition-duration: 200ms;
+}
+.tina-tailwind .duration-150 {
+  transition-duration: 150ms;
+}
+.tina-tailwind .duration-100 {
+  transition-duration: 100ms;
+}
+.tina-tailwind .duration-75 {
+  transition-duration: 75ms;
+}
+.tina-tailwind .ease-out {
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
+}
+.tina-tailwind .ease-in {
+  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
+}
+.tina-tailwind .icon-parent svg {
+      fill: currentColor;
+    }
+.tina-tailwind {
+  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  font-size: 16px;
+  line-height: 1.5;
+  --tw-text-opacity: 1;
+  color: rgb(86 81 101 / var(--tw-text-opacity));
+}
+.tina-tailwind .hover\\:bg-blue-600:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(5 116 228 / var(--tw-bg-opacity));
+}
+.tina-tailwind .hover\\:text-blue-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(5 116 228 / var(--tw-text-opacity));
+}
+.tina-tailwind .hover\\:text-blue-400:hover {
+  --tw-text-opacity: 1;
+  color: rgb(34 150 254 / var(--tw-text-opacity));
+}
+.tina-tailwind .hover\\:opacity-100:hover {
+  opacity: 1;
+}
+.tina-tailwind .focus\\:text-blue-400:focus {
+  --tw-text-opacity: 1;
+  color: rgb(34 150 254 / var(--tw-text-opacity));
+}
+.tina-tailwind .focus\\:underline:focus {
+  text-decoration-line: underline;
+}
+.tina-tailwind .focus\\:shadow-outline:focus {
+  --tw-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);
+  --tw-shadow-colored: 0 0 0 3px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+.tina-tailwind .focus\\:outline-none:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+.tina-tailwind .focus\\:ring-2:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+.tina-tailwind .focus\\:ring-blue-500:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(0 132 255 / var(--tw-ring-opacity));
+}
+`;
 class ContentCreatorPlugin {
   constructor(options) {
     this.__type = "content-creator";
@@ -3551,7 +4436,7 @@ const AuthTemplate = ({
   }, /* @__PURE__ */ React__default.createElement("div", {
     className: "px-5 py-4 border-b border-gray-150"
   }, /* @__PURE__ */ React__default.createElement("h2", {
-    className: "text-2xl tracking-wide text-gray-700 flex items-center gap-0.5"
+    className: "text-2xl font-sans tracking-wide text-gray-700 flex items-center gap-0.5"
   }, /* @__PURE__ */ React__default.createElement("svg", {
     viewBox: "0 0 32 32",
     fill: "#EC4815",
@@ -3654,7 +4539,7 @@ const DashboardPage = () => {
     return /* @__PURE__ */ React__default.createElement(PageWrapper, null, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(PageHeader, {
       isLocalMode: (_b = (_a = cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode
     }, /* @__PURE__ */ React__default.createElement("h3", {
-      className: "text-2xl text-gray-700"
+      className: "text-2xl font-sans text-gray-700"
     }, "Welcome to Tina!")), /* @__PURE__ */ React__default.createElement(PageBodyNarrow, null, "This is your dashboard for editing or creating content. Select a collection on the left to begin.")));
   });
 };
@@ -3891,7 +4776,7 @@ const Button = (_g) => {
     "children",
     "className"
   ]);
-  const baseClasses = "icon-parent inline-flex items-center font-medium focus:outline-none focus:ring-2 focus:shadow-outline text-center inline-flex justify-center transition-all duration-150 ease-out ";
+  const baseClasses = "icon-parent border-0 inline-flex items-center font-medium focus:outline-none focus:ring-2 focus:shadow-outline text-center inline-flex justify-center transition-all duration-150 ease-out ";
   const variantClasses = {
     primary: `shadow text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-500`,
     secondary: `shadow text-gray-500 hover:text-blue-500 bg-gray-50 hover:bg-white border border-gray-200`,
@@ -4025,7 +4910,7 @@ const CollectionListPage = () => {
       }), /* @__PURE__ */ React__default.createElement(PageHeader, {
         isLocalMode: (_b = (_a = cms == null ? void 0 : cms.api) == null ? void 0 : _a.tina) == null ? void 0 : _b.isLocalMode
       }, /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("h3", {
-        className: "text-2xl text-gray-700"
+        className: "font-sans text-2xl text-gray-700"
       }, collection.label ? collection.label : collection.name), !collection.templates && /* @__PURE__ */ React__default.createElement(Link, {
         to: `new`,
         className: "icon-parent inline-flex items-center font-medium focus:outline-none focus:ring-2 focus:shadow-outline text-center rounded-full justify-center transition-all duration-150 ease-out  shadow text-white bg-blue-500 hover:bg-blue-600 focus:ring-blue-500 text-sm h-10 px-6"
@@ -4090,7 +4975,7 @@ const CollectionListPage = () => {
                 size: "1.3rem"
               }),
               onMouseDown: () => {
-                navigate(`${document.node._sys.filename}`, { replace: true });
+                navigate(`${document.node._sys.breadcrumbs.join("/")}`, { replace: true });
               }
             },
             {
@@ -4103,7 +4988,7 @@ const CollectionListPage = () => {
               onMouseDown: () => {
                 setVars({
                   collection: collectionName,
-                  relativePath: document.node._sys.filename + document.node._sys.extension
+                  relativePath: document.node._sys.breadcrumbs.join("/") + document.node._sys.extension
                 });
                 setOpen(true);
               }
@@ -4134,7 +5019,7 @@ const CollectionListPage = () => {
   });
 };
 const DeleteModal = ({ close: close2, deleteFunc, filename }) => {
-  return /* @__PURE__ */ React__default.createElement(Modal, null, /* @__PURE__ */ React__default.createElement(ModalPopup, null, /* @__PURE__ */ React__default.createElement(ModalHeader, {
+  return /* @__PURE__ */ React__default.createElement(Modal, null, /* @__PURE__ */ React__default.createElement(PopupModal, null, /* @__PURE__ */ React__default.createElement(ModalHeader, {
     close: close2
   }, "Delete ", filename), /* @__PURE__ */ React__default.createElement(ModalBody, {
     padded: true