1import { createHotContext as __vite__createHotContext } from "/@vite/client";import.meta.hot = __vite__createHotContext("/src/style.css");import { updateStyle as __vite__updateStyle, removeStyle as __vite__removeStyle } from "/@vite/client" 2const __vite__id = "/root/staging_casa/crmzip/src/style.css" 3const __vite__css = "*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\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-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\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(59 130 246 / 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 --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\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-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\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(59 130 246 / 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 --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}/*\n! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: #e5e7eb; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n -moz-tab-size: 4; /* 3 */\n -o-tab-size: 4;\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;
3\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n letter-spacing: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\ninput:where([type='button']),\ninput:where([type='reset']),\ninput:where([type='submit']) {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/je
3nsimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden]:where(:not([hidden=\"until-found\"])) {\n display: none;\n}\r\n.pointer-events-none {\n pointer-events: none;\n}\r\n.fixed {\n position: fixed;\n}\r\n.absolute {\n position: absolute;\n}\r\n.relative {\n position: relative;\n}\r\n.sticky {\n position: sticky;\n}\r\n.inset-0 {\n inset: 0px;\n}\r\n.inset-x-0 {\n left: 0px;\n right: 0px;\n}\r\n.-right-1 {\n right: -0.25rem;\n}\r\n.-top-1 {\n top: -0.25rem;\n}\r\n.bottom-0 {\n bottom: 0px;\n}\r\n.bottom-0\\.5 {\n bottom: 0.125rem;\n}\r\n.bottom-4 {\n bottom: 1rem;\n}\r\n.bottom-6 {\n bottom: 1.5rem;\n}\r\n.left-0 {\n left: 0px;\n}\r\n.left-1 {\n left: 0.25rem;\n}\r\n.left-1\\/2 {\n left: 50%;\n}\r\n.left-2\\.5 {\n left: 0.625rem;\n}\r\n.left-3 {\n left: 0.75rem;\n}\r\n.left-4 {\n left: 1rem;\n}\r\n.right-0 {\n right: 0px;\n}\r\n.right-1\\.5 {\n right: 0.375rem;\n}\r\n.right-3 {\n right: 0.75rem;\n}\r\n.right-4 {\n right: 1rem;\n}\r\n.right-6 {\n right: 1.5rem;\n}\r\n.top-0 {\n top: 0px;\n}\r\n.top-1 {\n top: 0.25rem;\n}\r\n.top-1\\/2 {\n top: 50%;\n}\r\n.top-3 {\n top: 0.75rem;\n}\r\n.top-4 {\n top: 1rem;\n}\r\n.top-\\[calc\\(100\\%\\+8px\\)\\] {\n top: calc(100% + 8px);\n}\r\n.z-10 {\n z-index: 10;\n}\r\n.z-40 {\n z-index: 40;\n}\r\n.z-50 {\n z-index: 50;\n}\r\n.z-\\[1000\\] {\n z-index: 1000;\n}\r\n.z-\\[100\\] {\n z-index: 100;\n}\r\n.z-\\[200\\] {\n z-index: 200;\n}\r\n.z-\\[60\\] {\n z-index: 60;\n}\r\n.z-\\[70\\] {\n z-index: 70;\n}\r\n.z-\\[99999\\] {\n z-index: 99999;\n}\r\n.order-1 {\n order: 1;\n}\r\n.order-2 {\n order: 2;\n}\r\n.col-span-2 {\n grid-column: span 2 / span 2;\n}\r\n.m-0 {\n margin: 0px;\n}\r\n.-mx-4 {\n margin-left: -1rem;\n margin-right: -1rem;\n}\r\n.mx-auto {\n margin-left: auto;\n margin-right: auto;\n}\r\n.-ml-\\[5px\\] {\n margin-left: -5px;\n}\r\n.mb-0\\.5 {\n margin-bottom: 0.125rem;\n}\r\n.mb-1 {\n margin-bottom: 0.25rem;\n}\r\n.mb-1\\.5 {\n margin-bottom: 0.375rem;\n}\r\n.mb-12 {\n margin-bottom: 3rem;\n}\r\n.mb-2 {\n margin-bottom: 0.5rem;\n}\r\n.mb-2\\.5 {\n margin-bottom: 0.625rem;\n}\r\n.mb-3 {\n margin-bottom: 0.75rem;\n}\r\n.mb-4 {\n margin-bottom: 1rem;\n}\r\n.mb-5 {\n margin-bottom: 1.25rem;\n}\r\n.mb-6 {\n margin-bottom: 1.5rem;\n}\r\n.mb-8 {\n margin-bottom: 2rem;\n}\r\n.ml-1 {\n margin-left: 0.25rem;\n}\r\n.ml-2 {\n margin-left: 0.5rem;\n}\r\n.ml-4 {\n margin-left: 1rem;\n}\r\n.ml-auto {\n margin-left: auto;\n}\r\n.mr-2 {\n margin-right: 0.5rem;\n}\r\n.mt-0\\.5 {\n margin-top: 0.125rem;\n}\r\n.mt-1 {\n margin-top: 0.25rem;\n}\r\n.mt-12 {\n margin-top: 3rem;\n}\r\n.mt-2 {\n margin-top: 0.5rem;\n}\r\n.mt-3 {\n margin-top: 0.75rem;\n}\r\n.mt-4 {\n margin-top: 1rem;\n}\r\n.mt-5 {\n margin-top: 1.25rem;\n}\r\n.mt-8 {\n margin-top: 2rem;\n}\r\n.mt-auto {\n margin-top: auto;\n}\r\n.line-clamp-1 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1;\n}\r\n.line-clamp-2 {\n overflow: hidden;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n}\r\n.block {\n display: block;\n}\r\n.inline-block {\n display: inline-block;\n}\r\n.flex {\n display: flex;\n}\r\n.inline-flex {\n display: inline-flex;\n}\r\n.table {\n display: table;\n}\r\n.grid {\n display: grid;\n}\r\n.hidden {\n display: none;\n}\r\n.aspect-square {\n aspect-ratio: 1 / 1;\n}\r\n.\\!h-\\[34px\\] {\n height: 34px !important;\n}\r\n.h-1 {\n height: 0.25rem;\n}\r\n.h-1\\.5 {\n height: 0.375rem;\n}\r\n.h-10 {\n height: 2.5rem;\n}\r\n.h-11 {\n height: 2.75rem;\n}\r\n.h-12 {\n height: 3rem;\n}\r\n.h-14 {\n height: 3.5rem;\n}\r\n.h-16 {\n height: 4rem;\n}\r\n.h-2 {\n height: 0.5rem;\n}\r\n.h-2\\.5 {\n height: 0.625rem;\n}\r\n.h-20 {\n height: 5rem;\n}\r\n.h-3 {\n height: 0.75rem;\n}\r\n.h-3\\.5 {\n height: 0.875rem;\n}\r\n.h-4 {\n height: 1rem;\n}\r\n.h-5 {\n height: 1.25rem;\n}\r\n.h-6 {\n height: 1.5rem;\n}\r\n.h-64 {\n height: 16rem;\n}\r\n.h-7 {\n height: 1.75rem;\n}\r\n.h-72 {\n height: 18rem;\n}\r\n.h-8 {\n height: 2rem;\n}\r\n.h-9 {\n height: 2.25rem;\n}\r\n.h-\\[1440px\\] {\n height: 1440px;\n}\r\n.h-\\[2px\\] {\n height: 2px;\n}\r\n.h-\\[600px\\] {\n height: 600px;\n}\r\n.h-\\[60px\\] {\n height: 60px;\n}\r\n.h-\\[85vh\\] {\n height: 85vh;\n}\r\n.h-\\[calc\\(100vh-2rem\\)\\] {\n height: calc(100vh - 2rem);\n}\r\n.h-\\[calc\\(100vh-88px\\)\\] {\n height: calc(100vh - 88px);\n}\r\n.h-full {\n height: 100%;\n}\r\n.h-screen {\n height: 100vh;\n}\r\n.max-h-56 {\n max-height: 14rem;\n}\r\n.max-h-60 {\n max-height: 15rem;\n}\r\n.max-h-\\[300px\\] {\n max-height: 300px;\n}\r\n.max-h-\\[600px\\] {\n max-height: 600px;\n}\r\n.max-h-\\[80vh\\] {\n max-height: 80vh;\n}\r\n.max-h-\\[90vh\\] {\n max-height: 90vh;\n}\r\n.max-h-\\[calc\\(80vh-120px\\)\\] {\n max-height: calc(80vh - 120px);\n}\r\n.min-h-0 {\n min-height: 0px;\n}\r\n.min-h-\\[100px\\] {\n min-height: 100px;\n}\r\n.min-h-\\[28px\\] {\n min-height: 28px;\n}\r\n.min-h-\\[360px\\] {\n min-height: 360px;\n}\r\n.min-h-\\[400px\\] {\n min-height: 400px;\n}\r\n.min-h-\\[44px\\] {\n min-height: 44px;\n}\r\n.min-h-\\[48px\\] {\n min-height: 48px;\n}\r\n.min-h-\\[500px\\] {\n min-height: 500px;\n}\r\n.min-h-screen {\n min-height: 100vh;\n}\r\n.w-1 {\n width: 0.25rem;\n}\r\n.w-1\\.5 {\n width: 0.375rem;\n}\r\n.w-10 {\n width: 2.5rem;\n}\r\n.w-11 {\n width: 2.75rem;\n}\r\n.w-12 {\n width: 3rem;\n}\r\n.w-14 {\n width: 3.5rem;\n}\r\n.w-16 {\n width: 4rem;\n}\r\n.w-2 {\n width: 0.5rem;\n}\r\n.w-2\\.5 {\n width: 0.625rem;\n}\r\n.w-20 {\n width: 5rem;\n}\r\n.w-24 {\n width: 6rem;\n}\r\n.w-3 {\n width: 0.75rem;\n}\r\n.w-3\\.5 {\n width: 0.875rem;\n}\r\n.w-4 {\n width: 1rem;\n}\r\n.w-5 {\n width: 1.25rem;\n}\r\n.w-6 {\n width: 1.5rem;\n}\r\n.w-64 {\n width: 16rem;\n}\r\n.w-7 {\n width: 1.75rem;\n}\r\n.w-8 {\n width: 2rem;\n}\r\n.w-9 {\n width: 2.25rem;\n}\r\n.w-\\[calc\\(100vw-2rem\\)\\] {\n width: calc(100vw - 2rem);\n}\r\n.w-fit {\n width: -moz-fit-content;\n width: fit-content;\n}\r\n.w-full {\n width: 100%;\n}\r\n.w-max {\n width: -moz-max-content;\n width: max-content;\n}\r\n.min-w-0 {\n min-width: 0px;\n}
3\r\n.min-w-\\[20px\\] {\n min-width: 20px;\n}\r\n.min-w-\\[300px\\] {\n min-width: 300px;\n}\r\n.min-w-\\[60px\\] {\n min-width: 60px;\n}\r\n.min-w-\\[80px\\] {\n min-width: 80px;\n}\r\n.max-w-2xl {\n max-width: 42rem;\n}\r\n.max-w-3xl {\n max-width: 48rem;\n}\r\n.max-w-6xl {\n max-width: 72rem;\n}\r\n.max-w-7xl {\n max-width: 80rem;\n}\r\n.max-w-\\[150px\\] {\n max-width: 150px;\n}\r\n.max-w-\\[200px\\] {\n max-width: 200px;\n}\r\n.max-w-\\[220px\\] {\n max-width: 220px;\n}\r\n.max-w-\\[250px\\] {\n max-width: 250px;\n}\r\n.max-w-\\[80px\\] {\n max-width: 80px;\n}\r\n.max-w-\\[85\\%\\] {\n max-width: 85%;\n}\r\n.max-w-\\[95px\\] {\n max-width: 95px;\n}\r\n.max-w-md {\n max-width: 28rem;\n}\r\n.max-w-sm {\n max-width: 24rem;\n}\r\n.flex-1 {\n flex: 1 1 0%;\n}\r\n.flex-shrink-0 {\n flex-shrink: 0;\n}\r\n.shrink-0 {\n flex-shrink: 0;\n}\r\n.border-collapse {\n border-collapse: collapse;\n}\r\n.-translate-x-1\\/2 {\n --tw-translate-x: -50%;\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}\r\n.-translate-y-1\\/2 {\n --tw-translate-y: -50%;\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}\r\n.translate-x-7 {\n --tw-translate-x: 1.75rem;\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}\r\n.rotate-180 {\n --tw-rotate: 180deg;\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}\r\n.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}\r\n@keyframes bounce {\n\n 0%, 100% {\n transform: translateY(-25%);\n animation-timing-function: cubic-bezier(0.8,0,1,1);\n }\n\n 50% {\n transform: none;\n animation-timing-function: cubic-bezier(0,0,0.2,1);\n }\n}\r\n.animate-bounce {\n animation: bounce 1s infinite;\n}\r\n@keyframes pulse {\n\n 50% {\n opacity: .5;\n }\n}\r\n.animate-pulse {\n animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n}\r\n@keyframes spin {\n\n to {\n transform: rotate(360deg);\n }\n}\r\n.animate-spin {\n animation: spin 1s linear infinite;\n}\r\n.cursor-default {\n cursor: default;\n}\r\n.cursor-not-allowed {\n cursor: not-allowed;\n}\r\n.cursor-pointer {\n cursor: pointer;\n}\r\n.cursor-wait {\n cursor: wait;\n}\r\n.select-none {\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\r\n.resize-none {\n resize: none;\n}\r\n.appearance-none {\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n}\r\n.grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n}\r\n.grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n}\r\n.grid-cols-7 {\n grid-template-columns: repeat(7, minmax(0, 1fr));\n}\r\n.grid-cols-\\[64px_1fr\\] {\n grid-template-columns: 64px 1fr;\n}\r\n.flex-col {\n flex-direction: column;\n}\r\n.flex-wrap {\n flex-wrap: wrap;\n}\r\n.items-start {\n align-items: flex-start;\n}\r\n.items-end {\n align-items: flex-end;\n}\r\n.items-center {\n align-items: center;\n}\r\n.items-baseline {\n align-items: baseline;\n}\r\n.items-stretch {\n align-items: stretch;\n}\r\n.justify-start {\n justify-content: flex-start;\n}\r\n.justify-end {\n justify-content: flex-end;\n}\r\n.justify-center {\n justify-content: center;\n}\r\n.justify-between {\n justify-content: space-between;\n}\r\n.gap-0\\.5 {\n gap: 0.125rem;\n}\r\n.gap-1 {\n gap: 0.25rem;\n}\r\n.gap-1\\.5 {\n gap: 0.375rem;\n}\r\n.gap-2 {\n gap: 0.5rem;\n}\r\n.gap-3 {\n gap: 0.75rem;\n}\r\n.gap-4 {\n gap: 1rem;\n}\r\n.gap-5 {\n gap: 1.25rem;\n}\r\n.gap-6 {\n gap: 1.5rem;\n}\r\n.gap-8 {\n gap: 2rem;\n}\r\n.gap-x-8 {\n -moz-column-gap: 2rem;\n column-gap: 2rem;\n}\r\n.gap-y-0\\.5 {\n row-gap: 0.125rem;\n}\r\n.gap-y-6 {\n row-gap: 1.5rem;\n}\r\n.space-y-0\\.5 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.125rem * var(--tw-space-y-reverse));\n}\r\n.space-y-1 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));\n}\r\n.space-y-1\\.5 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));\n}\r\n.space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n}\r\n.space-y-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));\n}\r\n.space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n}\r\n.space-y-6 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));\n}\r\n.space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n}\r\n.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}\r\n.divide-gray-50 > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-opacity: 1;\n border-color: rgb(249 250 251 / var(--tw-divide-opacity, 1));\n}\r\n.divide-slate-50 > :not([hidden]) ~ :not([hidden]) {\n --tw-divide-opacity: 1;\n border-color: rgb(248 250 252 / var(--tw-divide-opacity, 1));\n}\r\n.self-start {\n align-self: flex-start;\n}\r\n.self-end {\n align-self: flex-end;\n}\r\n.overflow-hidden {\n overflow: hidden;\n}\r\n.overflow-x-auto {\n overflow-x: auto;\n}\r\n.\\!overflow-y-auto {\n overflow-y: auto !important;\n}\r\n.overflow-y-auto {\n overflow-y: auto;\n}\r\n.overflow-x-hidden {\n overflow-x: hidden;\n}
3\r\n.\\!overflow-y-scroll {\n overflow-y: scroll !important;\n}\r\n.scroll-smooth {\n scroll-behavior: smooth;\n}\r\n.truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\r\n.text-ellipsis {\n text-overflow: ellipsis;\n}\r\n.whitespace-nowrap {\n white-space: nowrap;\n}\r\n.whitespace-pre-wrap {\n white-space: pre-wrap;\n}\r\n.\\!rounded-lg {\n border-radius: 0.5rem !important;\n}\r\n.rounded {\n border-radius: 0.25rem;\n}\r\n.rounded-2xl {\n border-radius: 1rem;\n}\r\n.rounded-3xl {\n border-radius: 1.5rem;\n}\r\n.rounded-\\[2\\.5rem\\] {\n border-radius: 2.5rem;\n}\r\n.rounded-\\[2rem\\] {\n border-radius: 2rem;\n}\r\n.rounded-\\[32px\\] {\n border-radius: 32px;\n}\r\n.rounded-\\[3px\\] {\n border-radius: 3px;\n}\r\n.rounded-full {\n border-radius: 9999px;\n}\r\n.rounded-lg {\n border-radius: 0.5rem;\n}\r\n.rounded-md {\n border-radius: 0.375rem;\n}\r\n.rounded-xl {\n border-radius: 0.75rem;\n}\r\n.rounded-r-lg {\n border-top-right-radius: 0.5rem;\n border-bottom-right-radius: 0.5rem;\n}\r\n.rounded-tl-none {\n border-top-left-radius: 0px;\n}\r\n.rounded-tr-none {\n border-top-right-radius: 0px;\n}\r\n.border {\n border-width: 1px;\n}\r\n.border-2 {\n border-width: 2px;\n}\r\n.border-4 {\n border-width: 4px;\n}\r\n.border-b {\n border-bottom-width: 1px;\n}\r\n.border-l {\n border-left-width: 1px;\n}\r\n.border-l-4 {\n border-left-width: 4px;\n}\r\n.border-l-\\[2px\\] {\n border-left-width: 2px;\n}\r\n.border-l-\\[3px\\] {\n border-left-width: 3px;\n}\r\n.border-r {\n border-right-width: 1px;\n}\r\n.border-t {\n border-top-width: 1px;\n}\r\n.border-dashed {\n border-style: dashed;\n}\r\n.border-none {\n border-style: none;\n}\r\n.\\!border-purple-400 {\n --tw-border-opacity: 1 !important;\n border-color: rgb(192 132 252 / var(--tw-border-opacity, 1)) !important;\n}\r\n.\\!border-purple-500 {\n --tw-border-opacity: 1 !important;\n border-color: rgb(168 85 247 / var(--tw-border-opacity, 1)) !important;\n}\r\n.\\!border-red-100 {\n --tw-border-opacity: 1 !important;\n border-color: rgb(254 226 226 / var(--tw-border-opacity, 1)) !important;\n}\r\n.border-\\[\\#F8FAFC\\] {\n --tw-border-opacity: 1;\n border-color: rgb(248 250 252 / var(--tw-border-opacity, 1));\n}\r\n.border-amber-100 {\n --tw-border-opacity: 1;\n border-color: rgb(254 243 199 / var(--tw-border-opacity, 1));\n}\r\n.border-amber-200 {\n --tw-border-opacity: 1;\n border-color: rgb(253 230 138 / var(--tw-border-opacity, 1));\n}\r\n.border-amber-500 {\n --tw-border-opacity: 1;\n border-color: rgb(245 158 11 / var(--tw-border-opacity, 1));\n}\r\n.border-black\\/5 {\n border-color: rgb(0 0 0 / 0.05);\n}\r\n.border-blue-100 {\n --tw-border-opacity: 1;\n border-color: rgb(219 234 254 / var(--tw-border-opacity, 1));\n}\r\n.border-blue-200 {\n --tw-border-opacity: 1;\n border-color: rgb(191 219 254 / var(--tw-border-opacity, 1));\n}\r\n.border-blue-500 {\n --tw-border-opacity: 1;\n border-color: rgb(59 130 246 / var(--tw-border-opacity, 1));\n}\r\n.border-cyan-200 {\n --tw-border-opacity: 1;\n border-color: rgb(165 243 252 / var(--tw-border-opacity, 1));\n}\r\n.border-emerald-100 {\n --tw-border-opacity: 1;\n border-color: rgb(209 250 229 / var(--tw-border-opacity, 1));\n}\r\n.border-emerald-200 {\n --tw-border-opacity: 1;\n border-color: rgb(167 243 208 / var(--tw-border-opacity, 1));\n}\r\n.border-gray-100 {\n --tw-border-opacity: 1;\n border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));\n}\r\n.border-gray-200 {\n --tw-border-opacity: 1;\n border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));\n}\r\n.border-gray-200\\/50 {\n border-color: rgb(229 231 235 / 0.5);\n}\r\n.border-gray-300 {\n --tw-border-opacity: 1;\n border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));\n}\r\n.border-gray-50 {\n --tw-border-opacity: 1;\n border-color: rgb(249 250 251 / var(--tw-border-opacity, 1));\n}\r\n.border-gray-500 {\n --tw-border-opacity: 1;\n border-color: rgb(107 114 128 / var(--tw-border-opacity, 1));\n}\r\n.border-green-100 {\n --tw-border-opacity: 1;\n border-color: rgb(220 252 231 / var(--tw-border-opacity, 1));\n}\r\n.border-green-200 {\n --tw-border-opacity: 1;\n border-color: rgb(187 247 208 / var(--tw-border-opacity, 1));\n}\r\n.border-green-500 {\n --tw-border-opacity: 1;\n border-color: rgb(34 197 94 / var(--tw-border-opacity, 1));\n}\r\n.border-indigo-100 {\n --tw-border-opacity: 1;\n border-color: rgb(224 231 255 / var(--tw-border-opacity, 1));\n}\r\n.border-indigo-200 {\n --tw-border-opacity: 1;\n border-color: rgb(199 210 254 / var(--tw-border-opacity, 1));\n}\r\n.border-indigo-50 {\n --tw-border-opacity: 1;\n border-color: rgb(238 242 255 / var(--tw-border-opacity, 1));\n}\r\n.border-indigo-500 {\n --tw-border-opacity: 1;\n border-color: rgb(99 102 241 / var(--tw-border-opacity, 1));\n}\r\n.border-indigo-600 {\n --tw-border-opacity: 1;\n border-color: rgb(79 70 229 / var(--tw-border-opacity, 1));\n}\r\n.border-orange-200 {\n --tw-border-opacity: 1;\n border-color: rgb(254 215 170 / var(--tw-border-opacity, 1));\n}\r\n.border-pink-200 {\n --tw-border-opacity: 1;\n border-color: rgb(251 207 232 / var(--tw-border-opacity, 1));\n}\r\n.border-purple-100 {\n --tw-border-opacity: 1;\n border-color: rgb(243 232 255 / var(--tw-border-opacity, 1));\n}\r\n.border-purple-100\\/50 {\n border-color: rgb(243 232 255 / 0.5);\n}\r\n.border-purple-200 {\n --tw-border-opacity: 1;\n border-color: rgb(233 213 255 / var(--tw-border-opacity, 1));\n}\r\n.border-purple-200\\/50 {\n border-color: rgb(233 213 255 / 0.5);\n}\r\n.border-purple-500 {\n --tw-border-opacity: 1;\n border-color: rgb(168 85 247 / var(--tw-border-opacity, 1));\n}\r\n.border-purple-600 {\n --tw-border-opacity: 1;\n border-color: rgb(147 51 234 / var(--tw-border-opacity, 1));\n}\r\n.border-red-100 {\n --tw-border-opacity: 1;\n border-color: rgb(254 226 226 / var(--tw-border-opacity, 1));\n}\r\n.border-red-200 {\n --tw-border-opacity: 1;\n border-color: rgb(254 202 202 / var(--tw-border-opacity, 1));\n}\r\n.border-red-300 {\n --tw-border-opacity: 1;\n border-color: rgb(252 165 165 / var(--tw-border-opacity, 1));\n}\r\n.border-red-500 {\n --tw-border-opacity: 1;\n border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));\n}\r\n.border-rose-100 {\n --tw-border-opacity: 1;\n border-color: rgb(255 228 230 / var(--tw-border-opacity, 1));\n}\r\n.border-rose-200 {\n --tw-border-opacity: 1;\n border-color: rgb(254 205 211 / var(--tw-border-opacity, 1));\n}\r\n.border-slate-100 {\n --tw-border-opacity: 1;\n border-color: rgb(241 245 249 / var(--tw-border-opacity, 1));\n}\r\n.border-slate-100\\/50 {\n border-color: rgb(241 245 249 / 0.5);\n}\r\n.border-slate-200 {\n --tw-border-opacity: 1;\n border-color: rgb(226 232 240 / var(--tw-border-opacity, 1));\n}\r\n.border-slate-50 {\n --tw-border-opacity: 1;\n border-color: rgb(248 250 252 / var(--tw-border-opacity, 1));\n}\r\n.border-teal-200 {\n --tw-border-opacity: 1;\n border-color: rgb(153 246 228 / var(--tw-border-opacity, 1));\n}\r\n.border-transparent {\n border-color: transparent;\n}\r\n.border-violet-100 {\n --tw-border-opacity: 1;\n border-color: rgb(237 233 254 / var(--tw-border-opacity, 1));\n}\r\n.border-violet-200 {\n --tw-border-opacity: 1;\n border-color: rgb(221 214 254 / var(--tw-border-opacity, 1));\n}\r\n.border-white {\n --tw-border-opacity: 1;\n border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\r\n.border-yellow-200 {\n --tw-border-opacity: 1;\n border-color: rgb(254 240 138 / var(--tw-border-opacity, 1));\n}\r\n.border-t-indigo-600 {\n --tw-border-opacity: 1;\n border-top-color: rgb(79 70 229 / var(--tw-border-opacity, 1));\n}\r\n.\\!bg-slate-50 {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1)) !important;\n}\r\n.bg-\\[\\#F8FAFC\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\r\n.bg-\\[\\#f6f3ff\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(246 243 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-\\[\\#f8fbff\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(248 251 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-\\[\\#f9fafb\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));\n}\r\n.bg-amber-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 243 199 / var(--tw-bg-opacity, 1));\n}\r\n.bg-amber-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 251 235 / var(--tw-bg-opacity, 1));\n}\r\n.bg-amber-50\\/50 {\n background-color: rgb(255 251 235 / 0.5);\n}\r\n.bg-amber-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(245 158 11 / var(--tw-bg-opacity, 1));\n}\r\n.bg-amber-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(217 119 6 / var(--tw-bg-opacity, 1));\n}\r\n.bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n}\r\n.bg-black\\/40 {\n background-color: rgb(0 0 0 / 0.4);\n}\r\n.bg-black\\/50 {\n background-color: rgb(0 0 0 / 0.5);\n}\r\n.bg-blue-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(219 234 254 / var(--tw-bg-opacity, 1));\n}\r\n.bg-blue-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 246 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-blue-50\\/10 {\n background-color: rgb(239 246 255 / 0.1);\n}\r\n.bg-blue-50\\/50 {\n background-color: rgb(239 246 255 / 0.5);\n}\r\n.bg-blue-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));\n}\r\n.bg-blue-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));\n}\r\n.bg-cyan-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(207 250 254 / var(--tw-bg-opacity, 1));\n}\r\n.bg-cyan-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(236 254 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-cyan-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(6 182 212 / var(--tw-bg-opacity, 1));\n}\r\n.bg-emerald-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(209 250 229 / var(--tw-bg-opacity, 1));\n}\r\n.bg-emerald-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(236 253 245 / var(--tw-bg-opacity, 1));\n}\r\n.bg-emerald-50\\/10 {\n background-color: rgb(236 253 245 / 0.1);\n}\r\n.bg-emerald-50\\/50 {\n background-color: rgb(236 253 245 / 0.5);\n}\r\n.bg-emerald-50\\/70 {\n background-color: rgb(236 253 245 / 0.7);\n}\r\n.bg-emerald-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(16 185 129 / var(--tw-bg-opacity, 1));\n}\r\n.bg-emerald-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(5 150 105 / var(--tw-bg-opacity, 1));\n}\r\n.bg-gray-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));\n}\r\n.bg-gray-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));\n}\r\n.bg-gray-50\\/30 {\n background-color: rgb(249 250 251 / 0.3);\n}\r\n.bg-gray-50\\/50 {\n background-color: rgb(249 250 251 / 0.5);\n}\r\n.bg-gray-50\\/70 {\n background-color: rgb(249 250 251 / 0.7);\n}\r\n.bg-gray-50\\/80 {\n background-color: rgb(249 250 251 / 0.8);\n}\r\n.bg-gray-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1));\n}\r\n.bg-green-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(220 252 231 / var(--tw-bg-opacity, 1));\n}\r\n.bg-green-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(240 253 244 / var(--tw-bg-opacity, 1));\n}\r\n.bg-green-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(22 163 74 / var(--tw-bg-opacity, 1));\n}\r\n.bg-indigo-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(224 231 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-indigo-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(238 242 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-indigo-50\\/30 {\n background-color: rgb(238 242 255 / 0.3);\n}\r\n.bg-indigo-50\\/50 {\n background-color: rgb(238 242 255 / 0.5);\n}\r\n.bg-indigo-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(99 102 241 / var(--tw-bg-opacity, 1));\n}\r\n.bg-indigo-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(79 70 229 / var(--tw-bg-opacity, 1));\n}\r\n.bg-orange-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 237 213 / var(--tw-bg-opacity, 1));\n}\r\n.bg-orange-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 247 237 / var(--tw-bg-opacity, 1));\n}\r\n.bg-orange-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(249 115 22 / var(--tw-bg-opacity, 1));\n}\r\n.bg-pink-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(252 231 243 / var(--tw-bg-opacity, 1));\n}\r\n.bg-pink-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(253 242 248 / var(--tw-bg-opacity, 1));\n}\r\n.bg-pink-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(236 72 153 / var(--tw-bg-opacity, 1));\n}\r\n.bg-purple-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(243 232 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-purple-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(250 245 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-purple-50\\/30 {\n background-color: rgb(250 245 255 / 0.3);\n}\r\n.bg-purple-50\\/40 {\n background-color: rgb(250 245 255 / 0.4);\n}\r\n.bg-purple-50\\/50 {\n background-color: rgb(250 245 255 / 0.5);\n}\r\n.bg-purple-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(168 85 247 / var(--tw-bg-opacity, 1));\n}\r\n.bg-purple-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));\n}\r\n.bg-red-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));\n}\r\n.bg-red-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));\n}\r\n.bg-red-50\\/50 {\n background-color: rgb(254 242 242 / 0.5);\n}\r\n.bg-red-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(239 68 68 / var(--tw-bg-opacity, 1));\n}\r\n.bg-red-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(220 38 38 / var(--tw-bg-opacity, 1));\n}\r\n.bg-rose-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 228 230 / var(--tw-bg-opacity, 1));\n}\r\n.bg-rose-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 241 242 / var(--tw-bg-opacity, 1));\n}\r\n.bg-rose-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(244 63 94 / var(--tw-bg-opacity, 1));\n}\r\n.bg-sky-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(224 242 254 / var(--tw-bg-opacity, 1));\n}\r\n.bg-slate-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));\n}\r\n.bg-slate-100\\/50 {\n background-color: rgb(241 245 249 / 0.5);\n}\r\n.bg-slate-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\r\n.bg-slate-200\\/70 {\n background-color: rgb(226 232 240 / 0.7);\n}\r\n.bg-slate-200\\/80 {\n background-color: rgb(226 232 240 / 0.8);\n}\r\n.bg-slate-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}\r\n.bg-slate-50\\/30 {\n background-color: rgb(248 250 252 / 0.3);\n}\r\n.bg-slate-50\\/50 {\n background-color: rgb(248 250 252 / 0.5);\n}\r\n.bg-slate-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(100 116 139 / var(--tw-bg-opacity, 1));\n}\r\n.bg-slate-900\\/40 {\n background-color: rgb(15 23 42 / 0.4);\n}\r\n.bg-slate-900\\/50 {\n background-color: rgb(15 23 42 / 0.5);\n}\r\n.bg-teal-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(204 251 241 / var(--tw-bg-opacity, 1));\n}\r\n.bg-transparent {\n background-color: transparent;\n}\r\n.bg-violet-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(237 233 254 / var(--tw-bg-opacity, 1));\n}\r\n.bg-violet-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(245 243 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-violet-50\\/50 {\n background-color: rgb(245 243 255 / 0.5);\n}\r\n.bg-violet-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(124 58 237 / var(--tw-bg-opacity, 1));\n}\r\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\r\n.bg-white\\/20 {\n background-color: rgb(255 255 255 / 0.2);\n}\r\n.bg-white\\/60 {\n background-color: rgb(255 255 255 / 0.6);\n}\r\n.bg-yellow-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 249 195 / var(--tw-bg-opacity, 1));\n}\r\n.bg-yellow-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 252 232 / var(--tw-bg-opacity, 1));\n}\r\n.bg-yellow-500 {\n --tw-bg
3-opacity: 1;\n background-color: rgb(234 179 8 / var(--tw-bg-opacity, 1));\n}\r\n.bg-opacity-50 {\n --tw-bg-opacity: 0.5;\n}\r\n.bg-gradient-to-br {\n background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));\n}\r\n.bg-gradient-to-r {\n background-image: linear-gradient(to right, var(--tw-gradient-stops));\n}\r\n.bg-gradient-to-t {\n background-image: linear-gradient(to top, var(--tw-gradient-stops));\n}\r\n.from-\\[\\#f0f7ff\\] {\n --tw-gradient-from: #f0f7ff var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(240 247 255 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\r\n.from-\\[\\#f6f3ff\\] {\n --tw-gradient-from: #f6f3ff var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(246 243 255 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\r\n.from-black\\/20 {\n --tw-gradient-from: rgb(0 0 0 / 0.2) var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\r\n.from-indigo-50 {\n --tw-gradient-from: #eef2ff var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(238 242 255 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\r\n.from-purple-400 {\n --tw-gradient-from: #c084fc var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(192 132 252 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\r\n.from-purple-600 {\n --tw-gradient-from: #9333ea var(--tw-gradient-from-position);\n --tw-gradient-to: rgb(147 51 234 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n}\r\n.via-\\[\\#f6f3ff\\] {\n --tw-gradient-to: rgb(246 243 255 / 0) var(--tw-gradient-to-position);\n --tw-gradient-stops: var(--tw-gradient-from), #f6f3ff var(--tw-gradient-via-position), var(--tw-gradient-to);\n}\r\n.to-\\[\\#faf7ff\\] {\n --tw-gradient-to: #faf7ff var(--tw-gradient-to-position);\n}\r\n.to-\\[\\#fdfaff\\] {\n --tw-gradient-to: #fdfaff var(--tw-gradient-to-position);\n}\r\n.to-purple-50 {\n --tw-gradient-to: #faf5ff var(--tw-gradient-to-position);\n}\r\n.to-purple-600 {\n --tw-gradient-to: #9333ea var(--tw-gradient-to-position);\n}\r\n.to-transparent {\n --tw-gradient-to: transparent var(--tw-gradient-to-position);\n}\r\n.to-violet-600 {\n --tw-gradient-to: #7c3aed var(--tw-gradient-to-position);\n}\r\n.object-contain {\n -o-object-fit: contain;\n object-fit: contain;\n}\r\n.object-cover {\n -o-object-fit: cover;\n object-fit: cover;\n}\r\n.p-0 {\n padding: 0px;\n}\r\n.p-1 {\n padding: 0.25rem;\n}\r\n.p-1\\.5 {\n padding: 0.375rem;\n}\r\n.p-10 {\n padding: 2.5rem;\n}\r\n.p-2 {\n padding: 0.5rem;\n}\r\n.p-2\\.5 {\n padding: 0.625rem;\n}\r\n.p-20 {\n padding: 5rem;\n}\r\n.p-3 {\n padding: 0.75rem;\n}\r\n.p-4 {\n padding: 1rem;\n}\r\n.p-5 {\n padding: 1.25rem;\n}\r\n.p-6 {\n padding: 1.5rem;\n}\r\n.p-8 {\n padding: 2rem;\n}\r\n.p-\\[22px\\] {\n padding: 22px;\n}\r\n.\\!px-4 {\n padding-left: 1rem !important;\n padding-right: 1rem !important;\n}\r\n.px-0 {\n padding-left: 0px;\n padding-right: 0px;\n}\r\n.px-1 {\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n}\r\n.px-1\\.5 {\n padding-left: 0.375rem;\n padding-right: 0.375rem;\n}\r\n.px-10 {\n padding-left: 2.5rem;\n padding-right: 2.5rem;\n}\r\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\r\n.px-2\\.5 {\n padding-left: 0.625rem;\n padding-right: 0.625rem;\n}\r\n.px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n}\r\n.px-3\\.5 {\n padding-left: 0.875rem;\n padding-right: 0.875rem;\n}\r\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\r\n.px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n}\r\n.px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n}\r\n.px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n}\r\n.py-0 {\n padding-top: 0px;\n padding-bottom: 0px;\n}\r\n.py-0\\.5 {\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n}\r\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\r\n.py-1\\.5 {\n padding-top: 0.375rem;\n padding-bottom: 0.375rem;\n}\r\n.py-10 {\n padding-top: 2.5rem;\n padding-bottom: 2.5rem;\n}\r\n.py-12 {\n padding-top: 3rem;\n padding-bottom: 3rem;\n}\r\n.py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n}\r\n.py-2\\.5 {\n padding-top: 0.625rem;\n padding-bottom: 0.625rem;\n}\r\n.py-20 {\n padding-top: 5rem;\n padding-bottom: 5rem;\n}\r\n.py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n}\r\n.py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n}\r\n.py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n}\r\n.py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n}\r\n.py-8 {\n padding-top: 2rem;\n padding-bottom: 2rem;\n}\r\n.pb-12 {\n padding-bottom: 3rem;\n}\r\n.pb-2 {\n padding-bottom: 0.5rem;\n}\r\n.pb-4 {\n padding-bottom: 1rem;\n}\r\n.pb-8 {\n padding-bottom: 2rem;\n}\r\n.pl-10 {\n padding-left: 2.5rem;\n}\r\n.pl-11 {\n padding-left: 2.75rem;\n}\r\n.pl-12 {\n padding-left: 3rem;\n}\r\n.pl-4 {\n padding-left: 1rem;\n}\r\n.pl-9 {\n padding-left: 2.25rem;\n}\r\n.pr-1 {\n padding-right: 0.25rem;\n}\r\n.pr-10 {\n padding-right: 2.5rem;\n}\r\n.pr-12 {\n padding-right: 3rem;\n}\r\n.pr-2 {\n padding-right: 0.5rem;\n}\r\n.pr-4 {\n padding-right: 1rem;\n}\r\n.pr-9 {\n padding-right: 2.25rem;\n}\r\n.pt-0\\.5 {\n padding-top: 0.125rem;\n}\r\n.pt-1 {\n padding-top: 0.25rem;\n}\r\n.pt-2 {\n padding-top: 0.5rem;\n}\r\n.pt-4 {\n padding-top: 1rem;\n}\r\n.pt-6 {\n padding-top: 1.5rem;\n}\r\n.pt-8 {\n padding-top: 2rem;\n}\r\n.text-left {\n text-align: left;\n}\r\n.text-center {\n text-align: center;\n}\r\n.text-right {\n text-align: right;\n}\r\n.font-mono {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n}\r\n.text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n}\r\n.text-3xl {\n font-size: 1.875rem;\n line-height: 2.25rem;\n}\r\n.text-4xl {\n font-size: 2.25rem;\n line-height: 2.5rem;\n}\r\n.text-\\[10px\\] {\n font-size: 10px;\n}\r\n.text-\\[11px\\] {\n font-size: 11px;\n}\r\n.text-\\[14px\\] {\n font-size: 14px;\n}\r\n.text-\\[15px\\] {\n font-size: 15px;\n}\r\n.text-\\[16px\\] {\n font-size: 16px;\n}\r\n.text-\\[17px\\] {\n font-size: 17px;\n}\r\n.text-\\[20px\\] {\n font-size: 20px;\n}\r\n.text-\\[24px\\] {\n font-size: 24px;\n}\r\n.text-\\[64px\\] {\n font-size: 64px;\n}\r\n.text-\\[7px\\] {\n font-size: 7px;\n}\r\n.text-\\[8px\\] {\n font-size: 8px;\n}\r\n.text-\\[9px\\] {\n font-size: 9px;\n}\r\n.text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n}\r\n.text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n}\r\n.text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n}\r\n.text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n}\r\n.text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n}\r\n.font-black {\n font-weight: 900;\n}\r\n.font-bold {\n font-weight: 700;\n}\r\n.font-medium {\n font-weight: 500;\n}\r\n.font-normal {\n font-weight: 400;\n}\r\n.font-semibold {\n font-weight: 600;\n}\r\n.\\!uppercase {\n text-transform: uppercase !important;\n}\r\n.uppercase {\n text-transform: uppercase;\n}\r\n.lowercase {\n text-transform: lowercase;\n}\r\n.capitalize {\n text-transform: capitalize;\n}\r\n.normal-case {\n text-transform: none;\n}\r\n.italic {\n font-style: italic;\n}\r\n.not-italic {\n font-style: normal;\n}\r\n.leading-none {\n line-height: 1;\n}\r\n.leading-relaxed {\n line-height: 1.625;\n}\r\n.leading-snug {\n line-height: 1.375;\n}\r\n.leading-tight {\n line-height: 1.25;\n}\r\n.tracking-tight {\n letter-spacing: -0.025em;\n}\r\n.tracking-tighter {\n letter-spacing: -0.05em;\n}\r\n.tracking-wide {\n letter-spacing: 0.025em;\n}\r\n.tracking-wider {\n letter-spacing: 0.05em;\n}\r\n.tracking-widest {\n letter-spacing: 0.1em;\n}\r\n.\\!text-red-500 {\n --tw-text-opacity: 1 !important;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1)) !important;\n}\r\n.text-\\[\\#1f2545\\] {\n --tw-text-opacity: 1;\n color: rgb(31 37 69 / var(--tw-text-opacity, 1));\n}\r\n.text-\\[\\#7a7f99\\] {\n --tw-text-opacity: 1;\n color: rgb(122 127 153 / var(--tw-text-opacity, 1));\n}\r\n.text-amber-500 {\n --tw-text-opacity: 1;\n color: rgb(245 158 11 / var(--tw-text-opacity, 1));\n}\r\n.text-amber-600 {\n --tw-text-opacity: 1;\n color: rgb(217 119 6 / var(--tw-text-opacity, 1));\n}\r\n.text-amber-700 {\n --tw-text-opacity: 1;\n color: rgb(180 83 9 / var(--tw-text-opacity, 1));\n}\r\n.text-amber-800 {\n --tw-text-opacity: 1;\n color: rgb(146 64 14 / var(--tw-text-opacity, 1));\n}\r\n.text-blue-500 {\n --tw-text-opacity: 1;\n color: rgb(59 130 246 / var(--tw-text-opacity, 1));\n}\r\n.text-blue-600 {\n --tw-text-opacity: 1;\n color: rgb(37 99 235 / var(--tw-text-opacity, 1));\n}\r\n.text-blue-700 {\n --tw-text-opacity: 1;\n color: rgb(29 78 216 / var(--tw-text-opacity, 1));\n}\r\n.text-cyan-600 {\n --tw-text-opacity: 1;\n color: rgb(8 145 178 / var(--tw-text-opacity, 1));\n}\r\n.text-cyan-700 {\n --tw-text-opacity: 1;\n color: rgb(14 116 144 / var(--tw-text-opacity, 1));\n}\r\n.text-cyan-800 {\n --tw-text-opacity: 1;\n color: rgb(21 94 117 / var(--tw-text-opacity, 1));\n}\r\n.text-cyan-900 {\n --tw-text-opacity: 1;\n color: rgb(22 78 99 / var(--tw-text-opacity, 1));\n}\r\n.text-emerald-500 {\n --tw-text-opacity: 1;\n color: rgb(16 185 129 / var(--tw-text-opacity, 1));\n}\r\n.text-emerald-600 {\n --tw-text-opacity: 1;\n color: rgb(5 150 105 / var(--tw-text-opacity, 1));\n}\r\n.text-emerald-700 {\n --tw-text-opacity: 1;\n color: rgb(4 120 87 / var(--tw-text-opacity, 1));\n}\r\n.text-emerald-900 {\n --tw-text-opacity: 1;\n color: rgb(6 78 59 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-200 {\n --tw-text-opacity: 1;\n color: rgb(229 231 235 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-300 {\n --tw-text-opacity: 1;\n color: rgb(209 213 219 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-400 {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-500 {\n --tw-text-opacity: 1;\n color: rgb(107 114 128 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-600 {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-700 {\n --tw-text-opacity: 1;\n color: rgb(55 65 81 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-800 {\n --tw-text-opacity: 1;\n color: rgb(31 41 55 / var(--tw-text-opacity, 1));\n}\r\n.text-gray-900 {\n --tw-text-opacity: 1;\n color: rgb(17 24 39 / var(--tw-text-opacity, 1));\n}\r\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\r\n.text-green-700 {\n --tw-text-opacity: 1;\n color: rgb(21 128 61 / var(--tw-text-opacity, 1));\n}\r\n.text-green-900 {\n --tw-text-opacity: 1;\n color: rgb(20 83 45 / var(--tw-text-opacity, 1));\n}\r\n.text-indigo-300 {\n --tw-text-opacity: 1;\n color: rgb(165 180 252 / var(--tw-text-opacity, 1));\n}\r\n.text-indigo-500 {\n --tw-text-opacity: 1;\n color: rgb(99 102 241 / var(--tw-text-opacity, 1));\n}\r\n.text-indigo-600 {\n --tw-text-opacity: 1;\n color: rgb(79 70 229 / var(--tw-text-opacity, 1));\n}\r\n.text-indigo-700 {\n --tw-text-opacity: 1;\n color: rgb(67 56 202 / var(--tw-text-opacity, 1));\n}\r\n.text-indigo-800 {\n --tw-text-opacity: 1;\n color: rgb(55 48 163 / var(--tw-text-opacity, 1));\n}\r\n.text-indigo-900 {\n --tw-text-opacity: 1;\n color: rgb(49 46 129 / var(--tw-text-opacity, 1));\n}\r\n.text-orange-600 {\n --tw-text-opacity: 1;\n color: rgb(234 88 12 / var(--tw-text-opacity, 1));\n}\r\n.text-orange-800 {\n --tw-text-opacity: 1;\n color: rgb(154 52 18 / var(--tw-text-opacity, 1));\n}\r\n.text-orange-900 {\n --tw-text-opacity: 1;\n color: rgb(124 45 18 / var(--tw-text-opacity, 1));\n}\r\n.text-pink-600 {\n --tw-text-opacity: 1;\n color: rgb(219 39 119 / var(--tw-text-opacity, 1));\n}\r\n.text-pink-800 {\n --tw-text-opacity: 1;\n color: rgb(157 23 77 / var(--tw-text-opacity, 1));\n}\r\n.text-pink-900 {\n --tw-text-opacity: 1;\n color: rgb(131 24 67 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-200 {\n --tw-text-opacity: 1;\n color: rgb(233 213 255 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-300 {\n --tw-text-opacity: 1;\n color: rgb(216 180 254 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-400 {\n --tw-text-opacity: 1;\n color: rgb(192 132 252 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-500 {\n --tw-text-opacity: 1;\n color: rgb(168 85 247 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-600 {\n --tw-text-opacity: 1;\n color: rgb(147 51 234 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-700 {\n --tw-text-opacity: 1;\n color: rgb(126 34 206 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-800 {\n --tw-text-opacity: 1;\n color: rgb(107 33 168 / var(--tw-text-opacity, 1));\n}\r\n.text-purple-900 {\n --tw-text-opacity: 1;\n color: rgb(88 28 135 / var(--tw-text-opacity, 1));\n}\r\n.text-red-400 {\n --tw-text-opacity: 1;\n color: rgb(248 113 113 / var(--tw-text-opacity, 1));\n}\r\n.text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\r\n.text-red-600 {\n --tw-text-opacity: 1;\n color: rgb(220 38 38 / var(--tw-text-opacity, 1));\n}\r\n.text-red-700 {\n --tw-text-opacity: 1;\n color: rgb(185 28 28 / var(--tw-text-opacity, 1));\n}\r\n.text-rose-400 {\n --tw-text-opacity: 1;\n color: rgb(251 113 133 / var(--tw-text-opacity, 1));\n}\r\n.text-rose-500 {\n --tw-text-opacity: 1;\n color: rgb(244 63 94 / var(--tw-text-opacity, 1));\n}\r\n.text-rose-600 {\n --tw-text-opacity: 1;\n color: rgb(225 29 72 / var(--tw-text-opacity, 1));\n}\r\n.text-rose-800 {\n --tw-text-opacity: 1;
3\n color: rgb(159 18 57 / var(--tw-text-opacity, 1));\n}\r\n.text-rose-900 {\n --tw-text-opacity: 1;\n color: rgb(136 19 55 / var(--tw-text-opacity, 1));\n}\r\n.text-sky-600 {\n --tw-text-opacity: 1;\n color: rgb(2 132 199 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-200 {\n --tw-text-opacity: 1;\n color: rgb(226 232 240 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-300 {\n --tw-text-opacity: 1;\n color: rgb(203 213 225 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-500 {\n --tw-text-opacity: 1;\n color: rgb(100 116 139 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-600 {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-700 {\n --tw-text-opacity: 1;\n color: rgb(51 65 85 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-800 {\n --tw-text-opacity: 1;\n color: rgb(30 41 59 / var(--tw-text-opacity, 1));\n}\r\n.text-slate-900 {\n --tw-text-opacity: 1;\n color: rgb(15 23 42 / var(--tw-text-opacity, 1));\n}\r\n.text-teal-700 {\n --tw-text-opacity: 1;\n color: rgb(15 118 110 / var(--tw-text-opacity, 1));\n}\r\n.text-violet-500 {\n --tw-text-opacity: 1;\n color: rgb(139 92 246 / var(--tw-text-opacity, 1));\n}\r\n.text-violet-700 {\n --tw-text-opacity: 1;\n color: rgb(109 40 217 / var(--tw-text-opacity, 1));\n}\r\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\r\n.text-white\\/80 {\n color: rgb(255 255 255 / 0.8);\n}\r\n.text-yellow-700 {\n --tw-text-opacity: 1;\n color: rgb(161 98 7 / var(--tw-text-opacity, 1));\n}\r\n.text-yellow-800 {\n --tw-text-opacity: 1;\n color: rgb(133 77 14 / var(--tw-text-opacity, 1));\n}\r\n.text-yellow-900 {\n --tw-text-opacity: 1;\n color: rgb(113 63 18 / var(--tw-text-opacity, 1));\n}\r\n.underline {\n text-decoration-line: underline;\n}\r\n.opacity-10 {\n opacity: 0.1;\n}\r\n.opacity-25 {\n opacity: 0.25;\n}\r\n.opacity-40 {\n opacity: 0.4;\n}\r\n.opacity-50 {\n opacity: 0.5;\n}\r\n.opacity-70 {\n opacity: 0.7;\n}\r\n.opacity-75 {\n opacity: 0.75;\n}\r\n.opacity-80 {\n opacity: 0.8;\n}\r\n.shadow-2xl {\n --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
3\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}\r\n.shadow-\\[0_0_4px_rgba\\(168\\2c 85\\2c 247\\2c 0\\.8\\)\\] {\n --tw-shadow: 0 0 4px rgba(168,85,247,0.8);\n --tw-shadow-colored: 0 0 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}\r\n.shadow-\\[0_1px_3px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.08\\)\\] {\n --tw-shadow: 0 1px 3px rgba(0,0,0,0.08);\n --tw-shadow-colored: 0 1px 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}\r\n.shadow-inner {\n --tw-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: inset 0 2px 4px 0 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}\r\n.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);
3\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}\r\n.shadow-md {\n --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px 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}\r\n.shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 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}\r\n.shadow-xl {\n --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-sha
3dow);\n}\r\n.shadow-amber-100 {\n --tw-shadow-color: #fef3c7;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-blue-100 {\n --tw-shadow-color: #dbeafe;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-emerald-100 {\n --tw-shadow-color: #d1fae5;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-emerald-200 {\n --tw-shadow-color: #a7f3d0;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-indigo-100 {\n --tw-shadow-color: #e0e7ff;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-purple-100 {\n --tw-shadow-color: #f3e8ff;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-purple-200 {\n --tw-shadow-color: #e9d5ff;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-red-100 {\n --tw-shadow-color: #fee2e2;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-red-200 {\n --tw-shadow-color: #fecaca;\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-slate-200\\/50 {\n --tw-shadow-color: rgb(226 232 240 / 0.5);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.shadow-slate-900\\/20 {\n --tw-shadow-color: rgb(15 23 42 / 0.2);
3\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n.outline-none {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\r\n.outline {\n outline-style: solid;\n}\r\n.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}\r\n.ring-2 {\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}\r\n.ring-4 {\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(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-sha
3dow, 0 0 #0000);\n}\r\n.ring-purple-100\\/50 {\n --tw-ring-color: rgb(243 232 255 / 0.5);\n}\r\n.ring-purple-500\\/10 {\n --tw-ring-color: rgb(168 85 247 / 0.1);\n}\r\n.ring-purple-600\\/20 {\n --tw-ring-color: rgb(147 51 234 / 0.2);\n}\r\n.ring-white {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity, 1));\n}\r\n.brightness-0 {\n --tw-brightness: brightness(0);\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}\r\n.invert {\n --tw-invert: invert(100%);\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}\r\n.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}\r\n.backdrop-blur-sm {\n --tw-backdrop-blur: blur(4px);\n backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n}\r\n.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}\r\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\r\n.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}\r\n.transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\r\n.transition-shadow {\n transition-property: box-shadow;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\r\n.transition-transform {\n transition-property: transform;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\r\n.duration-1000 {\n transition-duration: 1000ms;\n}\r\n.duration-200 {\n transition-duration: 200ms;\n}\r\n.duration-300 {\n transition-duration: 300ms;\n}\r\n.duration-500 {\n transition-duration: 500ms;\n}\r\n.ease-out {\n transition-timing-function: cubic-bezier(0, 0, 0.2, 1);\n}\r\n.scrollbar-hide::-webkit-scrollbar {\r\n display: none !important;\r\n }\r\n.scrollbar-hide {\r\n -ms-overflow-style: none !important;\r\n scrollbar-width: none !important;\r\n }\r\n.animate-in {\r\n animation-duration: var(--animation-duration, 200ms);\r\n animation-fill-mode: forwards;\r\n }\r\n.fade-in {\r\n animation-name: fadeIn;\r\n }\r\n.slide-in-from-top-2 {\r\n animation-name: slideInFromTop;\r\n }\r\n@keyframes fadeIn {\r\n from { opacity: 0; }\r\n to { opacity: 1; }\r\n }\r\n@keyframes slideInFromTop {\r\n from { transform: translateY(-0.5rem); opacity: 0; }\r\n to { transform: translateY(0); opacity: 1; }\r\n }\r\n.\\[animation-delay\\:-0\\.15s\\] {\n animation-delay: -0.15s;\n}\r\n.\\[animation-delay\\:-0\\.3s\\] {\n animation-delay: -0.3s;\n}\r\n\r\n:root {\r\n font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\r\n line-height: 1.5;\r\n font-weight: 400;\r\n color: #1b1b1f;\r\n background-color: #edf1f7;\r\n text-rendering: optimizeLegibility;\r\n -webkit-font-smoothing: antialiased;\r\n -moz-osx-font-smoothing: grayscale;\r\n}\r\n\r\n*,\r\n*::before,\r\n*::after {\r\n box-sizing: border-box;\r\n}\r\n\r\nbody {\r\n margin: 0;\r\n min-height: 100vh;\r\n background-color: #edf1f7;\r\n}\r\n\r\n#app {\r\n min-height: 100vh;\r\n}\r\n\r\n.app-shell {\r\n display: flex;\r\n background: #f6f8fa;\r\n min-height: 100vh;\r\n}\r\n\r\n/* Purple themed header/topbar */\r\n.topbar {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 16px 24px;\r\n margin: 10px 0 18px 0;\r\n background: linear-gradient(180deg, #ffffff 0%, #faf7ff 100%);\r\n border: 1px solid #efe9ff;\r\n border-radius: 16px;\r\n box-shadow: 0 8px 24px rgba(141, 98, 255, 0.08);\r\n}\r\n\r\n.topbar .breadcrumb {\r\n color: #7a7f99;\r\n font-weight: 600;\r\n}\r\n\r\n.topbar .breadcrumb .sep {\r\n margin: 0 6px;\r\n color: #c1c6d6;\r\n}\r\n\r\n.topbar-right {\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n}\r\n\r\n.topbar .search {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n background: #fff;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n padding: 8px 10px;\r\n}\r\n\r\n.search-input {\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n font-size: 1rem;\r\n min-width: 180px;\r\n}\r\n\r\n.icon-btn {\r\n border: 1px solid #ece8ff;\r\n background: #fff;\r\n border-radius: 12px;\r\n padding: 8px 10px;\r\n cursor: pointer;\r\n}\r\n\r\n.user-chip {\r\n width: 34px;\r\n height: 34px;\r\n border-radius: 10px;\r\n background: #ece6ff;\r\n color: #6b4bff;\r\n display: grid;\r\n place-items: center;\r\n font-weight: 700;\r\n}\r\n\r\n/* Sidebar purple tone */\r\n.sidebar {\r\n background: linear-gradient(180deg, #fbf9ff 0%, #f4f0ff 100%);\r\n color: #1f2a44;\r\n border-right: 1px solid #ece8ff;\r\n box-shadow: 0 3px 24px 0 rgba(36, 37, 60, 0.10);\r\n display: flex;\r\n flex-direction: column;\r\n height: 100vh;\r\n min-width: 250px;\r\n max-width: none;\r\n padding-top: 0;\r\n padding-right: 16px;\r\n padding-bottom: 16px;\r\n padding-left: 16px;\r\n z-index: 10;\r\n}\r\n\r\n.sidebar.collapsed {\r\n /* background maintained from .
3sidebar */\r\n}\r\n\r\n.sidebar.open {\r\n background: linear-gradient(160deg, #23233c 0%, #274275 100%);\r\n}\r\n\r\n.sidebar-header {\r\n padding: 28px 20px 14px 20px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 8px;\r\n}\r\n\r\n.brand {\r\n display: flex;\r\n gap: 10px;\r\n align-items: center;\r\n transition: opacity 0.13s;\r\n}\r\n\r\n.sidebar.collapsed .brand div:not(.brand-avatar) {\r\n display: none;\r\n}\r\n\r\n.brand-avatar {\r\n width: 38px;\r\n height: 38px;\r\n border-radius: 11px;\r\n background: #242843;\r\n font-weight: 600;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #53b6fd;\r\n font-size: 1.1rem;\r\n letter-spacing: .03em;\r\n}\r\n\r\n.brand strong {\r\n font-size: 1rem;\r\n font-weight: 600;\r\n color: #e1e7f2;\r\n display: block;\r\n}\r\n\r\n.brand span {\r\n color: #8c99b9;\r\n font-size: 0.89rem;\r\n}\r\n\r\n.sidebar-toggle-btn {\r\n background: #242843;\r\n color: #a7b1c7;\r\n border: none;\r\n border-radius: 8px;\r\n width: 34px;\r\n height: 34px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n margin-left: auto;\r\n margin-right: 0;\r\n transition: background 0.17s;\r\n}\r\n\r\n.sidebar-toggle-btn:hover {\r\n background: #25283a;\r\n color: #53b6fd;\r\n}\r\n\r\n.nav {\r\n display: flex;\r\n flex-direction: column;\r\n padding: 0;\r\n gap: 3px;\r\n flex: 1;\r\n}\r\n\r\n.nav-item {\r\n border: none;\r\n background: none;\r\n color: #5e6281;\r\n padding: 11px 10px 11px 16px;\r\n border-radius: 8px;\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n font-weight: 500;\r\n font-size: 1.02rem;\r\n margin-bottom: 3.5px;\r\n transition: background 0.14s, color 0.14s;\r\n cursor: pointer;\r\n width: 100%;\r\n box-shadow: none;\r\n letter-spacing: 0.01em;\r\n}\r\n\r\n.nav-item.active,\r\n.nav-item:focus {\r\n background: #eee8ff;\r\n color: #6b4bff;\r\n}\r\n\r\n.nav-item:hover:not(.active) {\r\n background: #f3eeff;\r\n color: #6b4bff;\r\n}\r\n\r\n.nav-item-inner {\r\n display: flex;\r\n align-items: center;\r\n gap: 15px;\r\n width: 100%;\r\n justify-content: flex-start;\r\n}\r\n\r\n.nav-item-label {\r\n color: #e1e7f2;\r\n font-size: 0.97rem;\r\n}\r\n\r\n.sidebar.collapsed .nav-item-label {\r\n display: none;\r\n}\r\n\r\n.logout-btn {\r\n background: #232745;\r\n color: #e1e7f2;\r\n border: none;\r\n border-radius: 13px;\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n font-weight: 500;\r\n font-size: 1rem;\r\n padding: 10px 22px 10px 12px;\r\n cursor: pointer;\r\n margin-top: 6px;\r\n margin-bottom: 4px;\r\n transition: background 0.12s, color 0.15s;\r\n}\r\n\r\n.logout-btn:hover {\r\n background: #2a3357;\r\n color: #53b6fd;\r\n}\r\n\r\n.logout-label {\r\n font-size: 1rem;\r\n color: #e1e7f2;\r\n margin-left: 6px;\r\n}\r\n\r\n.sidebar.collapsed .logout-label {\r\n display: none;\r\n}\r\n\r\n.content {\r\n width: 100vw;\r\n min-height: 100vh;\r\n background: #f6f3ff;\r\n padding: 0;\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: column;\r\n transition: none;\r\n}\r\n\r\n.sidebar.open~.content {\r\n margin-left: 250px;\r\n}\r\n\r\n.sidebar.collapsed~.content {\r\n margin-left: 64px;\r\n}\r\n\r\n.main-inner {\r\n margin: 0;\r\n width: 100%;\r\n min-height: 80vh;\r\n box-sizing: border-box;\r\n padding: 0 42px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: stretch;\r\n}\r\n\r\n.panel {\r\n border-radius: 28px;\r\n box-shadow: 0 12px 56px 0 rgba(23, 24, 65, 0.13);\r\n padding: 32px 32px;\r\n margin: 22px;\r\n background: #fff;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 24px;\r\n align-items: stretch;\r\n min-height: 0;\r\n}\r\n\r\n/* Panels with conversation-shell or assistant-panel should fit viewport */\r\n.panel.conversation-panel-wrapper,\r\n.panel.assistant-panel {\r\n height: calc(100vh - 86px - 64px);\r\n max-height: calc(100vh - 86px - 64px);\r\n overflow: hidden;\r\n}\r\n\r\n.panel-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-start;\r\n gap: 24px;\r\n padding-bottom: 24px;\r\n border-bottom: 1px solid #f0f3f6;\r\n}\r\n\r\n.panel-header>div:first-child {\r\n flex: 1;\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.panel-header h2 {\r\n margin: 0;\r\n font-size: 1.25rem;\r\n font-weight: 700;\r\n color: #1f2545;\r\n letter-spacing: -0.01em;\r\n}\r\n\r\n.panel-header p {\r\n margin: 0;\r\n font-size: 1rem;\r\n color: #7a7f99;\r\n line-height: 1.5;\r\n}\r\n\r\n.panel-header .actions {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n}\r\n\r\n.panel-header .search-wrapper {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n background: #fff;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n min-width: 280px;\r\n transition: all 0.2s ease;\r\n}\r\n\r\n.panel-header .search-wrapper:focus-within {\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.panel-header .search-wrapper .search-icon {\r\n position: absolute;\r\n left: 14px;\r\n color: #7a7f99;\r\n pointer-events: none;\r\n z-index: 1;\r\n}\r\n\r\n.panel-header .search-wrapper:focus-within .search-icon {\r\n color: #6b4bff;\r\n}\r\n\r\n.panel-header .search {\r\n width: 100%;\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n padding: 10px 16px 10px 44px;\r\n font-size: 0.95rem;\r\n color: #1f2545;\r\n transition: all 0.2s ease;\r\n}\r\n\r\n.panel-header .search::-moz-placeholder {\r\n color: #c1c6d6;\r\n}\r\n\r\n.panel-header .search::placeholder {\r\n color: #c1c6d6;\r\n}\r\n\r\n.mobile-search-wrapper {\r\n display: none;\r\n}\r\n\r\n.panel-actions {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n flex-wrap: wrap;\r\n}\r\n\r\n.panel-header .panel-actions {\r\n align-items: center;\r\n margin-left: auto;\r\n flex-shrink: 0;\r\n}\r\n\r\n.panel-header .panel-actions .button {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n box-sizing: border-box;\r\n}\r\n\r\n.panel-header .panel-actions .button.primary {\r\n flex-shrink: 0;\r\n width: auto;\r\n}\r\n\r\n.button {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 8px;\r\n padding: 10px 16px;\r\n border-radius: 12px;\r\n font-size: 0.95rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n border: none;\r\n white-space: nowrap;\r\n}\r\n\r\n.panel-header .panel-actions .button.primary {\r\n white-space: normal;\r\n word-wrap: break-word;\r\n text-align: center;\r\n}\r\n\r\n@media (max-width: 700px) {\r\n .panel-header .panel-actions .button.primary {\r\n font-size: 0.875rem;\r\n padding: 10px 12px;\r\n }\r\n}\r\n\r\n.button.secondary {\r\n background: #f1f5f9;\r\n color: #384066;\r\n border: 1px solid #e2e8f0;\r\n}\r\n\r\n.button.secondary:hover:not(:disabled) {\r\n background: #e2e8f0;\r\n color: #1f2545;\r\n}\r\n\r\n.button.secondary:disabled {\r\n opacity: 0.5;
3\r\n cursor: not-allowed;\r\n}\r\n\r\n.button.primary {\r\n background: #6b4bff;\r\n color: #ffffff;\r\n}\r\n\r\n.button.primary:hover:not(:disabled) {\r\n background: #5a3fe6;\r\n transform: translateY(-1px);\r\n box-shadow: 0 4px 12px rgba(107, 75, 255, 0.3);\r\n}\r\n\r\n.button.primary:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\n.button svg {\r\n flex-shrink: 0;\r\n}\r\n\r\n.button.secondary:has(svg:only-child) {\r\n padding: 0;\r\n width: 44px;\r\n height: 44px;\r\n flex-shrink: 0;\r\n min-width: 44px;\r\n min-height: 44px;\r\n}\r\n\r\n.grid.cards {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 24px;\r\n}\r\n\r\n.stat-card {\r\n background: rgba(255, 255, 255, 0.90);\r\n border-radius: 22px;\r\n border: 1.2px solid #e3e6f0;\r\n box-shadow: 0 8px 32px rgba(60, 80, 190, 0.07);\r\n display: flex;\r\n flex-direction: column;\r\n gap: 11px;\r\n padding: 24px;\r\n min-width: 0;\r\n}\r\n\r\n.stat-card header {\r\n color: #687292;\r\n font-size: 0.97rem;\r\n text-transform: uppercase;\r\n letter-spacing: 0.08em;\r\n font-weight: 500;\r\n margin-bottom: 10px;\r\n}\r\n\r\n.stat-card .value {\r\n font-size: 2.18rem;\r\n font-weight: 700;\r\n color: #1d263b;\r\n margin-bottom: 10px;\r\n}\r\n\r\n.stat-card footer {\r\n color: #9ca3af;\r\n font-size: 0.96rem;\r\n margin-top: 2px;\r\n font-weight: 400;\r\n}\r\n\r\n.grid.split {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 24px;\r\n}\r\n\r\n.panel-section {\r\n background: #fbfcfd;\r\n border-radius: 20px;\r\n box-shadow: 0 2px 14px rgba(60, 80, 190, 0.07);\r\n padding: 30px 24px 24px 24px;\r\n border: 1px solid #e3e6f0;\r\n margin: 0;\r\n min-width: 0;\r\n}\r\n\r\n/* Remove top border and drop shadow from Lead Status Mix section */\r\n.panel-section:nth-of-type(2) {\r\n border-top: none;\r\n box-shadow: none;\r\n}\r\n\r\n/* Add top border to second mobile-box in stats-to-sections */\r\n.stats-to-sections .mobile-box:nth-of-type(2) {\r\n border-top: 1px solid rgba(148, 163, 184, 0.25) !important;\r\n}\r\n\r\n.section-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n border-bottom: 1px solid #e3e6f0;\r\n gap: 8px;\r\n margin-bottom: 24px;\r\n}\r\n\r\n.section-title {\r\n margin: 0;\r\n font-size: 1.25rem;\r\n font-weight: 700;\r\n color: #1f2545;\r\n letter-spacing: -0.01em;\r\n}\r\n\r\n/* Style h3 titles in panel-section to match section-title */\r\n.panel-section h3 {\r\n margin: 0 0 22px 0;\r\n font-size: 1rem;\r\n font-weight: 600;\r\n color: #1f2545;\r\n letter-spacing: -0.01em;\r\n}\r\n\r\n.link-btn {\r\n color: #2563eb;\r\n font-weight: 500;\r\n font-size: 0.99rem;\r\n border-radius: 8px;\r\n border: none;\r\n background: transparent;\r\n padding: 4px 11px;\r\n cursor: pointer;\r\n transition: color 0.14s, background 0.16s;\r\n}\r\n\r\n.link-btn:hover {\r\n background: #e7eeff;\r\n color: #13439a;\r\n}\r\n\r\n.lead-list,\r\n.event-list {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 13px;\r\n}\r\n\r\n.lead-list li {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-start;\r\n gap: 12px;\r\n padding-bottom: 10px;\r\n border-bottom: 1px solid #e3e6f0;\r\n}\r\n\r\n.lead-info {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-start;\r\n flex: 1;\r\n min-width: 0;\r\n}\r\n\r\n.lead-info strong {\r\n display: block;\r\n font-size: 1rem;\r\n margin-bottom: 4px;\r\n}\r\n\r\n.lead-info span {\r\n color: #828597;\r\n font-size: 0.89rem;\r\n}\r\n\r\n.lead-meta {\r\n display: flex;\r\n flex-direction: row;\r\n flex-wrap: wrap;\r\n justify-content: flex-end;\r\n align-items: flex-start;\r\n gap: 6px 8px;\r\n flex-shrink: 0;\r\n color: #828597;\r\n font-size: 0.89rem;\r\n text-align: right;\r\n max-width: 50%;\r\n}\r\n\r\n.lead-meta>span {\r\n white-space: nowrap;\r\n}\r\n\r\n.lead-meta>span:nth-child(3),\r\n.lead-meta>span:nth-child(4) {\r\n flex-basis: auto;\r\n}\r\n\r\n.intent,\r\n.status {\r\n padding: 4px 10px;\r\n border-radius: 999px;\r\n font-size: 0.82rem;\r\n font-weight: 600;\r\n text-transform: capitalize;\r\n}\r\n\r\n.intent.buying {\r\n background: rgba(37, 99, 235, 0.12);\r\n color: #1d4ed8;\r\n}\r\n\r\n.intent.selling {\r\n background: rgba(249, 115, 22, 0.18);\r\n color: #ea580c;\r\n}\r\n\r\n.intent.exploring {\r\n background: rgba(14, 165, 233, 0.15);\r\n color: #0284c7;\r\n}\r\n\r\n.intent.renting {\r\n background: rgba(147, 51, 234, 0.15);\r\n color: #9333ea;\r\n}\r\n\r\n.status.new {\r\n background: rgba(79, 70, 229, 0.15);\r\n color: #4f46e5;\r\n}\r\n\r\n.status.contacted {\r\n background: rgba(20, 184, 166, 0.18);\r\n color: #0f766e;\r\n}\r\n\r\n.status.qualified {\r\n background: rgba(34, 197, 94, 0.16);\r\n color: #15803d;\r\n}\r\n\r\n.status.negotiating {\r\n background: rgba(249, 115, 22, 0.18);\r\n color: #c2410c;\r\n}\r\n\r\n.status.closed {\r\n background: rgba(8, 145, 178, 0.16);\r\n color: #0f172a;\r\n}\r\n\r\n.status.hot {\r\n background: rgba(248, 113, 113, 0.2);\r\n color: #b91c1c;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 4px 8px;\r\n border-radius: 6px;\r\n}\r\n\r\n.status.neutral {\r\n background: rgba(251, 191, 36, 0.2);\r\n color: #b45309;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 4px 8px;\r\n border-radius: 6px;\r\n}\r\n\r\n.status.cold {\r\n background: rgba(59, 130, 246, 0.18);\r\n color: #1d4ed8;\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 4px 8px;\r\n border-radius: 6px;\r\n}\r\n\r\n.alert {\r\n background: #fee2e2;\r\n color: #991b1b;\r\n border: 1px solid rgba(185, 28, 28, 0.2);\r\n padding: 12px 16px;\r\n border-radius: 12px;\r\n}\r\n\r\n.actions {\r\n display: flex;\r\n gap: 12px;\r\n align-items: center;\r\n}\r\n\r\n.search {\r\n border: 1px solid rgba(15, 23, 42, 0.15);\r\n border-radius: 12px;\r\n padding: 10px 14px;\r\n min-width: 220px;\r\n background: #fff;\r\n font-size: 0.95rem;\r\n color: #1b1b1f;\r\n}\r\n\r\n.primary {\r\n -webkit-appearance: none;\r\n -moz-appearance: none;\r\n appearance: none;\r\n border: none;\r\n border-radius: 12px;\r\n background: #2563eb;\r\n color: #fff;\r\n padding: 10px 18px;\r\n font-weight: 600;\r\n cursor: pointer;\r\n box-shadow: 0 14px 30px rgba(37, 99, 235, 0.25);\r\n transition: transform 0.18s ease, box-shadow 0.18s ease;\r\n}\r\n\r\n.primary:hover {\r\n transform: translateY(-1px);\r\n box-shadow: 0 18px 36px rgba(37, 99, 235, 0.28);\r\n}\r\n\r\n.table-wrapper {\r\n overflow-x: auto;\r\n width: 100%;\r\n margin: 0;\r\n padding: 0;\r\n}\r\n\r\ntable {\r\n width: 100%;\r\n border-collapse: collapse;\r\n table-layout: auto;\r\n border: 1px solid rgba(15, 23, 42, 0.15);\r\n}\r\n\r\nth,\r\ntd {\r\n padding: 16px;\r\n text-align: left;\r\n border: 1px solid rgba(15, 23, 42, 0.15);\r\n vertical-align: middle;\r\n}\r\n\r\nthead {\r\n background: #f8fafc;\r\n}\r\n\r\nthead th {\r\n border-bottom: 2px solid rgba(15, 23, 42, 0.2);\r\n font-weight: 600;\r\n}\r\n\r\ntbody tr {\r\n transition: background-color 0.15s ease;\r\n}\r\n\r\ntbody tr:hover {\r\n background-color: rgba(107, 75, 255, 0.02);\r\n}\r\n\r\n/* People Table Styles - Reference Image Style */\r\n.people-table-wrapper {\r\n overflow-x: auto;\r\n width: 100%;\r\n margin: 0;\r\n padding: 0;\r\n border: 1px solid rgba(15, 23, 42, 0.1);\r\n border-left: none;
3\r\n border-right: none;\r\n border-radius: 20px;\r\n background: #fff;\r\n}\r\n\r\n.people-table {\r\n width: 100%;\r\n border-collapse: separate;\r\n border-spacing: 0;\r\n table-layout: auto;\r\n border: none;\r\n margin: 0;\r\n}\r\n\r\n.people-table th,\r\n.people-table td {\r\n padding: 12px 16px;\r\n text-align: left;\r\n border-right: 1px solid rgba(15, 23, 42, 0.1);\r\n border-bottom: 1px solid rgba(15, 23, 42, 0.1);\r\n vertical-align: middle;\r\n border-width: 1px;\r\n}\r\n\r\n.people-table th:first-child,\r\n.people-table td:first-child {\r\n padding-left: 16px;\r\n}\r\n\r\n.people-table th:last-child,\r\n.people-table td:last-child {\r\n border-right: none;\r\n padding-right: 16px;\r\n}\r\n\r\n.people-table thead {\r\n background: #f8fafc;\r\n}\r\n\r\n.people-table thead th {\r\n border-bottom: 1px solid rgba(15, 23, 42, 0.1);\r\n font-weight: 600;\r\n font-size: 0.75rem;\r\n letter-spacing: 0.05em;\r\n text-transform: uppercase;\r\n color: #64748b;\r\n padding: 12px 16px;\r\n border-width: 1px;\r\n}\r\n\r\n.people-table tbody tr {\r\n transition: background-color 0.15s ease;\r\n border-bottom: 1px solid rgba(15, 23, 42, 0.1);\r\n border-width: 1px;\r\n}\r\n\r\n.people-table tbody tr:last-child {\r\n border-bottom: none;\r\n}\r\n\r\n.people-table tbody tr:hover {\r\n background-color: rgba(107, 75, 255, 0.02);\r\n}\r\n\r\n.people-table tbody tr.selected {\r\n background-color: rgba(59, 130, 246, 0.05);\r\n}\r\n\r\n.people-table-name-cell {\r\n display: flex;\r\n align-items: center;\r\n gap: 0;\r\n}\r\n\r\n.people-table-name-content {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 0;\r\n}\r\n\r\n.people-table-name-content strong {\r\n font-weight: 600;\r\n color: #1f2545;\r\n font-size: 0.9375rem;\r\n line-height: 1.4;\r\n}\r\n\r\n@media (max-width: 700px) {\r\n .people-table-wrapper {\r\n width: calc(100% + 32px);\r\n margin: 0 -16px;\r\n }\r\n\r\n .people-table th,\r\n .people-table td {\r\n padding: 10px 12px;\r\n font-size: 0.875rem;\r\n }\r\n\r\n .people-table thead th {\r\n font-size: 0.7rem;\r\n padding: 10px 12px;\r\n }\r\n\r\n th,\r\n td {\r\n padding: 12px 8px;\r\n font-size: 0.875rem;\r\n }\r\n\r\n th {\r\n font-size: 0.75rem;\r\n }\r\n}\r\n\r\nth:last-child,\r\ntd:last-child {\r\n padding-right: 16px;\r\n white-space: nowrap;\r\n width: 1%;\r\n}\r\n\r\nth {\r\n font-size: 0.85rem;\r\n letter-spacing: 0.08em;\r\n text-transform: uppercase;\r\n color: #617080;\r\n}\r\n\r\n.contact {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 0;\r\n color: #4b5563;\r\n font-size: 0.95rem;\r\n align-items: flex-start;\r\n justify-content: center;\r\n}\r\n\r\n.lead-name {\r\n display: flex;\r\n align-items: center;\r\n color: #1f2545;\r\n font-size: 0.95rem;\r\n}\r\n\r\n.lead-name strong {\r\n font-weight: 600;\r\n color: #1f2545;\r\n}\r\n\r\n.lead-name-clickable {\r\n cursor: pointer;\r\n transition: color 0.2s ease;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n user-select: none;\r\n}\r\n\r\n.lead-name-clickable:hover {\r\n color: #6b4bff;\r\n text-decoration: underline;\r\n}\r\n\r\n.table-actions {\r\n display: inline-flex;\r\n gap: 8px;\r\n align-items: center;\r\n}\r\n\r\n.table-actions button {\r\n border: none;\r\n background: #f1f5f9;\r\n padding: 6px 10px;\r\n border-radius: 10px;\r\n cursor: pointer;\r\n font-size: 1.05rem;\r\n transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #617080;\r\n}\r\n\r\n.table-actions button:hover:not(:disabled) {\r\n transform: scale(1.05);\r\n background: #e2e8f0;\r\n color: #2563eb;\r\n}\r\n\r\n.table-actions button:disabled {\r\n opacity: 0.35;\r\n cursor: not-allowed;\r\n transform: none;\r\n}\r\n\r\n.comm-icon {\r\n border: none;\r\n background: #f1f5f9;\r\n padding: 6px 8px;\r\n border-radius: 8px;\r\n cursor: pointer;\r\n transition: all 0.18s ease;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #617080;\r\n}\r\n\r\n.comm-icon.active {\r\n background: #e0e7ff;\r\n color: #4f46e5;\r\n opacity: 1;\r\n}\r\n\r\n.comm-icon.active:hover {\r\n background: #c7d2fe;\r\n color: #4338ca;\r\n transform: scale(1.05);\r\n}\r\n\r\n.comm-icon.disabled {\r\n opacity: 0.3;
3\r\n cursor: not-allowed;\r\n background: #f8fafc;\r\n color: #94a3b8;\r\n}\r\n\r\n.comm-icon.disabled:hover {\r\n transform: none;\r\n background: #f8fafc;\r\n color: #94a3b8;\r\n}\r\n\r\n.icon-action-btn {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #617080;\r\n}\r\n\r\n.icon-action-btn:hover {\r\n color: #2563eb;\r\n}\r\n\r\n.lead-name .uid {\r\n display: block;\r\n font-size: 0.8rem;\r\n color: #7b8794;\r\n margin-top: 4px;\r\n}\r\n\r\n.expand-btn {\r\n border: none;\r\n background: transparent;\r\n padding: 4px;\r\n cursor: pointer;\r\n color: #617080;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 6px;\r\n transition: background 0.15s ease, color 0.15s ease;\r\n}\r\n\r\n.expand-btn:hover {\r\n background: #f1f5f9;\r\n color: #2563eb;\r\n}\r\n\r\n.communication-row {\r\n background: #f8fafc;\r\n padding: 0 !important;\r\n}\r\n\r\n.communication-row td {\r\n padding: 0;\r\n border-bottom: 1px solid rgba(15, 23, 42, 0.1);\r\n}\r\n\r\n.lead-communications {\r\n padding: 24px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 24px;\r\n}\r\n\r\n.communication-channel {\r\n background: #ffffff;\r\n border: 1px solid rgba(15, 23, 42, 0.08);\r\n border-radius: 16px;\r\n padding: 20px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 16px;\r\n}\r\n\r\n.channel-header {\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n padding-bottom: 12px;\r\n border-bottom: 1px solid rgba(15, 23, 42, 0.06);\r\n}\r\n\r\n.channel-header h3 {\r\n margin: 0;\r\n font-size: 1.1rem;\r\n font-weight: 600;\r\n color: #1d263b;\r\n flex: 1;\r\n}\r\n\r\n.channel-header svg {\r\n color: #6b4bff;\r\n}\r\n\r\n.message-count {\r\n background: #f1f5f9;\r\n color: #617080;\r\n padding: 4px 10px;\r\n border-radius: 12px;\r\n font-size: 0.85rem;\r\n font-weight: 500;\r\n}\r\n\r\n.channel-messages {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n max-height: 400px;\r\n overflow-y: auto;\r\n}\r\n\r\n.communication-message {\r\n background: #f8fafc;\r\n border-radius: 12px;\r\n padding: 12px 16px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n border-left: 3px solid #e2e8f0;\r\n}\r\n\r\n.communication-message.from-lead {\r\n background: #f0f9ff;\r\n border-left-color: #0ea5e9;\r\n}\r\n\r\n.communication-message.from-agent {\r\n background: #f5f3ff;\r\n border-left-color: #8b5cf6;\r\n}\r\n\r\n.message-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: 12px;\r\n}\r\n\r\n.message-sender {\r\n font-weight: 600;\r\n font-size: 0.85rem;\r\n color: #475569;\r\n text-transform: uppercase;\r\n letter-spacing: 0.05em;\r\n}\r\n\r\n.message-time {\r\n font-size: 0.8rem;\r\n color: #94a3b8;\r\n}\r\n\r\n.message-text {\r\n color: #1e293b;\r\n font-size: 0.95rem;\r\n line-height: 1.5;\r\n}\r\n\r\n.channel-voice-calls {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 16px;\r\n}\r\n\r\n.voice-call-item {\r\n background: #fef3c7;\r\n border: 1px solid rgba(245, 158, 11, 0.2);\r\n border-radius: 12px;\r\n padding: 16px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n}\r\n\r\n.voice-call-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: 12px;\r\n padding-bottom: 10px;\r\n border-bottom: 1px solid rgba(245, 158, 11, 0.15);\r\n}\r\n\r\n.voice-call-info {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n font-weight: 600;\r\n color: #92400e;\r\n font-size: 0.95rem;\r\n}\r\n\r\n.voice-call-info svg {\r\n color: #f59e0b;\r\n}\r\n\r\n.call-duration {\r\n background: rgba(245, 158, 11, 0.15);\r\n padding: 2px 8px;\r\n border-radius: 8px;\r\n font-size: 0.8rem;\r\n font-weight: 500;\r\n}\r\n\r\n.call-time {\r\n font-size: 0.85rem;\r\n color: #78716c;\r\n}\r\n\r\n.call-summary {\r\n background: #ffffff;\r\n padding: 12px;\r\n border-radius: 8px;\r\n font-size: 0.9rem;\r\n color: #1e293b;\r\n line-height: 1.5;\r\n}\r\n\r\n.call-summary strong {\r\n color: #92400e;\r\n display: block;\r\n margin-bottom: 6px;\r\n}\r\n\r\n.call-transcript {\r\n background: #ffffff;\r\n padding: 12px;\r\n border-radius: 8px;\r\n font-size: 0.9rem;\r\n color: #1e293b;\r\n line-height: 1.6;\r\n}\r\n\r\n.call-transcript strong {\r\n color: #92400e;\r\n display: block;\r\n margin-bottom: 8px;\r\n}\r\n\r\n.call-transcript p {\r\n margin: 0;\r\n white-space: pre-wrap;\r\n}\r\n\r\n.call-requirements {\r\n background: #ffffff;\r\n padding: 12px;\r\n border-radius: 8px;\r\n font-size: 0.9rem;\r\n color: #1e293b;\r\n}\r\n\r\n.call-requirements strong {\r\n color: #92400e;\r\n display: block;\r\n margin-bottom: 8px;\r\n}\r\n\r\n.call-requirements ul {\r\n margin: 0;\r\n padding-left: 20px;\r\n list-style-type: disc;\r\n}\r\n\r\n.call-requirements li {\r\n margin-bottom: 4px;\r\n line-height: 1.5;\r\n}\r\n\r\n.communication-loading {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 12px;\r\n padding: 32px;\r\n color: #617080;\r\n font-size: 0.95rem;\r\n}\r\n\r\n.communication-loading .spinner {\r\n animation: spin 1s linear infinite;\r\n}\r\n\r\n@keyframes spin {\r\n from {\r\n transform: rotate(0deg);\r\n }\r\n\r\n to {\r\n transform: rotate(360deg);\r\n }\r\n}\r\n\r\n.communication-empty {\r\n text-align: center;\r\n padding: 32px;\r\n color: #94a3b8;\r\n font-size: 0.95rem;\r\n}\r\n\r\n.communication-tabs {\r\n display: flex;\r\n gap: 12px;\r\n margin-bottom: 24px;\r\n border-bottom: 2px solid rgba(15, 23, 42, 0.08);\r\n padding-bottom: 0;\r\n}\r\n\r\n.comm-tab {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 12px 20px;\r\n border: none;\r\n background: transparent;\r\n color: #617080;\r\n font-size: 0.95rem;\r\n font-weight: 500;\r\n cursor: pointer;\r\n border-bottom: 3px solid transparent;\r\n margin-bottom: -2px;\r\n transition: all 0.2s ease;\r\n position: relative;\r\n}\r\n\r\n.comm-tab:hover {\r\n color: #2563eb;\r\n background: rgba(37, 99, 235, 0.05);\r\n}\r\n\r\n.comm-tab.active {\r\n color: #2563eb;\r\n border-bottom-color: #2563eb;\r\n font-weight: 600;\r\n}\r\n\r\n.comm-tab svg {\r\n color: inherit;\r\n}\r\n\r\n.calendar-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 320px;\r\n gap: 24px;\r\n align-items: start;\r\n}\r\n\r\n@media (max-width: 1024px) {\r\n .calendar-grid {\r\n grid-template-columns: 1fr;\r\n gap: 20px;\r\n }\r\n}\r\n\r\n.calendar-month {\r\n background: #ffffff;\r\n border-radius: 20px;\r\n padding: 24px;\r\n border: 1px solid rgba(15, 23, 42, 0.1);\r\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\r\n}\r\n\r\n.calendar-header {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 16px;\r\n margin-bottom: 20px;\r\n}\r\n\r\n.calendar-nav-group {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n flex-shrink: 0;\r\n}\r\n\r\n.calendar-nav-btn {\r\n border: 1px solid rgba(15, 23, 42, 0.12);\r\n background: #ffffff;\r\n color: #475569;\r\n cursor: pointer;\r\n padding: 8px;\r\n border-radius: 8px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n transition: all 0.2s ease;\r\n width: auto;\r\n height: auto;\r\n min-width: 32px;\r\n min-height: 32px;\r\n flex-shrink: 0;\r\n}\r\n\r\n.calendar-nav-btn:hover {\r\n background: #f8fafc;\r\n border-color: rgba(15, 23, 42, 0.2);\r\n color: #1e293b;\r\n}\r\n\r\n.calendar-today-btn {\r\n border: none;\r\n background: #2563eb;\r\n color: #ffffff;\r\n padding: 6px 12px;\r\n border-radius: 8px;\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n white-space: nowrap;\r\n flex-shrink: 0;\r\n width: auto;\r\n height: auto;\r\n}\r\n\r\n.calendar-today-btn:hover {\r\n background: #1d4ed8;\r\n}\r\n\r\n.calendar-title {\r\n font-weight: 600;\r\n font-size: 1.125rem;\r\n margin: 0;\r\n color: #1e293b;\r\n text-align: right;\r\n flex: 1;\r\n min-width: 0;\r\n}\r\n\r\n.calendar-days {\r\n display: grid;\r\n grid-template-columns: repeat(7, minmax(0, 1fr));\r\n gap: 24px;\r\n}\r\n\r\n.calendar-day-header {\r\n font-size: 0.75rem;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n color: #64748b;\r\n text-align: center;\r\n padding: 8px 0;\r\n letter-spacing: 0.3px;\r\n}\r\n\r\n.calendar-empty {\r\n visibility: hidden;\r\n}\r\n\r\n.calendar-cell {\r\n border: 1px solid rgba(15, 23, 42, 0.1);\r\n border-radius: 8px;\r\n width: 100%;\r\n aspect-ratio: 1;\r\n padding: 0;\r\n text-align: center;\r\n background: #ffffff;\r\n color: #1e293b;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n cursor: pointer;\r\n transition: all 0.15s ease;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n position: relative;\r\n}\r\n\r\n.calendar-cell:hover:not(.selected) {\r\n background: #f8fafc;\r\n border-color: #6b4bff;\r\n transform: translateY(-1px);\r\n box-shadow: 0 2px 8px rgba(107, 75, 255, 0.15);\r\n}\r\n\r\n.calendar-cell.other-month {\r\n color: #94a3b8;\r\n font-weight: 400;\r\n}\r\n\r\n.calendar-cell small {\r\n font-size: 0.75rem;\r\n color: #1d4ed8;\r\n}\r\n\r\n.calendar-cell.has-event {\r\n background: #ffffff;\r\n}\r\n\r\n.calendar-cell.selected {\r\n border: 2px solid #2563eb;\r\n background: #ffffff;\r\n color: #1e293b;\r\n font-weight: 500;\r\n}\r\n\r\n.calendar-sidebar {\r\n background: transparent;\r\n border-radius: 0;\r\n border: none;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 20px;\r\n}\r\n\r\n.calendar-sidebar h3 {\r\n margin: 0 0 10px 0;\r\n font-size: 0.9375rem;\r\n font-weight: 600;\r\n color: #1e293b;\r\n line-height: 1.4;\r\n}\r\n\r\n.calendar-card h3 {\r\n margin: 0 0 10px 0;\r\n font-size: 0.9375rem;\r\n font-weight: 600;\r\n color: #1e293b;\r\n line-height: 1.4;\r\n}\r\n\r\n.calendar-sidebar ul {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n}\r\n\r\n.calendar-grid.two-column {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\r\n gap: 24px;\r\n}\r\n\r\n.calendar-card {\r\n background: #ffffff;\r\n border: 1px solid rgba(15, 23, 42, 0.1);\r\n border-radius: 12px;\r\n padding: 18px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);\r\n}\r\n\r\n.calendar-card.wide {\r\n grid-column: span 2;\r\n}\r\n\r\n.calendar-card ul {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n}\r\n\r\n.calendar-item {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n padding-bottom: 12px;\r\n border-bottom: 1px solid rgba(15, 23, 42, 0.06);\r\n}\r\n\r\n.calendar-item .event-title {\r\n font-weight: 600;\r\n color: #0f172a;\r\n}\r\n\r\n.calendar-item small {\r\n color: #64748b;\r\n}\r\n\r\n.info-list {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 10px;\r\n color: #475569;\r\n font-size: 0.875rem;\r\n}\r\n\r\n.info-list li {\r\n line-height: 1.5;\r\n}\r\n\r\n.info-list strong {\r\n color: #1e293b;\r\n font-weight: 600;\r\n}\r\n\r\n.event-date {\r\n font-weight: 600;\r\n color: #1d4ed8;\r\n}\r\n\r\n.event-title {\r\n color: #475569;\r\n}\r\n\r\n.empty {\r\n margin: 0;\r\n color: #64748b;\r\n font-size: 0.875rem;\r\n line-height: 1.5;\r\n}\r\n\r\n.calendar-card .empty {\r\n margin-top: 4px;\r\n}\r\n\r\n.grid.analytics {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));\r\n gap: 24px;\r\n}\r\n\r\n@media (max-width: 768px) {\r\n .grid.analytics {\r\n grid-template-columns: 1fr;\r\n gap: 16px;\r\n }\r\n}\r\n\r\n.analytics-list {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 16px;\r\n}\r\n\r\n.analytics-list.compact li {\r\n display: flex;\r\n justify-content: space-between;\r\n padding: 12px 0;\r\n border-bottom: 1px solid rgba(15, 23, 42, 0.06);\r\n}\r\n\r\n.label {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n gap: 12px;\r\n}\r\n\r\n.bar {\r\n position: relative;\r\n height: 12px;
3\r\n background: rgba(148, 163, 184, 0.2);\r\n border-radius: 999px;\r\n overflow: hidden;\r\n margin-top: 8px;\r\n}\r\n\r\n.bar span {\r\n position: absolute;\r\n right: 12px;\r\n top: -22px;\r\n font-size: 0.8rem;\r\n color: #475569;\r\n}\r\n\r\n.bar-fill {\r\n height: 100%;\r\n background: linear-gradient(90deg, #2563eb 0%, #60a5fa 100%);\r\n}\r\n\r\n.source-card {\r\n background: linear-gradient(150deg, #2563eb 0%, #38bdf8 100%);\r\n border-radius: 20px;\r\n padding: 24px;\r\n color: #f8fafc;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n box-shadow: 0 24px 48px rgba(37, 99, 235, 0.28);\r\n}\r\n\r\n.source-title {\r\n text-transform: uppercase;\r\n letter-spacing: 0.08em;\r\n font-size: 0.85rem;\r\n opacity: 0.85;\r\n}\r\n\r\n.source-value {\r\n font-size: 2.6rem;\r\n font-weight: 600;\r\n}\r\n\r\n.source-caption {\r\n opacity: 0.9;\r\n}\r\n\r\n.assistant-placeholder {\r\n background: rgba(148, 163, 184, 0.12);\r\n border-radius: 20px;\r\n padding: 32px;\r\n text-align: center;\r\n color: #475569;\r\n}\r\n\r\n.muted {\r\n color: #7b8794;\r\n}\r\n\r\n.assistant-panel {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 24px;\r\n height: calc(100vh - 86px - 64px);\r\n max-height: calc(100vh - 86px - 64px);\r\n overflow: hidden;\r\n}\r\n\r\n.assistant-chat {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 16px;\r\n flex: 1;\r\n min-height: 0;\r\n overflow: hidden;\r\n}\r\n\r\n.assistant-chat__history {\r\n flex: 1;\r\n padding: 12px;\r\n padding-left: 12px;\r\n padding-right: 12px;\r\n padding-bottom: 16px;\r\n margin: 0;\r\n border-radius: 16px;\r\n background: rgba(148, 163, 184, 0.12);\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n scrollbar-width: none;\r\n /* Firefox */\r\n -ms-overflow-style: none;\r\n /* IE and Edge */\r\n scroll-behavior: smooth;\r\n min-height: 0;\r\n}\r\n\r\n.assistant-chat__history::-webkit-scrollbar {\r\n display: none;\r\n /* Chrome, Safari, Opera */\r\n width: 0;\r\n height: 0;\r\n}\r\n\r\n.assistant-chat__history.chat-history {\r\n padding-right: 12px;\r\n}\r\n\r\n.assistant-chat__form {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n}\r\n\r\n.assistant-chat__input-wrapper {\r\n position: relative;\r\n display: flex;\r\n width: 100%;\r\n}\r\n\r\n.assistant-chat__input {\r\n border-radius: 16px;\r\n border: 1px solid rgba(15, 23, 42, 0.12);\r\n padding: 12px 120px 12px 16px;\r\n font-size: 0.95rem;\r\n resize: none;\r\n min-height: 96px;\r\n max-height: 300px;\r\n overflow-y: auto;\r\n width: 100%;\r\n font-family: inherit;\r\n line-height: 1.5;\r\n scrollbar-width: none;\r\n /* Firefox */\r\n -ms-overflow-style: none;\r\n /* IE and Edge */\r\n transition: border-color 0.2s ease, box-shadow 0.2s ease;\r\n}\r\n\r\n.assistant-chat__input:focus {\r\n outline: none;\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.assistant-chat__input::-webkit-scrollbar {\r\n display: none;\r\n /* Chrome, Safari, Opera */\r\n}\r\n\r\n.assistant-chat__input:disabled {\r\n opacity: 0.65;\r\n cursor: not-allowed;\r\n}\r\n\r\n.assistant-chat__submit-btn {\r\n position: absolute;\r\n bottom: 12px;\r\n right: 12px;\r\n z-index: 1;\r\n padding: 8px 20px;\r\n font-size: 0.95rem;\r\n font-weight: 600;\r\n white-space: nowrap;\r\n}\r\n\r\n.assistant-chat__error {\r\n margin-top: -8px;\r\n}\r\n\r\n.assistant-chat__error .muted {\r\n font-size: 0.85rem;\r\n}\r\n\r\n/* Modal / Drawer */\r\n.modal-backdrop {\r\n position: fixed;\r\n inset: 0;\r\n background: rgba(15, 23, 42, 0.48);\r\n backdrop-filter: blur(2px);\r\n display: grid;\r\n place-items: center;\r\n padding: 24px;\r\n z-index: 1000;\r\n}\r\n\r\n.modal {\r\n width: min(720px, 100%);\r\n max-height: 92vh;\r\n background: #ffffff;\r\n border-radius: 24px;\r\n box-shadow: 0 28px 80px rgba(15, 23, 42, 0.25);\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.modal-header {\r\n display: flex;\r\n align-items: flex-start;\r\n justify-content: space-between;\r\n padding: 24px 28px 0;\r\n gap: 16px;\r\n}\r\n\r\n.modal-header h3 {\r\n margin: 0;\r\n font-size: 1.5rem;\r\n}\r\n\r\n.modal-header .close {\r\n border: none;
3\r\n background: rgba(148, 163, 184, 0.15);\r\n width: 36px;\r\n height: 36px;\r\n border-radius: 12px;\r\n font-size: 1.1rem;\r\n cursor: pointer;\r\n transition: transform 0.18s ease, background 0.18s ease;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #475569;\r\n}\r\n\r\n.modal-header .close:hover {\r\n transform: scale(1.05);\r\n background: rgba(148, 163, 184, 0.25);\r\n color: #1e293b;\r\n}\r\n\r\n.modal-body {\r\n padding: 24px 28px 32px;\r\n overflow-y: auto;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 24px;\r\n}\r\n\r\n.score-summary {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\r\n gap: 16px;\r\n padding: 18px;\r\n border-radius: 18px;\r\n background: rgba(148, 163, 184, 0.12);\r\n}\r\n\r\n.score-summary .label {\r\n color: #7b8794;\r\n font-size: 0.8rem;\r\n text-transform: uppercase;\r\n letter-spacing: 0.08em;\r\n}\r\n\r\n.detail-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\r\n gap: 18px;\r\n}\r\n\r\n.detail-item {\r\n background: #f8fafc;\r\n border-radius: 16px;\r\n padding: 16px;\r\n border: 1px solid rgba(148, 163, 184, 0.18);\r\n display: flex;\r\n flex-direction: column;\r\n gap: 6px;\r\n}\r\n\r\n.detail-item .label {\r\n font-size: 0.8rem;\r\n color: #64748b;\r\n text-transform: uppercase;\r\n letter-spacing: 0.08em;\r\n}\r\n\r\n.history-section {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n}\r\n\r\n.history-section h4 {\r\n margin: 0;\r\n font-size: 1.05rem;\r\n}\r\n\r\n.chat-context {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));\r\n gap: 12px;\r\n padding: 16px;\r\n border-radius: 12px;\r\n background: rgba(148, 163, 184, 0.12);\r\n}\r\n\r\n.chat-context .label {\r\n font-size: 0.75rem;\r\n text-transform: uppercase;\r\n letter-spacing: 0.08em;\r\n color: #64748b;\r\n}\r\n\r\n.conversation-shell.full {\r\n position: relative;\r\n display: grid;\r\n grid-template-columns: minmax(280px, 320px) 1fr;\r\n gap: 24px;\r\n height: 100%;\r\n min-height: 0;\r\n overflow: hidden;\r\n flex: 1;\r\n}\r\n\r\n/* Tablet and Mobile: Show sidebar first, then panel when conversation selected */\r\n@media (max-width: 1024px) {\r\n .conversation-shell.full {\r\n grid-template-columns: 1fr;\r\n gap: 0;\r\n position: relative;\r\n }\r\n\r\n .conversation-sidebar {\r\n order: 1;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 2;\r\n transition: transform 0.3s ease;\r\n }\r\n\r\n .conversation-panel {\r\n order: 2;\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 1;\r\n transform: translateX(100%);\r\n transition: transform 0.3s ease;\r\n }\r\n\r\n /* When conversation exists, show panel and hide sidebar */\r\n .conversation-shell.full:has(.conversation-panel:not(:has(.conversation-placeholder))) .conversation-sidebar {\r\n transform: translateX(-100%);\r\n }\r\n\r\n .conversation-shell.full:has(.conversation-panel:not(:has(.conversation-placeholder))) .conversation-panel {\r\n transform: translateX(0) !important;\r\n z-index: 2;\r\n display: flex !important;\r\n flex-direction: column !important;\r\n }\r\n\r\n /* Alternative selectors to ensure panel shows */\r\n .conversation-shell.full:has(.conversation-chat-header) .conversation-sidebar {\r\n transform: translateX(-100%);\r\n }\r\n\r\n .conversation-shell.full:has(.conversation-chat-header) .conversation-panel {\r\n transform: translateX(0) !important;\r\n z-index: 2;\r\n display: flex !important;\r\n flex-direction: column !important;\r\n }\r\n\r\n .conversation-shell.full:has(.chat-history) .conversation-sidebar {\r\n transform: translateX(-100%);\r\n }\r\n\r\n .conversation-shell.full:has(.chat-history) .conversation-panel {\r\n transform: translateX(0) !important;\r\n z-index: 2;\r\n display: flex !important;\r\n flex-direction: column !important;\r\n }\r\n\r\n /* Ensure placeholder is visible */\r\n .conversation-placeholder {\r\n display: flex !important;\r\n }\r\n\r\n .conversation-placeholder-illustration {\r\n display: flex !important;\r\n }\r\n\r\n .conversation-placeholder-illustration img {\r\n display: block !important;\r\n max-width: 100%;\r\n height: auto;\r\n }\r\n\r\n /* Ensure chat history is visible when panel is shown */\r\n .conversation-panel .chat-history {\r\n display: flex !important;\r\n flex-direction: column !important;\r\n flex: 1 !important;\r\n min-height: 0 !important;\r\n }\r\n\r\n .conversation-panel:not(:has(.conversation-placeholder)) {\r\n display: flex !important;\r\n flex-direction: column !important;\r\n }\r\n}\r\n\r\n/* Tablet specific adjustments (701px - 1024px) */\r\n@media (max-width: 1024px) and (min-width: 701px) {\r\n .conversation-sidebar-header {\r\n padding: 18px 24px;\r\n }\r\n\r\n .conversation-tile {\r\n padding: 14px 24px;\r\n }\r\n\r\n .conversation-chat-header {\r\n padding: 16px 20px;\r\n }\r\n\r\n .conversation-panel .chat-history {\r\n padding: 16px 20px;\r\n }\r\n\r\n .chat-bubble {\r\n max-width: 75%;\r\n padding: 10px 14px;\r\n }\r\n}\r\n\r\n/* Mobile specific adjustments */\r\n@media (max-width: 700px) {\r\n .panel.conversation-panel-wrapper {\r\n padding: 16px;\r\n border-radius: 16px;\r\n height: calc(100vh - 64px - 32px);\r\n max-height: calc(100vh - 64px - 32px);\r\n }\r\n\r\n .conversation-sidebar {\r\n border-radius: 0;\r\n padding: 0;\r\n }\r\n\r\n .conversation-sidebar-header {\r\n padding: 16px !important;\r\n }\r\n\r\n .conversation-tile {\r\n padding: 12px 16px !important;\r\n }\r\n\r\n .conversation-panel {\r\n border-radius: 0;\r\n padding: 0;\r\n }\r\n\r\n .conversation-placeholder {\r\n padding: 40px 0;\r\n gap: 24px;\r\n }\r\n\r\n .conversation-placeholder-illustration img {\r\n max-width: 280px;\r\n }\r\n\r\n .conversation-placeholder-content h3 {\r\n font-size: 1.1rem;\r\n }\r\n\r\n .conversation-chat-header {\r\n padding: 12px 16px !important;\r\n flex-wrap: wrap;\r\n gap: 8px;\r\n }\r\n\r\n .conversation-panel .chat-history {\r\n padding: 12px 16px !important;\r\n display: flex !important;\r\n flex-direction: column !important;\r\n flex: 1 !important;\r\n min-height: 0 !important;\r\n overflow-y: auto !important;\r\n }\r\n\r\n .chat-bubble {\r\n max-width: 85%;\r\n padding: 8px 12px;\r\n font-size: 0.85rem;\r\n }\r\n\r\n .back-button {\r\n padding: 4px;\r\n }\r\n\r\n .back-button svg {\r\n width: 18px;\r\n height: 18px;\r\n }\r\n}\r\n\r\n.conversation-sidebar {\r\n background: linear-gradient(180deg, #fbf9ff 0%, #f4f0ff 100%);\r\n border: 1px solid #ece8ff;\r\n border-radius: 20px;\r\n color: #1f2a44;\r\n display: flex;\r\n flex-direction: column;\r\n overflow: hidden;\r\n box-shadow: 0 4px 20px rgba(107, 75, 255, 0.08);\r\n height: 100%;\r\n min-height: 0;\r\n padding: 0;\r\n}\r\n\r\n.conversation-sidebar-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n padding: 20px 32px;\r\n background: transparent;\r\n font-weight: 700;\r\n font-size: 1.1rem;\r\n color: #1f2545;\r\n border-bottom: 1px solid #ece8ff;\r\n}\r\n\r\n.conversation-sidebar-header h3 {\r\n margin: 0;\r\n font-size: 1.1rem;\r\n font-weight: 700;\r\n color: #1f2545;\r\n}\r\n\r\n.conversation-sidebar-header span {\r\n background: #6b4bff;\r\n color: #ffffff;\r\n padding: 4px 12px;\r\n border-radius: 999px;\r\n font-size: 0.85rem;\r\n font-weight: 600;\r\n min-width: 28px;\r\n text-align: center;\r\n}\r\n\r\n.conversation-list {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n scrollbar-width: none;\r\n /* Firefox */\r\n -ms-overflow-style: none;\r\n /* IE and Edge */\r\n flex: 1;\r\n min-height: 0;\r\n}\r\n\r\n.conversation-list::-webkit-scrollbar {\r\n display: none;\r\n /* Chrome, Safari, Opera */\r\n width: 0;\r\n height: 0;\r\n}\r\n\r\n.conversation-tile {\r\n display: grid;\r\n grid-template-columns: 32px 1fr;\r\n gap: 12px;\r\n align-items: center;\r\n padding: 16px 16px;\r\n cursor: pointer;\r\n transition: all 0.18s ease;
3\r\n border-bottom: 1px solid #f0f0f8;\r\n}\r\n\r\n.conversation-tile:last-child {\r\n border-bottom: none;\r\n}\r\n\r\n.conversation-tile:hover {\r\n background: rgba(107, 75, 255, 0.06);\r\n}\r\n\r\n.conversation-tile.active {\r\n background: #eee8ff;\r\n border-left: 3px solid #6b4bff;\r\n}\r\n\r\n.conversation-tile .avatar {\r\n width: 32px;\r\n height: 32px;\r\n border-radius: 10px;\r\n background: linear-gradient(135deg, #6b4bff 0%, #a78bfa 100%);\r\n color: #ffffff;\r\n display: grid;\r\n place-items: center;\r\n font-weight: 700;\r\n font-size: 0.9rem;\r\n letter-spacing: 0.02em;\r\n box-shadow: 0 4px 12px rgba(107, 75, 255, 0.2);\r\n}\r\n\r\n.conversation-meta {\r\n display: flex;\r\n flex-direction: column;\r\n color: #384066;\r\n}\r\n\r\n.conversation-meta__header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n}\r\n\r\n.conversation-meta__header strong {\r\n font-size: 1rem;\r\n font-weight: 600;\r\n color: #1f2545;\r\n}\r\n\r\n.conversation-meta__header .muted {\r\n font-size: 0.8rem;\r\n color: #6b4bff;\r\n background: rgba(107, 75, 255, 0.1);\r\n padding: 2px 8px;\r\n border-radius: 12px;\r\n font-weight: 500;\r\n}\r\n\r\n.conversation-meta__body {\r\n display: flex;\r\n flex-direction: column;\r\n font-size: 0.85rem;\r\n}\r\n\r\n.conversation-meta__body span:first-child {\r\n color: #4a4f6b;\r\n}\r\n\r\n.conversation-meta__body .muted {\r\n color: #7a7f99;\r\n font-size: 0.8rem;\r\n}\r\n\r\n.conversation-panel {\r\n height: 100%;\r\n min-height: 0;\r\n border-radius: 20px;\r\n border: 1px solid #ece8ff;\r\n padding: 0;\r\n background: #ffffff;\r\n box-shadow: 0 4px 20px rgba(107, 75, 255, 0.08);\r\n display: flex;\r\n flex-direction: column;\r\n overflow: hidden;\r\n}\r\n\r\n.conversation-chat-header {\r\n padding: 20px 24px;\r\n border-bottom: 1px solid #ece8ff;\r\n background: linear-gradient(180deg, #ffffff 0%, #faf7ff 100%);\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n}\r\n\r\n/* Back button styles */\r\n.back-button {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border: none;\r\n background: transparent;\r\n cursor: pointer;\r\n padding: 6px;\r\n border-radius: 8px;\r\n transition: background 0.2s ease;\r\n flex-shrink: 0;\r\n}\r\n\r\n.back-button:hover {\r\n background: rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.back-button:active {\r\n background: rgba(107, 75, 255, 0.15);\r\n}\r\n\r\n/* Hide back button on desktop and laptop (1025px and above), show on tablet and mobile */\r\n@media (min-width: 1025px) {\r\n\r\n .back-button,\r\n .conversation-chat-header .back-button,\r\n .conversation-panel .back-button,\r\n .conversation-panel header .back-button {\r\n display: none !important;\r\n visibility: hidden !important;\r\n opacity: 0 !important;\r\n width: 0 !important;\r\n height: 0 !important;\r\n padding: 0 !important;\r\n margin: 0 !important;\r\n overflow: hidden !important;\r\n }\r\n}\r\n\r\n.conversation-chat-header strong {\r\n font-size: 1.1rem;\r\n font-weight: 700;\r\n color: #1f2545;\r\n display: block;\r\n margin-bottom: 4px;\r\n}\r\n\r\n.conversation-chat-header .muted {\r\n font-size: 0.9rem;\r\n color: #7a7f99;\r\n}\r\n\r\n.conversation-channel-icon {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 40px;\r\n height: 40px;\r\n border-radius: 10px;\r\n background: #f0f0f8;\r\n color: #6b4bff;\r\n flex-shrink: 0;\r\n}\r\n\r\n.conversation-channel-icon svg {\r\n color: #6b4bff;\r\n}\r\n\r\n.conversation-placeholder {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 60px 24px;\r\n text-align: center;\r\n gap: 32px;\r\n flex: 1;\r\n background: linear-gradient(180deg, #faf7ff 0%, #f6f3ff 100%);\r\n}\r\n\r\n.conversation-placeholder-illustration {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n width: 100%;\r\n max-width: 400px;\r\n height: auto;\r\n}\r\n\r\n.conversation-placeholder-illustration img {\r\n width: 100%;\r\n height: auto;\r\n max-width: 360px;\r\n}\r\n\r\n.conversation-placeholder-content {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 8px;\r\n}\r\n\r\n.conversation-placeholder-content h3 {\r\n margin: 0;\r\n font-size: 1.25rem;\r\n font-weight: 600;\r\n color: #1f2545;\r\n}\r\n\r\n.conversation-placeholder-content .muted {\r\n color: #7a7f99;\r\n font-size: 0.95rem;\r\n margin: 0;\r\n}\r\n\r\n.conversation-panel .chat-history {\r\n flex: 1;\r\n padding: 24px;\r\n padding-left: 24px;\r\n padding-right: 24px;\r\n padding-bottom: 16px;\r\n margin: 0;\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n scrollbar-width: none;\r\n /* Firefox */\r\n -ms-overflow-style: none;\r\n /* IE and Edge */\r\n scroll-behavior: smooth;\r\n display: flex;\r\n flex-direction: column;\r\n min-height: 0;\r\n height: 100%;\r\n}\r\n\r\n.conversation-panel .chat-history::-webkit-scrollbar {\r\n display: none;\r\n /* Chrome, Safari, Opera */\r\n width: 0;\r\n height: 0;\r\n}\r\n\r\n.chat-history::-webkit-scrollbar {\r\n display: none;\r\n /* Chrome, Safari, Opera */\r\n width: 0;\r\n height: 0;\r\n}\r\n\r\n/* Agent message input focus state - matching AI Assistant input */\r\n.agent-message-input {\r\n border: 1px solid rgba(15, 23, 42, 0.12) !important;\r\n transition: border-color 0.2s ease, box-shadow 0.2s ease;\r\n}\r\n\r\n.agent-message-input:focus {\r\n outline: none;\r\n border-color: #6b4bff !important;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.agent-message-input:disabled {\r\n opacity: 0.65;
3\r\n cursor: not-allowed;\r\n}\r\n\r\n.conversation-panel .chat-context {\r\n margin: 24px;\r\n}\r\n\r\n.chat-bubble {\r\n font-size: 0.92rem;\r\n}\r\n\r\n.conversation-panel .chat-meta,\r\n.conversation-panel .chat-text {\r\n font-size: 0.875rem;\r\n}\r\n\r\n.history-list {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n}\r\n\r\n.history-list li {\r\n background: #f8fafc;\r\n border-radius: 12px;\r\n padding: 12px 14px;\r\n display: flex;\r\n gap: 8px;\r\n align-items: center;\r\n font-size: 0.92rem;\r\n}\r\n\r\n.chat-history {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n overflow-y: auto;\r\n overflow-x: hidden;\r\n padding-right: 6px;\r\n padding-bottom: 16px;\r\n margin: 0;\r\n scroll-behavior: smooth;\r\n min-height: 0;\r\n scrollbar-width: none;\r\n /* Firefox */\r\n -ms-overflow-style: none;\r\n /* IE and Edge */\r\n}\r\n\r\n.chat-bubble {\r\n border-radius: 14px;\r\n padding: 12px 16px;\r\n max-width: 85%;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);\r\n}\r\n\r\n.call-session-block {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: 100%;\r\n}\r\n\r\n.chat-bubble.user {\r\n align-self: flex-start;\r\n background: #ffffff;\r\n border: none;\r\n box-shadow: 0 1px 2px rgba(11, 20, 26, 0.1);\r\n border-top-left-radius: 0;\r\n}\r\n\r\n.chat-bubble.bot {\r\n align-self: flex-end;\r\n background: #f3f0ff;\r\n border: none;\r\n box-shadow: 0 1px 2px rgba(11, 20, 26, 0.1);\r\n border-top-right-radius: 0;\r\n}\r\n\r\n.chat-text {\r\n font-size: 0.98rem;\r\n color: #1f2933;\r\n}\r\n\r\n.chat-meta {\r\n font-size: 0.875rem;\r\n color: #7b8794;\r\n}\r\n\r\n.sidebar.floating {\r\n position: fixed;\r\n left: 24px;\r\n top: 24px;\r\n bottom: 24px;\r\n width: 240px;\r\n background: linear-gradient(180deg, #161B22 0%, #262c36 100%);\r\n border-radius: 24px;\r\n box-shadow: 0 12px 48px rgba(15, 23, 42, 0.39), 0 1.5px 7px #151b22;\r\n display: flex;\r\n flex-direction: column;\r\n z-index: 100;\r\n transition: width 0.25s, padding 0.25s;\r\n padding: 24px 20px;\r\n gap: 0;\r\n}\r\n\r\n.sidebar.floating.collapsed {\r\n width: 68px;\r\n padding: 24px 8px;\r\n}\r\n\r\n.sidebar-header {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n margin-bottom: 36px;\r\n}\r\n\r\n.sidebar-toggle-btn {\r\n background: #25282f;\r\n border: none;\r\n border-radius: 8px;\r\n width: 36px;\r\n height: 36px;\r\n display: grid;\r\n place-items: center;\r\n color: #b1b8c9;\r\n cursor: pointer;\r\n margin-right: 0;\r\n transition: background 0.18s;\r\n}\r\n\r\n.sidebar-toggle-btn:hover {\r\n background: #343a43;\r\n color: #fff;\r\n}\r\n\r\n.sidebar.floating.collapsed .brand,\r\n.sidebar.floating.collapsed .brand-avatar+div {\r\n display: none;\r\n}\r\n\r\n.nav {\r\n flex-direction: column;\r\n flex: 1;\r\n gap: 8px;\r\n margin-bottom: 0;\r\n}\r\n\r\n.nav-item {\r\n background: none;\r\n border: none;\r\n color: #b1b8c9;\r\n border-radius: 12px;\r\n display: flex;\r\n align-items: center;\r\n font-size: 1rem;\r\n font-weight: 500;\r\n transition: background 0.18s, color 0.18s;\r\n padding: 10px 12px;\r\n margin-bottom: 4px;\r\n cursor: pointer;\r\n width: 100%;\r\n}\r\n\r\n.nav-item.active {\r\n color: #fff;\r\n background: rgba(38, 99, 235, 0.13);\r\n}\r\n\r\n.nav-item:hover {\r\n color: #fff;\r\n background: rgba(38, 99, 235, 0.18);\r\n}\r\n\r\n.nav-item-inner {\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n}\r\n\r\n.sidebar.floating.collapsed .nav-item-label {\r\n display: none;\r\n}\r\n\r\n.cta-upload {\r\n background: linear-gradient(140deg, #2563EB 0%, #38bdf8 100%);\r\n color: #fff;\r\n border: none;\r\n border-radius: 18px;\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n font-weight: 600;\r\n font-size: 1rem;\r\n margin-top: 20px;\r\n padding: 13px 20px;\r\n cursor: pointer;\r\n transition: box-shadow 0.18s, background 0.18s;\r\n box-shadow: 0 8px 20px rgba(37, 99, 235, .21);\r\n}\r\n\r\n.cta-upload:hover {\r\n background: linear-gradient(140deg, #1758e6 0%, #19a2e6 100%);\r\n}\r\n\r\n.sidebar.floating.collapsed .cta-label {\r\n display: none;\r\n}\r\n\r\n.sidebar.floating.collapsed .cta-upload {\r\n padding: 13px 10px;\r\n border-radius: 18px;\r\n}\r\n\r\n@media (max-width: 900px) {\r\n\r\n .sidebar.floating,\r\n .sidebar.floating.open,\r\n .sidebar.floating.collapsed {\r\n left: 6px;\r\n top: 6px;\r\n bottom: 6px;\r\n width: 90vw;\r\n min-width: 60px;\r\n max-width: 92vw;\r\n padding: 18px 3px;\r\n }\r\n\r\n .main-inner {\r\n padding: 0 16px;\r\n }\r\n\r\n .sidebar.open~.content {\r\n margin-left: 110px;\r\n }\r\n\r\n .sidebar.collapsed~.content {\r\n margin-left: 54px;\r\n }\r\n}\r\n\r\n.app-shell {\r\n grid-template-columns: 290px 1fr;\r\n min-height: 100vh;\r\n padding-left: 0;\r\n}\r\n\r\n.sidebar.floating.collapsed~.content {\r\n margin-left: 68px !important;\r\n transition: margin-left 0.25s;\r\n}\r\n\r\n.sidebar.floating.open~.content {\r\n margin-left: 260px !important;\r\n transition: margin-left 0.25s;\r\n}\r\n\r\n/* Laptop (1024px - 1200px) */\r\n@media (max-width: 1200px) and (min-width: 1025px) {\r\n\r\n .panel,\r\n .main-inner {\r\n max-width: 98vw;\r\n }\r\n\r\n .grid.cards {\r\n grid-template-columns: repeat(3, 1fr);\r\n }\r\n\r\n .grid.split {\r\n grid-template-columns: 1fr;\r\n gap: 20px 0;\r\n }\r\n\r\n .grid.cards {\r\n gap: 16px;\r\n }\r\n\r\n .stat-card {\r\n margin-bottom: 0;\r\n }\r\n\r\n .conversation-shell.full {\r\n grid-template-columns: minmax(260px, 300px) 1fr;\r\n }\r\n}\r\n\r\n@media (max-width: 1200px) {\r\n\r\n .panel,\r\n .main-inner {\r\n max-width: 98vw;\r\n }\r\n\r\n .grid.cards {\r\n grid-template-columns: repeat(2, 1fr);\r\n }\r\n\r\n .grid.split {\r\n grid-template-columns: 1fr;\r\n gap: 16px 0;\r\n }\r\n\r\n .grid.cards {\r\n gap: 12px;\r\n }\r\n\r\n .stat-card {\r\n margin-bottom: 0;\r\n }\r\n}\r\n\r\n@media (max-width: 700px) {\r\n .main-inner {\r\n padding: 0 5vw;\r\n }\r\n\r\n .panel {\r\n padding: 18px 6vw 22px 6vw;\r\n margin-top: 18px;\r\n }\r\n\r\n .grid.cards {\r\n grid-template-columns: 1fr;\r\n gap: 14px 0;\r\n }\r\n\r\n .stat-card {\r\n padding: 16px 14px;\r\n }\r\n\r\n .panel-section,\r\n .grid.split {\r\n padding: 0;\r\n box-shadow: none;\r\n border: none;\r\n }\r\n\r\n .sidebar.open~.content,\r\n .sidebar.collapsed~.content {\r\n margin-left: 0;\r\n }\r\n\r\n .panel {\r\n margin: 16px 0;\r\n padding: 16px;\r\n gap: 24px;\r\n border-radius: 16px;\r\n }\r\n\r\n .grid.cards {\r\n gap: 18px;\r\n }\r\n\r\n .grid.split {\r\n gap: 24px;\r\n }\r\n\r\n .panel-section {\r\n margin-bottom: 0;\r\n padding-top: 12px;
3\r\n border-top: 1px solid rgba(148, 163, 184, 0.25);\r\n }\r\n\r\n .panel-section:first-of-type {\r\n border-top: none;\r\n padding-top: 0;\r\n }\r\n\r\n .stats-to-sections {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 18px;\r\n }\r\n\r\n .stat-card header {\r\n margin-bottom: 4px;\r\n }\r\n\r\n .stat-card footer {\r\n margin-top: 0;\r\n }\r\n\r\n .stats-to-sections {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 16px;\r\n }\r\n\r\n .stats-to-sections .mobile-box {\r\n border-top: none;\r\n padding: 0;\r\n }\r\n\r\n .stats-to-sections .mobile-box:nth-of-type(2) {\r\n border-top: 1px solid rgba(148, 163, 184, 0.25) !important;\r\n }\r\n\r\n .stats-to-sections .mobile-box .section-header {\r\n margin-bottom: 12px;\r\n padding: 0;\r\n }\r\n\r\n .stats-to-sections .mobile-box .section-title {\r\n margin: 0;\r\n font-size: 1.02rem;\r\n font-weight: 600;\r\n }\r\n\r\n .stats-to-sections .mobile-box {\r\n padding: 0;\r\n background: #fbfcff;\r\n border-radius: 18px;\r\n box-shadow: 0 16px 32px rgba(23, 24, 65, 0.08);\r\n overflow: hidden;\r\n border: 1px solid rgba(148, 163, 184, 0.18);\r\n }\r\n\r\n .stats-to-sections .mobile-box .lead-list,\r\n .stats-to-sections .mobile-box .calendar-embed {\r\n padding: 0;\r\n }\r\n}\r\n\r\n\r\n\r\n/* .content {\r\n padding-top: 86px;\r\n} */\r\n\r\n.page-title {\r\n margin: 0;\r\n font-size: 1.25rem;\r\n font-weight: 700;\r\n color: #1f2545;\r\n}\r\n\r\n.page-subtitle {\r\n margin: 0 0 0 0;\r\n color: #7a7f99;\r\n}\r\n\r\n/* Logo row with text */\r\n.logo-row {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n\r\n/* Dashboard sidebar logo container */\r\n.sidebar .logo-row {\r\n height: 88px;\r\n padding-top: 0;\r\n margin-top: 0;\r\n margin-bottom: 32px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n\r\n.logo-text {\r\n font-weight: 700;\r\n color: #4b3abf;\r\n letter-spacing: .02em;\r\n font-size: 1.25rem;\r\n}\r\n\r\n/* Logo and footer */\r\n.logo-box {\r\n width: 34px;\r\n height: 34px;\r\n border-radius: 0;\r\n background: transparent;\r\n color: #fff;\r\n display: grid;\r\n place-items: center;\r\n font-weight: 700;\r\n font-size: 1.25rem;\r\n margin: 0;\r\n box-shadow: none;\r\n flex-shrink: 0;\r\n}\r\n\r\n.logout-btn {\r\n width: 100%;\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n background: #fff;\r\n color: #6b4bff;\r\n padding: 10px 12px;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n font-weight: 500;\r\n}\r\n\r\n.logout-btn:hover {\r\n background: #faf7ff;\r\n border-color: #6b4bff;\r\n color: #6b4bff;\r\n}\r\n\r\n/* Active color emphasis */\r\n.nav-item.active {\r\n background: #eee8ff;\r\n color: #6b4bff;\r\n box-shadow: inset 0 0 0 1.5px #dcd2ff;\r\n}\r\n\r\n/* Sidebar font/weight tweaks */\r\n.nav-item {\r\n color: #4a4f6b;\r\n font-weight: 400;\r\n}\r\n\r\n.nav-item .nav-item-label {\r\n color: #444a66;\r\n}\r\n\r\n/* Desktop defaults */\r\n.menu-toggle {\r\n display: none;\r\n border: none;\r\n background: transparent;\r\n padding: 6px;\r\n border-radius: 10px;\r\n}\r\n\r\n.sidebar-overlay {\r\n display: none;\r\n}\r\n\r\n.mobile-brand,\r\n.mobile-actions,\r\n.mobile-heading,\r\n.menu-profile {\r\n display: none;\r\n}\r\n\r\n.search-wide {\r\n width: 290px;\r\n flex: 0 0 290px;\r\n}\r\n\r\n.title-wrap {\r\n flex: 1;\r\n}\r\n\r\n.actions {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n}\r\n\r\n.search-wide {\r\n margin-left: auto;\r\n margin-right: 12px;\r\n}\r\n\r\n/* Tablet (<=1024px) */\r\n@media (max-width: 1024px) {\r\n .menu-toggle {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 8px;\r\n color: #1f2545;\r\n z-index: 100;\r\n position: relative;\r\n cursor: pointer;\r\n }\r\n\r\n .logo-text {\r\n font-size: 1.2rem;\r\n }\r\n\r\n .logo-box {\r\n width: 34px;\r\n height: 34px;\r\n font-size: 1.4rem;\r\n }\r\n\r\n .sidebar {\r\n position: fixed;\r\n left: 0;\r\n top: 0;\r\n bottom: 0;\r\n width: 260px;\r\n transform: translateX(-110%);\r\n transition: transform 0.25s ease;\r\n visibility: hidden;\r\n pointer-events: none;\r\n z-index: 70;\r\n }\r\n\r\n .sidebar.show {\r\n transform: translateX(0);\r\n visibility: visible;\r\n pointer-events: auto;\r\n z-index: 70;\r\n }\r\n\r\n .sidebar-overlay {\r\n display: none;\r\n position: fixed;\r\n inset: 0;\r\n background: rgba(0, 0, 0, 0.25);\r\n z-index: 65;\r\n cursor: pointer;\r\n }\r\n\r\n .sidebar.show+.sidebar-overlay,\r\n .sidebar-overlay.show {\r\n display: block;\r\n }\r\n\r\n .sidebar.show .nav-item {\r\n pointer-events: auto;\r\n cursor: pointer;\r\n }\r\n\r\n .app-shell {\r\n display: block;\r\n }\r\n\r\n .content {\r\n margin-left: 0;\r\n width: 100%;\r\n }\r\n\r\n .topbar {\r\n left: 0;\r\n z-index: 100;\r\n }\r\n\r\n .user-chip {\r\n display: none;\r\n }\r\n\r\n .menu-profile {\r\n display: none;\r\n }\r\n\r\n .menu-profile-name {\r\n display: none;\r\n }\r\n\r\n .panel {\r\n margin: 32px;\r\n padding: 24px;\r\n }\r\n\r\n .grid.cards {\r\n gap: 18px;\r\n }\r\n\r\n .grid.split {\r\n gap: 18px;\r\n }\r\n\r\n .panel-section {\r\n margin-bottom: 18px;\r\n }\r\n}\r\n\r\n/* Mobile (<=700px) */\r\n@media (max-width: 700px) {\r\n .menu-toggle {\r\n z-index: 100;\r\n position: relative;\r\n cursor: pointer;\r\n }\r\n\r\n .mobile-brand {\r\n display: block;\r\n font-weight: 700;\r\n color: #4b3abf;\r\n font-size: 1.25rem;\r\n letter-spacing: .02em;\r\n }\r\n\r\n .logo-text {\r\n font-size: 1.1rem;\r\n }\r\n\r\n .logo-box {\r\n width: 32px;\r\n height: 32px;\r\n font-size: 1.25rem;\r\n }\r\n\r\n .sidebar {\r\n z-index: 70;\r\n }\r\n\r\n .sidebar.show {\r\n z-index: 70;\r\n }\r\n\r\n .sidebar-overlay {\r\n z-index: 65;\r\n }\r\n\r\n .sidebar.show+.sidebar-overlay,\r\n .sidebar-overlay.show {\r\n display: block;\r\n }\r\n\r\n .sidebar.show .nav-item {\r\n pointer-events: auto;\r\n cursor: pointer;\r\n }\r\n\r\n .mobile-actions {\r\n display: flex;
3\r\n align-items: center;\r\n gap: 10px;\r\n margin-left: auto;\r\n }\r\n\r\n .mobile-actions .icon-btn {\r\n padding: 8px;\r\n border-radius: 12px;\r\n }\r\n\r\n .mobile-heading {\r\n display: block;\r\n margin: 8px 16px 0 16px;\r\n font-weight: 600;\r\n color: #1f2545;\r\n text-transform: capitalize;\r\n }\r\n\r\n .title-wrap {\r\n display: none !important;\r\n }\r\n\r\n .actions {\r\n display: none !important;\r\n }\r\n\r\n .search-wide {\r\n display: none !important;\r\n }\r\n\r\n .topbar {\r\n padding: 12px 16px;\r\n left: 0;\r\n right: 0;\r\n z-index: 100;\r\n }\r\n\r\n .content {\r\n padding-left: 16px;\r\n padding-right: 16px;\r\n padding-top: 86px;\r\n margin-left: 0;\r\n }\r\n\r\n .panel {\r\n margin: 0 0 16px 0;\r\n padding: 16px;\r\n gap: 24px;\r\n }\r\n\r\n /* Calendar mobile fixes */\r\n .calendar-grid.two-column {\r\n grid-template-columns: 1fr;\r\n gap: 16px;\r\n }\r\n\r\n .calendar-card.wide {\r\n grid-column: span 1;\r\n }\r\n\r\n .calendar-card {\r\n padding: 16px;\r\n gap: 12px;\r\n }\r\n\r\n .panel-header {\r\n flex-direction: column;\r\n align-items: flex-start;\r\n gap: 16px;\r\n }\r\n\r\n .panel-header .actions {\r\n display: none;\r\n }\r\n\r\n .mobile-search-wrapper {\r\n display: block;\r\n width: 100%;\r\n }\r\n\r\n .mobile-search-wrapper .search-wrapper {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n background: #fff;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n width: 100%;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .mobile-search-wrapper .search-wrapper:focus-within {\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n }\r\n\r\n .mobile-search-wrapper .search-wrapper .search-icon {\r\n position: absolute;\r\n left: 14px;\r\n color: #7a7f99;\r\n pointer-events: none;\r\n z-index: 1;\r\n }\r\n\r\n .mobile-search-wrapper .search-wrapper:focus-within .search-icon {\r\n color: #6b4bff;\r\n }\r\n\r\n .mobile-search-wrapper .search {\r\n width: 100%;\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n padding: 10px 16px 10px 44px;\r\n font-size: 0.95rem;\r\n color: #1f2545;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n .mobile-search-wrapper .search::-moz-placeholder {\r\n color: #c1c6d6;\r\n }\r\n\r\n .mobile-search-wrapper .search::placeholder {\r\n color: #c1c6d6;\r\n }\r\n\r\n .panel-header .panel-actions {\r\n width: auto;\r\n flex-direction: row;\r\n gap: 12px;\r\n align-items: center;\r\n }\r\n\r\n .panel-header .panel-actions .button.secondary:has(svg:only-child) {\r\n width: 44px;\r\n height: 44px;\r\n }\r\n\r\n .panel-header .panel-actions {\r\n width: 100%;\r\n }\r\n\r\n .panel-header .panel-actions .button.primary {\r\n flex-shrink: 0;\r\n width: auto;\r\n }\r\n\r\n .stat-card {\r\n padding: 16px 14px;\r\n }\r\n\r\n .stat-card header {\r\n margin-bottom: 2px;\r\n font-size: 0.82rem;\r\n }\r\n\r\n .stat-card .value {\r\n margin: 0;\r\n font-size: 1.8rem;\r\n }\r\n\r\n .stat-card footer {\r\n margin-top: 2px;\r\n font-size: 0.85rem;\r\n }\r\n\r\n .stats-to-sections {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 16px;\r\n }\r\n\r\n .stats-to-sections .panel-section {\r\n border-top: none;\r\n padding: 0;\r\n box-shadow: 0 12px 32px rgba(23, 24, 65, 0.08);\r\n border-radius: 18px;\r\n padding: 16px;\r\n background: #fbfcff;\r\n }\r\n\r\n .stats-to-sections .panel-section+.panel-section {\r\n margin-top: 0;\r\n }\r\n}\r\n\r\n/* Onboarding Styles */\r\n.onboarding-container {\r\n min-height: 100vh;\r\n background: linear-gradient(135deg, #f6f8fa 0%, #faf7ff 100%);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 20px;\r\n}\r\n\r\n.onboarding-loading {\r\n min-height: 100vh;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 16px;\r\n color: #6b4bff;\r\n}\r\n\r\n.onboarding-loading .spinner {\r\n animation: spin 1s linear infinite;\r\n}\r\n\r\n@keyframes spin {\r\n from {\r\n transform: rotate(0deg);\r\n }\r\n\r\n to {\r\n transform: rotate(360deg);\r\n }\r\n}\r\n\r\n.onboarding-wrapper {\r\n background: #ffffff;\r\n border-radius: 24px;\r\n box-shadow: 0 20px 60px rgba(36, 37, 60, 0.12);\r\n max-width: 600px;\r\n width: 100%;\r\n padding: 40px;\r\n}\r\n\r\n.onboarding-progress {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n margin-bottom: 48px;\r\n position: relative;\r\n}\r\n\r\n.progress-step {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n flex: 1;\r\n position: relative;\r\n}\r\n\r\n.progress-step-icon {\r\n width: 48px;\r\n height: 48px;\r\n border-radius: 50%;\r\n background: #f0f0f0;\r\n color: #999;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n margin-bottom: 12px;\r\n transition: all 0.3s ease;\r\n border: 2px solid #e0e0e0;\r\n}\r\n\r\n.progress-step.completed .progress-step-icon {\r\n background: #6b4bff;\r\n color: #ffffff;\r\n border-color: #6b4bff;\r\n}\r\n\r\n.progress-step.current .progress-step-icon {\r\n background: #ece6ff;\r\n color: #6b4bff;\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 4px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.progress-step-label {\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n color: #666;\r\n text-align: center;\r\n}\r\n\r\n.progress-step.completed .progress-step-label,\r\n.progress-step.current .progress-step-label {\r\n color: #6b4bff;\r\n}\r\n\r\n.progress-line {\r\n position: absolute;\r\n top: 24px;\r\n left: calc(50% + 24px);\r\n right: calc(-50% + 24px);\r\n height: 2px;\r\n background: #e0e0e0;\r\n z-index: 0;\r\n}\r\n\r\n.progress-step.completed+.progress-step .progress-line {\r\n background: #6b4bff;\r\n}\r\n\r\n.progress-step:last-child .progress-line {\r\n display: none;\r\n}\r\n\r\n.onboarding-content {\r\n min-height: 400px;\r\n}\r\n\r\n.onboarding-header {\r\n text-align: center;\r\n margin-bottom: 40px;\r\n}\r\n\r\n.onboarding-icon {\r\n color: #6b4bff;\r\n margin-bottom: 16px;\r\n}\r\n\r\n.onboarding-header h2 {\r\n font-size: 1.875rem;\r\n font-weight: 700;\r\n color: #1f2a44;\r\n margin: 0 0 8px 0;\r\n}\r\n\r\n.onboarding-header p {\r\n font-size: 1rem;\r\n color: #7a7f99;\r\n margin: 0;\r\n}\r\n\r\n/* Step Indicator Styles */\r\n.onboarding-steps {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 24px;\r\n margin-bottom: 40px;\r\n padding: 0 20px;\r\n}\r\n\r\n.step-indicator {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 8px;\r\n flex: 0 0 auto;\r\n position: relative;\r\n}\r\n\r\n.step-indicator:not(:last-child)::after {\r\n content: '';\r\n position: absolute;\r\n top: 16px;\r\n left: 50%;\r\n width: calc(100% + 24px);\r\n height: 2px;\r\n background: #e5e7eb;\r\n z-index: 0;\r\n}\r\n\r\n.step-indicator.completed:not(:last-child)::after {\r\n background: #6b4bff;\r\n}\r\n\r\n.step-number {\r\n width: 32px;\r\n height: 32px;\r\n border-radius: 50%;\r\n background: #f3f4f6;\r\n border: 2px solid #e5e7eb;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-weight: 600;\r\n font-size: 0.875rem;\r\n color: #9ca3af;\r\n position: relative;\r\n z-index: 1;\r\n transition: all 0.3s ease;\r\n}\r\n\r\n.step-indicator.active .step-number {\r\n background: #6b4bff;\r\n border-color: #6b4bff;\r\n color: #ffffff;\r\n}\r\n\r\n.step-indicator.completed .step-number {\r\n background: #6b4bff;\r\n border-color: #6b4bff;\r\n color: #ffffff;\r\n}\r\n\r\n.step-label {\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n color: #9ca3af;\r\n transition: color 0.3s ease;\r\n}\r\n\r\n.step-indicator.active .step-label {\r\n color: #6b4bff;\r\n}\r\n\r\n.step-indicator.completed .step-label {\r\n color: #6b4bff;\r\n}\r\n\r\n.onboarding-error {\r\n background: #fee;\r\n color: #c33;\r\n padding: 12px 16px;\r\n border-radius: 12px;\r\n margin-bottom: 24px;\r\n border: 1px solid #fcc;\r\n}\r\n\r\n.onboarding-success {\r\n background: #f0fdf4;\r\n color: #166534;\r\n padding: 12px 16px;\r\n border-radius: 12px;\r\n border: 1px solid #bbf7d0;\r\n}\r\n\r\n/* Settings View Mode Styles */\r\n.settings-profile-card {\r\n background: #ffffff;\r\n border-radius: 16px;\r\n border: 1px solid #ece8ff;\r\n padding: 32px;\r\n box-shadow: 0 2px 8px rgba(107, 75, 255, 0.05);\r\n}\r\n\r\n.settings-profile-row {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 24px;\r\n margin-bottom: 16px;\r\n}\r\n\r\n.settings-profile-item {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n margin-bottom: 16px;\r\n}\r\n\r\n.settings-profile-row .settings-profile-item {\r\n margin-bottom: 0;\r\n}\r\n\r\n.settings-profile-label {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n font-weight: 600;\r\n color: #384066;\r\n font-size: 0.875rem;\r\n margin-bottom: 4px;\r\n}\r\n\r\n.settings-profile-label svg {\r\n color: #6b4bff;\r\n flex-shrink: 0;\r\n}\r\n\r\n.settings-profile-value {\r\n font-size: 1rem;\r\n color: #1f2545;\r\n font-weight: 500;\r\n padding: 8px 0;\r\n min-height: 24px;\r\n}\r\n\r\n.settings-empty {\r\n color: #94a3b8;\r\n font-style: italic;\r\n font-weight: 400;\r\n}\r\n\r\n.settings-badge {\r\n display: inline-block;\r\n padding: 6px 14px;\r\n background: #f0f0f8;\r\n color: #6b4bff;\r\n border-radius: 20px;\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n border: 1px solid #ece8ff;\r\n}\r\n\r\n@media (max-width: 700px) {\r\n .settings-profile-row {\r\n grid-template-columns: 1fr;\r\n gap: 24px;\r\n }\r\n\r\n .settings-profile-card {\r\n padding: 16px;\r\n }\r\n}\r\n\r\n.onboarding-step-content {\r\n animation: fadeIn 0.3s ease;\r\n}\r\n\r\n@keyframes fadeIn {\r\n from {\r\n opacity: 0;\r\n transform: translateY(10px);\r\n }\r\n\r\n to {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n}\r\n\r\n/* Subscription Step */\r\n.subscription-card {\r\n background: linear-gradient(135deg, #faf7ff 0%, #ffffff 100%);\r\n border: 2px solid #ece8ff;\r\n border-radius: 16px;\r\n padding: 32px;\r\n margin-bottom: 24px;\r\n}\r\n\r\n.subscription-header {\r\n text-align: center;\r\n margin-bottom: 32px;\r\n padding-bottom: 24px;\r\n border-bottom: 1px solid #ece8ff;\r\n}\r\n\r\n.subscription-header h3 {\r\n font-size: 1.5rem;\r\n font-weight: 700;\r\n color: #1f2a44;\r\n margin: 0 0 16px 0;\r\n}\r\n\r\n.subscription-price {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 4px;\r\n}\r\n\r\n.price-amount {\r\n font-size: 3rem;\r\n font-weight: 700;\r\n color: #6b4bff;\r\n}\r\n\r\n.price-period {\r\n font-size: 0.875rem;\r\n color: #7a7f99;\r\n}\r\n\r\n.subscription-features {\r\n list-style: none;\r\n padding: 0;\r\n margin: 0 0 24px 0;\r\n}\r\n\r\n.subscription-features li {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 12px 0;\r\n color: #384066;\r\n}\r\n\r\n.subscription-features li svg {\r\n color: #6b4bff;\r\n flex-shrink: 0;\r\n}\r\n\r\n.subscription-payment {\r\n text-align: center;\r\n}\r\n\r\n.payment-note {\r\n font-size: 0.875rem;\r\n color: #7a7f99;\r\n margin: 0;\r\n}\r\n\r\n/* Form Styles */\r\n.onboarding-form {\r\n max-width: 600px;\r\n margin: 0 auto;\r\n padding: 0;\r\n width: 100%;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 16px;\r\n}\r\n\r\n.form-row {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 16px;\r\n margin-bottom: 0;\r\n}\r\n\r\n.form-group {\r\n margin-bottom: 0;\r\n}\r\n\r\n.form-row .form-group {\r\n margin-bottom: 0;\r\n}\r\n\r\n/* Ensure consistent spacing in settings form */\r\n.panel .onboarding-form {\r\n padding: 0;\r\n}\r\n\r\n.form-group label {\r\n display: block;\r\n font-weight: 600;\r\n color: #384066;\r\n margin-bottom: 8px;\r\n font-size: 0.875rem;\r\n}\r\n\r\n.input-with-icon {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.input-with-icon .input-icon {\r\n position: absolute;\r\n right: 16px;\r\n color: #7a7f99;\r\n z-index: 1;\r\n pointer-events: none;\r\n}\r\n\r\n.input-with-icon input,\r\n.input-with-icon select {\r\n width: 100%;\r\n padding: 12px 44px 12px 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n font-size: 1rem;\r\n background: #ffffff;\r\n color: #1f2a44;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n}\r\n\r\n.input-with-icon.textarea-with-icon .input-icon {\r\n top: 16px;\r\n right: 16px;\r\n align-self: flex-start;\r\n}\r\n\r\n.input-with-icon textarea {\r\n width: 100%;\r\n padding: 12px 44px 12px 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n font-size: 1rem;\r\n background: #ffffff;\r\n color: #1f2a44;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n resize: vertical;\r\n min-height: 100px;\r\n}\r\n\r\n.input-with-icon input:focus,\r\n.input-with-icon select:focus,\r\n.input-with-icon textarea:focus {\r\n outline: none;\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.input-with-icon:focus-within .input-icon {\r\n color: #6b4bff;\r\n}\r\n\r\n.input-with-icon input::-moz-placeholder, .input-with-icon textarea::-moz-placeholder {\r\n color: #c1c6d6;\r\n}\r\n\r\n.input-with-icon input::placeholder,\r\n.input-with-icon textarea::placeholder {\r\n color: #c1c6d6;\r\n}\r\n\r\n/* Fallback for inputs without icons */\r\n.form-group input:not(.input-with-icon input),\r\n.form-group select:not(.input-with-icon select),\r\n.form-group textarea:not(.input-with-icon textarea) {\r\n width: 100%;\r\n padding: 12px 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n font-size: 1rem;\r\n background: #ffffff;\r\n color: #1f2a44;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n}\r\n\r\n.form-group input:not(.input-with-icon input):focus,\r\n.form-group select:not(.input-with-icon select):focus,\r\n.form-group textarea:not(.input-with-icon textarea):focus {\r\n outline: none;\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.form-group input:not(.input-with-icon input)::-moz-placeholder, .form-group textarea:not(.input-with-icon textarea)::-moz-placeholder {\r\n color: #c1c6d6;\r\n}\r\n\r\n.form-group input:not(.input-with-icon input)::placeholder,\r\n.form-group textarea:not(.input-with-icon textarea)::placeholder {\r\n color: #c1c6d6;\r\n}\r\n\r\n.form-group textarea:not(.input-with-icon textarea) {\r\n resize: vertical;\r\n min-height: 100px;\r\n}\r\n\r\n/* Areas Served */\r\n.areas-served-container {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 12px;\r\n margin-top: 8px;\r\n}\r\n\r\n.area-button {\r\n padding: 8px 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 20px;\r\n background: #ffffff;\r\n color: #384066;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n}\r\n\r\n.area-button:hover {\r\n border-color: #6b4bff;\r\n background: #faf7ff;\r\n color: #6b4bff;\r\n}\r\n\r\n.area-button.selected {\r\n background: #6b4bff;\r\n color: #ffffff;\r\n border-color: #6b4bff;\r\n}\r\n\r\n.area-button.selected:hover {\r\n background: #5a3fe6;\r\n border-color: #5a3fe6;\r\n}\r\n\r\n.areas-served-display {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 8px;\r\n}\r\n\r\n.area-badge {\r\n display: inline-block;\r\n padding: 6px 14px;\r\n border-radius: 20px;\r\n background: #6b4bff;\r\n color: #ffffff;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n border: 1px solid #6b4bff;\r\n}\r\n\r\n/* Agent Voice */\r\n.agent-voice-container {\r\n display: flex;\r\n flex-wrap: wrap;\r\n gap: 12px;\r\n margin-top: 8px;\r\n}\r\n\r\n.voice-button {\r\n padding: 8px 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 20px;\r\n background: #ffffff;\r\n color: #384066;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n
3 cursor: pointer;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n}\r\n\r\n.voice-button:hover {\r\n border-color: #6b4bff;\r\n background: #faf7ff;\r\n color: #6b4bff;\r\n}\r\n\r\n.voice-button.selected {\r\n background: #6b4bff;\r\n color: #ffffff;\r\n border-color: #6b4bff;\r\n}\r\n\r\n.voice-button.selected:hover {\r\n background: #5a3fe6;\r\n border-color: #5a3fe6;\r\n}\r\n\r\n/* Working Hours Styles */\r\n.working-hours-container {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 12px;\r\n margin-top: 8px;\r\n}\r\n\r\n.working-hours-row {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n background: #faf7ff;\r\n transition: all 0.2s ease;\r\n gap: 20px;\r\n}\r\n\r\n.working-hours-row:hover {\r\n border-color: #d4c5ff;\r\n background: #f5f0ff;\r\n}\r\n\r\n.working-hours-day {\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n flex: 0 0 auto;\r\n min-width: 0;\r\n}\r\n\r\n.working-hours-day input[type=\"checkbox\"] {\r\n width: 18px;\r\n height: 18px;\r\n min-width: 18px;\r\n max-width: 18px;\r\n margin: 0;\r\n cursor: pointer;\r\n accent-color: #6b4bff;\r\n flex-shrink: 0;\r\n}\r\n\r\n.working-hours-day-label {\r\n font-size: 0.9375rem;\r\n font-weight: 500;\r\n color: #1f2a44;\r\n cursor: pointer;\r\n -webkit-user-select: none;\r\n -moz-user-select: none;\r\n user-select: none;\r\n white-space: nowrap;\r\n margin: 0 !important;\r\n margin-bottom: 0 !important;\r\n line-height: 1;\r\n padding: 0;\r\n}\r\n\r\n.working-hours-time {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n flex: 0 0 auto;\r\n margin-left: auto;\r\n}\r\n\r\n.time-input,\r\ninput[type=\"time\"].time-input,\r\n.form-group input.time-input {\r\n padding: 8px !important;\r\n border: 1px solid #d1d5db;\r\n border-radius: 8px;\r\n font-size: 0.9375rem;\r\n color: #1f2a44;\r\n background: #ffffff;\r\n transition: all 0.2s ease;\r\n min-width: 120px;\r\n}\r\n\r\n.time-input:focus {\r\n outline: none;\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.time-separator {\r\n font-size: 0.875rem;\r\n color: #7a7f99;\r\n font-weight: 500;\r\n}\r\n\r\n.working-hours-display {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n}\r\n\r\n.working-hours-display-item {\r\n display: flex;\r\n align-items: center;\r\n gap: 12px;\r\n padding: 8px 12px;\r\n background: #faf7ff;\r\n border-radius: 8px;\r\n border: 1px solid #ece8ff;\r\n}\r\n\r\n.working-hours-display-day {\r\n font-weight: 600;\r\n color: #1f2a44;\r\n min-width: 100px;\r\n}\r\n\r\n.working-hours-display-time {\r\n color: #7a7f99;\r\n font-size: 0.9375rem;\r\n}\r\n\r\n/* Availability Dropdown Styles */\r\n.availability-dropdown {\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.availability-trigger {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 8px 12px;\r\n background: #ffffff;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n}\r\n\r\n.availability-trigger:hover {\r\n border-color: #6b4bff;\r\n background: #faf7ff;\r\n}\r\n\r\n.availability-indicator {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n}\r\n\r\n.status-dot {\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 50%;\r\n display: inline-block;\r\n flex-shrink: 0;\r\n}\r\n\r\n.status-dot.available {\r\n background-color: #10b981;\r\n box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);\r\n}\r\n\r\n.status-dot.busy {\r\n background-color: #ef4444;\r\n box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2);\r\n}\r\n\r\n.status-text {\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n color: #1f2a44;\r\n white-space: nowrap;\r\n}\r\n\r\n.dropdown-arrow {\r\n color: #7a7f99;\r\n transition: transform 0.2s ease;\r\n}\r\n\r\n.dropdown-arrow.open {\r\n transform: rotate(180deg);\r\n}\r\n\r\n.availability-menu {\r\n position: absolute;\r\n top: calc(100% + 8px);\r\n right: 0;\r\n background: #ffffff;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n box-shadow: 0 8px 24px rgba(23, 24, 65, 0.12);\r\n min-width: 280px;\r\n z-index: 1000;\r\n overflow: hidden;\r\n}\r\n\r\n.availability-schedule {\r\n padding: 16px;\r\n background: #faf7ff;\r\n border-bottom: 1px solid #ece8ff;\r\n}\r\n\r\n.schedule-header {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n margin-bottom: 12px;\r\n font-size: 0.75rem;\r\n font-weight: 600;\r\n color: #6b4bff;\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n}\r\n\r\n.schedule-header svg {\r\n color: #6b4bff;\r\n}\r\n\r\n.schedule-info {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n}\r\n\r\n.schedule-item {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-start;\r\n gap: 12px;\r\n font-size: 0.8125rem;\r\n}\r\n\r\n.schedule-label {\r\n font-weight: 600;\r\n color: #384066;\r\n min-width: 40px;\r\n}\r\n\r\n.schedule-value {\r\n color: #1f2a44;\r\n text-align: right;\r\n flex: 1;\r\n}\r\n\r\n.schedule-note {\r\n margin-top: 8px;\r\n padding: 8px 12px;\r\n background: #fff;\r\n border: 1px solid #ece8ff;\r\n border-radius: 8px;\r\n font-size: 0.75rem;\r\n color: #7a7f99;\r\n font-style: italic;\r\n}\r\n\r\n.availability-divider {\r\n height: 1px;\r\n background: #ece8ff;\r\n margin: 0;\r\n}\r\n\r\n.availability-option {\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n width: 100%;\r\n padding: 12px 16px;\r\n background: transparent;\r\n border: none;\r\n text-align: left;\r\n cursor: pointer;\r\n transition: background 0.2s ease;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n color: #1f2a44;\r\n font-family: inherit;\r\n}\r\n\r\n.availability-option:hover {\r\n background: #faf7ff;\r\n}\r\n\r\n.availability-option.active {\r\n background: #f5f0ff;\r\n color: #6b4bff;\r\n}\r\n\r\n/* Busy Status Modal Styles */\r\n.modal-overlay {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n background: rgba(0, 0, 0, 0.5);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n z-index: 10000;\r\n padding: 20px;\r\n margin-top:0px !important;\r\n}\r\n\r\n.busy-status-modal {\r\n background: #ffffff;\r\n border-radius: 16px;\r\n box-shadow: 0 16px 48px rgba(23, 24, 65, 0.2);\r\n width: 100%;\r\n max-width: 480px;\r\n max-height: 90vh;\r\n overflow-y: auto;\r\n}\r\n\r\n.modal-header {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 24px 24px 0 24px;\r\n border-bottom: 1px solid #ece8ff;\r\n margin-bottom: 24px;\r\n padding-bottom: 20px;\r\n}\r\n\r\n.modal-header h3 {\r\n margin: 0;\r\n font-size: 1.25rem;\r\n font-weight: 700;\r\n color: #1f2a44;\r\n}\r\n\r\n.modal-close {\r\n background: transparent;\r\n border: none;\r\n cursor: pointer;\r\n color: #7a7f99;\r\n padding: 4px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n border-radius: 8px;\r\n transition: all 0.2s ease;\r\n}
3\r\n\r\n.modal-close:hover {\r\n background: #f3f4f6;\r\n color: #1f2a44;\r\n}\r\n\r\n.busy-status-form {\r\n padding: 0 24px 24px 24px;\r\n}\r\n\r\n.modal-description {\r\n color: #7a7f99;\r\n font-size: 0.9375rem;\r\n margin: 0 0 24px 0;\r\n line-height: 1.5;\r\n}\r\n\r\n.busy-time-section {\r\n margin-bottom: 24px;\r\n}\r\n\r\n.busy-time-section:last-of-type {\r\n margin-bottom: 0;\r\n}\r\n\r\n.section-title {\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n color: #384066;\r\n margin: 0 0 16px 0;\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n}\r\n\r\n.modal-error {\r\n background: #fee;\r\n color: #c33;\r\n padding: 12px 16px;\r\n border-radius: 8px;\r\n margin-bottom: 20px;\r\n border: 1px solid #fcc;\r\n font-size: 0.875rem;\r\n}\r\n\r\n.busy-status-form .form-group {\r\n margin-bottom: 20px;\r\n}\r\n\r\n.busy-status-form .form-group label {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n font-weight: 600;\r\n color: #384066;\r\n margin-bottom: 8px;\r\n font-size: 0.875rem;\r\n}\r\n\r\n.busy-status-form .form-group label svg {\r\n color: #6b4bff;\r\n}\r\n\r\n.busy-status-form .form-input {\r\n width: 100%;\r\n padding: 12px 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n font-size: 0.9375rem;\r\n color: #1f2a44;\r\n background: #ffffff;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n}\r\n\r\n.busy-status-form .form-input:focus {\r\n outline: none;\r\n border-color: #6b4bff;\r\n box-shadow: 0 0 0 3px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.datetime-input-wrapper {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.datetime-input {\r\n padding-right: 48px !important;\r\n cursor: pointer;\r\n}\r\n\r\n.datetime-input:focus {\r\n cursor: text;\r\n}\r\n\r\n.datetime-input::-webkit-calendar-picker-indicator {\r\n display: none !important;\r\n opacity: 0;\r\n position: absolute;\r\n right: 0;\r\n width: 0;\r\n height: 0;\r\n pointer-events: none;\r\n}\r\n\r\n.datetime-input::-moz-calendar-picker-indicator {\r\n display: none !important;\r\n}\r\n\r\n.datetime-input[type=\"datetime-local\"]::-webkit-inner-spin-button,\r\n.datetime-input[type=\"datetime-local\"]::-webkit-outer-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n}\r\n\r\n.datetime-icon-button {\r\n position: absolute;\r\n right: 12px;\r\n background: transparent;\r\n border: none;\r\n cursor: pointer;\r\n padding: 4px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #6b4bff;\r\n border-radius: 6px;\r\n transition: all 0.2s ease;\r\n z-index: 1;\r\n}\r\n\r\n.datetime-icon-button:hover {\r\n background: #f5f0ff;\r\n color: #5a3fe6;\r\n}\r\n\r\n.datetime-icon-button:active {\r\n background: #ece8ff;\r\n}\r\n\r\n.modal-actions {\r\n display: flex;\r\n justify-content: flex-end;\r\n gap: 12px;\r\n margin-top: 24px;\r\n padding-top: 20px;\r\n}\r\n\r\n/* Preferences Styles */\r\n.preferences-section {\r\n margin-bottom: 32px;\r\n padding-bottom: 32px;\r\n border-bottom: 1px solid #ece8ff;\r\n}\r\n\r\n.preferences-section:last-child {\r\n border-bottom: none;\r\n margin-bottom: 0;\r\n padding-bottom: 0;\r\n}\r\n\r\n.preferences-section h3 {\r\n font-size: 1.125rem;\r\n font-weight: 700;\r\n color: #1f2a44;\r\n margin: 0 0 20px 0;\r\n}\r\n\r\n.preference-item {\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 16px 0;\r\n}\r\n\r\n.preference-info {\r\n flex: 1;\r\n}\r\n\r\n.preference-info label {\r\n display: block;\r\n font-weight: 600;\r\n color: #384066;\r\n margin-bottom: 4px;\r\n font-size: 0.875rem;\r\n}\r\n\r\n.preference-info p {\r\n font-size: 0.8125rem;\r\n color: #7a7f99;\r\n margin: 0;\r\n}\r\n\r\n/* Toggle Switch */\r\n.toggle-switch {\r\n position: relative;\r\n display: inline-block;\r\n width: 48px;\r\n height: 26px;\r\n}\r\n\r\n.toggle-switch input {\r\n opacity: 0;\r\n width: 0;\r\n height: 0;\r\n}\r\n\r\n.toggle-slider {\r\n position: absolute;\r\n cursor: pointer;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;
3\r\n background-color: #e0e0e0;\r\n transition: 0.3s;\r\n border-radius: 26px;\r\n}\r\n\r\n.toggle-slider:before {\r\n position: absolute;\r\n content: \"\";\r\n height: 20px;\r\n width: 20px;\r\n left: 3px;\r\n bottom: 3px;\r\n background-color: white;\r\n transition: 0.3s;\r\n border-radius: 50%;\r\n}\r\n\r\n.toggle-switch input:checked+.toggle-slider {\r\n background-color: #6b4bff;\r\n}\r\n\r\n.toggle-switch input:checked+.toggle-slider:before {\r\n transform: translateX(22px);\r\n}\r\n\r\n/* Buttons */\r\n.onboarding-actions {\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n gap: 16px;\r\n margin-top: 32px;\r\n padding-top: 0;\r\n border-top: none;\r\n}\r\n\r\n.btn-primary,\r\n.btn-secondary {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 12px 24px;\r\n border-radius: 12px;\r\n font-size: 1rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n border: none;\r\n}\r\n\r\n.btn-primary {\r\n background: #6b4bff;\r\n color: #ffffff;\r\n}\r\n\r\n.btn-primary:hover:not(:disabled) {\r\n background: #5a3fe6;\r\n transform: translateY(-1px);\r\n box-shadow: 0 4px 12px rgba(107, 75, 255, 0.3);\r\n}\r\n\r\n.btn-primary:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\n.btn-secondary {\r\n background: #f0f0f0;\r\n color: #384066;\r\n}\r\n\r\n.btn-secondary:hover:not(:disabled) {\r\n background: #e0e0e0;\r\n}\r\n\r\n.btn-secondary:disabled {\r\n opacity: 0.6;\r\n cursor: not-allowed;\r\n}\r\n\r\n.btn-primary .spinner {\r\n animation: spin 1s linear infinite;\r\n}\r\n\r\n/* Responsive */\r\n@media (max-width: 700px) {\r\n .onboarding-wrapper {\r\n padding: 24px;\r\n border-radius: 16px;\r\n }\r\n\r\n .onboarding-progress {\r\n margin-bottom: 32px;\r\n }\r\n\r\n .progress-step-label {\r\n font-size: 0.75rem;\r\n }\r\n\r\n .progress-step-icon {\r\n width: 40px;\r\n height: 40px;\r\n }\r\n\r\n .form-row {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .onboarding-actions {\r\n flex-direction: column-reverse;\r\n }\r\n\r\n .btn-primary,\r\n .btn-secondary {\r\n width: 100%;\r\n justify-content: center;\r\n }\r\n}\r\n\r\n/* Login Styles */\r\n.login-container {\r\n min-height: 100vh;\r\n background: linear-gradient(135deg, #f6f8fa 0%, #faf7ff 100%);\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 20px;\r\n}\r\n\r\n.login-wrapper {\r\n background: #ffffff;\r\n border-radius: 24px;\r\n box-shadow: 0 20px 60px rgba(36, 37, 60, 0.12);\r\n max-width: 600px;\r\n width: 100%;\r\n padding: 48px 40px;\r\n}\r\n\r\n.login-header {\r\n text-align: center;\r\n margin-bottom: 42px;\r\n}\r\n\r\n.login-logo {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 8px;\r\n margin-bottom: 24px;\r\n width: 100%;\r\n height: 32px;\r\n}\r\n\r\n.login-logo .logo-box {\r\n width: auto;\r\n height: 32px;\r\n border-radius: 0;\r\n background: transparent;\r\n color: #fff;\r\n display: grid;\r\n place-items: center;\r\n font-weight: 700;\r\n font-size: 1.25rem;\r\n margin: 0;\r\n box-shadow: none;\r\n flex-shrink: 0;\r\n}\r\n\r\n.login-logo .logo-text {\r\n font-weight: 700;\r\n color: #4b3abf;\r\n letter-spacing: 0.02em;\r\n font-size: 1.25rem;\r\n flex-shrink: 0;\r\n}\r\n\r\n.login-header h2 {\r\n font-size: 1.875rem;\r\n font-weight: 700;\r\n color: #1f2a44;\r\n margin: 0 0 8px 0;\r\n}\r\n\r\n.login-header p {\r\n font-size: 1rem;\r\n color: #7a7f99;\r\n margin: 0;\r\n}\r\n\r\n.login-error {\r\n background: #fee;\r\n color: #c33;\r\n padding: 12px 16px;\r\n border-radius: 12px;\r\n margin-bottom: 24px;\r\n border: 1px solid #fcc;\r\n}\r\n\r\n.login-success {\r\n background: #f0fdf4;\r\n color: #166534;\r\n padding: 12px 16px;\r\n border-radius: 12px;\r\n margin-bottom: 24px;\r\n border: 1px solid #bbf7d0;\r\n font-size: 0.95rem;\r\n}\r\n\r\n.forgot-password-wrapper {\r\n display: flex;\r\n justify-content: flex-end;\r\n margin-top: 8px;\r\n}\r\n\r\n.forgot-password-link {\r\n background: none;\r\n border: none;\r\n color: #6b4bff;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n cursor: pointer;\r\n padding: 0;\r\n transition: color 0.2s;\r\n}\r\n\r\n.forgot-password-link:hover {\r\n color: #5a3fe6;\r\n text-decoration: underline;\r\n}\r\n\r\n.login-form {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 24px;\r\n}\r\n\r\n.login-form .form-group {\r\n margin-bottom: 0;\r\n}\r\n\r\n.login-submit {\r\n width: 100%;\r\n justify-content: center;\r\n margin-top: 8px;\r\n}\r\n\r\n/* Responsive Login */\r\n@media (max-width: 700px) {\r\n .login-wrapper {\r\n padding: 32px 24px;\r\n border-radius: 16px;\r\n }\r\n\r\n .login-header h2 {\r\n font-size: 1.5rem;\r\n }\r\n\r\n .login-logo {\r\n margin-bottom: 20px;\r\n gap: 8px;\r\n }\r\n\r\n .login-logo .logo-box {\r\n width: 32px;\r\n height: 32px;\r\n font-size: 1.25rem;\r\n }\r\n\r\n .login-logo .logo-text {\r\n font-size: 1.25rem;\r\n font-weight: 700;\r\n }\r\n\r\n .social-login {\r\n display: flex !important;\r\n flex-direction: column !important;\r\n gap: 12px;\r\n }\r\n\r\n .btn-social {\r\n width: 100% !important;\r\n flex: none !important;\r\n }\r\n}\r\n\r\n/* Settings Success Message */\r\n.onboarding-success {\r\n background: #efe;\r\n color: #3c3;\r\n padding: 12px 16px;\r\n border-radius: 12px;\r\n border: 1px solid #cfc;\r\n}\r\n\r\n.section-subtitle {\r\n font-size: 0.875rem;\r\n color: #7a7f99;\r\n margin: 4px 0 0 0;\r\n}\r\n\r\n/* Social Login Buttons */\r\n.social-login {\r\n display: flex;\r\n flex-direction: row;\r\n gap: 12px;\r\n margin-bottom: 24px;\r\n}\r\n\r\n.btn-social {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 12px;\r\n flex: 1;\r\n padding: 12px 16px;\r\n border-radius: 12px;\r\n font-size: 1rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n border: 1px solid #ece8ff;\r\n background: #ffffff;\r\n color: #1f2a44;\r\n}\r\n\r\n.btn-social:hover:not(:disabled) {\r\n background: #f8f6ff;\r\n border-color: #dcd2ff;\r\n transform: translateY(-1px);\r\n box-shadow: 0 2px 8px rgba(107, 75, 255, 0.1);\r\n}\r\n\r\n.btn-social:disabled {\r\n opacity: 0.6;
3\r\n cursor: not-allowed;\r\n}\r\n\r\n.btn-social svg {\r\n flex-shrink: 0;\r\n}\r\n\r\n.btn-google {\r\n color: #1f2a44;\r\n}\r\n\r\n.btn-apple {\r\n color: #1f2a44;\r\n}\r\n\r\n/* Login Divider */\r\n.login-divider {\r\n display: flex;\r\n align-items: center;\r\n text-align: center;\r\n margin: 24px 0;\r\n position: relative;\r\n}\r\n\r\n.login-divider::before,\r\n.login-divider::after {\r\n content: '';\r\n flex: 1;\r\n border-bottom: 1px solid #ece8ff;\r\n}\r\n\r\n.login-divider span {\r\n padding: 0 16px;\r\n color: #7a7f99;\r\n font-size: 0.875rem;\r\n background: #ffffff;\r\n}\r\n\r\n/* Form Group Header */\r\n.form-group-header {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n margin-bottom: 8px;\r\n}\r\n\r\n.forgot-password-wrapper {\r\n display: flex;\r\n justify-content: flex-end;\r\n margin-top: 8px;\r\n}\r\n\r\n.forgot-password-link {\r\n background: none;\r\n border: none;\r\n color: #6b4bff;\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n padding: 0;\r\n text-decoration: none;\r\n transition: color 0.2s ease;\r\n}\r\n\r\n.forgot-password-link:hover {\r\n color: #5a3fe6;\r\n text-decoration: underline;\r\n}\r\n\r\n/* Forgot Password Form */\r\n.forgot-password-form {\r\n background: #faf7ff;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n padding: 20px;\r\n margin-bottom: 20px;\r\n}\r\n\r\n.forgot-password-form p {\r\n color: #384066;\r\n font-size: 0.875rem;\r\n margin: 0 0 16px 0;\r\n}\r\n\r\n.forgot-password-actions {\r\n display: flex;\r\n gap: 12px;\r\n justify-content: flex-end;\r\n}\r\n\r\n.forgot-password-actions .btn-secondary,\r\n.forgot-password-actions .btn-primary {\r\n padding: 10px 20px;\r\n font-size: 0.875rem;\r\n}\r\n\r\n/* Login Footer */\r\n.login-footer {\r\n margin-top: 24px;\r\n text-align: center;\r\n padding-top: 24px;\r\n border-top: 1px solid #ece8ff;\r\n}\r\n\r\n.login-footer p {\r\n color: #7a7f99;\r\n font-size: 0.875rem;\r\n margin: 0;\r\n}\r\n\r\n.create-account-link {\r\n background: none;\r\n border: none;\r\n color: #6b4bff;\r\n font-size: 0.875rem;\r\n font-weight: 600;\r\n cursor: pointer;\r\n padding: 0;\r\n text-decoration: none;\r\n transition: color 0.2s ease;\r\n}\r\n\r\n.create-account-link:hover {\r\n color: #5a3fe6;\r\n text-decoration: underline;\r\n}\r\n\r\n/* Responsive Login Updates */\r\n@media (max-width: 700px) {\r\n .social-login {\r\n margin-bottom: 20px;\r\n }\r\n\r\n .btn-social {\r\n padding: 10px 14px;\r\n font-size: 0.9375rem;\r\n }\r\n\r\n .login-divider {\r\n margin: 20px 0;\r\n }\r\n\r\n .forgot-password-actions {\r\n flex-direction: column;\r\n }\r\n\r\n .forgot-password-actions .btn-secondary,\r\n .forgot-password-actions .btn-primary {\r\n width: 100%;\r\n }\r\n}\r\n\r\n/* People Detail View Sidebar - Hide Scrollbar */\r\n.people-detail-sidebar {\r\n scrollbar-width: none;\r\n /* Firefox */\r\n -ms-overflow-style: none;\r\n /* IE and Edge */\r\n}\r\n\r\n.people-detail-sidebar::-webkit-scrollbar {\r\n display: none;\r\n /* Chrome, Safari, Opera */\r\n}\r\n\r\n/* People Detail Chat History - Hide Scrollbar */\r\n.people-detail-chat-history {\r\n scrollbar-width: none;\r\n /* Firefox */\r\n -ms-overflow-style: none;\r\n /* IE and Edge */\r\n}\r\n\r\n.people-detail-chat-history::-webkit-scrollbar {\r\n display: none;\r\n /* Chrome, Safari, Opera */\r\n}\r\n\r\n/* iPhone Calendar Style */\r\n.iphone-calendar-list {\r\n list-style: none;\r\n margin: 0;\r\n padding: 0;\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.iphone-calendar-item {\r\n display: flex;\r\n gap: 16px;\r\n padding: 14px 0;\r\n border-bottom: 1px solid #f1f5f9;\r\n align-items: flex-start;\r\n transition: background-color 0.2s;\r\n}\r\n\r\n.iphone-calendar-item:last-child {\r\n border-bottom: none;\r\n}\r\n\r\n.iphone-calendar-item:hover {\r\n background-color: rgba(248, 250, 252, 0.5);\r\n}\r\n\r\n.event-time-col {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: flex-end;\r\n text-align: right;\r\n min-width: 65px;\r\n flex-shrink: 0;\r\n padding-top: 2px;\r\n}\r\n\r\n.event-start-time {\r\n font-size: 0.95rem;\r\n font-weight: 600;\r\n color: #1e293b;\r\n line-height: 1;\r\n margin-bottom: 4px;\r\n}\r\n\r\n.event-end-time {\r\n font-size: 0.75rem;\r\n color: #94a3b8;\r\n font-weight: 500;\r\n}\r\n\r\n.event-details-col {\r\n position: relative;\r\n padding-left: 14px;\r\n flex: 1;\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.event-details-col::before {\r\n content: '';\r\n position: absolute;\r\n left: 0;\r\n top: 2px;\r\n bottom: 2px;\r\n width: 4px;\r\n border-radius: 4px;\r\n background-color: #6b4bff;\r\n}\r\n\r\n.event-summary {\r\n font-size: 0.95rem;\r\n font-weight: 600;\r\n color: #0f172a;\r\n line-height: 1.4;\r\n}\r\n\r\n.event-location {\r\n font-size: 0.8125rem;\r\n color: #64748b;\r\n margin-top: 2px;\r\n line-height: 1.4;\r\n display: flex;\r\n align-items: center;\r\n gap: 4px;\r\n}\r\n\r\n.event-meta {\r\n font-size: 0.75rem;\r\n color: #94a3b8;\r\n margin-top: 4px;\r\n line-height: 1.4;\r\n display: -webkit-box;\r\n line-clamp: 2;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n}\r\n\r\n/* ============================================\r\n LEADS VIEW - SIDEBAR LAYOUT\r\n ============================================ */\r\n\r\n/* Main Container */\r\n.leads-view-container {\r\n display: flex;\r\n height: calc(100vh - 120px);\r\n gap: 0;\r\n background: #f9fafb;\r\n}\r\n\r\n/* Left Sidebar */\r\n.leads-sidebar {\r\n width: 360px;\r\n min-width: 360px;\r\n border-right: 1px solid #e5e7eb;\r\n display: flex;\r\n flex-direction: column;\r\n background: #ffffff;\r\n overflow: hidden;\r\n}\r\n\r\n/* Sidebar Header */\r\n.leads-sidebar-header {\r\n padding: 20px;\r\n border-bottom: 1px solid #e5e7eb;\r\n background: #ffffff;\r\n}\r\n\r\n.leads-title {\r\n font-size: 1.5rem;\r\n font-weight: 700;\r\n color: #1f2937;\r\n margin: 0 0 4px 0;\r\n}\r\n\r\n.leads-subtitle {\r\n font-size: 0.875rem;\r\n color: #6b7280;\r\n margin: 0 0 16px 0;\r\n}\r\n\r\n/* Stats Badges */\r\n.leads-stats {\r\n display: flex;\r\n gap: 8px;\r\n margin-bottom: 16px;\r\n flex-wrap: wrap;\r\n}\r\n\r\n.stat-badge {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 4px;\r\n padding: 6px 10px;\r\n border-radius: 8px;\r\n font-size: 0.75rem;\r\n font-weight: 600;\r\n border: 1px solid;\r\n}\r\n\r\n.stat-badge.stat-total {\r\n background: #f3f4f6;\r\n color: #374151;\r\n border-color: #d1d5db;\r\n}\r\n\r\n.stat-badge.stat-hot {\r\n background: #fef2f2;\r\n color: #b91c1c;\r\n border-color: #fecaca;\r\n}\r\n\r\n.stat-badge.stat-warm {\r\n background: #fefce8;\r\n color: #b45309;\r\n border-color: #fcd34d;\r\n}\r\n\r\n.stat-badge.stat-cold {\r\n background: #eff6ff;\r\n color: #1d4ed8;\r\n border-color: #bfdbfe;\r\n}\r\n\r\n/* Search Wrapper */\r\n.leads-search-wrapper {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n background: #f9fafb;\r\n border: 1px solid #e5e7eb;\r\n border-radius: 10px;\r\n margin-bottom: 12px;\r\n transition: all 0.2s ease;\r\n}\r\n\r\n.leads-search-wrapper:focus-within {\r\n border-color: #8b5cf6;\r\n box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);\r\n}\r\n\r\n.leads-search-wrapper .search-icon {\r\n position: absolute;\r\n left: 12px;\r\n color: #9ca3af;\r\n pointer-events: none;\r\n}\r\n\r\n.leads-search-input {\r\n width: 100%;\r\n border: none;\r\n outline: none;\r\n background: transparent;\r\n padding: 10px 40px 10px 36px;\r\n font-size: 0.875rem;\r\n color: #1f2937;\r\n}\r\n\r\n.leads-search-input::-moz-placeholder {\r\n color: #9ca3af;\r\n}\r\n\r\n.leads-search-input::placeholder {\r\n color: #9ca3af;\r\n}\r\n\r\n.filter-toggle-btn {\r\n position: absolute;\r\n right: 8px;\r\n background: transparent;\r\n border: none;\r\n cursor: pointer;\r\n padding: 6px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: #6b7280;\r\n border-radius: 6px;\r\n transition: all 0.2s ease;\r\n}\r\n\r\n.filter-toggle-btn:hover {\r\n background: #f3f4f6;\r\n color: #8b5cf6;\r\n}\r\n\r\n/* Filters Panel */\r\n.leads-filters-panel {\r\n background: #f9fafb;\r\n border: 1px solid #e5e7eb;\r\n border-radius: 8px;\r\n padding: 12px;\r\n margin-bottom: 12px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 10px;\r\n}\r\n\r\n.filter-group {\r\n display: flex;\r\n flex-direction: column;\r\n gap: 4px;\r\n}\r\n\r\n.filter-group label {\r\n font-size: 0.75rem;\r\n font-weight: 600;\r\n color: #6b7280;\r\n text-transform: uppercase;\r\n letter-spacing: 0.05em;\r\n}\r\n\r\n.filter-group select {\r\n padding: 8px 10px;\r\n border: 1px solid #d1d5db;\r\n border-radius: 6px;\r\n font-size: 0.875rem;\r\n background: #ffffff;\r\n color: #1f2937;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n}\r\n\r\n.filter-group select:hover {\r\n border-color: #8b5cf6;\r\n}\r\n\r\n.filter-group select:focus {\r\n outline: none;\r\n border-color: #8b5cf6;\r\n box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.1);\r\n}\r\n\r\n.clear-filters-btn {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 6px;\r\n padding: 8px 12px;\r\n background: #ffffff;\r\n color: #6b7280;\r\n border: 1px solid #d1d5db;\r\n border-radius: 6px;\r\n cursor: pointer;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n transition: all 0.2s ease;\r\n}\r\n\r\n.clear-filters-btn:hover {\r\n background: #f3f4f6;\r\n color: #ef4444;\r\n border-color: #ef4444;\r\n}\r\n\r\n/* Actions */\r\n.leads-actions {\r\n display: flex;\r\n gap: 8px;\r\n}\r\n\r\n.download-btn {\r\n display: flex;\r\n align-items: center;\r\n gap: 6px;\r\n padding: 8px 12px;\r\n background: #8b5cf6;\r\n color: #ffffff;\r\n border: none;\r\n border-radius: 8px;\r\n cursor: pointer;\r\n font-size: 0.875rem;\r\n font-weight: 500;\r\n transition: all 0.2s ease;\r\n flex: 1;\r\n justify-content: center;\r\n}\r\n\r\n.download-btn:hover {\r\n background: #7c3aed;\r\n transform: translateY(-1px);\r\n box-shadow: 0 4px 12px rgba(139, 92, 246, 0.3);\r\n}\r\n\r\n/* Leads List */\r\n.leads-list {\r\n flex: 1;\r\n overflow-y: auto;\r\n padding: 12px;\r\n}\r\n\r\n.leads-list::-webkit-scrollbar {\r\n width: 6px;\r\n}\r\n\r\n.leads-list::-webkit-scrollbar-track {\r\n background: #f9fafb;\r\n}\r\n\r\n.leads-list::-webkit-scrollbar-thumb {\r\n background: #d1d5db;\r\n border-radius: 3px;\r\n}\r\n\r\n.leads-list::-webkit-scrollbar-thumb:hover {\r\n background: #9ca3af;\r\n}\r\n\r\n.leads-loading,\r\n.leads-empty {\r\n text-align: center;\r\n padding: 40px 20px;\r\n color: #6b7280;\r\n font-size: 0.875rem;\r\n}\r\n\r\n/* Lead Card */\r\n.lead-card {\r\n background: #ffffff;\r\n border: 2px solid #e5e7eb;\r\n border-radius: 12px;\r\n padding: 14px;\r\n margin-bottom: 10px;\r\n cursor: pointer;\r\n transition: all 0.2s ease;\r\n}\r\n\r\n.lead-card:hover {\r\n border-color: #8b5cf6;\r\n box-shadow: 0 4px 12px rgba(139, 92, 246, 0.15);\r\n transform: translateY(-2px);\r\n}\r\n\r\n.lead-card.selected {\r\n border-color: #8b5cf6;\r\n background: #f5f3ff;\r\n box-shadow: 0 4px 12px rgba(139, 92, 246, 0.2);\r\n}\r\n\r\n/* Lead Card Header */\r\n.lead-card-header {\r\n display: flex;\r\n align-items: flex-start;\r\n gap: 12px;\r\n margin-bottom: 12px;\r\n}\r\n\r\n.lead-avatar {\r\n width: 44px;\r\n height: 44px;\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 0.875rem;\r\n font-weight: 700;\r\n color: #ffffff;\r\n flex-shrink: 0;\r\n}\r\n\r\n.lead-info {\r\n flex: 1;\r\n min-width: 0;\r\n}\r\n\r\n.lead-name {\r\n font-size: 0.9375rem;\r\n font-weight: 600;\r\n color: #1f2937;\r\n margin: 0 0 6px 0;\r\n overflow: hidden;\r\n text-overflow: ellipsis;\r\n white-space: nowrap;\r\n}\r\n\r\n.lead-badges {\r\n display: flex;\r\n gap: 6px;\r\n flex-wrap: wrap;\r\n}\r\n\r\n.badge-status {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 4px;\r\n padding: 3px 8px;\r\n border-radius: 6px;\r\n font-size: 0.6875rem;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n letter-spacing: 0.03em;\r\n}\r\n\r\n.badge-status img {\r\n width: 12px;\r\n height: 12px;\r\n}\r\n\r\n.badge-status.badge-hot {\r\n background: #fef2f2;\r\n color: #b91c1c;\r\n border: 1px solid #fecaca;\r\n}\r\n\r\n.badge-status.badge-neutral {\r\n background: #fefce8;\r\n color: #b45309;\r\n border: 1px solid #fcd34d;\r\n}\r\n\r\n.badge-status.badge-cold {\r\n background: #eff6ff;\r\n color: #1d4ed8;\r\n border: 1px solid #bfdbfe;\r\n}\r\n\r\n/* Score Progress Bar */\r\n.lead-score-bar {\r\n height: 8px;\r\n background: #e5e7eb;\r\n border-radius: 4px;\r\n overflow: hidden;\r\n margin-bottom: 10px;\r\n position: relative;\r\n}\r\n\r\n.score-progress {\r\n height: 100%;\r\n border-radius: 4px;\r\n transition: width 0.3s ease;\r\n display: flex;\r\n align-items: center;\r\n justify-content: flex-end;\r\n padding-right: 4px;\r\n position: relative;\r\n}\r\n\r\n.score-progress.score-hot {\r\n background: linear-gradient(90deg, #ef4444 0%, #dc2626 100%);\r\n}\r\n\r\n.score-progress.score-neutral {\r\n background: linear-gradient(90deg, #f59e0b 0%, #d97706 100%);\r\n}\r\n\r\n.score-progress.score-cold {\r\n background: linear-gradient(90deg, #3b82f6 0%, #2563eb 100%);\r\n}\r\n\r\n.score-value {\r\n font-size: 0.625rem;\r\n font-weight: 700;\r\n color: #ffffff;\r\n text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);\r\n}\r\n\r\n/* Lead Card Footer */\r\n.lead-card-footer {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n font-size: 0.8125rem;\r\n}\r\n\r\n.lead-price {\r\n font-weight: 600;\r\n color: #10b981;\r\n}\r\n\r\n.lead-date {\r\n color: #6b7280;\r\n font-size: 0.75rem;\r\n display: flex;\r\n align-items: center;\r\n gap: 4px;\r\n}\r\n\r\n.lead-source {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 4px;\r\n padding: 2px 6px;\r\n background: #f3f4f6;\r\n border-radius: 4px;\r\n font-size: 0.6875rem;\r\n font-weight: 500;\r\n color: #6b7280;\r\n}\r\n\r\n/* Right Panel - Lead Details */\r\n.lead-detail-panel {\r\n flex: 1;\r\n background: #f9fafb;\r\n overflow-y: auto;\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.lead-detail-empty,\r\n.detail-placeholder {\r\n flex: 1;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n padding: 40px;\r\n text-align: center;\r\n}\r\n\r\n.lead-detail-empty svg,\r\n.detail-placeholder svg {\r\n color: #d1d5db;\r\n margin-bottom: 16px;\r\n}\r\n\r\n.lead-detail-empty h3,\r\n.detail-placeholder h3 {\r\n font-size: 1.25rem;\r\n font-weight: 600;\r\n color: #374151;\r\n margin: 0 0 8px 0;\r\n}\r\n\r\n.lead-detail-empty p,\r\n.detail-placeholder p {\r\n font-size: 0.9375rem;\r\n color: #6b7280;\r\n max-width: 400px;\r\n margin: 0;\r\n line-height: 1.6;\r\n}\r\n\r\n.lead-detail-content {\r\n flex: 1;\r\n padding: 20px;\r\n}\r\n\r\n/* Responsive Design */\r\n@media (max-width: 1024px) {\r\n .leads-sidebar {\r\n width: 300px;\r\n min-width: 300px;\r\n }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n .leads-view-container {\r\n flex-direction: column;\r\n }\r\n\r\n .leads-sidebar {\r\n width: 100%;\r\n min-width: 100%;\r\n height: 50vh;
3\r\n border-right: none;\r\n border-bottom: 1px solid #e5e7eb;\r\n }\r\n\r\n .lead-detail-panel {\r\n height: 50vh;\r\n }\r\n}\r\n\r\n.sidebar.collapsed {\r\n width: 64px;\r\n min-width: 64px;\r\n padding-left: 10px;\r\n padding-right: 10px;\r\n}\r\n/* Input with Icon Styles - Added for consistent positioning */\r\n.input-with-icon {\r\n position: relative;\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.input-with-icon .input-icon {\r\n position: absolute;\r\n left: 14px;\r\n top: 50%;\r\n transform: translateY(-50%);\r\n color: #9ca3af;\r\n pointer-events: none;\r\n z-index: 10;\r\n}\r\n\r\n.input-with-icon input {\r\n padding-left: 44px !important;\r\n width: 100%;\r\n padding-top: 12px;\r\n padding-bottom: 12px;\r\n padding-right: 16px;\r\n border: 1px solid #ece8ff;\r\n border-radius: 12px;\r\n font-size: 0.9375rem;\r\n color: #1f2a44;\r\n background: #ffffff;\r\n transition: all 0.2s ease;\r\n font-family: inherit;\r\n}\r\n\r\n.input-with-icon input:focus {\r\n outline: none;\r\n border-color: #a855f7;\r\n box-shadow: 0 0 0 4px rgba(168, 85, 247, 0.1);\r\n}\r\n\r\n.placeholder\\:text-gray-400::-moz-placeholder {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / var(--tw-text-opacity, 1));\n}\r\n\r\n.placeholder\\:text-gray-400::placeholder {\n --tw-text-opacity: 1;\n color: rgb(156 163 175 / var(--tw-text-opacity, 1));\n}\r\n\r\n.placeholder\\:text-slate-300::-moz-placeholder {\n --tw-text-opacity: 1;\n color: rgb(203 213 225 / var(--tw-text-opacity, 1));\n}\r\n\r\n.placeholder\\:text-slate-300::placeholder {\n --tw-text-opacity: 1;\n color: rgb(203 213 225 / var(--tw-text-opacity, 1));\n}\r\n\r\n.placeholder\\:text-slate-400::-moz-placeholder {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\r\n\r\n.placeholder\\:text-slate-400::placeholder {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\r\n\r\n.last\\:border-0:last-child {\n border-width: 0px;\n}\r\n\r\n.last\\:border-r-0:last-child {\n border-right-width: 0px;\n}\r\n\r\n.focus-within\\:border-purple-300:focus-within {\n --tw-border-opacity: 1;\n border-color: rgb(216 180 254 / var(--tw-border-opacity, 1));\n}\r\n\r\n.focus-within\\:border-purple-500:focus-within {\n --tw-border-opacity: 1;\n border-color: rgb(168 85 247 / var(--tw-border-opacity, 1));\n}\r\n\r\n.focus-within\\:ring-2:focus-within {\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-sha
3dow, 0 0 #0000);\n}\r\n\r\n.focus-within\\:ring-purple-500\\/10:focus-within {\n --tw-ring-color: rgb(168 85 247 / 0.1);\n}\r\n\r\n.hover\\:z-\\[100\\]:hover {\n z-index: 100;\n}\r\n\r\n.hover\\:-translate-y-0\\.5:hover {\n --tw-translate-y: -0.125rem;\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}\r\n\r\n.hover\\:-translate-y-1:hover {\n --tw-translate-y: -0.25rem;\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}\r\n\r\n.hover\\:-translate-y-2:hover {\n --tw-translate-y: -0.5rem;\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}\r\n\r\n.hover\\:translate-y-\\[-1px\\]:hover {\n --tw-translate-y: -1px;\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}\r\n\r\n.hover\\:scale-110:hover {\n --tw-scale-x: 1.1;\n --tw-scale-y: 1.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}\r\n\r\n.hover\\:border-indigo-300:hover {\n --tw-border-opacity: 1;\n border-color: rgb(165 180 252 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-indigo-400:hover {\n --tw-border-opacity: 1;\n border-color: rgb(129 140 248 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-purple-100:hover {\n --tw-border-opacity: 1;\n border-color: rgb(243 232 255 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-purple-100\\/50:hover {\n border-color: rgb(243 232 255 / 0.5);\n}\r\n\r\n.hover\\:border-purple-200:hover {\n --tw-border-opacity: 1;\n border-color: rgb(233 213 255 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-purple-300:hover {\n --tw-border-opacity: 1;\n border-color: rgb(216 180 254 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-purple-400:hover {\n --tw-border-opacity: 1;\n border-color: rgb(192 132 252 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-purple-500:hover {\n --tw-border-opacity: 1;\n border-color: rgb(168 85 247 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-red-500:hover {\n --tw-border-opacity: 1;\n border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:border-slate-300:hover {\n --tw-border-opacity: 1;\n border-color: rgb(203 213 225 / var(--tw-border-opacity, 1));\n}\r\n\r\n.hover\\:\\!bg-red-50:hover {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1)) !important;\n}\r\n\r\n.hover\\:bg-amber-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(180 83 9 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-emerald-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(4 120 87 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-gray-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-gray-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-gray-50:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-green-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(21 128 61 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-indigo-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(224 231 255 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-indigo-50:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(238 242 255 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-indigo-50\\/20:hover {\n background-color: rgb(238 242 255 / 0.2);\n}\r\n\r\n.hover\\:bg-indigo-50\\/30:hover {\n background-color: rgb(238 242 255 / 0.3);\n}\r\n\r\n.hover\\:bg-indigo-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(67 56 202 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-purple-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(243 232 255 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-purple-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(126 34 206 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-red-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(254 226 226 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-red-50:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-red-700:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(185 28 28 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-slate-100:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(241 245 249 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-slate-200:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(226 232 240 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-slate-50:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 252 / var(--tw-bg-opacity, 1));\n}
3\r\n\r\n.hover\\:bg-slate-50\\/80:hover {\n background-color: rgb(248 250 252 / 0.8);\n}\r\n\r\n.hover\\:bg-white:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.hover\\:bg-white\\/50:hover {\n background-color: rgb(255 255 255 / 0.5);\n}\r\n\r\n.hover\\:bg-white\\/80:hover {\n background-color: rgb(255 255 255 / 0.8);\n}\r\n\r\n.hover\\:bg-opacity-80:hover {\n --tw-bg-opacity: 0.8;\n}\r\n\r\n.hover\\:text-emerald-900:hover {\n --tw-text-opacity: 1;\n color: rgb(6 78 59 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-gray-600:hover {\n --tw-text-opacity: 1;\n color: rgb(75 85 99 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-indigo-600:hover {\n --tw-text-opacity: 1;\n color: rgb(79 70 229 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-indigo-700:hover {\n --tw-text-opacity: 1;\n color: rgb(67 56 202 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-purple-600:hover {\n --tw-text-opacity: 1;\n color: rgb(147 51 234 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-purple-700:hover {\n --tw-text-opacity: 1;\n color: rgb(126 34 206 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-red-500:hover {\n --tw-text-opacity: 1;\n color: rgb(239 68 68 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-red-600:hover {\n --tw-text-opacity: 1;\n color: rgb(220 38 38 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-slate-600:hover {\n --tw-text-opacity: 1;\n color: rgb(71 85 105 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-slate-700:hover {\n --tw-text-opacity: 1;\n color: rgb(51 65 85 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-slate-900:hover {\n --tw-text-opacity: 1;\n color: rgb(15 23 42 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:text-white:hover {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\r\n\r\n.hover\\:underline:hover {\n text-decoration-line: underline;\n}\r\n\r\n.hover\\:opacity-100:hover {\n opacity: 1;\n}\r\n\r\n.hover\\:shadow-2xl:hover {\n --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
3\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}\r\n\r\n.hover\\:shadow-\\[0_4px_12px_rgba\\(0\\2c 0\\2c 0\\2c 0\\.15\\)\\]:hover {\n --tw-shadow: 0 4px 12px rgba(0,0,0,0.15);\n --tw-shadow-colored: 0 4px 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}\r\n\r\n.hover\\:shadow-md:hover {\n --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px 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}\r\n\r\n.hover\\:shadow-sm:hover {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-sha
3dow);\n}\r\n\r\n.hover\\:shadow-xl:hover {\n --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px 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}\r\n\r\n.hover\\:shadow-amber-500\\/20:hover {\n --tw-shadow-color: rgb(245 158 11 / 0.2);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:shadow-emerald-500\\/20:hover {\n --tw-shadow-color: rgb(16 185 129 / 0.2);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:shadow-indigo-500\\/20:hover {\n --tw-shadow-color: rgb(99 102 241 / 0.2);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:shadow-purple-500\\/10:hover {\n --tw-shadow-color: rgb(168 85 247 / 0.1);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:shadow-purple-500\\/20:hover {\n --tw-shadow-color: rgb(168 85 247 / 0.2);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:shadow-purple-500\\/5:hover {\n --tw-shadow-color: rgb(168 85 247 / 0.05);
3\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:shadow-red-500\\/20:hover {\n --tw-shadow-color: rgb(239 68 68 / 0.2);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:shadow-slate-500\\/10:hover {\n --tw-shadow-color: rgb(100 116 139 / 0.1);\n --tw-shadow: var(--tw-shadow-colored);\n}\r\n\r\n.hover\\:brightness-95:hover {\n --tw-brightness: brightness(.95);\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}\r\n\r\n.focus\\:border-purple-500:focus {\n --tw-border-opacity: 1;\n border-color: rgb(168 85 247 / var(--tw-border-opacity, 1));\n}\r\n\r\n.focus\\:border-purple-600\\/50:focus {\n border-color: rgb(147 51 234 / 0.5);\n}\r\n\r\n.focus\\:border-red-500:focus {\n --tw-border-opacity: 1;\n border-color: rgb(239 68 68 / var(--tw-border-opacity, 1));\n}\r\n\r\n.focus\\:border-transparent:focus {\n border-color: transparent;\n}\r\n\r\n.focus\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n}\r\n\r\n.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-sha
3dow, 0 0 #0000);\n}\r\n\r\n.focus\\:ring-4: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(4px + 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}\r\n\r\n.focus\\:ring-indigo-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity, 1));\n}\r\n\r\n.focus\\:ring-purple-200:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(233 213 255 / var(--tw-ring-opacity, 1));\n}\r\n\r\n.focus\\:ring-purple-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(168 85 247 / var(--tw-ring-opacity, 1));\n}\r\n\r\n.focus\\:ring-purple-500\\/10:focus {\n --tw-ring-color: rgb(168 85 247 / 0.1);\n}\r\n\r\n.focus\\:ring-purple-500\\/20:focus {\n --tw-ring-color: rgb(168 85 247 / 0.2);\n}\r\n\r\n.focus\\:ring-purple-500\\/5:focus {\n --tw-ring-color: rgb(168 85 247 / 0.05);\n}\r\n\r\n.focus\\:ring-red-500:focus {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(239 68 68 / var(--tw-ring-opacity, 1));\n}\r\n\r\n.focus\\:ring-red-500\\/5:focus {\n --tw-ring-color: rgb(239 68 68 / 0.05);\n}\r\n\r\n.active\\:translate-y-0:active {\n --tw-translate-y: 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}\r\n\r\n.active\\:scale-95:active {\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}\r\n\r\n.active\\:scale-\\[0\\.98\\]:active {\n --tw-scale-x: 0.98;\n --tw-scale-y: 0.98;\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}\r\n\r\n.disabled\\:cursor-not-allowed:disabled {\n cursor: not-allowed;\n}\r\n\r\n.disabled\\:bg-slate-300:disabled {\n --tw-bg-opacity: 1;\n background-color: rgb(203 213 225 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.disabled\\:opacity-50:disabled {\n opacity: 0.5;\n}\r\n\r\n.disabled\\:opacity-60:disabled {\n opacity: 0.6;\n}\r\n\r\n.disabled\\:opacity-70:disabled {\n opacity: 0.7;\n}\r\n\r\n.disabled\\:active\\:scale-100:active:disabled {\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}\r\n\r\n.group:focus-within .group-focus-within\\:text-purple-500 {\n --tw-text-opacity: 1;\n color: rgb(168 85 247 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group:focus-within .group-focus-within\\:text-purple-600 {\n --tw-text-opacity: 1;\n color: rgb(147 51 234 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group:hover .group-hover\\:scale-105 {\n --tw-scale-x: 1.05;\n --tw-scale-y: 1.05;\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}\r\n\r\n.group:hover .group-hover\\:bg-purple-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.group:hover .group-hover\\:bg-sky-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(2 132 199 / var(--tw-bg-opacity, 1));\n}\r\n\r\n.group\\/item:hover .group-hover\\/item\\:text-purple-500 {\n --tw-text-opacity: 1;\n color: rgb(168 85 247 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group\\/item:hover .group-hover\\/item\\:text-purple-600 {\n --tw-text-opacity: 1;\n color: rgb(147 51 234 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group:hover .group-hover\\:text-emerald-500 {\n --tw-text-opacity: 1;\n color: rgb(16 185 129 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group:hover .group-hover\\:text-indigo-600 {\n --tw-text-opacity: 1;\n color: rgb(79 70 229 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group:hover .group-hover\\:text-purple-700 {\n --tw-text-opacity: 1;\n color: rgb(126 34 206 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group:hover .group-hover\\:text-slate-400 {\n --tw-text-opacity: 1;\n color: rgb(148 163 184 / var(--tw-text-opacity, 1));\n}\r\n\r\n.group:hover .group-hover\\:text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\r\n\r\n@media (min-width: 640px) {\n\n .sm\\:bottom-6 {\n bottom: 1.5rem;\n }\n\n .sm\\:right-6 {\n right: 1.5rem;\n }\n\n .sm\\:inline {\n display: inline;\n }\n\n .sm\\:hidden {\n display: none;\n }\n\n .sm\\:h-10 {\n height: 2.5rem;\n }\n\n .sm\\:h-5 {\n height: 1.25rem;\n }\n\n .sm\\:h-\\[18px\\] {\n height: 18px;\n }\n\n .sm\\:h-\\[600px\\] {\n height: 600px;\n }\n\n .sm\\:h-auto {\n height: auto;\n }\n\n .sm\\:max-h-\\[90vh\\] {\n max-height: 90vh;\n }\n\n .sm\\:w-10 {\n width: 2.5rem;\n }\n\n .sm\\:w-5 {\n width: 1.25rem;\n }\n\n .sm\\:w-96 {\n width: 24rem;\n }\n\n .sm\\:w-\\[18px\\] {\n width: 18px;\n }\n\n .sm\\:max-w-2xl {\n max-width: 42rem;\n }\n\n .sm\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .sm\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .sm\\:flex-row {\n flex-direction: row;\n }
3\n\n .sm\\:items-center {\n align-items: center;\n }\n\n .sm\\:justify-end {\n justify-content: flex-end;\n }\n\n .sm\\:gap-3 {\n gap: 0.75rem;\n }\n\n .sm\\:gap-4 {\n gap: 1rem;\n }\n\n .sm\\:space-y-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));\n }\n\n .sm\\:rounded-2xl {\n border-radius: 1rem;\n }\n\n .sm\\:p-4 {\n padding: 1rem;\n }\n\n .sm\\:px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n }\n\n .sm\\:px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n\n .sm\\:px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n }\n\n .sm\\:py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n }\n\n .sm\\:py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n }\n\n .sm\\:py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n }\n\n .sm\\:pl-0 {\n padding-left: 0px;\n }\n\n .sm\\:text-\\[10px\\] {\n font-size: 10px;\n }\n\n .sm\\:text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .sm\\:text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .sm\\:text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n}\r\n\r\n@media (min-width: 768px) {\n\n .md\\:bottom-2 {\n bottom: 0.5rem;\n }\n\n .md\\:left-3 {\n left: 0.75rem;\n }\n\n .md\\:right-2 {\n right: 0.5rem;\n }\n\n .md\\:col-span-2 {\n grid-column: span 2 / span 2;\n }\n\n .md\\:-mx-6 {\n margin-left: -1.5rem;\n margin-right: -1.5rem;\n }\n\n .md\\:mb-3 {\n margin-bottom: 0.75rem;\n }\n\n .md\\:mb-4 {\n margin-bottom: 1rem;\n }\n\n .md\\:mt-4 {\n margin-top: 1rem;\n }\n\n .md\\:block {\n display: block;\n }\n\n .md\\:hidden {\n display: none;\n }\n\n .md\\:h-10 {\n height: 2.5rem;\n }\n\n .md\\:h-11 {\n height: 2.75rem;\n }\n\n .md\\:h-16 {\n height: 4rem;\n }\n\n .md\\:h-20 {\n height: 5rem;\n }\n\n .md\\:h-3\\.5 {\n height: 0.875rem;\n }\n\n .md\\:h-4 {\n height: 1rem;\n }\n\n .md\\:h-5 {\n height: 1.25rem;\n }\n\n .md\\:h-6 {\n height: 1.5rem;\n }\n\n .md\\:h-8 {\n height: 2rem;\n }\n\n .md\\:h-9 {\n height: 2.25rem;\n }\n\n .md\\:w-1\\.5 {\n width: 0.375rem;\n }\n\n .md\\:w-10 {\n width: 2.5rem;\n }\n\n .md\\:w-11 {\n width: 2.75rem;\n }\n\n .md\\:w-16 {\n width: 4rem;\n }\n\n .md\\:w-3\\.5 {\n width: 0.875rem;\n }\n\n .md\\:w-4 {\n width: 1rem;\n }\n\n .md\\:w-5 {\n width: 1.25rem;\n }\n\n .md\\:w-64 {\n width: 16rem;\n }\n\n .md\\:w-8 {\n width: 2rem;\n }\n\n .md\\:w-auto {\n width: auto;\n }\n\n .md\\:min-w-\\[70px\\] {\n min-width: 70px;\n }\n\n .md\\:flex-none {\n flex: none;\n }\n\n .md\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .md\\:grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n\n .md\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .md\\:flex-row {\n flex-direction: row;\n }\n\n .md\\:items-end {\n align-items: flex-end;\n }
3\n\n .md\\:items-center {\n align-items: center;\n }\n\n .md\\:gap-1\\.5 {\n gap: 0.375rem;\n }\n\n .md\\:gap-2 {\n gap: 0.5rem;\n }\n\n .md\\:gap-3 {\n gap: 0.75rem;\n }\n\n .md\\:gap-4 {\n gap: 1rem;\n }\n\n .md\\:gap-6 {\n gap: 1.5rem;\n }\n\n .md\\:space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n }\n\n .md\\:space-y-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));\n }\n\n .md\\:space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n }\n\n .md\\:space-y-6 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));\n }\n\n .md\\:rounded-2xl {\n border-radius: 1rem;\n }\n\n .md\\:rounded-xl {\n border-radius: 0.75rem;\n }\n\n .md\\:p-1\\.5 {\n padding: 0.375rem;\n }\n\n .md\\:p-2 {\n padding: 0.5rem;\n }\n\n .md\\:p-3 {\n padding: 0.75rem;\n }\n\n .md\\:p-4 {\n padding: 1rem;\n }\n\n .md\\:p-5 {\n padding: 1.25rem;\n }\n\n .md\\:p-6 {\n padding: 1.5rem;\n }\n\n .md\\:px-2\\.5 {\n padding-left: 0.625rem;\n padding-right: 0.625rem;\n }\n\n .md\\:px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n }\n\n .md\\:px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n }\n\n .md\\:py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n }\n\n .md\\:py-1\\.5 {\n padding-top: 0.375rem;\n padding-bottom: 0.375rem;\n }\n\n .md\\:py-12 {\n padding-top: 3rem;\n padding-bottom: 3rem;\n }\n\n .md\\:py-2\\.5 {\n padding-top: 0.625rem;\n padding-bottom: 0.625rem;\n }\n\n .md\\:py-20 {\n padding-top: 5rem;\n padding-bottom: 5rem;\n }\n\n .md\\:py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n }\n\n .md\\:pl-10 {\n padding-left: 2.5rem;\n }\n\n .md\\:pr-10 {\n padding-right: 2.5rem;\n }\n\n .md\\:pr-6 {\n padding-right: 1.5rem;\n }\n\n .md\\:pt-1 {\n padding-top: 0.25rem;\n }\n\n .md\\:text-3xl {\n font-size: 1.875rem;\n line-height: 2.25rem;\n }\n\n .md\\:text-5xl {\n font-size: 3rem;\n line-height: 1;\n }\n\n .md\\:text-\\[10px\\] {\n font-size: 10px;\n }\n\n .md\\:text-\\[11px\\] {\n font-size: 11px;\n }\n\n .md\\:text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .md\\:text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .md\\:text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n }\n\n .md\\:text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n}\r\n\r\n@media (min-width: 1024px) {\n\n .lg\\:static {\n position: static;\n }\n\n .lg\\:col-span-2 {\n grid-column: span 2 / span 2;\n }\n\n .lg\\:col-span-4 {\n grid-column: span 4 / span 4;\n }\n\n .lg\\:col-span-8 {\n grid-column: span 8 / span 8;\n }\n\n .lg\\:flex {\n display: flex;\n }\n\n .lg\\:hidden {\n display: none;\n }\n\n .lg\\:h-full {\n height: 100%;\n }\n\n .lg\\:h-screen {\n height: 100vh;\n }\n\n .lg\\:w-72 {\n width: 18rem;\n }\n\n .lg\\:w-80 {\n width: 20rem;\n }\n\n .lg\\:w-auto {\n width: auto;\n }\n\n .lg\\:min-w-\\[288px\\] {\n min-width: 288px;\n }\n\n .lg\\:min-w-\\[320px\\] {\n min-width: 320px;\n }\n\n .lg\\:shrink-0 {\n flex-shrink: 0;\n }\n\n .lg\\:grid-cols-12 {\n grid-template-columns: repeat(12, minmax(0, 1fr));\n }\n\n .lg\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .lg\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .lg\\:flex-row {\n flex-direction: row;\n }
3\n\n .lg\\:items-center {\n align-items: center;\n }\n\n .lg\\:gap-6 {\n gap: 1.5rem;\n }\n\n .lg\\:gap-8 {\n gap: 2rem;\n }\n\n .lg\\:space-y-8 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(2rem * var(--tw-space-y-reverse));\n }\n\n .lg\\:overflow-hidden {\n overflow: hidden;\n }\n\n .lg\\:overflow-y-auto {\n overflow-y: auto;\n }\n\n .lg\\:border-b-0 {\n border-bottom-width: 0px;\n }\n\n .lg\\:border-r {\n border-right-width: 1px;\n }\n\n .lg\\:p-10 {\n padding: 2.5rem;\n }\n\n .lg\\:p-6 {\n padding: 1.5rem;\n }\n\n .lg\\:p-\\[22px\\] {\n padding: 22px;\n }\n}\r\n\r\n@media (min-width: 1280px) {\n\n .xl\\:col-span-1 {\n grid-column: span 1 / span 1;\n }\n\n .xl\\:col-span-2 {\n grid-column: span 2 / span 2;\n }\n\n .xl\\:w-80 {\n width: 20rem;\n }\n\n .xl\\:w-\\[360px\\] {\n width: 360px;\n }\n\n .xl\\:min-w-\\[360px\\] {\n min-width: 360px;\n }\n\n .xl\\:max-w-\\[1680px\\] {\n max-width: 1680px;\n }\n\n .xl\\:grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n\n .xl\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .xl\\:flex-row {\n flex-direction: row;\n }\n}\r\n\r\n@media (min-width: 1536px) {\n\n .\\32xl\\:max-w-\\[1920px\\] {\n max-width: 1920px;\n }\n}\r\n" 4__vite__updateStyle(__vite__id, __vite__css) 5import.meta.hot.accept() 6import.meta.hot.prune(() => __vite__removeStyle(__vite__id))
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.