/* assets/app-Bt9De1Kc.css */
*,:before,:after{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(111 51 176 / .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-drop-shadow:}
::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgb(111 51 176 / .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-drop-shadow:}
*,:before,:after{border-width:0;border-style:solid;border-color:#e7e6ee}
html,:host{-webkit-tap-highlight-color:transparent}
hr{color:inherit;border-top-width:1px}
abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}
a{color:inherit;text-decoration:inherit}
table{border-color:inherit;border-collapse:collapse}
button,input,optgroup,select,textarea{color:inherit}
button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){background-color:transparent;background-image:none}
:-moz-focusring{outline:auto}
:-moz-ui-invalid{box-shadow:none}
[type=search]{outline-offset:-2px}
input::-moz-placeholder,textarea::-moz-placeholder{color:#a39fb4}
input::placeholder,textarea::placeholder{color:#a39fb4}
.label-active{border-radius:10px;background-color:rgb(144 213 185 / var(--tw-bg-opacity, 1));color:rgb(12 60 42 / var(--tw-text-opacity, 1))}
.label-inactive{border-radius:10px;background-color:rgb(254 202 202 / var(--tw-bg-opacity, 1));color:rgb(153 27 27 / var(--tw-text-opacity, 1))}
[dir=ltr] .sidebar-rounded:after{background-image:url(corner-clip-DsfWoKt7.svg);background-repeat:no-repeat}
[dir=rtl] .sidebar-rounded:before{background-image:url(corner-clip-DsfWoKt7.svg);background-repeat:no-repeat}
.dark .sidebar-rounded:after{background-image:url(dark-corner-clip-Deux0RQO.svg)}
.dark .sidebar-rounded:before{background-image:url(dark-corner-clip-Deux0RQO.svg)}
.stage:after{border-radius:0 0 0 25px;border-right:4px solid #f4f3f7;border-top:4px solid #f4f3f7}
.dark .stage:after{border-radius:0 0 0 25px;border-right:4px solid #07060f;border-top:4px solid #07060f}
[dir=rtl] .stage:before{border-radius:0 0 0 25px;border-right:4px solid #f4f3f7;border-top:4px solid #f4f3f7}
.dark\:bg-gray-400:is(.dark *){background-color:#28253d!important;border:#181528 solid!important;color:#e7e6ee!important}
.dark\:bg-gray-800:is(.dark *){background-color:#181528}
.shimmer{animation-fill-mode:forwards;background:linear-gradient(to right,#f6f5f9 8%,#f0eff4 18%,#f6f5f9 33%);background-size:1250px 100%}
.light-shimmer-bg{background:linear-gradient(to right,#fafafc 8%,#f5f4f8 18%,#fafafc 33%);background-size:1250px 100%}
.dark .shimmer{background:linear-gradient(to right,#28253d 8%,#221f35 18%,#28253d 33%)}
.primary-button{border-radius:10px;border-width:1px;border-color:var(--brand-color);background-color:var(--brand-color);color:rgb(250 249 252 / var(--tw-text-opacity, 1))}
.secondary-button{border-radius:10px;border-width:2px;border-color:var(--brand-color);background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));color:var(--brand-color)}
.secondary-button:hover{background-color:#f4eefb61}
.secondary-button:focus{background-color:#f4eefb61}
.secondary-button:is(.dark *){--tw-border-opacity:1;border-color:rgb(163 159 180 / var(--tw-border-opacity, 1));background-color:rgb(40 37 61 / var(--tw-bg-opacity, 1));color:rgb(255 255 255 / var(--tw-text-opacity, 1))}
.transparent-button{border-radius:10px;border-width:2px;border-color:transparent;color:rgb(84 80 105 / var(--tw-text-opacity, 1))}
.transparent-button *::marker{--tw-shadow:0 1px 3px 0 rgb(26 23 43 / .1), 0 1px 2px -1px rgb(26 23 43 / .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)}
.transparent-button::marker{--tw-shadow:0 1px 3px 0 rgb(26 23 43 / .1), 0 1px 2px -1px rgb(26 23 43 / .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)}
.transparent-button:hover{background-color:rgb(244 243 247 / var(--tw-bg-opacity, 1))}
.transparent-button:focus{background-color:rgb(244 243 247 / var(--tw-bg-opacity, 1))}
.transparent-button:hover:is(.dark *){background-color:rgb(7 6 15 / var(--tw-bg-opacity, 1))}
.transparent-button:focus:is(.dark *){background-color:rgb(7 6 15 / var(--tw-bg-opacity, 1))}
::-webkit-scrollbar-track{background:#f1f0f5}
::-webkit-scrollbar-thumb{background:#89859c;border-radius:6px}
::-webkit-scrollbar-thumb:hover{background:#55516b}
*{scrollbar-color:#89859c #f1f0f5}
::-moz-selection{background-color:#4b257433}
::selection{background-color:#4b257433}
body{background-color:rgb(244 243 247 / var(--tw-bg-opacity, 1));color:rgb(40 37 61 / var(--tw-text-opacity, 1))}
.draggable-ghost{background:#e5d6f5}
html.dark [class^=icon-],html.dark [class*=" icon-"]{color:#d5d3df}
input,textarea,select{outline:2px solid transparent;outline-offset:2px}
.journal-scroll::-webkit-scrollbar-track{background-color:#fff;border-radius:12px;border:1px solid #e9e8ef}
.journal-scroll::-webkit-scrollbar-thumb{background-color:#e9e8ef;border-radius:12px;border:3px solid transparent;background-clip:content-box}
.custom-select{background:transparent;background-image:url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");background-repeat:no-repeat;background-position-x:calc(100% - 10px);background-position-y:50%}
.dark .custom-select{background-image:url("data:image/svg+xml;utf8,<svg fill='white' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>")}
[dir=rtl] .custom-select{background-position-x:calc(100% - (100% - 10px))}
.draggable-ghost{border-width:1px;border-style:dashed;--tw-border-opacity:1 !important;border-color:rgb(213 211 223 / var(--tw-border-opacity, 1))!important}
body.is-scrolling-down .scroll-reactive-sticky{border-radius:0;border-right:none!important}
.sr-only{border-width:0}
.border-collapse{border-collapse:collapse}
.divide-y>:not([hidden])~:not([hidden]){border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))}
.divide-gray-100>:not([hidden])~:not([hidden]){border-color:rgb(244 243 247 / var(--tw-divide-opacity, 1))}
.divide-slate-200>:not([hidden])~:not([hidden]){border-color:rgb(232 230 238 / var(--tw-divide-opacity, 1))}
.\!rounded-lg{border-radius:14px!important}
.\!rounded-none{border-radius:0!important}
.rounded{border-radius:6px}
.rounded-2xl{border-radius:1rem}
.rounded-3xl{border-radius:1.5rem}
.rounded-full{border-radius:9999px}
.rounded-lg{border-radius:14px}
.rounded-md{border-radius:10px}
.rounded-none{border-radius:0}
.rounded-sm{border-radius:.125rem}
.rounded-xl{border-radius:20px}
.\!rounded-l-none{border-top-left-radius:0!important;border-bottom-left-radius:0!important}
.\!rounded-r-none{border-top-right-radius:0!important;border-bottom-right-radius:0!important}
.rounded-b-lg{border-bottom-right-radius:14px;border-bottom-left-radius:14px}
.rounded-l-none{border-top-left-radius:0;border-bottom-left-radius:0}
.rounded-r-lg{border-top-right-radius:14px;border-bottom-right-radius:14px}
.rounded-r-none{border-top-right-radius:0;border-bottom-right-radius:0}
.rounded-t{border-top-left-radius:6px;border-top-right-radius:6px}
.rounded-t-lg{border-top-left-radius:14px;border-top-right-radius:14px}
.border{border-width:1px}
.border-x-0{border-left-width:0px;border-right-width:0px}
.border-y{border-top-width:1px;border-bottom-width:1px}
.\!border-b-0{border-bottom-width:0px!important}
.border-b{border-bottom-width:1px}
.border-b-0{border-bottom-width:0px}
.border-b-2{border-bottom-width:2px}
.border-l{border-left-width:1px}
.border-l-2{border-left-width:2px}
.border-t{border-top-width:1px}
.border-t-0{border-top-width:0px}
.border-t-2{border-top-width:2px}
.border-solid{border-style:solid}
.border-dashed{border-style:dashed}
.\!border-none{border-style:none!important}
.\!border-red-600{--tw-border-opacity:1 !important;border-color:rgb(220 38 38 / var(--tw-border-opacity, 1))!important}
.border-blue-200{--tw-border-opacity:1;border-color:rgb(203 176 234 / var(--tw-border-opacity, 1))}
.border-blue-600{--tw-border-opacity:1;border-color:rgb(91 45 140 / var(--tw-border-opacity, 1))}
.border-brandColor{border-color:var(--brand-color)}
.border-gray-100{--tw-border-opacity:1;border-color:rgb(244 243 247 / var(--tw-border-opacity, 1))}
.border-gray-200{--tw-border-opacity:1;border-color:rgb(231 230 238 / var(--tw-border-opacity, 1))}
.border-gray-300{--tw-border-opacity:1;border-color:rgb(213 211 223 / var(--tw-border-opacity, 1))}
.border-gray-400{--tw-border-opacity:1;border-color:rgb(163 159 180 / var(--tw-border-opacity, 1))}
.border-gray-500{--tw-border-opacity:1;border-color:rgb(114 110 135 / var(--tw-border-opacity, 1))}
.border-gray-800{--tw-border-opacity:1;border-color:rgb(40 37 61 / var(--tw-border-opacity, 1))}
.border-green-200{--tw-border-opacity:1;border-color:rgb(163 224 200 / var(--tw-border-opacity, 1))}
.border-orange-200{--tw-border-opacity:1;border-color:rgb(254 215 170 / var(--tw-border-opacity, 1))}
.border-red-200{--tw-border-opacity:1;border-color:rgb(254 202 202 / var(--tw-border-opacity, 1))}
.border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68 / var(--tw-border-opacity, 1))}
.border-slate-300{--tw-border-opacity:1;border-color:rgb(212 210 222 / var(--tw-border-opacity, 1))}
.border-transparent{border-color:transparent}
.border-b-gray-300{--tw-border-opacity:1;border-bottom-color:rgb(213 211 223 / var(--tw-border-opacity, 1))}
.border-l-brandColor{border-left-color:var(--brand-color)}
.\!bg-green-500{background-color:rgb(42 161 114 / var(--tw-bg-opacity, 1))!important}
.\!bg-red-500{background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))!important}
.bg-\[\#63CFE5\]{background-color:rgb(99 207 229 / var(--tw-bg-opacity, 1))}
.bg-\[\#8979FF\]{background-color:rgb(137 121 255 / var(--tw-bg-opacity, 1))}
.bg-\[\#FFA8A1\]{background-color:rgb(255 168 161 / var(--tw-bg-opacity, 1))}
.bg-black{background-color:rgb(26 23 43 / var(--tw-bg-opacity, 1))}
.bg-blue-100{background-color:rgb(230 216 245 / var(--tw-bg-opacity, 1))}
.bg-blue-200{background-color:rgb(203 176 234 / var(--tw-bg-opacity, 1))}
.bg-blue-50{background-color:rgb(244 238 251 / var(--tw-bg-opacity, 1))}
.bg-brandColor{background-color:var(--brand-color)}
.bg-cyan-200{background-color:rgb(165 243 252 / var(--tw-bg-opacity, 1))}
.bg-gray-100{background-color:rgb(244 243 247 / var(--tw-bg-opacity, 1))}
.bg-gray-200{background-color:rgb(231 230 238 / var(--tw-bg-opacity, 1))}
.bg-gray-300{background-color:rgb(213 211 223 / var(--tw-bg-opacity, 1))}
.bg-gray-50{background-color:rgb(250 249 252 / var(--tw-bg-opacity, 1))}
.bg-gray-500{background-color:rgb(114 110 135 / var(--tw-bg-opacity, 1))}
.bg-gray-600{background-color:rgb(84 80 105 / var(--tw-bg-opacity, 1))}
.bg-gray-800{background-color:rgb(40 37 61 / var(--tw-bg-opacity, 1))}
.bg-gray-900{background-color:rgb(24 21 40 / var(--tw-bg-opacity, 1))}
.bg-gray-950{background-color:rgb(7 6 15 / var(--tw-bg-opacity, 1))}
.bg-green-100{background-color:rgb(205 238 224 / var(--tw-bg-opacity, 1))}
.bg-green-200{background-color:rgb(163 224 200 / var(--tw-bg-opacity, 1))}
.bg-green-50{background-color:rgb(233 247 241 / var(--tw-bg-opacity, 1))}
.bg-green-500{background-color:rgb(42 161 114 / var(--tw-bg-opacity, 1))}
.bg-green-600{background-color:rgb(31 138 96 / var(--tw-bg-opacity, 1))}
.bg-lime-200{background-color:rgb(217 249 157 / var(--tw-bg-opacity, 1))}
.bg-neutral-100{background-color:rgb(245 244 248 / var(--tw-bg-opacity, 1))}
.bg-orange-100{background-color:rgb(255 237 213 / var(--tw-bg-opacity, 1))}
.bg-orange-200{background-color:rgb(254 215 170 / var(--tw-bg-opacity, 1))}
.bg-orange-50{background-color:rgb(255 247 237 / var(--tw-bg-opacity, 1))}
.bg-pink-200{background-color:rgb(251 207 232 / var(--tw-bg-opacity, 1))}
.bg-pink-400{background-color:rgb(244 114 182 / var(--tw-bg-opacity, 1))}
.bg-purple-100{background-color:rgb(243 232 255 / var(--tw-bg-opacity, 1))}
.bg-red-100{background-color:rgb(254 226 226 / var(--tw-bg-opacity, 1))}
.bg-red-200{background-color:rgb(254 202 202 / var(--tw-bg-opacity, 1))}
.bg-red-50{background-color:rgb(254 242 242 / var(--tw-bg-opacity, 1))}
.bg-red-500{background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))}
.bg-rose-100{background-color:rgb(255 228 230 / var(--tw-bg-opacity, 1))}
.bg-sky-100{background-color:rgb(237 227 248 / var(--tw-bg-opacity, 1))}
.bg-sky-600{background-color:rgb(102 48 159 / var(--tw-bg-opacity, 1))}
.bg-slate-100{background-color:rgb(245 244 248 / var(--tw-bg-opacity, 1))}
.bg-slate-200{background-color:rgb(232 230 238 / var(--tw-bg-opacity, 1))}
.bg-transparent{background-color:transparent}
.bg-violet-50{background-color:rgb(245 243 255 / var(--tw-bg-opacity, 1))}
.bg-white{background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}
.bg-white\/20{background-color:#fff3}
.bg-yellow-200{background-color:rgb(254 240 138 / var(--tw-bg-opacity, 1))}
.bg-yellow-400{background-color:rgb(250 204 21 / var(--tw-bg-opacity, 1))}
.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}
.\!text-brandColor{color:var(--brand-color)!important}
.\!text-gray-500{color:rgb(114 110 135 / var(--tw-text-opacity, 1))!important}
.\!text-gray-600{color:rgb(84 80 105 / var(--tw-text-opacity, 1))!important}
.text-black{color:rgb(26 23 43 / var(--tw-text-opacity, 1))}
.text-blue-600{color:rgb(91 45 140 / var(--tw-text-opacity, 1))}
.text-blue-800{color:rgb(56 27 87 / var(--tw-text-opacity, 1))}
.text-blue-900{color:rgb(39 18 64 / var(--tw-text-opacity, 1))}
.text-brandColor{color:var(--brand-color)}
.text-cyan-800{color:rgb(21 94 117 / var(--tw-text-opacity, 1))}
.text-cyan-900{color:rgb(46 22 74 / var(--tw-text-opacity, 1))}
.text-gray-200{color:rgb(231 230 238 / var(--tw-text-opacity, 1))}
.text-gray-300{color:rgb(213 211 223 / var(--tw-text-opacity, 1))}
.text-gray-400{color:rgb(163 159 180 / var(--tw-text-opacity, 1))}
.text-gray-500{color:rgb(114 110 135 / var(--tw-text-opacity, 1))}
.text-gray-600{color:rgb(84 80 105 / var(--tw-text-opacity, 1))}
.text-gray-700{color:rgb(64 61 83 / var(--tw-text-opacity, 1))}
.text-gray-800{color:rgb(40 37 61 / var(--tw-text-opacity, 1))}
.text-gray-900{color:rgb(24 21 40 / var(--tw-text-opacity, 1))}
.text-green-500{color:rgb(42 161 114 / var(--tw-text-opacity, 1))}
.text-green-600{color:rgb(31 138 96 / var(--tw-text-opacity, 1))}
.text-green-800{color:rgb(19 87 61 / var(--tw-text-opacity, 1))}
.text-green-900{color:rgb(13 63 44 / var(--tw-text-opacity, 1))}
.text-lime-900{color:rgb(54 83 20 / var(--tw-text-opacity, 1))}
.text-orange-600{color:rgb(234 88 12 / var(--tw-text-opacity, 1))}
.text-orange-800{color:rgb(154 52 18 / var(--tw-text-opacity, 1))}
.text-orange-900{color:rgb(124 45 18 / var(--tw-text-opacity, 1))}
.text-pink-900{color:rgb(131 24 67 / var(--tw-text-opacity, 1))}
.text-purple-800{color:rgb(107 33 168 / var(--tw-text-opacity, 1))}
.text-red-500{color:rgb(239 68 68 / var(--tw-text-opacity, 1))}
.text-red-600{color:rgb(220 38 38 / var(--tw-text-opacity, 1))}
.text-red-800{color:rgb(153 27 27 / var(--tw-text-opacity, 1))}
.text-red-900{color:rgb(127 29 29 / var(--tw-text-opacity, 1))}
.text-rose-600{color:rgb(225 29 72 / var(--tw-text-opacity, 1))}
.text-sky-600{color:rgb(102 48 159 / var(--tw-text-opacity, 1))}
.text-slate-600{color:rgb(84 80 105 / var(--tw-text-opacity, 1))}
.text-slate-800{color:rgb(40 37 61 / var(--tw-text-opacity, 1))}
.text-slate-900{color:rgb(23 21 39 / var(--tw-text-opacity, 1))}
.text-white{color:rgb(255 255 255 / var(--tw-text-opacity, 1))}
.text-yellow-900{color:rgb(113 63 18 / var(--tw-text-opacity, 1))}
.underline{text-decoration-line:underline}
.\!shadow-none{--tw-shadow:0 0 #0000 !important;--tw-shadow-colored:0 0 #0000 !important;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)!important}
.shadow{--tw-shadow:0 1px 3px 0 rgb(26 23 43 / .1), 0 1px 2px -1px rgb(26 23 43 / .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)}
.shadow-\[0_5px_20px_rgba\(0\,0\,0\,0\.15\)\]{--tw-shadow:0 5px 20px rgba(26,23,43,.15);--tw-shadow-colored:0 5px 20px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.shadow-\[0px_0px_0px_0px_rgba\(0\,0\,0\,0\.10\)\,0px_1px_3px_0px_rgba\(0\,0\,0\,0\.10\)\,0px_5px_5px_0px_rgba\(0\,0\,0\,0\.09\)\,0px_12px_7px_0px_rgba\(0\,0\,0\,0\.05\)\,0px_22px_9px_0px_rgba\(0\,0\,0\,0\.01\)\,0px_34px_9px_0px_rgba\(0\,0\,0\,0\.00\)\]{--tw-shadow:0px 0px 0px 0px rgba(26,23,43,.1),0px 1px 3px 0px rgba(26,23,43,.1),0px 5px 5px 0px rgba(26,23,43,.09),0px 12px 7px 0px rgba(26,23,43,.05),0px 22px 9px 0px rgba(26,23,43,.01),0px 34px 9px 0px rgba(26,23,43,0);--tw-shadow-colored:0px 0px 0px 0px var(--tw-shadow-color), 0px 1px 3px 0px var(--tw-shadow-color), 0px 5px 5px 0px var(--tw-shadow-color), 0px 12px 7px 0px var(--tw-shadow-color), 0px 22px 9px 0px var(--tw-shadow-color), 0px 34px 9px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.shadow-\[0px_10px_20px_0px_\#0000001F\]{--tw-shadow:0px 10px 20px 0px #1a172b1f;--tw-shadow-colored:0px 10px 20px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.shadow-\[0px_10px_20px_0px_rgba\(0\,0\,0\,0\.12\)\]{--tw-shadow:0px 10px 20px 0px rgba(26,23,43,.12);--tw-shadow-colored:0px 10px 20px 0px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.shadow-lg{--tw-shadow:0 10px 15px -3px rgb(26 23 43 / .1), 0 4px 6px -4px rgb(26 23 43 / .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)}
.shadow-md{--tw-shadow:0 4px 6px -1px rgb(26 23 43 / .1), 0 2px 4px -2px rgb(26 23 43 / .1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.shadow-sm{--tw-shadow:0 1px 2px 0 rgb(26 23 43 / .05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.shadow-xl{--tw-shadow:0 20px 25px -5px rgb(26 23 43 / .1), 0 8px 10px -6px rgb(26 23 43 / .1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.shadow-slate-200{--tw-shadow-color:#e8e6ee;--tw-shadow:var(--tw-shadow-colored)}
.outline-none{outline:2px solid transparent;outline-offset:2px}
.icon-help{background-color:currentColor}
.tox .tox-toolbar__group:last-child button{background:#f4eefb;color:#5b2d8c}
.tox .tox-toolbar__group:last-child button:hover{background:#e6d8f5}
.tox .tox-toolbar__group:last-child button{background-color:transparent!important}
.tox .tox-toolbar__group:last-child button:hover{border-width:0px;background-color:rgb(113 53 178 / var(--tw-bg-opacity, 1))!important;color:rgb(255 255 255 / var(--tw-text-opacity, 1));--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}
.dark\:shimmer:is(.dark *){animation-fill-mode:forwards;background:linear-gradient(to right,#f6f5f9 8%,#f0eff4 18%,#f6f5f9 33%);background-size:1250px 100%}
.dark .dark\:shimmer:is(.dark *){background:linear-gradient(to right,#28253d 8%,#221f35 18%,#28253d 33%)}
.marker\:shadow *::marker{--tw-shadow:0 1px 3px 0 rgb(26 23 43 / .1), 0 1px 2px -1px rgb(26 23 43 / .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)}
.marker\:shadow::marker{--tw-shadow:0 1px 3px 0 rgb(26 23 43 / .1), 0 1px 2px -1px rgb(26 23 43 / .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)}
.placeholder\:text-gray-400::-moz-placeholder{color:rgb(163 159 180 / var(--tw-text-opacity, 1))}
.placeholder\:text-gray-400::placeholder{color:rgb(163 159 180 / var(--tw-text-opacity, 1))}
.after\:rounded-full:after{border-radius:9999px}
.after\:border:after{border-width:1px}
.after\:border-gray-300:after{--tw-border-opacity:1;border-color:rgb(213 211 223 / var(--tw-border-opacity, 1))}
.after\:bg-green-500:after{background-color:rgb(42 161 114 / var(--tw-bg-opacity, 1))}
.after\:bg-red-500:after{background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))}
.after\:bg-white:after{background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}
/* assets/app-C2Wq9G4i.css */
.flatpickr-calendar{background:transparent;border:0;border-radius:5px;background:#fff;-webkit-box-shadow:1px 0 0 #e6e5ed,-1px 0 0 #e6e5ed,0 1px 0 #e6e5ed,0 -1px 0 #e6e5ed,0 3px 13px rgba(26,23,43,.08);box-shadow:1px 0 #e6e5ed,-1px 0 #e6e5ed,0 1px #e6e5ed,0 -1px #e6e5ed,0 3px 13px #1a172b14}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){-webkit-box-shadow:none!important;box-shadow:none!important}
.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){-webkit-box-shadow:-2px 0 0 #e6e5ed,5px 0 0 #e6e5ed;box-shadow:-2px 0 #e6e5ed,5px 0 #e6e5ed}
.flatpickr-calendar .hasWeeks .dayContainer,.flatpickr-calendar .hasTime .dayContainer{border-bottom:0;border-bottom-right-radius:0;border-bottom-left-radius:0}
.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}
.flatpickr-calendar.hasTime .flatpickr-time{border-top:1px solid #e6e5ed}
.flatpickr-calendar:before,.flatpickr-calendar:after{border:solid transparent}
.flatpickr-calendar:before{border-width:5px}
.flatpickr-calendar:after{border-width:4px}
.flatpickr-calendar.arrowTop:before{border-bottom-color:#e6e5ed}
.flatpickr-calendar.arrowTop:after{border-bottom-color:#fff}
.flatpickr-calendar.arrowBottom:before{border-top-color:#e6e5ed}
.flatpickr-calendar.arrowBottom:after{border-top-color:#fff}
.flatpickr-calendar:focus{outline:0}
.flatpickr-months .flatpickr-month{background:transparent;color:#1a172be6;fill:#1a172be6}
.flatpickr-months .flatpickr-prev-month,.flatpickr-months .flatpickr-next-month{text-decoration:none;color:#1a172be6;fill:#1a172be6}
.flatpickr-months .flatpickr-prev-month:hover,.flatpickr-months .flatpickr-next-month:hover{color:#9e9aaf}
.flatpickr-months .flatpickr-prev-month:hover svg,.flatpickr-months .flatpickr-next-month:hover svg{fill:#f64747}
.flatpickr-months .flatpickr-prev-month svg path,.flatpickr-months .flatpickr-next-month svg path{fill:inherit}
.numInputWrapper span{border:1px solid rgba(57,54,77,.15)}
.numInputWrapper span:hover{background:#1a172b1a}
.numInputWrapper span:active{background:#1a172b33}
.numInputWrapper span.arrowUp{border-bottom:0}
.numInputWrapper span.arrowUp:after{border-left:4px solid transparent;border-right:4px solid transparent;border-bottom:4px solid rgba(57,54,77,.6)}
.numInputWrapper span.arrowDown:after{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid rgba(57,54,77,.6)}
.numInputWrapper span svg path{fill:#1a172b80}
.numInputWrapper:hover{background:#1a172b0d}
.flatpickr-current-month{color:inherit}
.flatpickr-current-month span.cur-month{color:inherit}
.flatpickr-current-month span.cur-month:hover{background:#1a172b0d}
.flatpickr-current-month .numInputWrapper span.arrowUp:after{border-bottom-color:#1a172be6}
.flatpickr-current-month .numInputWrapper span.arrowDown:after{border-top-color:#1a172be6}
.flatpickr-current-month input.cur-year{background:transparent;color:inherit;border:0;border-radius:0}
.flatpickr-current-month input.cur-year:focus{outline:0}
.flatpickr-current-month input.cur-year[disabled],.flatpickr-current-month input.cur-year[disabled]:hover{color:#1a172b80;background:transparent}
.flatpickr-current-month .flatpickr-monthDropdown-months{background:transparent;border:none;border-radius:0;color:inherit;outline:none}
.flatpickr-current-month .flatpickr-monthDropdown-months:focus,.flatpickr-current-month .flatpickr-monthDropdown-months:active{outline:none}
.flatpickr-current-month .flatpickr-monthDropdown-months:hover{background:#1a172b0d}
.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:transparent;outline:none}
.flatpickr-weekdays{background:transparent}
span.flatpickr-weekday{background:transparent;color:#1a172b8a}
.flatpickr-days:focus{outline:0}
.dayContainer{outline:0}
.dayContainer+.dayContainer{-webkit-box-shadow:-1px 0 0 #e6e5ed;box-shadow:-1px 0 #e6e5ed}
.flatpickr-day{background:none;border:1px solid transparent;border-radius:150px;color:#39364d}
.flatpickr-day.inRange,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.today.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day:hover,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.nextMonthDay:hover,.flatpickr-day:focus,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.nextMonthDay:focus{outline:0;background:#e6e5ed;border-color:#e6e5ed}
.flatpickr-day.today{border-color:#9e9aaf}
.flatpickr-day.today:hover,.flatpickr-day.today:focus{border-color:#9e9aaf;background:#9e9aaf;color:#fff}
.flatpickr-day.selected,.flatpickr-day.startRange,.flatpickr-day.endRange,.flatpickr-day.selected.inRange,.flatpickr-day.startRange.inRange,.flatpickr-day.endRange.inRange,.flatpickr-day.selected:focus,.flatpickr-day.startRange:focus,.flatpickr-day.endRange:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.endRange.nextMonthDay{background:#874fc3;-webkit-box-shadow:none;box-shadow:none;color:#fff;border-color:#874fc3}
.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange,.flatpickr-day.endRange.startRange{border-radius:50px 0 0 50px}
.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange,.flatpickr-day.endRange.endRange{border-radius:0 50px 50px 0}
.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)){-webkit-box-shadow:-10px 0 0 #874fc3;box-shadow:-10px 0 #874fc3}
.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange,.flatpickr-day.endRange.startRange.endRange{border-radius:50px}
.flatpickr-day.inRange{border-radius:0;-webkit-box-shadow:-5px 0 0 #e6e5ed,5px 0 0 #e6e5ed;box-shadow:-5px 0 #e6e5ed,5px 0 #e6e5ed}
.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.prevMonthDay,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.notAllowed.nextMonthDay{color:#39364d4d;background:transparent;border-color:transparent}
.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{color:#39364d1a}
.flatpickr-day.week.selected{border-radius:0;-webkit-box-shadow:-5px 0 0 #874fc3,5px 0 0 #874fc3;box-shadow:-5px 0 #874fc3,5px 0 #874fc3}
.flatpickr-weekwrapper .flatpickr-weeks{-webkit-box-shadow:1px 0 0 #e6e5ed;box-shadow:1px 0 #e6e5ed}
.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{color:#39364d4d;background:transparent;border:none}
.flatpickr-time{outline:0}
.flatpickr-time .numInputWrapper span.arrowUp:after{border-bottom-color:#39364d}
.flatpickr-time .numInputWrapper span.arrowDown:after{border-top-color:#39364d}
.flatpickr-time input{background:transparent;-webkit-box-shadow:none;box-shadow:none;border:0;border-radius:0;color:#39364d}
.flatpickr-time input:focus{outline:0;border:0}
.flatpickr-time .flatpickr-time-separator,.flatpickr-time .flatpickr-am-pm{color:#39364d}
.flatpickr-time .flatpickr-am-pm{outline:0}
.flatpickr-time input:hover,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time .flatpickr-am-pm:focus{background:#eeedf3}
.vuecal__weekdays-headings{border-bottom:1px solid #dedbe6}
.vuecal__header button{outline:none}
.vuecal__menu{background-color:#1a172b05}
.vuecal__view-btn{background:none;border:none;border-bottom:0 solid currentColor;color:inherit}
.vuecal__view-btn--active{border-bottom-width:2px;background:#ffffff26}
.vuecal__title-bar{background-color:#1a172b1a}
.vuecal__title button{background:none;border:none}
.vuecal__today-btn{background:none;border:none}
.vuecal__arrow{background:none;border:none}
.vuecal__arrow i.angle{border:solid currentColor;border-width:0 2px 2px 0}
.vuecal__arrow--prev i.angle{border-width:2px 0 0 2px}
.vuecal__arrow--highlighted,.vuecal__today-btn--highlighted,.vuecal__view-btn--highlighted{background-color:#1a172b0a}
.vuecal__arrow--highlighted:before,.vuecal__arrow--highlighted:after,.vuecal__today-btn--highlighted:before,.vuecal__today-btn--highlighted:after,.vuecal__view-btn--highlighted:before,.vuecal__view-btn--highlighted:after{background-color:inherit}
.vuecal__arrow--highlighted:before,.vuecal__today-btn--highlighted:before,.vuecal__view-btn--highlighted:before{border-radius:3em}
.vuecal__arrow--highlighted:after,.vuecal__today-btn--highlighted:after,.vuecal__view-btn--highlighted:after{border-radius:2.6em}
.vuecal__event{color:#66627c;background-color:#f8f7fbcc}
.vuecal__event--focus,.vuecal__event:focus{box-shadow:1px 1px 6px #1a172b33;outline:none}
.vuecal__event-resize-handle{background-color:#ffffff4d}
.vuecal__event-delete{background-color:#dd3333d9;color:#fff}
.vuecal--full-height-delete .vuecal__event-delete:before{background-image:url('data:image/svg+xml;utf8,<svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.5a10.5 10.5 0 100 21 10.5 10.5 0 000-21zm5 14.1c.2 0 .2.2.2.2l-.1.3-1 1-.3.1h-.2L12 13.5l-3.5 3.6h-.3-.3l-1-1v-.4-.2l3.6-3.6-3.6-3.5A.4.4 0 017 8l1-1 .3-.2c.1 0 .2 0 .2.2l3.6 3.5L15.6 7l.2-.2c.1 0 .2 0 .3.2l1 1v.5L13.5 12z" fill="%23fff" opacity=".9"/></svg>')}
.vuecal__event-title--edit{border-bottom:1px solid transparent;color:inherit;background-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M442 150l-39 39-80-80 39-39q6-6 15-6t15 6l50 50q6 6 6 15t-6 15zM64 368l236-236 80 80-236 236H64v-80z" fill="%23000" opacity=".4"/></svg>');background-repeat:no-repeat;background-position:120% .15em;background-size:.4em;outline:none}
.vuecal__event-title--edit:hover,.vuecal__event-title--edit:focus{border-color:#1a172b66;background-position:99% .15em;background-size:1.2em}
.vuecal__cell:before{border:1px solid rgba(197,194,209,.25)}
.vuecal__cell--today,.vuecal__cell--current{background-color:#f0f0ff66}
.vuecal__cell--selected{background-color:#eaf7f266}
.vuecal--day-view .vuecal__cell--selected{background:none}
.vuecal__cell--out-of-scope{color:#1a172b40}
.vuecal__cell--disabled{color:#1a172b40}
.vuecal__cell--highlighted:not(.vuecal__cell--has-splits),.vuecal__cell-split.vuecal__cell-split--highlighted{background-color:#1a172b0a}
.vuecal__cell-content{outline:none}
.vuecal__cell-events-count{background:#9a96ac;color:#fff;border-radius:12px}
.vuecal__no-event{color:#aba7bb}
.vuecal__now-line{color:red;border-top:1px solid currentColor}
.vuecal__now-line:before{border:5px solid transparent;border-left-color:currentColor}
.vuecal{box-shadow:0 0 0 1px inset #1a172b14}
.vuecal .dragging-helper{background:#a376d5cc;border:1px solid #8c55c7}
.vuecal__all-day-text{color:#9a96ac;border-bottom:1px solid #dedbe6}
.vuecal--overflow-x.vuecal--week-view .vuecal__time-column{box-shadow:0 1px 1px #1a172b4d}
.vuecal__time-column .vuecal__time-cell{color:#9a96ac}
.vuecal__time-column .vuecal__time-cell-line:before{border-top:1px solid rgba(197,194,209,.3)}
.vuecal--green-theme .vuecal__menu,.vuecal--green-theme .vuecal__cell-events-count{background-color:#289d6f;color:#fff}
.vuecal--green-theme .vuecal__title-bar{background-color:#f1f0f5}
.vuecal--green-theme .vuecal__cell--today,.vuecal--green-theme .vuecal__cell--current{background-color:#f0f0ff66}
.vuecal--green-theme:not(.vuecal--day-view) .vuecal__cell--selected{background-color:#eaf7f266}
.vuecal--green-theme .vuecal__cell--selected:before{border-color:#289d6f80}
.vuecal--green-theme .vuecal__cell--highlighted:not(.vuecal__cell--has-splits),.vuecal--green-theme .vuecal__cell-split--highlighted{background-color:#c1ead980}
.vuecal--green-theme .vuecal__arrow--highlighted,.vuecal--green-theme .vuecal__today-btn--highlighted,.vuecal--green-theme .vuecal__view-btn--highlighted{background-color:#6ec39f40}
.vuecal--blue-theme .vuecal__menu,.vuecal--blue-theme .vuecal__cell-events-count{background-color:#42a3b9cc;color:#fff}
.vuecal--blue-theme .vuecal__title-bar{background-color:#00a5bc4d}
.vuecal--blue-theme .vuecal__cell--today,.vuecal--blue-theme .vuecal__cell--current{background-color:#f0f0ff66}
.vuecal--blue-theme:not(.vuecal--day-view) .vuecal__cell--selected{background-color:#ebfdff66}
.vuecal--blue-theme .vuecal__cell--selected:before{border-color:#73bfcc80}
.vuecal--blue-theme .vuecal__cell--highlighted:not(.vuecal__cell--has-splits),.vuecal--blue-theme .vuecal__cell-split--highlighted{background-color:#00a5bc0f}
.vuecal--blue-theme .vuecal__arrow--highlighted,.vuecal--blue-theme .vuecal__today-btn--highlighted,.vuecal--blue-theme .vuecal__view-btn--highlighted{background-color:#42a3b933}
.vuecal--rounded-theme .vuecal__weekdays-headings{border:none}
.vuecal--rounded-theme .vuecal__cell,.vuecal--rounded-theme .vuecal__cell:before{background:none;border:none}
.vuecal--rounded-theme .vuecal__cell-content{border:1px solid transparent;border-radius:30px;color:#322f47}
.vuecal--rounded-theme.vuecal--day-view .vuecal__cell-content{background:none}
.vuecal--rounded-theme .vuecal__cell{background-color:transparent!important}
.vuecal--rounded-theme.vuecal--green-theme:not(.vuecal--day-view) .vuecal__cell-content{background-color:#f8f7fa}
.vuecal--rounded-theme.vuecal--green-theme:not(.vuecal--day-view) .vuecal__cell--today .vuecal__cell-content{background-color:#289d6f;color:#fff}
.vuecal--rounded-theme.vuecal--green-theme .vuecal--day-view .vuecal__cell--today:before{background-color:#289d6f0d}
.vuecal--rounded-theme.vuecal--green-theme:not(.vuecal--day-view) .vuecal__cell--selected .vuecal__cell-content{border-color:#289d6f}
.vuecal--rounded-theme.vuecal--green-theme .vuecal__cell--highlighted:not(.vuecal__cell--has-splits),.vuecal--rounded-theme.vuecal--green-theme .vuecal__cell-split--highlighted{background-color:#c1ead980}
.vuecal--rounded-theme.vuecal--blue-theme:not(.vuecal--day-view) .vuecal__cell-content{background-color:#9b6ad033}
.vuecal--rounded-theme.vuecal--blue-theme:not(.vuecal--day-view) .vuecal__cell--today .vuecal__cell-content{background-color:#9f70d3;color:#fff}
.vuecal--rounded-theme.vuecal--blue-theme .vuecal--day-view .vuecal__cell--today:before{background-color:#9f70d31a}
.vuecal--rounded-theme.vuecal--blue-theme:not(.vuecal--day-view) .vuecal__cell--selected .vuecal__cell-content{border-color:#8c55c7}
.vuecal--rounded-theme.vuecal--blue-theme .vuecal__cell--highlighted:not(.vuecal__cell--has-splits),.vuecal--rounded-theme.vuecal--blue-theme .vuecal__cell-split--highlighted{background-color:#00a5bc0f}
.vuecal--date-picker .vuecal__weekdays-headings{border:none}
.vuecal--date-picker .vuecal__cell,.vuecal--date-picker .vuecal__cell:before{background:none;border:none}
.vuecal--date-picker .vuecal__cell-content{border:1px solid transparent;border-radius:25px}
.vuecal--date-picker:not(.vuecal--day-view) .vuecal__cell-content:hover{background-color:#1a172b1a}
.vuecal--date-picker:not(.vuecal--day-view) .vuecal__cell--selected .vuecal__cell-content{background-color:#289d6f;color:#fff}
.vuecal--date-picker:not(.vuecal--day-view) .vuecal__cell--current .vuecal__cell-content,.vuecal--date-picker:not(.vuecal--day-view) .vuecal__cell--today .vuecal__cell-content{border-color:#289d6f}
/*
 * WebMaker Design System for the Krayin admin.
 *
 * Built by `php artisan webmaker:theme-build`: the color and radius overrides generated
 * from the compiled admin stylesheets come first, then this hand-written base, so its
 * components win. Edit this file, never public/webmaker/theme.css.
 */

:root {
  --wm-font-display: 'Sora', system-ui, sans-serif;
  --wm-font-body: 'DM Sans', system-ui, sans-serif;
  --wm-radius-pill: 999px;
  --wm-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --wm-dur-fast: 140ms;
  --wm-dur-base: 220ms;
}

/* Type: DM Sans for body and UI, Sora for headings. */
body,
.font-inter {
  font-family: var(--wm-font-body);
}

h1,
h2,
h3,
.text-xl.font-bold,
.text-xl.font-semibold,
.text-2xl.font-bold,
.text-2xl.font-semibold,
.text-3xl.font-bold {
  font-family: var(--wm-font-display);
  letter-spacing: -0.02em;
}

/* Buttons: pill-shaped, Sora 600, a glow in the brand color on the primary one. */
.primary-button,
.secondary-button,
.transparent-button {
  border-radius: var(--wm-radius-pill);
  font-family: var(--wm-font-display);
  font-weight: 600;
  transition:
    transform var(--wm-dur-fast) var(--wm-ease-out),
    filter var(--wm-dur-fast) var(--wm-ease-out),
    background-color var(--wm-dur-base) var(--wm-ease-out),
    box-shadow var(--wm-dur-base) var(--wm-ease-out);
}

.primary-button {
  box-shadow: 0 12px 28px color-mix(in srgb, var(--brand-color) 28%, transparent);
}

.primary-button:hover,
.primary-button:focus {
  opacity: 1;
  filter: brightness(1.06);
}

.primary-button:active,
.secondary-button:active,
.transparent-button:active {
  transform: translateY(1px) scale(0.985);
}

/*
 * Dark theme: the brand color is configurable (and per tenant later), so it is lifted
 * toward white for text and borders on dark surfaces instead of being hard-coded.
 */
.dark .text-brandColor,
.dark .hover\:text-brandColor:hover {
  color: color-mix(in oklab, var(--brand-color) 55%, #fff);
}

.dark .border-brandColor {
  border-color: color-mix(in oklab, var(--brand-color) 70%, #fff);
}

/*
 * On dark surfaces the Tratus mark swaps to the version with a lighter bar,
 * published next to this stylesheet. Its size stays Krayin's: a `width: auto` here
 * once beat the profile menu's width="24", and the mark filled the whole menu.
 */
.dark img[src*='tratus-mark'] {
  content: url(tratus-mark-dark.svg);
}

/*
 * Header lockup: the mark, then the name in the display face, "trat" in violet and
 * "us" in green as in the logo. Being text, it follows the light and dark themes.
 */
header a:has(> img[src*='tratus-mark']) {
  display: flex;
  align-items: center;
}

header a:has(> img[src*='tratus-mark'])::before,
header a:has(> img[src*='tratus-mark'])::after {
  font-family: var(--wm-font-display);
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.03em;
}

header a:has(> img[src*='tratus-mark'])::before {
  content: 'trat';
  order: 2;
  margin-left: 10px;
  color: #5b2d8c;
}

header a:has(> img[src*='tratus-mark'])::after {
  content: 'us';
  order: 3;
  color: #2aa172;
}

.dark header a:has(> img[src*='tratus-mark'])::before {
  color: #fff;
}

.dark header a:has(> img[src*='tratus-mark'])::after {
  color: #6fc3a0;
}

/*
 * Sign-in pages (login, forgot and reset password). Their root is the only
 * `h-[100vh]` child of #app, so these rules never reach the signed-in admin.
 * Layout from the design system's dashboard kit: the form on white at the left,
 * a violet brand panel at the right; below 1024 px the panel drops and the form
 * becomes a card on the canvas.
 */
#app > .h-\[100vh\] {
  box-sizing: border-box;
  min-height: 100vh;
  height: auto;
  padding: 48px 24px;
  gap: 28px;
  background: #f5f4f8;
}

#app > .h-\[100vh\] > div:first-child {
  width: min(400px, 100%);
}

/*
 * The full lockup instead of the square mark the layout prints (the mark stays the
 * logo everywhere else). Drawn by the root's ::before, the first item of its column.
 */
#app > .h-\[100vh\] img[src*='tratus-mark'] {
  display: none;
}

#app > .h-\[100vh\]::before {
  content: '';
  width: 168px;
  height: 42px;
  background: url(tratus-lockup-light.svg) center / contain no-repeat;
}

#app > .h-\[100vh\] .box-shadow {
  width: 100%;
  min-width: 0;
  border: 1px solid #ecebf1;
  border-radius: 20px;
  box-shadow: 0 16px 40px rgba(26, 23, 43, 0.1);
}

/* The title sits in the form (login) or in a padded div (forgot, reset password). */
#app > .h-\[100vh\] .box-shadow form > p.text-xl,
#app > .h-\[100vh\] .box-shadow form > div.p-4:has(> p.text-xl) {
  padding: 32px 28px 8px;
}

#app > .h-\[100vh\] .box-shadow p.text-xl {
  font-family: var(--wm-font-display);
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--brand-color);
}

#app > .h-\[100vh\] form[action$='/login'] p.text-xl::after {
  content: 'Entre para acompanhar seus clientes e negócios.';
  display: block;
  margin-top: 12px;
  line-height: 1.5;
  font-family: var(--wm-font-body);
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0;
  color: #5a5670;
}

#app > .h-\[100vh\] .box-shadow .border-y {
  border: 0;
  padding: 16px 28px 0;
}

#app > .h-\[100vh\] .box-shadow .w-\[254px\] {
  width: 100%;
}

#app > .h-\[100vh\] .box-shadow label {
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #2a2740;
}

#app > .h-\[100vh\] .box-shadow input[type='email'],
#app > .h-\[100vh\] .box-shadow input[type='password'],
#app > .h-\[100vh\] .box-shadow input[type='text'] {
  height: 48px;
  padding: 0 14px;
  border-color: #cbc8d6;
  border-radius: 10px;
  font-size: 15px;
  transition:
    border-color var(--wm-dur-fast) var(--wm-ease-out),
    box-shadow var(--wm-dur-fast) var(--wm-ease-out);
}

#app > .h-\[100vh\] .box-shadow input:focus {
  border-color: var(--brand-color);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--brand-color) 18%, transparent);
  outline: none;
}

/* The eye toggle, centred on the taller password field. */
#app > .h-\[100vh\] .box-shadow .icon-eye-hide,
#app > .h-\[100vh\] .box-shadow .icon-eye {
  top: 54px;
  color: #7b7790;
}

/* Actions: the button full width on top, the secondary link centred below it. */
#app > .h-\[100vh\] .box-shadow form > div:last-child {
  flex-direction: column-reverse;
  align-items: stretch;
  gap: 16px;
  padding: 12px 28px 32px;
}

#app > .h-\[100vh\] .box-shadow form > div:last-child .primary-button {
  height: 48px;
  font-size: 16px;
}

#app > .h-\[100vh\] .box-shadow form > div:last-child a {
  align-self: center;
  font-size: 14px;
}

@media (min-width: 1024px) {
  #app > .h-\[100vh\] {
    padding-right: calc(50% + 24px);
    background: #ffffff;
  }

  /* The panel carries the brand, so the column keeps the lockup small at the top left. */
  #app > .h-\[100vh\]::before {
    position: absolute;
    top: 40px;
    left: 48px;
    width: 140px;
    height: 36px;
    background-position: left center;
  }

  #app > .h-\[100vh\] .box-shadow {
    border-color: transparent;
    box-shadow: none;
  }

  /* The violet panel: gradient and green glow behind, a faint grid, the lockup and line on top. */
  body:has(> #app > .h-\[100vh\])::before {
    content: '';
    position: fixed;
    inset: 0 0 0 50%;
    background:
      radial-gradient(circle at 78% 22%, rgba(111, 195, 160, 0.25), transparent 45%),
      linear-gradient(150deg, #4a2472, #271240 70%);
  }

  #app > .h-\[100vh\]::after {
    content: 'Cada trato, bem cuidado.';
    position: fixed;
    inset: 0 0 0 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 160px;
    font-family: var(--wm-font-display);
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: #ecebf1;
    background:
      url(tratus-lockup-dark.svg) center calc(50% - 36px) / 340px auto no-repeat,
      linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px) 0 0 / 40px 40px,
      linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px) 0 0 / 40px 40px;
  }
}

/* Installer: one workspace, with progress and the current step side by side. */
.wm-installer {
  --brand-color: #5b2d8c;
  background: radial-gradient(ellipse at 15% 20%, #e8e0f2, transparent 55%), #f5f4f8;
  color: #2a2740;
  font-family: var(--wm-font-body);
  font-size: 16px;
}
.wm-installer #app {
  position: relative;
  display: grid;
  align-items: center;
  min-height: 100svh;
  padding: 24px 28px;
}
.wm-installer .wm-installer-shell {
  display: flex;
  align-items: stretch;
  width: min(1120px, 100%);
  min-height: min(660px, calc(100svh - 48px));
  margin: 0 auto;
  border: 1px solid #e4dfeb;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 24px 80px rgba(40, 21, 65, 0.1);
  overflow: hidden;
}
.wm-installer-sidebar {
  --installer-sidebar-padding: 32px;
  flex: 0 0 350px;
  padding: 44px 32px 28px;
  background: radial-gradient(ellipse at top left, #633894, transparent 75%), #2f174b;
}
.wm-installer-sidebar > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 48px;
  height: 100%;
  max-width: none;
}
.wm-installer-sidebar > div > div {
  gap: 32px;
}
.wm-installer-sidebar img {
  width: 176px;
  height: 44px;
  margin-bottom: 8px;
}
.wm-installer-sidebar .text-gray-800 {
  color: #fff;
  font-size: 23px;
  line-height: 1.35;
}
.wm-installer-sidebar .text-gray-600 {
  color: #cfc1df;
  font-size: 15px;
  line-height: 1.6;
}
.wm-installer-steps {
  display: grid;
  gap: 10px;
  counter-reset: installation;
}
.wm-installer-steps > div {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  color: #cfc1df;
  font-size: 14px;
  line-height: 1.4;
  counter-increment: installation;
}
.wm-installer-steps > div::before {
  content: counter(installation, decimal-leading-zero);
  display: grid;
  place-items: center;
  flex: 0 0 30px;
  height: 30px;
  border: 1px solid #82649c;
  border-radius: 50%;
  font-size: 12px;
}
.wm-installer-steps > div > span {
  display: none;
}
.wm-installer-steps > .font-bold {
  color: #fff;
  background: #ffffff16;
}
.wm-installer-steps > .font-bold::before {
  background: #b28bdb;
  border-color: #b28bdb;
  color: #251139;
}
.wm-installer-steps > div:has(.icon-tick)::before {
  content: '✓';
  border-color: #6fc3a0;
  color: #6fc3a0;
}
.wm-installer-sidebar > div > p {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 4px;
  row-gap: 6px;
  box-sizing: border-box;
  width: calc(100% + var(--installer-sidebar-padding) * 2);
  margin: 0 calc(-1 * var(--installer-sidebar-padding)) -28px;
  padding: 24px var(--installer-sidebar-padding) 28px;
  border-top: 1px solid #ffffff20;
  background: #00000012;
  color: #cfc1df;
  font-size: 12px;
  line-height: 1.6;
}
.wm-installer .wm-installer-sidebar > div > p a {
  color: #f3eafa;
  background: transparent;
  text-decoration: none;
  font-weight: 600;
}
.wm-installer-credit-product {
  flex-basis: 100%;
  font-size: 14px;
}
.wm-installer .wm-installer-credit a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.wm-installer .wm-installer-card {
  flex: 1;
  min-width: 0;
  max-width: none;
  border: 0;
  border-radius: 0;
  padding: 24px;
  align-self: center;
}
.wm-installer-card .text-xl {
  font-size: 28px;
  line-height: 1.35;
  letter-spacing: -0.035em;
}
.wm-installer-card .text-sm,
.wm-installer-card label {
  font-size: 16px;
  line-height: 1.6;
}
.wm-installer-card .border-b {
  border-color: #eeeaf3;
}
.wm-installer-card .border-b:has(> .text-xl) {
  padding: 16px 16px 24px;
}
.wm-installer-card p {
  line-height: 1.6;
}
.wm-installer-card .wm-installer-requirements {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 24px;
  padding: 24px 16px;
  max-height: min(480px, calc(100svh - 260px));
  overflow-y: auto;
}
.wm-installer-requirements > div {
  align-items: start;
  gap: 10px;
  padding: 8px 0;
}
.wm-installer-requirements > div > span {
  margin-top: 3px;
  flex-shrink: 0;
}
.wm-installer-card .flex.items-center.justify-between.px-4.py-2\.5 {
  gap: 16px;
  padding: 24px 16px 8px;
}
.wm-installer-card .h-\[484px\] {
  gap: 20px;
  padding-top: 24px;
  padding-bottom: 24px;
}
.wm-installer-card label {
  display: inline-block;
  margin-bottom: 8px;
}
.wm-installer-card .container {
  padding: 0;
}
.wm-installer-card .h-\[100px\] {
  height: auto;
  padding: 24px 28px 0;
}
.wm-installer-card .text-center {
  text-align: start;
}
.wm-installer-card .h-72 {
  height: auto;
  min-height: 230px;
}
.wm-installer-card input,
.wm-installer-card select {
  min-height: 48px;
  border-radius: 10px;
  border-color: #cbc5d5;
  font-family: inherit;
  font-size: 16px;
}
.wm-installer .text-brandColor {
  color: var(--brand-color);
}
.wm-installer .bg-brandColor {
  background-color: var(--brand-color);
}
.wm-installer .border-brandColor {
  border-color: var(--brand-color);
}
.wm-installer-card button,
.wm-installer-card .primary-button,
.wm-installer-card [tabindex='0'] {
  min-height: 46px;
  padding: 12px 24px;
  border-radius: 12px;
  font-size: 15px;
  line-height: 1.4;
}
.wm-installer a:focus-visible,
.wm-installer button:focus-visible,
.wm-installer input:focus-visible,
.wm-installer select:focus-visible {
  outline: 3px solid #a57ccc;
  outline-offset: 3px;
}
@media (min-width: 851px) and (max-height: 800px) {
  .wm-installer-sidebar {
    padding-top: 28px;
  }
  .wm-installer-sidebar > div {
    gap: 24px;
  }
  .wm-installer-sidebar > div > div {
    gap: 20px;
  }
  .wm-installer-steps {
    gap: 4px;
  }
  .wm-installer-steps > div {
    padding-top: 6px;
    padding-bottom: 6px;
  }
}
@media (max-width: 850px) {
  .wm-installer #app {
    padding: 24px 16px;
  }
  .wm-installer .wm-installer-shell {
    flex-direction: column;
    margin: 0 auto;
  }
  .wm-installer-sidebar {
    --installer-sidebar-padding: 28px;
    flex-basis: auto;
    padding: 28px;
  }
  .wm-installer-sidebar > div {
    gap: 24px;
  }
  .wm-installer-sidebar > div > div {
    gap: 20px;
  }
  .wm-installer-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
  }
  .wm-installer-steps > div {
    padding: 8px 0;
    font-size: 12px;
  }
  .wm-installer .wm-installer-card {
    padding: 20px 8px;
  }
  .wm-installer-card .text-xl {
    font-size: 24px;
  }
  .wm-installer-card .wm-installer-requirements {
    grid-template-columns: 1fr;
    max-height: none;
  }
}

