/* Project-specific styles layered on top of Tailwind. RTL is set on /. */ :root { /* Primary brand = Herzog teal (matches the logo + ticket screen). Wine is the accent (headings / brand moments). Semantic colors stay semantic. */ --primary: #0f7c86; /* teal — main CTAs */ --primary-hover: #0b626a; /* teal — hover */ --primary-soft: #e6f4f5; /* very light teal — soft button background */ --primary-soft-hover: #d3ecee; --primary-text: #0b626a; /* readable brand-teal text (on light) */ --brand-blue: #0f7c86; /* active accent (tab underline, loading bar) → teal */ --brand-blue-deep: #0b626a; /* hover */ --brand-wine: #8a1f3d; /* Herzog burgundy — logo (tree + "הרצוג") */ --brand-wine-hover: #731833; /* burgundy hover */ --brand-teal: #0f7c86; /* Herzog teal — logo ("המכללה האקדמית") */ --brand-teal-hover: #0b626a; /* teal hover */ --page-bg: #f8fafc; /* very soft slate — page background */ --card-border: #e2e8f0; /* slate-200 — card hairline */ --card-soft: #f1f5f9; /* soft gray — empty-state / muted surfaces */ --card-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05); } /* === Brand: map default Tailwind blue-* → Herzog teal (global, one place) ====== Templates use raw `blue-*` utilities in ~200 spots. Rather than edit each, this recolors them to the brand teal everywhere, so the whole system matches the logo + ticket screen. Semantic colors (green/amber/red) are untouched. "Info" surfaces stay soft (light-teal background) so they read distinctly from solid teal buttons. Fully reversible: delete this block. */ .text-blue-400, .text-blue-500, .text-blue-600, .text-blue-700, .text-blue-800, .text-blue-900 { color: #0b626a !important; } .hover\:text-blue-700:hover, .hover\:text-blue-800:hover { color: #0b626a !important; } .bg-blue-500, .bg-blue-600 { background-color: #0f7c86 !important; } .bg-blue-100 { background-color: #e6f4f5 !important; } .bg-blue-50 { background-color: #f2fbfb !important; } /* soft info surface */ .hover\:bg-blue-50:hover { background-color: #e6f4f5 !important; } .border-blue-100, .border-blue-200 { border-color: #bfe3e6 !important; } .border-blue-400 { border-color: #86c7cc !important; } .hover\:border-blue-400:hover { border-color: #0f7c86 !important; } .ring-blue-50 { --tw-ring-color: #e6f4f5 !important; } /* light halo */ .ring-blue-200 { --tw-ring-color: #bfe3e6 !important; } .ring-blue-300 { --tw-ring-color: #86c7cc !important; } .ring-blue-500, .focus\:ring-blue-500:focus { --tw-ring-color: #0f7c86 !important; } .focus\:border-blue-500:focus { border-color: #0f7c86 !important; } /* === Button system =================================================== */ /* Filled primary CTA (e.g. "+ פנייה חדשה", "שלח"). */ .btn-primary { background: var(--primary); color: #fff; } .btn-primary:hover { background: var(--primary-hover); } /* Soft action button (e.g. "השב לפונה", "קח לטיפול") — airy light-blue fill. */ .btn-soft { background: var(--primary-soft); color: var(--primary-text); } .btn-soft:hover { background: var(--primary-soft-hover); } .btn-soft svg { color: var(--primary-text); } /* icons inherit the brand-blue text */ /* Herzog-brand buttons — used on the public intake page (teal primary). */ .btn-brand { background: var(--brand-teal); color: #fff; } .btn-brand:hover { background: var(--brand-teal-hover); } .btn-brand-outline { background: #fff; color: var(--brand-teal); border: 1px solid var(--brand-teal); } .btn-brand-outline:hover { background: #f0fafa; } .text-brand-wine { color: var(--brand-wine); } .text-brand-teal { color: var(--brand-teal); } /* Public intake: hide the request-details card until step 2 has content (no empty card). */ .hd-intake-form:not(:has(#form-body > *)) { display: none; } /* Public intake selects — modern placeholder: muted until a real value is chosen. */ .hd-intake-form select:required:invalid { color: #94a3b8; } .hd-intake-form select option[value=""] { color: #94a3b8; } .hd-intake-form select option { color: #0f172a; } /* Brand-teal focus + selected option (match the form's Herzog styling). */ .hd-intake-form input:focus, .hd-intake-form select:focus, .hd-intake-form textarea:focus { outline: none; border-color: var(--brand-teal); box-shadow: 0 0 0 2px rgba(15, 124, 134, 0.20); } .hd-intake-form select { accent-color: var(--brand-teal); } /* === hd-select — custom teal dropdown (enhances select.hd-select) ========= */ .hd-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; min-width: 0 !important; max-width: 1px !important; min-height: 0 !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; flex: 0 0 auto !important; } .hd-select-wrap { position: relative; } .hd-select-btn { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: .5rem; text-align: start; background: #fff; border: 1px solid #cbd5e1; border-radius: .375rem; padding: .625rem .75rem; font-size: .875rem; color: #0f172a; cursor: pointer; } .hd-select-btn:focus { outline: none; border-color: var(--brand-teal); box-shadow: 0 0 0 2px rgba(15, 124, 134, .20); } .hd-select-wrap.open .hd-select-btn { border-color: var(--brand-teal); box-shadow: 0 0 0 2px rgba(15, 124, 134, .20); } .hd-select-label.hd-placeholder { color: #94a3b8; } .hd-select-chev { color: #94a3b8; display: inline-flex; align-items: center; transition: transform .15s ease; } .hd-select-wrap.open .hd-select-chev { transform: rotate(180deg); } .hd-select-list { position: absolute; z-index: 40; top: calc(100% + 4px); inset-inline: 0; max-height: 15rem; overflow: auto; margin: 0; padding: .25rem; list-style: none; background: #fff; border: 1px solid #e2e8f0; border-radius: .5rem; box-shadow: 0 10px 30px rgba(2, 6, 23, .14); } .hd-select-wrap.open-up .hd-select-list { top: auto; bottom: calc(100% + 4px); } .hd-select-opt { padding: .5rem .625rem; border-radius: .375rem; font-size: .875rem; color: #0f172a; cursor: pointer; } .hd-select-opt.hd-opt-placeholder { color: #94a3b8; } .hd-select-opt.is-selected:not(.active) { background: rgba(15, 124, 134, .08); font-weight: 600; } .hd-select-opt.active { background: var(--brand-teal); color: #fff; } /* optgroup header inside the custom list (non-selectable) */ .hd-select-group { padding: .5rem .625rem .2rem; font-size: .72rem; font-weight: 700; color: #94a3b8; pointer-events: none; letter-spacing: .01em; } .hd-select-group:not(:first-child) { border-top: 1px solid #f1f5f9; margin-top: .15rem; } /* type-to-filter box, shown at the top of long lists */ .hd-select-search { position: sticky; top: 0; z-index: 1; background: #fff; padding: 4px 4px 7px; margin: -2px -2px 3px; border-bottom: 1px solid #f1f5f9; list-style: none; } .hd-select-search-input { width: 100%; border: 1px solid #e2e8f0; border-radius: 7px; padding: 7px 10px; font: inherit; font-size: .85rem; color: #0f172a; outline: none; } .hd-select-search-input:focus { border-color: var(--brand-teal); box-shadow: 0 0 0 2px rgba(15,124,134,.15); } /* === hd-upload — drag & drop file zone ==================================== */ .hd-upload-zone { border: 2px dashed #cbd5e1; border-radius: .5rem; padding: 1.25rem; text-align: center; color: #64748b; cursor: pointer; transition: border-color .15s, background .15s; } .hd-upload-zone:hover { border-color: var(--brand-teal); } .hd-upload-zone.dragover { border-color: var(--brand-teal); background: rgba(15, 124, 134, .06); } .hd-upload-list { list-style: none; margin: .5rem 0 0; padding: 0; display: flex; flex-direction: column; gap: .375rem; } .hd-upload-item { display: flex; align-items: center; gap: .5rem; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: .375rem; padding: .375rem .625rem; font-size: .8125rem; } .hd-upload-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #334155; } .hd-upload-size { color: #94a3b8; font-size: .75rem; white-space: nowrap; } .hd-upload-remove { color: #94a3b8; width: 1.25rem; height: 1.25rem; border-radius: 9999px; line-height: 1; flex-shrink: 0; } .hd-upload-remove:hover { color: #dc2626; background: #fee2e2; } /* Collapsible

(e.g. the read-only "פרטים מפורטל הסטודנט" block). */ .hd-collapse > summary { list-style: none; } .hd-collapse > summary::-webkit-details-marker { display: none; } .hd-collapse .hd-chevron { transition: transform .15s ease; } .hd-collapse[open] .hd-chevron { transform: rotate(180deg); } /* HTMX loading swap: show "מזהה…" only while a request is in flight. */ .htmx-indicator { display: none; } .htmx-request .htmx-indicator { display: inline; } .htmx-request .htmx-label { display: none; } /* Inline-editable field (properties panel) — looks like text, reveals control on hover/focus. */ .inline-edit { width: 100%; max-width: 100%; border: 1px solid transparent; background: transparent; border-radius: 6px; padding: .2rem .4rem; font-size: 14px; color: #1e293b; cursor: pointer; text-align: start; transition: border-color .12s, background .12s; } .inline-edit:hover { border-color: var(--card-border); background: #fff; } .inline-edit:focus { border-color: var(--primary); background: #fff; outline: none; } /* Reusable card surface — white, hairline border, soft modern shadow. */ .ui-card { background: #fff; border: 1px solid var(--card-border); border-radius: 8px; box-shadow: var(--card-shadow); } /* Typography — clean modern Hebrew face with system fallback. */ html, body { font-family: 'Assistant', 'Segoe UI', 'Noto Sans Hebrew', Arial, sans-serif; } body { background: var(--page-bg); } /* Top header: white, lifted off the page with a soft modern elevation (subtle drop shadow + a hairline bottom border for crispness on flat screens). */ .app-header { background: #fff; border-bottom: 1px solid #eaecf0; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02), 0 1px 0 rgba(0, 0, 0, 0.04); } .brand-mark { background: var(--brand-wine); color: #fff; } /* Header nav links — generous spacing, subtle hover, clear active underline. */ .nav-link { position: relative; padding: .5rem .85rem; border-radius: .5rem; color: #475569; transition: color .15s, background .15s; } .nav-link:hover { color: var(--brand-blue); background: #f1f5f9; } .nav-link.active { color: var(--brand-blue); font-weight: 600; } .nav-link.active::after { content: ""; position: absolute; inset-inline: .85rem; bottom: -2px; height: 2px; background: var(--brand-blue); border-radius: 2px; } /* Global side navigation — premium SaaS polish. */ .nav-item { display: flex; align-items: center; gap: .625rem; border-radius: 8px; padding: .55rem 1rem; /* floating pill (nav has 8px gutter) */ font-size: 14px; line-height: 1.2; color: #64748b; /* slate-500 */ transition: background .15s, color .15s; } .nav-item:hover { color: #1e293b; background: #f1f5f9; } .nav-item.active { color: #1e293b; background: #f1f5f9; font-weight: 600; } /* Nested sub-items: delicate, indented (RTL → indent from the right), no icons. */ .nav-sub { padding-block: .4rem; padding-inline-start: 1.75rem; font-size: 13px; } /* Small muted section headers inside the admin accordion (non-clickable labels). */ .nav-section { margin-top: 18px; padding: .25rem 1rem; font-size: 12px; font-weight: 600; letter-spacing: .03em; color: #a3adbb; /* a touch lighter than slate-400 */ } /* Hide the sidebar scrollbar entirely — keep the divider a single clean line. */ .app-nav nav { scrollbar-width: none; } .app-nav nav::-webkit-scrollbar { display: none; } /* Icon-only when collapsed. */ .app-nav.nav-collapsed .nav-label { display: none; } .app-nav.nav-collapsed .nav-item { justify-content: center; padding-inline: .5rem; } .app-nav.nav-collapsed .nav-accordion-body, .app-nav.nav-collapsed .nav-section { display: none; } /* Admin collapsible sidebar — icon-only when collapsed. */ #admin-sidebar.sidebar-collapsed .side-text { display: none; } #admin-sidebar.sidebar-collapsed summary { justify-content: center; } #admin-sidebar.sidebar-collapsed .side-item { justify-content: center; } /* Ticket detail tabs — modern underline style (no chunky filled background). */ .tab-btn { border-bottom: 2px solid transparent; } .tab-active { color: var(--brand-blue); border-bottom-color: var(--brand-blue); font-weight: 600; } .tab-active:hover { color: var(--brand-blue); } /* Files tab — filter chips + drag-over highlight. */ .hd-file-chip { color: var(--slate-500, #64748b); background: #fff; transition: background .15s, color .15s, border-color .15s; } .hd-file-chip:hover { background: #f8fafc; } .hd-chip-on { background: var(--brand-blue); border-color: var(--brand-blue) !important; color: #fff; } .hd-dropzone.hd-dragging { border-color: var(--brand-blue); background: #e6f4f5; } /* Deep-link highlight — e.g. /incidents#incident-3 from a ticket's incident badge. */ tr[id^="incident-"]:target { background-color: #fffbeb; transition: background-color 1.5s ease; } /* HTMX inline indicators (e.g. the "טוען…" text in the filter bar). */ .htmx-indicator { opacity: 0; transition: opacity .2s; } .htmx-request .htmx-indicator, .htmx-request.htmx-indicator { opacity: 1; } /* Global top loading bar. */ #loading-bar { position: fixed; top: 0; right: 0; left: 0; height: 3px; background: linear-gradient(90deg, var(--brand-blue), #5bb8c0); transform: scaleX(0); transform-origin: right; transition: transform .3s ease; z-index: 50; opacity: 0; } #loading-bar.on { transform: scaleX(0.8); opacity: 1; } /* === Dark mode ============================================================ Mirrors the blue→teal technique: one place remaps the common light Tailwind utilities to a dark, teal-tinted palette when html[data-theme="dark"]. Not pure black (GitHub-style dark slate); brand + semantic colors lightened for contrast. Reversible: delete this block. Phase 1 = shared shell + common utilities + ticket conversation; arbitrary-hex spots polished per screen. */ html[data-theme="dark"] { --page-bg:#14191f; --card-border:#3a4653; --card-soft:#262e37; --primary-soft:#12312f; --primary-soft-hover:#164039; --primary-text:#63c8cf; --card-shadow:0 1px 3px 0 rgba(0,0,0,.45); color-scheme: dark; } html[data-theme="dark"] body { background:#14191f !important; color:#e5eaec !important; } /* theme-toggle icon swap */ html[data-theme="dark"] #theme-toggle .ic-moon { display:none; } html[data-theme="dark"] #theme-toggle .ic-sun { display:inline-block !important; } /* surfaces */ html[data-theme="dark"] .bg-white { background-color:#212a33 !important; } html[data-theme="dark"] .bg-slate-50 { background-color:#191f26 !important; } html[data-theme="dark"] .bg-slate-100 { background-color:#262e37 !important; } html[data-theme="dark"] .bg-slate-200 { background-color:#26333a !important; } html[data-theme="dark"] .hover\:bg-slate-50:hover { background-color:#262e37 !important; } html[data-theme="dark"] .hover\:bg-slate-100:hover { background-color:#212e34 !important; } html[data-theme="dark"] .bg-\[var\(--page-bg\)\] { background-color:#14191f !important; } /* text */ html[data-theme="dark"] .text-slate-900 { color:#e5eaec !important; } html[data-theme="dark"] .text-slate-800 { color:#dbe3e5 !important; } html[data-theme="dark"] .text-slate-700 { color:#c3ced2 !important; } html[data-theme="dark"] .text-slate-600 { color:#aab8bd !important; } html[data-theme="dark"] .text-slate-500 { color:#aab7bd !important; } html[data-theme="dark"] .text-slate-400 { color:#84939b !important; } html[data-theme="dark"] .text-slate-300 { color:#55666c !important; } /* borders */ html[data-theme="dark"] .border-slate-100 { border-color:#1f2b30 !important; } html[data-theme="dark"] .border-slate-200 { border-color:#3a4653 !important; } html[data-theme="dark"] .border-slate-300 { border-color:#33434a !important; } html[data-theme="dark"] .border-\[\#eaecf0\] { border-color:#3a4653 !important; } html[data-theme="dark"] .divide-slate-100 > * + * { border-color:#1f2b30 !important; } /* brand-remapped (teal) links + soft surfaces — lighten for dark ground */ html[data-theme="dark"] .text-blue-400, html[data-theme="dark"] .text-blue-500, html[data-theme="dark"] .text-blue-600, html[data-theme="dark"] .text-blue-700, html[data-theme="dark"] .text-blue-800, html[data-theme="dark"] .text-blue-900 { color:#63c8cf !important; } html[data-theme="dark"] .bg-blue-50 { background-color:#12312f !important; } html[data-theme="dark"] .bg-blue-100 { background-color:#143a37 !important; } /* form controls */ html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { background-color:#191f26; color:#e5eaec; border-color:#33434a; } html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color:#6b7d84; } /* ticket conversation + header (arbitrary-hex, high-traffic screen) */ html[data-theme="dark"] .bg-\[\#EBF3F6\] { background-color:#152a2e !important; } html[data-theme="dark"] .bg-\[\#F4F5F7\] { background-color:#262e37 !important; } html[data-theme="dark"] .bg-\[\#e6f4f5\] { background-color:#12312f !important; } html[data-theme="dark"] .text-\[\#1A3644\] { color:#cfe3e8 !important; } html[data-theme="dark"] .text-\[\#2D3748\] { color:#c4cfd6 !important; } html[data-theme="dark"] .text-\[\#0b626a\] { color:#63c8cf !important; } html[data-theme="dark"] .bg-\[\#FFF9E6\] { background-color:#2c2712 !important; } /* internal note */ html[data-theme="dark"] .border-\[\#FDE68A\] { border-color:#5a4c1e !important; } html[data-theme="dark"] .text-\[\#451A03\] { color:#e6c884 !important; } /* semantic soft surfaces darken (keep the hue, drop the brightness) */ html[data-theme="dark"] .bg-green-50, html[data-theme="dark"] .bg-emerald-50 { background-color:#12321f !important; } html[data-theme="dark"] .bg-amber-50 { background-color:#3a2f14 !important; } html[data-theme="dark"] .bg-red-50 { background-color:#3a1a20 !important; } html[data-theme="dark"] .text-green-800, html[data-theme="dark"] .text-emerald-600 { color:#5fd39e !important; } html[data-theme="dark"] .text-amber-800 { color:#e6c884 !important; } html[data-theme="dark"] .text-red-600, html[data-theme="dark"] .text-red-700, html[data-theme="dark"] .text-red-800 { color:#f2818f !important; } html[data-theme="dark"] .border-green-200 { border-color:#1f5236 !important; } html[data-theme="dark"] .border-amber-200 { border-color:#5a4c1e !important; } html[data-theme="dark"] .border-red-200 { border-color:#5a2530 !important; } /* backdrop-blur header/menus over dark */ html[data-theme="dark"] .bg-\[var\(--page-bg\)\]\/95, html[data-theme="dark"] .supports-\[backdrop-filter\]\:bg-\[var\(--page-bg\)\]\/80 { background-color:rgba(20,25,31,.85) !important; } /* custom select (hd-select.js) — dark variant so the dropdown stays readable */ html[data-theme="dark"] .hd-select-btn { background:#191f26; border-color:#3a4653; color:#e9eef0; } html[data-theme="dark"] .hd-select-list { background:#212a33; border-color:#3a4653; box-shadow:0 12px 34px rgba(0,0,0,.55); } html[data-theme="dark"] .hd-select-opt { color:#e9eef0; } html[data-theme="dark"] .hd-select-opt:hover, html[data-theme="dark"] .hd-select-opt.active { background:#2d3a45; } html[data-theme="dark"] .hd-select-opt.is-selected:not(.active) { background:rgba(99,200,207,.15); } html[data-theme="dark"] .hd-select-label.hd-placeholder, html[data-theme="dark"] .hd-select-opt.hd-opt-placeholder { color:#84939b; } html[data-theme="dark"] .hd-select-search { background:#212a33; border-bottom-color:#3a4653; } html[data-theme="dark"] .hd-select-search-input { background:#191f26; border-color:#3a4653; color:#e9eef0; } /* brighter primary text + crisper generic dropdown menus for clarity */ html[data-theme="dark"] body, html[data-theme="dark"] .text-slate-900 { color:#eaf0f2 !important; } html[data-theme="dark"] .shadow-lg, html[data-theme="dark"] .shadow-xl { box-shadow:0 12px 34px rgba(0,0,0,.55) !important; } /* ===== Dark mode — comprehensive pass (systematic per-family coverage) ===== */ html[data-theme="dark"] .hover\:bg-slate-50\/80:hover, html[data-theme="dark"] .hover\:bg-slate-50\/50:hover, html[data-theme="dark"] .hover\:bg-slate-100\/80:hover { background-color:#242d37 !important; } html[data-theme="dark"] .bg-slate-50\/80, html[data-theme="dark"] .bg-slate-50\/60, html[data-theme="dark"] .bg-slate-50\/50 { background-color:#191f26 !important; } html[data-theme="dark"] .bg-white\/95, html[data-theme="dark"] .bg-white\/90, html[data-theme="dark"] .bg-white\/80 { background-color:rgba(33,42,51,.92) !important; } html[data-theme="dark"] .bg-green-50 { background-color:#12321f !important; } html[data-theme="dark"] .bg-green-100 { background-color:#17402a !important; } html[data-theme="dark"] .text-green-400, html[data-theme="dark"] .text-green-500, html[data-theme="dark"] .text-green-600, html[data-theme="dark"] .text-green-700, html[data-theme="dark"] .text-green-800, html[data-theme="dark"] .text-green-900 { color:#5fd39e !important; } html[data-theme="dark"] .border-green-100, html[data-theme="dark"] .border-green-200, html[data-theme="dark"] .border-green-300 { border-color:#21563a !important; } html[data-theme="dark"] .border-r-green-400, html[data-theme="dark"] .border-r-green-500, html[data-theme="dark"] .border-r-green-600, html[data-theme="dark"] .border-l-green-400, html[data-theme="dark"] .border-l-green-500 { border-color:#2f8f66 !important; } html[data-theme="dark"] .bg-green-500, html[data-theme="dark"] .bg-green-600, html[data-theme="dark"] .bg-green-700 { background-color:#2f8f66 !important; } html[data-theme="dark"] .ring-green-200 { --tw-ring-color:#21563a !important; } html[data-theme="dark"] .bg-emerald-50 { background-color:#12321f !important; } html[data-theme="dark"] .bg-emerald-100 { background-color:#17402a !important; } html[data-theme="dark"] .text-emerald-400, html[data-theme="dark"] .text-emerald-500, html[data-theme="dark"] .text-emerald-600, html[data-theme="dark"] .text-emerald-700, html[data-theme="dark"] .text-emerald-800, html[data-theme="dark"] .text-emerald-900 { color:#5fd39e !important; } html[data-theme="dark"] .border-emerald-100, html[data-theme="dark"] .border-emerald-200, html[data-theme="dark"] .border-emerald-300 { border-color:#21563a !important; } html[data-theme="dark"] .border-r-emerald-400, html[data-theme="dark"] .border-r-emerald-500, html[data-theme="dark"] .border-r-emerald-600, html[data-theme="dark"] .border-l-emerald-400, html[data-theme="dark"] .border-l-emerald-500 { border-color:#2f8f66 !important; } html[data-theme="dark"] .bg-emerald-500, html[data-theme="dark"] .bg-emerald-600, html[data-theme="dark"] .bg-emerald-700 { background-color:#2f8f66 !important; } html[data-theme="dark"] .ring-emerald-200 { --tw-ring-color:#21563a !important; } html[data-theme="dark"] .bg-teal-50 { background-color:#12321f !important; } html[data-theme="dark"] .bg-teal-100 { background-color:#17402a !important; } html[data-theme="dark"] .text-teal-400, html[data-theme="dark"] .text-teal-500, html[data-theme="dark"] .text-teal-600, html[data-theme="dark"] .text-teal-700, html[data-theme="dark"] .text-teal-800, html[data-theme="dark"] .text-teal-900 { color:#5fd39e !important; } html[data-theme="dark"] .border-teal-100, html[data-theme="dark"] .border-teal-200, html[data-theme="dark"] .border-teal-300 { border-color:#21563a !important; } html[data-theme="dark"] .border-r-teal-400, html[data-theme="dark"] .border-r-teal-500, html[data-theme="dark"] .border-r-teal-600, html[data-theme="dark"] .border-l-teal-400, html[data-theme="dark"] .border-l-teal-500 { border-color:#2f8f66 !important; } html[data-theme="dark"] .bg-teal-500, html[data-theme="dark"] .bg-teal-600, html[data-theme="dark"] .bg-teal-700 { background-color:#2f8f66 !important; } html[data-theme="dark"] .ring-teal-200 { --tw-ring-color:#21563a !important; } html[data-theme="dark"] .bg-lime-50 { background-color:#12321f !important; } html[data-theme="dark"] .bg-lime-100 { background-color:#17402a !important; } html[data-theme="dark"] .text-lime-400, html[data-theme="dark"] .text-lime-500, html[data-theme="dark"] .text-lime-600, html[data-theme="dark"] .text-lime-700, html[data-theme="dark"] .text-lime-800, html[data-theme="dark"] .text-lime-900 { color:#5fd39e !important; } html[data-theme="dark"] .border-lime-100, html[data-theme="dark"] .border-lime-200, html[data-theme="dark"] .border-lime-300 { border-color:#21563a !important; } html[data-theme="dark"] .border-r-lime-400, html[data-theme="dark"] .border-r-lime-500, html[data-theme="dark"] .border-r-lime-600, html[data-theme="dark"] .border-l-lime-400, html[data-theme="dark"] .border-l-lime-500 { border-color:#2f8f66 !important; } html[data-theme="dark"] .bg-lime-500, html[data-theme="dark"] .bg-lime-600, html[data-theme="dark"] .bg-lime-700 { background-color:#2f8f66 !important; } html[data-theme="dark"] .ring-lime-200 { --tw-ring-color:#21563a !important; } html[data-theme="dark"] .bg-red-50 { background-color:#3a1a20 !important; } html[data-theme="dark"] .bg-red-100 { background-color:#48222b !important; } html[data-theme="dark"] .text-red-400, html[data-theme="dark"] .text-red-500, html[data-theme="dark"] .text-red-600, html[data-theme="dark"] .text-red-700, html[data-theme="dark"] .text-red-800, html[data-theme="dark"] .text-red-900 { color:#f2818f !important; } html[data-theme="dark"] .border-red-100, html[data-theme="dark"] .border-red-200, html[data-theme="dark"] .border-red-300 { border-color:#5e2733 !important; } html[data-theme="dark"] .border-r-red-400, html[data-theme="dark"] .border-r-red-500, html[data-theme="dark"] .border-r-red-600, html[data-theme="dark"] .border-l-red-400, html[data-theme="dark"] .border-l-red-500 { border-color:#c0505f !important; } html[data-theme="dark"] .bg-red-500, html[data-theme="dark"] .bg-red-600, html[data-theme="dark"] .bg-red-700 { background-color:#c0505f !important; } html[data-theme="dark"] .ring-red-200 { --tw-ring-color:#5e2733 !important; } html[data-theme="dark"] .bg-rose-50 { background-color:#3a1a20 !important; } html[data-theme="dark"] .bg-rose-100 { background-color:#48222b !important; } html[data-theme="dark"] .text-rose-400, html[data-theme="dark"] .text-rose-500, html[data-theme="dark"] .text-rose-600, html[data-theme="dark"] .text-rose-700, html[data-theme="dark"] .text-rose-800, html[data-theme="dark"] .text-rose-900 { color:#f2818f !important; } html[data-theme="dark"] .border-rose-100, html[data-theme="dark"] .border-rose-200, html[data-theme="dark"] .border-rose-300 { border-color:#5e2733 !important; } html[data-theme="dark"] .border-r-rose-400, html[data-theme="dark"] .border-r-rose-500, html[data-theme="dark"] .border-r-rose-600, html[data-theme="dark"] .border-l-rose-400, html[data-theme="dark"] .border-l-rose-500 { border-color:#c0505f !important; } html[data-theme="dark"] .bg-rose-500, html[data-theme="dark"] .bg-rose-600, html[data-theme="dark"] .bg-rose-700 { background-color:#c0505f !important; } html[data-theme="dark"] .ring-rose-200 { --tw-ring-color:#5e2733 !important; } html[data-theme="dark"] .bg-amber-50 { background-color:#382c12 !important; } html[data-theme="dark"] .bg-amber-100 { background-color:#453718 !important; } html[data-theme="dark"] .text-amber-400, html[data-theme="dark"] .text-amber-500, html[data-theme="dark"] .text-amber-600, html[data-theme="dark"] .text-amber-700, html[data-theme="dark"] .text-amber-800, html[data-theme="dark"] .text-amber-900 { color:#e8c67a !important; } html[data-theme="dark"] .border-amber-100, html[data-theme="dark"] .border-amber-200, html[data-theme="dark"] .border-amber-300 { border-color:#5c4c1f !important; } html[data-theme="dark"] .border-r-amber-400, html[data-theme="dark"] .border-r-amber-500, html[data-theme="dark"] .border-r-amber-600, html[data-theme="dark"] .border-l-amber-400, html[data-theme="dark"] .border-l-amber-500 { border-color:#a5842f !important; } html[data-theme="dark"] .bg-amber-500, html[data-theme="dark"] .bg-amber-600, html[data-theme="dark"] .bg-amber-700 { background-color:#a5842f !important; } html[data-theme="dark"] .ring-amber-200 { --tw-ring-color:#5c4c1f !important; } html[data-theme="dark"] .bg-orange-50 { background-color:#382c12 !important; } html[data-theme="dark"] .bg-orange-100 { background-color:#453718 !important; } html[data-theme="dark"] .text-orange-400, html[data-theme="dark"] .text-orange-500, html[data-theme="dark"] .text-orange-600, html[data-theme="dark"] .text-orange-700, html[data-theme="dark"] .text-orange-800, html[data-theme="dark"] .text-orange-900 { color:#e8c67a !important; } html[data-theme="dark"] .border-orange-100, html[data-theme="dark"] .border-orange-200, html[data-theme="dark"] .border-orange-300 { border-color:#5c4c1f !important; } html[data-theme="dark"] .border-r-orange-400, html[data-theme="dark"] .border-r-orange-500, html[data-theme="dark"] .border-r-orange-600, html[data-theme="dark"] .border-l-orange-400, html[data-theme="dark"] .border-l-orange-500 { border-color:#a5842f !important; } html[data-theme="dark"] .bg-orange-500, html[data-theme="dark"] .bg-orange-600, html[data-theme="dark"] .bg-orange-700 { background-color:#a5842f !important; } html[data-theme="dark"] .ring-orange-200 { --tw-ring-color:#5c4c1f !important; } html[data-theme="dark"] .bg-yellow-50 { background-color:#382c12 !important; } html[data-theme="dark"] .bg-yellow-100 { background-color:#453718 !important; } html[data-theme="dark"] .text-yellow-400, html[data-theme="dark"] .text-yellow-500, html[data-theme="dark"] .text-yellow-600, html[data-theme="dark"] .text-yellow-700, html[data-theme="dark"] .text-yellow-800, html[data-theme="dark"] .text-yellow-900 { color:#e8c67a !important; } html[data-theme="dark"] .border-yellow-100, html[data-theme="dark"] .border-yellow-200, html[data-theme="dark"] .border-yellow-300 { border-color:#5c4c1f !important; } html[data-theme="dark"] .border-r-yellow-400, html[data-theme="dark"] .border-r-yellow-500, html[data-theme="dark"] .border-r-yellow-600, html[data-theme="dark"] .border-l-yellow-400, html[data-theme="dark"] .border-l-yellow-500 { border-color:#a5842f !important; } html[data-theme="dark"] .bg-yellow-500, html[data-theme="dark"] .bg-yellow-600, html[data-theme="dark"] .bg-yellow-700 { background-color:#a5842f !important; } html[data-theme="dark"] .ring-yellow-200 { --tw-ring-color:#5c4c1f !important; } html[data-theme="dark"] .bg-blue-50 { background-color:#12312f !important; } html[data-theme="dark"] .bg-blue-100 { background-color:#173f3c !important; } html[data-theme="dark"] .text-blue-400, html[data-theme="dark"] .text-blue-500, html[data-theme="dark"] .text-blue-600, html[data-theme="dark"] .text-blue-700, html[data-theme="dark"] .text-blue-800, html[data-theme="dark"] .text-blue-900 { color:#63c8cf !important; } html[data-theme="dark"] .border-blue-100, html[data-theme="dark"] .border-blue-200, html[data-theme="dark"] .border-blue-300 { border-color:#255e5b !important; } html[data-theme="dark"] .border-r-blue-400, html[data-theme="dark"] .border-r-blue-500, html[data-theme="dark"] .border-r-blue-600, html[data-theme="dark"] .border-l-blue-400, html[data-theme="dark"] .border-l-blue-500 { border-color:#3a9aa2 !important; } html[data-theme="dark"] .bg-blue-500, html[data-theme="dark"] .bg-blue-600, html[data-theme="dark"] .bg-blue-700 { background-color:#3a9aa2 !important; } html[data-theme="dark"] .ring-blue-200 { --tw-ring-color:#255e5b !important; } html[data-theme="dark"] .bg-cyan-50 { background-color:#123033 !important; } html[data-theme="dark"] .bg-cyan-100 { background-color:#173f43 !important; } html[data-theme="dark"] .text-cyan-400, html[data-theme="dark"] .text-cyan-500, html[data-theme="dark"] .text-cyan-600, html[data-theme="dark"] .text-cyan-700, html[data-theme="dark"] .text-cyan-800, html[data-theme="dark"] .text-cyan-900 { color:#6bd0e0 !important; } html[data-theme="dark"] .border-cyan-100, html[data-theme="dark"] .border-cyan-200, html[data-theme="dark"] .border-cyan-300 { border-color:#1f4a50 !important; } html[data-theme="dark"] .border-r-cyan-400, html[data-theme="dark"] .border-r-cyan-500, html[data-theme="dark"] .border-r-cyan-600, html[data-theme="dark"] .border-l-cyan-400, html[data-theme="dark"] .border-l-cyan-500 { border-color:#3aa0b0 !important; } html[data-theme="dark"] .bg-cyan-500, html[data-theme="dark"] .bg-cyan-600, html[data-theme="dark"] .bg-cyan-700 { background-color:#3aa0b0 !important; } html[data-theme="dark"] .ring-cyan-200 { --tw-ring-color:#1f4a50 !important; } html[data-theme="dark"] .bg-sky-50 { background-color:#123033 !important; } html[data-theme="dark"] .bg-sky-100 { background-color:#173f43 !important; } html[data-theme="dark"] .text-sky-400, html[data-theme="dark"] .text-sky-500, html[data-theme="dark"] .text-sky-600, html[data-theme="dark"] .text-sky-700, html[data-theme="dark"] .text-sky-800, html[data-theme="dark"] .text-sky-900 { color:#6bd0e0 !important; } html[data-theme="dark"] .border-sky-100, html[data-theme="dark"] .border-sky-200, html[data-theme="dark"] .border-sky-300 { border-color:#1f4a50 !important; } html[data-theme="dark"] .border-r-sky-400, html[data-theme="dark"] .border-r-sky-500, html[data-theme="dark"] .border-r-sky-600, html[data-theme="dark"] .border-l-sky-400, html[data-theme="dark"] .border-l-sky-500 { border-color:#3aa0b0 !important; } html[data-theme="dark"] .bg-sky-500, html[data-theme="dark"] .bg-sky-600, html[data-theme="dark"] .bg-sky-700 { background-color:#3aa0b0 !important; } html[data-theme="dark"] .ring-sky-200 { --tw-ring-color:#1f4a50 !important; } html[data-theme="dark"] .bg-indigo-50 { background-color:#20203f !important; } html[data-theme="dark"] .bg-indigo-100 { background-color:#292955 !important; } html[data-theme="dark"] .text-indigo-400, html[data-theme="dark"] .text-indigo-500, html[data-theme="dark"] .text-indigo-600, html[data-theme="dark"] .text-indigo-700, html[data-theme="dark"] .text-indigo-800, html[data-theme="dark"] .text-indigo-900 { color:#aab0ee !important; } html[data-theme="dark"] .border-indigo-100, html[data-theme="dark"] .border-indigo-200, html[data-theme="dark"] .border-indigo-300 { border-color:#39396e !important; } html[data-theme="dark"] .border-r-indigo-400, html[data-theme="dark"] .border-r-indigo-500, html[data-theme="dark"] .border-r-indigo-600, html[data-theme="dark"] .border-l-indigo-400, html[data-theme="dark"] .border-l-indigo-500 { border-color:#6c6cc0 !important; } html[data-theme="dark"] .bg-indigo-500, html[data-theme="dark"] .bg-indigo-600, html[data-theme="dark"] .bg-indigo-700 { background-color:#6c6cc0 !important; } html[data-theme="dark"] .ring-indigo-200 { --tw-ring-color:#39396e !important; } html[data-theme="dark"] .bg-violet-50 { background-color:#20203f !important; } html[data-theme="dark"] .bg-violet-100 { background-color:#292955 !important; } html[data-theme="dark"] .text-violet-400, html[data-theme="dark"] .text-violet-500, html[data-theme="dark"] .text-violet-600, html[data-theme="dark"] .text-violet-700, html[data-theme="dark"] .text-violet-800, html[data-theme="dark"] .text-violet-900 { color:#aab0ee !important; } html[data-theme="dark"] .border-violet-100, html[data-theme="dark"] .border-violet-200, html[data-theme="dark"] .border-violet-300 { border-color:#39396e !important; } html[data-theme="dark"] .border-r-violet-400, html[data-theme="dark"] .border-r-violet-500, html[data-theme="dark"] .border-r-violet-600, html[data-theme="dark"] .border-l-violet-400, html[data-theme="dark"] .border-l-violet-500 { border-color:#6c6cc0 !important; } html[data-theme="dark"] .bg-violet-500, html[data-theme="dark"] .bg-violet-600, html[data-theme="dark"] .bg-violet-700 { background-color:#6c6cc0 !important; } html[data-theme="dark"] .ring-violet-200 { --tw-ring-color:#39396e !important; } html[data-theme="dark"] .bg-purple-50 { background-color:#20203f !important; } html[data-theme="dark"] .bg-purple-100 { background-color:#292955 !important; } html[data-theme="dark"] .text-purple-400, html[data-theme="dark"] .text-purple-500, html[data-theme="dark"] .text-purple-600, html[data-theme="dark"] .text-purple-700, html[data-theme="dark"] .text-purple-800, html[data-theme="dark"] .text-purple-900 { color:#aab0ee !important; } html[data-theme="dark"] .border-purple-100, html[data-theme="dark"] .border-purple-200, html[data-theme="dark"] .border-purple-300 { border-color:#39396e !important; } html[data-theme="dark"] .border-r-purple-400, html[data-theme="dark"] .border-r-purple-500, html[data-theme="dark"] .border-r-purple-600, html[data-theme="dark"] .border-l-purple-400, html[data-theme="dark"] .border-l-purple-500 { border-color:#6c6cc0 !important; } html[data-theme="dark"] .bg-purple-500, html[data-theme="dark"] .bg-purple-600, html[data-theme="dark"] .bg-purple-700 { background-color:#6c6cc0 !important; } html[data-theme="dark"] .ring-purple-200 { --tw-ring-color:#39396e !important; } html[data-theme="dark"] .bg-pink-50 { background-color:#351d2c !important; } html[data-theme="dark"] .bg-pink-100 { background-color:#432436 !important; } html[data-theme="dark"] .text-pink-400, html[data-theme="dark"] .text-pink-500, html[data-theme="dark"] .text-pink-600, html[data-theme="dark"] .text-pink-700, html[data-theme="dark"] .text-pink-800, html[data-theme="dark"] .text-pink-900 { color:#eda0c4 !important; } html[data-theme="dark"] .border-pink-100, html[data-theme="dark"] .border-pink-200, html[data-theme="dark"] .border-pink-300 { border-color:#5a2f45 !important; } html[data-theme="dark"] .border-r-pink-400, html[data-theme="dark"] .border-r-pink-500, html[data-theme="dark"] .border-r-pink-600, html[data-theme="dark"] .border-l-pink-400, html[data-theme="dark"] .border-l-pink-500 { border-color:#c06090 !important; } html[data-theme="dark"] .bg-pink-500, html[data-theme="dark"] .bg-pink-600, html[data-theme="dark"] .bg-pink-700 { background-color:#c06090 !important; } html[data-theme="dark"] .ring-pink-200 { --tw-ring-color:#5a2f45 !important; } html[data-theme="dark"] .bg-fuchsia-50 { background-color:#351d2c !important; } html[data-theme="dark"] .bg-fuchsia-100 { background-color:#432436 !important; } html[data-theme="dark"] .text-fuchsia-400, html[data-theme="dark"] .text-fuchsia-500, html[data-theme="dark"] .text-fuchsia-600, html[data-theme="dark"] .text-fuchsia-700, html[data-theme="dark"] .text-fuchsia-800, html[data-theme="dark"] .text-fuchsia-900 { color:#eda0c4 !important; } html[data-theme="dark"] .border-fuchsia-100, html[data-theme="dark"] .border-fuchsia-200, html[data-theme="dark"] .border-fuchsia-300 { border-color:#5a2f45 !important; } html[data-theme="dark"] .border-r-fuchsia-400, html[data-theme="dark"] .border-r-fuchsia-500, html[data-theme="dark"] .border-r-fuchsia-600, html[data-theme="dark"] .border-l-fuchsia-400, html[data-theme="dark"] .border-l-fuchsia-500 { border-color:#c06090 !important; } html[data-theme="dark"] .bg-fuchsia-500, html[data-theme="dark"] .bg-fuchsia-600, html[data-theme="dark"] .bg-fuchsia-700 { background-color:#c06090 !important; } html[data-theme="dark"] .ring-fuchsia-200 { --tw-ring-color:#5a2f45 !important; } html[data-theme="dark"] .text-\[\#0b626a\] { color:#63c8cf !important; } html[data-theme="dark"] .bg-\[\#0b626a\] { background-color:#63c8cf !important; } html[data-theme="dark"] .border-\[\#0b626a\] { border-color:#63c8cf !important; } html[data-theme="dark"] .text-\[\#0f7c86\] { color:#63c8cf !important; } html[data-theme="dark"] .bg-\[\#0f7c86\] { background-color:#63c8cf !important; } html[data-theme="dark"] .border-\[\#0f7c86\] { border-color:#63c8cf !important; } html[data-theme="dark"] .text-\[\#e6f4f5\] { color:#12312f !important; } html[data-theme="dark"] .bg-\[\#e6f4f5\] { background-color:#12312f !important; } html[data-theme="dark"] .border-\[\#e6f4f5\] { border-color:#12312f !important; } html[data-theme="dark"] .text-\[\#451A03\] { color:#e8c67a !important; } html[data-theme="dark"] .bg-\[\#451A03\] { background-color:#e8c67a !important; } html[data-theme="dark"] .border-\[\#451A03\] { border-color:#e8c67a !important; } html[data-theme="dark"] .text-\[\#2D3748\] { color:#c4cfd6 !important; } html[data-theme="dark"] .bg-\[\#2D3748\] { background-color:#c4cfd6 !important; } html[data-theme="dark"] .border-\[\#2D3748\] { border-color:#c4cfd6 !important; } html[data-theme="dark"] .text-\[\#1A3644\] { color:#cfe3e8 !important; } html[data-theme="dark"] .bg-\[\#1A3644\] { background-color:#cfe3e8 !important; } html[data-theme="dark"] .border-\[\#1A3644\] { border-color:#cfe3e8 !important; } html[data-theme="dark"] .text-\[\#334155\] { color:#c3ced2 !important; } html[data-theme="dark"] .bg-\[\#334155\] { background-color:#c3ced2 !important; } html[data-theme="dark"] .border-\[\#334155\] { border-color:#c3ced2 !important; } html[data-theme="dark"] .text-\[\#92400E\] { color:#e8c67a !important; } html[data-theme="dark"] .bg-\[\#92400E\] { background-color:#e8c67a !important; } html[data-theme="dark"] .border-\[\#92400E\] { border-color:#e8c67a !important; } html[data-theme="dark"] .text-\[\#8a1f3d\] { color:#d5869a !important; } html[data-theme="dark"] .bg-\[\#8a1f3d\] { background-color:#d5869a !important; } html[data-theme="dark"] .border-\[\#8a1f3d\] { border-color:#d5869a !important; } html[data-theme="dark"] .text-\[\#eaecf0\] { color:#3a4653 !important; } html[data-theme="dark"] .bg-\[\#eaecf0\] { background-color:#3a4653 !important; } html[data-theme="dark"] .border-\[\#eaecf0\] { border-color:#3a4653 !important; } html[data-theme="dark"] .text-\[\#bfe3e6\] { color:#2c4a4d !important; } html[data-theme="dark"] .bg-\[\#bfe3e6\] { background-color:#2c4a4d !important; } html[data-theme="dark"] .border-\[\#bfe3e6\] { border-color:#2c4a4d !important; } html[data-theme="dark"] .text-\[\#FFF9E6\] { color:#2c2712 !important; } html[data-theme="dark"] .bg-\[\#FFF9E6\] { background-color:#2c2712 !important; } html[data-theme="dark"] .border-\[\#FFF9E6\] { border-color:#2c2712 !important; } html[data-theme="dark"] .text-\[\#FDE68A\] { color:#5c4c1f !important; } html[data-theme="dark"] .bg-\[\#FDE68A\] { background-color:#5c4c1f !important; } html[data-theme="dark"] .border-\[\#FDE68A\] { border-color:#5c4c1f !important; } html[data-theme="dark"] .text-\[\#FEF3C7\] { color:#382c12 !important; } html[data-theme="dark"] .bg-\[\#FEF3C7\] { background-color:#382c12 !important; } html[data-theme="dark"] .border-\[\#FEF3C7\] { border-color:#382c12 !important; } html[data-theme="dark"] .text-\[\#fbe9ef\] { color:#3a1e2a !important; } html[data-theme="dark"] .bg-\[\#fbe9ef\] { background-color:#3a1e2a !important; } html[data-theme="dark"] .border-\[\#fbe9ef\] { border-color:#3a1e2a !important; } html[data-theme="dark"] .text-\[\#f5f7f8\] { color:#191f26 !important; } html[data-theme="dark"] .bg-\[\#f5f7f8\] { background-color:#191f26 !important; } html[data-theme="dark"] .border-\[\#f5f7f8\] { border-color:#191f26 !important; } html[data-theme="dark"] .text-\[\#F4F5F7\] { color:#262e37 !important; } html[data-theme="dark"] .bg-\[\#F4F5F7\] { background-color:#262e37 !important; } html[data-theme="dark"] .border-\[\#F4F5F7\] { border-color:#262e37 !important; } html[data-theme="dark"] .text-\[\#EBF3F6\] { color:#152a2e !important; } html[data-theme="dark"] .bg-\[\#EBF3F6\] { background-color:#152a2e !important; } html[data-theme="dark"] .border-\[\#EBF3F6\] { border-color:#152a2e !important; } html[data-theme="dark"] .text-\[\#E2E8F0\] { color:#2c343d !important; } html[data-theme="dark"] .bg-\[\#E2E8F0\] { background-color:#2c343d !important; } html[data-theme="dark"] .border-\[\#E2E8F0\] { border-color:#2c343d !important; } html[data-theme="dark"] .text-\[\#CBD5E1\] { color:#3a4653 !important; } html[data-theme="dark"] .bg-\[\#CBD5E1\] { background-color:#3a4653 !important; } html[data-theme="dark"] .border-\[\#CBD5E1\] { border-color:#3a4653 !important; } html[data-theme="dark"] .text-\[\#eef2f2\] { color:#191f26 !important; } html[data-theme="dark"] .bg-\[\#eef2f2\] { background-color:#191f26 !important; } html[data-theme="dark"] .border-\[\#eef2f2\] { border-color:#191f26 !important; } html[data-theme="dark"] .bg-\[\#6B1226\] { background-color:#7a2036 !important; } html[data-theme="dark"] .bg-\[\#57101d\], html[data-theme="dark"] .hover\:bg-\[\#57101d\]:hover { background-color:#661a2c !important; }