

*,
::before,
::after { box-sizing:border-box; border-width:0; border-style:solid; border-color:currentColor; }
::before,
::after { --tw-content:''; }

html { line-height:1.5; -webkit-text-size-adjust:100%; -moz-tab-size:4; -o-tab-size:4; tab-size:4; font-family:ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */ }
body { margin:0; line-height:inherit; }

hr { height:0; color:inherit; border-top-width:1px; }

aside { background-color: rgb(32 34 34 / var(--tw-bg-opacity)); }
main { background: #fff; color: #212322; }
main h3,
main h4 { color: #212322; }
main label { color: #212322; }


abbr:where([title]) { -webkit-text-decoration:underline dotted; text-decoration:underline dotted; }

h1, h2, h3, h4, h5, h6 { font-size:inherit; font-weight:inherit; }

a { color:inherit; text-decoration:inherit; }
b, strong { font-weight:bolder; }

code, kbd, samp, pre { font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; font-size:1em; }

small { font-size:80%; }
sub,
sup { font-size:75%; line-height:0; position:relative; vertical-align:baseline; }
sub { bottom:-0.25em; }
sup { top:-0.5em; }

table { text-indent:0; border-color:inherit; border-collapse:collapse; }

button, input, optgroup, select, textarea { font-family:inherit; font-size:100%; font-weight:inherit; line-height:inherit; color:inherit; margin:0; padding:0; }
button, select { text-transform:none; }
button, [type='button'], [type='reset'], [type='submit'] { -webkit-appearance:button; background-color:transparent; background-image:none; }

:-moz-focusring { outline:auto; }
:-moz-ui-invalid { box-shadow:none; }

progress { vertical-align:baseline; }

::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height:auto; }
[type='search'] { -webkit-appearance:textfield; outline-offset:-2px; }
::-webkit-search-decoration { -webkit-appearance:none; }
::-webkit-file-upload-button { -webkit-appearance:button; font:inherit; }

summary { display:list-item; }
blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin:0; }
fieldset { margin:0; padding:0; }
legend { padding:0; }
ol, ul, menu { list-style:none; margin:0; padding:0; }
textarea { resize:vertical; }

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { opacity:1; color:#9ca3af; }
input::-moz-placeholder, textarea::-moz-placeholder { opacity:1; color:#9ca3af; }
input:-ms-input-placeholder, textarea:-ms-input-placeholder { opacity:1; color:#9ca3af; }
input::-ms-input-placeholder, textarea::-ms-input-placeholder { opacity:1; color:#9ca3af; }
input::placeholder, textarea::placeholder { opacity:1; color:#9ca3af; }

button, [role="button"] { cursor:pointer; }
:disabled { cursor:default; }

img, svg, video, canvas, audio, iframe, embed, object { display:block; vertical-align:middle; }
img, video { max-width:100%; height:auto; }

[hidden] { display:none; }

::-moz-selection { background-color:rgb(32 34 34 / var(--tw-bg-opacity)); --tw-bg-opacity:0.4; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
::selection { background-color:rgb(1 197 186 / var(--tw-bg-opacity)); --tw-bg-opacity:0.4; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }

::-webkit-scrollbar { height:0.5rem; width:0.5rem; }
::-webkit-scrollbar-track { border-left-width:3px; border-right-width:3px; border-top-width:0px; border-bottom-width:0px; border-style:solid; --tw-border-opacity:1; border-color:rgb(32 34 34 / var(--tw-border-opacity)); background-color:rgb(1 197 186 / var(--tw-bg-opacity)); --tw-bg-opacity:0.4; }
::-webkit-scrollbar-track:horizontal { border-top-width:3px; border-bottom-width:3px; border-left-width:0px; border-right-width:0px; }
::-webkit-scrollbar-thumb { border-left-width:2px; border-right-width:2px; border-top-width:0px; border-bottom-width:0px; border-style:solid; --tw-border-opacity:1; border-color:rgb(32 34 34 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(1 197 186 / var(--tw-bg-opacity)); }
::-webkit-scrollbar-thumb:horizontal { border-top-width:2px; border-bottom-width:2px; border-left-width:0px; border-right-width:0px; }
::-webkit-scrollbar-thumb:hover { --tw-bg-opacity:1; background-color:rgb(28 170 162 / var(--tw-bg-opacity)); }


body { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); font-family:Epilogue, sans-serif; font-size:1rem; font-weight:400; line-height:1.6; --tw-text-opacity:1; color:rgb(230 230 235 / var(--tw-text-opacity)); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }


h1 { font-family:Syncopate, sans-serif; font-size:2.5rem; font-weight:700; line-height:1.2; letter-spacing:-.04em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
h2 { font-family:Syncopate, sans-serif; font-size:2.25rem; font-weight:700; line-height:1.2; letter-spacing:-.04em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
h3 { font-family:Syncopate, sans-serif; font-size:1.75rem; font-weight:700; line-height:1.2; letter-spacing:-.04em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
h4 { font-family:Syncopate, sans-serif; font-size:1.25rem; font-weight:700; line-height:1.2; letter-spacing:-.04em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
h5 { font-family:Syncopate, sans-serif; font-size:1.125rem; font-weight:700; line-height:1.2; letter-spacing:-.04em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
h6 { font-family:Syncopate, sans-serif; font-size:1rem; font-weight:700; line-height:1.2; letter-spacing:-.04em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
@media (min-width:992px) {
	h1 { font-size:5rem; }
	h2 { font-size:2.5rem; }
	h3 { font-size:2.25rem; }
	h4 { font-size:1.75rem; }
	h5 { font-size:1.25rem; }
	h6 { font-size:1.125rem; }
}

a { cursor:pointer; -webkit-appearance:none; -moz-appearance:none; appearance:none; color:currentColor; -webkit-text-decoration-line:none; text-decoration-line:none; }
a.link { color:currentColor; }
a.link:hover { --tw-text-opacity:1; color:rgb(28 170 162 / var(--tw-text-opacity)); }
a.link:focus { --tw-text-opacity:1; color:rgb(57 141 136 / var(--tw-text-opacity)); }
a.link:active { --tw-text-opacity:1; color:rgb(57 141 136 / var(--tw-text-opacity)); }

button { cursor:pointer; }

ul { list-style:disc; padding-left:24px; }
ul li { padding-left:0px; }

[type=text],
[type=email],
[type=url],
[type=password],
[type=number],
[type=date],
[type=datetime-local],
[type=month],
[type=search],
[type=tel],
[type=time],
[type=week],
[multiple],
textarea,
select { height:auto; min-height:46px; border-radius:0px; border-width:2px; border-style:solid; --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); background-color:transparent; padding-top:0.5rem; padding-bottom:0.5rem; padding-left:1rem; padding-right:1rem; --tw-text-opacity:1;  --tw-shadow:0 0 #0000; --tw-shadow-colored:0 0 #0000; box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); outline:2px solid transparent; outline-offset:2px; }
[type=text]::-webkit-input-placeholder, [type=email]::-webkit-input-placeholder, [type=url]::-webkit-input-placeholder, [type=password]::-webkit-input-placeholder, [type=number]::-webkit-input-placeholder, [type=date]::-webkit-input-placeholder, [type=datetime-local]::-webkit-input-placeholder, [type=month]::-webkit-input-placeholder, [type=search]::-webkit-input-placeholder, [type=tel]::-webkit-input-placeholder, [type=time]::-webkit-input-placeholder, [type=week]::-webkit-input-placeholder, [multiple]::-webkit-input-placeholder, textarea::-webkit-input-placeholder, select::-webkit-input-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
[type=text]::-moz-placeholder, [type=email]::-moz-placeholder, [type=url]::-moz-placeholder, [type=password]::-moz-placeholder, [type=number]::-moz-placeholder, [type=date]::-moz-placeholder, [type=datetime-local]::-moz-placeholder, [type=month]::-moz-placeholder, [type=search]::-moz-placeholder, [type=tel]::-moz-placeholder, [type=time]::-moz-placeholder, [type=week]::-moz-placeholder, [multiple]::-moz-placeholder, textarea::-moz-placeholder, select::-moz-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
[type=text]:-ms-input-placeholder, [type=email]:-ms-input-placeholder, [type=url]:-ms-input-placeholder, [type=password]:-ms-input-placeholder, [type=number]:-ms-input-placeholder, [type=date]:-ms-input-placeholder, [type=datetime-local]:-ms-input-placeholder, [type=month]:-ms-input-placeholder, [type=search]:-ms-input-placeholder, [type=tel]:-ms-input-placeholder, [type=time]:-ms-input-placeholder, [type=week]:-ms-input-placeholder, [multiple]:-ms-input-placeholder, textarea:-ms-input-placeholder, select:-ms-input-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
[type=text]::-ms-input-placeholder, [type=email]::-ms-input-placeholder, [type=url]::-ms-input-placeholder, [type=password]::-ms-input-placeholder, [type=number]::-ms-input-placeholder, [type=date]::-ms-input-placeholder, [type=datetime-local]::-ms-input-placeholder, [type=month]::-ms-input-placeholder, [type=search]::-ms-input-placeholder, [type=tel]::-ms-input-placeholder, [type=time]::-ms-input-placeholder, [type=week]::-ms-input-placeholder, [multiple]::-ms-input-placeholder, textarea::-ms-input-placeholder, select::-ms-input-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
[type=text]::placeholder,
[type=email]::placeholder,
[type=url]::placeholder,
[type=password]::placeholder,
[type=number]::placeholder,
[type=date]::placeholder,
[type=datetime-local]::placeholder,
[type=month]::placeholder,
[type=search]::placeholder,
[type=tel]::placeholder,
[type=time]::placeholder,
[type=week]::placeholder,
[multiple]::placeholder,
textarea::placeholder,
select::placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
[type=text]:hover,
[type=email]:hover,
[type=url]:hover,
[type=password]:hover,
[type=number]:hover,
[type=date]:hover,
[type=datetime-local]:hover,
[type=month]:hover,
[type=search]:hover,
[type=tel]:hover,
[type=time]:hover,
[type=week]:hover,
[multiple]:hover,
textarea:hover,
select:hover { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); --tw-shadow:0px 1px 6px rgba(119,126,144,0.48); --tw-shadow-colored:0px 1px 6px var(--tw-shadow-color); box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); }
[type=text]:focus,
[type=email]:focus,
[type=url]:focus,
[type=password]:focus,
[type=number]:focus,
[type=date]:focus,
[type=datetime-local]:focus,
[type=month]:focus,
[type=search]:focus,
[type=tel]:focus,
[type=time]:focus,
[type=week]:focus,
[multiple]:focus,
textarea:focus,
select:focus { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); outline:2px solid transparent; outline-offset:2px; }
[type=text]:disabled,
[type=email]:disabled,
[type=url]:disabled,
[type=password]:disabled,
[type=number]:disabled,
[type=date]:disabled,
[type=datetime-local]:disabled,
[type=month]:disabled,
[type=search]:disabled,
[type=tel]:disabled,
[type=time]:disabled,
[type=week]:disabled,
[multiple]:disabled,
textarea:disabled,
select:disabled { cursor:not-allowed; --tw-text-opacity:1; color:rgb(57 53 86 / var(--tw-text-opacity)); }
[type=text]:disabled::-webkit-input-placeholder, [type=email]:disabled::-webkit-input-placeholder, [type=url]:disabled::-webkit-input-placeholder, [type=password]:disabled::-webkit-input-placeholder, [type=number]:disabled::-webkit-input-placeholder, [type=date]:disabled::-webkit-input-placeholder, [type=datetime-local]:disabled::-webkit-input-placeholder, [type=month]:disabled::-webkit-input-placeholder, [type=search]:disabled::-webkit-input-placeholder, [type=tel]:disabled::-webkit-input-placeholder, [type=time]:disabled::-webkit-input-placeholder, [type=week]:disabled::-webkit-input-placeholder, [multiple]:disabled::-webkit-input-placeholder, textarea:disabled::-webkit-input-placeholder, select:disabled::-webkit-input-placeholder { --tw-text-opacity:1; color:rgb(57 53 86 / var(--tw-text-opacity)); }
[type=text]:disabled::-moz-placeholder, [type=email]:disabled::-moz-placeholder, [type=url]:disabled::-moz-placeholder, [type=password]:disabled::-moz-placeholder, [type=number]:disabled::-moz-placeholder, [type=date]:disabled::-moz-placeholder, [type=datetime-local]:disabled::-moz-placeholder, [type=month]:disabled::-moz-placeholder, [type=search]:disabled::-moz-placeholder, [type=tel]:disabled::-moz-placeholder, [type=time]:disabled::-moz-placeholder, [type=week]:disabled::-moz-placeholder, [multiple]:disabled::-moz-placeholder, textarea:disabled::-moz-placeholder, select:disabled::-moz-placeholder { --tw-text-opacity:1; color:rgb(57 53 86 / var(--tw-text-opacity)); }
[type=text]:disabled:-ms-input-placeholder, [type=email]:disabled:-ms-input-placeholder, [type=url]:disabled:-ms-input-placeholder, [type=password]:disabled:-ms-input-placeholder, [type=number]:disabled:-ms-input-placeholder, [type=date]:disabled:-ms-input-placeholder, [type=datetime-local]:disabled:-ms-input-placeholder, [type=month]:disabled:-ms-input-placeholder, [type=search]:disabled:-ms-input-placeholder, [type=tel]:disabled:-ms-input-placeholder, [type=time]:disabled:-ms-input-placeholder, [type=week]:disabled:-ms-input-placeholder, [multiple]:disabled:-ms-input-placeholder, textarea:disabled:-ms-input-placeholder, select:disabled:-ms-input-placeholder { --tw-text-opacity:1; color:rgb(57 53 86 / var(--tw-text-opacity)); }
[type=text]:disabled::-ms-input-placeholder, [type=email]:disabled::-ms-input-placeholder, [type=url]:disabled::-ms-input-placeholder, [type=password]:disabled::-ms-input-placeholder, [type=number]:disabled::-ms-input-placeholder, [type=date]:disabled::-ms-input-placeholder, [type=datetime-local]:disabled::-ms-input-placeholder, [type=month]:disabled::-ms-input-placeholder, [type=search]:disabled::-ms-input-placeholder, [type=tel]:disabled::-ms-input-placeholder, [type=time]:disabled::-ms-input-placeholder, [type=week]:disabled::-ms-input-placeholder, [multiple]:disabled::-ms-input-placeholder, textarea:disabled::-ms-input-placeholder, select:disabled::-ms-input-placeholder { --tw-text-opacity:1; color:rgb(57 53 86 / var(--tw-text-opacity)); }
[type=text]:disabled::placeholder,
[type=email]:disabled::placeholder,
[type=url]:disabled::placeholder,
[type=password]:disabled::placeholder,
[type=number]:disabled::placeholder,
[type=date]:disabled::placeholder,
[type=datetime-local]:disabled::placeholder,
[type=month]:disabled::placeholder,
[type=search]:disabled::placeholder,
[type=tel]:disabled::placeholder,
[type=time]:disabled::placeholder,
[type=week]:disabled::placeholder,
[multiple]:disabled::placeholder,
textarea:disabled::placeholder,
select:disabled::placeholder { --tw-text-opacity:1; color:rgb(57 53 86 / var(--tw-text-opacity)); }
[type=text]:hover:disabled,
[type=email]:hover:disabled,
[type=url]:hover:disabled,
[type=password]:hover:disabled,
[type=number]:hover:disabled,
[type=date]:hover:disabled,
[type=datetime-local]:hover:disabled,
[type=month]:hover:disabled,
[type=search]:hover:disabled,
[type=tel]:hover:disabled,
[type=time]:hover:disabled,
[type=week]:hover:disabled,
[multiple]:hover:disabled,
textarea:hover:disabled,
select:hover:disabled { --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); --tw-shadow:0 0 #0000; --tw-shadow-colored:0 0 #0000; box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); }
[type=text].error,
[type=email].error,
[type=url].error,
[type=password].error,
[type=number].error,
[type=date].error,
[type=datetime-local].error,
[type=month].error,
[type=search].error,
[type=tel].error,
[type=time].error,
[type=week].error,
[multiple].error,
textarea.error,
select.error { --tw-border-opacity:1; border-color:rgb(239 70 111 / var(--tw-border-opacity)); --tw-text-opacity:1; color:rgb(239 70 111 / var(--tw-text-opacity)); }
[type=text].error::-webkit-input-placeholder, [type=email].error::-webkit-input-placeholder, [type=url].error::-webkit-input-placeholder, [type=password].error::-webkit-input-placeholder, [type=number].error::-webkit-input-placeholder, [type=date].error::-webkit-input-placeholder, [type=datetime-local].error::-webkit-input-placeholder, [type=month].error::-webkit-input-placeholder, [type=search].error::-webkit-input-placeholder, [type=tel].error::-webkit-input-placeholder, [type=time].error::-webkit-input-placeholder, [type=week].error::-webkit-input-placeholder, [multiple].error::-webkit-input-placeholder, textarea.error::-webkit-input-placeholder, select.error::-webkit-input-placeholder { --tw-text-opacity:1; color:rgb(239 70 111 / var(--tw-text-opacity)); }
[type=text].error::-moz-placeholder, [type=email].error::-moz-placeholder, [type=url].error::-moz-placeholder, [type=password].error::-moz-placeholder, [type=number].error::-moz-placeholder, [type=date].error::-moz-placeholder, [type=datetime-local].error::-moz-placeholder, [type=month].error::-moz-placeholder, [type=search].error::-moz-placeholder, [type=tel].error::-moz-placeholder, [type=time].error::-moz-placeholder, [type=week].error::-moz-placeholder, [multiple].error::-moz-placeholder, textarea.error::-moz-placeholder, select.error::-moz-placeholder { --tw-text-opacity:1; color:rgb(239 70 111 / var(--tw-text-opacity)); }
[type=text].error:-ms-input-placeholder, [type=email].error:-ms-input-placeholder, [type=url].error:-ms-input-placeholder, [type=password].error:-ms-input-placeholder, [type=number].error:-ms-input-placeholder, [type=date].error:-ms-input-placeholder, [type=datetime-local].error:-ms-input-placeholder, [type=month].error:-ms-input-placeholder, [type=search].error:-ms-input-placeholder, [type=tel].error:-ms-input-placeholder, [type=time].error:-ms-input-placeholder, [type=week].error:-ms-input-placeholder, [multiple].error:-ms-input-placeholder, textarea.error:-ms-input-placeholder, select.error:-ms-input-placeholder { --tw-text-opacity:1; color:rgb(239 70 111 / var(--tw-text-opacity)); }
[type=text].error::-ms-input-placeholder, [type=email].error::-ms-input-placeholder, [type=url].error::-ms-input-placeholder, [type=password].error::-ms-input-placeholder, [type=number].error::-ms-input-placeholder, [type=date].error::-ms-input-placeholder, [type=datetime-local].error::-ms-input-placeholder, [type=month].error::-ms-input-placeholder, [type=search].error::-ms-input-placeholder, [type=tel].error::-ms-input-placeholder, [type=time].error::-ms-input-placeholder, [type=week].error::-ms-input-placeholder, [multiple].error::-ms-input-placeholder, textarea.error::-ms-input-placeholder, select.error::-ms-input-placeholder { --tw-text-opacity:1; color:rgb(239 70 111 / var(--tw-text-opacity)); }
[type=text].error::placeholder,
[type=email].error::placeholder,
[type=url].error::placeholder,
[type=password].error::placeholder,
[type=number].error::placeholder,
[type=date].error::placeholder,
[type=datetime-local].error::placeholder,
[type=month].error::placeholder,
[type=search].error::placeholder,
[type=tel].error::placeholder,
[type=time].error::placeholder,
[type=week].error::placeholder,
[multiple].error::placeholder,
textarea.error::placeholder,
select.error::placeholder { --tw-text-opacity:1; color:rgb(239 70 111 / var(--tw-text-opacity)); }
select { -webkit-appearance:none; -moz-appearance:none; appearance:none; background-image:url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M15.0428 9.54289L12.2499 12.3358L9.45703 9.54289L8.04282 10.9571L11.5428 14.4571C11.9333 14.8476 12.5665 14.8476 12.957 14.4571L16.457 10.9571L15.0428 9.54289Z" fill="white"/></svg>'); background-size:24px 24px; background-position:right 8px top 50%; background-repeat:no-repeat; padding-right:48px; }
select option { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }

/* Default toggle */
.toggle-bg:after { content:""; position:absolute; top:0.25rem; left:0.25rem; height:1rem; width:1rem; border-radius:9999px; border-width:1px; --tw-border-opacity:1; border-color:rgb(255 255 255 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(255 255 255 / var(--tw-bg-opacity)); -webkit-transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter; transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter; transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter; -webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1); -webkit-transition-duration:150ms; transition-duration:150ms; }
input:checked + .toggle-bg:after { -webkit-transform:translateX(100%); -ms-transform:translateX(100%); transform:translateX(100%); left:0.5rem; --tw-border-opacity:1; border-color:rgb(255 255 255 / var(--tw-border-opacity)); }
input:checked + .toggle-bg { --tw-border-opacity:1; border-color:rgb(1 141 240 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(1 141 240 / var(--tw-bg-opacity)); }

/* Default Input Range */
@media screen and (-webkit-min-device-pixel-ratio:0) {
	input[type=range] { height:1rem; width:100%; -webkit-appearance:none; -moz-appearance:none; appearance:none; overflow:hidden; border-radius:0.125rem; background-color:rgb(255 255 255 / var(--tw-bg-opacity)); --tw-bg-opacity:0.1; }
	input[type=range]::-webkit-slider-runnable-track { height:1rem; -webkit-appearance:none; appearance:none; background-color:rgb(255 255 255 / var(--tw-bg-opacity)); --tw-bg-opacity:0.1; }
	input[type=range]::-webkit-slider-thumb { height:1rem; width:1rem; -webkit-appearance:none; appearance:none; border-radius:9999px; border-width:2px; border-style:solid; --tw-border-opacity:1; border-color:rgb(255 255 255 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(1 141 240 / var(--tw-bg-opacity)); --tw-shadow:-99999px 0 0 99991px rgba(1,141,240,1); --tw-shadow-colored:-99999px 0 0 99991px var(--tw-shadow-color); box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); }
}
input[type=range]::-moz-range-progress { --tw-bg-opacity:1; background-color:rgb(1 141 240 / var(--tw-bg-opacity)); }
input[type=range]::-moz-range-track { background-color:rgb(255 255 255 / var(--tw-bg-opacity)); --tw-bg-opacity:0.1; }
input[type=range]::-ms-fill-lower { --tw-bg-opacity:1; background-color:rgb(1 141 240 / var(--tw-bg-opacity)); }
input[type=range]::-ms-fill-upper { background-color:rgb(255 255 255 / var(--tw-bg-opacity)); --tw-bg-opacity:0.1; }

/* Default Checkbox */
input[type=checkbox] { position:absolute; overflow:hidden; height:0; width:0; padding:0; border:0; opacity:0; }
input[type=checkbox] + label { position:relative; display:-webkit-inline-box; display:-webkit-inline-flex; display:-ms-inline-flexbox; display:inline-flex; cursor:pointer; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; font-weight:400; opacity:1; }
input[type=checkbox] + label::before { margin-right:0.5rem; display:inline-block; height:1rem; width:1rem; border-radius:0px; border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(156 153 174 / var(--tw-border-opacity)); background-color:transparent; vertical-align:middle; --tw-shadow:0 0 #0000; --tw-shadow-colored:0 0 #0000; box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); --tw-content:""; content:var(--tw-content); }
input[type=checkbox]:checked + label::after { position:absolute; left:0px; top:50%; margin:0px; height:1rem; width:1rem; --tw-translate-y:-50%; -webkit-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)); -ms-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)); 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)); --tw-bg-opacity:1; background-color:rgb(1 141 240 / var(--tw-bg-opacity)); background-image:url('data:image/svg+xml;utf8,<svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.4312 3.31928C12.7729 3.661 12.7729 4.21502 12.4312 4.55672L6.3062 10.6814C5.9645 11.0231 5.41052 11.0231 5.06881 10.6815L2.00631 7.61924C1.66459 7.27754 1.66456 6.72352 2.00625 6.3818C2.34795 6.04007 2.90197 6.04005 3.24369 6.38174L5.68749 8.82532L11.1938 3.31926C11.5355 2.97755 12.0895 2.97757 12.4312 3.31928Z" fill="white"/></svg>'); background-size:14px 14px; background-position:center; background-repeat:no-repeat; --tw-content:""; content:var(--tw-content); }


*, ::before, ::after {
	--tw-border-spacing-x:0;
	--tw-border-spacing-y:0;
	--tw-translate-x:0;
	--tw-translate-y:0;
	--tw-rotate:0;
	--tw-skew-x:0;
	--tw-skew-y:0;
	--tw-scale-x:1;
	--tw-scale-y:1;
	--tw-pan-x:;
	--tw-pan-y:;
	--tw-pinch-zoom:;
	--tw-scroll-snap-strictness:proximity;
	--tw-ordinal:;
	--tw-slashed-zero:;
	--tw-numeric-figure:;
	--tw-numeric-spacing:;
	--tw-numeric-fraction:;
	--tw-ring-inset:;
	--tw-ring-offset-width:0px;
	--tw-ring-offset-color:#fff;
	--tw-ring-color:rgb(59 130 246 / 0.5);
	--tw-ring-offset-shadow:0 0 #0000;
	--tw-ring-shadow:0 0 #0000;
	--tw-shadow:0 0 #0000;
	--tw-shadow-colored:0 0 #0000;
	--tw-blur:;
	--tw-brightness:;
	--tw-contrast:;
	--tw-grayscale:;
	--tw-hue-rotate:;
	--tw-invert:;
	--tw-saturate:;
	--tw-sepia:;
	--tw-drop-shadow:;
	--tw-backdrop-blur:;
	--tw-backdrop-brightness:;
	--tw-backdrop-contrast:;
	--tw-backdrop-grayscale:;
	--tw-backdrop-hue-rotate:;
	--tw-backdrop-invert:;
	--tw-backdrop-opacity:;
	--tw-backdrop-saturate:;
	--tw-backdrop-sepia:;
}
::-webkit-backdrop {
	--tw-border-spacing-x:0;
	--tw-border-spacing-y:0;
	--tw-translate-x:0;
	--tw-translate-y:0;
	--tw-rotate:0;
	--tw-skew-x:0;
	--tw-skew-y:0;
	--tw-scale-x:1;
	--tw-scale-y:1;
	--tw-pan-x:;
	--tw-pan-y:;
	--tw-pinch-zoom:;
	--tw-scroll-snap-strictness:proximity;
	--tw-ordinal:;
	--tw-slashed-zero:;
	--tw-numeric-figure:;
	--tw-numeric-spacing:;
	--tw-numeric-fraction:;
	--tw-ring-inset:;
	--tw-ring-offset-width:0px;
	--tw-ring-offset-color:#fff;
	--tw-ring-color:rgb(59 130 246 / 0.5);
	--tw-ring-offset-shadow:0 0 #0000;
	--tw-ring-shadow:0 0 #0000;
	--tw-shadow:0 0 #0000;
	--tw-shadow-colored:0 0 #0000;
	--tw-blur:;
	--tw-brightness:;
	--tw-contrast:;
	--tw-grayscale:;
	--tw-hue-rotate:;
	--tw-invert:;
	--tw-saturate:;
	--tw-sepia:;
	--tw-drop-shadow:;
	--tw-backdrop-blur:;
	--tw-backdrop-brightness:;
	--tw-backdrop-contrast:;
	--tw-backdrop-grayscale:;
	--tw-backdrop-hue-rotate:;
	--tw-backdrop-invert:;
	--tw-backdrop-opacity:;
	--tw-backdrop-saturate:;
	--tw-backdrop-sepia:;
}
::backdrop {
	--tw-border-spacing-x:0;
	--tw-border-spacing-y:0;
	--tw-translate-x:0;
	--tw-translate-y:0;
	--tw-rotate:0;
	--tw-skew-x:0;
	--tw-skew-y:0;
	--tw-scale-x:1;
	--tw-scale-y:1;
	--tw-pan-x:;
	--tw-pan-y:;
	--tw-pinch-zoom:;
	--tw-scroll-snap-strictness:proximity;
	--tw-ordinal:;
	--tw-slashed-zero:;
	--tw-numeric-figure:;
	--tw-numeric-spacing:;
	--tw-numeric-fraction:;
	--tw-ring-inset:;
	--tw-ring-offset-width:0px;
	--tw-ring-offset-color:#fff;
	--tw-ring-color:rgb(59 130 246 / 0.5);
	--tw-ring-offset-shadow:0 0 #0000;
	--tw-ring-shadow:0 0 #0000;
	--tw-shadow:0 0 #0000;
	--tw-shadow-colored:0 0 #0000;
	--tw-blur:;
	--tw-brightness:;
	--tw-contrast:;
	--tw-grayscale:;
	--tw-hue-rotate:;
	--tw-invert:;
	--tw-saturate:;
	--tw-sepia:;
	--tw-drop-shadow:;
	--tw-backdrop-blur:;
	--tw-backdrop-brightness:;
	--tw-backdrop-contrast:;
	--tw-backdrop-grayscale:;
	--tw-backdrop-hue-rotate:;
	--tw-backdrop-invert:;
	--tw-backdrop-opacity:;
	--tw-backdrop-saturate:;
	--tw-backdrop-sepia:;
}

.container { width:100%; margin-right:auto; margin-left:auto; padding-right:2rem; padding-left:2rem; }
@media (min-width:576px) { .container { max-width:576px; } }
@media (min-width:768px) { .container { max-width:768px; } }
@media (min-width:992px) { .container { max-width:992px; } }
@media (min-width:1200px) { .container { max-width:1200px; } }
@media (min-width:1328px) { .container { max-width:1328px; } }


/* White Circle Loader */
.lds-ring { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; position:relative; width:24px; height:24px; }
.lds-ring div { box-sizing:border-box; display:block; position:absolute; width:100%; height:100%; border:2px solid #fff; border-radius:50%; -webkit-animation:lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; animation:lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color:#fff transparent transparent transparent; }
.lds-ring div:nth-child(1) { -webkit-animation-delay:-0.45s; animation-delay:-0.45s; }
.lds-ring div:nth-child(2) { -webkit-animation-delay:-0.3s; animation-delay:-0.3s; }
.lds-ring div:nth-child(3) { -webkit-animation-delay:-0.15s; animation-delay:-0.15s; }
@-webkit-keyframes lds-ring {
	0% { -webkit-transform:rotate(0deg); transform:rotate(0deg); }
	100% { -webkit-transform:rotate(360deg); transform:rotate(360deg); }
}
@keyframes lds-ring {
	0% { -webkit-transform:rotate(0deg); transform:rotate(0deg); }
	100% { -webkit-transform:rotate(360deg); transform:rotate(360deg); }
}


/* Default Popup */
.js-popup { display:none; }
.js-popup.show { display:block; }
.js-popup.show .js-popup-dialog { -webkit-animation:popupFadeIn 0.5s ease forwards; animation:popupFadeIn 0.5s ease forwards; }
@-webkit-keyframes popupFadeIn {
	0% { opacity:0; -webkit-transform:scale(0.5); transform:scale(0.5); }
	100% { opacity:1; -webkit-transform:scale(1); transform:scale(1); }
}
@keyframes popupFadeIn {
	0% { opacity:0; -webkit-transform:scale(0.5); transform:scale(0.5); }
	100% { opacity:1; -webkit-transform:scale(1); transform:scale(1); }
}


/* Styles Override - Quill.js */
.ql-container.ql-snow { border-width:2px; border-style:solid; --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.ql-editor { max-height:200px; overflow:hidden; padding-top:0.5rem; padding-bottom:0.5rem; padding-left:1rem; padding-right:1rem; }
.ql-editor:hover { overflow:auto; }
.ql-editor.ql-blank::before { font-style:normal; --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.ql-editor p { --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.ql-toolbar.ql-snow { border-bottom-right-radius:0.25rem; border-bottom-left-radius:0.25rem; border-width:2px; border-top-width:0px; border-style:solid; --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); padding-top:0.5rem; padding-bottom:0.5rem; padding-left:1rem; padding-right:1rem; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.ql-toolbar.ql-snow .ql-formats > *:not(:last-child) { margin-right:0.75rem; }
.ql-toolbar.ql-snow .ql-picker-label { height:100%; width:100%; border-width:0px; padding:0px; }
.ql-snow.ql-toolbar button, .ql-snow .ql-toolbar button { height:1.5rem; width:1.5rem; border-width:0px; padding:1px; }
.ql-snow .ql-color-picker,
.ql-snow .ql-icon-picker { height:1.5rem; width:1.5rem; border-width:0px; padding:1px; }
.ql-snow .ql-stroke { stroke:#9C99AE; }
.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill { fill:#9C99AE; }


/* Form */
.form-group { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; gap:0.5rem; }
label { font-size:1rem; line-height:1.6; font-weight:500; --tw-text-opacity:1; color:rgb(230 230 235 / var(--tw-text-opacity)); opacity:0.7; }


/* Styles Override - Daterangepicker */
.js-daterangepicker { -webkit-appearance:none; -moz-appearance:none; appearance:none; background-image:url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12 14C12.1978 14 12.3911 13.9414 12.5556 13.8315C12.72 13.7216 12.8482 13.5654 12.9239 13.3827C12.9996 13.2 13.0194 12.9989 12.9808 12.8049C12.9422 12.6109 12.847 12.4327 12.7071 12.2929C12.5673 12.153 12.3891 12.0578 12.1951 12.0192C12.0011 11.9806 11.8 12.0004 11.6173 12.0761C11.4346 12.1518 11.2784 12.28 11.1685 12.4444C11.0586 12.6089 11 12.8022 11 13C11 13.2652 11.1054 13.5196 11.2929 13.7071C11.4804 13.8946 11.7348 14 12 14ZM17 14C17.1978 14 17.3911 13.9414 17.5556 13.8315C17.72 13.7216 17.8482 13.5654 17.9239 13.3827C17.9996 13.2 18.0194 12.9989 17.9808 12.8049C17.9422 12.6109 17.847 12.4327 17.7071 12.2929C17.5673 12.153 17.3891 12.0578 17.1951 12.0192C17.0011 11.9806 16.8 12.0004 16.6173 12.0761C16.4346 12.1518 16.2784 12.28 16.1685 12.4444C16.0586 12.6089 16 12.8022 16 13C16 13.2652 16.1054 13.5196 16.2929 13.7071C16.4804 13.8946 16.7348 14 17 14ZM12 18C12.1978 18 12.3911 17.9414 12.5556 17.8315C12.72 17.7216 12.8482 17.5654 12.9239 17.3827C12.9996 17.2 13.0194 16.9989 12.9808 16.8049C12.9422 16.6109 12.847 16.4327 12.7071 16.2929C12.5673 16.153 12.3891 16.0578 12.1951 16.0192C12.0011 15.9806 11.8 16.0004 11.6173 16.0761C11.4346 16.1518 11.2784 16.28 11.1685 16.4444C11.0586 16.6089 11 16.8022 11 17C11 17.2652 11.1054 17.5196 11.2929 17.7071C11.4804 17.8946 11.7348 18 12 18ZM17 18C17.1978 18 17.3911 17.9414 17.5556 17.8315C17.72 17.7216 17.8482 17.5654 17.9239 17.3827C17.9996 17.2 18.0194 16.9989 17.9808 16.8049C17.9422 16.6109 17.847 16.4327 17.7071 16.2929C17.5673 16.153 17.3891 16.0578 17.1951 16.0192C17.0011 15.9806 16.8 16.0004 16.6173 16.0761C16.4346 16.1518 16.2784 16.28 16.1685 16.4444C16.0586 16.6089 16 16.8022 16 17C16 17.2652 16.1054 17.5196 16.2929 17.7071C16.4804 17.8946 16.7348 18 17 18ZM7 14C7.19778 14 7.39112 13.9414 7.55557 13.8315C7.72002 13.7216 7.84819 13.5654 7.92388 13.3827C7.99957 13.2 8.01937 12.9989 7.98079 12.8049C7.9422 12.6109 7.84696 12.4327 7.70711 12.2929C7.56725 12.153 7.38907 12.0578 7.19509 12.0192C7.00111 11.9806 6.80004 12.0004 6.61732 12.0761C6.43459 12.1518 6.27841 12.28 6.16853 12.4444C6.05865 12.6089 6 12.8022 6 13C6 13.2652 6.10536 13.5196 6.29289 13.7071C6.48043 13.8946 6.73478 14 7 14ZM19 4H18V3C18 2.73478 17.8946 2.48043 17.7071 2.29289C17.5196 2.10536 17.2652 2 17 2C16.7348 2 16.4804 2.10536 16.2929 2.29289C16.1054 2.48043 16 2.73478 16 3V4H8V3C8 2.73478 7.89464 2.48043 7.70711 2.29289C7.51957 2.10536 7.26522 2 7 2C6.73478 2 6.48043 2.10536 6.29289 2.29289C6.10536 2.48043 6 2.73478 6 3V4H5C4.20435 4 3.44129 4.31607 2.87868 4.87868C2.31607 5.44129 2 6.20435 2 7V19C2 19.7956 2.31607 20.5587 2.87868 21.1213C3.44129 21.6839 4.20435 22 5 22H19C19.7956 22 20.5587 21.6839 21.1213 21.1213C21.6839 20.5587 22 19.7956 22 19V7C22 6.20435 21.6839 5.44129 21.1213 4.87868C20.5587 4.31607 19.7956 4 19 4ZM20 19C20 19.2652 19.8946 19.5196 19.7071 19.7071C19.5196 19.8946 19.2652 20 19 20H5C4.73478 20 4.48043 19.8946 4.29289 19.7071C4.10536 19.5196 4 19.2652 4 19V10H20V19ZM20 8H4V7C4 6.73478 4.10536 6.48043 4.29289 6.29289C4.48043 6.10536 4.73478 6 5 6H19C19.2652 6 19.5196 6.10536 19.7071 6.29289C19.8946 6.48043 20 6.73478 20 7V8ZM7 18C7.19778 18 7.39112 17.9414 7.55557 17.8315C7.72002 17.7216 7.84819 17.5654 7.92388 17.3827C7.99957 17.2 8.01937 16.9989 7.98079 16.8049C7.9422 16.6109 7.84696 16.4327 7.70711 16.2929C7.56725 16.153 7.38907 16.0578 7.19509 16.0192C7.00111 15.9806 6.80004 16.0004 6.61732 16.0761C6.43459 16.1518 6.27841 16.28 6.16853 16.4444C6.05865 16.6089 6 16.8022 6 17C6 17.2652 6.10536 17.5196 6.29289 17.7071C6.48043 17.8946 6.73478 18 7 18Z" fill="white"/></svg>'); background-size:24px 24px; background-position:right 8px top 50%; background-repeat:no-repeat; padding-right:48px; }
.daterangepicker .drp-selected { display:none; }
.daterangepicker .drp-buttons .cancelBtn { border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); background-color:transparent; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.daterangepicker .drp-buttons .cancelBtn:hover { --tw-border-opacity:1; border-color:rgb(28 170 162 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.daterangepicker .drp-buttons .cancelBtn:active { --tw-border-opacity:1; border-color:rgb(57 141 136 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
.daterangepicker .drp-buttons .cancelBtn:disabled { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border-width:0; }
.\!pointer-events-none { pointer-events:none !important; }
.visible { visibility:visible; }
.\!static { position:static !important; }
.static { position:static; }
.fixed { position:fixed; }
.absolute { position:absolute; }
.relative { position:relative; }
.sticky { position:-webkit-sticky; position:sticky; }
.left-4 { left:1rem; }
.right-0 { right:0px; }
.left-0 { left:0px; }
.top-16 { top:4rem; }
.bottom-auto { bottom:auto; }
.left-\[15\%\] { left:15%; }
.-top-20 { top:-5rem; }
.top-0 { top:0px; }
.bottom-0 { bottom:0px; }
.right-4 { right:1rem; }
.top-full { top:100%; }
.top-5 { top:1.25rem; }
.right-5 { right:1.25rem; }
.top-1 { top:0.25rem; }
.top-\[34px\] { top:34px; }
.left-\[8px\] { left:8px; }
.top-\[56px\] { top:56px; }
.left-\[36px\] { left:36px; }
.right-\[8px\] { right:8px; }
.top-\[136px\] { top:136px; }
.-right-\[10px\] { right:-10px; }
.top-\[80px\] { top:80px; }
.left-\[110px\] { left:110px; }
.top-\[40px\] { top:40px; }
.bottom-\[36px\] { bottom:36px; }
.left-\[200px\] { left:200px; }
.right-\[4px\] { right:4px; }
.top-\[1px\] { top:1px; }
.right-\[1px\] { right:1px; }
.top-\[76px\] { top:76px; }
.left-8 { left:2rem; }
.right-8 { right:2rem; }
.left-auto { left:auto; }
.-right-\[69px\] { right:-69px; }
.right-2 { right:0.5rem; }
.-bottom-\[1px\] { bottom:-1px; }
.top-4 { top:1rem; }
.-right-0 { right:-0px; }
.-right-\[1px\] { right:-1px; }
.bottom-full { bottom:100%; }
.isolate { isolation:isolate; }
.z-\[1\] { z-index:1; }
.-z-\[1\] { z-index:-1; }
.z-dropdown { z-index:1000; }
.z-50 { z-index:50; }
.z-\[2\] { z-index:2; }
.z-\[-1\] { z-index:-1; }
.z-\[0\] { z-index:0; }
.z-10 { z-index:10; }
.z-offcanvas { z-index:1045; }
.z-modal-backdrop { z-index:1050; }
.z-modal { z-index:1055; }
.order-last { -webkit-box-ordinal-group:10000; -webkit-order:9999; -ms-flex-order:9999; order:9999; }
.order-none { -webkit-box-ordinal-group:1; -webkit-order:0; -ms-flex-order:0; order:0; }
.order-2 { -webkit-box-ordinal-group:3; -webkit-order:2; -ms-flex-order:2; order:2; }
.order-1 { -webkit-box-ordinal-group:2; -webkit-order:1; -ms-flex-order:1; order:1; }
.order-first { -webkit-box-ordinal-group:-9998; -webkit-order:-9999; -ms-flex-order:-9999; order:-9999; }
.order-3 { -webkit-box-ordinal-group:4; -webkit-order:3; -ms-flex-order:3; order:3; }
.order-4 { -webkit-box-ordinal-group:5; -webkit-order:4; -ms-flex-order:4; order:4; }
.col-span-3 { grid-column:span 3 / span 3; }
.m-0 { margin:0px; }
.m-auto { margin:auto; }
.-mx-8 { margin-left:-2rem; margin-right:-2rem; }
.-mx-4 { margin-left:-1rem; margin-right:-1rem; }
.mx-auto { margin-left:auto; margin-right:auto; }
.mx-5 { margin-left:1.25rem; margin-right:1.25rem; }
.my-auto { margin-top:auto; margin-bottom:auto; }
.my-6 { margin-top:1.5rem; margin-bottom:1.5rem; }
.mx-8 { margin-left:2rem; margin-right:2rem; }
.mt-4 { margin-top:1rem; }
.mt-2 { margin-top:0.5rem; }
.mb-4 { margin-bottom:1rem; }
.mt-\[2px\] { margin-top:2px; }
.mt-8 { margin-top:2rem; }
.mb-8 { margin-bottom:2rem; }
.mt-6 { margin-top:1.5rem; }
.mt-0 { margin-top:0px; }
.-ml-\[11px\] { margin-left:-11px; }
.mb-2 { margin-bottom:0.5rem; }
.ml-\[42px\] { margin-left:42px; }
.ml-\[72px\] { margin-left:72px; }
.ml-\[35px\] { margin-left:35px; }
.mt-auto { margin-top:auto; }
.mt-10 { margin-top:2.5rem; }
.mb-\[6px\] { margin-bottom:6px; }
.mb-1 { margin-bottom:0.25rem; }
.mb-6 { margin-bottom:1.5rem; }
.mr-6 { margin-right:1.5rem; }
.ml-2 { margin-left:0.5rem; }
.ml-8 { margin-left:2rem; }
.mb-5 { margin-bottom:1.25rem; }
.mb-16 { margin-bottom:4rem; }
.mt-1 { margin-top:0.25rem; }
.mb-10 { margin-bottom:2.5rem; }
.mt-\[5px\] { margin-top:5px; }
.mr-4 { margin-right:1rem; }
.ml-4 { margin-left:1rem; }
.mb-\[2px\] { margin-bottom:2px; }
.-mt-\[67px\] { margin-top:-67px; }
.mt-\[14px\] { margin-top:14px; }
.mb-3 { margin-bottom:0.75rem; }
.mt-14 { margin-top:3.5rem; }
.ml-auto { margin-left:auto; }
.mb-\[10px\] { margin-bottom:10px; }
.mt-3 { margin-top:0.75rem; }
.block { display:block; }
.inline-block { display:inline-block; }
.inline { display:inline; }
.flex { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; }
.table { display:table; }
.grid { display:grid; }
.contents { display:contents; }
.list-item { display:list-item; }
.hidden { display:none; }
.\!hidden { display:none !important; }
.aspect-\[1\/1\] { aspect-ratio:1/1; }
.\!aspect-\[1\/1\] { aspect-ratio:1/1 !important; }
.aspect-1 { aspect-ratio:1; }
.aspect-\[3\/2\] { aspect-ratio:3/2; }
.aspect-\[384\/304\] { aspect-ratio:384/304; }
.aspect-\[292\/105\] { aspect-ratio:292/105; }
.aspect-\[400\/236\] { aspect-ratio:400/236; }
.aspect-\[292\/186\] { aspect-ratio:292/186; }
.aspect-\[311\/256\] { aspect-ratio:311/256; }
.aspect-\[400\/375\] { aspect-ratio:400/375; }
.h-8 { height:2rem; }
.h-full { height:100%; }
.h-\[130px\] { height:130px; }
.h-6 { height:1.5rem; }
.h-7 { height:1.75rem; }
.h-5 { height:1.25rem; }
.\!h-fit { height:-webkit-fit-content !important; height:-moz-fit-content !important; height:fit-content !important; }
.\!h-6 { height:1.5rem !important; }
.\!h-full { height:100% !important; }
.\!h-12 { height:3rem !important; }
.\!h-\[38px\] { height:38px !important; }
.h-\[232px\] { height:232px; }
.h-\[152px\] { height:152px; }
.h-\[1px\] { height:1px; }
.h-14 { height:3.5rem; }
.h-3 { height:0.75rem; }
.h-\[56px\] { height:56px; }
.\!h-8 { height:2rem !important; }
.\!h-\[46px\] { height:46px !important; }
.h-\[32px\] { height:32px; }
.h-\[20px\] { height:20px; }
.h-\[34px\] { height:34px; }
.h-\[148px\] { height:148px; }
.h-\[84px\] { height:84px; }
.h-auto { height:auto; }
.h-\[64px\] { height:64px; }
.h-\[44px\] { height:44px; }
.h-\[46px\] { height:46px; }
.h-4 { height:1rem; }
.h-\[52px\] { height:52px; }
.h-fit { height:-webkit-fit-content; height:-moz-fit-content; height:fit-content; }
.h-9 { height:2.25rem; }
.h-2 { height:0.5rem; }
.h-\[40px\] { height:40px; }
.h-12 { height:3rem; }
.h-\[45px\] { height:45px; }
.h-\[6px\] { height:6px; }
.h-\[120px\] { height:120px; }
.h-\[96px\] { height:96px; }
.h-\[48px\] { height:48px; }
.h-\[14px\] { height:14px; }
.h-\[11px\] { height:11px; }
.h-10 { height:2.5rem; }
.h-\[42px\] { height:42px; }
.h-\[200px\] { height:200px; }
.h-\[100px\] { height:100px; }
.h-1 { height:0.25rem; }
.h-\[400px\] { height:400px; }
.max-h-\[356px\] { max-height:356px; }
.max-h-\[760px\] { max-height:760px; }
.max-h-\[706px\] { max-height:706px; }
.max-h-\[288px\] { max-height:288px; }
.max-h-\[256px\] { max-height:256px; }
.min-h-screen { min-height:100vh; }
.min-h-\[320px\] { min-height:320px; }
.min-h-\[116px\] { min-height:116px; }
.min-h-0 { min-height:0px; }
.min-h-full { min-height:100%; }
.w-full { width:100%; }
.w-5 { width:1.25rem; }
.w-8 { width:2rem; }
.w-fit { width:-webkit-fit-content; width:-moz-fit-content; width:fit-content; }
.w-\[130px\] { width:130px; }
.w-6 { width:1.5rem; }
.w-7 { width:1.75rem; }
.\!w-full { width:100% !important; }
.w-auto { width:auto; }
.\!w-fit { width:-webkit-fit-content !important; width:-moz-fit-content !important; width:fit-content !important; }
.\!w-6 { width:1.5rem !important; }
.\!w-12 { width:3rem !important; }
.w-11 { width:2.75rem; }
.w-\[80px\] { width:80px; }
.w-14 { width:3.5rem; }
.w-3 { width:0.75rem; }
.w-\[56px\] { width:56px; }
.\!w-8 { width:2rem !important; }
.w-0 { width:0px; }
.w-1\/2 { width:50%; }
.w-2\/3 { width:66.666667%; }
.w-\[2px\] { width:2px; }
.w-\[5px\] { width:5px; }
.w-\[1px\] { width:1px; }
.w-\[44px\] { width:44px; }
.w-\[202px\] { width:202px; }
.w-1\/3 { width:33.333333%; }
.w-4 { width:1rem; }
.w-\[52px\] { width:52px; }
.w-\[214px\] { width:214px; }
.w-11\/12 { width:91.666667%; }
.w-9 { width:2.25rem; }
.w-2 { width:0.5rem; }
.w-\[40px\] { width:40px; }
.w-\[220px\] { width:220px; }
.w-\[6px\] { width:6px; }
.w-\[120px\] { width:120px; }
.w-\[96px\] { width:96px; }
.w-\[48px\] { width:48px; }
.w-\[14px\] { width:14px; }
.w-\[10px\] { width:10px; }
.w-10 { width:2.5rem; }
.w-\[92px\] { width:92px; }
.w-12 { width:3rem; }
.w-\[42px\] { width:42px; }
.w-\[100px\] { width:100px; }
.w-1 { width:0.25rem; }
.\!min-w-\[32px\] { min-width:32px !important; }
.min-w-\[70px\] { min-width:70px; }
.min-w-\[108px\] { min-width:108px; }
.min-w-\[88px\] { min-width:88px; }
.max-w-\[33\.333333\%\] { max-width:33.333333%; }
.max-w-\[311px\] { max-width:311px; }
.max-w-none { max-width:none; }
.max-w-\[376px\] { max-width:376px; }
.max-w-\[36px\] { max-width:36px; }
.max-w-\[87px\] { max-width:87px; }
.max-w-\[732px\] { max-width:732px; }
.max-w-\[256px\] { max-width:256px; }
.max-w-\[1070px\] { max-width:1070px; }
.max-w-\[1080px\] { max-width:1080px; }
.max-w-full { max-width:100%; }
.max-w-\[250px\] { max-width:250px; }
.max-w-\[259px\] { max-width:259px; }
.flex-1 { -webkit-box-flex:1; -webkit-flex:1 1 0%; -ms-flex:1 1 0%; flex:1 1 0%; }
.flex-initial { -webkit-box-flex:0; -webkit-flex:0 1 auto; -ms-flex:0 1 auto; flex:0 1 auto; }
.flex-none { -webkit-box-flex:0; -webkit-flex:none; -ms-flex:none; flex:none; }
.flex-shrink-0 { -webkit-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; }
.shrink-0 { -webkit-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; }
.flex-grow { -webkit-box-flex:1; -webkit-flex-grow:1; -ms-flex-positive:1; flex-grow:1; }
.grow { -webkit-box-flex:1; -webkit-flex-grow:1; -ms-flex-positive:1; flex-grow:1; }
.basis-2\/3 { -webkit-flex-basis:66.666667%; -ms-flex-preferred-size:66.666667%; flex-basis:66.666667%; }
.basis-1\/3 { -webkit-flex-basis:33.333333%; -ms-flex-preferred-size:33.333333%; flex-basis:33.333333%; }
.translate-y-4 { --tw-translate-y:1rem; -webkit-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)); -ms-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)); 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)); }
.\!translate-x-0 { --tw-translate-x:0px !important; -webkit-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)) !important; -ms-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)) !important; 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)) !important; }
.-translate-y-full { --tw-translate-y:-100%; -webkit-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)); -ms-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)); 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)); }
.-translate-x-1\/2 { --tw-translate-x:-50%; -webkit-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)); -ms-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)); 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)); }
.translate-x-\[12\.5\%\] { --tw-translate-x:12.5%; -webkit-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)); -ms-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)); 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)); }
.translate-y-\[12\.5\%\] { --tw-translate-y:12.5%; -webkit-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)); -ms-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)); 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)); }
.translate-y-\[42px\] { --tw-translate-y:42px; -webkit-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)); -ms-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)); 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)); }
.translate-x-\[3px\] { --tw-translate-x:3px; -webkit-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)); -ms-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)); 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)); }
.translate-y-\[36px\] { --tw-translate-y:36px; -webkit-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)); -ms-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)); 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)); }
.translate-x-\[8px\] { --tw-translate-x:8px; -webkit-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)); -ms-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)); 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)); }
.-translate-y-4 { --tw-translate-y:-1rem; -webkit-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)); -ms-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)); 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)); }
.-translate-x-\[2px\] { --tw-translate-x:-2px; -webkit-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)); -ms-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)); 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)); }
.rotate-0 { --tw-rotate:0deg; -webkit-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)); -ms-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)); 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)); }
.transform { -webkit-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)); -ms-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)); 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)); }
.cursor-pointer { cursor:pointer; }
.resize { resize:both; }
.grid-cols-1 { grid-template-columns:repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns:repeat(2, minmax(0, 1fr)); }
.grid-cols-3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
.flex-row { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; }
.flex-col { -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; }
.flex-wrap { -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; }
.items-start { -webkit-box-align:start; -webkit-align-items:flex-start; -ms-flex-align:start; align-items:flex-start; }
.items-end { -webkit-box-align:end; -webkit-align-items:flex-end; -ms-flex-align:end; align-items:flex-end; }
.items-center { -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; }
.items-stretch { -webkit-box-align:stretch; -webkit-align-items:stretch; -ms-flex-align:stretch; align-items:stretch; }
.justify-start { -webkit-box-pack:start; -webkit-justify-content:flex-start; -ms-flex-pack:start; justify-content:flex-start; }
.justify-end { -webkit-box-pack:end; -webkit-justify-content:flex-end; -ms-flex-pack:end; justify-content:flex-end; }
.justify-center { -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
.justify-between { -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; }

.gap-14 { gap:3.5rem; }
.gap-6 { gap:1.5rem; }
.gap-2 { gap:0.5rem; }
.gap-8 { gap:2rem; }
.gap-4 { gap:1rem; }
.gap-3 { gap:0.75rem; }
.gap-\[10px\] { gap:10px; }
.gap-1 { gap:0.25rem; }
.gap-12 { gap:3rem; }
.gap-20 { gap:5rem; }
.gap-10 { gap:2.5rem; }
.gap-16 { gap:4rem; }
.gap-\[6px\] { gap:6px; }
.gap-9 { gap:2.25rem; }
.gap-5 { gap:1.25rem; }
.gap-\[1px\] { gap:1px; }
.gap-x-1 { -webkit-column-gap:0.25rem; -moz-column-gap:0.25rem; column-gap:0.25rem; }
.gap-y-1 { row-gap:0.25rem; }
.gap-x-5 { -webkit-column-gap:1.25rem; -moz-column-gap:1.25rem; column-gap:1.25rem; }
.gap-x-8 { -webkit-column-gap:2rem; -moz-column-gap:2rem; column-gap:2rem; }
.gap-y-8 { row-gap:2rem; }
.gap-y-\[2px\] { row-gap:2px; }
.gap-y-2 { row-gap:0.5rem; }
.gap-x-4 { -webkit-column-gap:1rem; -moz-column-gap:1rem; column-gap:1rem; }
.self-center { -webkit-align-self:center; -ms-flex-item-align:center; align-self:center; }
.self-stretch { -webkit-align-self:stretch; -ms-flex-item-align:stretch; align-self:stretch; }
.overflow-auto { overflow:auto; }
.overflow-hidden { overflow:hidden; }
.overflow-visible { overflow:visible; }
.overflow-x-auto { overflow-x:auto; }
.overflow-y-auto { overflow-y:auto; }
.overflow-x-hidden { overflow-x:hidden; }
.overflow-y-hidden { overflow-y:hidden; }
.scroll-smooth { scroll-behavior:smooth; }
.text-ellipsis { text-overflow:ellipsis; }
.whitespace-nowrap { white-space:nowrap; }
.whitespace-pre { white-space:pre; }
.break-words { overflow-wrap:break-word; }
.break-all { word-break:break-all; }
.rounded-full { border-radius:9999px; }
.\!rounded-none { border-radius:0px !important; }
.\!rounded-full { border-radius:9999px !important; }
.rounded-sm { border-radius:0.125rem; }
.rounded-\[70px\] { border-radius:70px; }
.border-2 { border-width:2px; }
.\!border-0 { border-width:0px !important; }
.\!border { border-width:1px !important; }
.border-0 { border-width:0px; }
.border { border-width:1px; }
.\!border-2 { border-width:2px !important; }
.border-\[3px\] { border-width:3px; }
.border-y { border-top-width:1px; border-bottom-width:1px; }
.border-x-0 { border-left-width:0px; border-right-width:0px; }
.border-x { border-left-width:1px; border-right-width:1px; }
.border-b { border-bottom-width:1px; }
.border-t { border-top-width:1px; }
.border-r { border-right-width:1px; }
.border-l { border-left-width:1px; }
.border-t-0 { border-top-width:0px; }
.border-solid { border-style:solid; }
.\!border-solid { border-style:solid !important; }
.border-dashed { border-style:dashed; }
.border-bg-1 { --tw-border-opacity:1; border-color:rgb(32 34 34 / var(--tw-border-opacity)); }
.border-neutral-80 { --tw-border-opacity:1; /*border-color:rgb(57 53 86 / var(--tw-border-opacity));*/ }
.border-neutral-60 { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); }
.\!border-neutral-80 { --tw-border-opacity:1 !important; border-color:rgb(57 53 86 / var(--tw-border-opacity)) !important; }
.border-white { --tw-border-opacity:1; border-color:rgb(255 255 255 / var(--tw-border-opacity)); }
.\!border-light-pink { --tw-border-opacity:1 !important; border-color:rgb(255 114 210 / var(--tw-border-opacity)) !important; }
.border-neutral-20 { --tw-border-opacity:1; border-color:rgb(206 204 214 / var(--tw-border-opacity)); }
.border-action { --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); }
.border-light-pink { --tw-border-opacity:1; border-color:rgb(255 114 210 / var(--tw-border-opacity)); }
.border-neutral-40 { --tw-border-opacity:1; border-color:rgb(156 153 174 / var(--tw-border-opacity)); }
.bg-bg-1 { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
.bg-primary { --tw-bg-opacity:1; background-color:rgb(1 141 240 / var(--tw-bg-opacity)); }
.bg-white { --tw-bg-opacity:1; background-color:rgb(255 255 255 / var(--tw-bg-opacity)); }
.bg-neutral-90 { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
.bg-transparent { background-color:transparent; }
.\!bg-transparent { background-color:transparent !important; }
.\!bg-dark-purple { --tw-bg-opacity:1 !important; background-color:rgb(45 20 70 / var(--tw-bg-opacity)) !important; }
.bg-dark-green { --tw-bg-opacity:1; background-color:rgb(6 68 98 / var(--tw-bg-opacity)); }
.bg-neutral-80 { --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.\!bg-neutral { --tw-bg-opacity:1 !important; background-color:rgb(32 34 34 / var(--tw-bg-opacity)) !important; }
.bg-\[rgba\(8\2c 1\2c 52\2c 0\.7\)\] { background-color:rgba(8,1,52,0.7); }
.bg-light-yellow { --tw-bg-opacity:1; background-color:rgb(255 209 102 / var(--tw-bg-opacity)); }
.bg-action { --tw-bg-opacity:1; background-color:rgb(1 197 186 / var(--tw-bg-opacity)); }
.bg-bg-2 { --tw-bg-opacity:1; background-color:rgb(11 6 45 / var(--tw-bg-opacity)); }
.bg-secondary { --tw-bg-opacity:1; background-color:rgb(1 197 186 / var(--tw-bg-opacity)); }
.bg-neutral-60 { --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
.bg-dark-yellow { --tw-bg-opacity:1; background-color:rgb(67 51 64 / var(--tw-bg-opacity)); }
.bg-dark-red { --tw-bg-opacity:1; background-color:rgb(87 24 72 / var(--tw-bg-opacity)); }
.bg-dark-pink { --tw-bg-opacity:1; background-color:rgb(86 24 87 / var(--tw-bg-opacity)); }
.bg-dark-purple { --tw-bg-opacity:1; background-color:rgb(45 20 70 / var(--tw-bg-opacity)); }
.bg-light-green { --tw-bg-opacity:1; background-color:rgb(39 209 170 / var(--tw-bg-opacity)); }
.bg-light-blue { --tw-bg-opacity:1; background-color:rgb(45 156 219 / var(--tw-bg-opacity)); }
.bg-light-purple { --tw-bg-opacity:1; background-color:rgb(195 121 246 / var(--tw-bg-opacity)); }
.bg-dark-blue { --tw-bg-opacity:1; background-color:rgb(33 24 87 / var(--tw-bg-opacity)); }
.bg-light-pink { --tw-bg-opacity:1; background-color:rgb(255 114 210 / var(--tw-bg-opacity)); }
.bg-neutral-40 { --tw-bg-opacity:1; background-color:rgb(156 153 174 / var(--tw-bg-opacity)); }
.bg-neutral { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
.bg-opacity-\[0\.16\] { --tw-bg-opacity:0.16; }
.bg-opacity-50 { --tw-bg-opacity:0.5; }
.bg-opacity-40 { --tw-bg-opacity:0.4; }
.bg-gradient-to-r { background-image:-webkit-linear-gradient(left, var(--tw-gradient-stops)); background-image:linear-gradient(to right, var(--tw-gradient-stops)); }
.bg-become-creator-card { background-image:url('../images/become-creator-card-bg.png'); }
.from-\[\#016DB0\] { --tw-gradient-from:#016DB0; --tw-gradient-to:rgb(1 109 176 / 0); --tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to); }
.to-\[\#01FFCA\] { --tw-gradient-to:#01FFCA; }
.bg-cover { background-size:cover; }
.bg-clip-text { -webkit-background-clip:text; background-clip:text; }
.bg-center { background-position:center; }
.bg-no-repeat { background-repeat:no-repeat; }
.object-contain { -o-object-fit:contain; object-fit:contain; }
.object-cover { -o-object-fit:cover; object-fit:cover; }
.object-center { -o-object-position:center; object-position:center; }
.p-1 { padding:0.25rem; }
.p-4 { padding:1rem; }
.\!p-0 { padding:0px !important; }
.p-0 { padding:0px; }
.p-6 { padding:1.5rem; }
.p-\[1px\] { padding:1px; }
.p-20 { padding:5rem; }
.\!p-\[2px\] { padding:2px !important; }
.p-3 { padding:0.75rem; }
.p-\[46px\] { padding:46px; }
.p-8 { padding:2rem; }
.p-12 { padding:3rem; }
.p-\[14px\] { padding:14px; }
.p-2 { padding:0.5rem; }
.py-20 { padding-top:5rem; padding-bottom:5rem; }
.py-2 { padding-top:0.5rem; padding-bottom:0.5rem; }
.py-8 { padding-top:2rem; padding-bottom:2rem; }
.px-3 { padding-left:0.75rem; padding-right:0.75rem; }
.py-6 { padding-top:1.5rem; padding-bottom:1.5rem; }
.px-4 { padding-left:1rem; padding-right:1rem; }
.\!px-3 { padding-left:0.75rem !important; padding-right:0.75rem !important; }
.px-1 { padding-left:0.25rem; padding-right:0.25rem; }
.py-\[2px\] { padding-top:2px; padding-bottom:2px; }
.py-11 { padding-top:2.75rem; padding-bottom:2.75rem; }
.\!py-\[2px\] { padding-top:2px !important; padding-bottom:2px !important; }
.\!px-2 { padding-left:0.5rem !important; padding-right:0.5rem !important; }
.\!px-4 { padding-left:1rem !important; padding-right:1rem !important; }
.\!py-2 { padding-top:0.5rem !important; padding-bottom:0.5rem !important; }
.px-8 { padding-left:2rem; padding-right:2rem; }
.\!px-\[10px\] { padding-left:10px !important; padding-right:10px !important; }
.px-\[6px\] { padding-left:6px; padding-right:6px; }
.px-5 { padding-left:1.25rem; padding-right:1.25rem; }
.px-7 { padding-left:1.75rem; padding-right:1.75rem; }
.py-10 { padding-top:2.5rem; padding-bottom:2.5rem; }
.py-16 { padding-top:4rem; padding-bottom:4rem; }
.px-2 { padding-left:0.5rem; padding-right:0.5rem; }
.px-6 { padding-left:1.5rem; padding-right:1.5rem; }
.py-1 { padding-top:0.25rem; padding-bottom:0.25rem; }
.py-4 { padding-top:1rem; padding-bottom:1rem; }
.px-\[10px\] { padding-left:10px; padding-right:10px; }
.px-10 { padding-left:2.5rem; padding-right:2.5rem; }
.py-9 { padding-top:2.25rem; padding-bottom:2.25rem; }
.px-14 { padding-left:3.5rem; padding-right:3.5rem; }
.py-12 { padding-top:3rem; padding-bottom:3rem; }
.pl-\[3\.125rem\] { padding-left:3.125rem; }
.pr-4 { padding-right:1rem; }
.pb-8 { padding-bottom:2rem; }
.pt-8 { padding-top:2rem; }
.pb-5 { padding-bottom:1.25rem; }
.pt-4 { padding-top:1rem; }
.pb-3 { padding-bottom:0.75rem; }
.pt-11 { padding-top:2.75rem; }
.pb-0 { padding-bottom:0px; }
.pb-11 { padding-bottom:2.75rem; }
.pb-6 { padding-bottom:1.5rem; }
.pr-0 { padding-right:0px; }
.pl-12 { padding-left:3rem; }
.pt-6 { padding-top:1.5rem; }
.pr-16 { padding-right:4rem; }
.pt-7 { padding-top:1.75rem; }
.pr-\[56px\] { padding-right:56px; }
.pb-12 { padding-bottom:3rem; }
.pt-2 { padding-top:0.5rem; }
.pb-4 { padding-bottom:1rem; }
.pb-2 { padding-bottom:0.5rem; }
.pr-1 { padding-right:0.25rem; }
.pr-6 { padding-right:1.5rem; }
.pl-2 { padding-left:0.5rem; }
.pr-8 { padding-right:2rem; }
.pl-8 { padding-left:2rem; }
.text-left { text-align:left; }
.text-center { text-align:center; }
.text-right { text-align:right; }
.text-end { text-align:end; }
.font-body { font-family:Epilogue, sans-serif; }
.text-\[80px\] { font-size:80px; }
.text-xl { font-size:1.25rem; line-height:1.6; }
.text-\[1\.5rem\] { font-size:1.5rem; }
.text-base { font-size:1rem; line-height:1.6; }
.text-sm { font-size:0.875rem; line-height:1.6; }
.text-lg { font-size:1.125rem; line-height:1.6; }
.text-xs { font-size:0.75rem; line-height:1.6; }
.text-2xl { font-size:1.5rem; line-height:1.6; }
.\!text-xl { font-size:1.25rem !important; line-height:1.6 !important; }
.text-\[1\.75rem\] { font-size:1.75rem; }
.text-\[18px\] { font-size:18px; }
.\!text-\[1\.375rem\] { font-size:1.375rem !important; }
.\!text-sm { font-size:0.875rem !important; line-height:1.6 !important; }
.\!text-\[1\.75rem\] { font-size:1.75rem !important; }
.\!text-\[2\.25rem\] { font-size:2.25rem !important; }
.text-\[11px\] { font-size:11px; }
.\!text-\[1\.25rem\] { font-size:1.25rem !important; }
.\!text-2xl { font-size:1.5rem !important; line-height:1.6 !important; }
.font-normal { font-weight:400; }
.font-medium { font-weight:500; }
.\!font-normal { font-weight:400 !important; }
.font-semibold { font-weight:600; }
.font-bold { font-weight:700; }
.\!font-medium { font-weight:500 !important; }
.\!font-bold { font-weight:700 !important; }
.uppercase { text-transform:uppercase; }
.capitalize { text-transform:capitalize; }
.italic { font-style:italic; }
.ordinal { --tw-ordinal:ordinal; font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction); }
.leading-tight { line-height:1.2; }
.leading-normal { line-height:1.6; }
.leading-\[120\%\] { line-height:120%; }
.tracking-wide { letter-spacing:.03em; }
.tracking-\[0\.03em\] { letter-spacing:0.03em; }
.text-white { --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.text-secondary { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
.text-neutral-40 { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.text-neutral-20 { --tw-text-opacity:1; color:rgb(206 204 214 / var(--tw-text-opacity)); }
.text-transparent { color:transparent; }
.text-neutral-10 { --tw-text-opacity:1; color:rgb(230 230 235 / var(--tw-text-opacity)); }
.\!text-light-purple { --tw-text-opacity:1 !important; color:rgb(195 121 246 / var(--tw-text-opacity)) !important; }
.\!text-light-pink { --tw-text-opacity:1 !important; color:rgb(255 114 210 / var(--tw-text-opacity)) !important; }
.text-light-green { --tw-text-opacity:1; color:rgb(39 209 170 / var(--tw-text-opacity)); }
.text-danger { --tw-text-opacity:1; color:rgb(239 70 111 / var(--tw-text-opacity)); }
.text-light-pink { --tw-text-opacity:1; color:rgb(255 114 210 / var(--tw-text-opacity)); }
.text-primary { --tw-text-opacity:1; color:rgb(1 141 240 / var(--tw-text-opacity)); }
.text-neutral { --tw-text-opacity:1; color:rgb(32 34 34 / var(--tw-text-opacity)); }
.text-action { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
.text-light-yellow { --tw-text-opacity:1; color:rgb(255 209 102 / var(--tw-text-opacity)); }
.text-light-purple { --tw-text-opacity:1; color:rgb(195 121 246 / var(--tw-text-opacity)); }
.text-light-blue { --tw-text-opacity:1; color:rgb(45 156 219 / var(--tw-text-opacity)); }
.text-neutral-60 { --tw-text-opacity:1; color:rgb(107 103 133 / var(--tw-text-opacity)); }
.text-warning { --tw-text-opacity:1; color:rgb(250 230 55 / var(--tw-text-opacity)); }
.\!text-danger { --tw-text-opacity:1 !important; color:rgb(239 70 111 / var(--tw-text-opacity)) !important; }
.\!text-neutral-40 { --tw-text-opacity:1 !important; color:rgb(156 153 174 / var(--tw-text-opacity)) !important; }
.text-current { color:currentColor; }
.underline { -webkit-text-decoration-line:underline; text-decoration-line:underline; }
.no-underline { -webkit-text-decoration-line:none; text-decoration-line:none; }
.\!opacity-100 { opacity:1 !important; }
.opacity-80 { opacity:0.8; }
.opacity-0 { opacity:0; }
.opacity-100 { opacity:1; }
.opacity-70 { opacity:0.7; }
.\!shadow-none { --tw-shadow:0 0 #0000 !important; --tw-shadow-colored:0 0 #0000 !important; box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important; }
.\!outline-none { outline:2px solid transparent !important; outline-offset:2px !important; }
.blur-\[2px\] { --tw-blur:blur(2px); -webkit-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter: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); }
.blur { --tw-blur:blur(8px); -webkit-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); }
.filter { -webkit-filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter: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); }
.transition { -webkit-transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter; transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter; transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-transform, -webkit-filter, -webkit-backdrop-filter; -webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1); -webkit-transition-duration:150ms; transition-duration:150ms; }


/**
* Display
*/
.display-1 { font-family:Epilogue, sans-serif; font-size:2rem; font-weight:700; line-height:1.2; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.display-2 { font-family:Epilogue, sans-serif; font-size:1.5rem; font-weight:700; line-height:1.2; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.display-3 { font-family:Epilogue, sans-serif; font-size:1.25rem; font-weight:700; line-height:1.2; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.display-4 { font-family:Epilogue, sans-serif; font-size:1rem; font-weight:500; line-height:1.2; letter-spacing:.03em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.display-5 { font-family:Epilogue, sans-serif; font-size:10px; font-weight:400; line-height:1.2; letter-spacing:.03em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
@media (min-width:992px) {
	.display-1 { font-size:3rem; }
	.display-2 { font-size:2rem; }
	.display-3 { font-size:1.5rem; }
	.display-4 { font-size:1.25rem; }
	.display-5 { font-size:11px; }
}


/**
* Buttons
*/
[type=button] { -webkit-appearance:none; -moz-appearance:none; appearance:none; }
.btn { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; cursor:pointer; -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; gap:0.5rem; border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(1 197 186 / var(--tw-bg-opacity)); padding-top:0.5rem; padding-bottom:0.5rem; padding-left:2rem; padding-right:2rem; text-align:center; font-family:Epilogue, sans-serif; font-size:1rem; font-weight:600; line-height:1.6; --tw-text-opacity:1; color:rgb(32 34 34 / var(--tw-text-opacity)); }
.btn:hover { --tw-border-opacity:1; border-color:rgb(28 170 162 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(28 170 162 / var(--tw-bg-opacity)); }
.btn:active { --tw-border-opacity:1; border-color:rgb(57 141 136 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 141 136 / var(--tw-bg-opacity)); }
.btn:disabled { cursor:not-allowed; --tw-border-opacity:1; border-color:rgb(0 63 59 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(0 63 59 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(107 103 133 / var(--tw-text-opacity)); }
.btn.btn-white { border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(255 255 255 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(255 255 255 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(32 34 34 / var(--tw-text-opacity)); }
.btn.btn-white:hover { --tw-border-opacity:1; border-color:rgb(230 230 235 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(230 230 235 / var(--tw-bg-opacity)); }
.btn.btn-white:active { --tw-border-opacity:1; border-color:rgb(206 204 214 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(206 204 214 / var(--tw-bg-opacity)); }
.btn.btn-white:disabled { --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(107 103 133 / var(--tw-text-opacity)); }
.btn > img, .btn > svg { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; height:1.25rem; width:1.25rem; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
.btn > img { -o-object-fit:contain; object-fit:contain; -o-object-position:center; object-position:center; }
.btn > svg [fill] { fill:currentColor; }
.btn > svg [stroke] { stroke:currentColor; }
.btn.btn-icon { height:42px; width:42px; padding:0px; }
.btn.btn-sm { font-size:0.875rem; line-height:1.6; }
.btn.btn-sm > img, .btn.btn-sm > svg { height:1rem; width:1rem; }
.btn.btn-sm.btn-icon { height:38px; width:38px; }
.btn.btn-lg { font-size:1.125rem; line-height:1.6; }
.btn.btn-lg > img, .btn.btn-lg > svg { height:1.5rem; width:1.5rem; }
.btn.btn-lg.btn-icon { height:46px; width:46px; }
.btn.btn-outline { border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); background-color:transparent; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.btn.btn-outline:hover { --tw-border-opacity:1; border-color:rgb(28 170 162 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.btn.btn-outline:active { --tw-border-opacity:1; border-color:rgb(57 141 136 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
.btn.btn-outline:disabled { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.btn.btn-outline-neutral-40 { border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(156 153 174 / var(--tw-border-opacity)); background-color:transparent; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.btn.btn-outline-neutral-40:hover { --tw-border-opacity:1; border-color:rgb(206 204 214 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.btn.btn-outline-neutral-40:active { --tw-border-opacity:1; border-color:rgb(230 230 235 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
.btn.btn-outline-neutral-40:disabled { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.btn.btn-outline-neutral-80 { border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); background-color:transparent; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.btn.btn-outline-neutral-80:hover { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.btn.btn-outline-neutral-80:active { --tw-border-opacity:1; border-color:rgb(156 153 174 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
.btn.btn-outline-neutral-80:disabled { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }

/**
* Labels
*/
.label { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; gap:0.25rem; padding-top:2px; padding-bottom:2px; padding-left:0.5rem; padding-right:0.5rem; text-align:center; font-family:Epilogue, sans-serif; font-size:0.875rem; font-weight:500; line-height:1.6; }
.\!label { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; gap:0.25rem; padding-top:2px; padding-bottom:2px; padding-left:0.5rem; padding-right:0.5rem; text-align:center; font-family:Epilogue, sans-serif; font-size:0.875rem; font-weight:500; line-height:1.6; }
.label > img, .label > svg { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; height:1rem; width:1rem; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
.\!label > img, .\!label > svg { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; height:1rem; width:1rem; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
.label > img { -o-object-fit:contain; object-fit:contain; -o-object-position:center; object-position:center; }
.\!label > img { -o-object-fit:contain; object-fit:contain; -o-object-position:center; object-position:center; }
.label > svg [fill] { fill:currentColor; }
.\!label > svg [fill] { fill:currentColor; }
.label > svg [stroke] { stroke:currentColor; }
.\!label > svg [stroke] { stroke:currentColor; }
.label.label-circle { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; height:26px; width:26px; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; border-radius:9999px; padding:0px; }
.\!label.label-circle { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; height:26px; width:26px; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; border-radius:9999px; padding:0px; }
.label.label-circle > img, .label.label-circle > svg { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; height:1rem; width:1rem; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
.\!label.label-circle > img, .\!label.label-circle > svg { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; height:1rem; width:1rem; -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
.label.label-circle.label-lg { height:40px; width:40px; }
.\!label.label-circle.label-lg { height:40px; width:40px; }
.label.label-circle.label-lg > img, .label.label-circle.label-lg > svg { height:1.5rem; width:1.5rem; }
.\!label.label-circle.label-lg > img, .\!label.label-circle.label-lg > svg { height:1.5rem; width:1.5rem; }

/**
* Ellipsis Text
*/
.ellipsis-1 { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ellipsis-2 { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }

/**
* Triangle Clip Path
*/

/**
* Invisible Scrollbar
*/
.invisible-scrollbar { -ms-overflow-style:none; scrollbar-width:none; }
.invisible-scrollbar::-webkit-scrollbar { display:none; }
/**
* Analytics Map - Dashboard
*/
.analytics-map path[data-country] { cursor:pointer; }
/**
* Code Block
*/
.codeblock { border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(11 6 45 / var(--tw-bg-opacity)); padding-left:1.5rem; padding-right:1.5rem; padding-top:1rem; padding-bottom:1rem; }



/**
* Dropdown Menu
*/
.js-dropdown-menu { --tw-shadow:0px 16px 64px 0px rgba(18, 27, 40, 0.8); --tw-shadow-colored:0px 16px 64px 0px var(--tw-shadow-color); box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); }


/**
 * Base Layer
 *
 * The base layer is for things like reset rules or default styles applied to 
 * plain HTML elements.
 */
/**
 * Components Layer
 *
 * The components layer is for class-based styles that you want to be able to 
 * override with utilities.
 */
/**
 * Utilities Layer
 *
 * The utilities layer is for small, single-purpose classes that should always 
 * take precedence over any other styles.
 */
.placeholder\:text-neutral-40::-webkit-input-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.placeholder\:text-neutral-40::-moz-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.placeholder\:text-neutral-40:-ms-input-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.placeholder\:text-neutral-40::-ms-input-placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.placeholder\:text-neutral-40::placeholder { --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
.before\:absolute::before { content:var(--tw-content); position:absolute; }
.before\:-top-2::before { content:var(--tw-content); top:-0.5rem; }
.before\:left-1\/2::before { content:var(--tw-content); left:50%; }
.before\:left-0::before { content:var(--tw-content); left:0px; }
.before\:right-0::before { content:var(--tw-content); right:0px; }
.before\:bottom-0::before { content:var(--tw-content); bottom:0px; }
.before\:-bottom-1::before { content:var(--tw-content); bottom:-0.25rem; }
.before\:right-\[128px\]::before { content:var(--tw-content); right:128px; }
.before\:right-\[81px\]::before { content:var(--tw-content); right:81px; }
.before\:right-\[72px\]::before { content:var(--tw-content); right:72px; }
.before\:-bottom-2::before { content:var(--tw-content); bottom:-0.5rem; }
.before\:-z-\[1\]::before { content:var(--tw-content); z-index:-1; }
.before\:h-4::before { content:var(--tw-content); height:1rem; }
.before\:h-\[1px\]::before { content:var(--tw-content); height:1px; }
.before\:h-\[5px\]::before { content:var(--tw-content); height:5px; }
.before\:w-8::before { content:var(--tw-content); width:2rem; }
.before\:w-full::before { content:var(--tw-content); width:100%; }
.before\:w-2::before { content:var(--tw-content); width:0.5rem; }
.before\:-translate-x-1\/2::before { content:var(--tw-content); --tw-translate-x:-50%; -webkit-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)); -ms-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)); 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)); }
.before\:translate-x-1\/2::before { content:var(--tw-content); --tw-translate-x:50%; -webkit-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)); -ms-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)); 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)); }
.before\:rotate-180::before { content:var(--tw-content); --tw-rotate:180deg; -webkit-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)); -ms-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)); 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)); }
.before\:bg-neutral-90::before { content:var(--tw-content); --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
.before\:bg-neutral-80::before { content:var(--tw-content); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.before\:bg-white::before { content:var(--tw-content); --tw-bg-opacity:1; background-color:rgb(255 255 255 / var(--tw-bg-opacity)); }
.before\:content-none::before { --tw-content:none; content:var(--tw-content); }
/* .before\:content-\[\'\'\]::before { --tw-content:''; content:var(--tw-content); } */
.before\:clip-path-triangle::before { content:var(--tw-content); -webkit-clip-path:polygon(0 100%, 50% 0, 100% 100%); clip-path:polygon(0 100%, 50% 0, 100% 100%); }

.after\:absolute::after { content:var(--tw-content); position:absolute; }
.after\:bottom-0::after { content:var(--tw-content); bottom:0px; }
.after\:left-0::after { content:var(--tw-content); left:0px; }
.after\:right-0::after { content:var(--tw-content); right:0px; }
.after\:top-0::after { content:var(--tw-content); top:0px; }
.after\:left-\[16px\]::after { content:var(--tw-content); left:16px; }
.after\:-z-\[1\]::after { content:var(--tw-content); z-index:-1; }
.after\:h-\[1px\]::after { content:var(--tw-content); height:1px; }
.after\:h-full::after { content:var(--tw-content); height:100%; }
.after\:w-\[1px\]::after { content:var(--tw-content); width:1px; }
.after\:bg-neutral-80::after { content:var(--tw-content); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
/* .after\:content-\[\'\'\]::after { --tw-content:''; content:var(--tw-content); } */
.first\:ml-0:first-child { margin-left:0px; }
.first\:ml-auto:first-child { margin-left:auto; }
.first\:pl-8:first-child { padding-left:2rem; }
.first\:pt-0:first-child { padding-top:0px; }
.last\:mr-auto:last-child { margin-right:auto; }
.last\:mb-0:last-child { margin-bottom:0px; }
.last\:border-b-0:last-child { border-bottom-width:0px; }
.last\:pr-8:last-child { padding-right:2rem; }
.last\:pb-0:last-child { padding-bottom:0px; }
.odd\:bg-dark-purple:nth-child(odd) { --tw-bg-opacity:1; background-color:rgb(45 20 70 / var(--tw-bg-opacity)); }
.hover\:border-action-hover:hover { --tw-border-opacity:1; border-color:rgb(28 170 162 / var(--tw-border-opacity)); }
.hover\:border-secondary:hover { --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); }
.hover\:bg-neutral-80:hover { --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.hover\:\!bg-light-purple:hover { --tw-bg-opacity:1 !important; background-color:rgb(195 121 246 / var(--tw-bg-opacity)) !important; }
.hover\:\!bg-neutral-80:hover { --tw-bg-opacity:1 !important; background-color:rgb(57 53 86 / var(--tw-bg-opacity)) !important; }
.hover\:bg-action-hover:hover { --tw-bg-opacity:1; background-color:rgb(28 170 162 / var(--tw-bg-opacity)); }
.hover\:bg-dark-green:hover { --tw-bg-opacity:1; background-color:rgb(6 68 98 / var(--tw-bg-opacity)); }
.hover\:bg-light-pink:hover { --tw-bg-opacity:1; background-color:rgb(255 114 210 / var(--tw-bg-opacity)); }
.hover\:text-secondary:hover { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
.hover\:\!text-white:hover { --tw-text-opacity:1 !important; color:rgb(255 255 255 / var(--tw-text-opacity)) !important; }
.focus\:\!bg-neutral-80:focus { --tw-bg-opacity:1 !important; background-color:rgb(57 53 86 / var(--tw-bg-opacity)) !important; }
.active\:border-action-pressed:active { --tw-border-opacity:1; border-color:rgb(57 141 136 / var(--tw-border-opacity)); }
.active\:\!bg-light-purple:active { --tw-bg-opacity:1 !important; background-color:rgb(195 121 246 / var(--tw-bg-opacity)) !important; }
.active\:bg-action-pressed:active { --tw-bg-opacity:1; background-color:rgb(57 141 136 / var(--tw-bg-opacity)); }
.active\:bg-neutral-60:active { --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
.active\:\!text-white:active { --tw-text-opacity:1 !important; color:rgb(255 255 255 / var(--tw-text-opacity)) !important; }
.group:last-child .group-last\:hidden { display:none; }
.group:last-child .group-last\:cursor-default { cursor:default; }
.group:last-child .group-last\:text-white { --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
.group:last-child .group-last\:\!text-white { --tw-text-opacity:1 !important; color:rgb(255 255 255 / var(--tw-text-opacity)) !important; }
.group:hover .group-hover\:block { display:block; }
.group:hover .group-hover\:hidden { display:none; }
.group:hover .group-hover\:text-secondary { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
.group:hover .group-hover\:text-neutral-10 { --tw-text-opacity:1; color:rgb(230 230 235 / var(--tw-text-opacity)); }
.peer\/price:checked ~ .peer-checked\/price\:border-secondary { --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); }
.peer\/bid:checked ~ .peer-checked\/bid\:border-secondary { --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); }
.peer\/bundle:checked ~ .peer-checked\/bundle\:border-secondary { --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); }

@media (min-width:576px) {
	.sm\:absolute { position:absolute; }
	.sm\:relative { position:relative; }
	.sm\:top-4 { top:1rem; }
	.sm\:left-10 { left:2.5rem; }
	.sm\:top-1\/4 { top:25%; }
	.sm\:-left-\[8px\] { left:-8px; }
	.sm\:-right-\[8px\] { right:-8px; }
	.sm\:top-1\/2 { top:50%; }
	.sm\:-bottom-8 { bottom:-2rem; }
	.sm\:right-0 { right:0px; }
	.sm\:top-\[40px\] { top:40px; }
	.sm\:-left-\[16px\] { left:-16px; }
	.sm\:top-\[64px\] { top:64px; }
	.sm\:left-\[24px\] { left:24px; }
	.sm\:top-\[48px\] { top:48px; }
	.sm\:top-full { top:100%; }
	.sm\:left-auto { left:auto; }
	.sm\:-right-\[112px\] { right:-112px; }
	.sm\:-right-8 { right:-2rem; }
	.sm\:right-4 { right:1rem; }
	.sm\:order-1 { -webkit-box-ordinal-group:2; -webkit-order:1; -ms-flex-order:1; order:1; }
	.sm\:order-2 { -webkit-box-ordinal-group:3; -webkit-order:2; -ms-flex-order:2; order:2; }
	.sm\:mx-0 { margin-left:0px; margin-right:0px; }
	.sm\:-mx-3 { margin-left:-0.75rem; margin-right:-0.75rem; }
	.sm\:mt-8 { margin-top:2rem; }
	.sm\:mb-0 { margin-bottom:0px; }
	.sm\:mb-4 { margin-bottom:1rem; }
	.sm\:block { display:block; }
	.sm\:flex { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; }
	.sm\:\!flex { display:-webkit-box !important; display:-webkit-flex !important; display:-ms-flexbox !important; display:flex !important; }
	.sm\:grid { display:grid; }
	.sm\:hidden { display:none; }
	.sm\:h-auto { height:auto; }
	.sm\:w-6 { width:1.5rem; }
	.sm\:w-12 { width:3rem; }
	.sm\:w-auto { width:auto; }
	.sm\:w-1\/2 { width:50%; }
	.sm\:w-3\/5 { width:60%; }
	.sm\:w-\[304px\] { width:304px; }
	.sm\:w-\[256px\] { width:256px; }
	.sm\:w-full { width:100%; }
	.sm\:min-w-\[220px\] { min-width:220px; }
	.sm\:max-w-\[140px\] { max-width:140px; }
	.sm\:max-w-\[576px\] { max-width:576px; }
	.sm\:flex-none { -webkit-box-flex:0; -webkit-flex:none; -ms-flex:none; flex:none; }
	.sm\:flex-1 { -webkit-box-flex:1; -webkit-flex:1 1 0%; -ms-flex:1 1 0%; flex:1 1 0%; }
	.sm\:grow { -webkit-box-flex:1; -webkit-flex-grow:1; -ms-flex-positive:1; flex-grow:1; }
	.sm\:-translate-y-1\/2 { --tw-translate-y:-50%; -webkit-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)); -ms-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)); 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)); }
	.sm\:translate-y-full { --tw-translate-y:100%; -webkit-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)); -ms-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)); 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)); }
	.sm\:translate-y-\[36px\] { --tw-translate-y:36px; -webkit-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)); -ms-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)); 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)); }
	.sm\:grid-cols-2 { grid-template-columns:repeat(2, minmax(0, 1fr)); }
	.sm\:flex-row { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; }
	.sm\:flex-col { -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; }
	.sm\:flex-wrap { -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; }
	.sm\:flex-nowrap { -webkit-flex-wrap:nowrap; -ms-flex-wrap:nowrap; flex-wrap:nowrap; }
	.sm\:items-start { -webkit-box-align:start; -webkit-align-items:flex-start; -ms-flex-align:start; align-items:flex-start; }
	.sm\:items-end { -webkit-box-align:end; -webkit-align-items:flex-end; -ms-flex-align:end; align-items:flex-end; }
	.sm\:items-center { -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; }
	.sm\:justify-between { -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; }
	.sm\:gap-6 { gap:1.5rem; }
	.sm\:gap-2 { gap:0.5rem; }
	.sm\:gap-8 { gap:2rem; }
	.sm\:gap-4 { gap:1rem; }
	.sm\:gap-0 { gap:0px; }
	.sm\:gap-x-8 { -webkit-column-gap:2rem; -moz-column-gap:2rem; column-gap:2rem; }
	.sm\:gap-y-6 { row-gap:1.5rem; }
	.sm\:gap-x-6 { -webkit-column-gap:1.5rem; -moz-column-gap:1.5rem; column-gap:1.5rem; }
	.sm\:self-center { -webkit-align-self:center; -ms-flex-item-align:center; align-self:center; }
	.sm\:self-stretch { -webkit-align-self:stretch; -ms-flex-item-align:stretch; align-self:stretch; }
	.sm\:overflow-hidden { overflow:hidden; }
	.sm\:overflow-visible { overflow:visible; }
	.sm\:border { border-width:1px; }
	.sm\:border-0 { border-width:0px; }
	.sm\:border-b-0 { border-bottom-width:0px; }
	.sm\:border-t { border-top-width:1px; }
	.sm\:border-b { border-bottom-width:1px; }
	.sm\:border-t-0 { border-top-width:0px; }
	.sm\:p-6 { padding:1.5rem; }
	.sm\:p-10 { padding:2.5rem; }
	.sm\:py-32 { padding-top:8rem; padding-bottom:8rem; }
	.sm\:px-\[26px\] { padding-left:26px; padding-right:26px; }
	.sm\:\!px-4 { padding-left:1rem !important; padding-right:1rem !important; }
	.sm\:\!py-2 { padding-top:0.5rem !important; padding-bottom:0.5rem !important; }
	.sm\:py-8 { padding-top:2rem; padding-bottom:2rem; }
	.sm\:px-0 { padding-left:0px; padding-right:0px; }
	.sm\:\!px-8 { padding-left:2rem !important; padding-right:2rem !important; }
	.sm\:px-7 { padding-left:1.75rem; padding-right:1.75rem; }
	.sm\:px-2 { padding-left:0.5rem; padding-right:0.5rem; }
	.sm\:py-0 { padding-top:0px; padding-bottom:0px; }
	.sm\:px-6 { padding-left:1.5rem; padding-right:1.5rem; }
	.sm\:py-6 { padding-top:1.5rem; padding-bottom:1.5rem; }
	.sm\:px-10 { padding-left:2.5rem; padding-right:2.5rem; }
	.sm\:px-8 { padding-left:2rem; padding-right:2rem; }
	.sm\:py-20 { padding-top:5rem; padding-bottom:5rem; }
	.sm\:pt-8 { padding-top:2rem; }
	.sm\:pb-8 { padding-bottom:2rem; }
	.sm\:pt-7 { padding-top:1.75rem; }
	.sm\:pt-0 { padding-top:0px; }
	.sm\:pr-8 { padding-right:2rem; }
	.sm\:pb-0 { padding-bottom:0px; }
	.sm\:pb-4 { padding-bottom:1rem; }
	.sm\:text-left { text-align:left; }
	.sm\:text-center { text-align:center; }
	.sm\:text-8xl { font-size:6rem; line-height:1.6; }
	.sm\:text-\[2rem\] { font-size:2rem; }
	.sm\:text-base { font-size:1rem; line-height:1.6; }
	.sm\:font-bold { font-weight:700; }
	.sm\:text-neutral-20 { --tw-text-opacity:1; color:rgb(206 204 214 / var(--tw-text-opacity)); }
	.sm\:display-3 { font-family:Epilogue, sans-serif; font-size:1.25rem; font-weight:700; line-height:1.2; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
	@media (min-width:992px) { .sm\:display-3 { font-size:1.5rem; } }
	.sm\:btn-outline.btn { border-width:1px; border-style:solid; --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); background-color:transparent; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
	.sm\:btn-outline.btn:hover { --tw-border-opacity:1; border-color:rgb(28 170 162 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
	.sm\:btn-outline.btn:active { --tw-border-opacity:1; border-color:rgb(57 141 136 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
	.sm\:btn-outline.btn:disabled { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); --tw-text-opacity:1; color:rgb(156 153 174 / var(--tw-text-opacity)); }
	.sm\:before\:right-\[128px\]::before { content:var(--tw-content); right:128px; }
	.sm\:before\:right-12::before { content:var(--tw-content); right:3rem; }
	/* .before\:sm\:content-\[\'\'\]::before { --tw-content:''; content:var(--tw-content); } */
	/* .sm\:after\:content-\[\'\'\]::after { --tw-content:''; content:var(--tw-content); } */
	.sm\:after\:content-none::after { --tw-content:none; content:var(--tw-content); }
	.sm\:first\:pl-3:first-child { padding-left:0.75rem; }
	.sm\:last\:pr-3:last-child { padding-right:0.75rem; }
}

@media (min-width:768px) {
	.md\:top-20 { top:5rem; }
	.md\:top-auto { top:auto; }
	.md\:-bottom-8 { bottom:-2rem; }
	.md\:left-\[24px\] { left:24px; }
	.md\:top-\[108px\] { top:108px; }
	.md\:left-\[64px\] { left:64px; }
	.md\:bottom-auto { bottom:auto; }
	.md\:top-0 { top:0px; }
	.md\:-right-\[24px\] { right:-24px; }
	.md\:top-\[56px\] { top:56px; }
	.md\:top-28 { top:7rem; }
	.md\:left-0 { left:0px; }
	.md\:right-\[102px\] { right:102px; }
	.md\:top-1 { top:0.25rem; }
	.md\:order-first { -webkit-box-ordinal-group:-9998; -webkit-order:-9999; -ms-flex-order:-9999; order:-9999; }
	.md\:col-span-1 { grid-column:span 1 / span 1; }
	.md\:-mx-5 { margin-left:-1.25rem; margin-right:-1.25rem; }
	.md\:mt-10 { margin-top:2.5rem; }
	.md\:mb-2 { margin-bottom:0.5rem; }
	.md\:mb-0 { margin-bottom:0px; }
	.md\:mb-\[2px\] { margin-bottom:2px; }
	.md\:mr-3 { margin-right:0.75rem; }
	.md\:mr-\[10px\] { margin-right:10px; }
	.md\:mb-8 { margin-bottom:2rem; }
	.md\:mt-8 { margin-top:2rem; }
	.md\:block { display:block; }
	.md\:flex { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; }
	.md\:hidden { display:none; }
	.md\:aspect-\[292\/186\] { aspect-ratio:292/186; }
	.md\:aspect-\[1\/1\] { aspect-ratio:1/1; }
	.md\:aspect-\[3\/2\] { aspect-ratio:3/2; }
	.md\:h-\[28px\] { height:28px; }
	.md\:h-14 { height:3.5rem; }
	.md\:h-20 { height:5rem; }
	.md\:h-8 { height:2rem; }
	.md\:h-auto { height:auto; }
	.md\:w-8 { width:2rem; }
	.md\:w-16 { width:4rem; }
	.md\:\!w-auto { width:auto !important; }
	.md\:w-1\/3 { width:33.333333%; }
	.md\:w-1\/2 { width:50%; }
	.md\:w-2\/5 { width:40%; }
	.md\:w-7\/12 { width:58.333333%; }
	.md\:w-\[124px\] { width:124px; }
	.md\:w-14 { width:3.5rem; }
	.md\:w-\[116px\] { width:116px; }
	.md\:w-full { width:100%; }
	.md\:w-20 { width:5rem; }
	.md\:\!min-w-\[88px\] { min-width:88px !important; }
	.md\:max-w-\[132px\] { max-width:132px; }
	.md\:max-w-\[755px\] { max-width:755px; }
	.md\:max-w-\[741px\] { max-width:741px; }
	.md\:flex-1 { -webkit-box-flex:1; -webkit-flex:1 1 0%; -ms-flex:1 1 0%; flex:1 1 0%; }
	.md\:flex-none { -webkit-box-flex:0; -webkit-flex:none; -ms-flex:none; flex:none; }
	.md\:flex-shrink-0 { -webkit-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; }
	.md\:grow { -webkit-box-flex:1; -webkit-flex-grow:1; -ms-flex-positive:1; flex-grow:1; }
	.md\:translate-x-\[10px\] { --tw-translate-x:10px; -webkit-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)); -ms-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)); 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)); }
	.md\:grid-cols-3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
	.md\:grid-cols-4 { grid-template-columns:repeat(4, minmax(0, 1fr)); }
	.md\:grid-cols-1 { grid-template-columns:repeat(1, minmax(0, 1fr)); }
	.md\:flex-row { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; }
	.md\:flex-col { -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; }
	.md\:flex-nowrap { -webkit-flex-wrap:nowrap; -ms-flex-wrap:nowrap; flex-wrap:nowrap; }
	.md\:items-start { -webkit-box-align:start; -webkit-align-items:flex-start; -ms-flex-align:start; align-items:flex-start; }
	.md\:items-center { -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; }
	.md\:justify-between { -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; }
	.md\:gap-3 { gap:0.75rem; }
	.md\:gap-0 { gap:0px; }
	.md\:gap-2 { gap:0.5rem; }
	.md\:gap-6 { gap:1.5rem; }
	.md\:gap-20 { gap:5rem; }
	.md\:overflow-hidden { overflow:hidden; }
	.md\:border { border-width:1px; }
	.md\:border-t { border-top-width:1px; }
	.md\:border-t-0 { border-top-width:0px; }
	.md\:border-l { border-left-width:1px; }
	.md\:border-solid { border-style:solid; }
	.md\:border-primary { --tw-border-opacity:1; border-color:rgb(1 141 240 / var(--tw-border-opacity)); }
	.md\:bg-bg-2 { --tw-bg-opacity:1; background-color:rgb(11 6 45 / var(--tw-bg-opacity)); }
	.md\:bg-bg-1 { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
	.md\:p-6 { padding:1.5rem; }
	.md\:p-0 { padding:0px; }
	.md\:py-40 { padding-top:10rem; padding-bottom:10rem; }
	.md\:px-12 { padding-left:3rem; padding-right:3rem; }
	.md\:py-16 { padding-top:4rem; padding-bottom:4rem; }
	.md\:px-5 { padding-left:1.25rem; padding-right:1.25rem; }
	.md\:py-12 { padding-top:3rem; padding-bottom:3rem; }
	.md\:py-11 { padding-top:2.75rem; padding-bottom:2.75rem; }
	.md\:px-8 { padding-left:2rem; padding-right:2rem; }
	.md\:py-8 { padding-top:2rem; padding-bottom:2rem; }
	.md\:pl-10 { padding-left:2.5rem; }
	.md\:pt-0 { padding-top:0px; }
	.md\:pt-8 { padding-top:2rem; }
	.md\:pb-8 { padding-bottom:2rem; }
	.md\:pl-11 { padding-left:2.75rem; }
	.md\:pt-16 { padding-top:4rem; }
	.md\:pb-16 { padding-bottom:4rem; }
	.md\:pb-0 { padding-bottom:0px; }
	.md\:pr-0 { padding-right:0px; }
	.md\:pb-\[7px\] { padding-bottom:7px; }
	.md\:pb-7 { padding-bottom:1.75rem; }
	.md\:pr-8 { padding-right:2rem; }
	.md\:pl-8 { padding-left:2rem; }
	.md\:pr-6 { padding-right:1.5rem; }
	.md\:pb-6 { padding-bottom:1.5rem; }
	.md\:text-left { text-align:left; }
	.md\:text-lg { font-size:1.125rem; line-height:1.6; }
	.md\:text-\[18px\] { font-size:18px; }
	.md\:font-medium { font-weight:500; }
	.md\:text-white { --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
	.md\:\!display-4 { font-family:Epilogue, sans-serif; font-size:1rem; font-weight:500; line-height:1.2; letter-spacing:.03em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
	@media (min-width:992px) { .md\:\!display-4 { font-size:1.25rem; } }
	.md\:ellipsis-2 { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
	.md\:before\:absolute::before { content:var(--tw-content); position:absolute; }
	.md\:before\:-bottom-\[7px\]::before { content:var(--tw-content); bottom:-7px; }
	.md\:before\:left-1\/2::before { content:var(--tw-content); left:50%; }
	.md\:before\:h-\[7px\]::before { content:var(--tw-content); height:7px; }
	.md\:before\:w-\[12px\]::before { content:var(--tw-content); width:12px; }
	.md\:before\:-translate-x-1\/2::before { content:var(--tw-content); --tw-translate-x:-50%; -webkit-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)); -ms-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)); 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)); }
	.md\:before\:rotate-180::before { content:var(--tw-content); --tw-rotate:180deg; -webkit-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)); -ms-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)); 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)); }
	.md\:before\:bg-primary::before { content:var(--tw-content); --tw-bg-opacity:1; background-color:rgb(1 141 240 / var(--tw-bg-opacity)); }
	/* .md\:before\:content-\[\'\'\]::before { --tw-content:''; content:var(--tw-content); } */
	.md\:before\:clip-path-triangle::before { content:var(--tw-content); -webkit-clip-path:polygon(0 100%, 50% 0, 100% 100%); clip-path:polygon(0 100%, 50% 0, 100% 100%); }
	.md\:after\:absolute::after { content:var(--tw-content); position:absolute; }
	.md\:after\:-bottom-\[6px\]::after { content:var(--tw-content); bottom:-6px; }
	.md\:after\:left-1\/2::after { content:var(--tw-content); left:50%; }
	.md\:after\:h-\[7px\]::after { content:var(--tw-content); height:7px; }
	.md\:after\:w-\[12px\]::after { content:var(--tw-content); width:12px; }
	.md\:after\:-translate-x-1\/2::after { content:var(--tw-content); --tw-translate-x:-50%; -webkit-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)); -ms-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)); 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)); }
	.md\:after\:rotate-180::after { content:var(--tw-content); --tw-rotate:180deg; -webkit-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)); -ms-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)); 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)); }
	.md\:after\:bg-bg-1::after { content:var(--tw-content); --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
	/* .md\:after\:content-\[\'\'\]::after { --tw-content:''; content:var(--tw-content); } */
	.md\:after\:clip-path-triangle::after { content:var(--tw-content); -webkit-clip-path:polygon(0 100%, 50% 0, 100% 100%); clip-path:polygon(0 100%, 50% 0, 100% 100%); }
}

@media (min-width:992px) {
	.lg\:container { width:100%; margin-right:auto; margin-left:auto; padding-right:2rem; padding-left:2rem; }
	@media (min-width:576px) { .lg\:container { max-width:576px; } }
	@media (min-width:768px) { .lg\:container { max-width:768px; } }
	@media (min-width:992px) { .lg\:container { max-width:992px; } }
	@media (min-width:1200px) { .lg\:container { max-width:1200px; } }
	@media (min-width:1328px) { .lg\:container { max-width:1328px; } }
	.lg\:col-span-1 { grid-column:span 1 / span 1; }
	.lg\:col-span-3 { grid-column:span 3 / span 3; }
	.lg\:col-span-2 { grid-column:span 2 / span 2; }
	.lg\:mx-0 { margin-left:0px; margin-right:0px; }
	.lg\:mt-6 { margin-top:1.5rem; }
	.lg\:block { display:block; }
	.lg\:grid { display:grid; }
	.lg\:h-6 { height:1.5rem; }
	.lg\:\!h-6 { height:1.5rem !important; }
	.lg\:h-10 { height:2.5rem; }
	.lg\:w-fit { width:-webkit-fit-content; width:-moz-fit-content; width:fit-content; }
	.lg\:\!w-6 { width:1.5rem !important; }
	.lg\:max-w-none { max-width:none; }
	.lg\:grid-cols-4 { grid-template-columns:repeat(4, minmax(0, 1fr)); }
	.lg\:grid-cols-2 { grid-template-columns:repeat(2, minmax(0, 1fr)); }
	.lg\:grid-cols-3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
	.lg\:flex-row { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; }
	.lg\:flex-col { -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; }
	.lg\:flex-wrap { -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; }
	.lg\:items-start { -webkit-box-align:start; -webkit-align-items:flex-start; -ms-flex-align:start; align-items:flex-start; }
	.lg\:gap-8 { gap:2rem; }
	.lg\:gap-6 { gap:1.5rem; }
	.lg\:\!border-0 { border-width:0px !important; }
	.lg\:border-l { border-left-width:1px; }
	.lg\:border-b-0 { border-bottom-width:0px; }
	.lg\:border-r { border-right-width:1px; }
	.lg\:bg-transparent { background-color:transparent; }
	.lg\:p-0 { padding:0px; }
	.lg\:p-6 { padding:1.5rem; }
	.lg\:py-52 { padding-top:13rem; padding-bottom:13rem; }
	.lg\:py-\[52px\] { padding-top:52px; padding-bottom:52px; }
	.lg\:py-\[44px\] { padding-top:44px; padding-bottom:44px; }
	.lg\:px-0 { padding-left:0px; padding-right:0px; }
	.lg\:pl-8 { padding-left:2rem; }
	.lg\:pt-\[44px\] { padding-top:44px; }
	.lg\:pr-8 { padding-right:2rem; }
	.lg\:text-9xl { font-size:8rem; line-height:1.6; }
	.lg\:text-\[2\.5rem\] { font-size:2.5rem; }
	.lg\:text-lg { font-size:1.125rem; line-height:1.6; }
	.lg\:after\:content-none::after { --tw-content:none; content:var(--tw-content); }
	.lg\:first\:pl-0:first-child { padding-left:0px; }
	.lg\:last\:pr-0:last-child { padding-right:0px; }
	.lg\:hover\:bg-transparent:hover { background-color:transparent; }
	.lg\:hover\:text-secondary:hover { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
}


@media (min-width:1200px) {
	.xl\:col-span-5 { grid-column:span 5 / span 5; }
	.xl\:col-span-3 { grid-column:span 3 / span 3; }
}

.\[\&\.active\]\:rotate-180.active { --tw-rotate:180deg; -webkit-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)); -ms-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)); 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)); }
.\[\&\.active\]\:border-b-2.active { border-bottom-width:2px; }
.\[\&\.active\]\:border-secondary.active { --tw-border-opacity:1; border-color:rgb(1 197 186 / var(--tw-border-opacity)); }
.\[\&\.active\]\:\!bg-light-purple.active { --tw-bg-opacity:1 !important; background-color:rgb(195 121 246 / var(--tw-bg-opacity)) !important; }
.\[\&\.active\]\:\!text-white.active { --tw-text-opacity:1 !important; color:rgb(255 255 255 / var(--tw-text-opacity)) !important; }

@media (min-width:576px) {
	.sm\:\[\&\.active\]\:border-b-bg-1.active { --tw-border-opacity:1; border-bottom-color:rgb(32 34 34 / var(--tw-border-opacity)); }
	.sm\:\[\&\.active\]\:bg-secondary.active { --tw-bg-opacity:1; background-color:rgb(1 197 186 / var(--tw-bg-opacity)); }
	.sm\:\[\&\.active\]\:text-neutral.active { --tw-text-opacity:1; color:rgb(32 34 34 / var(--tw-text-opacity)); }
}

@media (min-width:768px) {
	.md\:container { width:100%; margin-right:auto; margin-left:auto; padding-right:2rem; padding-left:2rem; }
	@media (min-width:576px) { .md\:container { max-width:576px; } }
	@media (min-width:768px) { .md\:container { max-width:768px; } }
	@media (min-width:992px) { .md\:container { max-width:992px; } }
	@media (min-width:1200px) { .md\:container { max-width:1200px; } }
	@media (min-width:1328px) { .md\:container { max-width:1328px; } }
	.md\:top-\[72px\] { top:72px; }
	.md\:order-none { -webkit-box-ordinal-group:1; -webkit-order:0; -ms-flex-order:0; order:0; }
	.md\:order-last { -webkit-box-ordinal-group:10000; -webkit-order:9999; -ms-flex-order:9999; order:9999; }
	.md\:col-span-2 { grid-column:span 2 / span 2; }
	.md\:mx-0 { margin-left:0px; margin-right:0px; }
	.md\:ml-0 { margin-left:0px; }
	.md\:h-\[48px\] { height:48px; }
	.md\:w-auto { width:auto; }
	.md\:w-2\/3 { width:66.666667%; }
	.md\:max-w-none { max-width:none; }
	.md\:shrink-0 { -webkit-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; }
	.md\:grid-cols-2 { grid-template-columns:repeat(2, minmax(0, 1fr)); }
	.md\:flex-wrap { -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; }
	.md\:items-stretch { -webkit-box-align:stretch; -webkit-align-items:stretch; -ms-flex-align:stretch; align-items:stretch; }
	.md\:justify-start { -webkit-box-pack:start; -webkit-justify-content:flex-start; -ms-flex-pack:start; justify-content:flex-start; }
	.md\:justify-center { -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
	.md\:gap-8 { gap:2rem; }
	.md\:overflow-visible { overflow:visible; }
	.md\:overflow-x-visible { overflow-x:visible; }
	.md\:border-b-0 { border-bottom-width:0px; }
	.md\:border-r { border-right-width:1px; }
	.md\:p-8 { padding:2rem; }
	.md\:py-0 { padding-top:0px; padding-bottom:0px; }
	.md\:px-0 { padding-left:0px; padding-right:0px; }
	.md\:pt-\[64px\] { padding-top:64px; }
	.md\:pb-\[44px\] { padding-bottom:44px; }
	.md\:pr-10 { padding-right:2.5rem; }
	.md\:text-right { text-align:right; }
	.md\:text-\[2\.375rem\] { font-size:2.375rem; }
}

@media (min-width:992px) {
	.lg\:top-\[88px\] { top:88px; }
	.lg\:-my-\[44px\] { margin-top:-44px; margin-bottom:-44px; }
	.lg\:mb-4 { margin-bottom:1rem; }
	.lg\:mt-4 { margin-top:1rem; }
	.lg\:ml-\[72px\] { margin-left:72px; }
	.lg\:mr-8 { margin-right:2rem; }
	.lg\:flex { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; }
	.lg\:h-\[400px\] { height:400px; }
	.lg\:h-\[64px\] { height:64px; }
	.lg\:w-\[50\%\] { width:50%; }
	.lg\:w-\[140px\] { width:140px; }
	.lg\:w-auto { width:auto; }
	.lg\:w-\[284px\] { width:284px; }
	.lg\:max-w-\[540px\] { max-width:540px; }
	.lg\:flex-1 { -webkit-box-flex:1; -webkit-flex:1 1 0%; -ms-flex:1 1 0%; flex:1 1 0%; }
	.lg\:flex-none { -webkit-box-flex:0; -webkit-flex:none; -ms-flex:none; flex:none; }
	.lg\:grid-cols-1 { grid-template-columns:repeat(1, minmax(0, 1fr)); }
	.lg\:flex-row-reverse { -webkit-box-orient:horizontal; -webkit-box-direction:reverse; -webkit-flex-direction:row-reverse; -ms-flex-direction:row-reverse; flex-direction:row-reverse; }
	.lg\:flex-nowrap { -webkit-flex-wrap:nowrap; -ms-flex-wrap:nowrap; flex-wrap:nowrap; }
	.lg\:items-center { -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; }
	.lg\:justify-start { -webkit-box-pack:start; -webkit-justify-content:flex-start; -ms-flex-pack:start; justify-content:flex-start; }
	.lg\:justify-between { -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; }
	.lg\:gap-0 { gap:0px; }
	.lg\:gap-4 { gap:1rem; }
	.lg\:overflow-hidden { overflow:hidden; }
	.lg\:overflow-x-auto { overflow-x:auto; }
	.lg\:border { border-width:1px; }
	.lg\:border-0 { border-width:0px; }
	.lg\:border-b { border-bottom-width:1px; }
	.lg\:border-neutral-80 { --tw-border-opacity:1; border-color:rgb(57 53 86 / var(--tw-border-opacity)); }
	.lg\:p-8 { padding:2rem; }
	.lg\:\!px-8 { padding-left:2rem !important; padding-right:2rem !important; }
	.lg\:px-5 { padding-left:1.25rem; padding-right:1.25rem; }
	.lg\:pt-0 { padding-top:0px; }
	.lg\:pb-\[44px\] { padding-bottom:44px; }
	.lg\:pb-\[88px\] { padding-bottom:88px; }
	.lg\:pt-11 { padding-top:2.75rem; }
	.lg\:pt-\[88px\] { padding-top:88px; }
	.lg\:pb-\[24px\] { padding-bottom:24px; }
	.lg\:text-\[1\.75rem\] { font-size:1.75rem; }
	.lg\:text-\[3\.25rem\] { font-size:3.25rem; }
	.lg\:after\:left-\[28px\]::after { content:var(--tw-content); left:28px; }
	.lg\:\[\&\.active\]\:border-0.active { border-width:0px; }
	.lg\:\[\&\.active\]\:text-secondary.active { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
}

@media (min-width:1200px) {
	.xl\:order-none { -webkit-box-ordinal-group:1; -webkit-order:0; -ms-flex-order:0; order:0; }
	.xl\:order-last { -webkit-box-ordinal-group:10000; -webkit-order:9999; -ms-flex-order:9999; order:9999; }
	.xl\:h-\[98px\] { height:98px; }
	.xl\:w-auto { width:auto; }
	.xl\:w-3\/4 { width:75%; }
	.xl\:flex-none { -webkit-box-flex:0; -webkit-flex:none; -ms-flex:none; flex:none; }
	.xl\:flex-1 { -webkit-box-flex:1; -webkit-flex:1 1 0%; -ms-flex:1 1 0%; flex:1 1 0%; }
	.xl\:grid-cols-6 { grid-template-columns:repeat(6, minmax(0, 1fr)); }
	.xl\:grid-cols-4 { grid-template-columns:repeat(4, minmax(0, 1fr)); }
	.xl\:grid-cols-3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
	.xl\:flex-nowrap { -webkit-flex-wrap:nowrap; -ms-flex-wrap:nowrap; flex-wrap:nowrap; }
	.xl\:overflow-hidden { overflow:hidden; }
	.xl\:\!px-\[88px\] { padding-left:88px !important; padding-right:88px !important; }
	.xl\:px-6 { padding-left:1.5rem; padding-right:1.5rem; }
	.xl\:pr-12 { padding-right:3rem; }
	.xl\:text-left { text-align:left; }
	.xl\:text-\[4\.5rem\] { font-size:4.5rem; }
}

@media (min-width:1328px) {
	.\32xl\:w-\[386px\] { width:386px; }
	.\32xl\:w-\[292px\] { width:292px; }
	.\32xl\:w-\[78\%\] { width:78%; }
	.\32xl\:grid-cols-4 { grid-template-columns:repeat(4, minmax(0, 1fr)); }
	.\32xl\:text-\[5rem\] { font-size:5rem; }
}

.\[\&\.active\]\:border-2.active { border-width:2px; }
.\[\&\.active\]\:border-\[6px\].active { border-width:6px; }
.\[\&\.active\]\:border-solid.active { border-style:solid; }
.\[\&\.active\]\:\!border-action.active { --tw-border-opacity:1 !important; border-color:rgb(1 197 186 / var(--tw-border-opacity)) !important; }
.\[\&\.active\]\:\!border-secondary.active { --tw-border-opacity:1 !important; border-color:rgb(1 197 186 / var(--tw-border-opacity)) !important; }
.\[\&\.active\]\:border-neutral-20.active { --tw-border-opacity:1; border-color:rgb(206 204 214 / var(--tw-border-opacity)); }
.\[\&\.active\]\:bg-neutral-60.active { --tw-bg-opacity:1; background-color:rgb(107 103 133 / var(--tw-bg-opacity)); }
.\[\&\.active\]\:\!bg-action.active { --tw-bg-opacity:1 !important; background-color:rgb(1 197 186 / var(--tw-bg-opacity)) !important; }
.\[\&\.active\]\:bg-neutral-80.active { --tw-bg-opacity:1; background-color:rgb(57 53 86 / var(--tw-bg-opacity)); }
.\[\&\.active\]\:\!text-neutral.active { --tw-text-opacity:1 !important; color:rgb(32 34 34 / var(--tw-text-opacity)) !important; }
.\[\&\.active\]\:hover\:border-neutral-60:hover.active { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); }
@media (min-width:768px) { .\[\&\.active\]\:md\:block.active { display:block; } }

@media (min-width:992px) {
	.lg\:static { position:static; }
	.lg\:fixed { position:fixed; }
	.lg\:absolute { position:absolute; }
	.lg\:relative { position:relative; }
	.lg\:left-\[32px\] { left:32px; }
	.lg\:top-\[140px\] { top:140px; }
	.lg\:left-\[80px\] { left:80px; }
	.lg\:top-auto { top:auto; }
	.lg\:left-auto { left:auto; }
	.lg\:right-\[12px\] { right:12px; }
	.lg\:top-28 { top:7rem; }
	.lg\:-right-\[24px\] { right:-24px; }
	.lg\:left-0 { left:0px; }
	.lg\:right-0 { right:0px; }
	.lg\:top-full { top:100%; }
	.lg\:-right-\[117px\] { right:-117px; }
	.lg\:top-0 { top:0px; }
	.lg\:left-\[280px\] { left:280px; }
	.lg\:bottom-0 { bottom:0px; }
	.lg\:order-1 { -webkit-box-ordinal-group:2; -webkit-order:1; -ms-flex-order:1; order:1; }
	.lg\:order-2 { -webkit-box-ordinal-group:3; -webkit-order:2; -ms-flex-order:2; order:2; }
	.lg\:order-last { -webkit-box-ordinal-group:10000; -webkit-order:9999; -ms-flex-order:9999; order:9999; }
	.lg\:order-first { -webkit-box-ordinal-group:-9998; -webkit-order:-9999; -ms-flex-order:-9999; order:-9999; }
	.lg\:col-span-9 { grid-column:span 9 / span 9; }
	.lg\:col-start-2 { grid-column-start:2; }
	.lg\:col-start-1 { grid-column-start:1; }
	.lg\:row-span-2 { grid-row:span 2 / span 2; }
	.lg\:row-start-1 { grid-row-start:1; }
	.lg\:row-start-2 { grid-row-start:2; }
	.lg\:mt-9 { margin-top:2.25rem; }
	.lg\:mt-8 { margin-top:2rem; }
	.lg\:mt-0 { margin-top:0px; }
	.lg\:mb-0 { margin-bottom:0px; }
	.lg\:ml-0 { margin-left:0px; }
	.lg\:ml-28 { margin-left:7rem; }
	.lg\:mt-14 { margin-top:3.5rem; }
	.lg\:mb-6 { margin-bottom:1.5rem; }
	.lg\:ml-\[280px\] { margin-left:280px; }
	.lg\:mt-\[108px\] { margin-top:108px; }
	.lg\:mb-8 { margin-bottom:2rem; }
	.lg\:-mt-\[74px\] { margin-top:-74px; }
	.lg\:mb-\[2px\] { margin-bottom:2px; }
	.lg\:hidden { display:none; }
	.lg\:aspect-\[292\/105\] { aspect-ratio:292/105; }
	.lg\:h-\[34px\] { height:34px; }
	.lg\:h-full { height:100%; }
	.lg\:h-\[45px\] { height:45px; }
	.lg\:h-auto { height:auto; }
	.lg\:h-\[108px\] { height:108px; }
	.lg\:min-h-\[183px\] { min-height:183px; }
	.lg\:w-1\/3 { width:33.333333%; }
	.lg\:w-2\/3 { width:66.666667%; }
	.lg\:w-full { width:100%; }
	.lg\:w-\[564px\] { width:564px; }
	.lg\:w-\[256px\] { width:256px; }
	.lg\:w-2\/5 { width:40%; }
	.lg\:w-\[240px\] { width:240px; }
	.lg\:w-\[280px\] { width:280px; }
	.lg\:max-w-\[575px\] { max-width:575px; }
	.lg\:flex-initial { -webkit-box-flex:0; -webkit-flex:0 1 auto; -ms-flex:0 1 auto; flex:0 1 auto; }
	.lg\:flex-grow { -webkit-box-flex:1; -webkit-flex-grow:1; -ms-flex-positive:1; flex-grow:1; }
	.lg\:grow { -webkit-box-flex:1; -webkit-flex-grow:1; -ms-flex-positive:1; flex-grow:1; }
	.lg\:basis-2\/3 { -webkit-flex-basis:66.666667%; -ms-flex-preferred-size:66.666667%; flex-basis:66.666667%; }
	.lg\:basis-1\/3 { -webkit-flex-basis:33.333333%; -ms-flex-preferred-size:33.333333%; flex-basis:33.333333%; }
	.lg\:translate-y-\[32\.5px\] { --tw-translate-y:32.5px; -webkit-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)); -ms-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)); 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)); }
	.lg\:translate-y-\[42px\] { --tw-translate-y:42px; -webkit-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)); -ms-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)); 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)); }
	.lg\:translate-y-\[32px\] { --tw-translate-y:32px; -webkit-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)); -ms-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)); 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)); }
	.lg\:grid-cols-12 { grid-template-columns:repeat(12, minmax(0, 1fr)); }
	.lg\:\!grid-cols-3 { grid-template-columns:repeat(3, minmax(0, 1fr)) !important; }
	.lg\:grid-rows-2 { grid-template-rows:repeat(2, minmax(0, 1fr)); }
	.lg\:items-stretch { -webkit-box-align:stretch; -webkit-align-items:stretch; -ms-flex-align:stretch; align-items:stretch; }
	.lg\:justify-end { -webkit-box-pack:end; -webkit-justify-content:flex-end; -ms-flex-pack:end; justify-content:flex-end; }
	.lg\:justify-center { -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; }
	.lg\:gap-20 { gap:5rem; }
	.lg\:gap-14 { gap:3.5rem; }
	.lg\:gap-2 { gap:0.5rem; }
	.lg\:gap-12 { gap:3rem; }
	.lg\:self-auto { -webkit-align-self:auto; -ms-flex-item-align:auto; align-self:auto; }
	.lg\:self-stretch { -webkit-align-self:stretch; -ms-flex-item-align:stretch; align-self:stretch; }
	.lg\:text-ellipsis { text-overflow:ellipsis; }
	.lg\:whitespace-nowrap { white-space:nowrap; }
	.lg\:rounded-none { border-radius:0px; }
	.lg\:border-x { border-left-width:1px; border-right-width:1px; }
	.lg\:border-t-0 { border-top-width:0px; }
	.lg\:border-t { border-top-width:1px; }
	.lg\:bg-bg-2 { --tw-bg-opacity:1; background-color:rgb(11 6 45 / var(--tw-bg-opacity)); }
	.lg\:bg-bg-1 { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
	.lg\:bg-neutral-90 { --tw-bg-opacity:1; background-color:rgb(32 34 34 / var(--tw-bg-opacity)); }
	.lg\:p-12 { padding:3rem; }
	.lg\:p-\[76px\] { padding:76px; }
	.lg\:p-20 { padding:5rem; }
	.lg\:py-\[88px\] { padding-top:88px; padding-bottom:88px; }
	.lg\:px-8 { padding-left:2rem; padding-right:2rem; }
	.lg\:py-5 { padding-top:1.25rem; padding-bottom:1.25rem; }
	.lg\:py-0 { padding-top:0px; padding-bottom:0px; }
	.lg\:px-6 { padding-left:1.5rem; padding-right:1.5rem; }
	.lg\:py-8 { padding-top:2rem; padding-bottom:2rem; }
	.lg\:py-\[120px\] { padding-top:120px; padding-bottom:120px; }
	.lg\:px-10 { padding-left:2.5rem; padding-right:2.5rem; }
	.lg\:py-12 { padding-top:3rem; padding-bottom:3rem; }
	.lg\:py-10 { padding-top:2.5rem; padding-bottom:2.5rem; }
	.lg\:py-6 { padding-top:1.5rem; padding-bottom:1.5rem; }
	.lg\:pb-12 { padding-bottom:3rem; }
	.lg\:pl-12 { padding-left:3rem; }
	.lg\:pr-0 { padding-right:0px; }
	.lg\:pr-6 { padding-right:1.5rem; }
	.lg\:pl-6 { padding-left:1.5rem; }
	.lg\:pb-\[120px\] { padding-bottom:120px; }
	.lg\:pb-0 { padding-bottom:0px; }
	.lg\:text-left { text-align:left; }
	.lg\:text-center { text-align:center; }
	.lg\:font-heading { font-family:Syncopate, sans-serif; }
	.lg\:text-xl { font-size:1.25rem; line-height:1.6; }
	.lg\:text-\[1\.5rem\] { font-size:1.5rem; }
	.lg\:text-\[20px\] { font-size:20px; }
	.lg\:\!text-xl { font-size:1.25rem !important; line-height:1.6 !important; }
	.lg\:text-\[3rem\] { font-size:3rem; }
	.lg\:text-2xl { font-size:1.5rem; line-height:1.6; }
	.lg\:text-sm { font-size:0.875rem; line-height:1.6; }
	.lg\:text-base { font-size:1rem; line-height:1.6; }
	.lg\:\!text-\[1\.25rem\] { font-size:1.25rem !important; }
	.lg\:text-4xl { font-size:2.25rem; line-height:1.6; }
	.lg\:font-normal { font-weight:400; }
	.lg\:font-bold { font-weight:700; }
	.lg\:uppercase { text-transform:uppercase; }
	.lg\:leading-tight { line-height:1.2; }
	.lg\:tracking-heading { letter-spacing:-.04em; }
	.lg\:text-neutral-10 { --tw-text-opacity:1; color:rgb(230 230 235 / var(--tw-text-opacity)); }
	.lg\:aspect-none { position:static; padding-bottom:0; }
	.lg\:aspect-none > * { position:static; height:auto; width:auto; top:auto; right:auto; bottom:auto; left:auto; }
	.lg\:\!shadow-dropdown-menu { --tw-shadow:0px 16px 64px 0px rgba(18, 27, 40, 0.8) !important; --tw-shadow-colored:0px 16px 64px 0px var(--tw-shadow-color) !important; box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important; }
	.lg\:\!display-4 { font-family:Epilogue, sans-serif; font-size:1rem; font-weight:500; line-height:1.2; letter-spacing:.03em; --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }
	@media (min-width:992px) { .lg\:\!display-4 { font-size:1.25rem; } }
	.lg\:before\:right-\[129px\]::before { content:var(--tw-content); right:129px; }
	.lg\:before\:right-\[22\.5px\]::before { content:var(--tw-content); right:22.5px; }
}

@media (min-width:1200px) {
	.xl\:right-48 { right:12rem; }
	.xl\:gap-8 { gap:2rem; }
	.xl\:text-\[4rem\] { font-size:4rem; }
	.xl\:text-\[3\.5rem\] { font-size:3.5rem; }
	.xl\:text-\[3rem\] { font-size:3rem; }
	.xl\:text-xl { font-size:1.25rem; line-height:1.6; }
}

@media (min-width:1328px) {
	.\32xl\:text-\[4\.5rem\] { font-size:4.5rem; }
	.\32xl\:text-\[4rem\] { font-size:4rem; }
	.\32xl\:text-2xl { font-size:1.5rem; line-height:1.6; }
}

.\[\&\.active\]\:bg-dark-green.active { --tw-bg-opacity:1; background-color:rgb(6 68 98 / var(--tw-bg-opacity)); }
.\[\&\.active\]\:text-secondary.active { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
.\[\&\.active\]\:text-white.active { --tw-text-opacity:1; color:rgb(255 255 255 / var(--tw-text-opacity)); }

@media (min-width:992px) {
	.lg\:\[\&\.active\]\:relative.active { position:relative; }
	.lg\:\[\&\.active\]\:\!border-b-0.active { border-bottom-width:0px !important; }
	.\[\&\.active\]\:lg\:bg-transparent.active { background-color:transparent; }
	.lg\:\[\&\.active\]\:pl-\[52px\].active { padding-left:52px; }
	.lg\:\[\&\.active\]\:text-xl.active { font-size:1.25rem; line-height:1.6; }
	.lg\:\[\&\.active\]\:font-medium.active { font-weight:500; }
	.\[\&\.active\]\:lg\:text-secondary.active { --tw-text-opacity:1; color:rgb(1 197 186 / var(--tw-text-opacity)); }
	.lg\:\[\&\.active\]\:before\:absolute.active::before { content:var(--tw-content); position:absolute; }
	.lg\:\[\&\.active\]\:before\:top-1\/2.active::before { content:var(--tw-content); top:50%; }
	.lg\:\[\&\.active\]\:before\:left-0.active::before { content:var(--tw-content); left:0px; }
	.lg\:\[\&\.active\]\:before\:h-\[2px\].active::before { content:var(--tw-content); height:2px; }
	.lg\:\[\&\.active\]\:before\:w-\[40px\].active::before { content:var(--tw-content); width:40px; }
	.lg\:\[\&\.active\]\:before\:-translate-y-1\/2.active::before { content:var(--tw-content); --tw-translate-y:-50%; -webkit-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)); -ms-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)); 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)); }
	.lg\:\[\&\.active\]\:before\:bg-secondary.active::before { content:var(--tw-content); --tw-bg-opacity:1; background-color:rgb(1 197 186 / var(--tw-bg-opacity)); }
	/* .lg\:\[\&\.active\]\:before\:content-\[\'\'\].active::before { --tw-content:''; content:var(--tw-content); } */
}

@media (min-width:1200px) {
	.xl\:top-\[120px\] { top:120px; }
	.xl\:left-\[48px\] { left:48px; }
	.xl\:top-\[192px\] { top:192px; }
	.xl\:left-\[144px\] { left:144px; }
	.xl\:top-\[2px\] { top:2px; }
	.xl\:right-0 { right:0px; }
	.xl\:mr-10 { margin-right:2.5rem; }
	.xl\:mb-0 { margin-bottom:0px; }
	.xl\:flex { display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; }
	.xl\:hidden { display:none; }
	.xl\:h-\[59px\] { height:59px; }
	.xl\:h-full { height:100%; }
	.xl\:max-h-\[312px\] { max-height:312px; }
	.xl\:w-1\/4 { width:25%; }
	.xl\:w-1\/3 { width:33.333333%; }
	.xl\:w-\[284px\] { width:284px; }
	.xl\:w-5\/12 { width:41.666667%; }
	.xl\:flex-initial { -webkit-box-flex:0; -webkit-flex:0 1 auto; -ms-flex:0 1 auto; flex:0 1 auto; }
	.xl\:flex-row { -webkit-box-orient:horizontal; -webkit-box-direction:normal; -webkit-flex-direction:row; -ms-flex-direction:row; flex-direction:row; }
	.xl\:flex-col { -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; }
	.xl\:items-center { -webkit-box-align:center; -webkit-align-items:center; -ms-flex-align:center; align-items:center; }
	.xl\:items-stretch { -webkit-box-align:stretch; -webkit-align-items:stretch; -ms-flex-align:stretch; align-items:stretch; }
	.xl\:justify-start { -webkit-box-pack:start; -webkit-justify-content:flex-start; -ms-flex-pack:start; justify-content:flex-start; }
	.xl\:justify-end { -webkit-box-pack:end; -webkit-justify-content:flex-end; -ms-flex-pack:end; justify-content:flex-end; }
	.xl\:justify-between { -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; }
	.xl\:gap-\[68px\] { gap:68px; }
	.xl\:gap-4 { gap:1rem; }
	.xl\:overflow-y-auto { overflow-y:auto; }
	.xl\:overflow-x-hidden { overflow-x:hidden; }
	.xl\:border-b-0 { border-bottom-width:0px; }
	.xl\:border-r { border-right-width:1px; }
	.xl\:px-14 { padding-left:3.5rem; padding-right:3.5rem; }
	.xl\:py-2 { padding-top:0.5rem; padding-bottom:0.5rem; }
	.xl\:py-0 { padding-top:0px; padding-bottom:0px; }
	.xl\:px-10 { padding-left:2.5rem; padding-right:2.5rem; }
	.xl\:py-14 { padding-top:3.5rem; padding-bottom:3.5rem; }
	.xl\:pl-12 { padding-left:3rem; }
	.xl\:pr-11 { padding-right:2.75rem; }
	.xl\:pb-0 { padding-bottom:0px; }
	.xl\:pb-2 { padding-bottom:0.5rem; }
	.xl\:pr-2 { padding-right:0.5rem; }
	.xl\:text-\[2rem\] { font-size:2rem; }
	.xl\:text-lg { font-size:1.125rem; line-height:1.6; }
}

@media (min-width:1328px) {
	.\32xl\:top-\[144px\] { top:144px; }
	.\32xl\:left-\[92px\] { left:92px; }
	.\32xl\:top-\[204px\] { top:204px; }
	.\32xl\:left-\[180px\] { left:180px; }
	.\32xl\:right-\[24px\] { right:24px; }
	.\32xl\:col-span-2 { grid-column:span 2 / span 2; }
	.\32xl\:grid { display:grid; }
	.\32xl\:w-\[22\%\] { width:22%; }
	.\32xl\:min-w-\[160px\] { min-width:160px; }
	.\32xl\:flex-1 { -webkit-box-flex:1; -webkit-flex:1 1 0%; -ms-flex:1 1 0%; flex:1 1 0%; }
	.\32xl\:grid-cols-3 { grid-template-columns:repeat(3, minmax(0, 1fr)); }
	.\32xl\:grid-cols-1 { grid-template-columns:repeat(1, minmax(0, 1fr)); }
	.\32xl\:gap-16 { gap:4rem; }
	.\32xl\:px-\[58px\] { padding-left:58px; padding-right:58px; }
	.\32xl\:text-\[2\.5rem\] { font-size:2.5rem; }
	.\32xl\:text-xl { font-size:1.25rem; line-height:1.6; }
}

.\[\&\.active\]\:sticky.active { position:-webkit-sticky; position:sticky; }
.\[\&\.active\]\:\!flex.active { display:-webkit-box !important; display:-webkit-flex !important; display:-ms-flexbox !important; display:flex !important; }
.\[\&\.active\]\:border.active { border-width:1px; }
.\[\&\.active\]\:border-neutral-60.active { --tw-border-opacity:1; border-color:rgb(107 103 133 / var(--tw-border-opacity)); }
.\[\&\.active\]\:\!text-secondary.active { --tw-text-opacity:1 !important; color:rgb(1 197 186 / var(--tw-text-opacity)) !important; }



		tfoot input {
			width: 100%;
			padding: 3px;
			box-sizing: border-box;
		}

		table { border-collapse: collapse; width: 100%; }
		th, td { border: 1px solid #ccc; padding: 6px; }
		form { margin-bottom: 15px; }
		/*.hidden { display:none; } */

	
		
		table.dataTable td { font-size:13px; }
		table.dataTable thead th,
		table.dataTable tfoot th { font-size:13px; background:#212322; color:#fff; }
		thead input { width:100%; box-sizing:border-box; font-size:13px; }
		thead select { width: 100%; box-sizing: border-box; font-size: 13px; }

		.dataTables_wrapper .dataTables_filter { margin-bottom:10px; }
		.dataTables_wrapper .dataTables_filter input { font-size:13px; }
	
/* --------------------------------------------------------------------------------------------------------------------------------------------------
/* -- PAGE LOGIN  -------------------------------------------------------------------------------------------------------------------------------- */
body.auth-body { background: #f5f7fa; color: rgba(33,35,34,.85); }
[data-theme="dark"] body.auth-body { background: rgb(32 34 34); color: rgb(230 230 235); }
.auth-body h1, .auth-body h2, .auth-body h3, .auth-body h4, .auth-body h5, .auth-body h6 { color: rgba(33,35,34,.85); }
[data-theme="dark"] .auth-body h1, [data-theme="dark"] .auth-body h2, [data-theme="dark"] .auth-body h3,
[data-theme="dark"] .auth-body h4, [data-theme="dark"] .auth-body h5, [data-theme="dark"] .auth-body h6 { color: rgb(255 255 255); }
.auth-body label { color: rgba(33,35,34,.7); opacity: 1; }
[data-theme="dark"] .auth-body label { color: rgb(230 230 235); opacity: .7; }
.auth-logo { filter: invert(1) brightness(0.35); }
[data-theme="dark"] .auth-logo { filter: none; }
.login-card { background: #fff; border: 1px solid rgba(33,35,34,.09); border-radius: 12px; padding: 2.5rem 2rem; box-shadow: 0 4px 32px rgba(33,35,34,.08); }
[data-theme="dark"] .login-card { background: rgba(255,255,255,0.03); border-color: rgb(255, 255, 255); box-shadow: none; }
.pass-wrapper { position: relative; }
.pass-wrapper input { padding-right: 3rem; width: 100%; }
.pass-toggle { position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%); background: none; border: none; padding: 0; cursor: pointer; color: rgb(156 153 174); display: flex; align-items: center; transition: color 0.15s; }
.pass-toggle:hover { color: rgb(1 197 186); }
.login-error { display: flex; align-items: flex-start; gap: 0.5rem; background: rgba(239,70,111,0.08); border-left: 3px solid rgb(239 70 111); padding: 0.625rem 0.75rem; border-radius: 0 4px 4px 0; font-size: 0.875rem; color: rgb(239 70 111); }
.login-error svg { flex-shrink: 0; margin-top: 1px; } .login-success { display: flex; align-items: flex-start; gap: 0.5rem; background: rgba(1,197,186,0.08); border-left: 3px solid rgb(1 197 186); padding: 0.625rem 0.75rem; border-radius: 0 4px 4px 0; font-size: 0.875rem; color: rgb(0 185 175); }
.login-success svg { flex-shrink: 0; margin-top: 1px; }
.caps-warn { font-size: 0.75rem; color: rgb(250 176 5); margin-top: 0.25rem; }
.btn-spinner { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; }
@keyframes spin { to { transform: rotate(360deg); } }
.spin { animation: spin 0.7s linear infinite; }
.forgot-link { background: none; border: none; padding: 0; color: rgb(1 197 186); font-size: 0.8125rem; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; transition: opacity 0.15s; }
.forgot-link:hover { opacity: 0.75; }
#forgotPanel { display: none; }

/* --------------------------------------------------------------------------------------------------------------------------------------------------
/* -- PAGE ERROR: 400 / 500 ---------------------------------------------------------------------------------------------------------------------- */
.error-page { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:100vh; gap:1.25rem; text-align:center; padding:2rem; }
.error-code { font-size:6rem; font-weight:800; color:rgba(33,35,34,.9); line-height:1; margin:0; }
.error-title { font-size:1.5rem; font-weight:700; margin:0; color:rgba(33,35,34,.85); }
.error-body { font-size:.9375rem; color:rgba(33,35,34,.6); margin:0; max-width:380px; line-height:1.6; }
[data-theme="dark"] .error-code  { color:rgba(255,255,255); }
[data-theme="dark"] .error-title { color:rgba(255,255,255,.85); }
[data-theme="dark"] .error-body  { color:rgba(255,255,255,.85); }

/* --------------------------------------------------------------------------------------------------------------------------------------------------
/* -- PAGE INDEX: -------------------------------------------------------------------------------------------------------------------------------- */
/* Locker card */
.locker-cards-grid { display: flex; flex-direction: column; gap: 1rem; max-width: 560px; }
.locker-card { display: flex; flex-direction: column; gap: 1.25rem; padding: 1.5rem; border: 1px solid rgba(33, 35, 34, 0.1); border-radius: 14px; background: #fff; box-shadow: 0 1px 4px rgba(33, 35, 34, 0.05); }
.locker-card-top { display: grid; grid-template-columns: 1fr minmax(160px, 45%); gap: 0.75rem; align-items: stretch; }
.locker-card-left { display: flex; align-items: center; gap: 1rem; }
.locker-card-icon { flex-shrink: 0; width: 56px; height: 56px; border-radius: 14px; display: flex; align-items: center; justify-content: center; background: rgba(1, 197, 186, 0.1); color: rgb(0, 125, 118); }
.locker-card-icon.dept { background: rgba(39, 122, 255, 0.1); color: rgb(39, 122, 255); }
.locker-card-info { display: flex; flex-direction: column; gap: 0.2rem; }
.locker-card-eyebrow { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: rgba(33, 35, 34, 0.38); }
.locker-card-name { font-size: 2rem; font-weight: 800; letter-spacing: -0.02em; color: rgba(33, 35, 34, 0.9); line-height: 1.1; }
.locker-card-status-wrap { display: flex; align-items: stretch; padding-left: 1rem; border-left: 1px solid rgba(33, 35, 34, 0.08); }
.locker-card-status { display: flex; align-items: center; justify-content: center; width: 100%; padding: 0.5rem 1rem; border-radius: 10px; font-size: 0.875rem; font-weight: 700; letter-spacing: 0.03em; background: rgba(33, 35, 34, 0.07); color: rgba(33, 35, 34, 0.4); transition: background 0.2s, color 0.2s; white-space: nowrap; text-align: center; }
.locker-card-status.s-close { background: rgba(39,122,255,0.12); color: #277aff; }
.locker-card-status.s-open { background: rgba(250,176,5,0.15);  color: #8a6400; }
.locker-card-status.s-error { background: rgba(220,53,69,0.1);   color: rgb(185,46,60); }
.locker-card-status.s-loading { background: rgba(16,185,129,0.12);  color: #047857; }
.locker-card-actions { display: flex; flex-direction: row; gap: 0.625rem; width: 100%; }
.locker-card-actions .btn { flex: 1; justify-content: center; }
/* Empty state */
.empty-state { display: flex; flex-direction: column; align-items: center; gap: 0.75rem; padding: 3rem 1.5rem; text-align: center; color: rgba(33, 35, 34, 0.4); }
.empty-state svg { opacity: 0.35; }
.empty-state p { font-size: 0.875rem; margin: 0; }

/* --------------------------------------------------------------------------------------------------------------------------------------------------
/* -- USER CONFIG: -------------------------------------------------------------------------------------------------------------------------------- */
.config-card { max-width: none; }
.config-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 2.5rem; align-items: start; }
@media (max-width: 720px) {
	.config-cols { grid-template-columns: 1fr; }
	.config-cols .col-divider { display: none; }
}
.config-col-divider { grid-column: 1 / -1; border: none; border-top: 1px solid rgba(33,35,34,.08); margin: 0; }
[data-theme="dark"] .config-col-divider { border-color: rgba(255,255,255,.08); }
.pass-hint { font-weight:400; text-transform:none; letter-spacing:0; color:rgba(33,35,34,0.4); font-size:0.75rem; }
[data-theme="dark"] .pass-hint { color: rgba(255,255,255,.45); }
.password-field { position: relative; display: flex; align-items: center; }
.password-field input { flex: 1; padding-right: 2.5rem; }
.password-toggle { position: absolute; right: 0.625rem; background: none; border: none; cursor: pointer; padding: 0.25rem; color: rgba(33,35,34,0.4); display: flex; align-items: center; justify-content: center; }
.password-toggle:hover { color: rgba(33,35,34,0.75); }
.password-toggle svg { width: 18px; height: 18px; pointer-events: none; }
.form-feedback { display: none; padding: 0.75rem 1rem; border-radius: 8px; font-size: 0.875rem; font-weight: 500; margin-bottom: 1.25rem; }
.form-feedback.show { display: flex; align-items: center; gap: 0.5rem; }
.form-feedback.success { background: rgba(1,197,186,0.1); color: #007d76; }
.form-feedback.error   { background: rgba(220,53,69,0.1);  color: rgb(185,46,60); }
.section-divider { border: none; border-top: 1px solid rgba(33,35,34,0.08); margin: 1.5rem 0; }
.section-label { font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.1em; color: rgba(33,35,34,0.38); margin-bottom: 1rem; }


/*--END FILE--*//* ================================================
   app.css — Shared UI components
   ================================================ */

/* --- Animated dots (connecting state) --- */
@keyframes _dot-pulse { 0%,80%,100%{opacity:.2} 40%{opacity:1} }
.s-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:currentColor; animation:_dot-pulse 1.4s infinite ease-in-out both; margin:0 1px; }
.s-dot:nth-child(2) { animation-delay:.16s; }
.s-dot:nth-child(3) { animation-delay:.32s; }

/* --- CSS variables --- */
:root {
  --text-1: rgba(33,35,34,.85);
  --border-1: rgba(33,35,34,.09);
  --row-stripe: rgba(33,35,34,.03);
}
[data-theme="dark"] {
  --text-1: rgba(255,255,255,.85);
  --border-1: rgba(255,255,255,.1);
  --row-stripe: rgba(255,255,255,.03);
}

/* --- Content wrapper --- */
.app-content { padding-bottom: 3rem; }

/* --- Page header --- */
.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.75rem 1.5rem 0;
}
@media (min-width: 1024px) { .page-header { padding: 0; } }
.page-subtitle {
  font-size: 0.875rem;
  margin-top: 0.375rem;
  color: rgba(33, 35, 34, 0.45);
  font-weight: 400;
}

/* --- Section (handles mobile padding) --- */
.app-section { padding: 0 1.5rem; }
@media (min-width: 1024px) { .app-section { padding: 0; } }

/* --- Card --- */
.app-card {
  border: 1px solid rgba(33, 35, 34, 0.1);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 4px rgba(33, 35, 34, 0.05);
}
.app-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.875rem 1.5rem;
  border-bottom: 1px solid rgba(33, 35, 34, 0.08);
}
.app-card-header-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-left: auto;
}
.app-card-header-actions .btn,
.page-header-actions .btn {
  min-height: 42px;
}
.app-card-header-submit.btn {
  min-height: 2rem;
  padding: 0.375rem 0.875rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.04em;
  box-shadow: none;
}
.app-card-body  { padding: 1.5rem; }
.app-card-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: rgba(33, 35, 34, 0.4);
}
 
.app-card-header-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.table-summary {
  display: inline-flex;
  align-items: center;
  min-height: 2rem;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  background: rgba(1, 197, 186, 0.1);
  color: rgb(0, 125, 118);
  font-size: 0.75rem;
  font-weight: 700;
}

.btn-ghost {
  border: 1px solid rgba(33, 35, 34, 0.14);
  background: rgba(33, 35, 34, 0.02);
  color: rgba(33, 35, 34, 0.72);
}

.btn-ghost:hover {
  background: rgba(1, 197, 186, 0.08);
  border-color: rgb(1, 197, 186);
  color: rgb(1, 197, 186);
}

.btn-danger {
  border: 1px solid rgb(185, 46, 60);
  background: rgb(220, 53, 69);
  color: #fff;
}

.btn-danger:hover {
  background: rgb(185, 46, 60);
  border-color: rgb(185, 46, 60);
  color: #fff;
}

.form-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding-top: 1.25rem;
}

.form-feedback {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 1rem;
  padding: 0.875rem 1rem;
  border-radius: 10px;
  font-size: 0.875rem;
  line-height: 1.5;
}

.form-feedback.hidden {
  display: none;
}

.form-feedback-info {
  background: rgba(39, 122, 255, 0.08);
  color: rgb(39, 122, 255);
  border: 1px solid rgba(39, 122, 255, 0.18);
}

.form-feedback-success {
  background: rgba(1, 197, 186, 0.1);
  color: rgb(0, 125, 118);
  border: 1px solid rgba(1, 197, 186, 0.18);
}

.form-feedback-error {
  background: rgba(220, 53, 69, 0.08);
  color: rgb(185, 46, 60);
  border: 1px solid rgba(220, 53, 69, 0.18);
}

.has-error input,
.has-error select,
.has-error textarea {
  border-color: rgba(220, 53, 69, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.08);
}

.field-error {
  font-size: 0.75rem;
  line-height: 1.4;
  color: rgb(185, 46, 60);
}

/* --- Forms --- */
.app-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.form-overview {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.125rem;
  border: 1px solid rgba(33, 35, 34, 0.08);
  border-radius: 12px;
  background:
    radial-gradient(circle at top right, rgba(1, 197, 186, 0.14), transparent 40%),
    linear-gradient(180deg, rgba(33, 35, 34, 0.02), rgba(33, 35, 34, 0.01));
}

.form-overview-copy {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.form-eyebrow {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgb(0, 125, 118);
}

.form-title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.3;
  color: rgba(33, 35, 34, 0.9);
}

.form-description {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: rgba(33, 35, 34, 0.58);
}

.form-mode-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  background: rgba(1, 197, 186, 0.1);
  color: rgb(0, 125, 118);
  font-size: 0.75rem;
  font-weight: 700;
  white-space: nowrap;
}

.form-mode-badge[data-mode="editing"] {
  background: rgba(39, 122, 255, 0.1);
  color: rgb(39, 122, 255);
}

.form-feedback-anchor {
  min-height: 0;
}

.form-layout {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.form-section {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  padding: 1rem 1.125rem;
  border: 1px solid rgba(33, 35, 34, 0.08);
  border-radius: 12px;
  background: rgba(33, 35, 34, 0.015);
}

.form-section-header {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.form-section-title {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(33, 35, 34, 0.48);
}

.form-section-description {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: rgba(33, 35, 34, 0.58);
}

.form-grid {
  display: grid;
  gap: 0.875rem 1rem;
}

.form-grid-2,
.form-grid-3,
.form-grid-4,
.form-grid-5 {
  grid-template-columns: minmax(0, 1fr);
}

@media (min-width: 640px) {
  .form-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .form-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (min-width: 960px) {
  .form-grid-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

.form-field {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  min-width: 0;
}

.form-field-full {
  grid-column: 1 / -1;
}

.app-form label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: rgba(33, 35, 34, 0.7);
  opacity: 1;
}

.form-field[data-required="true"] label::after {
  content: '*';
  color: rgb(220, 53, 69);
}

.field-hint {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.45;
  color: rgba(33, 35, 34, 0.52);
}

.app-form input[type="text"],
.app-form input[type="email"],
.app-form input[type="password"],
.app-form input[type="number"],
.app-form input[type="tel"],
.app-form input[type="search"],
.app-form textarea,
.app-form select {
  width: 100%;
  min-height: 2.75rem;
  border-radius: 10px;
  border: 1px solid rgba(33, 35, 34, 0.12);
  background-color: #fff;
  padding: 0.75rem 0.875rem;
  color: rgba(33, 35, 34, 0.82);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  transition: border-color 0.12s, box-shadow 0.12s, background-color 0.12s;
}

.app-form textarea {
  min-height: 7rem;
}

.app-form select {
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%236a6f6c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 1rem 1rem;
  padding-right: 2.5rem;
}

.app-form select option {
  background: #fff;
  color: rgba(33, 35, 34, 0.82);
}

.app-form input[type="text"]::placeholder,
.app-form input[type="email"]::placeholder,
.app-form input[type="password"]::placeholder,
.app-form input[type="number"]::placeholder,
.app-form input[type="tel"]::placeholder,
.app-form textarea::placeholder {
  color: rgba(33, 35, 34, 0.34);
}

.app-form input[type="text"]:hover,
.app-form input[type="email"]:hover,
.app-form input[type="password"]:hover,
.app-form input[type="number"]:hover,
.app-form input[type="tel"]:hover,
.app-form textarea:hover,
.app-form select:hover {
  border-color: rgba(33, 35, 34, 0.2);
  box-shadow: 0 4px 12px rgba(33, 35, 34, 0.06);
}

.app-form input[type="text"]:focus,
.app-form input[type="email"]:focus,
.app-form input[type="password"]:focus,
.app-form input[type="number"]:focus,
.app-form input[type="tel"]:focus,
.app-form textarea:focus,
.app-form select:focus {
  border-color: rgba(1, 197, 186, 0.55);
  box-shadow: 0 0 0 4px rgba(1, 197, 186, 0.1);
  outline: none;
}

.app-form select.is-placeholder {
  color: rgba(33, 35, 34, 0.42);
}

.app-form .password-field {
  position: relative;
}

.app-form .password-field input {
  padding-right: 3rem;
}

.app-form .password-toggle {
  position: absolute;
  right: 0.75rem;
  top: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border: none;
  border-radius: 999px;
  background: transparent;
  color: rgba(33, 35, 34, 0.45);
  transform: translateY(-50%);
  cursor: pointer;
  transition: background 0.12s, color 0.12s;
}

.app-form .password-toggle:hover {
  background: rgba(1, 197, 186, 0.08);
  color: rgb(0, 125, 118);
}

.app-form .password-toggle svg {
  width: 1rem;
  height: 1rem;
  display: block;
}

.app-form .form-actions {
  margin-top: 0.125rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(33, 35, 34, 0.08);
}

.app-form .form-actions .btn {
  min-width: 9.5rem;
}

.app-form .form-actions .btn-ghost {
  background: #fff;
}

.app-form.is-busy {
  opacity: 0.92;
}

.app-form.is-busy .password-toggle {
  pointer-events: none;
  opacity: 0.45;
}

.has-error .field-hint {
  color: rgb(185, 46, 60);
}

@media (max-width: 639px) {
  .form-overview {
    flex-direction: column;
    align-items: stretch;
  }

  .form-mode-badge {
    align-self: flex-start;
  }
}

/* Table card — DataTables fills the space */
.app-card-table {
  overflow: hidden;
  --app-table-meta-color: rgba(33,35,34,0.5);
}
.app-card-table .dt-container,
.app-card-table .dataTables_wrapper,
.app-card-table .dt-layout-table,
.app-card-table .dt-scroll,
.app-card-table .dt-scroll-body,
.app-card-table .dt-scroll-head,
.app-card-table .dt-scroll-foot {
  width: 100% !important;
  max-width: 100%;
  box-sizing: border-box;
}
.app-card-table .dt-layout-table {
  overflow-x: auto;
}
.app-card-table .dt-container .dt-layout-row.dt-layout-table {
  display: block !important;
  width: 100% !important;
  padding: 0.75rem 1.5rem;
}
.app-card-table .dt-container .dt-layout-row.dt-layout-table .dt-layout-cell,
.app-card-table .dt-container .dt-layout-row.dt-layout-table .dt-layout-full {
  display: block !important;
  width: 100% !important;
  min-width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* ---- DataTables layout override ---- */

/* Rows as flex (override default display:table) */
.app-card-table .dt-container .dt-layout-row {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 1.5rem;
  width: 100%;
  box-sizing: border-box;
}
.app-card-table .dt-container .dt-layout-row:first-child {
  border-bottom: 1px solid rgba(33,35,34,0.08);
}
.app-card-table .dt-container .dt-layout-row:last-child:not(.dt-layout-table) {
  border-top: 1px solid rgba(33,35,34,0.08);
}
.app-card-table .dt-container .dt-layout-cell {
  display: block !important;
  padding: 0 !important;
  min-width: 0;
}
.app-card-table .dt-container .dt-layout-start,
.app-card-table .dt-container .dt-layout-end {
  flex-shrink: 0;
  min-width: 0;
}

/* Export buttons */
.app-card-table .dt-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}
.app-card-table .dt-buttons .dt-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2rem;
  padding: 0 !important;
  font-size: 0 !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  border-radius: 5px !important;
  border: 1px solid rgba(33,35,34,0.14) !important;
  background: #fff !important;
  color: rgba(33,35,34,0.6) !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
  white-space: nowrap;
}
.app-card-table .dt-buttons .dt-button svg {
  width: 1rem;
  height: 1rem;
  display: block;
}
.app-card-table .dt-buttons .dt-button:hover:not(.disabled) {
  background: rgba(1,197,186,0.08) !important;
  border-color: rgb(1,197,186) !important;
  color: rgb(1,197,186) !important;
}

/* Search */
.app-card-table .dt-search {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.app-card-table .dt-search label {
  display: none;
}
.app-card-table .dt-search input {
  min-height: auto !important;
  border: 1px solid rgba(33,35,34,0.15) !important;
  border-radius: 6px !important;
  padding: 0.35rem 0.75rem !important;
  font-size: 0.8125rem !important;
  background: #fff !important;
  color: rgba(33,35,34,0.8) !important;
  width: 180px;
  transition: border-color 0.12s;
  margin: 0 !important;
}
.app-card-table .dt-search input:focus {
  border-color: rgb(1,197,186) !important;
  outline: none;
}
/* Summary + clear button inside the search bar */
.app-card-table .dt-search .table-summary {
  padding: 0.25rem 0.5rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  white-space: nowrap;
  flex-shrink: 0;
}
.app-card-table .dt-search .table-clear-filters {
  padding: 0.35rem 0.75rem;
  font-size: 0.8125rem;
  border-radius: 6px;
  line-height: 1.4;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Info + length */
.app-card-table .dt-info {
  font-size: 0.8125rem;
  color: var(--app-table-meta-color) !important;
  white-space: nowrap;
}
.app-card-table .dt-length label {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  color: var(--app-table-meta-color) !important;
  white-space: nowrap;
}
.app-card-table .dt-length select {
  min-height: auto !important;
  border: 1px solid rgba(33,35,34,0.15) !important;
  border-radius: 4px !important;
  padding: 0.2rem 2rem 0.2rem 0.5rem !important;
  font-size: 0.8125rem !important;
  background-color: #fff !important;
  color: rgba(33,35,34,0.7) !important;
}

/* Pagination */
.app-card-table .dt-paging { white-space: nowrap; }
.app-card-table .dt-paging .dt-paging-button {
  padding: 0.25rem 0.55rem !important;
  font-size: 0.8125rem !important;
  border-radius: 5px !important;
  min-width: 1.75rem;
  text-align: center;
}
.app-card-table .dt-paging .dt-paging-button.current,
.app-card-table .dt-paging .dt-paging-button.current:hover {
  background: rgba(1,197,186,0.1) !important;
  border-color: rgba(1,197,186,0.5) !important;
  color: rgb(1,197,186) !important;
}
.app-card-table .dt-paging .dt-paging-button:hover:not(.disabled):not(.current) {
  background: rgba(33,35,34,0.05) !important;
  border-color: rgba(33,35,34,0.2) !important;
  color: rgba(33,35,34,0.8) !important;
}
.app-card-table .dt-paging .dt-paging-button.disabled {
  opacity: 0.35;
}

/* --- Status badges --- */
.badge {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.2rem 0.65rem;
  border-radius: 100px;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  vertical-align: middle;
  white-space: nowrap;
}
.badge-active   { color: #009e8c; background: rgba(1, 197, 186, 0.12); }
.badge-inactive { color: #888;    background: rgba(33, 35, 34, 0.07);  }
.badge-info     { color: #277aff; background: rgba(39, 122, 255, 0.12); }
.badge-warning  { color: #8a6400; background: rgba(250, 176, 5, 0.12); }
.badge-success  { color: #007d76; background: rgba(1, 197, 186, 0.12); }
.badge-danger   { color: #b92e3c; background: rgba(220, 53, 69, 0.10); }

/* --- Stat cards (admin_dashboard) --- */

.stat-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.25rem;
  border: 1px solid rgba(33, 35, 34, 0.1);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(33, 35, 34, 0.04);
}
.stat-card-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.stat-card-info { display: flex; flex-direction: column; gap: 0.125rem; }
.stat-card-name {
  font-size: 0.8125rem;
  color: rgba(33, 35, 34, 0.55);
  white-space: nowrap;
}
.stat-card-sub {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.25rem;
}
.stat-sub-item {
  font-size: 0.7rem;
  font-weight: 600;
  white-space: nowrap;
}
.stat-sub-active   { color: #009e8c; }
.stat-sub-inactive { color: #888; }
.stat-loading      { color: rgba(33,35,34,0.25); }

/* --- CRUD Modal --- */
.crud-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 900;
  background: rgba(0, 0, 0, 0.45);
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.crud-modal.open {
  display: flex;
}
.crud-modal-dialog {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.18);
  width: 100%;
  max-width: 680px;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  animation: crudModalIn 0.2s ease;
}
@keyframes crudModalIn {
  from { opacity: 0; transform: translateY(-16px) scale(0.98); }
  to   { opacity: 1; transform: translateY(0)     scale(1); }
}
.crud-modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.1rem 1.4rem 0.9rem;
  border-bottom: 1px solid rgba(33,35,34,0.08);
  flex-shrink: 0;
}
.crud-modal-title {
  font-size: 1rem;
  font-weight: 700;
  color: #212322;
}
.crud-modal-close {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px;
  color: rgba(33,35,34,0.45);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.crud-modal-close:hover { background: rgba(33,35,34,0.07); color: #212322; }
.crud-modal-body {
  padding: 1.25rem 1.4rem;
  overflow-y: auto;
}
.crud-modal-body select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%236a6f6c' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 1rem 1rem;
  padding-right: 2.5rem;
}
.crud-modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 0.9rem 1.4rem 1.1rem;
  border-top: 1px solid rgba(33,35,34,0.08);
  flex-shrink: 0;
}

/* --- DataTable: table body styling --- */

/* Override DataTables default CSS variables for brand colors */
.app-card-table table.dataTable {
  --dt-row-stripe: 1, 197, 186;
  --dt-row-hover: 1, 197, 186;
  --dt-column-ordering: 1, 197, 186;
  width: 100% !important;
  min-width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin: 0 !important;
}

/* Header */
.app-card-table table.dataTable > thead > tr > th,
.app-card-table table.dataTable > thead > tr > td {
  padding: 0.625rem 1rem;
  font-size: 0.6875rem;
  font-weight: 700;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: rgba(33, 35, 34, 0.45);
  background: rgba(33, 35, 34, 0.02);
  border-bottom: 1px solid rgba(33, 35, 34, 0.08) !important;
  white-space: nowrap;
}
.app-card-table table.dataTable > thead > tr.filters > th,
.app-card-table table.dataTable > thead > tr.filters > td {
  padding: 0.375rem 0.75rem;
  background: #fff;
  border-bottom: 1px solid rgba(33, 35, 34, 0.08) !important;
}
.app-card-table table.dataTable > thead > tr.filters input,
.app-card-table table.dataTable > thead > tr.filters select {
  width: 100%;
  min-height: 1.75rem !important;
  height: 1.75rem;
  padding: 0.2rem 0.5rem !important;
  border: 1px solid rgba(33, 35, 34, 0.12) !important;
  border-radius: 6px !important;
  background: rgba(33, 35, 34, 0.02) !important;
  color: rgba(33, 35, 34, 0.82) !important;
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  font-size: 0.6875rem !important;
  font-weight: 500;
  line-height: 1.2;
  box-shadow: none !important;
}
.app-card-table table.dataTable > thead > tr.filters input::placeholder,
.app-card-table table.dataTable > thead > tr.filters select::placeholder {
  color: rgba(33, 35, 34, 0.35) !important;
}
.app-card-table table.dataTable > thead > tr.filters input:hover,
.app-card-table table.dataTable > thead > tr.filters select:hover {
  border-color: rgba(33, 35, 34, 0.2) !important;
  background: rgba(33, 35, 34, 0.03) !important;
}
.app-card-table table.dataTable > thead > tr.filters input:focus,
.app-card-table table.dataTable > thead > tr.filters select:focus {
  border-color: rgba(1, 197, 186, 0.55) !important;
  background: #fff !important;
  box-shadow: 0 0 0 3px rgba(1, 197, 186, 0.1) !important;
  outline: none;
}

/* Sort arrows color */
.app-card-table table.dataTable thead > tr > th.dt-orderable-asc:hover,
.app-card-table table.dataTable thead > tr > th.dt-orderable-desc:hover {
  outline: 2px solid rgba(1, 197, 186, 0.12) !important;
  outline-offset: -2px;
}
.app-card-table table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order::before,
.app-card-table table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order::after {
  opacity: 0.7;
  color: rgb(1, 197, 186);
}

/* Body cells */
.app-card-table table.dataTable > tbody > tr > th,
.app-card-table table.dataTable > tbody > tr > td {
  padding: 0.45rem 0.875rem;
  font-size: 0.75rem;
  line-height: 1.35;
  color: rgba(33, 35, 34, 0.8);
  border-top: 1px solid rgba(33, 35, 34, 0.06) !important;
  vertical-align: middle;
  white-space: nowrap;
}
.app-card-table table.dataTable > tbody > tr:first-child > * {
  border-top: none !important;
}

/* Stripe: very light teal tint on odd rows */
.app-card-table table.dataTable.display > tbody > tr:nth-child(odd) > *,
.app-card-table table.dataTable.stripe  > tbody > tr:nth-child(odd) > * {
  box-shadow: inset 0 0 0 9999px rgba(1, 197, 186, 0.03) !important;
}

/* Row hover */
.app-card-table table.dataTable.hover > tbody > tr:hover > *,
.app-card-table table.dataTable.display > tbody > tr:hover > * {
  box-shadow: inset 0 0 0 9999px rgba(1, 197, 186, 0.07) !important;
}

/* Hide tfoot (duplicate header row) */
.app-card-table table.dataTable > tfoot { display: none; }

/* Action buttons inside table rows */
.app-card-table table.dataTable td button,
.app-card-table table.dataTable td .btn-large {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.15rem 0.5rem;
  font-size: 0.625rem;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.02em;
  border-radius: 5px;
  border: 1px solid rgba(33, 35, 34, 0.14);
  background: #fff;
  color: rgba(33, 35, 34, 0.6);
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.12s, color 0.12s, border-color 0.12s;
  margin-right: 0.25rem;
}
.app-card-table table.dataTable td button:last-child,
.app-card-table table.dataTable td .btn-large:last-child {
  margin-right: 0;
}
.app-card-table table.dataTable td .table-action {
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  justify-content: center;
}
.app-card-table table.dataTable td .table-action svg {
  width: 0.875rem;
  height: 0.875rem;
  display: block;
  pointer-events: none;
}
.app-card-table table.dataTable td .table-action svg * {
  pointer-events: none;
}
.app-card-table table.dataTable td button:hover,
.app-card-table table.dataTable td .btn-large:hover {
  background: rgba(1, 197, 186, 0.08);
  border-color: rgb(1, 197, 186);
  color: rgb(1, 197, 186);
}
/* Delete button: red on hover/focus/active */
.app-card-table table.dataTable td .table-action-delete:hover,
.app-card-table table.dataTable td .table-action-delete:focus,
.app-card-table table.dataTable td .table-action-delete:active {
  background: rgba(220, 53, 69, 0.07) !important;
  border-color: rgba(220, 53, 69, 0.5) !important;
  color: rgb(220, 53, 69) !important;
}
/* Incidents button: yellow base + yellow on hover/focus/active */
.app-card-table table.dataTable td .table-action-incidents {
  color: #e6a817;
}
.app-card-table table.dataTable td .table-action-incidents:hover,
.app-card-table table.dataTable td .table-action-incidents:focus,
.app-card-table table.dataTable td .table-action-incidents:active {
  background: rgba(230, 168, 23, 0.1) !important;
  border-color: rgba(230, 168, 23, 0.5) !important;
  color: #e6a817 !important;
}

/* --- Status toggle field --- */
.status-toggle-field {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  /* Alineación vertical con otros inputs de formulario */
  min-height: 42px;
}

.status-toggle {
  position: relative;
  flex-shrink: 0;
  width: 44px;
  height: 24px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: rgba(33, 35, 34, 0.15);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s ease, border-color 0.2s ease;
  outline: none;
}
.status-toggle:focus-visible {
  box-shadow: 0 0 0 3px rgba(1, 197, 186, 0.25);
  border-color: rgb(1, 197, 186);
}
.status-toggle[data-active="1"] {
  background: rgb(1, 197, 186);
  border-color: rgb(1, 197, 186);
}

.status-toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s ease;
  pointer-events: none;
}
.status-toggle[data-active="1"] .status-toggle-thumb {
  transform: translateX(20px);
}

.status-toggle-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(33, 35, 34, 0.4);
  transition: color 0.15s;
  user-select: none;
}
.status-toggle[data-active="1"] ~ .status-toggle-label {
  color: rgb(1, 197, 186);
}

/* ================================================
   Dark mode — CSS custom properties override
   Activado automáticamente por prefers-color-scheme
   o manualmente añadiendo data-theme="dark" al <html>
   ================================================ */

/* ── Dark mode ────────────────────────────────────────────────────────────────
   Activado manualmente con el botón de luna (JS escribe data-theme="dark" en <html>).
   Por defecto siempre se arranca en modo claro.

   Paleta:
     Fondo body / nav / sidebar : #202222  (sin cambio — ya son dark by design)
     Superficie card             : #2c2e2e  (ligeramente más claro para distinguirse)
     Superficie elevada (inputs) : #323434
     Texto principal             : #ffffff
     Texto secundario            : rgba(255,255,255,.55)
     Borde                       : rgba(255,255,255,.08)
   ─────────────────────────────────────────────────────────────────────────── */

/* Nav y sidebar: SIN CAMBIO — body, nav y aside son #202222 en ambos modos   */

/* Área de contenido principal */
[data-theme="dark"] main                    { background: #161818; color: #ffffff; }
[data-theme="dark"] .app-content            { color: #ffffff; }

/* Cards y paneles */
[data-theme="dark"] .app-card               { background: #2c2f2f; border-color: rgba(255,255,255,.13); box-shadow: 0 2px 12px rgba(0,0,0,.45); }
[data-theme="dark"] .app-card-header        { border-color: rgba(255,255,255,.10); }
[data-theme="dark"] .app-card-label         { color: rgba(255,255,255,.5); }
[data-theme="dark"] .stat-card              { background: #2c2f2f; border-color: rgba(255,255,255,.13); box-shadow: 0 2px 12px rgba(0,0,0,.45); }
[data-theme="dark"] .stat-card-name         { color: rgba(255,255,255,.55); }
[data-theme="dark"] .stat-card-sub          { color: rgba(255,255,255,.45); }
[data-theme="dark"] .stat-card h4,
[data-theme="dark"] .stat-card h4 *         { color: #ffffff !important; }

/* Tipografía del contenido */
[data-theme="dark"] .page-header h3         { color: #ffffff; }
[data-theme="dark"] .page-subtitle          { color: rgba(255,255,255,.45); }

/* Enlaces solo dentro del contenido principal, nunca en nav, sidebar ni botones */
[data-theme="dark"] main a:not(.btn):not([class*="btn-"]) { color: #4dcfc9; }
[data-theme="dark"] main a:not(.btn):not([class*="btn-"]):hover { color: #7ef2ea; }

/* Botones .btn: texto oscuro sobre teal, igual que modo claro */
[data-theme="dark"] .btn                    { color: rgb(32,34,34) !important; }
/* btn-ghost: texto blanco visible sobre fondo oscuro */
[data-theme="dark"] .btn-ghost              { color: rgba(255,255,255,.85) !important; }
[data-theme="dark"] .btn-ghost:hover        { color: #01c5ba !important; }

/* Labels y texto de controles DataTables */
[data-theme="dark"] .dataTables_filter label,
[data-theme="dark"] .dataTables_filter,
[data-theme="dark"] .dataTables_length label,
[data-theme="dark"] .dataTables_length,
[data-theme="dark"] .dataTables_info,
[data-theme="dark"] .dt-layout-row,
[data-theme="dark"] .dt-search label,
[data-theme="dark"] .dt-length label        { color: rgba(255,255,255,.7) !important; }

/* Botones de exportación CSV/Excel */
[data-theme="dark"] .dt-buttons .dt-button  { background: #2c2f2f !important; border-color: rgba(255,255,255,.15) !important; color: rgba(255,255,255,.8) !important; }
[data-theme="dark"] .dt-buttons .dt-button:hover { background: #3a3d3d !important; color: #ffffff !important; }

/* Botones */
[data-theme="dark"] .btn-ghost              { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: rgba(255,255,255,.8); }
[data-theme="dark"] .btn-ghost:hover        { background: rgba(1,197,186,.15); border-color: #01c5ba; color: #01c5ba; }

/* Formularios */
[data-theme="dark"] .form-field label                  { color: rgba(255,255,255,.6); }
[data-theme="dark"] .app-form .password-toggle         { color: rgba(255,255,255,.4); }
[data-theme="dark"] .app-form .password-toggle:hover   { background: rgba(1,197,186,.12); color: #4dcfc9; }
[data-theme="dark"] input,
[data-theme="dark"] textarea                { background: #212322 !important; border-color: rgba(255,255,255,.14) !important; color: #ffffff !important; }
[data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="datetime-local"],
[data-theme="dark"] input[type="time"]      { color-scheme: dark; }
[data-theme="dark"] select                  { -webkit-appearance:none; -moz-appearance:none; appearance:none; background-color: #212322 !important; background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 0.75rem center !important; background-size: 1rem 1rem !important; padding-right: 2.5rem !important; border-color: rgba(255,255,255,.14) !important; color: #ffffff !important; }
[data-theme="dark"] input::placeholder      { color: rgba(255,255,255,.3) !important; }
[data-theme="dark"] .section-label         { color: #ffffff !important; }
[data-theme="dark"] .form-section-title    { color: #ffffff !important; }
[data-theme="dark"] .section-divider       { border-color: rgba(255,255,255,.08); }
[data-theme="dark"] .form-feedback.success  { background: rgba(1,197,186,.1); color: #4dcfc9; }
[data-theme="dark"] .form-feedback.error    { background: rgba(220,53,69,.1); color: #f28f98; }

/* Filtro de fechas */
[data-theme="dark"] .log-date-filter        { background: rgba(255,255,255,.02); border-color: rgba(255,255,255,.06); }
[data-theme="dark"] .log-date-filter label  { color: rgba(255,255,255,.5); }

/* DataTables — interior en modo claro para máxima legibilidad */
[data-theme="dark"] .dataTables_wrapper                        { color: #ffffff; }

/* Cabecera de tabla: oscura con texto blanco */
[data-theme="dark"] table.dataTable thead th                   { background: #212322 !important; color: rgba(255,255,255,.8) !important; border-color: rgba(255,255,255,.1) !important; }
[data-theme="dark"] .dataTables_scrollHeadInner table thead th { background: #212322 !important; color: rgba(255,255,255,.8) !important; }

/* Inputs de filtro de columna (en el thead): también oscuros */

/* Cuerpo de tabla: gris oscuro, texto blanco */
[data-theme="dark"] table.dataTable tbody tr                   { background: #2c2f2f !important; }
[data-theme="dark"] table.dataTable tbody tr:nth-child(even)   { background: #272a2a !important; }
[data-theme="dark"] table.dataTable tbody tr:hover             { background: #373b3b !important; }
[data-theme="dark"] table.dataTable tbody td                   { border-color: rgba(255,255,255,.05) !important; color: #ffffff !important; }
html[data-theme="dark"] table.dataTable tbody td.dataTables_empty,
html[data-theme="dark"] table.dataTable tbody tr td.dataTables_empty { color: #ffffff !important; background: transparent !important; }
.td-muted { font-size: .8em; color: rgba(33,35,34,.3); }
[data-theme="dark"] .td-muted { color: rgba(255,255,255,.3) !important; }
[data-theme="dark"] .app-card-table table.dataTable td button,
[data-theme="dark"] .app-card-table table.dataTable td .btn-large    { background: rgba(255,255,255,.07) !important; border-color: rgba(255,255,255,.14) !important; color: rgba(255,255,255,.75) !important; }
[data-theme="dark"] .app-card-table table.dataTable td button:hover,
[data-theme="dark"] .app-card-table table.dataTable td .btn-large:hover { background: rgba(1,197,186,.18) !important; border-color: #01c5ba !important; color: #01c5ba !important; }
[data-theme="dark"] .app-card-table table.dataTable td button:last-of-type:hover { background: rgba(220,53,69,.15) !important; border-color: rgba(220,53,69,.6) !important; color: #f87171 !important; }

/* Controles externos: búsqueda global, longitud, paginación */
[data-theme="dark"] .dataTables_filter input,
[data-theme="dark"] .dt-search input,
[data-theme="dark"] .app-card-table .dt-search input           { background: #2c2f2f !important; border-color: rgba(255,255,255,.15) !important; color: rgba(255,255,255,.8) !important; }
[data-theme="dark"] .dataTables_filter input::placeholder,
[data-theme="dark"] .dt-search input::placeholder,
[data-theme="dark"] .app-card-table .dt-search input::placeholder { color: rgba(255,255,255,.35) !important; }
[data-theme="dark"] .dataTables_length select,
[data-theme="dark"] .app-card-table .dt-length select,
[data-theme="dark"] .dt-length select                          { background-color: #2c2f2f !important; border-color: rgba(255,255,255,.15) !important; color: rgba(255,255,255,.8) !important; }
[data-theme="dark"] .dataTables_info,
[data-theme="dark"] .app-card-table .dt-info,
[data-theme="dark"] .dt-info                                   { color: rgba(255,255,255,.5) !important; }
[data-theme="dark"] .app-card-table .dt-paging .dt-paging-button                        { background: rgba(255,255,255,.06) !important; color: rgba(255,255,255,.7) !important; border-color: rgba(255,255,255,.1) !important; }
[data-theme="dark"] .app-card-table .dt-paging .dt-paging-button:hover                  { background: rgba(255,255,255,.12) !important; color: #fff !important; }
[data-theme="dark"] .app-card-table .dt-paging .dt-paging-button.current,
[data-theme="dark"] .app-card-table .dt-paging .dt-paging-button.current:hover          { background: #01c5ba !important; color: #fff !important; border-color: #01c5ba !important; }
[data-theme="dark"] .app-card-table .dt-paging .dt-paging-button.disabled,
[data-theme="dark"] .app-card-table .dt-paging .dt-paging-button.disabled:hover         { background: rgba(255,255,255,.03) !important; color: rgba(255,255,255,.2) !important; border-color: rgba(255,255,255,.06) !important; cursor: default; }

/* Badges en tablas */
[data-theme="dark"] .badge-success { background: rgba(1,197,186,.18);  color: #4dcfc9; }
[data-theme="dark"] .badge-info    { background: rgba(39,122,255,.18); color: #7eb3f2; }
[data-theme="dark"] .badge-warning { background: rgba(250,176,5,.18);  color: #f2d07e; }
[data-theme="dark"] .badge-danger  { background: rgba(220,53,69,.18);  color: #f28f98; }
[data-theme="dark"] .badge-active   { background: rgba(1,197,186,.18);   color: #4dcfc9; }
[data-theme="dark"] .badge-inactive { background: rgba(255,255,255,.08); color: rgba(255,255,255,.45); }

/* Dashboard: tabla reciente y badges de eventos */
[data-theme="dark"] .dash-section-title  { color: rgba(255,255,255,.4); }
[data-theme="dark"] .recent-table th     { color: rgba(255,255,255,.45); border-color: rgba(255,255,255,.08); }
[data-theme="dark"] .recent-table td     { color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.05); }
[data-theme="dark"] .ev-login            { background: rgba(1,197,186,.15);   color: #4dcfc9; }
[data-theme="dark"] .ev-login_failed     { background: rgba(220,53,69,.15);   color: #f28f98; }
[data-theme="dark"] .ev-logout           { background: rgba(255,255,255,.08); color: rgba(255,255,255,.5); }
[data-theme="dark"] .ev-create           { background: rgba(39,122,255,.15);  color: #7eb3f2; }
[data-theme="dark"] .ev-update           { background: rgba(250,176,5,.15);   color: #f2d07e; }
[data-theme="dark"] .ev-delete           { background: rgba(220,53,69,.15);   color: #f28f98; }
[data-theme="dark"] .ev-password_change  { background: rgba(250,176,5,.15);   color: #f2d07e; }
[data-theme="dark"] .ev-dept_create,
[data-theme="dark"] .ev-dept_update,
[data-theme="dark"] .ev-dept_delete      { background: rgba(39,122,255,.15);  color: #7eb3f2; }

/* Modal (crud-modal) */
[data-theme="dark"] .crud-modal-dialog      { background: #2c2f2f; border: 1px solid rgba(255,255,255,.12); }
[data-theme="dark"] .crud-modal-title       { color: #ffffff; }
[data-theme="dark"] .crud-modal-close       { color: rgba(255,255,255,.6); }
[data-theme="dark"] .crud-modal-close:hover { background: rgba(255,255,255,.08); color: #ffffff; }
[data-theme="dark"] .crud-modal-header      { border-bottom-color: rgba(255,255,255,.1); }
[data-theme="dark"] .crud-modal-footer      { border-top-color: rgba(255,255,255,.1); }
[data-theme="dark"] #statusRow             { border-top-color: rgba(255,255,255,.1) !important; color: #ffffff; }
/* Toggle desactivado en dark */
[data-theme="dark"] .status-toggle                          { background: rgba(255,255,255,.2); border-color: rgba(255,255,255,.3); }
[data-theme="dark"] .status-toggle .status-toggle-thumb     { background: #ffffff; }
[data-theme="dark"] .status-toggle[data-active="1"]         { background: rgb(1,197,186); border-color: rgb(1,197,186); }
[data-theme="dark"] .status-toggle-label                    { color: rgba(255,255,255,.6); }
[data-theme="dark"] .status-toggle[data-active="1"] ~ .status-toggle-label { color: rgb(1,197,186); }
[data-theme="dark"] .crud-modal-body        { color: rgba(255,255,255,.85); }
/* Inputs dentro del modal en dark */
[data-theme="dark"] .crud-modal-body input,
[data-theme="dark"] .crud-modal-body select,
[data-theme="dark"] .crud-modal-body textarea { background: #383c3c; border-color: rgba(255,255,255,.18); color: #ffffff; }
[data-theme="dark"] .crud-modal-body select   { background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
[data-theme="dark"] .crud-modal-body input::placeholder,
[data-theme="dark"] .crud-modal-body textarea::placeholder { color: rgba(255,255,255,.35); }
[data-theme="dark"] .crud-modal-body label   { color: rgba(255,255,255,.75); }
[data-theme="dark"] .crud-modal-body .section-label { color: #ffffff !important; }
[data-theme="dark"] .crud-modal-body .form-hint { color: rgba(255,255,255,.4); }
/* Select options */
[data-theme="dark"] .crud-modal-body select option { background: #2c2f2f; color: #ffffff; }
[data-theme="dark"] .app-form select option        { background: #2c2f2f; color: #ffffff; }
[data-theme="dark"] .app-form select               { color-scheme: dark; }

/* Modal (app-modal-box legacy) */
[data-theme="dark"] .app-modal-box          { background: #2c2f2f; border: 1px solid rgba(255,255,255,.12); }
[data-theme="dark"] .locker-card                  { background: #212322; border-color: rgba(255,255,255,.25); box-shadow: none; }
[data-theme="dark"] .locker-card-status-wrap      { border-left-color: rgba(255,255,255,.08); }
[data-theme="dark"] .locker-card-eyebrow   { color: rgba(255,255,255,.45); }
[data-theme="dark"] .locker-card-name      { color: #ffffff; }
[data-theme="dark"] .locker-card-status                { background: rgba(255,255,255,.08); color: rgba(255,255,255,.5); }
[data-theme="dark"] .locker-card-status.s-close        { background: rgba(39,122,255,.15);  color: #7eb3f2; }
[data-theme="dark"] .locker-card-status.s-open         { background: rgba(250,176,5,.18);   color: #f2d07e; }
[data-theme="dark"] .locker-card-status.s-error        { background: rgba(220,53,69,.15);   color: #f28f98; }
[data-theme="dark"] .locker-card-status.s-loading      { background: rgba(16,185,129,.15);  color: #4ade80; }
[data-theme="dark"] .locker-card-icon                  { background: rgba(1,197,186,.12);   color: #4dcfc9; }
[data-theme="dark"] .locker-card-icon.dept             { background: rgba(39,122,255,.12);  color: #7eb3f2; }
[data-theme="dark"] .locker-card-actions .btn          { color: rgba(255,255,255,.85); }
[data-theme="dark"] .app-modal-title        { color: #ffffff; }
[data-theme="dark"] .app-modal-body         { color: rgba(255,255,255,.65); }

/* Toasts */
[data-theme="dark"] .toast-success          { background:#0d3d38; color:#7ef2ea; border-color:rgba(1,197,186,.3); }
[data-theme="dark"] .toast-error            { background:#3d0d11; color:#f28f98; border-color:rgba(220,53,69,.3); }
[data-theme="dark"] .toast-info             { background:#0d1d3d; color:#7eb3f2; border-color:rgba(39,122,255,.3); }
[data-theme="dark"] .toast-warning          { background:#3d2e00; color:#f2d07e; border-color:rgba(250,176,5,.3); }

/* 2FA section text */
.twofa-title { font-size:.875rem; font-weight:600; color:rgba(33,35,34,.8); }
.twofa-desc  { font-size:.75rem;  color:rgba(33,35,34,.5); margin-top:.2rem; }
[data-theme="dark"] .twofa-title { color:rgba(255,255,255,.6); font-weight:400; }
[data-theme="dark"] .twofa-desc  { color:rgba(255,255,255,.38); }


[data-theme="dark"] .empty-state { color: rgba(255, 255, 255, .6); }

/* Dark mode toggle button */
#btnDarkToggle {
  position: fixed; bottom: 1.25rem; left: 1.25rem; z-index: 9998;
  width: 40px; height: 40px; border-radius: 50%;
  border: 1px solid rgba(33,35,34,.15); background: rgba(255,255,255,.9);
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 12px rgba(0,0,0,.12); transition: background .2s, border-color .2s, color .2s;
  padding: 0; color: rgba(33,35,34,.7);
}
/* Fila de filtros individuales en thead */
html[data-theme="dark"] table.dataTable thead tr.filters th,
html[data-theme="dark"] table.dataTable thead tr.filters td { background: #1e2121 !important; border-bottom-color: rgba(255,255,255,.08) !important; }

/* Inputs de filtro de columna en thead — deben ir AL FINAL para ganar a la regla general de inputs */
html[data-theme="dark"] table.dataTable thead th input,
html[data-theme="dark"] table.dataTable thead td input,
html[data-theme="dark"] table.dataTable thead tr.filters input,
html[data-theme="dark"] table.dataTable thead tr.filters select { background: #2c2f2f !important; border-color: rgba(255,255,255,.15) !important; color: rgba(255,255,255,.8) !important; }
html[data-theme="dark"] table.dataTable thead tr.filters select { background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23cccccc' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 0.3rem center !important; background-size: 0.85rem 0.85rem !important; padding-right: 1.4rem !important; }
html[data-theme="dark"] table.dataTable thead th input::placeholder,
html[data-theme="dark"] table.dataTable thead td input::placeholder,
html[data-theme="dark"] table.dataTable thead tr.filters input::placeholder { color: rgba(255,255,255,.35) !important; }
html[data-theme="dark"] table.dataTable thead tr.filters input:hover,
html[data-theme="dark"] table.dataTable thead tr.filters select:hover       { background: #353939 !important; border-color: rgba(255,255,255,.25) !important; }
html[data-theme="dark"] table.dataTable thead tr.filters input:focus,
html[data-theme="dark"] table.dataTable thead tr.filters select:focus        { background: #2c2f2f !important; border-color: rgba(1,197,186,.6) !important; box-shadow: 0 0 0 3px rgba(1,197,186,.15) !important; color: rgba(255,255,255,.9) !important; }

[data-theme="dark"] #btnDarkToggle {
  background: #ffffff; border-color: rgba(255,255,255,.2); color: rgba(33,35,34,.8);
}
[data-theme="dark"] #btnDarkToggle:hover {
  background: #f0f0f0;
}

/* Table fade-in on first data load */
.app-card-table {
  opacity: 0;
  transition: opacity 0.22s ease;
}
.app-card-table.dt-loaded {
  opacity: 1;
}

/* Page fade-in for non-table pages */
.page-fade {
  opacity: 0;
  transition: opacity 0.25s ease;
}
.page-fade.page-loaded {
  opacity: 1;
}

/* ================================================
   about.php
   ================================================ */
.about-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
	max-width: 760px;
}
@media (max-width: 720px) {
	.about-grid { grid-template-columns: 1fr; }
}
.about-card {
	max-width: 760px;
}
.info-row {
	display: flex;
	align-items: flex-start;
	gap: 0.875rem;
	padding: 0.75rem 0;
	border-bottom: 1px solid rgba(33,35,34,0.07);
	font-size: 0.9rem;
}
.info-row:last-child { border-bottom: none; }
.info-row-icon {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	border-radius: 8px;
	background: rgba(1,197,186,0.10);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #01c5ba;
}
.info-row-label {
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: rgba(33,35,34,0.38);
	margin-bottom: 0.15rem;
}
.info-row-value {
	font-size: 0.9375rem;
	color: rgba(33,35,34,0.85);
	font-weight: 500;
	word-break: break-all;
}
.info-row-value a {
	color: #01c5ba;
	text-decoration: none;
}
.info-row-value a:hover { text-decoration: underline; }

.section-label {
	font-size: 0.6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: rgba(33,35,34,0.38);
	margin-bottom: 1rem;
}
.section-divider {
	border: none;
	border-top: 1px solid rgba(33,35,34,0.08);
	margin: 1.5rem 0;
}
.app-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.3rem 0.75rem;
	border-radius: 20px;
	font-size: 0.78rem;
	font-weight: 600;
	background: rgba(1,197,186,0.10);
	color: #007d76;
}
.app-badge.prod {
	background: rgba(25,135,84,0.10);
	color: #198754;
}
.app-badge.dev {
	background: rgba(255,153,0,0.12);
	color: #b36b00;
}

/* Dark mode */
[data-theme="dark"] .about-note { color: rgba(255,255,255,.55) !important; }
[data-theme="dark"] .info-row { border-color: rgba(255,255,255,0.07); }
[data-theme="dark"] .info-row-icon { background: rgba(1,197,186,0.15); }
[data-theme="dark"] .info-row-value { color: rgba(255,255,255,0.85); }
[data-theme="dark"] .info-row-label { color: rgba(255,255,255,0.35); }
[data-theme="dark"] .section-divider { border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .app-badge { background: rgba(1,197,186,0.15); color: #4dd9d0; }
[data-theme="dark"] .app-badge.prod { background: rgba(25,135,84,0.15); color: #4ec98c; }
[data-theme="dark"] .app-badge.dev  { background: rgba(255,153,0,0.15); color: #ffa733; }

/* ================================================
   maintenance.php
   ================================================ */
body.maintenance-body { display:flex; align-items:center; justify-content:center; min-height:100vh; background:var(--color-bg,#f5f7fa); }
.maint-card { background:#fff; border:1px solid rgba(33,35,34,.09); border-radius:16px; padding:3rem 2.5rem; max-width:480px; text-align:center; box-shadow:0 4px 32px rgba(33,35,34,.08); }
.maint-icon { width:72px; height:72px; margin:0 auto 1.5rem; display:flex; align-items:center; justify-content:center;
              background:rgba(1,197,186,.1); border-radius:50%; color:#01c5ba; }
.maint-title { font-size:1.5rem; font-weight:700; color:#212322; margin-bottom:.75rem; }
.maint-desc  { font-size:.9375rem; color:rgba(33,35,34,.55); line-height:1.65; margin-bottom:1.75rem; }
.maint-back  { font-size:.875rem; color:rgba(33,35,34,.4); margin-top:1.5rem; }
.maint-back a { color:#01c5ba; text-decoration:none; }

[data-theme="dark"] body.maintenance-body { background:#161818; }
[data-theme="dark"] .maint-card  { background:#2c2f2f; border-color:rgba(255,255,255,.13); box-shadow:0 4px 32px rgba(0,0,0,.45); }
[data-theme="dark"] .maint-title { color:#ffffff; }
[data-theme="dark"] .maint-desc  { color:rgba(255,255,255,.55); }
[data-theme="dark"] .maint-back  { color:rgba(255,255,255,.45); }

/* ================================================
   Páginas de log (user_log, admin_users_log,
   admin_lockers_log, user_locker_log) — compartido
   ================================================ */

.log-date-filter { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem .75rem;
				   padding:.75rem 1rem; border-bottom:1px solid rgba(33,35,34,.07);
				   background:rgba(33,35,34,.02); font-size:.8125rem; }
.log-date-filter label { font-weight:600; color:rgba(33,35,34,.55); white-space:nowrap; }
.log-date-filter input[type=date] { border:1px solid rgba(33,35,34,.15); border-radius:6px;
									padding:.3rem .6rem; font-size:.8125rem; color:rgba(33,35,34,.8);
									background:#fff; outline:none; cursor:pointer; }
.log-date-filter input[type=date]:focus { border-color:#01c5ba; box-shadow:0 0 0 2px rgba(1,197,186,.15); }

/* user_log.php — tarjetas de estadísticas */
.stat-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1rem; margin-bottom:1.5rem; }
.stat-cards .stat-card { background:var(--bg-1,#fff); border:1px solid rgba(33,35,34,.08); border-radius:10px; padding:1.1rem 1.25rem; display:flex; flex-direction:column; gap:.25rem; }
.stat-card-label { font-size:.72rem; font-weight:600; color:rgba(33,35,34,.45); text-transform:uppercase; letter-spacing:.04em; }
.stat-card-value { font-size:1.55rem; font-weight:700; color:var(--text-1,#212322); line-height:1.2; }
.stat-cards .stat-card-sub { font-size:.75rem; color:rgba(33,35,34,.45); }
[data-theme="dark"] .stat-cards .stat-card { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.08); }
[data-theme="dark"] .stat-card-label { color:rgba(255,255,255,.45); }
[data-theme="dark"] .stat-card-value { color:#fff; }
[data-theme="dark"] .stat-cards .stat-card-sub { color:rgba(255,255,255,.4); }

/* admin_users_log.php — columnas cliente/fingerprint */
#usersLogTable td:nth-child(10) { font-size:.75rem; line-height:1.5; white-space:nowrap; }
#usersLogTable td:nth-child(11) { font-family:monospace; font-size:.7rem;
								  max-width:120px; overflow:hidden;
								  text-overflow:ellipsis; white-space:nowrap; }

/* admin_lockers_log.php — columnas cliente/fingerprint */
#logTable td:nth-child(13) { font-size: .75rem; line-height: 1.5; white-space: nowrap; }
#logTable td:nth-child(14) { font-family: monospace; font-size: .7rem; max-width: 120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* ================================================
   reset_password.php
   ================================================ */
.reset-card { background: #fff; border: 1px solid rgba(33,35,34,.09); border-radius: 12px; padding: 2.5rem 2rem; box-shadow: 0 4px 32px rgba(33,35,34,.08); }
[data-theme="dark"] .reset-card { background: rgba(255,255,255,0.03); border-color: rgb(255,255,255); box-shadow: none; }
/* .pass-wrapper / .pass-toggle ya están definidos arriba (compartidos con login.php) */
.alert { display: flex; align-items: flex-start; gap: 0.5rem; padding: 0.75rem 1rem; border-radius: 8px; font-size: 0.875rem; line-height: 1.5; }
.alert-error   { background: rgba(239,70,111,0.08); border-left: 3px solid rgb(239,70,111); color: rgb(239,70,111); }
.alert-success { background: rgba(1,197,186,0.08);  border-left: 3px solid rgb(1,197,186);  color: rgb(0,185,175); }
.strength-bar { height: 4px; border-radius: 2px; margin-top: 6px; transition: all 0.25s; background: rgba(33,35,34,0.08); }
[data-theme="dark"] .strength-bar { background: rgba(255,255,255,0.1); }
.strength-bar.w-1 { width: 25%; background: rgb(239 70 111); }
.strength-bar.w-2 { width: 50%; background: rgb(250 176 5); }
.strength-bar.w-3 { width: 75%; background: rgb(0 185 175); }
.strength-bar.w-4 { width: 100%; background: rgb(1 197 186); }
.strength-hint { font-size: 0.75rem; color: rgba(33,35,34,0.45); margin-top: 4px; }
[data-theme="dark"] .strength-hint { color: rgba(255,255,255,0.4); }
@keyframes spin { to { transform: rotate(360deg); } }
.spin { animation: spin 0.7s linear infinite; }
.btn-spinner { display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; }

/* ================================================
   Toggle switch (user_config.php, admin_settings.php)
   ================================================ */
.toggle-switch { position:relative; display:inline-block; width:44px; height:24px; flex-shrink:0; }
.toggle-switch input { opacity:0; width:0; height:0; }
.toggle-slider { position:absolute; cursor:pointer; inset:0; background:rgba(33,35,34,.2); border-radius:24px; transition:.2s; }
.toggle-slider:before { content:''; position:absolute; width:18px; height:18px; left:3px; bottom:3px; background:#fff; border-radius:50%; transition:.2s; }
.toggle-switch input:checked + .toggle-slider { background:#01c5ba; }
.toggle-switch input:checked + .toggle-slider:before { transform:translateX(20px); }
[data-theme="dark"] .toggle-slider { background:rgba(255,255,255,.2); }
[data-theme="dark"] .toggle-slider:before { background:#fff; }

/* ================================================
   admin_settings.php
   ================================================ */
.settings-section { background:#fff; border:1px solid rgba(33,35,34,.09); border-radius:12px; padding:1.5rem; margin-bottom:1.5rem; }
.settings-section h4 { margin:0 0 1.25rem; font-size:1rem; font-weight:700; }
.policy-hint { font-size:.8125rem; color:rgba(33,35,34,.5); margin-top:.3rem; display:block; margin-bottom:.5rem; }
.toggle-row { display:flex; align-items:center; justify-content:space-between; padding:.6rem 0;
              border-bottom:1px solid rgba(33,35,34,.06); }
.toggle-row:last-child { border-bottom:none; }
.toggle-row label { font-size:.9rem; font-weight:500; }
.toggle-row small { font-size:.8rem; color:rgba(33,35,34,.5); display:block; }
input[type=number].pw-number { width:80px; border:1px solid rgba(33,35,34,.15); border-radius:8px;
                               padding:.4rem .6rem; font-size:.9rem; text-align:center; background:#fff; color:rgba(33,35,34,.85); }
/* Dark mode */
[data-theme="dark"] .settings-section { background:#2c2f2f; border-color:rgba(255,255,255,.1); }
[data-theme="dark"] .settings-section h4 { color:#fff; }
[data-theme="dark"] .policy-hint { color:rgba(255,255,255,.4); }
[data-theme="dark"] .toggle-row { border-bottom-color:rgba(255,255,255,.07); }
[data-theme="dark"] .toggle-row label { color:rgba(255,255,255,.85); }
[data-theme="dark"] .toggle-row small { color:rgba(255,255,255,.4); }
[data-theme="dark"] input[type=number].pw-number { background:#383c3c; border-color:rgba(255,255,255,.18); color:#fff; }

/* ================================================
   Incidencias (user_incidents.php, admin_incidents.php) — compartido
   ================================================ */
#incidentsTable_wrapper .dt-layout-row:first-child { justify-content: flex-end; }
.inc-badge { display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:100px;font-size:.6875rem;font-weight:700;white-space:nowrap }
.inc-status-open        { background:rgba(220,53,69,.10);  color:#b92e3c }
.inc-status-in_progress { background:rgba(250,176,5,.12);  color:#8a6400 }
.inc-status-resolved    { background:rgba(1,197,186,.12);  color:#007d76 }
.inc-status-closed      { background:rgba(33,35,34,.08);   color:#555 }
[data-theme="dark"] .inc-status-open        { background:rgba(220,53,69,.18);  color:#f28f98 }
[data-theme="dark"] .inc-status-in_progress { background:rgba(250,176,5,.18);  color:#f2d07e }
[data-theme="dark"] .inc-status-resolved    { background:rgba(1,197,186,.18);  color:#4dcfc9 }
[data-theme="dark"] .inc-status-closed      { background:rgba(255,255,255,.08);color:rgba(255,255,255,.45) }
.inc-filter-bar { display:flex;flex-wrap:wrap;gap:.4rem;padding:.75rem 1.25rem;border-bottom:1px solid var(--border-color, rgba(33,35,34,.07));justify-content:flex-start }
.inc-filter-btn { padding:.3rem .9rem;border-radius:100px;border:1px solid rgba(33,35,34,.15);background:transparent;font-size:.8125rem;cursor:pointer;transition:background .15s,color .15s,border-color .15s;color:rgba(33,35,34,.7) }
.inc-filter-btn:hover  { background:rgba(1,197,186,.1);border-color:#01c5ba;color:#007d76 }
.inc-filter-btn.active { background:#01c5ba;color:#fff;border-color:#01c5ba }
[data-theme="dark"] .inc-filter-bar        { border-bottom-color:rgba(255,255,255,.07) }
[data-theme="dark"] .inc-filter-btn        { border-color:rgba(255,255,255,.15);color:rgba(255,255,255,.6) }
[data-theme="dark"] .inc-filter-btn:hover  { background:rgba(1,197,186,.15);border-color:#01c5ba;color:#4dcfc9 }
[data-theme="dark"] .inc-filter-btn.active { background:#01c5ba;color:#fff;border-color:#01c5ba }

/* admin_incidents.php — específico */
.inc-user-name  { font-weight:600 }
.inc-user-email { font-size:.75rem;color:rgba(33,35,34,.45);margin-top:.1rem }
[data-theme="dark"] .inc-user-email { color:rgba(255,255,255,.38) }
.inc-detail-label { font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:rgba(33,35,34,.42);margin-bottom:.3rem }
.inc-detail-val   { font-size:.875rem;color:#212322;margin-bottom:.9rem }
.inc-desc-box     { font-size:.875rem;white-space:pre-wrap;background:rgba(33,35,34,.03);border-radius:8px;padding:.7rem .9rem;color:#212322;margin-bottom:.9rem }
.inc-status-sel   { width:100%;border:1px solid rgba(33,35,34,.15);border-radius:8px;padding:.45rem .65rem;font-size:.875rem;background:#fff;color:#212322;cursor:pointer;appearance:none;
                    background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23212322' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
                    background-repeat:no-repeat;background-position:right .6rem center;background-size:1rem;padding-right:2.2rem;margin-bottom:.9rem }
[data-theme="dark"] .inc-detail-label { color:rgba(255,255,255,.4) }
[data-theme="dark"] .inc-detail-val   { color:rgba(255,255,255,.85) }
[data-theme="dark"] .inc-desc-box     { background:rgba(255,255,255,.05);color:rgba(255,255,255,.85) }
[data-theme="dark"] .inc-status-sel   { background-color:#383c3c;border-color:rgba(255,255,255,.18);color:#fff;
                    background-image:url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") }
.inc-user-banner { background:rgba(39,122,255,.08);border:1px solid rgba(39,122,255,.18);border-radius:8px;padding:.6rem 1rem;font-size:.8125rem;color:#277aff }
[data-theme="dark"] .inc-user-banner { background:rgba(39,122,255,.13);border-color:rgba(39,122,255,.3);color:#7eb3f2 }

/* ================================================
   admin_status.php
   (clases .stat-* renombradas para no colisionar con
   .s-open/.s-close/.s-loading/.s-error/.s-dot del estado de lockers)
   ================================================ */
.status-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1rem; }
.status-card { background:#fff; border:1px solid rgba(33,35,34,.09); border-radius:12px; padding:1.1rem 1.25rem; }
.status-card-title { font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:rgba(33,35,34,.45); margin-bottom:.6rem; }
.status-row { display:flex; justify-content:space-between; align-items:center; padding:.3rem 0; border-bottom:1px solid rgba(33,35,34,.05); font-size:.825rem; }
.status-row:last-child { border-bottom:none; }
.status-row-label { color:rgba(33,35,34,.6); }
.status-row-val   { font-weight:600; color:#212322; }
.stat-ok    { color:#007d76 !important; }
.stat-error { color:#b92e3c !important; }
.stat-warn  { color:#8a6400 !important; }
.stat-dot   { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:.4rem; }
.stat-dot-ok    { background:#00c08b; }
.stat-dot-error { background:#e53935; }
.stat-dot-warn  { background:#f59e0b; }
.progress-bar-wrap { flex:1; background:rgba(33,35,34,.07); border-radius:100px; height:5px; overflow:hidden; margin-left:.75rem; max-width:80px; }
.progress-bar-fill { height:100%; border-radius:100px; }
/* Dark mode */
[data-theme="dark"] .status-card { background:#2c2f2f; border-color:rgba(255,255,255,.1); }
[data-theme="dark"] .status-card-title { color:rgba(255,255,255,.4); }
[data-theme="dark"] .status-row { border-bottom-color:rgba(255,255,255,.06); }
[data-theme="dark"] .status-row-label { color:rgba(255,255,255,.5); }
[data-theme="dark"] .status-row-val { color:rgba(255,255,255,.85); }
[data-theme="dark"] .stat-ok    { color:#4dcfc9 !important; }
[data-theme="dark"] .stat-error { color:#f28f98 !important; }
[data-theme="dark"] .stat-warn  { color:#f2d07e !important; }
[data-theme="dark"] .progress-bar-wrap { background:rgba(255,255,255,.1); }

/* ================================================
   admin_dashboard.php
   ================================================ */
.stats-row { display:flex; flex-wrap:wrap; gap:1rem; }
.stats-row .stat-card  { flex:1; min-width:200px; }
.dash-section-title { font-size:.6875rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--text-1); opacity:.45; margin-bottom:.75rem; }
.dash-muted { color:var(--text-1); opacity:.4; }

/* ── Tablas reciente y locker-usage ── */
.recent-table, .locker-usage-table { width:100%; border-collapse:collapse; font-size:.8125rem; color:var(--text-1); }
.recent-table th, .locker-usage-table th { font-size:.625rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; opacity:.5; padding:.4rem .75rem; text-align:left; border-bottom:1px solid var(--border-1); }
.locker-usage-table th { padding:.4rem .9rem; }
.recent-table td  { padding:.55rem .75rem; border-bottom:1px solid var(--border-1); opacity:.85; vertical-align:middle; }
.locker-usage-table td { padding:.5rem .9rem; border-bottom:1px solid var(--border-1); opacity:.85; vertical-align:middle; }
.recent-table tr:last-child td, .locker-usage-table tr:last-child td { border-bottom:none; }
.recent-table tbody tr:nth-child(even), .locker-usage-table tbody tr:nth-child(even) { background:var(--row-stripe); }
.recent-table tbody tr:hover, .locker-usage-table tbody tr:hover { background:rgba(1,197,186,.06); }
.recent-table .ev-badge { display:inline-block; padding:.15rem .5rem; border-radius:100px; font-size:.625rem; font-weight:700; white-space:nowrap; opacity:1 !important; }
.recent-loading { opacity:.4; }

/* ── Event badges ── */
.ev-login          { background:rgba(1,197,186,.12);  color:#009e8c; }
.ev-login_failed   { background:rgba(220,53,69,.12);  color:rgb(185,46,60); }
.ev-logout         { background:var(--border-1);       color:var(--text-1); opacity:.6; }
.ev-create         { background:rgba(39,122,255,.12);  color:#277aff; }
.ev-update         { background:rgba(250,176,5,.14);   color:#8a6400; }
.ev-delete         { background:rgba(220,53,69,.12);   color:rgb(185,46,60); }
.ev-password_change{ background:rgba(250,176,5,.14);   color:#8a6400; }
.ev-dept_create, .ev-dept_update, .ev-dept_delete { background:rgba(39,122,255,.1); color:#277aff; }
[data-theme="dark"] .ev-logout         { color:rgba(255,255,255,.55); }
[data-theme="dark"] .ev-update         { background:rgba(250,176,5,.18); color:#f2d07e; }
[data-theme="dark"] .ev-password_change{ background:rgba(250,176,5,.18); color:#f2d07e; }
[data-theme="dark"] .ev-dept_create, [data-theme="dark"] .ev-dept_update, [data-theme="dark"] .ev-dept_delete { background:rgba(39,122,255,.18); color:#7eb3f2; }

/* ── Stats ── */
.stat-inuse  { color:#277aff; font-weight:700; }
.stat-free   { color:#009e8c; font-weight:700; }
.dash-stat-warn { color:rgb(185,46,60); font-weight:700; }

/* ── Quick search ── */
.qs-result-item { display:flex; align-items:center; gap:.75rem; padding:.55rem .75rem; border-bottom:1px solid var(--border-1); color:var(--text-1); text-decoration:none; }
.qs-result-item:hover { background:rgba(1,197,186,.07); }
.qs-result-type { font-size:.65rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; padding:1px 6px; border-radius:4px; white-space:nowrap; flex-shrink:0; }
.qs-result-type-user   { background:rgba(39,122,255,.12); color:#277aff; }
.qs-result-type-locker { background:rgba(1,197,186,.12);  color:#009e8c; }
.qs-result-type-other  { background:var(--border-1); color:var(--text-1); opacity:.7; }
.qs-result-sub { font-size:.75rem; opacity:.5; }

/* ── Incidencias mini stats ── */
.inc-mini-stat { text-align:center; padding:.6rem .5rem; border-radius:8px; }
.inc-mini-val  { font-size:1.625rem; font-weight:800; line-height:1.1; margin-bottom:.2rem; }
.inc-mini-lbl  { font-size:.6875rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; opacity:.7; }
.inc-open-bg   { background:rgba(220,53,69,.08); }
.inc-prog-bg   { background:rgba(250,176,5,.09); }
.inc-res-bg    { background:rgba(1,197,186,.09); }
.inc-clo-bg    { background:var(--row-stripe); }
.inc-clo-val   { color:var(--text-1); opacity:.45; }
[data-theme="dark"] .inc-open-bg { background:rgba(220,53,69,.18); }
[data-theme="dark"] .inc-prog-bg { background:rgba(250,176,5,.15); }
[data-theme="dark"] .inc-res-bg  { background:rgba(1,197,186,.15); }

/* ── Responsive ── */
@media (max-width:680px) { #chartsRow, #chartsRow2, #incLockerRow { grid-template-columns:1fr !important; } }

/* ================================================
   admin_lockers.php
   ================================================ */
.lk-modal-overlay { display:none;position:fixed;inset:0;z-index:1001;background:rgba(0,0,0,.45);align-items:center;justify-content:center;backdrop-filter:blur(2px) }
.lk-modal-box { background:var(--bg-1,#fff);border:1px solid rgba(33,35,34,.09);border-radius:14px;padding:0;box-shadow:0 20px 60px rgba(0,0,0,.22);overflow:hidden }
[data-theme="dark"] .lk-modal-box { background:#2c2f2f;border-color:rgba(255,255,255,.12) }
.lk-modal-header { display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem .75rem;border-bottom:1px solid rgba(33,35,34,.07) }
[data-theme="dark"] .lk-modal-header { border-bottom-color:rgba(255,255,255,.1) }
.lk-modal-title { font-weight:700;font-size:.9375rem;color:var(--text-1,#212322) }
[data-theme="dark"] .lk-modal-title { color:#fff }
.lk-modal-close { background:none;border:none;cursor:pointer;padding:.25rem;color:rgba(33,35,34,.45);line-height:0;border-radius:6px;transition:background .12s,color .12s }
.lk-modal-close:hover { background:rgba(33,35,34,.07);color:#212322 }
[data-theme="dark"] .lk-modal-close { color:rgba(255,255,255,.5) }
[data-theme="dark"] .lk-modal-close:hover { background:rgba(255,255,255,.08);color:#fff }
.lk-modal-body { padding:1.1rem 1.25rem }
.lk-modal-footer { display:flex;gap:.5rem;padding:.75rem 1.25rem 1.1rem;justify-content:space-between;border-top:1px solid rgba(33,35,34,.07) }
[data-theme="dark"] .lk-modal-footer { border-top-color:rgba(255,255,255,.1) }
.lk-current-user { font-size:.8125rem;color:rgba(33,35,34,.55);margin-bottom:.85rem }
[data-theme="dark"] .lk-current-user { color:rgba(255,255,255,.5) }
/* History table */
.history-table { width:100%;border-collapse:collapse;font-size:.8rem }
.history-table thead tr { border-bottom:1px solid rgba(33,35,34,.08) }
[data-theme="dark"] .history-table thead tr { border-bottom-color:rgba(255,255,255,.1) }
.history-table th { text-align:left;padding:.3rem .5rem;font-size:.625rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:rgba(33,35,34,.4) }
[data-theme="dark"] .history-table th { color:rgba(255,255,255,.4) }
.history-table tr { border-bottom:1px solid rgba(33,35,34,.04) }
[data-theme="dark"] .history-table tr { border-bottom-color:rgba(255,255,255,.06) }
.history-table td { padding:.35rem .5rem;color:rgba(33,35,34,.85) }
[data-theme="dark"] .history-table td { color:rgba(255,255,255,.8) }
.history-date,.history-muted { font-size:.75rem;white-space:nowrap }
.history-date { color:rgba(33,35,34,.6) }
.history-muted { color:rgba(33,35,34,.5) }
[data-theme="dark"] .history-date { color:rgba(255,255,255,.5) }
[data-theme="dark"] .history-muted { color:rgba(255,255,255,.4) }
.history-empty { color:rgba(33,35,34,.35);font-size:.8125rem;text-align:center;padding:.75rem 0 }
[data-theme="dark"] .history-empty { color:rgba(255,255,255,.3) }

/* admin_lockers.php — vista mosaico (kanban) */
.lk-kanban-card { border-radius:10px; padding:.75rem .875rem; min-width:110px; max-width:150px; flex:1; cursor:default; }
.lk-kanban-card.is-inactive { background:rgba(156,163,175,.08); border:1.5px solid rgba(156,163,175,.25); }
.lk-kanban-card.is-inuse    { background:rgba(39,122,255,.07);  border:1.5px solid rgba(39,122,255,.3); }
.lk-kanban-card.is-free     { background:rgba(1,197,186,.07);   border:1.5px solid rgba(1,197,186,.3); }
[data-theme="dark"] .lk-kanban-card.is-inactive { background:rgba(156,163,175,.12); border-color:rgba(156,163,175,.32); }
[data-theme="dark"] .lk-kanban-card.is-inuse    { background:rgba(39,122,255,.15);  border-color:rgba(39,122,255,.4); }
[data-theme="dark"] .lk-kanban-card.is-free     { background:rgba(1,197,186,.15);   border-color:rgba(1,197,186,.4); }
.lk-kanban-name     { font-weight:800; font-size:.8125rem; color:var(--text-1); letter-spacing:.02em; }
.lk-kanban-assignee { font-size:.6875rem; color:var(--text-1); opacity:.55; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:120px; }
.lk-kanban-empty    { font-size:.6875rem; color:var(--text-1); opacity:.35; }

/* ================================================
   admin_lockers_test.php
   ================================================ */
.locker-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}
@media (max-width: 640px) { .locker-grid { grid-template-columns: 1fr; } }

.locker-column-header {
	font-size: 0.6875rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: rgba(33, 35, 34, 0.4);
	padding: 0.5rem 0 0.5rem;
	border-bottom: 1px solid rgba(33, 35, 34, 0.08);
	margin-bottom: 0.25rem;
}

.locker-row {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.35rem 0;
	border-bottom: 1px solid rgba(33, 35, 34, 0.05);
}
.locker-row:last-child { border-bottom: none; }

.locker-id {
	font-size: 0.75rem;
	font-weight: 700;
	font-family: monospace;
	color: rgba(33, 35, 34, 0.65);
	min-width: 4.5rem;
}

.locker-status-display {
	flex: 1;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 1.5rem;
	padding: 0.15rem 0.6rem;
	border-radius: 100px;
	font-size: 0.625rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	white-space: nowrap;
	background: rgba(33, 35, 34, 0.07);
	color: rgba(33, 35, 34, 0.4);
	transition: background 0.2s, color 0.2s;
}
.locker-status-display.s-close   { background: rgba(39,122,255,0.12); color: #277aff; }
.locker-status-display.s-open    { background: rgba(250,176,5,0.15); color: #8a6400; }
.locker-status-display.s-error   { background: rgba(220,53,69,0.1);   color: rgb(185,46,60); }
.locker-status-display.s-loading { background: rgba(16,185,129,0.12);  color: #047857; }

/* Auto-refresh toggle button */
#btnAutoRefresh.active {
	background: rgba(1, 197, 186, 0.12);
	color: rgb(0, 125, 118);
	border-color: rgba(1, 197, 186, 0.35);
}

/* Dark mode */
[data-theme="dark"] .locker-column-header {
	color: #ffffff;
	border-bottom-color: rgba(255,255,255,.1);
}
[data-theme="dark"] .locker-id {
	color: rgba(255,255,255,.75);
}
[data-theme="dark"] .locker-status-display {
	background: rgba(255,255,255,.1);
	color: rgba(255,255,255,.6);
}
[data-theme="dark"] .locker-status-display.s-close { background: rgba(39,122,255,.2); color: #7eb3f2; }
[data-theme="dark"] .locker-status-display.s-open  { background: rgba(250,176,5,.22); color: #f2d07e; }
[data-theme="dark"] .locker-status-display.s-error   { background: rgba(220,53,69,.2);   color: #f28f98; }
[data-theme="dark"] .locker-status-display.s-loading { background: rgba(16,185,129,.2);   color: #4ade80; }

/* ================================================
   Punto del icono de notificaciones (nav.inc.php)
   Oculto por defecto: solo se muestra si hay notificaciones (notifications_poll.js)
   ================================================ */
.notif-dot { background-color: rgb(1 197 186); display: none; }

/* ================================================
   about.php — adiciones
   ================================================ */
.xelab-logo-light { height:32px; width:auto; display:block; }
.xelab-logo-dark  { height:32px; width:auto; display:none; }
.about-note { font-size:.825rem; color:rgba(33,35,34,.45); line-height:1.6; }
.info-row-icon--warn    { background:rgba(255,153,0,.10); color:#b36b00; }
.info-row-icon--success { background:rgba(37,211,102,.12); color:#1a9e4a; }
.wa-link { display:inline-flex; align-items:center; gap:.3rem; font-size:.8rem; color:#1a9e4a; text-decoration:none; }
.wa-link:hover { text-decoration:underline; }
.about-phone { margin-right:.75rem; }
.about-company-name { margin-bottom:1.25rem; font-weight:600; font-size:1rem; }
[data-theme="dark"] .xelab-logo-light { display:none; }
[data-theme="dark"] .xelab-logo-dark  { display:block; }

/* ================================================
   login.php / reset_password.php
   ================================================ */
.noscript-bar { position:fixed; top:0; left:0; right:0; background:rgb(239 70 111); color:#fff; text-align:center; padding:.75rem; font-size:.875rem; z-index:9999; }
.auth-container { max-width:420px; }
.auth-logo { height:48px; }
.auth-title { font-size:1.75rem; }
.auth-subtitle { opacity:.5; }
.auth-hint { font-size:.875rem; opacity:.65; margin:0; line-height:1.55; }
.otp-input { letter-spacing:.3em; font-size:1.5rem; text-align:center; font-family:monospace; }
.btn-block { width:100%; margin-top:.25rem; }
.auth-back-link { font-size:.875rem; opacity:.45; }
.auth-back-link a { color:inherit; }
.form-row-between { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.toggle-label { display:flex; align-items:center; gap:.4rem; font-size:.8rem; cursor:pointer; user-select:none; }
.toggle-sm { transform:scale(.8); transform-origin:right center; }

/* ================================================
   PLC status bar (admin_lockers.php, admin_lockers_test.php)
   ================================================ */
.plc-status-bar  { align-items:center; font-size:.8rem; padding:.55rem .9rem; border-radius:8px; margin-bottom:-.5rem; flex-wrap:wrap; }
.plc-status-item { display:flex; align-items:center; gap:.45rem; }
.plc-status-dot  { width:8px; height:8px; border-radius:50%; flex:none; display:inline-block; background:#aaa; }
.plc-status-text { opacity:.7; }
.plc-retry-btn   { margin-left:auto; background:none; border:none; cursor:pointer; opacity:.55; padding:0; line-height:1; }

/* ================================================
   admin_settings.php — layout
   ================================================ */
.settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; align-items:start; }
.settings-col  { display:flex; flex-direction:column; gap:1.5rem; }
.textarea-auto { width:100%; resize:none; overflow:hidden; field-sizing:content; }
@media (max-width:720px) { .settings-grid { grid-template-columns:1fr; } }

/* ================================================
   Alerta sistema (user_incidents.php, admin_incidents.php, user_config.php)
   ================================================ */
.system-alert         { display:flex; align-items:flex-start; gap:.6rem; padding:.75rem 1rem .75rem 1.1rem; border-radius:8px; font-size:.85rem; }
.system-alert--danger { border:1px solid rgba(220,38,38,.35); background:rgba(220,38,38,.07); color:rgba(220,38,38,.95); }
.alert-icon           { flex:none; margin-top:.05rem; }

/* ================================================
   admin_dashboard.php — adiciones
   ================================================ */
.chart-card-body  { padding:.75rem; }
.chart-min        { min-height:200px; }
.card-body-flush  { padding:0; overflow-x:auto; }
.td-empty         { text-align:center; padding:1.5rem; }


/* ==================================================================================================================================================
   CONIT — componentes propios (contadores de calefacción y agua caliente)
   ================================================================================================================================================== */
:root {
	--water: #277aff;
	--water-bg: rgba(39,122,255,.10);
	--heat: #f06a1d;
	--heat-bg: rgba(240,106,29,.11);
}

/* ── Estructura ─────────────────────────────────────────────────────────────────────────────── */
.app-shell { min-height: 0; }
#sideMenuToggle { position: fixed; left: 0; top: 50%; transform: translateY(-50%); z-index: 40; width: 22px; height: 64px; align-items: center; justify-content: center; border: 1px solid rgba(128,128,128,.25); border-left: none; border-radius: 0 8px 8px 0; background: rgba(128,128,128,.08); color: currentColor; cursor: pointer; opacity: .6; transition: opacity .15s; }
#sideMenuToggle:hover { opacity: 1; }
#sideMenuToggleIcon { transition: transform .2s; }
.nav-ico { flex-shrink: 0; }
.nav-avatar { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: #01c5ba; color: #202222; font-weight: 800; font-size: .875rem; letter-spacing: .02em; user-select: none; }
.nav-avatar-lg { width: 45px; height: 45px; flex-shrink: 0; cursor: default; }
.app-footer { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; padding: 1rem 1.5rem 4rem; font-size: .75rem; color: rgba(255,255,255,.55); }
.app-footer a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.app-footer a:hover { color: #01c5ba; }

/* ── UX: loader, subir, sin conexión ────────────────────────────────────────────────────────── */
.page-loader { position: fixed; inset: 0; z-index: 10001; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.55); backdrop-filter: blur(2px); opacity: 0; pointer-events: none; transition: opacity .15s; }
.page-loader.is-on { opacity: 1; pointer-events: all; }
.page-loader-ring { width: 44px; height: 44px; border-radius: 50%; border: 4px solid rgba(1,197,186,.25); border-top-color: #01c5ba; animation: cnt-spin .8s linear infinite; }
[data-theme="dark"] .page-loader { background: rgba(22,24,24,.6); }
@keyframes cnt-spin { to { transform: rotate(360deg); } }
.scroll-top { position: fixed; right: 1.25rem; bottom: 4.5rem; z-index: 60; width: 40px; height: 40px; border-radius: 50%; border: none; background: #01c5ba; color: #202222; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 4px 14px rgba(0,0,0,.2); opacity: 0; transform: translateY(10px); pointer-events: none; transition: opacity .2s, transform .2s; }
.scroll-top.is-visible { opacity: 1; transform: none; pointer-events: all; }
.offline-bar { position: fixed; left: 0; right: 0; top: 0; z-index: 10002; padding: .45rem 1rem; text-align: center; font-size: .8125rem; font-weight: 600; background: #fab005; color: #4a3500; }
#btnDarkToggle { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 60; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(128,128,128,.3); background: #fff; color: #212322; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 10px rgba(0,0,0,.15); }
[data-theme="dark"] #btnDarkToggle { background: #2c2f2f; color: #fff; }

/* ── Tarjeta de contador (propietario: "Mis lecturas") ──────────────────────────────────────── */
.meter-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; }
.meter-card { display: flex; flex-direction: column; gap: 1.1rem; padding: 1.35rem; border: 1px solid rgba(33,35,34,.1); border-radius: 14px; background: #fff; box-shadow: 0 1px 4px rgba(33,35,34,.05); }
.meter-card-top { display: flex; align-items: center; gap: .9rem; }
.meter-icon { flex-shrink: 0; width: 52px; height: 52px; border-radius: 14px; display: flex; align-items: center; justify-content: center; }
.meter-icon.is-water { background: var(--water-bg); color: var(--water); }
.meter-icon.is-heating { background: var(--heat-bg); color: var(--heat); }
.meter-eyebrow { font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: rgba(33,35,34,.4); }
.meter-name { font-size: 1.05rem; font-weight: 800; color: rgba(33,35,34,.9); line-height: 1.2; }
.meter-value { display: flex; align-items: baseline; gap: .4rem; font-size: 2.1rem; font-weight: 800; letter-spacing: -.02em; line-height: 1; color: rgba(33,35,34,.9); font-variant-numeric: tabular-nums; }
.meter-unit { font-size: .9rem; font-weight: 700; color: rgba(33,35,34,.45); letter-spacing: 0; }
.meter-meta { display: flex; justify-content: space-between; align-items: center; gap: .5rem; font-size: .75rem; color: rgba(33,35,34,.5); }
.meter-card-actions { display: flex; gap: .6rem; }
.meter-card-actions .btn { flex: 1; justify-content: center; padding-left: 1rem; padding-right: 1rem; }
.meter-status { display: inline-flex; align-items: center; gap: .4rem; padding: .22rem .7rem; border-radius: 100px; font-size: .6875rem; font-weight: 700; letter-spacing: .03em; background: rgba(33,35,34,.07); color: rgba(33,35,34,.5); white-space: nowrap; }
.meter-status::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.meter-status.is-reading { background: rgba(1,197,186,.14); color: #007d76; }
.meter-status.is-reading::before { animation: cnt-pulse 1.4s ease-in-out infinite; }
.meter-status.is-idle { background: rgba(39,122,255,.12); color: #277aff; }
.meter-status.is-stale { background: rgba(250,176,5,.16); color: #8a6400; }
.meter-status.is-off { background: rgba(33,35,34,.07); color: rgba(33,35,34,.45); }
@keyframes cnt-pulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.7); } }
.type-chip { display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .6rem; border-radius: 100px; font-size: .6875rem; font-weight: 700; }
.type-chip.is-water { background: var(--water-bg); color: var(--water); }
.type-chip.is-heating { background: var(--heat-bg); color: var(--heat); }

/* ── Kanban de dispositivos (admin) ─────────────────────────────────────────────────────────── */
.kanban { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; align-items: start; padding: 1rem; }
@media (max-width: 1100px) { .kanban { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px)  { .kanban { grid-template-columns: 1fr; } }
.kanban-col { background: rgba(33,35,34,.035); border-radius: 12px; padding: .75rem; min-height: 120px; }
.kanban-col-head { display: flex; align-items: center; justify-content: space-between; padding: .25rem .35rem .7rem; font-size: .75rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: rgba(33,35,34,.55); }
.kanban-count { background: rgba(33,35,34,.08); border-radius: 100px; padding: 0 .55rem; font-size: .6875rem; }
.kanban-card { display: block; background: #fff; border: 1px solid rgba(33,35,34,.1); border-left-width: 4px; border-radius: 10px; padding: .75rem .85rem; margin-bottom: .6rem; text-decoration: none; color: inherit; transition: box-shadow .15s, transform .15s; }
.kanban-card:hover { box-shadow: 0 4px 14px rgba(0,0,0,.1); transform: translateY(-1px); }
.kanban-card.is-water { border-left-color: var(--water); }
.kanban-card.is-heating { border-left-color: var(--heat); }
.kanban-card-name { font-weight: 800; font-size: .875rem; color: var(--text-1); }
.kanban-card-sub { font-size: .75rem; color: var(--text-1); opacity: .6; margin-top: .15rem; }
.kanban-card-value { font-size: 1.1rem; font-weight: 800; margin-top: .4rem; font-variant-numeric: tabular-nums; color: var(--text-1); }

/* ── Detalle de dispositivo y utilidades ────────────────────────────────────────────────────── */
.device-hero { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem; padding: 1.5rem; }
.device-hero .meter-value { font-size: 2.6rem; }
.device-chart { min-height: 300px; }
.owner-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .7rem; margin: .15rem .25rem .15rem 0; border-radius: 100px; background: rgba(1,197,186,.1); color: #007d76; font-size: .75rem; font-weight: 600; }
.check-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .35rem .75rem; max-height: 260px; overflow-y: auto; padding: .5rem; border: 1px solid rgba(33,35,34,.1); border-radius: 8px; }
.check-list label { display: flex; align-items: center; gap: .5rem; font-size: .8125rem; cursor: pointer; padding: .2rem .3rem; border-radius: 6px; }
.check-list label:hover { background: rgba(1,197,186,.08); }
.check-list input[type=checkbox] { position: static; opacity: 1; width: 16px; height: 16px; margin: 0; accent-color: #01c5ba; }
.view-switch { display: inline-flex; border: 1px solid rgba(33,35,34,.15); border-radius: 8px; overflow: hidden; }
.view-switch button { border: none; background: transparent; padding: .45rem .7rem; cursor: pointer; color: inherit; display: flex; align-items: center; }
.view-switch button.is-active { background: #01c5ba; color: #202222; }
.seg-tabs { display: inline-flex; gap: .35rem; flex-wrap: wrap; }
.seg-tabs button { border: 1px solid rgba(33,35,34,.15); background: transparent; color: inherit; padding: .35rem .85rem; border-radius: 100px; cursor: pointer; font-size: .8125rem; font-weight: 600; }
.seg-tabs button.is-active { background: #01c5ba; border-color: #01c5ba; color: #202222; }
.community-people { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; }
.form-switch-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid rgba(33,35,34,.08); }
.form-switch-row:last-child { border-bottom: none; }
.form-switch-row small { display: block; opacity: .55; font-size: .75rem; }
.icon-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }

/* ── Modo oscuro ───────────────────────────────────────────────────────────────────────────── */
[data-theme="dark"] .meter-card, [data-theme="dark"] .kanban-card { background: #2c2f2f; border-color: rgba(255,255,255,.13); }
[data-theme="dark"] .meter-card { box-shadow: 0 2px 12px rgba(0,0,0,.45); }
[data-theme="dark"] .meter-name, [data-theme="dark"] .meter-value { color: #fff; }
[data-theme="dark"] .meter-eyebrow, [data-theme="dark"] .meter-unit, [data-theme="dark"] .meter-meta { color: rgba(255,255,255,.5); }
[data-theme="dark"] .meter-status { background: rgba(255,255,255,.08); color: rgba(255,255,255,.6); }
[data-theme="dark"] .meter-status.is-reading { background: rgba(1,197,186,.2); color: #4dcfc9; }
[data-theme="dark"] .meter-status.is-idle { background: rgba(39,122,255,.2); color: #7eb3f2; }
[data-theme="dark"] .meter-status.is-stale { background: rgba(250,176,5,.2); color: #f2d07e; }
[data-theme="dark"] .kanban-col { background: rgba(255,255,255,.04); }
[data-theme="dark"] .kanban-col-head { color: rgba(255,255,255,.55); }
[data-theme="dark"] .kanban-count { background: rgba(255,255,255,.1); }
[data-theme="dark"] .check-list, [data-theme="dark"] .view-switch, [data-theme="dark"] .seg-tabs button { border-color: rgba(255,255,255,.18); }
[data-theme="dark"] .owner-chip { background: rgba(1,197,186,.18); color: #4dcfc9; }
[data-theme="dark"] .form-switch-row { border-color: rgba(255,255,255,.1); }
@media (max-width: 640px) { .meter-grid { grid-template-columns: 1fr; } .scroll-top { bottom: 4.25rem; } }
@media print { .app-nav, #sideMenu, #sideMenuToggle, .app-footer, #btnDarkToggle, .scroll-top, .page-loader { display: none !important; } }

/* El menú móvil (js-navbar-menu) sólo existe por debajo de 992px; navbar.js lo muestra con .show() en escritorio */
@media (min-width: 992px) { .app-mobile-menu { display: none !important; } }

/* Móvil: las cabeceras de tarjeta no desbordan */
@media (max-width: 640px) { .app-card-header { flex-wrap: wrap; gap: .5rem; } .app-card-header-actions, .page-header-actions { flex-wrap: wrap; } .page-header { flex-wrap: wrap; } }

/* ── Factura imprimible ─────────────────────────────────────────────────────────────────────── */
.invoice-body { background: #eef0f0; }
.invoice-toolbar { display: flex; gap: .5rem; justify-content: flex-end; max-width: 900px; width: 100%; margin: 1rem auto 0; padding: 0 1rem; }
.invoice-sheet { background: #fff; color: #212322; max-width: 900px; width: calc(100% - 2rem); margin: 1rem auto 2rem; padding: 2rem 2.25rem; border-radius: 10px; box-shadow: 0 2px 12px rgba(0,0,0,.12); font-size: .875rem; }
.invoice-sheet h1 { font-size: 1.4rem; margin: .5rem 0; }
.invoice-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.5rem; }
.invoice-parties { display: flex; gap: 2rem; flex-wrap: wrap; }
.invoice-lbl { display: block; font-size: .6875rem; text-transform: uppercase; letter-spacing: .1em; opacity: .5; margin-bottom: .2rem; }
.invoice-table { width: 100%; border-collapse: collapse; }
.invoice-table th, .invoice-table td { padding: .5rem .4rem; border-bottom: 1px solid rgba(33,35,34,.12); text-align: left; vertical-align: top; }
.invoice-table th { font-size: .6875rem; text-transform: uppercase; letter-spacing: .06em; opacity: .65; }
.invoice-table .r { text-align: right; white-space: nowrap; }
.invoice-table tfoot td { border-bottom: none; }
.invoice-table tfoot .total td { font-size: 1.1rem; font-weight: 800; border-top: 2px solid #212322; }
.invoice-foot { margin-top: 1.5rem; opacity: .8; }
@media print {
	.no-print, .scroll-top, #btnDarkToggle, .page-loader, .offline-bar { display: none !important; }
	.invoice-body { background: #fff !important; }
	.invoice-sheet { box-shadow: none; margin: 0; width: 100%; max-width: none; padding: 0; border-radius: 0; }
}

/* ==================================================================================================================================================
   Barra superior: herramientas y popups · panel informativo lateral · pie de página
   ================================================================================================================================================== */
.nav-tools { display: flex; align-items: center; gap: .35rem; margin-left: auto; }
.nav-tool { position: relative; display: flex; align-items: center; }
.nav-burger { margin-left: .5rem; }
.nav-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 10px; border: none; background: transparent; color: #fff; cursor: pointer; transition: background .15s, color .15s; }
.nav-btn:hover, .nav-btn[aria-expanded="true"] { background: rgba(255,255,255,.1); color: #01c5ba; }
.nav-btn:focus-visible { outline: 2px solid #01c5ba; outline-offset: 2px; }
.nav-avatar-btn { width: auto; padding: 0 .15rem; }
.nav-count { position: absolute; top: 2px; right: 0; min-width: 16px; height: 16px; border-radius: 100px; padding: 0 4px; display: inline-flex; align-items: center; justify-content: center; font-size: .625rem; font-weight: 700; line-height: 1; background: #e53935; color: #fff; }
.nav-count-soft { background: rgba(255,255,255,.18); top: auto; bottom: 0; right: -2px; font-size: .5625rem; height: 14px; }
.nav-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px; border-radius: 100px; font-size: .6rem; font-weight: 700; line-height: 1; padding: 0 4px; margin-left: .35rem; background: #e53935; color: #fff; }
#btnDarkToggle.in-nav { position: static; box-shadow: none; border: none; background: transparent; color: #fff; width: 38px; height: 38px; border-radius: 10px; }
#btnDarkToggle.in-nav:hover { background: rgba(255,255,255,.1); color: #01c5ba; }
[data-theme="dark"] #btnDarkToggle.in-nav { background: transparent; color: #fff; }

.nav-pop { position: absolute; top: calc(100% + 10px); right: 0; z-index: 1000; width: 320px; max-width: calc(100vw - 1rem); padding: 1rem; border-radius: 12px; background: #202222; color: #fff; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 12px 36px rgba(0,0,0,.4); }
.nav-pop[hidden] { display: none; }
.nav-pop-wide { width: 420px; }
.nav-pop-title { font-size: .6875rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; color: rgba(255,255,255,.5); padding-bottom: .5rem; margin-bottom: .35rem; border-bottom: 1px solid rgba(255,255,255,.1); }
.pop-scroll { max-height: 320px; overflow-y: auto; }
.pop-list { list-style: none; margin: 0; padding: 0; }
.pop-list a { display: flex; align-items: flex-start; gap: .6rem; padding: .55rem .5rem; border-radius: 8px; color: rgba(255,255,255,.9); text-decoration: none; font-size: .8125rem; }
.pop-list a:hover, .pop-list a:focus-visible { background: rgba(255,255,255,.08); color: #4dcfc9; }
.pop-list a small { display: block; opacity: .55; font-size: .6875rem; font-weight: 400; margin-top: .1rem; }
.pop-list a svg { flex-shrink: 0; margin-top: .1rem; }
.pop-list-compact { display: grid; grid-template-columns: 1fr 1fr; gap: 0 .5rem; }
.pop-list-compact a { padding: .4rem .5rem; }
.pop-ico { display: inline-flex; flex-shrink: 0; margin-top: .05rem; }
.pop-empty { padding: 1rem .25rem; text-align: center; font-size: .8125rem; color: rgba(255,255,255,.45); }
.pop-group { font-size: .6875rem; font-weight: 700; color: #4dcfc9; text-transform: uppercase; letter-spacing: .08em; margin: .5rem .5rem .1rem; }
.pop-foot { display: block; text-align: center; margin-top: .6rem; padding-top: .6rem; border-top: 1px solid rgba(255,255,255,.1); font-size: .8125rem; font-weight: 600; color: #4dcfc9; text-decoration: none; }
.nav-search { display: flex; align-items: center; gap: .5rem; padding: .15rem .75rem; border-radius: 10px; background: rgba(255,255,255,.08); margin-bottom: .5rem; }
.nav-search input { flex: 1; background: transparent; border: none; outline: none; color: #fff; padding: .55rem 0; font-size: .875rem; min-width: 0; }
.nav-search input::placeholder { color: rgba(255,255,255,.4); }

/* Panel informativo del menú lateral */
.side-info { margin-top: 1.5rem; padding: 1rem; border-radius: 12px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.04); font-size: .75rem; color: rgba(255,255,255,.65); }
.side-info-by { color: inherit; text-decoration: none; display: block; margin-bottom: .75rem; }
.side-info-by strong { color: #01c5ba; letter-spacing: .04em; }
.side-info-by:hover { color: #fff; }
.side-info-actions { display: flex; gap: .4rem; }
.side-info-actions button { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 9px; border: 1px solid rgba(255,255,255,.14); background: transparent; color: rgba(255,255,255,.8); cursor: pointer; }
.side-info-actions button:hover { color: #01c5ba; border-color: #01c5ba; }

/* Contenido de los paneles informativos */
.info-doc h5 { margin: 1.1rem 0 .3rem; font-size: .9rem; }
.info-doc h5:first-child { margin-top: 0; }
.info-doc p { font-size: .8125rem; line-height: 1.6; margin: 0 0 .5rem; color: var(--text-1); }
.info-doc-note { opacity: .6; font-style: italic; margin-top: 1rem !important; }
.info-doc-list { margin: 0 0 .5rem 1.1rem; font-size: .8125rem; line-height: 1.6; list-style: disc; }
.info-doc-mono { font-family: ui-monospace, Consolas, monospace; font-size: .75rem !important; opacity: .7; word-break: break-all; }
.kbd-table { width: 100%; border-collapse: collapse; font-size: .8125rem; }
.kbd-table td { padding: .4rem .25rem; border-bottom: 1px solid var(--border-1); }
.kbd-table td:first-child { width: 40%; white-space: nowrap; }
kbd { display: inline-block; min-width: 1.6em; padding: .1em .45em; border: 1px solid rgba(128,128,128,.4); border-bottom-width: 2px; border-radius: 5px; font: 600 .75rem ui-monospace, Consolas, monospace; text-align: center; background: rgba(128,128,128,.1); }

/* Pie: app/versión/descripción a la izquierda · sesión y salir a la derecha */
.app-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .25rem 1rem; padding: .75rem 1.5rem 3.5rem; font-size: .6875rem; color: rgba(255,255,255,.55); }
.app-footer strong { color: rgba(255,255,255,.85); }
.app-footer a { color: #4dcfc9; text-decoration: underline; text-underline-offset: 2px; }
.app-footer-right { margin-left: auto; text-align: right; }

/* Móvil: la barra de herramientas pasa a una segunda fila */
@media (max-width: 767px) {
	.nav-tools { order: 3; width: 100%; justify-content: space-between; margin-top: .6rem; margin-left: 0; }
	.nav-burger { margin-left: auto; }
	.nav-pop { position: fixed; left: .5rem; right: .5rem; width: auto; max-width: none; top: 7rem; }
	.nav-pop-wide { width: auto; }
	.pop-list-compact { grid-template-columns: 1fr; }
	.app-footer { flex-direction: column; align-items: flex-start; }
	.app-footer-right { margin-left: 0; text-align: left; }
}
@media print { .nav-tools, .side-info { display: none !important; } }
.info-doc, .info-doc p, .info-doc li, .kbd-table td, .info-doc .info-row-value { color: #212322; opacity: 1; }
.info-doc-note, .info-doc-mono { opacity: .6; }
kbd { color: #212322; background: #f1f3f3; }
[data-theme="dark"] .info-doc, [data-theme="dark"] .info-doc p, [data-theme="dark"] .info-doc li, [data-theme="dark"] .kbd-table td, [data-theme="dark"] .info-doc h5 { color: #fff; }
[data-theme="dark"] kbd { color: #fff; background: rgba(255,255,255,.1); }
.kbd-table td { background: transparent; }

/* Tamaño base de la interfaz (el botón «A» de la barra lo amplía hasta ×1,29) */
html { font-size: 87.5%; }
.filter-lbl { font-size: .6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; opacity: .6; margin: 0 .25rem 0 .5rem; }
.log-date-filter select { min-width: 110px; }

/* Tablas anchas: el scroll horizontal queda dentro de su tarjeta y nunca desplaza el diseño bajo el menú lateral */
main, main > div, .app-content, .app-section { min-width: 0; }
.app-card-table { overflow-x: auto; max-width: 100%; }
.app-card-table .dt-container, .app-card-table .dt-layout-table { max-width: 100%; }
.app-card-table .dt-layout-table { overflow-x: auto; }
.app-card-table table.dataTable { width: 100% !important; }
.app-card-table table.dataTable td, .app-card-table table.dataTable th { white-space: nowrap; }
.app-card-table table.dataTable td .badge { margin-right: .2rem; }
/* Texto legible dentro de los popups (el body es oscuro por diseño del tema base) */
.crud-modal-dialog { color: #212322; }
.crud-modal-dialog .form-switch-row strong { color: #212322; }
[data-theme="dark"] .crud-modal-dialog, [data-theme="dark"] .crud-modal-dialog .form-switch-row strong { color: #fff; }
/* Comunidad · línea 1: nombre, dirección, CP y población */
.community-line1 { display: grid; grid-template-columns: 2fr 2fr 1fr 1.4fr; gap: 1rem; }
@media (max-width: 900px) { .community-line1 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .community-line1 { grid-template-columns: 1fr; } }
.portal-preview { margin: .5rem 0 0; padding: .6rem .85rem; border-radius: 8px; background: rgba(1,197,186,.1); color: #007d76; font-size: .8125rem; font-weight: 700; }
[data-theme="dark"] .portal-preview { color: #4dcfc9; }
.field-hint { display: block; margin-top: .25rem; font-size: .6875rem; opacity: .6; }

/* Comunidad: más aire entre la línea 1 y la 2 de los datos; vocales dinámicos */
.community-line1 { margin-bottom: 1.75rem; }
.vocals-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 1.5rem 0 .75rem; padding-top: 1.25rem; border-top: 1px solid var(--border-1); }
.vocals-list { display: grid; gap: .85rem; }
.vocal-row { display: grid; grid-template-columns: 1fr 2fr auto; gap: 1rem; align-items: end; }
@media (max-width: 640px) { .vocal-row { grid-template-columns: 1fr; } }

/* Comunidad: «Datos» y «Junta de propietarios» en dos columnas */
.community-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; }
.community-col { min-width: 0; }
.community-cols .community-line1 { grid-template-columns: 1fr 1fr; }
.community-cols .vocal-row { grid-template-columns: 1fr 1.6fr auto; }
@media (max-width: 1100px) { .community-cols { grid-template-columns: 1fr; } .community-cols .community-line1 { grid-template-columns: 2fr 2fr 1fr 1.4fr; } }
@media (max-width: 900px) { .community-cols .community-line1 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .community-cols .community-line1 { grid-template-columns: 1fr; } .community-cols .vocal-row { grid-template-columns: 1fr; } }

/* Acciones de cabecera de página: en una sola línea */
.page-header-actions { display: flex; align-items: center; justify-content: flex-end; gap: .75rem; flex: none; }
.page-header-actions .btn { white-space: nowrap; }

/* Barra de filtros de tabla (zona derecha, antes del número de registros) */
.table-filter-bar { display: inline-flex; align-items: center; gap: .5rem; margin-right: .75rem; flex-wrap: wrap; }
.table-filter-bar select { min-height: auto !important; border: 1px solid rgba(33,35,34,.15); border-radius: 4px; padding: .3rem 2rem .3rem .5rem; font-size: .8125rem; }
.table-filter-bar .btn { white-space: nowrap; }
[data-theme="dark"] .table-filter-bar select { background-color: #2c2f2f; border-color: rgba(255,255,255,.15); color: rgba(255,255,255,.8); }
/* Pie de tabla: «Mostrar N registros - Mostrando registros del … al … de un total de …» en una sola línea */
.app-card-table .dt-container .dt-layout-row .dt-layout-cell.dt-layout-start { display: flex !important; align-items: center; gap: .75rem; flex-wrap: nowrap; }
.app-card-table .dt-length + .dt-info::before { content: "-"; margin-right: .75rem; }
.app-card-table .dt-info { white-space: nowrap; }

/* Matriz de viviendas */
.hm-total { margin-left: auto; margin-right: 1rem; font-size: .8125rem; font-weight: 600; opacity: .7; white-space: nowrap; }
.hm-portal { display: flex; align-items: baseline; justify-content: space-between; margin: 1rem 0 .5rem; }
.hm-portal span { font-size: .75rem; opacity: .6; font-weight: 500; }
.hm-stairs { display: flex; flex-wrap: wrap; gap: 1.25rem; }
.hm-stair { min-width: 0; }
.hm-stair-name { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; opacity: .6; margin-bottom: .35rem; }
.hm-table { border-collapse: separate; border-spacing: 4px; }
.hm-table th { font-size: .75rem; font-weight: 600; opacity: .6; padding: 0 .35rem; text-align: center; }
.hm-cell { min-width: 96px; padding: .4rem .5rem; border-radius: 6px; font-size: .75rem; line-height: 1.2; cursor: pointer; border: 1px solid rgba(33,35,34,.15); background: #fff; color: rgba(33,35,34,.45); }
.hm-cell.occ { background: rgba(1,197,186,.12); border-color: rgba(1,197,186,.45); color: #0b6f69; font-weight: 600; }
.hm-cell:hover, .hm-cell.sel { border-color: #01c5ba; box-shadow: 0 0 0 2px rgba(1,197,186,.25); }
[data-theme="dark"] .hm-cell { background: #2c2f2f; color: rgba(255,255,255,.45); border-color: rgba(255,255,255,.15); }
[data-theme="dark"] .hm-cell.occ { background: rgba(1,197,186,.18); color: #5eead4; }
.hm-assign { margin-top: 1rem; padding: 1rem; border: 1px solid rgba(33,35,34,.12); border-radius: 8px; background: rgba(1,197,186,.05); }
.hm-assign-title { font-weight: 700; margin-bottom: .5rem; }
.hm-assign-actions { display: flex; align-items: center; gap: .5rem; margin-top: .75rem; }
.hm-assign label { color: inherit; opacity: .75; }

/* Menú superior, menú lateral y pie fijos: sólo se desplaza el contenido de la sección */
@media (min-width: 1024px) {
  html:has(.app-shell), body:has(.app-shell) { height: 100%; }
  body:has(.app-shell) { height: 100vh; min-height: 0 !important; overflow: hidden; }
  body:has(.app-shell) .app-nav { position: relative; z-index: 50; flex: none; }
  body:has(.app-shell) .app-shell { flex: 1 1 0; min-height: 0; overflow: hidden; }
  body:has(.app-shell) #sideMenu { overflow-y: auto; min-height: 0; }
  body:has(.app-shell) .app-scroll { overflow-y: auto; min-height: 0; scrollbar-gutter: stable; }
}
@media (max-width: 1023px) {
  body:has(.app-shell) .app-nav { position: sticky; top: 0; z-index: 50; }
}

.president-row { display: flex; align-items: flex-end; gap: .75rem; margin-bottom: 1rem; }
.president-row .form-field { flex: 1; min-width: 0; }
.president-row .btn { white-space: nowrap; min-height: 42px; }
.mx-assign-row { display: flex; align-items: flex-end; gap: .75rem; flex-wrap: wrap; }
.mx-assign-row .form-field { flex: 1; min-width: 260px; }
.mx-assign-row .btn { min-height: 42px; }
.mx-portal-select { min-height: 42px; border: 1px solid rgba(33,35,34,.15); border-radius: 6px; padding: 0 2rem 0 .75rem; font-size: .875rem; background-color: #fff; color: #212322; }
[data-theme="dark"] .mx-portal-select { background-color: #2c2f2f; color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.15); }
.hm-total { margin-left: auto; }

/* Matriz de vivienda: tarjetas de portal en 3 columnas, ajustadas a su contenido */
#mxBody { display: grid !important; grid-template-columns: repeat(3, minmax(0, max-content)); gap: 1.5rem; align-items: start; justify-content: start; }
#mxBody > .app-section { min-width: 0; }
#mxBody .app-card-body { overflow-x: auto; }
@media (max-width: 1279px) { #mxBody { grid-template-columns: repeat(2, minmax(0, max-content)); } }
@media (max-width: 767px) { #mxBody { grid-template-columns: minmax(0, 1fr); } }
#mxBody .hm-cell { min-width: 72px; padding: .35rem .3rem; font-size: .7rem; }
#mxBody .app-card-body { padding: 1rem !important; }
#mxBody .app-card-header { flex-wrap: wrap; gap: .15rem 1rem; }
#mxBody .hm-total { white-space: nowrap; }

/* Menú de exportación de la matriz */
.mx-export { position: relative; }
.mx-export-menu { position: absolute; right: 0; top: calc(100% + 4px); z-index: 70; min-width: 180px; padding: .25rem; border: 1px solid rgba(33,35,34,.12); border-radius: 8px; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.mx-export-menu[hidden] { display: none; }
.mx-export-menu button { display: block; width: 100%; text-align: left; padding: .5rem .75rem; border: 0; background: none; border-radius: 6px; font-size: .8125rem; color: #212322; cursor: pointer; }
.mx-export-menu button:hover { background: rgba(1,197,186,.12); }
[data-theme="dark"] .mx-export-menu { background: #2c2f2f; border-color: rgba(255,255,255,.15); }
[data-theme="dark"] .mx-export-menu button { color: rgba(255,255,255,.85); }

/* Contenido + pie dentro del mismo contenedor: el pie va al final de cada sección, no fijo */
.app-scroll { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.app-scroll > main { flex: 1 0 auto; overflow: visible !important; }
.app-scroll > .app-footer { flex: none; padding: .75rem 1.5rem 1.25rem; margin-top: auto; }
/* Tarjeta de información del menú: pegada abajo y repartida a todo el ancho */
#sideMenu { padding-bottom: 1rem !important; }
.side-info { margin-top: auto; padding: .85rem 1rem; display: flex; align-items: center; justify-content: space-between; gap: .75rem; }
.side-info-by { margin-bottom: 0; }
.side-info-actions { gap: .3rem; }
.side-info { display: block; }
.side-info-by { margin-bottom: .6rem; }
.side-info-actions { justify-content: space-between; }

.table-filter-bar .inc-filter-btn { white-space: nowrap; }

.role-badge { display: inline-flex; align-items: center; gap: .4rem; padding: .35rem .75rem; border-radius: 999px; font-size: .8125rem; font-weight: 600; background: rgba(1,197,186,.14); color: #0b6f69; }
[data-theme="dark"] .role-badge { color: #5eead4; }

/* Menú lateral compacto */
@media (min-width: 1024px) {
  #sideMenu { width: 208px !important; padding: 1rem .75rem .75rem !important; }
  #sideMenu a.link { padding: .55rem .7rem !important; font-size: .8125rem; gap: .55rem !important; }
  #sideMenu a.link svg { width: 17px; height: 17px; }
  #sideMenu .pb-6 { padding-bottom: .55rem !important; }
  #sideMenu .mb-6 { margin-bottom: .55rem !important; }
  .side-info { padding: .65rem .7rem; }
  .side-info-actions button { width: 30px; height: 30px; }
}

/* Menú lateral: texto algo mayor y tarjeta de información ajustada al ancho */
@media (min-width: 1024px) {
  #sideMenu a.link { font-size: .9375rem; padding: .6rem .7rem !important; }
  #sideMenu a.link svg { width: 18px; height: 18px; }
  .side-info { padding: .7rem .75rem; font-size: .75rem; }
  .side-info-by { margin-bottom: .55rem; white-space: nowrap; }
  .side-info-actions { gap: 0; }
  .side-info-actions button { width: 32px; height: 32px; }
}

/* Menú lateral: texto mayor, tarjeta con iconos más juntos y botón de ocultar pegado al borde derecho del menú, a la altura del título */
@media (min-width: 1024px) {
  #sideMenu a.link { font-size: 1rem; }
  #sideMenu a.link svg { width: 19px; height: 19px; }
  .side-info-actions { justify-content: flex-start; gap: .35rem; }
  .side-info-actions button { width: 34px; height: 34px; }
  #sideMenuToggle { top: 112px; left: 208px; transform: none; height: 44px; width: 20px; border-left: 1px solid rgba(128,128,128,.25); border-radius: 0 8px 8px 0; opacity: .75; }
  body.side-collapsed #sideMenuToggle { left: 0; border-left: none; }
}

/* Más aire a los lados del contenido de cada sección */
@media (min-width: 1024px) { .app-scroll > main { padding: 2rem 3.5rem !important; } }

/* Menú lateral más estrecho */
@media (min-width: 1024px) {
  #sideMenu { width: 176px !important; padding-left: .6rem !important; padding-right: .6rem !important; }
  #sideMenu a.link { padding: .6rem .6rem !important; }
  .side-info { padding: .65rem .6rem; }
  #sideMenuToggle { left: 176px; }
  body.side-collapsed #sideMenuToggle { left: 0; }
  .app-nav > div:first-child { width: 176px !important; }
}

/* Tarjeta de información: iconos arriba, «Desarrollado por» debajo, todo centrado */
.side-info { display: flex !important; flex-direction: column-reverse; align-items: center; text-align: center; }
.side-info-by { margin: .55rem 0 0 !important; }
.side-info-actions { justify-content: center !important; }
.side-info-by { margin: .25rem 0 0 !important; line-height: 1.2; }
#sideMenu { padding-bottom: 1.6rem !important; }

/* Importación de propietarios */
.imp-step-label { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; opacity: .55; margin: 0 0 .5rem; }
.imp-types { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-bottom: 1.1rem; }
.imp-types button { display: flex; flex-direction: column; align-items: center; gap: .1rem; padding: .7rem .5rem; border: 1px solid rgba(33,35,34,.15); border-radius: 10px; background: transparent; color: inherit; cursor: pointer; transition: border-color .15s, background .15s; }
.imp-types button strong { font-size: .95rem; }
.imp-types button small { opacity: .55; font-size: .75rem; }
.imp-types button:hover { border-color: #01c5ba; }
.imp-types button.is-active { border-color: #01c5ba; background: rgba(1,197,186,.12); box-shadow: 0 0 0 2px rgba(1,197,186,.2); }
.imp-drop { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: 1.4rem 1rem; border: 2px dashed rgba(33,35,34,.22); border-radius: 12px; text-align: center; cursor: pointer; transition: border-color .15s, background .15s; margin-bottom: .9rem; }
.imp-drop:hover, .imp-drop.is-over { border-color: #01c5ba; background: rgba(1,197,186,.08); }
.imp-drop[hidden] { display: none; }
.imp-drop svg { color: #01c5ba; }
.imp-drop-main { font-weight: 600; font-size: .9rem; }
.imp-drop-sub { font-size: .75rem; opacity: .55; }
.imp-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.imp-file { display: flex; align-items: center; gap: .6rem; padding: .65rem .85rem; border: 1px solid rgba(1,197,186,.45); background: rgba(1,197,186,.08); border-radius: 10px; margin-bottom: .9rem; }
.imp-file[hidden] { display: none; }
.imp-file-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .85rem; font-weight: 600; }
.imp-file-x { border: 0; background: transparent; color: inherit; opacity: .6; cursor: pointer; padding: .2rem; border-radius: 6px; }
.imp-file-x:hover { opacity: 1; background: rgba(0,0,0,.08); }
.imp-result { margin-bottom: .9rem; }
.imp-status { padding: .75rem .9rem; border-radius: 10px; background: rgba(33,35,34,.05); font-size: .85rem; }
.imp-chips { display: flex; gap: .6rem; flex-wrap: wrap; }
.imp-chip { display: flex; align-items: baseline; gap: .4rem; padding: .5rem .8rem; border-radius: 10px; font-size: .8rem; }
.imp-chip strong { font-size: 1.15rem; }
.imp-chip-ok { background: rgba(34,170,90,.14); color: #167a41; }
.imp-chip-bad { background: rgba(229,57,53,.14); color: #b92e3c; }
.imp-chip-muted { background: rgba(33,35,34,.07); opacity: .85; }
.imp-note { font-size: .78rem; opacity: .65; margin: .55rem 0 0; }
.imp-errors { max-height: 190px; overflow: auto; margin-top: .6rem; border: 1px solid rgba(229,57,53,.25); border-radius: 8px; }
.imp-err-line { white-space: nowrap; opacity: .6; }
.imp-err-msg { color: #b92e3c; }
[data-theme="dark"] .imp-types button, [data-theme="dark"] .imp-drop { border-color: rgba(255,255,255,.18); }
[data-theme="dark"] .imp-status { background: rgba(255,255,255,.06); }
[data-theme="dark"] .imp-chip-ok { color: #6ee7a0; }
[data-theme="dark"] .imp-chip-bad, [data-theme="dark"] .imp-err-msg { color: #ff8a8f; }

/* Botón de facturación automática: estado gráfico (punto verde = activa · icono tachado = desactivada) */
.auto-btn { position: relative; }
.auto-dot { position: absolute; top: 6px; right: 6px; width: 8px; height: 8px; border-radius: 50%; background: #9aa0a0; box-shadow: 0 0 0 2px #fff; }
.auto-btn.is-on .auto-dot { background: #22aa5a; }
.auto-btn.is-off .auto-dot { background: #e53935; }
.auto-btn.is-off svg { opacity: .45; }
.auto-btn.is-off::after { content: ""; position: absolute; left: 9px; right: 9px; top: 50%; height: 2px; border-radius: 2px; background: #e53935; transform: rotate(-38deg); pointer-events: none; }
[data-theme="dark"] .auto-dot { box-shadow: 0 0 0 2px #2c2f2f; }

/* Tarifas editables en línea */
.tariff-table th { white-space: nowrap; }
.tariff-table td { vertical-align: middle; }
.tariff-table input, .tariff-table select { width: 100%; min-width: 0; padding: .3rem .45rem; font-size: .8125rem; border: 1px solid rgba(33,35,34,.18); border-radius: 6px; background: #fff; color: #212322; min-height: 34px; }
.tariff-table tr.tariff-editing { background: rgba(1,197,186,.08); }
.tariff-table .tariff-new td { padding-top: .6rem; border-top: 2px solid rgba(1,197,186,.35); }
.tariff-actions { white-space: nowrap; text-align: right; }
.tariff-actions .table-action { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; margin-left: .2rem; border: 1px solid rgba(33,35,34,.14); border-radius: 6px; background: transparent; cursor: pointer; color: inherit; }
.tariff-actions .table-action svg { width: 15px; height: 15px; }
.tariff-actions .table-action:hover { border-color: #01c5ba; color: #01c5ba; }
.tariff-actions .table-action-delete:hover { border-color: #e53935; color: #e53935; }
[data-theme="dark"] .tariff-table input, [data-theme="dark"] .tariff-table select { background: #2c2f2f; color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.18); }

/* Barras de acciones y filtros dentro de la línea superior de la tabla */
.table-staging { display: none; }
.table-toolbar-left { display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.table-toolbar-left .btn, .table-filter-bar .btn { min-height: 42px; padding: .4rem 1rem; font-size: .875rem; white-space: nowrap; }
.table-filter-bar select { min-height: 42px; padding: 0 2rem 0 .75rem; font-size: .875rem; border-radius: 6px; background-color: #fff; color: #212322; }
.table-filter-bar { justify-content: flex-end; }
.app-card-table .dt-container .dt-layout-row:first-child { flex-wrap: wrap; gap: .75rem; }
[data-theme="dark"] .table-filter-bar select { background-color: #2c2f2f; color: rgba(255,255,255,.85); }

/* Página pública de aceptación de contratos */
.contract-card { padding: 2rem; }
.contract-body p { font-size: .9rem; line-height: 1.65; margin: 0 0 .85rem; color: rgba(33,35,34,.85); }
.contract-check { display: flex; align-items: flex-start; gap: .6rem; font-size: .9rem; cursor: pointer; }
.contract-check input { width: 18px; height: 18px; margin-top: 2px; accent-color: #01c5ba; flex: none; }
[data-theme="dark"] .contract-body p { color: rgb(230 230 235); }

/* Selección de filas, contratos y envío */
.own-chk, .own-chk-all { position: static !important; opacity: 1 !important; width: 16px; height: 16px; accent-color: #01c5ba; cursor: pointer; }
.ctr-chips { display: inline-flex; gap: .25rem; flex-wrap: nowrap; }
.ctr-chip { display: inline-block; padding: .1rem .45rem; border-radius: 999px; font-size: .6875rem; font-weight: 700; white-space: nowrap; border: 1px solid transparent; }
.ctr-accepted { background: rgba(34,170,90,.15); color: #167a41; border-color: rgba(34,170,90,.35); }
.ctr-pending { background: rgba(245,158,11,.15); color: #a86400; border-color: rgba(245,158,11,.4); }
.ctr-none { background: transparent; color: rgba(33,35,34,.45); border-color: rgba(33,35,34,.2); }
[data-theme="dark"] .ctr-accepted { color: #6ee7a0; } [data-theme="dark"] .ctr-pending { color: #fbbf24; } [data-theme="dark"] .ctr-none { color: rgba(255,255,255,.45); border-color: rgba(255,255,255,.2); }
.ctr-target { font-weight: 700; margin: 0 0 .85rem; }
.ctr-options { display: flex; flex-direction: column; gap: .55rem; }
.ctr-opt { display: flex; align-items: flex-start; gap: .75rem; padding: .75rem .9rem; border: 1px solid rgba(33,35,34,.15); border-radius: 10px; cursor: pointer; }
.ctr-opt:hover { border-color: #01c5ba; }
.ctr-opt input { width: 18px; height: 18px; margin-top: 2px; accent-color: #01c5ba; flex: none; position: static; opacity: 1; }
.ctr-opt strong { display: block; font-size: .9rem; }
.ctr-opt small { display: block; opacity: .6; font-size: .78rem; }
[data-theme="dark"] .ctr-opt { border-color: rgba(255,255,255,.18); }

/* Tarjetas plegables */
.card-toggle { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid rgba(33,35,34,.14); border-radius: 8px; background: transparent; color: inherit; cursor: pointer; flex: none; transition: transform .18s, border-color .15s; }
.card-toggle:hover { border-color: #01c5ba; color: #01c5ba; }
.app-card.is-collapsed .card-toggle { transform: rotate(-90deg); }
.app-card.is-collapsed > .app-card-body { display: none; }
.app-card[data-card] > .app-card-header { cursor: pointer; }
.app-card.is-collapsed > .app-card-header { border-bottom-color: transparent; }
.acc-wrap { border: 0 !important; box-shadow: none !important; background: transparent !important; }
[data-theme="dark"] .card-toggle { border-color: rgba(255,255,255,.18); }

/* Caja de información del menú: más estrecha, con más aire a los lados */
.side-info { margin-left: .6rem !important; margin-right: .6rem !important; padding: .6rem .5rem !important; font-size: .7rem; }
.side-info-by { white-space: nowrap; }
.side-info-actions button { width: 30px !important; height: 30px !important; }

/* Línea superior de las tablas: todo alineado a la derecha y con la misma altura de campo */
.app-card-table .dt-container .dt-layout-row:first-child { justify-content: flex-end; }
.app-card-table .dt-container .dt-layout-row:first-child > .dt-layout-end { margin-left: auto; }
.app-card-table .dt-container .dt-layout-row:first-child .dt-search { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .5rem; }
.app-card-table .table-filter-bar select,
.app-card-table .dt-search input,
.app-card-table .dt-length select,
.app-card-table .table-clear-filters { box-sizing: border-box; height: 42px; min-height: 42px; }
.app-card-table .table-filter-bar select,
.app-card-table .dt-length select { padding: 0 2rem 0 .75rem; font-size: .875rem; line-height: 1.2; }
.app-card-table .dt-search input { padding: 0 .75rem; font-size: .875rem; }
.app-card-table .dt-length select { width: auto; }

/* Botón compacto («+ Portal») encima de la tabla */
.portal-toolbar { display: flex; justify-content: flex-start; margin-bottom: .75rem; }
.btn.btn-compact { min-height: 34px; height: 34px; padding: 0 .9rem; font-size: .8125rem; gap: .4rem; }
.btn.btn-compact > svg { width: 14px; height: 14px; }

/* Comunidad: las dos tarjetas de la fila (Datos y Junta) con la misma altura */
.community-cols { align-items: stretch !important; }
.community-col { display: flex; flex-direction: column; min-width: 0; }
.community-col > .app-card { flex: 1 1 auto; display: flex; flex-direction: column; }
.community-col > .app-card > .app-card-body { flex: 1 1 auto; }
.community-col:has(> .app-card.is-collapsed) { align-self: start; }

/* Comunidad: misma separación (1,5 rem) entre todas las tarjetas */
#communityForm { display: flex; flex-direction: column; gap: 1.5rem; }
#communityForm > .form-feedback-anchor:empty { display: none; }
.community-cols { gap: 1.5rem !important; }
#communityForm { margin-bottom: 0 !important; }
/* Tarjeta de generación: la tabla ocupa todo el ancho, con la fila superior de acciones como el resto de tablas */
.card-flush > .app-card-body { padding: 0 !important; }
.card-flush .acc-wrap { margin: 0; }
#portalsTable_wrapper .dt-layout-row:first-child { justify-content: flex-start !important; }
#portalsTable_wrapper .dt-layout-row:not(.dt-layout-table):not(:has(*)) { display: none !important; }
#portalsTable_wrapper .dt-layout-row:first-child { justify-content: flex-end !important; }
#portalsTable_wrapper .dt-layout-row:first-child > .dt-layout-cell { margin-left: auto; }

/* Filtro de contratos con casillas */
.ctr-filter-menu { min-width: 300px; left: 0; right: auto; padding: .35rem; }
.ctr-filter-menu label { display: flex; align-items: flex-start; gap: .6rem; padding: .5rem .6rem; border-radius: 6px; cursor: pointer; }
.ctr-filter-menu label:hover { background: rgba(1,197,186,.12); }
.ctr-filter-menu input { width: 16px; height: 16px; margin-top: 2px; accent-color: #01c5ba; position: static; opacity: 1; flex: none; }
.ctr-filter-menu strong { display: block; font-size: .8125rem; }
.ctr-filter-menu small { display: block; opacity: .6; font-size: .72rem; line-height: 1.3; }
#fSince { width: 100%; min-height: 30px; font-size: .75rem; padding: .2rem .4rem; border: 1px solid rgba(33,35,34,.18); border-radius: 4px; background: #fff; color: #212322; }
[data-theme="dark"] #fSince { background: #2c2f2f; color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.18); }

/* Insignia con el número de seleccionados en botones sólo con icono */
.btn-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #01c5ba; color: #fff; font-size: .6875rem; font-weight: 700; line-height: 1; }
.btn-count[hidden] { display: none; }
.contract-check input[type="checkbox"] { position: static !important; opacity: 1 !important; width: 20px !important; height: 20px !important; appearance: auto; -webkit-appearance: checkbox; flex: none; }
.contract-check { padding: .85rem 1rem; border: 1px solid rgba(1,197,186,.45); border-radius: 10px; background: rgba(1,197,186,.07); }

/* Viviendas y contadores */
.mx-toggles { display: inline-flex; gap: .35rem; }
.mx-toggle { min-height: 42px; padding: 0 .85rem !important; transition: box-shadow .12s, background .12s; }
.mx-toggle.is-on { box-shadow: inset 0 3px 6px rgba(0,0,0,.28); background: rgba(1,197,186,.2) !important; border-color: #01c5ba !important; color: #01c5ba; }
/* con contadores las celdas son más anchas: las tarjetas fluyen en filas */
#mxBody.with-meters { display: flex !important; flex-wrap: wrap; align-items: flex-start; gap: 1.5rem; }
#mxBody.with-meters > .app-section { max-width: 100%; }
.hm-cell.has-meters { min-width: 188px; text-align: left; padding: .4rem .5rem; display: flex; flex-direction: column; gap: .2rem; }
.hm-ow { font-weight: 700; font-size: .72rem; }
.hm-mh, .hm-ml { display: grid; grid-template-columns: 30px repeat(3, 1fr); gap: .25rem; align-items: baseline; font-size: .66rem; line-height: 1.2; }
.hm-mh i { font-style: normal; font-size: .58rem; opacity: .5; text-align: right; }
.hm-ml b { font-size: .62rem; }
.hm-ml i { font-style: normal; text-align: right; font-variant-numeric: tabular-nums; }
.hm-ml-hot_water b { color: #c2410c; } .hm-ml-heating b { color: #b91c1c; }
.hm-ml.none { opacity: .4; }
.hm-ptot { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin-bottom: 1rem; padding-bottom: .85rem; border-bottom: 1px solid rgba(33,35,34,.08); font-size: .78rem; }
.hm-pt b { font-variant-numeric: tabular-nums; }
.hm-pt strong { margin-right: .25rem; }
[data-theme="dark"] .hm-ptot { border-bottom-color: rgba(255,255,255,.1); }
[data-theme="dark"] .hm-ml-hot_water b { color: #fb923c; } [data-theme="dark"] .hm-ml-heating b { color: #f87171; }

#mxBody .app-card-header { cursor: pointer; gap: .75rem; }
#mxBody .hm-total { margin-right: .25rem; }

/* Contadores: celdas compactas para que quepan más tarjetas en la misma línea y haya que bajar menos */
.hm-cell.has-meters { min-width: 148px; padding: .3rem .4rem; gap: .12rem; }
.hm-mh, .hm-ml { grid-template-columns: 24px repeat(3, 1fr); gap: .2rem; font-size: .64rem; }
.hm-ml b { font-size: .58rem; }
#mxBody.with-meters { gap: 1rem; }
#mxBody.with-meters .app-card-body { padding: .85rem 1rem !important; }
#mxBody .hm-table { border-spacing: 3px; }
.hm-legend { margin-left: auto; font-size: .68rem; opacity: .55; }
.hm-ptot { margin-bottom: .6rem !important; padding-bottom: .5rem !important; }

/* Con contadores: las tarjetas se reparten la línea y las celdas se adaptan al ancho disponible */
#mxBody.with-meters { flex-wrap: wrap; align-items: stretch; }
#mxBody.with-meters > .app-section { min-width: 0; }
#mxBody.with-meters .app-card { height: 100%; }
#mxBody.with-meters .hm-stairs { flex-wrap: nowrap; }
#mxBody.with-meters .hm-stair { flex: 1 1 auto; min-width: 0; }
#mxBody.with-meters .hm-table { width: 100%; }
#mxBody.with-meters .hm-cell.has-meters { min-width: 0; width: 100%; }
#mxBody.with-meters .hm-ml, #mxBody.with-meters .hm-mh { grid-template-columns: 22px repeat(3, minmax(0, 1fr)); }
#mxBody.with-meters .hm-ml i { overflow: hidden; text-overflow: clip; white-space: nowrap; }

/* Tarjeta plegada con contadores: se encoge a su cabecera (antes seguía estirada a la altura de la fila) */
#mxBody.with-meters .app-card.is-collapsed { height: auto; }
#mxBody.with-meters > .app-section:has(.app-card.is-collapsed) { align-self: flex-start; }
/* Propietario con más información en las celdas con contadores */
.hm-cell.has-meters .hm-ow { white-space: normal; overflow-wrap: anywhere; line-height: 1.15; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hm-oi { font-size: .62rem; opacity: .6; font-variant-numeric: tabular-nums; }

/* Con contadores, un portal plegado deja de reservar su ancho (queda del tamaño de su cabecera y los demás aprovechan el sitio) */
#mxBody.with-meters > .app-section:has(.app-card.is-collapsed) { flex: 0 0 auto !important; min-width: 0 !important; width: 280px; max-width: 100%; }
.rd-line { white-space: nowrap; font-size: .75rem; font-variant-numeric: tabular-nums; }
.rd-line b { font-size: .65rem; margin-right: .2rem; opacity: .7; }

/* Simulador de lecturas (Sistema) */
.sim-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.sim-hint { display: block; font-size: .78rem; opacity: .6; margin-top: .15rem; }
.sim-switch { display: inline-flex; align-items: center; gap: .75rem; }
.sim-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.sim-actions .btn { min-height: 42px; padding: 0 1rem; font-size: .875rem; }
.sim-backfill { display: inline-flex; align-items: center; gap: .4rem; }
.sim-backfill select { min-height: 42px; padding: 0 1.6rem 0 .6rem; border: 1px solid rgba(33,35,34,.18); border-radius: 6px; background: #fff; color: #212322; }
[data-theme="dark"] .sim-backfill select { background: #2c2f2f; color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.18); }

/* Celda con dos zonas: propietario (arriba) y lecturas (abajo, abre el detalle) */
.hm-unit { display: flex; flex-direction: column; border: 1px solid rgba(33,35,34,.15); border-radius: 6px; overflow: hidden; background: #fff; }
.hm-unit.occ { border-color: rgba(1,197,186,.45); }
.hm-unit .hm-cell { border: 0 !important; border-radius: 0 !important; box-shadow: none; width: 100%; min-width: 0; }
.hm-unit .hm-cell:hover, .hm-unit .hm-cell.sel { box-shadow: inset 0 0 0 2px rgba(1,197,186,.45); }
.hm-readings { display: flex; flex-direction: column; gap: .12rem; width: 100%; padding: .3rem .4rem; border: 0; border-top: 1px dashed rgba(33,35,34,.18); background: rgba(33,35,34,.035); text-align: left; cursor: pointer; color: inherit; }
.hm-readings.solo { border-top: 0; }
.hm-readings:hover { background: rgba(1,197,186,.12); }
[data-theme="dark"] .hm-unit { background: #2c2f2f; border-color: rgba(255,255,255,.15); }
[data-theme="dark"] .hm-readings { border-top-color: rgba(255,255,255,.15); background: rgba(255,255,255,.04); }
/* Popup de detalle */
.hmd-owner { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.hmd-owner small, .hmd-head small { display: block; opacity: .6; font-size: .78rem; }
.hmd-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1rem; }
.hmd-card { border: 1px solid rgba(33,35,34,.12); border-radius: 10px; padding: 1rem; border-top: 3px solid #c2410c; }
.hmd-card.hmd-heating { border-top-color: #b91c1c; }
.hmd-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; margin-bottom: .75rem; }
.hmd-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; text-align: center; }
.hmd-metrics div { padding: .5rem .25rem; border-radius: 8px; background: rgba(33,35,34,.045); }
.hmd-metrics span { display: block; font-size: .68rem; opacity: .6; }
.hmd-metrics b { display: block; font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.hmd-metrics i { display: block; font-style: normal; font-size: .62rem; opacity: .55; }
.hmd-note { font-size: .72rem; opacity: .65; margin: .5rem 0 0; }
.hmd-sub { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; opacity: .55; margin: .9rem 0 .35rem; }
.hm-chart { width: 100%; height: 64px; display: block; fill: #01c5ba; }
.hmd-table td { padding: .2rem .3rem; font-size: .78rem; }
[data-theme="dark"] .hmd-card { border-color: rgba(255,255,255,.15); }
[data-theme="dark"] .hmd-metrics div { background: rgba(255,255,255,.06); }

.btn-split { display: inline-flex; }
.btn-split > .btn:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.btn-split > .btn:last-child { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: -1px; padding: 0 .55rem; }
.ctr-mode { display: flex; gap: .35rem; padding: .25rem .35rem .5rem; margin-bottom: .35rem; border-bottom: 1px solid rgba(33,35,34,.1); }
.ctr-mode label { flex: 1; align-items: center !important; justify-content: center; padding: .35rem .5rem !important; border: 1px solid rgba(33,35,34,.15); }
.ctr-mode label:has(input:checked) { border-color: #01c5ba; background: rgba(1,197,186,.14); }
.ctr-mode input { position: absolute !important; opacity: 0 !important; width: 0 !important; height: 0 !important; }

/* Facturación: lecturas, precios e impuesto por tipo de contador */
.bill-sub { font-size: .68rem; opacity: .6; white-space: nowrap; font-variant-numeric: tabular-nums; }
#billTable td { white-space: nowrap; }

/* Interruptor «Tiempo real» */
.rt-wrap { display: inline-flex; align-items: center; gap: .55rem; padding: 0 .25rem; font-size: .8125rem; }
.rt-label { font-weight: 600; white-space: nowrap; }
.rt-status { font-size: .72rem; opacity: .6; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rt-dot { width: 9px; height: 9px; border-radius: 50%; background: #9aa0a0; flex: none; }
.rt-wrap.is-live .rt-dot { background: #22aa5a; animation: rtPulse 1.6s ease-in-out infinite; }
@keyframes rtPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(34,170,90,.5); } 50% { box-shadow: 0 0 0 6px rgba(34,170,90,0); } }
@media (prefers-reduced-motion: reduce) { .rt-wrap.is-live .rt-dot { animation: none; } }

/* Caja «Tiempo real» (a la izquierda del todo): icono + cuenta atrás */
.rt-btn { gap: .4rem; min-width: 42px; }
.rt-timer { font-size: .75rem; font-weight: 700; font-variant-numeric: tabular-nums; min-width: 0; }
.rt-btn.is-on svg { color: #22aa5a; animation: rtPulse2 1.6s ease-in-out infinite; }
@keyframes rtPulse2 { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
@media (prefers-reduced-motion: reduce) { .rt-btn.is-on svg { animation: none; } }
.rt-btn:not(.is-on) .rt-timer { display: none; }

/* Viviendas y Contadores: filtros bajo los totales, a la derecha */
.mx-filters { display: flex; justify-content: flex-end; align-items: center; gap: .5rem; flex-wrap: wrap; }

/* «Distribuido por» bajo «Desarrollado por»: pegado a la línea anterior */
/* el contenedor está en column-reverse: va antes en el HTML para salir debajo de «Desarrollado por» */
.side-info-by.side-info-dist { margin-top: .2rem !important; }
.side-info-by:not(.side-info-dist) { margin-top: 0 !important; }

/* Mis lecturas: acordeón de lecturas dentro de la tarjeta del contador */
.meter-card.is-open { grid-column: 1 / -1; }
.meter-detail { border-top: 1px solid rgba(33,35,34,.1); padding-top: 1rem; }
.meter-detail[hidden] { display: none; }
.meter-detail-head { display: flex; justify-content: space-between; align-items: center; font-size: .8125rem; font-weight: 700; margin-bottom: .5rem; }
.meter-toggle .meter-chev { margin-left: .15rem; transition: transform .2s; }
.meter-toggle[aria-expanded="true"] .meter-chev { transform: rotate(180deg); }
[data-theme="dark"] .meter-detail { border-top-color: rgba(255,255,255,.13); }

/* Menú lateral: su ancho sigue al tamaño de letra (rem) para que cada opción quede en una sola línea al ampliar el texto */
@media (min-width: 1024px) {
  #sideMenu { width: 13.5rem !important; }
  #sideMenu a.link { white-space: nowrap; }
  #sideMenu a.link > span { white-space: nowrap; }
  #sideMenuToggle { left: 13.5rem; }
  body.side-collapsed #sideMenuToggle { left: 0; }
  .app-nav > div:first-child { width: 13.5rem !important; }
}

/* Botón «Ver factura» (es un enlace): mismo aspecto y tamaño que el resto de acciones de la fila */
.app-card-table table.dataTable td a.table-action {
  display: inline-flex; align-items: center; justify-content: center; vertical-align: middle;
  width: 1.75rem; height: 1.75rem; padding: 0; margin-right: .25rem; box-sizing: border-box;
  border-radius: 5px; border: 1px solid rgba(33,35,34,.14); background: #fff; color: rgba(33,35,34,.6);
  text-decoration: none; transition: background .12s, color .12s, border-color .12s;
}
.app-card-table table.dataTable td a.table-action svg { width: .875rem; height: .875rem; display: block; pointer-events: none; }
.app-card-table table.dataTable td a.table-action:hover { background: rgba(1,197,186,.08); border-color: rgb(1,197,186); color: rgb(1,197,186); }
[data-theme="dark"] .app-card-table table.dataTable td a.table-action { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.14); color: rgba(255,255,255,.75); }
[data-theme="dark"] .app-card-table table.dataTable td a.table-action:hover { background: rgba(1,197,186,.18); border-color: #01c5ba; color: #01c5ba; }

/* Acciones de fila con huecos fijos: botones alineados entre filas */
.row-actions { display: grid; grid-template-columns: repeat(3, 1.75rem); gap: .25rem; align-items: center; justify-content: center; }
.row-actions .table-action, .app-card-table table.dataTable td .row-actions .table-action { margin: 0 !important; flex: none; }
.table-action-ph { display: inline-block; width: 1.75rem; height: 1.75rem; flex: none; }

/* Columna Acciones de Facturación: título y botones centrados sobre la misma rejilla */
#billTable th.col-actions { text-align: center; }
#billTable td:last-child { text-align: center; }

/* Facturación: tabla más compacta para que quepa en el ancho de la tarjeta; si aun así no cabe, la tarjeta se desplaza en horizontal */
#billTable > thead > tr > th, #billTable > tbody > tr > td { padding-left: .55rem !important; padding-right: .55rem !important; }
.app-card-table:has(#billTable) .dt-layout-table > .dt-layout-cell { overflow-x: auto; }   /* sólo se desplaza la tabla: los menús desplegables de la barra superior no se recortan */

/* Log de usuarios (muchas columnas): la tarjeta se desplaza en horizontal en vez de desbordarse */
.app-card-table:has(#usersLogTable) .dt-layout-table > .dt-layout-cell { overflow-x: auto; }   /* sólo se desplaza la tabla: los menús desplegables de la barra superior no se recortan */

/* Propietarios: tabla compacta; en pantallas estrechas la tarjeta se desplaza en horizontal en vez de desbordarse */
#ownersTable > thead > tr > th, #ownersTable > tbody > tr > td { padding-left: .55rem !important; padding-right: .55rem !important; }
.app-card-table:has(#ownersTable) .dt-layout-table > .dt-layout-cell { overflow-x: auto; }   /* sólo se desplaza la tabla: los menús desplegables de la barra superior no se recortan */

/* Servicio técnico: contactos en columnas; títulos legibles sobre fondo claro; icono de WhatsApp */
.crud-modal .info-doc h5 { color: #212322; }
[data-theme="dark"] .crud-modal .info-doc h5 { color: #fff; }
.sup-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1.5rem; }
.sup-cell { padding: .6rem 0; border-bottom: 1px solid rgba(33,35,34,.08); min-width: 0; }
.sup-cell .info-row-value { overflow-wrap: anywhere; }
.sup-hours { padding: .6rem 0; border-bottom: 1px solid rgba(33,35,34,.08); }
.wa-link { display: inline-flex; vertical-align: middle; margin-left: .35rem; color: #1a9e4a; }
.wa-link:hover { color: #25d366; }
@media (max-width: 520px) { .sup-grid { grid-template-columns: 1fr; } }

/* Importar y exportar, uno encima del otro (Propietarios y Viviendas y Contadores) */
.io-stack { display: flex; flex-direction: column; gap: 2px; flex: none; }
.io-stack .btn { min-height: 0 !important; height: 20px; padding: 0 .9rem; display: inline-flex; align-items: center; justify-content: center; }
.io-stack .btn svg { width: 14px; height: 14px; }
.io-stack .mx-export { position: relative; }
.io-stack .mx-export > .btn { width: 100%; }

/* Botón de tema de las páginas públicas (login, recuperar contraseña, contrato, errores, mantenimiento): abajo a la izquierda */
#btnDarkToggle:not(.in-nav) { right: auto; left: 1.25rem; }

/* ── Tema claro: más contraste y legibilidad (el oscuro no cambia) ── */
html:not([data-theme="dark"]) .page-subtitle,
html:not([data-theme="dark"]) .stat-card-name,
html:not([data-theme="dark"]) .dt-info,
html:not([data-theme="dark"]) .info-row-label { color: rgba(33,35,34,.7); }
html:not([data-theme="dark"]) .app-card-table table.dataTable > thead > tr:first-child > th { color: rgba(33,35,34,.75); font-size: .6563rem; }
html:not([data-theme="dark"]) .td-muted, html:not([data-theme="dark"]) .history-muted, html:not([data-theme="dark"]) .dash-muted { color: rgba(33,35,34,.62); }
html:not([data-theme="dark"]) .auth-subtitle { opacity: .75; }
/* el logo de acceso conserva su color de marca sobre fondo claro (antes se oscurecía) */
html:not([data-theme="dark"]) .auth-logo { filter: none; }
/* contrato: lectura más cómoda y el título del documento destacado */
.contract-body p { font-size: .9375rem; line-height: 1.7; }
.contract-body p:first-child { font-weight: 700; letter-spacing: .01em; }
/* foco visible para quien navega con teclado */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #0a9d94; outline-offset: 2px; }

/* Si una tarjeta se oculta, no se estira a la altura de la que tiene al lado */
.app-section:has(> .app-card.is-collapsed) { align-items: start; }

/* Botones que necesitan una selección: siguen activos (avisan al pulsarlos) pero se ven atenuados mientras no hay nada seleccionado */
.needs-selection, .needs-selection:hover { opacity: .5; cursor: not-allowed; }   /* al pasar el ratón sin selección: icono de «prohibido» */

/* Títulos de todos los popups en mayúsculas */
.crud-modal-title, .app-modal-title, .lk-modal-title { text-transform: uppercase; letter-spacing: .03em; }

/* Servicio técnico: el horario es un texto normal (blanco en tema oscuro); los valores de las filas también se leen en oscuro */
[data-theme="dark"] .info-doc .info-row-value { color: #fff; }

/* Menú del filtro de contratos (dentro de la barra de la tabla): las reglas de .dt-search ocultaban sus etiquetas */
.app-card-table .dt-search .ctr-filter-menu label { display: flex; }
.app-card-table .dt-search .ctr-filter-menu input[type="checkbox"],
.app-card-table .dt-search .ctr-filter-menu input[type="radio"] { border: 0 !important; padding: 0 !important; box-shadow: none !important; background: transparent; }
.app-card-table .dt-search .ctr-filter-menu input[type="checkbox"] { width: 16px !important; height: 16px !important; min-height: 16px !important; }
