body.fi-panel-support,
body.fi-panel-support .fi-layout,
body.fi-panel-support .fi-main,
body.fi-panel-support .fi-content {
background-color: transparent !important;
}
.fi-panel-support .fi-icon,
.fi-panel-support .fi-btn .fi-icon,
.fi-panel-support .fi-btn > svg,
.fi-panel-support .fi-icon-btn .fi-icon,
.fi-panel-support .fi-icon-btn > svg,
.fi-panel-support .fi-ac-btn-icon,
.fi-panel-support .fi-ac-icon-btn-icon,
.fi-panel-support .fi-header-actions .fi-icon,
.fi-panel-support .fi-header-actions svg,
.fi-panel-support .fi-global-search .fi-icon,
.fi-panel-support .fi-global-search svg,
.fi-panel-support .fi-global-search-field .fi-icon,
.fi-panel-support .fi-global-search-field svg,
.fi-panel-support .fi-topbar .fi-icon,
.fi-panel-support .fi-topbar svg.fi-icon,
.fi-panel-support .fi-navigation-favorite-btn .fi-icon,
.fi-panel-support .fi-navigation-favorite-btn svg {
width: 1.25rem !important;
height: 1.25rem !important;
max-width: 1.25rem !important;
max-height: 1.25rem !important;
flex-shrink: 0 !important;
}
.fi-panel-support .fi-btn {
max-height: none;
min-height: 2.25rem;
overflow: hidden;
}
.fi-panel-support .fi-header-actions .fi-btn {
overflow: visible;
}
.fi-panel-support .rmm-hub-overview-grid,
.fi-panel-support .org-hub-grid {
display: grid;
gap: 1.25rem;
grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
max-width: 72rem;
}
.fi-panel-support .rmm-hub-overview-card,
.fi-panel-support .org-hub-card {
overflow: hidden;
max-width: 100%;
}
.fi-panel-support .rmm-hub-overview-card__hero,
.fi-panel-support .org-hub-card__hero {
display: flex;
align-items: center;
justify-content: center;
max-height: 8rem;
overflow: hidden;
}
.fi-panel-support .rmm-hub-overview-card__image,
.fi-panel-support .rmm-hub-overview-card__hero img,
.fi-panel-support .rmm-hub-overview-card__hero svg,
.fi-panel-support .rmm-hub-overview-card__hero-icon,
.fi-panel-support .org-hub-card__image,
.fi-panel-support .fi-empty-state img,
.fi-panel-support .fi-empty-state svg:not(.fi-icon) {
width: auto !important;
max-width: 9rem !important;
max-height: 6.5rem !important;
height: auto !important;
object-fit: contain;
}
.fi-panel-support .fi-wi-stats-overview-stats-ctn,
.fi-panel-support .fi-wi-stats-overview {
max-width: 72rem;
}
.fi-panel-support .fi-header-actions {
align-items: center;
flex-wrap: wrap;
gap: 0.5rem;
}
.fi-panel-support .fi-btn {
border-radius: 9999px !important;
transition: all 0.2s cubic-bezier(0.2, 0.9, 0.4, 1.1) !important;
}
.fi-panel-support .fi-breadcrumbs-item-label {
font-weight: 500;
color: #4f46e5 !important;
transition: color 0.2s;
}
.dark .fi-panel-support .fi-breadcrumbs-item-label {
color: #c4b5fd !important;
}
.fi-panel-support .fi-main {
padding: 1.25rem 1.5rem;
}
.fi-panel-support .mail-inbox-unread-dot {
display: inline-block;
width: 0.45rem;
height: 0.45rem;
border-radius: 9999px;
background: #5b21b6 !important;
box-shadow: 0 0 0 3px rgba(91, 33, 182, 0.14);
vertical-align: middle;
flex-shrink: 0;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-header-heading {
font-size: 1.85rem !important;
font-weight: 800 !important;
letter-spacing: -0.02em;
color: #111827 !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-header-subheading {
margin-top: 0.2rem !important;
font-size: 0.9rem !important;
color: #6b7280 !important;
}
.fi-panel-support .mail-inbox-chrome {
display: flex;
flex-direction: column;
gap: 1.15rem;
margin-bottom: 1.15rem;
}
.fi-panel-support .mail-inbox-tabs {
display: flex;
flex-wrap: wrap;
gap: 0.1rem;
border-bottom: 1px solid #e5e7eb;
}
.fi-panel-support .mail-inbox-tab {
display: inline-flex;
align-items: center;
gap: 0.45rem;
padding: 0.7rem 0.85rem 0.75rem;
color: #6b7280 !important;
font-size: 0.875rem;
font-weight: 600;
text-decoration: none !important;
border-bottom: 2px solid transparent;
margin-bottom: -1px;
background: transparent !important;
box-shadow: none !important;
}
.fi-panel-support .mail-inbox-tab:hover {
color: #4c1d95 !important;
}
.fi-panel-support .mail-inbox-tab--active {
color: #5b21b6 !important;
border-bottom-color: #5b21b6;
}
.fi-panel-support .mail-inbox-tab__icon,
.fi-panel-support .mail-inbox-tab .fi-icon,
.fi-panel-support .mail-inbox-tab svg {
width: 1.05rem !important;
height: 1.05rem !important;
max-width: 1.05rem !important;
max-height: 1.05rem !important;
}
.fi-panel-support .mail-inbox-kpis {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.85rem;
}
.fi-panel-support .mail-inbox-kpi {
display: flex !important;
flex-direction: column;
justify-content: space-between;
gap: 1.35rem;
min-height: 7.6rem;
padding: 1rem 1.05rem 0.85rem !important;
border-radius: 0.65rem !important;
border: 1px solid #e5e7eb !important;
background: #fff !important;
text-decoration: none !important;
color: inherit !important;
box-shadow: none !important;
backdrop-filter: none !important;
}
.fi-panel-support .mail-inbox-kpi:hover {
border-color: #c4b5fd !important;
}
.fi-panel-support .mail-inbox-kpi__top {
display: flex;
align-items: flex-start;
gap: 0.75rem;
}
.fi-panel-support .mail-inbox-kpi__icon {
display: inline-flex !important;
align-items: center;
justify-content: center;
width: 2rem !important;
height: 2rem !important;
border-radius: 0.5rem !important;
flex-shrink: 0;
}
.fi-panel-support .mail-inbox-kpi__icon .fi-icon,
.fi-panel-support .mail-inbox-kpi__icon svg {
width: 1.05rem !important;
height: 1.05rem !important;
max-width: 1.05rem !important;
max-height: 1.05rem !important;
}
.fi-panel-support .mail-inbox-kpi--purple .mail-inbox-kpi__icon { background: #ede9fe !important; color: #6d28d9 !important; }
.fi-panel-support .mail-inbox-kpi--orange .mail-inbox-kpi__icon { background: #ffedd5 !important; color: #ea580c !important; }
.fi-panel-support .mail-inbox-kpi--blue .mail-inbox-kpi__icon { background: #dbeafe !important; color: #2563eb !important; }
.fi-panel-support .mail-inbox-kpi--green .mail-inbox-kpi__icon { background: #dcfce7 !important; color: #16a34a !important; }
.fi-panel-support .mail-inbox-kpi__copy {
display: flex;
flex-direction: column;
gap: 0.15rem;
min-width: 0;
}
.fi-panel-support .mail-inbox-kpi__label {
margin: 0 !important;
font-size: 0.8rem !important;
color: #6b7280 !important;
font-weight: 600 !important;
line-height: 1.2;
}
.fi-panel-support .mail-inbox-kpi__value {
margin: 0 !important;
font-size: 1.7rem !important;
line-height: 1.1 !important;
font-weight: 750 !important;
color: #111827 !important;
-webkit-text-fill-color: #111827 !important;
background: none !important;
}
.fi-panel-support .mail-inbox-kpi__more {
display: flex !important;
align-items: center;
justify-content: space-between;
width: 100%;
font-size: 0.75rem !important;
font-weight: 700 !important;
color: #5b21b6 !important;
}
.fi-panel-support .mail-inbox-kpi__more .fi-icon,
.fi-panel-support .mail-inbox-kpi__more svg {
width: 0.85rem !important;
height: 0.85rem !important;
max-width: 0.85rem !important;
max-height: 0.85rem !important;
color: #5b21b6 !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-ctn,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-content,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-container {
background: #fff !important;
border: 1px solid #e5e7eb !important;
border-radius: 0.65rem !important;
box-shadow: none !important;
backdrop-filter: none !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-heading {
font-size: 0.95rem !important;
font-weight: 650 !important;
color: #111827 !important;
-webkit-text-fill-color: #111827 !important;
background: none !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell {
background: #f8fafc !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell-label {
font-size: 0.68rem !important;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #9ca3af !important;
font-weight: 700 !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-row {
background: #fff !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell {
padding-top: 0.85rem !important;
padding-bottom: 0.85rem !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-content,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-content-ctn,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-ctn {
overflow-x: auto !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-table {
min-width: 72rem;
table-layout: auto;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell {
white-space: nowrap;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell:has(.fi-ta-actions),
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell:last-child {
position: sticky;
right: 0;
z-index: 3;
background: #fff;
}
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell:has(.fi-ta-actions),
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell:last-child {
background: rgb(15, 23, 42);
}
.fi-panel-support .mail-inbox-search,
.fi-panel-support .mail-inbox-search input,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-actions,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-actions * {
pointer-events: auto;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell:has(.mail-inbox-subject) {
white-space: normal;
min-width: 16rem;
}
.fi-panel-support .mail-inbox-subject {
display: flex;
align-items: flex-start;
gap: 0.45rem;
max-width: none;
}
.fi-panel-support .mail-inbox-subject__text {
white-space: normal;
line-height: 1.35;
}
.fi-panel-support .mail-reading-pane {
border: 1px solid #e5e7eb;
border-radius: 12px;
background: #fff;
padding: 1rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
max-height: 70vh;
overflow: auto;
}
.fi-panel-support .mail-reading-pane__bar {
display: flex;
justify-content: space-between;
gap: 0.75rem;
align-items: flex-start;
}
.fi-panel-support .mail-reading-pane__title {
font-weight: 700;
color: #111827;
}
.fi-panel-support .mail-reading-pane__close {
background: transparent;
border: 0;
color: #6b7280;
cursor: pointer;
font-size: 0.85rem;
font-weight: 600;
padding: 0;
white-space: nowrap;
}
.fi-panel-support .mail-reading-pane__body {
font-size: 0.92rem;
line-height: 1.45;
color: #374151;
}
.fi-panel-support .mail-reading-pane__reply {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.fi-panel-support .mail-reading-pane__reply input,
.fi-panel-support .mail-reading-pane__reply textarea {
width: 100%;
border: 1px solid #e5e7eb;
border-radius: 8px;
padding: 0.45rem 0.6rem;
}
.fi-panel-support .mail-reading-pane__reply button {
align-self: flex-start;
background: #111827;
color: #fff;
border-radius: 8px;
padding: 0.45rem 0.8rem;
font-weight: 600;
}
.fi-panel-support .mail-inbox-subject--unread .mail-inbox-subject__text {
font-weight: 700;
color: #111827;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-pagination {
border: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
.dark .fi-panel-support .mail-inbox-kpi,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-ctn,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-content,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-row {
background: rgb(15, 23, 42) !important;
border-color: rgba(148, 163, 184, 0.22) !important;
}
.dark .fi-panel-support .mail-inbox-tab { color: #94a3b8 !important; }
.dark .fi-panel-support .mail-inbox-tab--active { color: #ddd6fe !important; border-bottom-color: #a78bfa; }
.dark .fi-panel-support .mail-inbox-kpi__label { color: #94a3b8 !important; }
.dark .fi-panel-support .mail-inbox-kpi__value {
color: #f8fafc !important;
-webkit-text-fill-color: #f8fafc !important;
}
.fi-panel-support .mail-inbox-toolbar {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
flex-wrap: wrap;
}
.fi-panel-support .mail-inbox-toolbar__filters,
.fi-panel-support .mail-inbox-toolbar__tools {
display: flex;
align-items: center;
gap: 0.55rem;
flex-wrap: wrap;
}
.fi-panel-support .mail-inbox-select,
.fi-panel-support .mail-inbox-search {
display: inline-flex;
align-items: center;
gap: 0.45rem;
min-height: 2.35rem;
padding: 0 0.8rem;
border: 1px solid #e5e7eb;
border-radius: 0.65rem;
background: #fff;
color: #374151;
}
.fi-panel-support .mail-inbox-select select,
.fi-panel-support .mail-inbox-search input {
border: 0;
background: transparent;
color: inherit;
font-size: 0.875rem;
font-weight: 600;
outline: none;
min-width: 8.5rem;
}
.fi-panel-support .mail-inbox-search {
min-width: 18rem;
flex: 1 1 16rem;
}
.fi-panel-support .mail-inbox-search input {
width: 100%;
min-width: 0;
font-weight: 500;
}
.fi-panel-support .mail-inbox-select__icon,
.fi-panel-support .mail-inbox-search__icon,
.fi-panel-support .mail-inbox-select svg,
.fi-panel-support .mail-inbox-search svg,
.fi-panel-support .mail-inbox-filters-btn svg,
.fi-panel-support .mail-inbox-refresh svg {
width: 1rem !important;
height: 1rem !important;
max-width: 1rem !important;
max-height: 1rem !important;
color: #6b7280;
}
.fi-panel-support .mail-inbox-filters-btn,
.fi-panel-support .mail-inbox-refresh {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
min-height: 2.35rem;
border: 1px solid #e5e7eb;
background: #fff;
color: #374151;
font-size: 0.875rem;
font-weight: 650;
}
.fi-panel-support .mail-inbox-filters-btn {
border-radius: 0.65rem !important;
padding: 0 0.85rem;
}
.fi-panel-support .mail-inbox-refresh {
width: 2.35rem;
border-radius: 9999px !important;
padding: 0;
}
.fi-panel-support .mail-inbox-extra {
position: relative;
}
.fi-panel-support .mail-inbox-extra__panel {
position: absolute;
right: 0;
top: calc(100% + 0.4rem);
z-index: 20;
min-width: 12rem;
padding: 0.7rem 0.8rem;
border: 1px solid #e5e7eb;
border-radius: 0.65rem;
background: #fff;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}
.fi-panel-support .mail-inbox-extra__item {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.85rem;
font-weight: 600;
color: #374151;
}
.fi-panel-support .fi-page.mail-inbox-page .module-dashboard__actions,
.fi-panel-support .fi-page.mail-inbox-page .rmm-hub-overview-grid,
.fi-panel-support .fi-page.mail-inbox-page .module-dashboard__kpis,
.fi-panel-support .fi-page.mail-inbox-page .fi-tabs,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-search-field,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-filters-trigger-action-ctn,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .module-dashboard__actions,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .rmm-hub-overview-grid,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .module-dashboard__kpis,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .fi-tabs,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .fi-ta-search-field,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .fi-ta-filters-trigger-action-ctn {
display: none !important;
}
.dark .fi-panel-support .mail-inbox-select,
.dark .fi-panel-support .mail-inbox-search,
.dark .fi-panel-support .mail-inbox-filters-btn,
.dark .fi-panel-support .mail-inbox-refresh,
.dark .fi-panel-support .mail-inbox-extra__panel {
background: rgb(15, 23, 42) !important;
border-color: rgba(148, 163, 184, 0.22) !important;
color: #e2e8f0;
}
@media (max-width: 1100px) {
.fi-panel-support .mail-inbox-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
.fi-panel-support .mail-inbox-kpis { grid-template-columns: 1fr; }
.fi-panel-support .mail-inbox-search { min-width: 100%; }
}
html.upango-panel-splash-active,
html.upango-panel-splash-active body {
overflow: hidden !important;
}
html:not(.upango-panel-splash-active) .upango-panel-splash,
html:has(.upango-forbidden) .upango-panel-splash {
display: none !important;
pointer-events: none !important;
}
.upango-panel-splash {
position: fixed;
inset: 0;
z-index: 99999;
display: flex;
align-items: center;
justify-content: center;
animation: upangoSplashIn 0.45s ease-out;
}
.upango-panel-splash--out {
pointer-events: none;
}
.upango-panel-splash--out {
animation: upangoSplashOut 0.65s ease-in forwards;
}
.upango-panel-splash__backdrop {
position: absolute;
inset: 0;
}
.upango-panel-splash__glow {
position: absolute;
width: min(70vw, 28rem);
height: min(70vw, 28rem);
border-radius: 9999px;
animation: upangoSplashPulse 2s ease-in-out infinite;
}
.upango-panel-splash__content {
position: relative;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
z-index: 1;
}
.upango-panel-splash__ring {
position: absolute;
width: 9.5rem;
height: 9.5rem;
border-radius: 9999px;
border: 2px solid transparent;
animation: upangoRingSpin 3s linear infinite;
}
.upango-panel-splash__bird {
width: 7.5rem;
height: 7.5rem;
object-fit: contain;
border-radius: 9999px;
animation: upangoBirdFloat 2.4s ease-in-out infinite;
filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.25));
}
.upango-panel-splash__name {
margin: 1.25rem 0 0.2rem;
font-size: 1.75rem;
font-weight: 800;
letter-spacing: 0.12em;
animation: upangoFadeUp 0.8s ease-out 0.25s both;
}
.upango-panel-splash__tagline {
margin: 0;
font-size: 0.8125rem;
font-weight: 500;
letter-spacing: 0.14em;
text-transform: uppercase;
animation: upangoFadeUp 0.8s ease-out 0.45s both;
}
.fi-panel-admin .upango-panel-splash__backdrop {
background: linear-gradient(155deg, #140f1f 0%, #1a0b2e 50%, #1e1035 100%);
}
.fi-panel-admin .upango-panel-splash__glow {
background: radial-gradient(circle, rgba(168, 50, 168, 0.4) 0%, transparent 68%);
}
.fi-panel-admin .upango-panel-splash__ring {
border-color: rgba(249, 115, 22, 0.3);
}
.fi-panel-admin .upango-panel-splash__bird {
filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.45));
}
.fi-panel-admin .upango-panel-splash__name {
color: #f8fafc;
}
.fi-panel-admin .upango-panel-splash__tagline {
color: rgba(253, 186, 116, 0.9);
}
html:not(.dark) .fi-panel-admin .upango-panel-splash__backdrop {
background: linear-gradient(155deg, #f4f3f6 0%, #faf5ff 45%, #fff7ed 100%);
}
html:not(.dark) .fi-panel-admin .upango-panel-splash__glow {
background: radial-gradient(circle, rgba(168, 50, 168, 0.22) 0%, transparent 68%);
}
html:not(.dark) .fi-panel-admin .upango-panel-splash__ring {
border-color: rgba(168, 50, 168, 0.25);
}
html:not(.dark) .fi-panel-admin .upango-panel-splash__name {
color: #140f1f;
}
html:not(.dark) .fi-panel-admin .upango-panel-splash__tagline {
color: #ea580c;
}
html.dark .fi-panel-support .upango-panel-splash__backdrop {
background: linear-gradient(155deg, #1a1025 0%, #2d1b4e 45%, #1e293b 100%);
}
html.dark .fi-panel-support .upango-panel-splash__glow {
background: radial-gradient(circle, rgba(249, 115, 22, 0.38) 0%, transparent 68%);
}
html.dark .fi-panel-support .upango-panel-splash__ring {
border-color: rgba(249, 115, 22, 0.3);
}
html.dark .fi-panel-support .upango-panel-splash__bird {
filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.45));
}
html.dark .fi-panel-support .upango-panel-splash__name {
color: #f8fafc;
}
html.dark .fi-panel-support .upango-panel-splash__tagline {
color: rgba(251, 146, 60, 0.92);
}
html:not(.dark) .fi-panel-support .upango-panel-splash__backdrop {
background: linear-gradient(155deg, #f8fafc 0%, #fff7ed 45%, #eef2ff 100%);
}
html:not(.dark) .fi-panel-support .upango-panel-splash__glow {
background: radial-gradient(circle, rgba(249, 115, 22, 0.22) 0%, transparent 68%);
}
html:not(.dark) .fi-panel-support .upango-panel-splash__ring {
border-color: rgba(234, 88, 12, 0.28);
}
html:not(.dark) .fi-panel-support .upango-panel-splash__bird {
filter: drop-shadow(0 12px 24px rgba(234, 88, 12, 0.18));
}
html:not(.dark) .fi-panel-support .upango-panel-splash__name {
color: #0f172a;
}
html:not(.dark) .fi-panel-support .upango-panel-splash__tagline {
color: #ea580c;
}
html.dark .fi-panel-workspace .upango-panel-splash__backdrop {
background: linear-gradient(155deg, #1a1025 0%, #2d1b4e 45%, #1e293b 100%);
}
html.dark .fi-panel-workspace .upango-panel-splash__glow {
background: radial-gradient(circle, rgba(249, 115, 22, 0.38) 0%, transparent 68%);
}
html.dark .fi-panel-workspace .upango-panel-splash__name {
color: #f8fafc;
}
html.dark .fi-panel-workspace .upango-panel-splash__tagline {
color: rgba(251, 146, 60, 0.92);
}
html:not(.dark) .fi-panel-workspace .upango-panel-splash__backdrop {
background: linear-gradient(155deg, #f8fafc 0%, #fff7ed 45%, #eef2ff 100%);
}
html:not(.dark) .fi-panel-workspace .upango-panel-splash__glow {
background: radial-gradient(circle, rgba(249, 115, 22, 0.22) 0%, transparent 68%);
}
html:not(.dark) .fi-panel-workspace .upango-panel-splash__name {
color: #0f172a;
}
html:not(.dark) .fi-panel-workspace .upango-panel-splash__tagline {
color: #ea580c;
}
@keyframes upangoSplashIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes upangoSplashOut { to { opacity: 0; transform: scale(1.03); } }
@keyframes upangoSplashPulse { 0%, 100% { transform: scale(1); opacity: 0.7; } 50% { transform: scale(1.08); opacity: 1; } }
@keyframes upangoBirdFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes upangoRingSpin { to { transform: rotate(360deg); } }
@keyframes upangoFadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) {
.upango-panel-splash,
.upango-panel-splash__bird,
.upango-panel-splash__ring,
.upango-panel-splash__glow {
animation: none !important;
}
.upango-panel-splash {
display: none !important;
}
}
.fi-panel-portal,
.fi-panel-support,
.fi-panel-bevolking,
.fi-panel-admin,
.fi-panel-admin-domain {
--sidebar-width: 6.75rem;
--collapsed-sidebar-width: 6.75rem;
}
.fi-panel-portal .fi-sidebar.fi-main-sidebar,
.fi-panel-support .fi-sidebar.fi-main-sidebar,
.fi-panel-bevolking .fi-sidebar.fi-main-sidebar,
.fi-panel-admin .fi-sidebar.fi-main-sidebar,
.fi-panel-admin-domain .fi-sidebar.fi-main-sidebar {
background: #243447 !important;
border-right: 1px solid rgba(0, 0, 0, 0.25) !important;
backdrop-filter: none !important;
box-shadow: none !important;
}
.fi-panel-portal .fi-sidebar-header,
.fi-panel-support .fi-sidebar-header,
.fi-panel-bevolking .fi-sidebar-header,
.fi-panel-admin .fi-sidebar-header,
.fi-panel-admin-domain .fi-sidebar-header {
display: none !important;
min-height: 0 !important;
height: 0 !important;
padding: 0 !important;
margin: 0 !important;
border: none !important;
overflow: hidden !important;
background: transparent !important;
}
.fi-panel-portal .fi-sidebar-header-ctn,
.fi-panel-support .fi-sidebar-header-ctn,
.fi-panel-bevolking .fi-sidebar-header-ctn,
.fi-panel-admin .fi-sidebar-header-ctn,
.fi-panel-admin-domain .fi-sidebar-header-ctn {
display: none !important;
min-height: 0 !important;
height: 0 !important;
padding: 0 !important;
margin: 0 !important;
}
.fi-panel-portal .fi-topbar-start > a,
.fi-panel-support .fi-topbar-start > a,
.fi-panel-bevolking .fi-topbar-start > a,
.fi-panel-admin .fi-topbar-start > a,
.fi-panel-admin-domain .fi-topbar-start > a,
.fi-panel-portal .fi-topbar-start > div:has(.fi-logo),
.fi-panel-support .fi-topbar-start > div:has(.fi-logo),
.fi-panel-bevolking .fi-topbar-start > div:has(.fi-logo),
.fi-panel-admin .fi-topbar-start > div:has(.fi-logo),
.fi-panel-admin-domain .fi-topbar-start > div:has(.fi-logo),
.fi-panel-portal .fi-topbar-start .fi-logo,
.fi-panel-support .fi-topbar-start .fi-logo,
.fi-panel-bevolking .fi-topbar-start .fi-logo,
.fi-panel-admin .fi-topbar-start .fi-logo,
.fi-panel-admin-domain .fi-topbar-start .fi-logo {
display: none !important;
}
.fi-panel-portal .fi-main-sidebar,
.fi-panel-support .fi-main-sidebar,
.fi-panel-bevolking .fi-main-sidebar,
.fi-panel-admin .fi-main-sidebar,
.fi-panel-admin-domain .fi-main-sidebar {
display: flex !important;
flex-direction: column !important;
overflow: hidden !important;
}
.fi-panel-portal .fi-sidebar-nav,
.fi-panel-support .fi-sidebar-nav,
.fi-panel-bevolking .fi-sidebar-nav,
.fi-panel-admin .fi-sidebar-nav,
.fi-panel-admin-domain .fi-sidebar-nav {
flex: 1 1 auto !important;
min-height: 0 !important;
overflow-x: hidden !important;
overflow-y: auto !important;
}
.fi-panel-portal .fi-compact-sidebar-brand,
.fi-panel-support .fi-compact-sidebar-brand-footer,
.fi-panel-bevolking .fi-compact-sidebar-brand-footer,
.fi-panel-admin .fi-compact-sidebar-brand-footer,
.fi-panel-admin-domain .fi-compact-sidebar-brand-footer {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 0.5rem;
width: 100%;
padding: 0.65rem 0.35rem 0.85rem;
border-top: 1px solid rgba(255, 255, 255, 0.08);
flex: 0 0 auto;
flex-shrink: 0;
position: relative;
z-index: 10;
background: #243447;
}
.fi-panel-support .fi-compact-sidebar-brand-header,
.fi-panel-bevolking .fi-compact-sidebar-brand-header,
.fi-panel-admin .fi-compact-sidebar-brand-header,
.fi-panel-admin-domain .fi-compact-sidebar-brand-header {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: 100%;
padding: 0.65rem 0.5rem 0.55rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
background: #243447;
}
.fi-panel-support .fi-sidebar-nav,
.fi-panel-bevolking .fi-sidebar-nav,
.fi-panel-admin .fi-sidebar-nav,
.fi-panel-admin-domain .fi-sidebar-nav {
padding-bottom: 0.25rem !important;
}
.fi-panel-portal .fi-sidebar-nav {
padding-bottom: 0.25rem !important;
}
.fi-compact-sidebar-brand-link {
display: flex;
justify-content: center;
align-items: center;
border-radius: 9999px;
transition: opacity 0.15s ease;
}
.fi-compact-sidebar-brand-link:hover {
opacity: 0.92;
}
.fi-compact-sidebar-brand-logo {
width: 5.5rem;
height: 5.5rem;
border-radius: 9999px;
object-fit: contain;
background: rgba(255, 255, 255, 0.04);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
flex-shrink: 0;
}
.fi-panel-support .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo,
.fi-panel-bevolking .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo,
.fi-panel-admin .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo,
.fi-panel-admin-domain .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo {
width: 3.25rem;
height: 3.25rem;
padding: 0.2rem;
}
@media (max-width: 1023px) {
.fi-panel-support .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo,
.fi-panel-bevolking .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo,
.fi-panel-admin .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo,
.fi-panel-admin-domain .fi-compact-sidebar-brand-header .fi-compact-sidebar-brand-logo {
width: 3.75rem;
height: 3.75rem;
}
}
.fi-compact-sidebar-contact {
display: flex;
flex-direction: column;
align-items: center;
gap: 0.2rem;
width: 100%;
padding-inline: 0.15rem;
text-align: center;
}
.fi-compact-sidebar-contact-name {
margin: 0;
font-size: 0.5625rem;
line-height: 1.2;
font-weight: 600;
color: rgba(255, 255, 255, 0.92);
word-break: break-word;
}
.fi-compact-sidebar-contact-line,
.fi-compact-sidebar-contact-address {
margin: 0;
font-size: 0.5rem;
line-height: 1.25;
color: rgba(255, 255, 255, 0.62);
word-break: break-word;
overflow-wrap: anywhere;
}
.fi-compact-sidebar-contact-line {
text-decoration: none;
transition: color 0.15s ease;
}
.fi-compact-sidebar-contact-line:hover {
color: #5eead4;
text-decoration: underline;
}
.fi-panel-portal .fi-sidebar-header-logo-ctn,
.fi-panel-support .fi-sidebar-header-logo-ctn,
.fi-panel-bevolking .fi-sidebar-header-logo-ctn,
.fi-panel-admin .fi-sidebar-header-logo-ctn,
.fi-panel-admin-domain .fi-sidebar-header-logo-ctn {
margin-inline: auto !important;
}
.fi-panel-portal .fi-sidebar-header-logo-ctn img,
.fi-panel-portal .fi-sidebar-header-logo-ctn .fi-logo,
.fi-panel-support .fi-sidebar-header-logo-ctn img,
.fi-panel-support .fi-sidebar-header-logo-ctn .fi-logo,
.fi-panel-bevolking .fi-sidebar-header-logo-ctn img,
.fi-panel-bevolking .fi-sidebar-header-logo-ctn .fi-logo,
.fi-panel-admin .fi-sidebar-header-logo-ctn img,
.fi-panel-admin .fi-sidebar-header-logo-ctn .fi-logo,
.fi-panel-admin-domain .fi-sidebar-header-logo-ctn img,
.fi-panel-admin-domain .fi-sidebar-header-logo-ctn .fi-logo {
max-height: 1.75rem !important;
width: auto !important;
}
.fi-panel-portal .fi-sidebar-nav,
.fi-panel-support .fi-sidebar-nav,
.fi-panel-bevolking .fi-sidebar-nav,
.fi-panel-admin .fi-sidebar-nav,
.fi-panel-admin-domain .fi-sidebar-nav {
padding-inline: 0.35rem !important;
padding-top: 0.25rem !important;
}
.fi-panel-portal .fi-sidebar-group-btn,
.fi-panel-portal .fi-sidebar-group-dropdown-trigger-btn {
display: none !important;
}
.fi-panel-portal .fi-sidebar-group {
margin-top: 0 !important;
padding-top: 0 !important;
}
.fi-panel-portal .fi-sidebar-group-items {
gap: 0.15rem !important;
}
.fi-panel-portal .fi-sidebar-item-btn {
flex-direction: column !important;
align-items: center !important;
justify-content: center !important;
gap: 0.35rem !important;
padding: 0.55rem 0.25rem !important;
min-height: 4.75rem !important;
border-radius: 0.5rem !important;
text-align: center !important;
}
.fi-panel-portal .fi-sidebar-item-btn > .fi-icon,
.fi-panel-portal .fi-sidebar-item-btn .fi-icon {
color: rgba(255, 255, 255, 0.82) !important;
width: 1.35rem !important;
height: 1.35rem !important;
margin: 0 !important;
}
.fi-panel-portal .fi-sidebar-item-label {
flex: none !important;
width: 100% !important;
max-width: 100% !important;
overflow: visible !important;
text-overflow: unset !important;
white-space: normal !important;
text-align: center !important;
font-size: 0.625rem !important;
line-height: 1.15 !important;
font-weight: 500 !important;
color: rgba(255, 255, 255, 0.88) !important;
letter-spacing: 0.01em !important;
padding-inline: 0.15rem !important;
}
.fi-panel-portal .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
background: rgba(255, 255, 255, 0.12) !important;
}
.fi-panel-portal .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon,
.fi-panel-portal .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-icon,
.fi-panel-portal .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-label {
color: #5eead4 !important;
}
.fi-panel-portal .fi-sidebar-item.fi-sidebar-item-has-url > .fi-sidebar-item-btn:hover {
background: rgba(255, 255, 255, 0.08) !important;
}
.fi-panel-portal .fi-sidebar-item-badge-ctn {
position: absolute !important;
top: 0.2rem !important;
right: 0.15rem !important;
margin: 0 !important;
}
.fi-panel-portal .fi-sidebar-item-badge-ctn .fi-badge {
font-size: 0.55rem !important;
padding: 0.1rem 0.25rem !important;
min-width: 1rem !important;
}
.fi-panel-portal .fi-sidebar-footer,
.fi-panel-support .fi-sidebar-footer,
.fi-panel-bevolking .fi-sidebar-footer,
.fi-panel-admin .fi-sidebar-footer,
.fi-panel-admin-domain .fi-sidebar-footer {
display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
align-items: flex-end !important;
justify-content: center !important;
gap: 0.25rem !important;
border-top: none !important;
padding: 0.5rem 0.25rem 0 !important;
margin-top: 0 !important;
flex: 0 0 auto;
flex-shrink: 0;
background: #243447;
}
.fi-panel-portal .fi-sidebar-footer .fi-user-menu-trigger,
.fi-panel-support .fi-sidebar-footer .fi-user-menu-trigger,
.fi-panel-bevolking .fi-sidebar-footer .fi-user-menu-trigger,
.fi-panel-admin .fi-sidebar-footer .fi-user-menu-trigger,
.fi-panel-admin-domain .fi-sidebar-footer .fi-user-menu-trigger {
flex-direction: column !important;
align-items: center !important;
gap: 0.25rem !important;
color: rgba(255, 255, 255, 0.85) !important;
font-size: 0.625rem !important;
}
.fi-panel-portal .fi-compact-sidebar-settings {
order: -1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.25rem;
min-width: 2.75rem;
padding: 0.35rem 0.2rem;
border-radius: 0.5rem;
text-decoration: none;
color: rgba(255, 255, 255, 0.85);
transition: background-color 0.15s ease;
}
.fi-panel-portal .fi-compact-sidebar-settings:hover {
background: rgba(255, 255, 255, 0.08);
color: #5eead4;
}
.fi-panel-portal .fi-compact-sidebar-settings.fi-active {
background: rgba(255, 255, 255, 0.12);
color: #5eead4;
}
.fi-panel-portal .fi-compact-sidebar-settings .fi-compact-sidebar-settings-icon {
width: 1.35rem;
height: 1.35rem;
}
.fi-panel-portal .fi-compact-sidebar-settings .fi-compact-sidebar-settings-label {
font-size: 0.625rem;
line-height: 1.1;
font-weight: 500;
text-align: center;
max-width: 3.5rem;
}
.fi-panel-portal .fi-topbar {
background: rgba(255, 255, 255, 0.85) !important;
backdrop-filter: blur(8px) !important;
min-height: 3rem !important;
border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}
.fi-panel-support .fi-topbar,
.fi-panel-bevolking .fi-topbar,
.fi-panel-admin .fi-topbar,
.fi-panel-admin-domain .fi-topbar {
min-height: 3rem !important;
}
.fi-panel-portal .fi-main-ctn,
.fi-panel-support .fi-main-ctn,
.fi-panel-bevolking .fi-main-ctn,
.fi-panel-admin .fi-main-ctn,
.fi-panel-admin-domain .fi-main-ctn {
padding-top: 0 !important;
}
.fi-panel-portal .fi-main,
.fi-panel-support .fi-main,
.fi-panel-bevolking .fi-main,
.fi-panel-admin .fi-main,
.fi-panel-admin-domain .fi-main {
padding-top: 0.5rem !important;
}
@media (max-width: 1023px) {
.fi-panel-portal,
.fi-panel-support,
.fi-panel-bevolking,
.fi-panel-admin,
.fi-panel-admin-domain {
--sidebar-width: min(88vw, 16rem);
}
.fi-panel-portal .fi-sidebar-item-btn {
flex-direction: row !important;
min-height: auto !important;
justify-content: flex-start !important;
padding: 0.65rem 0.75rem !important;
gap: 0.75rem !important;
}
.fi-panel-portal .fi-sidebar-item-label {
text-align: left !important;
font-size: 0.875rem !important;
}
.fi-panel-portal .fi-sidebar-group-btn {
display: flex !important;
color: rgba(255, 255, 255, 0.6) !important;
}
.fi-panel-portal .fi-compact-sidebar-settings {
flex-direction: row;
order: 0;
width: 100%;
justify-content: flex-start;
padding: 0.65rem 0.75rem;
}
.fi-compact-sidebar-settings .fi-compact-sidebar-settings-label {
font-size: 0.875rem;
max-width: none;
}
}
.fi-panel-support {
--support-rail-width: 6.75rem;
--support-flyout-width: 11rem;
--support-topbar-height: 4rem;
}
.fi-panel-support .fi-sidebar-nav-groups {
display: none !important;
}
.fi-panel-support .fi-sidebar > .fi-tenant-menu,
.fi-panel-support .fi-main-sidebar > .fi-tenant-menu {
display: none !important;
}
.fi-panel-support .fi-sidebar-group,
.fi-panel-support .fi-sidebar-group-btn,
.fi-panel-support .fi-sidebar-group-items,
.fi-panel-support .fi-sidebar-item {
display: none !important;
}
.fi-support-desktop-nav {
display: none;
}
.fi-support-mobile-nav {
display: flex;
flex-direction: column;
}
@media (min-width: 1024px) {
.fi-support-desktop-nav {
display: block;
}
.fi-support-mobile-nav {
display: none !important;
}
}
.fi-panel-support.fi-body-has-topbar .fi-sidebar.fi-main-sidebar {
top: 0 !important;
height: 100dvh !important;
}
@media (min-width: 1024px) {
.fi-panel-support .fi-sidebar.fi-main-sidebar {
position: fixed !important;
inset-inline-start: 0 !important;
z-index: 40 !important;
translate: 0 !important;
transform: none !important;
width: var(--support-rail-width) !important;
}
.fi-panel-support .fi-topbar-open-sidebar-btn,
.fi-panel-support .fi-topbar-close-sidebar-btn,
.fi-panel-support .fi-topbar-collapse-sidebar-btn-ctn {
display: none !important;
}
.fi-panel-support .fi-topbar-ctn {
margin-inline-start: var(--support-rail-width);
width: calc(100% - var(--support-rail-width));
}
.fi-panel-support .fi-main-ctn {
margin-inline-start: var(--support-rail-width);
width: calc(100% - var(--support-rail-width));
min-height: 100dvh;
position: relative;
z-index: 1;
}
.fi-panel-support .fi-layout {
display: block;
}
}
.fi-support-compact-nav {
display: flex;
flex-direction: column;
gap: 0.15rem;
width: 100%;
}
.fi-support-nav-section {
margin: 0.55rem 0.35rem 0.15rem;
padding: 0 0.15rem;
font-size: 0.55rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.72);
line-height: 1.2;
text-align: center;
}
.fi-panel-support .fi-support-nav-section-row {
display: flex;
align-items: center;
justify-content: center;
gap: 0.1rem;
width: 100%;
margin: 0.45rem 0 0.05rem;
}
.fi-panel-support .fi-support-nav-section-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 0.1rem;
width: 100%;
margin: 0.45rem 0 0.05rem;
padding: 0.1rem 0.15rem;
border: 0;
border-radius: 0.35rem;
background: transparent;
color: inherit;
cursor: pointer;
}
.fi-panel-support .fi-support-nav-section-row .fi-support-nav-section-btn {
flex: 1 1 auto;
width: auto;
min-width: 0;
margin: 0;
}
.fi-panel-support .fi-support-nav-section-btn:hover,
.fi-panel-support .fi-support-nav-section-btn.fi-active {
background: rgba(255, 255, 255, 0.06);
}
.fi-panel-support .fi-support-nav-section-btn .fi-support-nav-section {
margin: 0;
padding: 0;
}
.fi-panel-support .fi-support-nav-section-chevron {
display: inline-flex;
flex: 0 0 auto;
margin: 0;
padding: 0.1rem;
border: 0;
border-radius: 0.35rem;
background: transparent;
color: inherit;
cursor: pointer;
transition: transform 0.15s ease;
}
.fi-panel-support .fi-support-nav-section-chevron .fi-icon {
width: 0.7rem;
height: 0.7rem;
}
.fi-panel-support .fi-support-nav-section-btn.is-collapsed .fi-support-nav-section-chevron,
.fi-panel-support .fi-support-nav-section-chevron.is-collapsed {
transform: rotate(-90deg);
}
.fi-panel-support .fi-support-nav-section-items {
display: flex;
flex-direction: column;
gap: 0.15rem;
width: 100%;
}
html:not(.dark) .fi-panel-support .fi-support-nav-section,
html:not(.dark) .fi-panel-admin .fi-support-nav-section,
html:not(.dark) .fi-panel-admin-domain .fi-support-nav-section {
color: rgba(71, 85, 105, 0.78);
}
html:not(.dark) .fi-panel-support .fi-support-nav-section-btn:hover,
html:not(.dark) .fi-panel-support .fi-support-nav-section-btn.fi-active {
background: rgba(15, 23, 42, 0.04);
}
.fi-support-nav-group-btn {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 0.35rem;
width: 100%;
min-height: 4.25rem;
padding: 0.5rem 0.25rem;
border: none;
border-radius: 0.5rem;
background: transparent;
color: rgba(255, 255, 255, 0.96);
cursor: pointer;
transition: background-color 0.15s ease, color 0.15s ease;
}
.fi-support-nav-group-btn:hover {
background: rgba(255, 255, 255, 0.08);
}
.fi-support-nav-group-btn.fi-active {
background: rgba(249, 115, 22, 0.12);
color: #fdba74;
}
.fi-support-nav-group-btn.fi-current {
box-shadow: inset 3px 0 0 #f97316;
background: rgba(249, 115, 22, 0.08);
}
html:not(.dark) .fi-panel-support .fi-support-nav-group-btn {
color: #334155;
}
html:not(.dark) .fi-panel-support .fi-support-nav-group-btn:hover {
background: rgba(15, 23, 42, 0.04);
color: #0f172a;
}
html:not(.dark) .fi-panel-support .fi-support-nav-group-btn.fi-active,
html:not(.dark) .fi-panel-support .fi-support-nav-group-btn.fi-current {
color: #ea580c;
}
html:not(.dark) .fi-panel-support .fi-support-nav-group-btn.fi-active {
background: rgba(249, 115, 22, 0.1);
}
html:not(.dark) .fi-support-nav-group-label {
text-shadow: none;
}
.fi-support-nav-group-btn .fi-icon {
width: 1.25rem;
height: 1.25rem;
color: inherit;
}
.fi-support-nav-group-label {
width: 100%;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
text-align: center;
font-size: 0.625rem;
line-height: 1.2;
font-weight: 600;
letter-spacing: 0.01em;
padding-inline: 0.1rem;
color: inherit;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.35);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.dark .fi-support-nav-group-btn,
html.dark .fi-support-nav-group-btn {
color: #f8fafc !important;
}
.dark .fi-support-nav-group-btn .fi-icon,
html.dark .fi-support-nav-group-btn .fi-icon,
.dark .fi-support-nav-group-label,
html.dark .fi-support-nav-group-label {
color: #ffffff !important;
opacity: 1;
}
.dark .fi-support-nav-section,
html.dark .fi-support-nav-section {
color: rgba(248, 250, 252, 0.82) !important;
}
@media (max-width: 1023px) {
.fi-support-nav-flyout,
.fi-support-nav-flyout-backdrop {
display: none !important;
}
}
.fi-support-nav-flyout-backdrop {
position: fixed;
inset: 0;
inset-inline-start: calc(var(--support-rail-width) + var(--support-flyout-width));
top: 0;
z-index: 1090;
isolation: isolate;
transform: translateZ(0);
background: rgba(15, 23, 42, 0.18);
cursor: default;
}
.fi-support-nav-flyout {
position: fixed;
top: 0;
inset-inline-start: var(--support-rail-width);
z-index: 1100;
isolation: isolate;
transform: translateZ(0);
display: none;
flex-direction: column;
width: var(--support-flyout-width);
height: 100dvh;
background: #1e1035;
border-inline-end: 1px solid rgba(167, 139, 250, 0.15);
box-shadow: 4px 0 20px rgba(0, 0, 0, 0.15);
}
.fi-support-nav-flyout.fi-support-nav-flyout-open {
display: flex;
}
.fi-support-nav-flyout-panel {
display: flex;
flex-direction: column;
height: 100%;
width: 100%;
min-height: 0;
}
.fi-support-nav-flyout-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.5rem;
padding: 0.75rem 0.85rem 0.65rem;
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
color: rgba(255, 255, 255, 0.95);
font-size: 0.8125rem;
font-weight: 600;
flex-shrink: 0;
}
.fi-support-nav-flyout-header-title {
min-width: 0;
flex: 1;
}
.fi-support-nav-flyout-header-actions {
position: relative;
flex-shrink: 0;
}
.fi-support-nav-flyout-settings-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.75rem;
height: 1.75rem;
border-radius: 0.4rem;
border: 1px solid rgba(255, 255, 255, 0.12);
background: rgba(255, 255, 255, 0.06);
color: rgba(255, 255, 255, 0.85);
transition: background-color 0.15s ease, color 0.15s ease;
}
.fi-support-nav-flyout-settings-btn:hover {
background: rgba(255, 255, 255, 0.12);
color: #fff;
}
.fi-support-nav-flyout-settings-menu {
position: absolute;
top: calc(100% + 0.35rem);
right: 0;
z-index: 50;
min-width: 14rem;
padding: 0.35rem;
border-radius: 0.5rem;
border: 1px solid rgba(255, 255, 255, 0.12);
background: rgba(15, 23, 42, 0.96);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}
.fi-support-nav-flyout-settings-link {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.65rem;
border-radius: 0.4rem;
text-decoration: none;
color: rgba(255, 255, 255, 0.9);
font-size: 0.8125rem;
font-weight: 500;
transition: background-color 0.15s ease;
}
.fi-support-nav-flyout-settings-link:hover {
background: rgba(255, 255, 255, 0.08);
}
.fi-support-nav-flyout-items {
flex: 1;
overflow-y: auto;
padding: 0.35rem;
list-style: none;
margin: 0;
min-height: 0;
}
.fi-support-nav-flyout-item {
margin: 0;
}
.fi-support-nav-flyout-section {
margin: 0 0 0.5rem;
list-style: none;
}
.fi-support-nav-flyout-section-label {
display: block;
padding: 0.3rem 0.65rem 0.2rem;
font-size: 0.625rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.45);
}
.fi-support-nav-flyout-subitems {
list-style: none;
margin: 0;
padding: 0;
}
.fi-support-nav-flyout-link {
display: flex;
align-items: center;
gap: 0.5rem;
padding: 0.5rem 0.65rem;
border-radius: 0.45rem;
text-decoration: none;
color: rgba(255, 255, 255, 0.88);
font-size: 0.8125rem;
font-weight: 500;
transition: background-color 0.15s ease, color 0.15s ease;
}
.fi-support-nav-flyout-link:hover {
background: rgba(255, 255, 255, 0.08);
}
.fi-support-nav-flyout-link.fi-active {
background: rgba(94, 234, 212, 0.12);
color: #5eead4;
}
.fi-support-nav-flyout-link--onedrive {
margin-top: 0.15rem;
border: 1px solid rgba(96, 165, 250, 0.22);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.16), rgba(124, 58, 237, 0.12));
color: #bfdbfe;
}
.fi-support-nav-flyout-link--onedrive:hover {
border-color: rgba(147, 197, 253, 0.38);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.24), rgba(124, 58, 237, 0.18));
color: #dbeafe;
}
.fi-support-nav-flyout-link--onedrive.fi-active {
border-color: rgba(147, 197, 253, 0.45);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.28), rgba(124, 58, 237, 0.22));
color: #eff6ff;
}
html:not(.dark) .fi-support-nav-flyout-link--onedrive {
color: #1d4ed8;
border-color: rgba(59, 130, 246, 0.22);
background: linear-gradient(135deg, rgba(239, 246, 255, 0.95), rgba(238, 242, 255, 0.9));
}
html:not(.dark) .fi-support-nav-flyout-link--onedrive:hover,
html:not(.dark) .fi-support-nav-flyout-link--onedrive.fi-active {
color: #1e40af;
border-color: rgba(59, 130, 246, 0.35);
background: linear-gradient(135deg, rgba(219, 234, 254, 0.98), rgba(224, 231, 255, 0.95));
}
.fi-support-nav-flyout-link .fi-icon {
width: 1rem;
height: 1rem;
flex-shrink: 0;
color: inherit;
}
.fi-support-nav-flyout-link span {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.fi-support-mobile-nav {
display: flex;
flex-direction: column;
gap: 0.25rem;
width: 100%;
padding-block: 0.5rem;
}
.fi-support-mobile-nav-group {
border-radius: 0.5rem;
overflow: hidden;
}
.fi-support-mobile-nav-group.fi-active > .fi-support-mobile-nav-group-btn {
color: #5eead4;
}
.fi-support-mobile-nav-group-btn {
display: flex;
align-items: center;
gap: 0.75rem;
width: 100%;
padding: 0.75rem 0.85rem;
border: none;
background: transparent;
color: rgba(255, 255, 255, 0.92);
cursor: pointer;
text-align: start;
font-size: 0.9375rem;
font-weight: 600;
}
.fi-support-mobile-nav-group-btn:hover {
background: rgba(255, 255, 255, 0.06);
}
.fi-support-mobile-nav-group-icon {
width: 1.25rem;
height: 1.25rem;
flex-shrink: 0;
}
.fi-support-mobile-nav-group-label {
flex: 1;
min-width: 0;
}
.fi-support-mobile-nav-group-chevron {
width: 1rem;
height: 1rem;
flex-shrink: 0;
opacity: 0.6;
transition: transform 0.2s ease;
}
.fi-support-mobile-nav-group-chevron-open {
transform: rotate(180deg);
}
.fi-support-mobile-nav-items {
list-style: none;
margin: 0;
padding: 0 0 0.35rem;
}
.fi-support-mobile-nav-section-label {
padding: 0.35rem 0.85rem 0.2rem 2.85rem;
font-size: 0.6875rem;
font-weight: 600;
letter-spacing: 0.04em;
text-transform: uppercase;
color: rgba(255, 255, 255, 0.45);
}
.fi-support-mobile-nav-item {
margin: 0;
}
.fi-support-mobile-nav-link {
display: flex;
align-items: center;
gap: 0.65rem;
padding: 0.6rem 0.85rem 0.6rem 2.85rem;
text-decoration: none;
color: rgba(255, 255, 255, 0.88);
font-size: 0.875rem;
font-weight: 500;
}
.fi-support-mobile-nav-link:hover {
background: rgba(255, 255, 255, 0.06);
}
.fi-support-mobile-nav-link.fi-active {
background: rgba(94, 234, 212, 0.12);
color: #5eead4;
}
.fi-support-mobile-nav-link--onedrive {
border: 1px solid rgba(96, 165, 250, 0.22);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.16), rgba(124, 58, 237, 0.12));
color: #bfdbfe;
}
.fi-support-mobile-nav-link--onedrive.fi-active,
.fi-support-mobile-nav-link--onedrive:hover {
border-color: rgba(147, 197, 253, 0.38);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.24), rgba(124, 58, 237, 0.18));
color: #dbeafe;
}
.fi-support-mobile-nav-link .fi-icon {
width: 1.125rem;
height: 1.125rem;
flex-shrink: 0;
}
@media (max-width: 1023px) {
.fi-panel-support {
--sidebar-width: 100%;
}
.fi-panel-support .fi-sidebar.fi-main-sidebar {
width: 100% !important;
max-width: none !important;
inset-inline: 0 !important;
z-index: 50 !important;
}
.fi-support-mobile-nav-close {
display: flex;
align-items: center;
justify-content: center;
align-self: flex-end;
width: 2.25rem;
height: 2.25rem;
margin: 0.15rem 0.35rem 0.25rem;
padding: 0;
border: none;
border-radius: 0.5rem;
background: transparent;
color: rgba(255, 255, 255, 0.88);
cursor: pointer;
}
.fi-support-mobile-nav-close:hover {
background: rgba(255, 255, 255, 0.08);
}
.fi-support-mobile-nav-close .fi-icon {
width: 1.15rem;
height: 1.15rem;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-close {
color: #334155;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-close:hover {
background: rgba(15, 23, 42, 0.05);
}
.fi-panel-support .fi-sidebar-nav {
padding-top: 0.25rem !important;
padding-inline: 0.5rem !important;
padding-bottom: 1rem !important;
}
.fi-panel-support .fi-compact-sidebar-brand-header {
padding: 0.75rem 0.75rem 0.65rem;
}
.fi-panel-support .fi-topbar-ctn {
margin-inline-start: 0;
width: 100%;
}
.fi-panel-support .fi-main-ctn {
margin-inline-start: 0;
width: 100%;
}
}
.fi-navigation-favorite-toggle {
display: inline-flex;
vertical-align: middle;
margin-inline-start: 0.5rem;
}
.fi-panel-support .fi-header > div:first-child {
display: flex;
flex-wrap: wrap;
align-items: center;
column-gap: 0.35rem;
row-gap: 0.25rem;
}
.fi-panel-support .fi-header-heading {
order: 1;
display: inline;
margin: 0;
}
.fi-panel-support .fi-navigation-favorite-toggle {
order: 2;
}
.fi-panel-support .fi-breadcrumbs {
order: 3;
flex: 1 0 100%;
}
.fi-panel-support .fi-header-subheading {
order: 4;
flex: 1 0 100%;
}
.fi-navigation-favorite-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
border-radius: 9999px;
border: 1px solid rgba(148, 163, 184, 0.35);
background: rgba(255, 255, 255, 0.04);
color: rgb(148 163 184);
transition: color 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
}
.fi-navigation-favorite-btn:hover {
color: rgb(234 88 12);
border-color: rgba(234, 88, 12, 0.45);
background: rgba(234, 88, 12, 0.08);
}
.fi-navigation-favorite-btn--active,
.fi-navigation-favorite-btn:hover .fi-navigation-favorite-btn--active {
color: rgb(234 88 12);
}
.fi-support-nav-group-btn--favorites.fi-active .fi-icon,
.fi-support-nav-group-btn--favorites.fi-current .fi-icon {
color: #fbbf24;
}
.fi-support-nav-flyout-empty {
padding: 0.75rem 0.85rem;
font-size: 0.75rem;
line-height: 1.45;
color: rgb(148 163 184);
}
html:not(.dark) .fi-support-nav-flyout-empty {
color: #64748b;
}
.fi-panel-support .fi-topbar {
position: relative;
display: flex;
align-items: center;
gap: 0.5rem;
padding-inline: 0.75rem 1rem;
}
.fi-panel-support .fi-topbar-open-sidebar-btn,
.fi-panel-support .fi-topbar-close-sidebar-btn {
flex-shrink: 0;
}
.fi-panel-support .fi-topbar-start {
display: none !important;
}
.fi-panel-support .fi-topbar-end {
flex: 1 1 auto;
display: flex;
align-items: center;
justify-content: flex-end;
gap: 0.35rem;
min-width: 0;
margin-inline-start: 0 !important;
position: relative;
}
.fi-panel-support .fi-support-topbar-tenant-wrap {
flex-shrink: 0;
display: flex;
align-items: center;
gap: 0.35rem;
min-width: 0;
margin-inline-end: auto;
z-index: 3;
}
.fi-panel-support .fi-support-topbar-notifications {
display: inline-flex;
align-items: center;
flex-shrink: 0;
}
.fi-panel-support .fi-support-topbar-notifications .fi-no-database {
display: inline-flex;
align-items: center;
}
.fi-panel-support .fi-support-topbar-tenant-wrap > :first-child:not(.fi-support-topbar-quick-links):not(.fi-support-topbar-notifications) {
min-width: 0;
max-width: 11rem;
}
.fi-panel-support .fi-global-search-ctn {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: min(32rem, 46vw);
max-width: 32rem;
z-index: 1;
display: flex !important;
}
.fi-panel-support .fi-global-search,
.fi-panel-support .fi-global-search-field {
width: 100%;
}
.fi-panel-support .fi-support-topbar-quick-links {
display: inline-flex;
align-items: center;
gap: 0.35rem;
flex-shrink: 0;
}
.fi-panel-support .fi-support-topbar-right {
display: inline-flex;
align-items: center;
gap: 0.25rem;
flex-shrink: 0;
z-index: 2;
}
.fi-panel-support .fi-topbar-end > *:not(.fi-global-search-ctn) {
flex-shrink: 0;
z-index: 2;
}
.fi-support-topbar-tenant-btn,
.fi-support-topbar-tenant-link {
max-width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.fi-support-topbar-settings-btn {
flex-shrink: 0;
}
.fi-panel-support .fi-topbar-database-notifications-btn {
flex-shrink: 0;
}
.fi-support-topbar-quick-link {
display: inline-flex;
align-items: center;
gap: 0.45rem;
padding: 0.35rem 0.75rem 0.35rem 0.45rem;
border-radius: 9999px;
text-decoration: none;
font-size: 0.8125rem;
font-weight: 600;
line-height: 1;
border: 1px solid rgba(96, 165, 250, 0.28);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.14), rgba(124, 58, 237, 0.12));
color: #bfdbfe;
box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
transition: border-color 0.2s ease, background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease;
}
.fi-support-topbar-quick-link:hover {
border-color: rgba(147, 197, 253, 0.45);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.22), rgba(124, 58, 237, 0.18));
transform: translateY(-1px);
box-shadow: 0 4px 14px rgba(37, 99, 235, 0.18);
}
.fi-support-topbar-quick-link__icon-wrap {
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.5rem;
height: 1.5rem;
border-radius: 9999px;
background: rgba(255, 255, 255, 0.1);
}
.fi-support-topbar-quick-link__icon {
width: 0.95rem;
height: 0.95rem;
color: #93c5fd;
}
.fi-support-topbar-quick-link__label {
white-space: nowrap;
}
html:not(.dark) .fi-support-topbar-quick-link {
color: #1d4ed8;
border-color: rgba(59, 130, 246, 0.25);
background: linear-gradient(135deg, rgba(239, 246, 255, 0.95), rgba(238, 242, 255, 0.92));
}
html:not(.dark) .fi-support-topbar-quick-link:hover {
color: #1e40af;
border-color: rgba(59, 130, 246, 0.4);
background: linear-gradient(135deg, rgba(219, 234, 254, 0.98), rgba(224, 231, 255, 0.95));
}
html:not(.dark) .fi-support-topbar-quick-link__icon {
color: #2563eb;
}
.fi-support-topbar-quick-link--google-drive {
border-color: rgba(22, 163, 74, 0.35);
background: linear-gradient(135deg, rgba(220, 252, 231, 0.2), rgba(254, 249, 195, 0.16));
color: #bbf7d0;
}
.fi-support-topbar-quick-link--google-drive .fi-support-topbar-quick-link__icon {
color: #4ade80;
}
html:not(.dark) .fi-support-topbar-quick-link--google-drive {
color: #166534;
border-color: rgba(22, 163, 74, 0.35);
background: linear-gradient(135deg, rgba(240, 253, 244, 0.98), rgba(254, 249, 195, 0.92));
}
html:not(.dark) .fi-support-topbar-quick-link--google-drive .fi-support-topbar-quick-link__icon {
color: #15803d;
}
@media (max-width: 1023px) {
.fi-support-topbar-quick-link__label {
display: none;
}
.fi-support-topbar-quick-link {
padding: 0.4rem;
}
}
.fi-support-topbar-settings-menu {
max-height: min(70vh, 28rem);
overflow-y: auto;
}
@media (max-width: 1023px) {
.fi-panel-support .fi-support-topbar-tenant-wrap {
order: -2;
}
.fi-panel-support .fi-support-topbar-tenant-wrap > :first-child {
max-width: 7rem;
}
.fi-panel-support .fi-support-topbar-tenant-btn,
.fi-panel-support .fi-support-topbar-tenant-link {
font-size: 0.75rem;
padding-inline: 0.5rem;
}
.fi-panel-support .fi-global-search-ctn {
position: static;
transform: none;
flex: 1 1 auto;
width: auto;
max-width: none;
min-width: 0;
order: -1;
}
.fi-panel-support .fi-topbar-end {
flex-wrap: nowrap;
gap: 0.25rem;
}
.fi-panel-support .fi-support-topbar-right {
margin-inline-start: 0;
}
}
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');
.fi-panel-support {
--upango-deep: #0f172a;
--upango-purple: #1e1b4b;
--upango-violet: #4c1d95;
--upango-accent: #f97316;
--upango-accent-hover: #ea580c;
--upango-glow: #a855f7;
--upango-rail: #1a0b2e;
--upango-rail-border: rgba(167, 139, 250, 0.15);
--upango-flyout: #1e1035;
--upango-surface: rgba(255, 255, 255, 0.92);
--upango-surface-muted: #f8fafc;
--upango-text: #0f172a;
--upango-text-muted: #64748b;
--upango-border: rgba(148, 163, 184, 0.35);
}
.dark .fi-panel-support {
--upango-surface: rgba(30, 23, 53, 0.52);
--upango-surface-muted: rgba(26, 11, 46, 0.38);
--upango-text: #ffffff;
--upango-text-muted: #e2e8f0;
--upango-border: rgba(167, 139, 250, 0.14);
}
.fi-panel-support,
.fi-panel-support .fi-layout,
.fi-panel-support .fi-main {
font-family: 'Inter', system-ui, sans-serif;
}
.fi-panel-support .fi-header-heading,
.fi-panel-support .fi-section-header-heading,
.fi-panel-support .fi-ta-header-heading {
font-family: 'Space Grotesk', 'Inter', sans-serif !important;
}
.fi-panel-support .upango-support-bg {
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
background:
radial-gradient(circle at 12% 18%, rgba(76, 29, 149, 0.22) 0%, transparent 42%),
radial-gradient(circle at 88% 72%, rgba(249, 115, 22, 0.08) 0%, transparent 38%),
linear-gradient(155deg, #f8fafc 0%, #eef2ff 45%, #faf5ff 100%);
}
.dark .fi-panel-support .upango-support-bg {
background:
radial-gradient(circle at center, rgba(76, 29, 149, 0.35) 0%, transparent 55%),
radial-gradient(circle at 85% 20%, rgba(249, 115, 22, 0.12) 0%, transparent 40%),
linear-gradient(160deg, #1a0b2e 0%, #1e1b4b 38%, #0f172a 100%);
}
.dark .fi-panel-support .fi-sidebar.fi-main-sidebar,
.dark .fi-panel-support .fi-compact-sidebar-brand-header,
.dark .fi-panel-support .fi-compact-sidebar-brand-footer,
.dark .fi-panel-support .fi-sidebar-footer {
background: var(--upango-rail) !important;
border-color: var(--upango-rail-border) !important;
backdrop-filter: none !important;
box-shadow: none !important;
}
html:not(.dark) .fi-panel-support .fi-sidebar.fi-main-sidebar,
html:not(.dark) .fi-panel-support .fi-compact-sidebar-brand-header,
html:not(.dark) .fi-panel-support .fi-compact-sidebar-brand-footer,
html:not(.dark) .fi-panel-support .fi-sidebar-footer {
background: rgba(255, 255, 255, 0.92) !important;
border-color: rgba(148, 163, 184, 0.4) !important;
backdrop-filter: blur(12px) saturate(140%) !important;
-webkit-backdrop-filter: blur(12px) saturate(140%) !important;
box-shadow: inset -1px 0 0 rgba(148, 163, 184, 0.15) !important;
}
.fi-panel-support .fi-sidebar.fi-main-sidebar {
border-right: 1px solid var(--upango-rail-border) !important;
}
html:not(.dark) .fi-panel-support .fi-sidebar.fi-main-sidebar {
border-right-color: rgba(148, 163, 184, 0.35) !important;
}
.fi-panel-support .fi-compact-sidebar-brand-header {
min-height: 4.25rem;
flex-shrink: 0;
padding-block: 0.5rem;
}
.fi-panel-support .fi-compact-sidebar-brand-logo {
filter: drop-shadow(0 0 10px rgba(168, 85, 247, 0.4));
}
.fi-panel-support .fi-support-nav-group-btn.fi-active,
.fi-panel-support .fi-support-nav-group-btn.fi-current {
color: var(--upango-accent) !important;
box-shadow: inset 3px 0 0 var(--upango-accent) !important;
}
.fi-panel-support .fi-support-nav-flyout {
z-index: 1100 !important;
isolation: isolate;
transform: translateZ(0);
border-inline-end: 1px solid var(--upango-rail-border) !important;
box-shadow: 8px 0 32px rgba(0, 0, 0, 0.35) !important;
}
.dark .fi-panel-support .fi-support-nav-flyout {
background: var(--upango-flyout) !important;
}
html:not(.dark) .fi-panel-support .fi-support-nav-flyout {
background: rgba(255, 255, 255, 0.98) !important;
border-inline-end-color: rgba(148, 163, 184, 0.35) !important;
box-shadow: 8px 0 32px rgba(15, 23, 42, 0.08) !important;
}
html:not(.dark) .fi-panel-support .fi-support-nav-flyout-header {
color: #0f172a !important;
border-bottom-color: rgba(148, 163, 184, 0.25) !important;
}
html:not(.dark) .fi-panel-support .fi-support-nav-flyout-section-label {
color: #64748b !important;
}
html:not(.dark) .fi-panel-support .fi-support-nav-flyout-link {
color: #334155 !important;
}
html:not(.dark) .fi-panel-support .fi-support-nav-flyout-link:hover {
background: rgba(249, 115, 22, 0.08) !important;
color: #ea580c !important;
}
.dark .fi-panel-support .fi-support-nav-flyout-link:hover {
background: rgba(249, 115, 22, 0.12) !important;
color: #fdba74 !important;
}
html:not(.dark) .fi-panel-support .fi-support-nav-flyout-link .fi-icon {
color: inherit !important;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-group-btn {
color: #334155 !important;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-group-btn:hover {
background: rgba(15, 23, 42, 0.04) !important;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-section-label {
color: #64748b !important;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-link {
color: #475569 !important;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-link:hover {
background: rgba(15, 23, 42, 0.04) !important;
color: #0f172a !important;
}
.dark .fi-panel-support .fi-support-nav-flyout-link.fi-active {
background: rgba(249, 115, 22, 0.15) !important;
color: #fdba74 !important;
}
.fi-panel-support .fi-support-nav-flyout-backdrop {
z-index: 1090 !important;
isolation: isolate;
transform: translateZ(0);
background: rgba(15, 23, 42, 0.45) !important;
}
.dark .fi-panel-support .fi-support-nav-flyout-backdrop {
background: rgba(0, 0, 0, 0.55) !important;
}
html:not(.dark) .fi-panel-support .fi-support-nav-flyout-link.fi-active {
background: rgba(249, 115, 22, 0.1) !important;
color: #ea580c !important;
}
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-link.fi-active,
html:not(.dark) .fi-panel-support .fi-support-mobile-nav-group.fi-active > .fi-support-mobile-nav-group-btn {
color: #ea580c !important;
}
.dark .fi-panel-support .fi-support-mobile-nav-link.fi-active,
.dark .fi-panel-support .fi-support-mobile-nav-group.fi-active > .fi-support-mobile-nav-group-btn {
color: var(--upango-accent) !important;
}
.fi-panel-support .fi-topbar {
background: rgba(26, 11, 46, 0.65) !important;
border-bottom: 1px solid var(--upango-border) !important;
backdrop-filter: blur(16px) saturate(160%) !important;
-webkit-backdrop-filter: blur(16px) saturate(160%) !important;
color: var(--upango-text);
box-shadow: 0 4px 24px -8px rgba(0, 0, 0, 0.35) !important;
}
html:not(.dark) body.fi-panel-support .fi-topbar {
background: rgba(255, 255, 255, 0.72) !important;
box-shadow: 0 4px 24px -8px rgba(15, 23, 42, 0.08) !important;
}
.fi-panel-support .fi-dropdown-list-item,
.fi-panel-support .fi-dropdown-list-item-label {
color: inherit !important;
}
.fi-panel-support .fi-dropdown-list-item:hover,
.fi-panel-support .fi-dropdown-list-item:focus {
background: rgba(249, 115, 22, 0.1) !important;
}
.fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined),
.fi-panel-support .fi-btn-primary {
background: linear-gradient(105deg, var(--upango-accent), var(--upango-accent-hover)) !important;
box-shadow: 0 4px 14px rgba(249, 115, 22, 0.35) !important;
color: #fff !important;
}
.fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined) .fi-btn-label,
.fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined) > .fi-icon,
.fi-panel-support .fi-btn-primary .fi-btn-label {
color: #fff !important;
-webkit-text-fill-color: #fff !important;
}
.fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined):hover,
.fi-panel-support .fi-btn-primary:hover {
box-shadow: 0 8px 22px rgba(249, 115, 22, 0.45) !important;
}
.fi-panel-support .fi-breadcrumbs-item-label {
color: #7c3aed !important;
}
.dark .fi-panel-support .fi-breadcrumbs-item-label {
color: #c4b5fd !important;
}
.fi-panel-support .fi-sidebar-item-active,
.fi-panel-support .fi-tabs-item.fi-active,
.fi-panel-support .fi-tabs-item[aria-selected='true'] {
border-color: var(--upango-accent) !important;
}
.fi-panel-support .fi-input-wrp:focus-within {
border-color: #a855f7 !important;
box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.2) !important;
}
body.fi-panel-support,
body.fi-panel-support .fi-layout,
body.fi-panel-support .fi-main,
body.fi-panel-support .fi-content {
background-color: transparent !important;
}
[x-cloak].fi-support-nav-flyout,
[x-cloak].fi-support-nav-flyout-backdrop,
[x-cloak].fi-support-nav-flyout-panel {
display: none !important;
}
@media (prefers-reduced-motion: reduce) {
.fi-panel-support .owl-glow,
.fi-panel-support .fi-compact-sidebar-brand-logo {
animation: none;
}
}
.fi-panel-support .fi-modal-window .fi-fo-date-time-picker-panel {
z-index: 50 !important;
}
.fi-panel-support {
--upango-glass: rgba(30, 23, 53, 0.52);
--upango-glass-elevated: rgba(38, 28, 68, 0.72);
--upango-glass-subtle: rgba(255, 255, 255, 0.04);
--upango-glass-hover: rgba(255, 255, 255, 0.07);
--upango-glass-border: rgba(167, 139, 250, 0.14);
--upango-glass-border-hover: rgba(167, 139, 250, 0.28);
--upango-glass-blur: blur(16px) saturate(160%);
--upango-glass-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.45);
--upango-glass-radius: 1.25rem;
}
.fi-panel-support .fi-section,
.fi-panel-support .fi-section-content-ctn,
.fi-panel-support .fi-card,
.fi-panel-support .fi-ta-ctn,
.fi-panel-support .fi-ta-content,
.fi-panel-support .fi-ta-container,
.fi-panel-support .fi-infolist,
.fi-panel-support .fi-infolist-entry-wrapper,
.fi-panel-support .fi-fo-repeater-item,
.fi-panel-support .fi-fo-builder-block,
.fi-panel-support .fi-resource-relation-manager,
.fi-panel-support .fi-empty-state,
.fi-panel-support .fi-pagination,
.fi-panel-support .fi-tabs,
.fi-panel-support .fi-wi-stats-overview-stat,
.fi-panel-support .fi-wi-chart,
.fi-panel-support .fi-wi-table,
.fi-panel-support .fi-sc-wizard-step,
.fi-panel-support .fi-sc-tabs-tab,
.fi-panel-support .fi-global-search-result-group,
.fi-panel-support .fi-tenant-menu-trigger,
.fi-panel-support .fi-page-sub-navigation-sidebar {
background: var(--upango-glass) !important;
backdrop-filter: var(--upango-glass-blur) !important;
-webkit-backdrop-filter: var(--upango-glass-blur) !important;
border: 1px solid var(--upango-glass-border) !important;
box-shadow: var(--upango-glass-shadow) !important;
border-radius: var(--upango-glass-radius) !important;
transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.fi-panel-support .fi-section:hover,
.fi-panel-support .fi-card:hover,
.fi-panel-support .fi-wi-stats-overview-stat:hover {
border-color: var(--upango-glass-border-hover) !important;
}
.dark .fi-panel-support .fi-wi-stats-overview-stat-value {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark .fi-panel-support .fi-wi-stats-overview-stat-label,
.dark .fi-panel-support .fi-wi-stats-overview-stat-description {
color: #e2e8f0 !important;
-webkit-text-fill-color: #e2e8f0 !important;
}
.dark .fi-panel-support .fi-ta-header-cell {
background: rgba(255, 255, 255, 0.04) !important;
color: #e2e8f0 !important;
border-color: var(--upango-glass-border) !important;
text-transform: uppercase;
font-size: 0.7rem;
letter-spacing: 0.06em;
}
.fi-panel-support .fi-ta-row,
.fi-panel-support .fi-ta-record {
transition: background 0.15s ease;
}
.fi-panel-support .fi-ta-row:hover,
.fi-panel-support .fi-ta-record.fi-clickable:hover {
background: var(--upango-glass-hover) !important;
}
.fi-panel-support .fi-ta-content:not(.fi-ta-content-grid) {
background: var(--upango-glass-subtle) !important;
border-radius: var(--upango-glass-radius) !important;
}
.fi-panel-support .fi-ta-content:not(.fi-ta-content-grid) .fi-ta-record {
background: var(--upango-glass) !important;
--tw-ring-color: transparent !important;
}
.dark .fi-panel-support .fi-ta-table thead th {
background: rgba(255, 255, 255, 0.04) !important;
color: #e2e8f0 !important;
border-color: var(--upango-glass-border) !important;
}
.dark .fi-panel-support .fi-ta-table tbody td {
border-color: rgba(255, 255, 255, 0.08) !important;
color: #ffffff;
}
.fi-panel-support .fi-ta-table tbody tr:hover td {
background: var(--upango-glass-hover) !important;
}
.fi-panel-support .fi-input-wrp,
.fi-panel-support .fi-select-input,
.fi-panel-support .fi-textarea,
.fi-panel-support .fi-fo-rich-editor-toolbar {
background: #ffffff !important;
border: 1px solid var(--upango-glass-border) !important;
border-radius: 0.75rem !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
color: #0f172a !important;
}
.dark .fi-panel-support .fi-input-wrp,
.dark .fi-panel-support .fi-select-input,
.dark .fi-panel-support .fi-textarea,
.dark .fi-panel-support .fi-fo-rich-editor-toolbar {
background: rgba(15, 23, 42, 0.55) !important;
border: 1px solid var(--upango-glass-border) !important;
border-radius: 0.75rem !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
}
.dark .fi-panel-support .fi-input-wrp,
.dark .fi-panel-support .fi-select-input,
.dark .fi-panel-support .fi-textarea,
.dark .fi-panel-support .fi-fo-rich-editor-toolbar {
color: #e2e8f0 !important;
}
.fi-panel-support .fi-input-wrp:focus-within {
border-color: rgba(168, 85, 247, 0.45) !important;
box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.15) !important;
background: #ffffff !important;
}
.dark .fi-panel-support .fi-input-wrp:focus-within {
background: rgba(15, 23, 42, 0.72) !important;
}
.dark .fi-panel-support .fi-fo-field-wrp-label,
.dark .fi-panel-support .fi-fo-field-wrp-label span {
color: #cbd5e1 !important;
}
body.fi-panel-support .fi-modal-window,
body.fi-panel-support .fi-dropdown-panel,
body.fi-panel-support .fi-select-panel,
body.fi-panel-support .choices__list--dropdown,
.fi-panel-support .fi-modal-window,
.fi-panel-support .fi-dropdown-panel,
.fi-panel-support .fi-select-panel,
.fi-panel-support [x-ref="panel"],
.fi-panel-support .fi-tenant-menu,
.fi-panel-support .fi-user-menu .fi-dropdown-panel {
z-index: 9999 !important;
background: var(--upango-glass-elevated) !important;
backdrop-filter: blur(20px) saturate(180%) !important;
-webkit-backdrop-filter: blur(20px) saturate(180%) !important;
border: 1px solid var(--upango-glass-border) !important;
box-shadow: 0 24px 48px -12px rgba(0, 0, 0, 0.65) !important;
color: #f1f5f9 !important;
border-radius: 1rem !important;
}
.dark body.fi-panel-support .fi-dropdown-panel,
.dark body.fi-panel-support .fi-select-panel,
.dark .fi-panel-support .fi-dropdown-panel,
.dark .fi-panel-support .fi-select-panel {
background: rgba(30, 22, 56, 0.96) !important;
color: #f1f5f9 !important;
}
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option span,
.dark body.fi-panel-support .fi-select-panel .fi-select-option,
.dark .fi-panel-support .fi-dropdown-panel .fi-select-input-option,
.dark .fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item,
.dark .fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
.dark .fi-panel-support .fi-dropdown-panel .fi-select-input-option span,
.dark .fi-panel-support .fi-select-panel .fi-select-option {
color: #e2e8f0 !important;
-webkit-text-fill-color: #e2e8f0 !important;
}
.dark body.fi-panel-support .fi-dropdown-panel .text-gray-950,
.dark body.fi-panel-support .fi-dropdown-panel .text-gray-900,
.dark body.fi-panel-support .fi-dropdown-panel .text-gray-800,
.dark body.fi-panel-support .fi-dropdown-panel .text-gray-700,
.dark body.fi-panel-support .fi-dropdown-panel .text-gray-600,
.dark body.fi-panel-support .fi-dropdown-panel .text-gray-500,
.dark body.fi-panel-support .fi-dropdown-panel .text-gray-400,
.dark body.fi-panel-support .fi-select-panel .text-gray-950,
.dark body.fi-panel-support .fi-select-panel .text-gray-900,
.dark body.fi-panel-support .fi-select-panel .text-gray-800,
.dark body.fi-panel-support .fi-select-panel .text-gray-700,
.dark body.fi-panel-support .fi-select-panel .text-gray-600,
.dark body.fi-panel-support .fi-select-panel .text-gray-500,
.dark body.fi-panel-support .fi-select-panel .text-gray-400 {
color: #e2e8f0 !important;
-webkit-text-fill-color: #e2e8f0 !important;
}
body.fi-panel-support .fi-select-panel .fi-select-option,
body.fi-panel-support .fi-dropdown-panel .fi-select-input-option,
body.fi-panel-support .fi-dropdown-list-item,
.fi-panel-support .fi-select-panel .fi-select-option,
.fi-panel-support .fi-dropdown-panel .fi-select-input-option,
.fi-panel-support .fi-dropdown-list-item {
color: #e2e8f0 !important;
}
body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
body.fi-panel-support .fi-dropdown-panel .fi-select-input-option span,
.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
.fi-panel-support .fi-dropdown-panel .fi-select-input-option span {
color: #e2e8f0 !important;
}
body.fi-panel-support .fi-select-panel .fi-select-option:hover,
body.fi-panel-support .fi-select-panel .fi-select-option.fi-selected,
body.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover,
body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected,
.fi-panel-support .fi-select-panel .fi-select-option:hover,
.fi-panel-support .fi-select-panel .fi-select-option.fi-selected,
.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover,
.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected,
.fi-panel-support .fi-dropdown-list-item:hover,
.fi-panel-support .fi-dropdown-list-item:focus {
background: rgba(249, 115, 22, 0.12) !important;
color: #f8fafc !important;
}
body.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover span,
body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected span,
.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover span,
.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected span {
color: #f8fafc !important;
}
.fi-panel-support .fi-page .fi-section,
.fi-panel-support .fi-page .fi-section-content-ctn,
.fi-panel-support .fi-page .fi-section-content,
.fi-panel-support .fi-fo-field-wrp,
.fi-panel-support .fi-fo-select-wrp,
.fi-panel-support .fi-input-wrp {
overflow: visible !important;
}
.fi-panel-support .fi-ta-content-ctn {
overflow-x: auto !important;
overflow-y: visible !important;
}
.fi-panel-support .fi-ta-content-ctn:has(.fi-ta-content-grid) {
overflow: visible !important;
}
.fi-panel-support .fi-ta-content-grid .fi-ta-record,
.fi-panel-support .fi-ta-content-grid .fi-ta-record-content-ctn {
overflow: visible !important;
}
.fi-panel-support .fi-ta-content-grid .fi-ta-actions {
flex-wrap: wrap;
row-gap: 0.35rem;
}
.fi-panel-support .upango-devices-list .fi-ta-content-ctn {
overflow-x: hidden !important;
}
.fi-panel-support .upango-devices-list .fi-ta-table {
table-layout: fixed;
width: 100% !important;
max-width: 100%;
}
.fi-panel-support .upango-devices-list .fi-ta-cell:not(:has(.fi-ta-actions)) {
overflow: hidden !important;
vertical-align: top;
}
.fi-panel-support .upango-devices-list .fi-ta-cell .fi-ta-text,
.fi-panel-support .upango-devices-list .fi-ta-cell .fi-ta-col {
white-space: normal !important;
overflow-wrap: anywhere;
word-break: break-word;
}
.fi-panel-support .upango-devices-list .fi-ta-actions-header-cell,
.fi-panel-support .upango-devices-list .fi-ta-cell:has(.fi-ta-actions) {
width: 1%;
max-width: none;
white-space: nowrap;
overflow: visible !important;
text-align: end;
}
.fi-panel-support .upango-devices-list .fi-ta-actions {
justify-content: flex-end;
flex-wrap: nowrap;
gap: 0.25rem;
}
.fi-panel-support .fi-resource-list-records-page .fi-page-content .fi-sc.fi-sc-has-gap {
gap: 0.45rem;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-main {
position: relative;
}
.fi-panel-support .upango-devices-list .fi-ta-header {
display: none !important;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-table-stacked-header-row) .fi-ta-header-ctn,
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-content-header) .fi-ta-header-ctn {
position: absolute;
z-index: 4;
inset-inline: 0;
top: 0;
height: 0;
margin: 0;
padding: 0;
overflow: visible;
border: 0;
background: transparent;
pointer-events: none;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-table-stacked-header-row) .fi-ta-header-toolbar,
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-content-header) .fi-ta-header-toolbar {
display: flex;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-end;
gap: 0.75rem;
height: 3.15rem;
margin: 0;
padding: 0 0.85rem 0 18.5rem;
border: 0;
background: transparent;
pointer-events: none;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-table-stacked-header-row) .fi-ta-header-toolbar > *,
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-content-header) .fi-ta-header-toolbar > * {
pointer-events: auto;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-table-stacked-header-row) .fi-ta-header-toolbar > .fi-ta-actions,
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-content-header) .fi-ta-header-toolbar > .fi-ta-actions {
margin-inline-end: auto;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-search-field {
width: 16rem;
max-width: 34vw;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-table-stacked-header-row) .fi-ta-selection-indicator,
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-content-header) .fi-ta-selection-indicator {
position: absolute;
z-index: 4;
top: 0.7rem;
inset-inline-end: 18.25rem;
inset-inline-start: auto;
width: max-content;
flex-direction: row;
align-items: center;
margin: 0;
padding: 0;
border: 0;
background: transparent;
pointer-events: none;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-table-stacked-header-row) .fi-ta-selection-indicator > *,
.fi-panel-support .fi-resource-list-records-page .fi-ta-main:has(.fi-ta-content-header) .fi-ta-selection-indicator > * {
pointer-events: auto;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-table-stacked-header-cell,
.fi-panel-support .fi-resource-list-records-page .fi-ta-content-header {
align-items: center;
min-height: 3.15rem;
padding-block: 0.35rem !important;
padding-inline: 0.85rem 18rem !important;
background: transparent !important;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-table-stacked-sorting,
.fi-panel-support .fi-resource-list-records-page .fi-ta-sorting-settings {
flex: 0 1 16rem !important;
width: auto;
max-width: 16rem;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-page-checkbox {
margin-inline-start: 0 !important;
}
@media (min-width: 640px) {
.fi-panel-support .fi-resource-list-records-page .fi-ta-table.fi-ta-table-stacked-on-mobile > thead > .fi-ta-table-stacked-header-row {
display: table-row !important;
}
.fi-panel-support .fi-resource-list-records-page .fi-ta-table.fi-ta-table-stacked-on-mobile > thead > .fi-ta-table-stacked-header-row > .fi-ta-table-stacked-header-cell {
display: flex !important;
}
}
.fi-panel-support .fi-dropdown-panel .upango-menu-heading {
pointer-events: none;
font-size: 0.68rem;
font-weight: 700;
letter-spacing: 0.06em;
text-transform: uppercase;
opacity: 1 !important;
}
.fi-panel-support .fi-ta-ctn,
.fi-panel-support .fi-ta-content,
.fi-panel-support .fi-ta-table,
.fi-panel-support .fi-ta-actions,
.fi-panel-support .fi-ta-record,
.fi-panel-support .fi-ta-row,
.fi-panel-support .fi-ta-cell,
.fi-panel-support .fi-ta-record .fi-dropdown,
.fi-panel-support .fi-ta-cell .fi-dropdown {
overflow: visible !important;
}
body.fi-panel-support .fi-dropdown-panel.fi-scrollable,
.fi-panel-support .fi-dropdown-panel.fi-scrollable {
max-height: min(60vh, 22rem) !important;
overflow-x: hidden !important;
overflow-y: auto !important;
overscroll-behavior: contain;
}
body.fi-panel-support .fi-dropdown-panel.fi-scrollable:has(.upango-menu-heading),
.fi-panel-support .fi-dropdown-panel.fi-scrollable:has(.upango-menu-heading) {
max-height: min(70vh, 36rem) !important;
overflow-x: hidden !important;
overflow-y: auto !important;
overscroll-behavior: contain;
scrollbar-gutter: stable;
scrollbar-width: thin;
-webkit-overflow-scrolling: touch;
}
.fi-panel-support .fi-dropdown-panel:has(.fi-dropdown-list) {
width: max-content !important;
min-width: 16rem !important;
max-width: min(22rem, calc(100vw - 1.5rem)) !important;
overflow-x: hidden !important;
box-sizing: border-box;
}
.fi-panel-support .fi-dropdown-list-item-label {
white-space: normal !important;
}
.fi-panel-support .fi-dropdown-panel {
z-index: 40;
}
.fi-panel-support .fi-dropdown-panel .fi-dropdown-panel {
z-index: 50;
}
.fi-panel-support .fi-tabs-item {
color: #94a3b8 !important;
border-radius: 0.625rem !important;
}
.fi-panel-support .fi-tabs-item.fi-active,
.fi-panel-support .fi-tabs-item[aria-selected='true'] {
background: #ffedd5 !important;
color: #0f172a !important;
}
.fi-panel-support .fi-tabs-item.fi-active .fi-tabs-item-label,
.fi-panel-support .fi-tabs-item[aria-selected='true'] .fi-tabs-item-label {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.fi-panel-support .fi-tabs-item:not(.fi-active):hover {
background: var(--upango-glass-hover) !important;
color: #e2e8f0 !important;
}
.fi-panel-support .fi-notification {
background: var(--upango-glass-elevated) !important;
backdrop-filter: var(--upango-glass-blur) !important;
border-left: 4px solid var(--upango-accent, #f97316) !important;
color: #f1f5f9 !important;
border-radius: 1rem !important;
}
.fi-panel-support .fi-header-heading,
.fi-panel-support .fi-ta-header-heading,
.fi-panel-support .fi-section-header-heading,
.fi-panel-support .fi-wi-header-heading {
background: linear-gradient(135deg, #c4b5fd, #fdba74) !important;
background-clip: text !important;
-webkit-background-clip: text !important;
-webkit-text-fill-color: transparent !important;
color: transparent !important;
font-weight: 700 !important;
}
.fi-panel-support .fi-page .bg-white,
.fi-panel-support .fi-page .bg-white\/80,
.fi-panel-support .fi-page .bg-white\/90,
.fi-panel-support .fi-page .dark\:bg-gray-900,
.fi-panel-support .fi-page .dark\:bg-gray-800,
.fi-panel-support .fi-page .dark\:bg-gray-950,
.fi-panel-support .fi-main .bg-white,
.fi-panel-support .fi-main .bg-white\/80,
.fi-panel-support .fi-main .bg-white\/90,
.fi-panel-support .fi-main .dark\:bg-gray-900,
.fi-panel-support .fi-main .dark\:bg-gray-800 {
background: var(--upango-glass) !important;
backdrop-filter: var(--upango-glass-blur) !important;
-webkit-backdrop-filter: var(--upango-glass-blur) !important;
border-color: var(--upango-glass-border) !important;
}
.fi-panel-support .fi-page .bg-gray-50,
.fi-panel-support .fi-page .dark\:bg-white\/5,
.fi-panel-support .fi-main .bg-gray-50,
.fi-panel-support .fi-main .dark\:bg-white\/5 {
background: var(--upango-glass-subtle) !important;
}
.fi-panel-support .fi-page .border-gray-200,
.fi-panel-support .fi-page .dark\:border-gray-700,
.fi-panel-support .fi-page .dark\:border-white\/10,
.fi-panel-support .fi-main .border-gray-200,
.fi-panel-support .fi-main .dark\:border-gray-700 {
border-color: var(--upango-glass-border) !important;
}
.dark .fi-panel-support .fi-page .text-gray-900,
.dark .fi-panel-support .fi-page .dark\:text-white,
.dark .fi-panel-support .fi-main .text-gray-900 {
color: #f1f5f9 !important;
-webkit-text-fill-color: #f1f5f9 !important;
}
.dark .fi-panel-support .fi-page .text-gray-500,
.dark .fi-panel-support .fi-page .text-gray-600,
.dark .fi-panel-support .fi-page .dark\:text-gray-400,
.dark .fi-panel-support .fi-main .text-gray-500 {
color: #94a3b8 !important;
-webkit-text-fill-color: #94a3b8 !important;
}
.dark .fi-panel-support .fi-page .hover\:bg-gray-50:hover,
.dark .fi-panel-support .fi-page .dark\:hover\:bg-white\/5:hover,
.dark .fi-panel-support .fi-main .hover\:bg-gray-50:hover {
background: var(--upango-glass-hover) !important;
}
.fi-panel-support .fi-page .shadow-sm,
.fi-panel-support .fi-main .shadow-sm {
box-shadow: var(--upango-glass-shadow) !important;
}
.fi-panel-support ::-webkit-scrollbar {
width: 6px;
height: 6px;
}
.fi-panel-support ::-webkit-scrollbar-track {
background: transparent;
}
.fi-panel-support ::-webkit-scrollbar-thumb {
background: rgba(167, 139, 250, 0.25);
border-radius: 999px;
}
.fi-panel-support ::-webkit-scrollbar-thumb:hover {
background: rgba(249, 115, 22, 0.4);
}
:not(.dark) body.fi-panel-support {
--upango-glass: rgba(255, 255, 255, 0.58);
--upango-glass-elevated: rgba(255, 255, 255, 0.82);
--upango-glass-subtle: rgba(255, 255, 255, 0.35);
--upango-glass-hover: rgba(255, 255, 255, 0.72);
--upango-glass-border: rgba(148, 163, 184, 0.28);
--upango-glass-border-hover: rgba(99, 102, 241, 0.35);
--upango-glass-shadow: 0 8px 32px -8px rgba(15, 23, 42, 0.1);
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat-value {
color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat-label,
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat-description {
color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-header-heading,
:not(.dark) body.fi-panel-support .fi-ta-header-heading,
:not(.dark) body.fi-panel-support .fi-section-header-heading,
:not(.dark) body.fi-panel-support .fi-wi-header-heading {
background: linear-gradient(135deg, #4c1d95, #f97316) !important;
background-clip: text !important;
-webkit-background-clip: text !important;
-webkit-text-fill-color: transparent !important;
}
:not(.dark) body.fi-panel-support .fi-topbar {
background: rgba(255, 255, 255, 0.72) !important;
}
.dark .fi-panel-support .fi-main,
.dark .fi-panel-support .fi-page,
.dark .fi-panel-support .fi-section-content,
.dark .fi-panel-support .fi-ta-text,
.dark .fi-panel-support .fi-infolist-entry-value,
.dark .fi-panel-support .fi-infolist-entry-label,
.dark .fi-panel-support .fi-header-subheading,
.dark .fi-panel-support .fi-section-header-description,
.dark .fi-panel-support .fi-ta-header-description,
.dark .fi-panel-support .fi-dropdown-list-item-label,
.dark .fi-panel-support .fi-fo-field-wrp-hint,
.dark .fi-panel-support .fi-fo-field-wrp-helper-text {
color: #cbd5e1 !important;
}
.dark .fi-panel-support .text-gray-950,
.dark .fi-panel-support .text-gray-900,
.dark .fi-panel-support .text-gray-800,
.dark .fi-panel-support .text-black,
.dark .fi-panel-support .fi-ta-cell,
.dark .fi-panel-support .fi-ta-col,
.dark .fi-panel-support .fi-ta-text-item,
.dark .fi-panel-support .fi-ta-summary,
.dark .fi-panel-support .fi-pagination-overview,
.dark .fi-panel-support .fi-breadcrumbs-item-label {
color: #e2e8f0 !important;
}
.dark .fi-panel-support .text-gray-600,
.dark .fi-panel-support .text-gray-500,
.dark .fi-panel-support .text-gray-400 {
color: #94a3b8 !important;
}
.dark .fi-panel-support .fi-topbar,
.dark .fi-panel-support .fi-topbar-end,
.dark .fi-panel-support .fi-global-search-field input {
color: #f1f5f9 !important;
}
.dark .fi-panel-support .fi-input-wrp input,
.dark .fi-panel-support .fi-input-wrp textarea,
.dark .fi-panel-support .fi-input-wrp select,
.dark .fi-panel-support .fi-input,
.dark .fi-panel-support input.fi-input,
.dark .fi-panel-support textarea.fi-input,
.dark .fi-panel-support select.fi-input,
.dark .fi-panel-support .fi-select-input,
.dark .fi-panel-support .fi-input-wrp .choices__inner,
.dark .fi-panel-support .fi-input-wrp .choices__list--single .choices__item,
.dark .fi-panel-support .fi-fo-rich-editor-content,
.dark .fi-panel-support .fi-fo-field-wrp input:not([type='checkbox']):not([type='radio']),
.dark .fi-panel-support .fi-fo-field-wrp textarea,
.dark .fi-panel-support .fi-fo-field-wrp select {
color: #f8fafc !important;
-webkit-text-fill-color: #f8fafc !important;
caret-color: #f97316 !important;
}
.dark .fi-panel-support .fi-input::placeholder,
.dark .fi-panel-support .fi-input-wrp input::placeholder,
.dark .fi-panel-support .fi-input-wrp textarea::placeholder,
.dark .fi-panel-support .fi-fo-field-wrp input::placeholder,
.dark .fi-panel-support .fi-fo-field-wrp textarea::placeholder {
color: #64748b !important;
-webkit-text-fill-color: #64748b !important;
opacity: 1 !important;
}
.dark .fi-panel-support .fi-fo-field-wrp-label,
.dark .fi-panel-support .fi-fo-field-wrp-label span {
color: #e2e8f0 !important;
}
:not(.dark) body.fi-panel-support .fi-main,
:not(.dark) body.fi-panel-support .fi-page,
:not(.dark) body.fi-panel-support .fi-section-content,
:not(.dark) body.fi-panel-support .fi-ta-text,
:not(.dark) body.fi-panel-support .fi-infolist-entry-value,
:not(.dark) body.fi-panel-support .fi-ta-cell,
:not(.dark) body.fi-panel-support .fi-ta-col,
:not(.dark) body.fi-panel-support .fi-ta-text-item,
:not(.dark) body.fi-panel-support .fi-dropdown-list-item-label,
:not(.dark) body.fi-panel-support .fi-topbar {
color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-header-subheading,
:not(.dark) body.fi-panel-support .fi-section-header-description,
:not(.dark) body.fi-panel-support .fi-ta-header-description,
:not(.dark) body.fi-panel-support .fi-fo-field-wrp-hint,
:not(.dark) body.fi-panel-support .fi-fo-field-wrp-helper-text,
:not(.dark) body.fi-panel-support .fi-infolist-entry-label,
:not(.dark) body.fi-panel-support .text-gray-500,
:not(.dark) body.fi-panel-support .text-gray-600 {
color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-input-wrp,
:not(.dark) body.fi-panel-support .fi-select-input,
:not(.dark) body.fi-panel-support .fi-textarea,
:not(.dark) body.fi-panel-support .fi-fo-rich-editor-toolbar {
background: rgba(255, 255, 255, 0.82) !important;
border-color: rgba(148, 163, 184, 0.35) !important;
color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-input-wrp input,
:not(.dark) body.fi-panel-support .fi-input-wrp textarea,
:not(.dark) body.fi-panel-support .fi-input-wrp select,
:not(.dark) body.fi-panel-support .fi-input,
:not(.dark) body.fi-panel-support input.fi-input,
:not(.dark) body.fi-panel-support textarea.fi-input,
:not(.dark) body.fi-panel-support select.fi-input,
:not(.dark) body.fi-panel-support .fi-select-input,
:not(.dark) body.fi-panel-support .fi-global-search-field input,
:not(.dark) body.fi-panel-support .fi-fo-field-wrp input:not([type='checkbox']):not([type='radio']),
:not(.dark) body.fi-panel-support .fi-fo-field-wrp textarea,
:not(.dark) body.fi-panel-support .fi-fo-field-wrp select {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
caret-color: #7c3aed !important;
}
:not(.dark) body.fi-panel-support .fi-input-wrp:focus-within {
border-color: rgba(124, 58, 237, 0.45) !important;
box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.12) !important;
background: rgba(255, 255, 255, 0.95) !important;
}
:not(.dark) body.fi-panel-support .fi-fo-field-wrp-label,
:not(.dark) body.fi-panel-support .fi-fo-field-wrp-label span {
color: #334155 !important;
}
:not(.dark) body.fi-panel-support .fi-ta-header-cell,
:not(.dark) body.fi-panel-support .fi-ta-table thead th {
background: rgba(255, 255, 255, 0.55) !important;
color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-ta-table tbody td {
color: #334155 !important;
border-color: rgba(148, 163, 184, 0.2) !important;
}
html:not(.dark) body.fi-panel-support .fi-tabs-item {
color: #64748b !important;
}
html:not(.dark) body.fi-panel-support .fi-tabs-item.fi-active,
html:not(.dark) body.fi-panel-support .fi-tabs-item[aria-selected='true'] {
background: rgba(249, 115, 22, 0.1) !important;
color: #c2410c !important;
}
html:not(.dark) body.fi-panel-support .fi-tabs-item:not(.fi-active):hover {
color: #334155 !important;
}
:not(.dark) body.fi-panel-support .fi-modal-window,
:not(.dark) body.fi-panel-support .fi-dropdown-panel,
:not(.dark) body.fi-panel-support .fi-select-panel,
:not(.dark) body.fi-panel-support .fi-tenant-menu,
:not(.dark) body.fi-panel-support .fi-notification {
color: #0f172a !important;
background: rgba(255, 255, 255, 0.98) !important;
}
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option span,
:not(.dark) body.fi-panel-support .fi-select-panel .fi-select-option {
color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item:hover {
color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-page .text-gray-900,
:not(.dark) body.fi-panel-support .fi-main .text-gray-900 {
color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-page .text-gray-500,
:not(.dark) body.fi-panel-support .fi-main .text-gray-500 {
color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-support-nav-flyout-backdrop {
background: rgba(15, 23, 42, 0.12) !important;
}
.fi-panel-support .upango-hub-quick-links {
display: flex;
flex-wrap: wrap;
gap: 0.75rem;
}
.fi-panel-support .upango-hub-quick-link {
display: inline-flex;
align-items: center;
gap: 0.75rem;
padding: 0.875rem 1.125rem;
border-radius: 0.875rem;
text-decoration: none;
font-size: 0.875rem;
font-weight: 600;
border: 1px solid var(--upango-glass-border);
background: var(--upango-glass);
backdrop-filter: var(--upango-glass-blur);
-webkit-backdrop-filter: var(--upango-glass-blur);
box-shadow: var(--upango-glass-shadow);
transition: border-color 0.2s ease, background 0.2s ease, transform 0.15s ease;
}
.fi-panel-support .finance-hub-http-actions {
position: relative;
z-index: 5;
pointer-events: auto;
}
.fi-panel-support .finance-hub-http-actions form {
display: inline;
margin: 0;
pointer-events: auto;
}
.fi-panel-support button.upango-hub-quick-link {
appearance: none;
-webkit-appearance: none;
cursor: pointer;
font: inherit;
line-height: inherit;
pointer-events: auto;
position: relative;
z-index: 5;
}
.fi-panel-support .upango-hub-quick-link__icon {
width: 1.375rem;
height: 1.375rem;
flex-shrink: 0;
color: #f97316;
}
.dark .fi-panel-support .upango-hub-quick-link__label,
.dark .fi-panel-support .upango-hub-quick-link {
color: #f1f5f9 !important;
}
:not(.dark) .fi-panel-support .upango-hub-quick-link__label,
:not(.dark) .fi-panel-support .upango-hub-quick-link {
color: #0f172a !important;
}
.fi-panel-support .upango-hub-quick-link--onedrive {
border-color: rgba(59, 130, 246, 0.28);
background: linear-gradient(135deg, rgba(239, 246, 255, 0.95), rgba(238, 242, 255, 0.92));
}
.fi-panel-support .upango-hub-quick-link--onedrive .upango-hub-quick-link__icon {
color: #2563eb;
}
.dark .fi-panel-support .upango-hub-quick-link--onedrive {
border-color: rgba(96, 165, 250, 0.28);
background: linear-gradient(135deg, rgba(37, 99, 235, 0.16), rgba(124, 58, 237, 0.12));
}
.dark .fi-panel-support .upango-hub-quick-link--onedrive,
.dark .fi-panel-support .upango-hub-quick-link--onedrive .upango-hub-quick-link__label {
color: #dbeafe !important;
}
.dark .fi-panel-support .upango-hub-quick-link--onedrive .upango-hub-quick-link__icon {
color: #93c5fd;
}
.fi-panel-support .upango-hub-period__label {
display: block;
margin-bottom: 0.35rem;
font-size: 0.875rem;
font-weight: 600;
}
.dark .fi-panel-support .upango-hub-period__label {
color: #cbd5e1 !important;
}
:not(.dark) .fi-panel-support .upango-hub-period__label {
color: #475569 !important;
}
.fi-panel-support .upango-hub-period__select {
display: block;
min-width: 10rem;
padding: 0.5rem 0.75rem;
border-radius: 0.625rem;
font-size: 0.875rem;
border: 1px solid var(--upango-glass-border);
background: var(--upango-glass);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
box-shadow: var(--upango-glass-shadow);
}
.dark .fi-panel-support .upango-hub-period__select {
color: #f8fafc !important;
background: rgba(0, 0, 0, 0.28) !important;
}
:not(.dark) .fi-panel-support .upango-hub-period__select {
color: #0f172a !important;
background: rgba(255, 255, 255, 0.82) !important;
}
.fi-panel-support .upango-hub-period__select:focus {
outline: none;
border-color: rgba(168, 85, 247, 0.45) !important;
box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.15) !important;
}
body.fi-panel-support .fi-page .fi-sc.fi-grid,
body.fi-panel-support .fi-page-content,
body.fi-panel-support .fi-fo-component-ctn,
body.fi-panel-support .fi-fo-select-wrp,
body.fi-panel-support .fi-select-input-ctn {
overflow: visible !important;
}
body.fi-panel-support .fi-fo-select-native select.fi-select-input option,
body.fi-panel-support select.fi-select-input option,
body.fi-panel-support .fi-main select option,
body.fi-panel-support .fi-page select option,
body.fi-panel-support .fi-simple-main select option {
color: #0f172a !important;
background-color: #ffffff !important;
-webkit-text-fill-color: #0f172a !important;
}
body.fi-panel-support .fi-fo-select-native select.fi-select-input optgroup,
body.fi-panel-support select.fi-select-input optgroup,
body.fi-panel-support .fi-main select optgroup,
body.fi-panel-support .fi-page select optgroup {
color: #334155 !important;
background-color: #f8fafc !important;
font-weight: 600 !important;
}
body.fi-panel-support .fi-fo-select-native select.fi-select-input option:checked,
body.fi-panel-support select.fi-select-input option:checked,
body.fi-panel-support .fi-fo-select-native select.fi-select-input option:hover,
body.fi-panel-support select.fi-select-input option:hover,
body.fi-panel-support .fi-main select option:checked,
body.fi-panel-support .fi-page select option:checked,
body.fi-panel-support .fi-main select option:hover,
body.fi-panel-support .fi-page select option:hover {
color: #0f172a !important;
background-color: #e0e7ff !important;
-webkit-text-fill-color: #0f172a !important;
}
body.fi-panel-support .fi-main select,
body.fi-panel-support .fi-page select,
body.fi-panel-support .fi-simple-main select {
color-scheme: light;
}
:not(.dark) body.fi-panel-support .fi-dropdown-panel.fi-scrollable,
:not(.dark) body.fi-panel-support .fi-dropdown-panel:has(.fi-select-input-option),
:not(.dark) body.fi-panel-support .fi-select-panel,
:not(.dark) body.fi-panel-support .choices__list--dropdown.is-active {
z-index: 99999 !important;
background: rgba(255, 255, 255, 0.98) !important;
border: 1px solid rgba(148, 163, 184, 0.35) !important;
color: #0f172a !important;
box-shadow: 0 24px 48px -12px rgba(15, 23, 42, 0.35) !important;
}
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option span,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-header,
:not(.dark) body.fi-panel-support .fi-select-panel .fi-select-option,
:not(.dark) body.fi-panel-support .choices__list--dropdown .choices__item,
:not(.dark) body.fi-panel-support .choices__list--dropdown .choices__item--selectable {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item:hover,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item.fi-selected,
:not(.dark) body.fi-panel-support .fi-select-panel .fi-select-option:hover,
:not(.dark) body.fi-panel-support .fi-select-panel .fi-select-option.fi-selected,
:not(.dark) body.fi-panel-support .choices__list--dropdown .choices__item--selectable.is-highlighted {
background: rgba(249, 115, 22, 0.14) !important;
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover span,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected span,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected .fi-dropdown-list-item-label {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-dropdown-panel .text-gray-950,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .text-gray-900,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .text-gray-800,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .text-gray-700,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .text-gray-600,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .text-gray-500,
:not(.dark) body.fi-panel-support .fi-dropdown-panel .text-gray-400,
:not(.dark) body.fi-panel-support .fi-select-panel .text-gray-950,
:not(.dark) body.fi-panel-support .fi-select-panel .text-gray-900,
:not(.dark) body.fi-panel-support .fi-select-panel .text-gray-800,
:not(.dark) body.fi-panel-support .fi-select-panel .text-gray-700,
:not(.dark) body.fi-panel-support .fi-select-panel .text-gray-600,
:not(.dark) body.fi-panel-support .fi-select-panel .text-gray-500,
:not(.dark) body.fi-panel-support .fi-select-panel .text-gray-400 {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-dropdown-panel.fi-scrollable,
.dark body.fi-panel-support .fi-dropdown-panel:has(.fi-select-input-option),
.dark body.fi-panel-support .fi-select-panel,
.dark body.fi-panel-support .choices__list--dropdown.is-active {
z-index: 99999 !important;
background: rgba(30, 22, 56, 0.98) !important;
border: 1px solid rgba(148, 163, 184, 0.25) !important;
color: #f1f5f9 !important;
box-shadow: 0 24px 48px -12px rgba(0, 0, 0, 0.65) !important;
}
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option,
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option span,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-header,
.dark body.fi-panel-support .fi-select-panel .fi-select-option,
.dark body.fi-panel-support .choices__list--dropdown .choices__item,
.dark body.fi-panel-support .choices__list--dropdown .choices__item--selectable,
.dark body.fi-panel-support .fi-dropdown-panel .text-white,
.dark body.fi-panel-support .fi-select-panel .text-white {
color: #e2e8f0 !important;
-webkit-text-fill-color: #e2e8f0 !important;
}
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover,
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item:hover,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item.fi-selected,
.dark body.fi-panel-support .fi-select-panel .fi-select-option:hover,
.dark body.fi-panel-support .fi-select-panel .fi-select-option.fi-selected,
.dark body.fi-panel-support .choices__list--dropdown .choices__item--selectable.is-highlighted {
background: rgba(249, 115, 22, 0.18) !important;
color: #f8fafc !important;
-webkit-text-fill-color: #f8fafc !important;
}
body.fi-panel-support .fi-sc-actions.fi-sticky .fi-ac {
z-index: 30 !important;
}
body.fi-panel-support .fi-dropdown-panel,
body.fi-panel-support .fi-select-panel,
body.fi-panel-support .choices__list--dropdown.is-active {
z-index: 200000 !important;
}
.fi-panel-support .fi-dropdown-panel.fi-scrollable:has(.upango-menu-heading)::-webkit-scrollbar {
width: 10px;
}
.fi-panel-support .fi-dropdown-panel.fi-scrollable:has(.upango-menu-heading)::-webkit-scrollbar-thumb {
background: rgba(148, 163, 184, 0.85);
border-radius: 999px;
border: 2px solid transparent;
background-clip: padding-box;
}
:not(.dark) body.fi-panel-support .fi-page .text-gray-900,
:not(.dark) body.fi-panel-support .fi-page .text-gray-950,
:not(.dark) body.fi-panel-support .fi-page .dark\:text-white,
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table .font-medium,
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table th,
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table td,
:not(.dark) body.fi-panel-support .fi-page .rmm-hub-overview-card__title,
:not(.dark) body.fi-panel-support .fi-page .org-hub-card__title,
:not(.dark) body.fi-panel-support .fi-page .rmm-hub-breadcrumb__current,
:not(.dark) body.fi-panel-support .fi-page .fi-fo-field-wrp-label,
:not(.dark) body.fi-panel-support .fi-page .fi-fo-field-wrp-label span,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-browser"] .text-gray-950,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-browser"] .dark\:text-white,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .text-gray-950,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .dark\:text-white {
color: #1e293b !important;
-webkit-text-fill-color: #1e293b !important;
}
:not(.dark) body.fi-panel-support .fi-page .text-gray-600,
:not(.dark) body.fi-panel-support .fi-page .dark\:text-gray-300,
:not(.dark) body.fi-panel-support .fi-page .text-gray-700,
:not(.dark) body.fi-panel-support .fi-page .rmm-hub-overview-card__description,
:not(.dark) body.fi-panel-support .fi-page .org-hub-card__description,
:not(.dark) body.fi-panel-support .fi-page .fi-section-header-description {
color: #475569 !important;
-webkit-text-fill-color: #475569 !important;
}
:not(.dark) body.fi-panel-support .fi-page .text-gray-500,
:not(.dark) body.fi-panel-support .fi-page .dark\:text-gray-400 {
color: #64748b !important;
-webkit-text-fill-color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table thead th {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
background: #f1f5f9 !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table thead th.sticky {
background: #f1f5f9 !important;
}
:not(.dark) body.fi-panel-support .fi-page .bg-white .text-gray-900,
:not(.dark) body.fi-panel-support .fi-page .bg-white .text-gray-950,
:not(.dark) body.fi-panel-support .fi-page .bg-white .dark\:text-white,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-browser"] .text-gray-950,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-browser"] .dark\:text-white,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .text-gray-950,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .dark\:text-white {
color: #1e293b !important;
-webkit-text-fill-color: #1e293b !important;
}
:not(.dark) body.fi-panel-support .fi-page .bg-white .text-gray-700,
:not(.dark) body.fi-panel-support .fi-page .bg-white .dark\:text-gray-300,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-browser"] .text-gray-700,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-browser"] .dark\:text-gray-300,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .text-gray-700,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .dark\:text-gray-300 {
color: #334155 !important;
-webkit-text-fill-color: #334155 !important;
}
:not(.dark) body.fi-panel-support .fi-page .bg-white .text-gray-500,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-browser"] .text-gray-500,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .text-gray-500 {
color: #64748b !important;
-webkit-text-fill-color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-page .bg-white .hover\:bg-gray-100:hover,
:not(.dark) body.fi-panel-support .fi-page .bg-white .hover\:bg-gray-50:hover,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .hover\:bg-gray-50:hover {
background: rgba(241, 245, 249, 0.95) !important;
}
:not(.dark) body.fi-panel-support .fi-page .bg-white .bg-primary-50,
:not(.dark) body.fi-panel-support .fi-page [wire\:key^="file-list"] .bg-primary-50 {
background: rgba(239, 246, 255, 0.95) !important;
}
:not(.dark) body.fi-panel-support .fi-page .bg-white .bg-gray-50\/50 {
background: rgba(248, 250, 252, 0.85) !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table tbody td.sticky {
background: #ffffff !important;
color: #1e293b !important;
-webkit-text-fill-color: #1e293b !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table tbody tr {
background: #ffffff !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table button {
color: inherit !important;
-webkit-text-fill-color: inherit !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table .text-sky-800 {
color: #075985 !important;
-webkit-text-fill-color: #075985 !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table .text-emerald-800 {
color: #065f46 !important;
-webkit-text-fill-color: #065f46 !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table .text-gray-500 {
color: #64748b !important;
-webkit-text-fill-color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-page .access-matrix-table code {
color: #334155 !important;
-webkit-text-fill-color: #334155 !important;
}
:not(.dark) body.fi-panel-support {
--pastel-page: #f3f4f8;
--pastel-card: #ffffff;
--pastel-border: rgba(148, 163, 184, 0.22);
--pastel-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 8px 24px -12px rgba(15, 23, 42, 0.08);
--pastel-purple: #7c3aed;
--pastel-purple-soft: #ede9fe;
--pastel-purple-muted: #a78bfa;
--pastel-text: #1e293b;
--pastel-text-muted: #94a3b8;
--pastel-lavender: #ede9fe;
--pastel-mint: #d1fae5;
--pastel-amber: #fef3c7;
--pastel-rose: #ffe4e6;
}
:not(.dark) .fi-panel-support .upango-support-bg {
background:
radial-gradient(circle at 8% 12%, rgba(237, 233, 254, 0.9) 0%, transparent 38%),
radial-gradient(circle at 92% 88%, rgba(254, 243, 199, 0.55) 0%, transparent 34%),
linear-gradient(180deg, #f8f9fc 0%, var(--pastel-page) 100%) !important;
}
:not(.dark) body.fi-panel-support {
--upango-glass: #ffffff;
--upango-glass-elevated: #ffffff;
--upango-glass-subtle: #ffffff;
--upango-glass-hover: #f8fafc;
--upango-glass-border: var(--pastel-border);
--upango-glass-border-hover: rgba(124, 58, 237, 0.28);
--upango-glass-shadow: var(--pastel-shadow);
--upango-glass-blur: none;
}
:not(.dark) body.fi-panel-support .fi-section,
:not(.dark) body.fi-panel-support .fi-section-content-ctn,
:not(.dark) body.fi-panel-support .fi-card,
:not(.dark) body.fi-panel-support .fi-ta-ctn,
:not(.dark) body.fi-panel-support .fi-ta-content,
:not(.dark) body.fi-panel-support .fi-ta-container,
:not(.dark) body.fi-panel-support .fi-infolist,
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat,
:not(.dark) body.fi-panel-support .fi-wi-chart,
:not(.dark) body.fi-panel-support .fi-wi-table,
:not(.dark) body.fi-panel-support .fi-wi-widget .fi-section,
:not(.dark) body.fi-panel-support .fi-pagination,
:not(.dark) body.fi-panel-support .fi-tabs,
:not(.dark) body.fi-panel-support .fi-empty-state {
background: var(--pastel-card) !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
border: 1px solid var(--pastel-border) !important;
border-radius: 1rem !important;
box-shadow: var(--pastel-shadow) !important;
}
:not(.dark) body.fi-panel-support .fi-header-heading,
:not(.dark) body.fi-panel-support .fi-ta-header-heading,
:not(.dark) body.fi-panel-support .fi-section-header-heading,
:not(.dark) body.fi-panel-support .fi-wi-header-heading {
background: none !important;
background-clip: border-box !important;
-webkit-background-clip: border-box !important;
-webkit-text-fill-color: var(--pastel-text) !important;
color: var(--pastel-text) !important;
font-weight: 700 !important;
}
:not(.dark) body.fi-panel-support .fi-section-header-description,
:not(.dark) body.fi-panel-support .fi-header-subheading {
color: var(--pastel-text-muted) !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat {
border: none !important;
border-radius: 1rem !important;
padding: 1rem 1.1rem !important;
box-shadow: none !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat:nth-child(4n + 1) {
background: var(--pastel-lavender) !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat:nth-child(4n + 2) {
background: var(--pastel-amber) !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat:nth-child(4n + 3) {
background: var(--pastel-mint) !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat:nth-child(4n + 4) {
background: var(--pastel-rose) !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat-value {
color: var(--pastel-text) !important;
font-weight: 700 !important;
}
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat-label,
:not(.dark) body.fi-panel-support .fi-wi-stats-overview-stat-description {
color: #64748b !important;
}
:not(.dark) body.fi-panel-support .fi-ta-ctn,
:not(.dark) body.fi-panel-support .fi-wi-table .fi-section {
overflow: hidden;
}
:not(.dark) body.fi-panel-support .fi-ta-content,
:not(.dark) body.fi-panel-support .fi-ta-content:not(.fi-ta-content-grid) {
background: transparent !important;
border: none !important;
box-shadow: none !important;
border-radius: 0 !important;
}
:not(.dark) body.fi-panel-support .fi-ta-table,
:not(.dark) body.fi-panel-support .fi-ta-table table {
border-collapse: separate !important;
border-spacing: 0 !important;
}
:not(.dark) body.fi-panel-support .fi-ta-header-cell,
:not(.dark) body.fi-panel-support .fi-ta-table thead th {
background: transparent !important;
border: none !important;
border-bottom: none !important;
color: var(--pastel-text-muted) !important;
font-size: 0.75rem !important;
font-weight: 500 !important;
letter-spacing: 0.01em !important;
text-transform: none !important;
padding: 0.28rem 0.55rem !important;
}
:not(.dark) body.fi-panel-support .fi-ta-cell,
:not(.dark) body.fi-panel-support .fi-ta-table tbody td {
background: transparent !important;
border: none !important;
color: var(--pastel-text) !important;
padding: 0.28rem 0.55rem !important;
font-size: 0.875rem !important;
}
:not(.dark) body.fi-panel-support .fi-ta-row,
:not(.dark) body.fi-panel-support .fi-ta-record {
border: none !important;
border-radius: 0.5rem !important;
}
:not(.dark) body.fi-panel-support .fi-ta-row:hover,
:not(.dark) body.fi-panel-support .fi-ta-record.fi-clickable:hover,
:not(.dark) body.fi-panel-support .fi-ta-table tbody tr:hover td {
background: rgba(237, 233, 254, 0.45) !important;
}
:not(.dark) body.fi-panel-support .fi-ta-text,
:not(.dark) body.fi-panel-support .fi-ta-text-item,
:not(.dark) body.fi-panel-support .fi-ta-col {
color: var(--pastel-text) !important;
}
:not(.dark) body.fi-panel-support .fi-ta-header-cell-label {
color: var(--pastel-text-muted) !important;
}
:not(.dark) body.fi-panel-support .fi-breadcrumbs-item-label,
:not(.dark) body.fi-panel-support .fi-link,
:not(.dark) body.fi-panel-support a.fi-link {
color: var(--pastel-purple) !important;
}
:not(.dark) .fi-panel-support .fi-support-nav-flyout-link.fi-active,
:not(.dark) .fi-panel-support .fi-support-nav-flyout-link:hover {
background: var(--pastel-purple-soft) !important;
color: var(--pastel-purple) !important;
}
:not(.dark) .fi-panel-support .fi-support-nav-group-btn.fi-active,
:not(.dark) .fi-panel-support .fi-support-nav-group-btn.fi-current {
color: var(--pastel-purple) !important;
box-shadow: inset 3px 0 0 var(--pastel-purple) !important;
}
:not(.dark) body.fi-panel-support .fi-tabs {
background: #f1f5f9 !important;
border: 1px solid var(--pastel-border) !important;
padding: 0.25rem !important;
}
html:not(.dark) body.fi-panel-support .fi-tabs-item.fi-active,
html:not(.dark) body.fi-panel-support .fi-tabs-item[aria-selected='true'] {
background: var(--pastel-purple-soft) !important;
color: var(--pastel-purple) !important;
}
html:not(.dark) body.fi-panel-support .fi-tabs-item:not(.fi-active):hover {
background: rgba(237, 233, 254, 0.5) !important;
color: #475569 !important;
}
:not(.dark) .fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined),
:not(.dark) .fi-panel-support .fi-btn-primary {
background: var(--pastel-purple-soft) !important;
color: var(--pastel-purple) !important;
box-shadow: none !important;
border: 1px solid rgba(124, 58, 237, 0.15) !important;
}
:not(.dark) .fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined) .fi-btn-label,
:not(.dark) .fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined) > .fi-icon {
color: var(--pastel-purple) !important;
-webkit-text-fill-color: var(--pastel-purple) !important;
}
:not(.dark) .fi-panel-support .fi-btn.fi-color-primary:not(.fi-outlined):hover {
background: #ddd6fe !important;
box-shadow: none !important;
}
:not(.dark) body.fi-panel-support .fi-topbar {
background: rgba(255, 255, 255, 0.92) !important;
border-bottom-color: var(--pastel-border) !important;
box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}
:not(.dark) .fi-panel-support .fi-sidebar.fi-main-sidebar {
background: #ffffff !important;
border-right-color: var(--pastel-border) !important;
box-shadow: none !important;
}
:not(.dark) .module-dashboard-panel,
:not(.dark) .module-dashboard__tables .fi-wi-widget,
:not(.dark) .module-dashboard-quick-access,
:not(.dark) .project-dashboard-panel,
:not(.dark) .project-dashboard__insights .fi-section,
:not(.dark) .project-dashboard-quick-access {
background: var(--pastel-card) !important;
border: 1px solid var(--pastel-border) !important;
box-shadow: var(--pastel-shadow) !important;
backdrop-filter: none !important;
}
:not(.dark) .module-dashboard-panel__title,
:not(.dark) .project-dashboard-panel__title,
:not(.dark) .module-dashboard-quick-access__label,
:not(.dark) .project-dashboard-quick-access__label,
:not(.dark) .project-snapshot__title,
:not(.dark) .project-activity-feed__title {
color: var(--pastel-text) !important;
}
:not(.dark) .module-dashboard-panel__hint,
:not(.dark) .project-dashboard-panel__hint,
:not(.dark) .project-snapshot__meta,
:not(.dark) .project-snapshot__epic-meta,
:not(.dark) .project-activity-feed__meta {
color: var(--pastel-text-muted) !important;
}
:not(.dark) .module-dashboard__kpis .fi-wi-stats-overview-stat,
:not(.dark) .module-dashboard__status .fi-wi-stats-overview-stat,
:not(.dark) .project-dashboard__kpis .fi-wi-stats-overview-stat {
border: none !important;
box-shadow: none !important;
}
:not(.dark) .module-dashboard__kpis .fi-wi-stats-overview-stat:nth-child(4n + 1),
:not(.dark) .project-dashboard__kpis .fi-wi-stats-overview-stats-ctn > .fi-wi-stats-overview-stat:nth-child(4n + 1) {
background: var(--pastel-lavender) !important;
}
:not(.dark) .module-dashboard__kpis .fi-wi-stats-overview-stat:nth-child(4n + 2),
:not(.dark) .project-dashboard__kpis .fi-wi-stats-overview-stats-ctn > .fi-wi-stats-overview-stat:nth-child(4n + 2) {
background: var(--pastel-amber) !important;
}
:not(.dark) .module-dashboard__kpis .fi-wi-stats-overview-stat:nth-child(4n + 3),
:not(.dark) .project-dashboard__kpis .fi-wi-stats-overview-stats-ctn > .fi-wi-stats-overview-stat:nth-child(4n + 3) {
background: var(--pastel-mint) !important;
}
:not(.dark) .module-dashboard__kpis .fi-wi-stats-overview-stat:nth-child(4n + 4),
:not(.dark) .project-dashboard__kpis .fi-wi-stats-overview-stats-ctn > .fi-wi-stats-overview-stat:nth-child(4n + 4) {
background: var(--pastel-rose) !important;
}
:not(.dark) .module-dashboard .fi-ta-header-cell,
:not(.dark) .module-dashboard .fi-ta-cell,
:not(.dark) .project-dashboard .fi-ta-header-cell,
:not(.dark) .project-dashboard .fi-ta-cell {
color: var(--pastel-text) !important;
border: none !important;
background: transparent !important;
}
:not(.dark) .module-dashboard .fi-ta-header-cell-label,
:not(.dark) .project-dashboard .fi-ta-header-cell-label {
color: var(--pastel-text-muted) !important;
}
:not(.dark) .module-dashboard__tab--active,
:not(.dark) .project-dashboard__tab--active {
background: var(--pastel-purple-soft) !important;
color: var(--pastel-purple) !important;
}
:not(.dark) .module-dashboard__tabs,
:not(.dark) .project-dashboard__tabs {
background: #f1f5f9 !important;
border-color: var(--pastel-border) !important;
}
:not(.dark) .module-dashboard-action,
:not(.dark) .project-dashboard-action {
background: var(--pastel-purple-soft) !important;
color: var(--pastel-purple) !important;
border-color: rgba(124, 58, 237, 0.18) !important;
}
:not(.dark) .project-snapshot__epic-link:hover {
background: rgba(237, 233, 254, 0.65) !important;
}
:not(.dark) .project-snapshot__epic-name {
color: var(--pastel-text) !important;
}
:not(.dark) .module-dashboard-compact-table .fi-ta-row:hover,
:not(.dark) .project-dashboard__insights .fi-ta-row:hover {
background: rgba(237, 233, 254, 0.45) !important;
}
:not(.dark) .fi-panel-support .upango-hub-quick-link {
background: var(--pastel-purple-soft) !important;
color: var(--pastel-purple) !important;
border-color: rgba(124, 58, 237, 0.15) !important;
}
:not(.dark) .fi-panel-support .upango-hub-quick-link__icon {
color: var(--pastel-purple) !important;
}
.dark body.fi-panel-support {
--upango-glass: rgba(24, 18, 42, 0.94);
--upango-glass-elevated: rgba(32, 24, 56, 0.98);
--upango-glass-subtle: rgba(255, 255, 255, 0.07);
--upango-glass-hover: rgba(255, 255, 255, 0.11);
--upango-glass-border: rgba(167, 139, 250, 0.24);
--upango-glass-border-hover: rgba(167, 139, 250, 0.4);
--upango-glass-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.6);
--upango-text: #ffffff;
--upango-text-muted: #e2e8f0;
--upango-text-subtle: #cbd5e1;
}
.dark body.fi-panel-support,
.dark body.fi-panel-support .fi-layout,
.dark body.fi-panel-support .fi-main,
.dark body.fi-panel-support .fi-page,
.dark body.fi-panel-support .fi-content,
.dark body.fi-panel-support .fi-section-content {
color: var(--upango-text) !important;
}
.dark body.fi-panel-support .fi-header-heading,
.dark body.fi-panel-support .fi-ta-header-heading,
.dark body.fi-panel-support .fi-section-header-heading,
.dark body.fi-panel-support .fi-wi-header-heading,
.dark body.fi-panel-support .fi-modal-heading,
.dark body.fi-panel-support .fi-empty-state-heading,
.dark body.fi-panel-support .fi-main h1,
.dark body.fi-panel-support .fi-main h2,
.dark body.fi-panel-support .fi-main h3,
.dark body.fi-panel-support .fi-main h4,
.dark body.fi-panel-support .fi-page h1,
.dark body.fi-panel-support .fi-page h2,
.dark body.fi-panel-support .fi-page h3,
.dark body.fi-panel-support .fi-page h4 {
background: none !important;
background-clip: unset !important;
-webkit-background-clip: unset !important;
-webkit-text-fill-color: #ffffff !important;
color: #ffffff !important;
}
.dark body.fi-panel-support .fi-header-subheading,
.dark body.fi-panel-support .fi-section-header-description,
.dark body.fi-panel-support .fi-ta-header-description,
.dark body.fi-panel-support .fi-modal-description,
.dark body.fi-panel-support .fi-empty-state-description {
color: var(--upango-text-muted) !important;
-webkit-text-fill-color: var(--upango-text-muted) !important;
}
.dark body.fi-panel-support .fi-main .text-gray-950,
.dark body.fi-panel-support .fi-main .text-gray-900,
.dark body.fi-panel-support .fi-main .text-gray-800,
.dark body.fi-panel-support .fi-main .text-gray-700,
.dark body.fi-panel-support .fi-page .text-gray-950,
.dark body.fi-panel-support .fi-page .text-gray-900,
.dark body.fi-panel-support .fi-page .text-gray-800,
.dark body.fi-panel-support .fi-page .text-gray-700,
.dark body.fi-panel-support .fi-main .text-slate-900,
.dark body.fi-panel-support .fi-main .text-slate-800,
.dark body.fi-panel-support .fi-main .text-slate-700,
.dark body.fi-panel-support .fi-page .text-slate-900,
.dark body.fi-panel-support .fi-page .text-slate-800,
.dark body.fi-panel-support .fi-page .text-slate-700,
.dark body.fi-panel-support .fi-main .text-black,
.dark body.fi-panel-support .fi-page .text-black {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark body.fi-panel-support .fi-main .text-gray-600,
.dark body.fi-panel-support .fi-main .text-gray-500,
.dark body.fi-panel-support .fi-page .text-gray-600,
.dark body.fi-panel-support .fi-page .text-gray-500,
.dark body.fi-panel-support .fi-main .text-slate-600,
.dark body.fi-panel-support .fi-main .text-slate-500,
.dark body.fi-panel-support .fi-page .text-slate-600,
.dark body.fi-panel-support .fi-page .text-slate-500 {
color: var(--upango-text-muted) !important;
-webkit-text-fill-color: var(--upango-text-muted) !important;
}
.dark body.fi-panel-support .fi-main .text-gray-400,
.dark body.fi-panel-support .fi-page .text-gray-400,
.dark body.fi-panel-support .fi-main .text-slate-400,
.dark body.fi-panel-support .fi-page .text-slate-400 {
color: var(--upango-text-subtle) !important;
-webkit-text-fill-color: var(--upango-text-subtle) !important;
}
.dark body.fi-panel-support .fi-main a.text-primary-600,
.dark body.fi-panel-support .fi-page a.text-primary-600,
.dark body.fi-panel-support .fi-main .text-primary-600,
.dark body.fi-panel-support .fi-page .text-primary-600 {
color: #fdba74 !important;
-webkit-text-fill-color: #fdba74 !important;
}
.dark body.fi-panel-support .fi-ta-text,
.dark body.fi-panel-support .fi-ta-text-item,
.dark body.fi-panel-support .fi-ta-text-item-label,
.dark body.fi-panel-support .fi-ta-col,
.dark body.fi-panel-support .fi-ta-cell,
.dark body.fi-panel-support .fi-ta-summary,
.dark body.fi-panel-support .fi-ta-group-heading,
.dark body.fi-panel-support .fi-ta-placeholder,
.dark body.fi-panel-support .fi-infolist-entry-value,
.dark body.fi-panel-support .fi-key-value,
.dark body.fi-panel-support .fi-wi-stats-overview-stat-value,
.dark body.fi-panel-support .text-gray-950,
.dark body.fi-panel-support .text-gray-900,
.dark body.fi-panel-support .text-gray-800,
.dark body.fi-panel-support .text-gray-700,
.dark body.fi-panel-support .text-black,
.dark body.fi-panel-support .fi-ta-cell,
.dark body.fi-panel-support .fi-ta-col,
.dark body.fi-panel-support .fi-ta-text-item,
.dark body.fi-panel-support .fi-ta-summary,
.dark body.fi-panel-support .fi-pagination-overview,
.dark body.fi-panel-support .fi-breadcrumbs-item-label {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark body.fi-panel-support .fi-infolist-entry-label,
.dark body.fi-panel-support .fi-ta-header-cell,
.dark body.fi-panel-support .fi-ta-header-cell-label,
.dark body.fi-panel-support .fi-ta-table thead th,
.dark body.fi-panel-support .fi-wi-stats-overview-stat-label,
.dark body.fi-panel-support .fi-wi-stats-overview-stat-description,
.dark body.fi-panel-support .fi-pagination-overview,
.dark body.fi-panel-support .fi-fo-field-wrp-hint,
.dark body.fi-panel-support .fi-fo-field-wrp-helper-text,
.dark body.fi-panel-support .text-gray-600,
.dark body.fi-panel-support .text-gray-500,
.dark body.fi-panel-support .text-gray-400 {
color: var(--upango-text-muted) !important;
-webkit-text-fill-color: var(--upango-text-muted) !important;
}
.dark body.fi-panel-support .fi-ta-table tbody td {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
border-color: rgba(255, 255, 255, 0.1) !important;
}
.dark body.fi-panel-support .fi-btn:not(.fi-color):not(.fi-outlined),
.dark body.fi-panel-support .fi-btn:not(.fi-color):not(.fi-outlined) .fi-btn-label,
.dark body.fi-panel-support .fi-btn:not(.fi-color):not(.fi-outlined) > .fi-icon {
color: #f1f5f9 !important;
-webkit-text-fill-color: #f1f5f9 !important;
}
.dark body.fi-panel-support .fi-main .bg-white\/80,
.dark body.fi-panel-support .fi-main .bg-white\/90,
.dark body.fi-panel-support .fi-page .bg-white\/80,
.dark body.fi-panel-support .fi-page .bg-white\/90 {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-main .bg-white\/80 .text-gray-500,
.dark body.fi-panel-support .fi-main .bg-white\/80 .text-gray-600,
.dark body.fi-panel-support .fi-main .bg-white\/90 .text-gray-500,
.dark body.fi-panel-support .fi-main .bg-white\/90 .text-gray-600,
.dark body.fi-panel-support .fi-page .bg-white\/80 .text-gray-500,
.dark body.fi-panel-support .fi-page .bg-white\/80 .text-gray-600,
.dark body.fi-panel-support .fi-page .bg-white\/90 .text-gray-500,
.dark body.fi-panel-support .fi-page .bg-white\/90 .text-gray-600 {
color: #475569 !important;
-webkit-text-fill-color: #475569 !important;
}
.dark body.fi-panel-support .fi-main .bg-white\/80 .fi-btn,
.dark body.fi-panel-support .fi-main .bg-white\/90 .fi-btn,
.dark body.fi-panel-support .fi-page .bg-white\/80 .fi-btn,
.dark body.fi-panel-support .fi-page .bg-white\/90 .fi-btn,
.dark body.fi-panel-support .fi-main .bg-white\/80 .fi-btn .fi-btn-label,
.dark body.fi-panel-support .fi-main .bg-white\/90 .fi-btn .fi-btn-label,
.dark body.fi-panel-support .fi-page .bg-white\/80 .fi-btn .fi-btn-label,
.dark body.fi-panel-support .fi-page .bg-white\/90 .fi-btn .fi-btn-label,
.dark body.fi-panel-support .fi-main .bg-white\/80 .fi-link,
.dark body.fi-panel-support .fi-main .bg-white\/90 .fi-link,
.dark body.fi-panel-support .fi-page .bg-white\/80 .fi-link,
.dark body.fi-panel-support .fi-page .bg-white\/90 .fi-link {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-badge:not(.fi-color) {
color: #ffffff !important;
background: rgba(255, 255, 255, 0.1) !important;
border-color: rgba(255, 255, 255, 0.16) !important;
}
.dark body.fi-panel-support .fi-topbar,
.dark body.fi-panel-support .fi-topbar-item-label,
.dark body.fi-panel-support .fi-topbar-item-btn,
.dark body.fi-panel-support .fi-user-menu-trigger,
.dark body.fi-panel-support .fi-support-topbar-tenant-btn,
.dark body.fi-panel-support .fi-support-topbar-tenant-link,
.dark body.fi-panel-support .fi-global-search-field input {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark body.fi-panel-support .fi-topbar .fi-icon {
color: #e2e8f0 !important;
}
.dark body.fi-panel-support .fi-fo-field-wrp-label,
.dark body.fi-panel-support .fi-fo-field-wrp-label span,
.dark body.fi-panel-support .fi-checkbox-label,
.dark body.fi-panel-support .fi-radio-label,
.dark body.fi-panel-support .fi-toggle-label {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark body.fi-panel-support select option,
.dark body.fi-panel-support select optgroup {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
background-color: #ffffff !important;
}
.dark body.fi-panel-support .fi-input-wrp input,
.dark body.fi-panel-support .fi-input-wrp textarea,
.dark body.fi-panel-support .fi-input-wrp select,
.dark body.fi-panel-support .fi-input,
.dark body.fi-panel-support input.fi-input,
.dark body.fi-panel-support textarea.fi-input,
.dark body.fi-panel-support select.fi-input,
.dark body.fi-panel-support .fi-select-input,
.dark body.fi-panel-support .fi-fo-field-wrp input:not([type='checkbox']):not([type='radio']),
.dark body.fi-panel-support .fi-fo-field-wrp textarea,
.dark body.fi-panel-support .fi-fo-field-wrp select {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
caret-color: #f97316 !important;
}
.dark body.fi-panel-support .fi-input-wrp,
.dark body.fi-panel-support .fi-select-input,
.dark body.fi-panel-support .fi-textarea,
.dark body.fi-panel-support .fi-fo-rich-editor-toolbar {
background: rgba(0, 0, 0, 0.38) !important;
border-color: rgba(167, 139, 250, 0.28) !important;
}
.dark body.fi-panel-support .fi-input::placeholder,
.dark body.fi-panel-support .fi-input-wrp input::placeholder,
.dark body.fi-panel-support .fi-input-wrp textarea::placeholder {
color: #cbd5e1 !important;
-webkit-text-fill-color: #cbd5e1 !important;
opacity: 1 !important;
}
.dark body.fi-panel-support .fi-tabs-item {
color: var(--upango-text-muted) !important;
}
.dark body.fi-panel-support .fi-tabs-item.fi-active,
.dark body.fi-panel-support .fi-tabs-item[aria-selected='true'] {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
background: #ffedd5 !important;
}
.dark body.fi-panel-support .fi-tabs-item.fi-active .fi-tabs-item-label,
.dark body.fi-panel-support .fi-tabs-item[aria-selected='true'] .fi-tabs-item-label {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-tabs-item:not(.fi-active):hover {
color: #ffffff !important;
}
.dark body.fi-panel-support .fi-page-sub-navigation-sidebar .fi-sidebar-item-btn,
.dark body.fi-panel-support .fi-page-sub-navigation-tabs .fi-tabs-item {
color: #ffffff !important;
}
.dark body.fi-panel-support .fi-resource-relation-manager .fi-ta-header-heading,
.dark body.fi-panel-support .fi-resource-relation-manager .fi-section-header-heading,
.dark body.fi-panel-support .fi-modal-window,
.dark body.fi-panel-support .fi-notification {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark body.fi-panel-support .fi-page .bg-primary-50,
.dark body.fi-panel-support .fi-page .bg-blue-50,
.dark body.fi-panel-support .fi-page .bg-amber-50,
.dark body.fi-panel-support .fi-page .bg-green-50,
.dark body.fi-panel-support .fi-page .bg-white:not(select):not(input):not(textarea):not(option),
.dark body.fi-panel-support .fi-page .dark\:bg-gray-900:not(select):not(input):not(textarea),
.dark body.fi-panel-support .fi-page .dark\:bg-gray-800:not(select):not(input):not(textarea) {
background: rgba(30, 22, 56, 0.82) !important;
border-color: rgba(167, 139, 250, 0.28) !important;
}
.dark body.fi-panel-support .fi-page .text-primary-900,
.dark body.fi-panel-support .fi-page .text-primary-800,
.dark body.fi-panel-support .fi-page .text-primary-700,
.dark body.fi-panel-support .fi-page .text-primary-200,
.dark body.fi-panel-support .fi-page .text-primary-300,
.dark body.fi-panel-support .fi-page .dark\:text-white,
.dark body.fi-panel-support .fi-page .dark\:text-gray-300,
.dark body.fi-panel-support .fi-page .dark\:text-gray-400 {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark body.fi-panel-support .fi-wi-chart-text-color,
.dark body.fi-panel-support .fi-wi-chart .fi-section-header-description {
color: var(--upango-text-muted) !important;
}
.dark body.fi-panel-support .fi-support-nav-group-label,
.dark body.fi-panel-support .fi-support-nav-flyout-link,
.dark body.fi-panel-support .fi-support-nav-flyout-header,
.dark body.fi-panel-support .fi-support-mobile-nav-link,
.dark body.fi-panel-support .fi-support-mobile-nav-group-btn {
color: #ffffff !important;
}
.dark body.fi-panel-support .fi-support-nav-flyout-section-label,
.dark body.fi-panel-support .fi-support-mobile-nav-section-label {
color: var(--upango-text-muted) !important;
}
.dark body.fi-panel-support .fi-tabs-item,
.dark body.fi-panel-support .fi-tabs-item .fi-tabs-item-label,
.dark body.fi-panel-support .fi-tabs-item > .fi-icon,
.dark body.fi-panel-workspace .fi-tabs-item,
.dark body.fi-panel-workspace .fi-tabs-item .fi-tabs-item-label,
.dark body.fi-panel-workspace .fi-tabs-item > .fi-icon {
color: #e2e8f0 !important;
-webkit-text-fill-color: #e2e8f0 !important;
}
.dark body.fi-panel-support .fi-tabs-item.fi-active,
.dark body.fi-panel-support .fi-tabs-item[aria-selected='true'],
.dark body.fi-panel-workspace .fi-tabs-item.fi-active,
.dark body.fi-panel-workspace .fi-tabs-item[aria-selected='true'] {
background: #ffedd5 !important;
background-color: #ffedd5 !important;
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-tabs-item.fi-active .fi-tabs-item-label,
.dark body.fi-panel-support .fi-tabs-item.fi-active > .fi-icon,
.dark body.fi-panel-support .fi-tabs-item[aria-selected='true'] .fi-tabs-item-label,
.dark body.fi-panel-support .fi-tabs-item[aria-selected='true'] > .fi-icon,
.dark body.fi-panel-workspace .fi-tabs-item.fi-active .fi-tabs-item-label,
.dark body.fi-panel-workspace .fi-tabs-item.fi-active > .fi-icon,
.dark body.fi-panel-workspace .fi-tabs-item[aria-selected='true'] .fi-tabs-item-label,
.dark body.fi-panel-workspace .fi-tabs-item[aria-selected='true'] > .fi-icon {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-badge,
.dark body.fi-panel-support .fi-ta-cell .fi-badge,
.dark body.fi-panel-support .fi-ta-text-item .fi-badge,
.dark body.fi-panel-workspace .fi-badge,
.dark body.fi-panel-workspace .fi-ta-cell .fi-badge,
.dark body.fi-panel-workspace .fi-ta-text-item .fi-badge {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
background-color: #e2e8f0 !important;
border-color: rgba(15, 23, 42, 0.12) !important;
}
.dark body.fi-panel-support .fi-badge.fi-color-primary,
.dark body.fi-panel-support .fi-badge.fi-color-success,
.dark body.fi-panel-support .fi-badge.fi-color-warning,
.dark body.fi-panel-support .fi-badge.fi-color-danger,
.dark body.fi-panel-support .fi-badge.fi-color-info,
.dark body.fi-panel-support .fi-badge.fi-color-gray {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-badge.fi-color-primary {
background-color: #ffedd5 !important;
}
.dark body.fi-panel-support .fi-badge.fi-color-success {
background-color: #dcfce7 !important;
}
.dark body.fi-panel-support .fi-badge.fi-color-warning {
background-color: #fef3c7 !important;
}
.dark body.fi-panel-support .fi-badge.fi-color-danger {
background-color: #fee2e2 !important;
}
.dark body.fi-panel-support .fi-badge.fi-color-info {
background-color: #e0f2fe !important;
}
.dark body.fi-panel-support .fi-badge.fi-color-gray {
background-color: #e2e8f0 !important;
}
.dark body.fi-panel-support .fi-btn.fi-color:not(.fi-outlined):not(.fi-btn-color-gray):not(.fi-color-gray),
.dark body.fi-panel-support .fi-btn.fi-color:not(.fi-outlined):not(.fi-btn-color-gray):not(.fi-color-gray) .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn.fi-color:not(.fi-outlined):not(.fi-btn-color-gray):not(.fi-color-gray),
.dark body.fi-panel-workspace .fi-btn.fi-color:not(.fi-outlined):not(.fi-btn-color-gray):not(.fi-color-gray) .fi-btn-label {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
.dark body.fi-panel-support .fi-btn.fi-color-gray:not(.fi-outlined),
.dark body.fi-panel-support .fi-btn.fi-btn-color-gray:not(.fi-outlined),
.dark body.fi-panel-support .fi-btn:not(.fi-color):not(.fi-outlined),
.dark body.fi-panel-support .fi-btn[class*='bg-white'],
.dark body.fi-panel-support .fi-btn[class*='bg-gray-50'],
.dark body.fi-panel-support .fi-btn[class*='bg-gray-100'],
.dark body.fi-panel-workspace .fi-btn.fi-color-gray:not(.fi-outlined),
.dark body.fi-panel-workspace .fi-btn.fi-btn-color-gray:not(.fi-outlined),
.dark body.fi-panel-workspace .fi-btn:not(.fi-color):not(.fi-outlined),
.dark body.fi-panel-workspace .fi-btn[class*='bg-white'],
.dark body.fi-panel-workspace .fi-btn[class*='bg-gray-50'],
.dark body.fi-panel-workspace .fi-btn[class*='bg-gray-100'] {
background-color: #e2e8f0 !important;
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
border-color: rgba(15, 23, 42, 0.14) !important;
}
.dark body.fi-panel-support .fi-btn.fi-color-gray:not(.fi-outlined) .fi-btn-label,
.dark body.fi-panel-support .fi-btn.fi-btn-color-gray:not(.fi-outlined) .fi-btn-label,
.dark body.fi-panel-support .fi-btn:not(.fi-color):not(.fi-outlined) .fi-btn-label,
.dark body.fi-panel-support .fi-btn.fi-color-gray:not(.fi-outlined) > .fi-icon,
.dark body.fi-panel-support .fi-btn.fi-btn-color-gray:not(.fi-outlined) > .fi-icon,
.dark body.fi-panel-support .fi-btn:not(.fi-color):not(.fi-outlined) > .fi-icon,
.dark body.fi-panel-support .fi-btn[class*='bg-white'] .fi-btn-label,
.dark body.fi-panel-support .fi-btn[class*='bg-gray-50'] .fi-btn-label,
.dark body.fi-panel-support .fi-btn[class*='bg-gray-100'] .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn.fi-color-gray:not(.fi-outlined) .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn.fi-btn-color-gray:not(.fi-outlined) .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn:not(.fi-color):not(.fi-outlined) .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn.fi-color-gray:not(.fi-outlined) > .fi-icon,
.dark body.fi-panel-workspace .fi-btn.fi-btn-color-gray:not(.fi-outlined) > .fi-icon,
.dark body.fi-panel-workspace .fi-btn:not(.fi-color):not(.fi-outlined) > .fi-icon,
.dark body.fi-panel-workspace .fi-btn[class*='bg-white'] .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn[class*='bg-gray-50'] .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn[class*='bg-gray-100'] .fi-btn-label {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
.dark body.fi-panel-support .fi-btn.fi-outlined.fi-color-gray,
.dark body.fi-panel-support .fi-btn.fi-outlined.fi-btn-color-gray,
.dark body.fi-panel-support .fi-btn.fi-outlined:not(.fi-color),
.dark body.fi-panel-workspace .fi-btn.fi-outlined.fi-color-gray,
.dark body.fi-panel-workspace .fi-btn.fi-outlined.fi-btn-color-gray,
.dark body.fi-panel-workspace .fi-btn.fi-outlined:not(.fi-color) {
background-color: transparent !important;
color: #f1f5f9 !important;
-webkit-text-fill-color: #f1f5f9 !important;
border-color: rgba(226, 232, 240, 0.55) !important;
}
.dark body.fi-panel-support .fi-btn.fi-outlined.fi-color-gray .fi-btn-label,
.dark body.fi-panel-support .fi-btn.fi-outlined:not(.fi-color) .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn.fi-outlined.fi-color-gray .fi-btn-label,
.dark body.fi-panel-workspace .fi-btn.fi-outlined:not(.fi-color) .fi-btn-label {
color: #f1f5f9 !important;
-webkit-text-fill-color: #f1f5f9 !important;
}
.dark body.fi-panel-support .fi-support-topbar-quick-link,
.dark body.fi-panel-support .fi-support-topbar-quick-link .fi-support-topbar-quick-link__label,
.dark body.fi-panel-support .fi-support-topbar-quick-link--onedrive,
.dark body.fi-panel-support .fi-support-topbar-quick-link--onedrive .fi-support-topbar-quick-link__label {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
background: #dbeafe !important;
border-color: rgba(37, 99, 235, 0.35) !important;
}
.dark body.fi-panel-support .fi-support-topbar-quick-link__icon-wrap {
background: rgba(37, 99, 235, 0.15) !important;
}
.dark body.fi-panel-support .fi-support-topbar-quick-link__icon {
color: #1d4ed8 !important;
}
.dark body.fi-panel-support .fi-support-topbar-quick-link--google-drive,
.dark body.fi-panel-support .fi-support-topbar-quick-link--google-drive .fi-support-topbar-quick-link__label {
color: #14532d !important;
-webkit-text-fill-color: #14532d !important;
background: #dcfce7 !important;
border-color: rgba(22, 163, 74, 0.35) !important;
}
.dark body.fi-panel-support .fi-support-topbar-quick-link--google-drive .fi-support-topbar-quick-link__icon {
color: #15803d !important;
}
.dark body.fi-panel-support .fi-support-nav-group-btn.fi-active,
.dark body.fi-panel-support .fi-support-nav-group-btn.fi-current {
color: #fdba74 !important;
-webkit-text-fill-color: #fdba74 !important;
background: rgba(249, 115, 22, 0.16) !important;
}
body.fi-panel-support .fi-pagination-item:not(.fi-active),
body.fi-panel-support .fi-pagination-item:not(.fi-active) .fi-pagination-item-button {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
html:not(.dark) body.fi-panel-support .fi-badge,
html:not(.dark) body.fi-panel-support .fi-ta-cell .fi-badge {
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
background-color: #e2e8f0 !important;
}
html:not(.dark) body.fi-panel-support .fi-badge.fi-color-primary {
background-color: #ffedd5 !important;
color: #9a3412 !important;
-webkit-text-fill-color: #9a3412 !important;
}
html:not(.dark) body.fi-panel-support .fi-badge.fi-color-success {
background-color: #dcfce7 !important;
color: #166534 !important;
-webkit-text-fill-color: #166534 !important;
}
html:not(.dark) body.fi-panel-support .fi-badge.fi-color-warning {
background-color: #fef3c7 !important;
color: #92400e !important;
-webkit-text-fill-color: #92400e !important;
}
html:not(.dark) body.fi-panel-support .fi-badge.fi-color-danger {
background-color: #fee2e2 !important;
color: #991b1b !important;
-webkit-text-fill-color: #991b1b !important;
}
html:not(.dark) body.fi-panel-support .fi-badge.fi-color-info {
background-color: #e0f2fe !important;
color: #075985 !important;
-webkit-text-fill-color: #075985 !important;
}
html:not(.dark) body.fi-panel-support .fi-support-nav-group-btn.fi-active,
html:not(.dark) body.fi-panel-support .fi-support-nav-group-btn.fi-current {
color: #c2410c !important;
-webkit-text-fill-color: #c2410c !important;
}
html:not(.dark) body.fi-panel-support .fi-tabs-item.fi-active,
html:not(.dark) body.fi-panel-support .fi-tabs-item[aria-selected='true'] {
background: #ede9fe !important;
color: #5b21b6 !important;
-webkit-text-fill-color: #5b21b6 !important;
}
html:not(.dark) body.fi-panel-support .fi-tabs-item.fi-active .fi-tabs-item-label,
html:not(.dark) body.fi-panel-support .fi-tabs-item[aria-selected='true'] .fi-tabs-item-label {
color: #5b21b6 !important;
-webkit-text-fill-color: #5b21b6 !important;
}
body.fi-panel-support .fi-page .fi-section,
body.fi-panel-support .fi-page .fi-section-content-ctn,
body.fi-panel-support .fi-page .fi-section-content,
body.fi-panel-support .fi-fo-component-ctn,
body.fi-panel-support .fi-sc,
body.fi-panel-support .fi-grid,
body.fi-panel-support .fi-grid-col,
body.fi-panel-support .fi-fo-field-wrp,
body.fi-panel-support .fi-fo-select-wrp,
body.fi-panel-support .fi-input-wrp,
body.fi-panel-support .fi-select-input-ctn,
body.fi-panel-support .choices,
body.fi-panel-workspace .fi-page .fi-section,
body.fi-panel-workspace .fi-fo-field-wrp,
body.fi-panel-workspace .fi-fo-select-wrp,
body.fi-panel-workspace .fi-grid-col,
body.fi-panel-workspace .choices {
overflow: visible !important;
}
body.fi-panel-support .fi-section:has(.choices.is-open),
body.fi-panel-support .fi-section:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-support .fi-section:has(.fi-select-input[aria-expanded='true']),
body.fi-panel-workspace .fi-section:has(.choices.is-open),
body.fi-panel-workspace .fi-section:has(.fi-select-input-btn[aria-expanded='true']) {
position: relative !important;
z-index: 70 !important;
}
body.fi-panel-support .fi-grid-col:has(.choices.is-open),
body.fi-panel-support .fi-grid-col:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-support .fi-grid-col:has(.fi-select-input[aria-expanded='true']),
body.fi-panel-support .fi-fo-field-wrp:has(.choices.is-open),
body.fi-panel-support .fi-fo-field-wrp:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-support .fi-fo-field-wrp:has(.fi-select-input[aria-expanded='true']),
body.fi-panel-support .fi-fo-select-wrp:has(.choices.is-open),
body.fi-panel-support .fi-fo-select-wrp:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-support .fi-input-wrp:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-support .fi-select-input:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-support .fi-select-input-ctn:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-support .choices.is-open,
body.fi-panel-workspace .fi-grid-col:has(.choices.is-open),
body.fi-panel-workspace .fi-grid-col:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-workspace .fi-fo-field-wrp:has(.choices.is-open),
body.fi-panel-workspace .fi-fo-field-wrp:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-workspace .fi-fo-select-wrp:has(.fi-select-input-btn[aria-expanded='true']),
body.fi-panel-workspace .choices.is-open {
position: relative !important;
z-index: 80 !important;
}
body.fi-panel-support .choices__list--dropdown,
body.fi-panel-support .choices__list--dropdown.is-active,
body.fi-panel-workspace .choices__list--dropdown,
body.fi-panel-workspace .choices__list--dropdown.is-active {
z-index: 200000 !important;
position: absolute !important;
}
body.fi-panel-support .fi-dropdown-panel,
body.fi-panel-support .fi-select-panel,
body.fi-panel-workspace .fi-dropdown-panel,
body.fi-panel-workspace .fi-select-panel {
z-index: 200000 !important;
}
.dark body.fi-panel-support .choices__list--dropdown.is-active,
.dark body.fi-panel-support .fi-dropdown-panel,
.dark body.fi-panel-support .fi-select-panel {
background: rgba(30, 22, 56, 0.98) !important;
color: #f1f5f9 !important;
border: 1px solid rgba(167, 139, 250, 0.35) !important;
box-shadow: 0 24px 48px -12px rgba(0, 0, 0, 0.65) !important;
}
.dark body.fi-panel-support .choices__list--dropdown .choices__item,
.dark body.fi-panel-support .choices__list--dropdown .choices__item--selectable,
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item,
.dark body.fi-panel-support .fi-dropdown-panel .fi-dropdown-list-item-label,
.dark body.fi-panel-support .fi-select-panel .fi-select-option {
color: #e2e8f0 !important;
-webkit-text-fill-color: #e2e8f0 !important;
}
.dark body.fi-panel-support .choices__list--dropdown .choices__item--selectable.is-highlighted,
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option:hover,
.dark body.fi-panel-support .fi-dropdown-panel .fi-select-input-option.fi-selected,
.dark body.fi-panel-support .fi-select-panel .fi-select-option:hover,
.dark body.fi-panel-support .fi-select-panel .fi-select-option.fi-selected {
background: rgba(249, 115, 22, 0.18) !important;
color: #f8fafc !important;
-webkit-text-fill-color: #f8fafc !important;
}
body.fi-panel-support .fi-sc-actions.fi-sticky .fi-ac,
body.fi-panel-workspace .fi-sc-actions.fi-sticky .fi-ac {
z-index: 30 !important;
}
:not(.dark) body.fi-panel-support .fi-input-wrp,
:not(.dark) body.fi-panel-support .fi-select-input,
:not(.dark) body.fi-panel-support .fi-textarea,
:not(.dark) body.fi-panel-support .fi-input,
:not(.dark) body.fi-panel-workspace .fi-input-wrp,
:not(.dark) body.fi-panel-workspace .fi-select-input,
:not(.dark) body.fi-panel-workspace .fi-textarea,
:not(.dark) body.fi-panel-workspace .fi-input {
background: #ffffff !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
color: #0f172a !important;
-webkit-text-fill-color: #0f172a !important;
}
:not(.dark) body.fi-panel-support .fi-fo-field-wrp-label,
:not(.dark) body.fi-panel-support .fi-fo-field-wrp-label span,
:not(.dark) body.fi-panel-workspace .fi-fo-field-wrp-label,
:not(.dark) body.fi-panel-workspace .fi-fo-field-wrp-label span {
color: #334155 !important;
-webkit-text-fill-color: #334155 !important;
}
body.fi-panel-support .fi-fo-component-ctn,
body.fi-panel-support .fi-sc,
body.fi-panel-support .fi-fo,
body.fi-panel-support .fi-modal-content,
body.fi-panel-workspace .fi-fo-component-ctn,
body.fi-panel-workspace .fi-sc,
body.fi-panel-workspace .fi-fo,
body.fi-panel-workspace .fi-modal-content {
overflow: visible !important;
}
body.fi-panel-support .fi-grid-col:has([aria-expanded='true']),
body.fi-panel-support .fi-grid-col:has([data-open='true']),
body.fi-panel-support .fi-fo-field-wrp:has([aria-expanded='true']),
body.fi-panel-support .fi-fo-field-wrp:has([data-open='true']),
body.fi-panel-support .fi-fo-select-wrp:has([aria-expanded='true']),
body.fi-panel-support .fi-input-wrp:has([aria-expanded='true']),
body.fi-panel-support .fi-select-input-ctn:has([aria-expanded='true']),
body.fi-panel-workspace .fi-grid-col:has([aria-expanded='true']),
body.fi-panel-workspace .fi-fo-field-wrp:has([aria-expanded='true']),
body.fi-panel-workspace .fi-fo-select-wrp:has([aria-expanded='true']) {
position: relative !important;
z-index: 90 !important;
overflow: visible !important;
}
body.fi-panel-support .fi-dropdown,
body.fi-panel-support .fi-dropdown-panel,
body.fi-panel-support .fi-select-panel,
body.fi-panel-support [data-floating-ui-portal],
body.fi-panel-workspace .fi-dropdown,
body.fi-panel-workspace .fi-dropdown-panel,
body.fi-panel-workspace .fi-select-panel {
z-index: 2147483000 !important;
}
body.fi-panel-support,
body.fi-panel-support .fi-layout,
body.fi-panel-support .fi-main,
body.fi-panel-support .fi-content {
background-color: transparent !important;
}
.fi-panel-support .fi-icon,
.fi-panel-support .fi-btn .fi-icon,
.fi-panel-support .fi-btn > svg,
.fi-panel-support .fi-icon-btn .fi-icon,
.fi-panel-support .fi-icon-btn > svg,
.fi-panel-support .fi-ac-btn-icon,
.fi-panel-support .fi-ac-icon-btn-icon,
.fi-panel-support .fi-header-actions .fi-icon,
.fi-panel-support .fi-header-actions svg,
.fi-panel-support .fi-global-search .fi-icon,
.fi-panel-support .fi-global-search svg,
.fi-panel-support .fi-global-search-field .fi-icon,
.fi-panel-support .fi-global-search-field svg,
.fi-panel-support .fi-topbar .fi-icon,
.fi-panel-support .fi-topbar svg.fi-icon,
.fi-panel-support .fi-navigation-favorite-btn .fi-icon,
.fi-panel-support .fi-navigation-favorite-btn svg {
width: 1.25rem !important;
height: 1.25rem !important;
max-width: 1.25rem !important;
max-height: 1.25rem !important;
flex-shrink: 0 !important;
}
.fi-panel-support .fi-btn {
max-height: none;
min-height: 2.25rem;
overflow: hidden;
}
.fi-panel-support .fi-header-actions .fi-btn {
overflow: visible;
}
.fi-panel-support .rmm-hub-overview-grid,
.fi-panel-support .org-hub-grid {
display: grid;
gap: 1.25rem;
grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
max-width: 72rem;
}
.fi-panel-support .rmm-hub-overview-card,
.fi-panel-support .org-hub-card {
overflow: hidden;
max-width: 100%;
}
.fi-panel-support .rmm-hub-overview-card__hero,
.fi-panel-support .org-hub-card__hero {
display: flex;
align-items: center;
justify-content: center;
max-height: 8rem;
overflow: hidden;
}
.fi-panel-support .rmm-hub-overview-card__image,
.fi-panel-support .rmm-hub-overview-card__hero img,
.fi-panel-support .rmm-hub-overview-card__hero svg,
.fi-panel-support .rmm-hub-overview-card__hero-icon,
.fi-panel-support .org-hub-card__image,
.fi-panel-support .fi-empty-state img,
.fi-panel-support .fi-empty-state svg:not(.fi-icon) {
width: auto !important;
max-width: 9rem !important;
max-height: 6.5rem !important;
height: auto !important;
object-fit: contain;
}
.fi-panel-support .fi-wi-stats-overview-stats-ctn,
.fi-panel-support .fi-wi-stats-overview {
max-width: 72rem;
}
.fi-panel-support .fi-header-actions {
align-items: center;
flex-wrap: wrap;
gap: 0.5rem;
}
.fi-panel-support .fi-btn {
border-radius: 9999px !important;
transition: all 0.2s cubic-bezier(0.2, 0.9, 0.4, 1.1) !important;
}
.fi-panel-support .fi-breadcrumbs-item-label {
font-weight: 500;
color: #4f46e5 !important;
transition: color 0.2s;
}
.dark .fi-panel-support .fi-breadcrumbs-item-label {
color: #c4b5fd !important;
}
.fi-panel-support .fi-main {
padding: 1.25rem 1.5rem;
}
.fi-panel-support .mail-inbox-unread-dot {
display: inline-block;
width: 0.45rem;
height: 0.45rem;
border-radius: 9999px;
background: #5b21b6 !important;
box-shadow: 0 0 0 3px rgba(91, 33, 182, 0.14);
vertical-align: middle;
flex-shrink: 0;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-header-heading {
font-size: 1.85rem !important;
font-weight: 800 !important;
letter-spacing: -0.02em;
color: #111827 !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-header-subheading {
margin-top: 0.2rem !important;
font-size: 0.9rem !important;
color: #6b7280 !important;
}
.fi-panel-support .mail-inbox-chrome {
display: flex;
flex-direction: column;
gap: 1.15rem;
margin-bottom: 1.15rem;
}
.fi-panel-support .mail-inbox-tabs {
display: flex;
flex-wrap: wrap;
gap: 0.1rem;
border-bottom: 1px solid #e5e7eb;
}
.fi-panel-support .mail-inbox-tab {
display: inline-flex;
align-items: center;
gap: 0.45rem;
padding: 0.7rem 0.85rem 0.75rem;
color: #6b7280 !important;
font-size: 0.875rem;
font-weight: 600;
text-decoration: none !important;
border-bottom: 2px solid transparent;
margin-bottom: -1px;
background: transparent !important;
box-shadow: none !important;
}
.fi-panel-support .mail-inbox-tab:hover {
color: #4c1d95 !important;
}
.fi-panel-support .mail-inbox-tab--active {
color: #5b21b6 !important;
border-bottom-color: #5b21b6;
}
.fi-panel-support .mail-inbox-tab__icon,
.fi-panel-support .mail-inbox-tab .fi-icon,
.fi-panel-support .mail-inbox-tab svg {
width: 1.05rem !important;
height: 1.05rem !important;
max-width: 1.05rem !important;
max-height: 1.05rem !important;
}
.fi-panel-support .mail-inbox-kpis {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 0.85rem;
}
.fi-panel-support .mail-inbox-kpi {
display: flex !important;
flex-direction: column;
justify-content: space-between;
gap: 1.35rem;
min-height: 7.6rem;
padding: 1rem 1.05rem 0.85rem !important;
border-radius: 0.65rem !important;
border: 1px solid #e5e7eb !important;
background: #fff !important;
text-decoration: none !important;
color: inherit !important;
box-shadow: none !important;
backdrop-filter: none !important;
}
.fi-panel-support .mail-inbox-kpi:hover {
border-color: #c4b5fd !important;
}
.fi-panel-support .mail-inbox-kpi__top {
display: flex;
align-items: flex-start;
gap: 0.75rem;
}
.fi-panel-support .mail-inbox-kpi__icon {
display: inline-flex !important;
align-items: center;
justify-content: center;
width: 2rem !important;
height: 2rem !important;
border-radius: 0.5rem !important;
flex-shrink: 0;
}
.fi-panel-support .mail-inbox-kpi__icon .fi-icon,
.fi-panel-support .mail-inbox-kpi__icon svg {
width: 1.05rem !important;
height: 1.05rem !important;
max-width: 1.05rem !important;
max-height: 1.05rem !important;
}
.fi-panel-support .mail-inbox-kpi--purple .mail-inbox-kpi__icon { background: #ede9fe !important; color: #6d28d9 !important; }
.fi-panel-support .mail-inbox-kpi--orange .mail-inbox-kpi__icon { background: #ffedd5 !important; color: #ea580c !important; }
.fi-panel-support .mail-inbox-kpi--blue .mail-inbox-kpi__icon { background: #dbeafe !important; color: #2563eb !important; }
.fi-panel-support .mail-inbox-kpi--green .mail-inbox-kpi__icon { background: #dcfce7 !important; color: #16a34a !important; }
.fi-panel-support .mail-inbox-kpi__copy {
display: flex;
flex-direction: column;
gap: 0.15rem;
min-width: 0;
}
.fi-panel-support .mail-inbox-kpi__label {
margin: 0 !important;
font-size: 0.8rem !important;
color: #6b7280 !important;
font-weight: 600 !important;
line-height: 1.2;
}
.fi-panel-support .mail-inbox-kpi__value {
margin: 0 !important;
font-size: 1.7rem !important;
line-height: 1.1 !important;
font-weight: 750 !important;
color: #111827 !important;
-webkit-text-fill-color: #111827 !important;
background: none !important;
}
.fi-panel-support .mail-inbox-kpi__more {
display: flex !important;
align-items: center;
justify-content: space-between;
width: 100%;
font-size: 0.75rem !important;
font-weight: 700 !important;
color: #5b21b6 !important;
}
.fi-panel-support .mail-inbox-kpi__more .fi-icon,
.fi-panel-support .mail-inbox-kpi__more svg {
width: 0.85rem !important;
height: 0.85rem !important;
max-width: 0.85rem !important;
max-height: 0.85rem !important;
color: #5b21b6 !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-ctn,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-content,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-container {
background: #fff !important;
border: 1px solid #e5e7eb !important;
border-radius: 0.65rem !important;
box-shadow: none !important;
backdrop-filter: none !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-heading {
font-size: 0.95rem !important;
font-weight: 650 !important;
color: #111827 !important;
-webkit-text-fill-color: #111827 !important;
background: none !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell {
background: #f8fafc !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell-label {
font-size: 0.68rem !important;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #9ca3af !important;
font-weight: 700 !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-row {
background: #fff !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell {
padding-top: 0.85rem !important;
padding-bottom: 0.85rem !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-content,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-content-ctn,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-ctn {
overflow-x: auto !important;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-table {
min-width: 72rem;
table-layout: auto;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell {
white-space: nowrap;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell:has(.fi-ta-actions),
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell:last-child {
position: sticky;
right: 0;
z-index: 3;
background: #fff;
}
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell:has(.fi-ta-actions),
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell:last-child {
background: rgb(15, 23, 42);
}
.fi-panel-support .mail-inbox-search,
.fi-panel-support .mail-inbox-search input,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-actions,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-actions * {
pointer-events: auto;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-cell:has(.mail-inbox-subject) {
white-space: normal;
min-width: 16rem;
}
.fi-panel-support .mail-inbox-subject {
display: flex;
align-items: flex-start;
gap: 0.45rem;
max-width: none;
}
.fi-panel-support .mail-inbox-subject__text {
white-space: normal;
line-height: 1.35;
}
.fi-panel-support .mail-reading-pane {
border: 1px solid #e5e7eb;
border-radius: 12px;
background: #fff;
padding: 1rem;
display: flex;
flex-direction: column;
gap: 0.75rem;
max-height: 70vh;
overflow: auto;
}
.fi-panel-support .mail-reading-pane__bar {
display: flex;
justify-content: space-between;
gap: 0.75rem;
align-items: flex-start;
}
.fi-panel-support .mail-reading-pane__title {
font-weight: 700;
color: #111827;
}
.fi-panel-support .mail-reading-pane__close {
background: transparent;
border: 0;
color: #6b7280;
cursor: pointer;
font-size: 0.85rem;
font-weight: 600;
padding: 0;
white-space: nowrap;
}
.fi-panel-support .mail-reading-pane__body {
font-size: 0.92rem;
line-height: 1.45;
color: #374151;
}
.fi-panel-support .mail-reading-pane__reply {
display: flex;
flex-direction: column;
gap: 0.5rem;
}
.fi-panel-support .mail-reading-pane__reply input,
.fi-panel-support .mail-reading-pane__reply textarea {
width: 100%;
border: 1px solid #e5e7eb;
border-radius: 8px;
padding: 0.45rem 0.6rem;
}
.fi-panel-support .mail-reading-pane__reply button {
align-self: flex-start;
background: #111827;
color: #fff;
border-radius: 8px;
padding: 0.45rem 0.8rem;
font-weight: 600;
}
.fi-panel-support .mail-inbox-subject--unread .mail-inbox-subject__text {
font-weight: 700;
color: #111827;
}
.fi-panel-support .fi-page.mail-inbox-page .fi-pagination {
border: 0 !important;
box-shadow: none !important;
background: transparent !important;
}
.dark .fi-panel-support .mail-inbox-kpi,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-ctn,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-content,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-header-cell,
.dark .fi-panel-support .fi-page.mail-inbox-page .fi-ta-row {
background: rgb(15, 23, 42) !important;
border-color: rgba(148, 163, 184, 0.22) !important;
}
.dark .fi-panel-support .mail-inbox-tab { color: #94a3b8 !important; }
.dark .fi-panel-support .mail-inbox-tab--active { color: #ddd6fe !important; border-bottom-color: #a78bfa; }
.dark .fi-panel-support .mail-inbox-kpi__label { color: #94a3b8 !important; }
.dark .fi-panel-support .mail-inbox-kpi__value {
color: #f8fafc !important;
-webkit-text-fill-color: #f8fafc !important;
}
.fi-panel-support .mail-inbox-toolbar {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
flex-wrap: wrap;
}
.fi-panel-support .mail-inbox-toolbar__filters,
.fi-panel-support .mail-inbox-toolbar__tools {
display: flex;
align-items: center;
gap: 0.55rem;
flex-wrap: wrap;
}
.fi-panel-support .mail-inbox-select,
.fi-panel-support .mail-inbox-search {
display: inline-flex;
align-items: center;
gap: 0.45rem;
min-height: 2.35rem;
padding: 0 0.8rem;
border: 1px solid #e5e7eb;
border-radius: 0.65rem;
background: #fff;
color: #374151;
}
.fi-panel-support .mail-inbox-select select,
.fi-panel-support .mail-inbox-search input {
border: 0;
background: transparent;
color: inherit;
font-size: 0.875rem;
font-weight: 600;
outline: none;
min-width: 8.5rem;
}
.fi-panel-support .mail-inbox-search {
min-width: 18rem;
flex: 1 1 16rem;
}
.fi-panel-support .mail-inbox-search input {
width: 100%;
min-width: 0;
font-weight: 500;
}
.fi-panel-support .mail-inbox-select__icon,
.fi-panel-support .mail-inbox-search__icon,
.fi-panel-support .mail-inbox-select svg,
.fi-panel-support .mail-inbox-search svg,
.fi-panel-support .mail-inbox-filters-btn svg,
.fi-panel-support .mail-inbox-refresh svg {
width: 1rem !important;
height: 1rem !important;
max-width: 1rem !important;
max-height: 1rem !important;
color: #6b7280;
}
.fi-panel-support .mail-inbox-filters-btn,
.fi-panel-support .mail-inbox-refresh {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.4rem;
min-height: 2.35rem;
border: 1px solid #e5e7eb;
background: #fff;
color: #374151;
font-size: 0.875rem;
font-weight: 650;
}
.fi-panel-support .mail-inbox-filters-btn {
border-radius: 0.65rem !important;
padding: 0 0.85rem;
}
.fi-panel-support .mail-inbox-refresh {
width: 2.35rem;
border-radius: 9999px !important;
padding: 0;
}
.fi-panel-support .mail-inbox-extra {
position: relative;
}
.fi-panel-support .mail-inbox-extra__panel {
position: absolute;
right: 0;
top: calc(100% + 0.4rem);
z-index: 20;
min-width: 12rem;
padding: 0.7rem 0.8rem;
border: 1px solid #e5e7eb;
border-radius: 0.65rem;
background: #fff;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}
.fi-panel-support .mail-inbox-extra__item {
display: flex;
align-items: center;
gap: 0.5rem;
font-size: 0.85rem;
font-weight: 600;
color: #374151;
}
.fi-panel-support .fi-page.mail-inbox-page .module-dashboard__actions,
.fi-panel-support .fi-page.mail-inbox-page .rmm-hub-overview-grid,
.fi-panel-support .fi-page.mail-inbox-page .module-dashboard__kpis,
.fi-panel-support .fi-page.mail-inbox-page .fi-tabs,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-search-field,
.fi-panel-support .fi-page.mail-inbox-page .fi-ta-filters-trigger-action-ctn,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .module-dashboard__actions,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .rmm-hub-overview-grid,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .module-dashboard__kpis,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .fi-tabs,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .fi-ta-search-field,
.fi-panel-support .fi-page:has(.mail-inbox-chrome) .fi-ta-filters-trigger-action-ctn {
display: none !important;
}
.dark .fi-panel-support .mail-inbox-select,
.dark .fi-panel-support .mail-inbox-search,
.dark .fi-panel-support .mail-inbox-filters-btn,
.dark .fi-panel-support .mail-inbox-refresh,
.dark .fi-panel-support .mail-inbox-extra__panel {
background: rgb(15, 23, 42) !important;
border-color: rgba(148, 163, 184, 0.22) !important;
color: #e2e8f0;
}
@media (max-width: 1100px) {
.fi-panel-support .mail-inbox-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
.fi-panel-support .mail-inbox-kpis { grid-template-columns: 1fr; }
.fi-panel-support .mail-inbox-search { min-width: 100%; }
}
.mail-message__rich-content,
.ticket-workspace__rich-content {
white-space: normal;
line-height: 1.65;
overflow-wrap: anywhere;
}
.mail-message__rich-content p,
.mail-message__rich-content div,
.mail-message__rich-content blockquote,
.mail-message__rich-content ul,
.mail-message__rich-content ol,
.mail-message__rich-content li,
.mail-message__rich-content pre,
.mail-message__rich-content table,
.ticket-workspace__rich-content p,
.ticket-workspace__rich-content div,
.ticket-workspace__rich-content blockquote,
.ticket-workspace__rich-content ul,
.ticket-workspace__rich-content ol,
.ticket-workspace__rich-content li,
.ticket-workspace__rich-content pre,
.ticket-workspace__rich-content table {
margin-bottom: 0.75rem;
max-width: 100%;
}
.mail-message__rich-content blockquote,
.ticket-workspace__rich-content blockquote {
border-inline-start: 3px solid rgba(148, 163, 184, 0.35);
padding-inline-start: 0.75rem;
color: rgb(71 85 105);
}
.dark .mail-message__rich-content blockquote,
.dark .ticket-workspace__rich-content blockquote {
color: rgb(203 213 225);
}
.mail-message__rich-content table,
.ticket-workspace__rich-content table {
border-collapse: collapse;
width: 100%;
}
.mail-message__rich-content th,
.mail-message__rich-content td,
.ticket-workspace__rich-content th,
.ticket-workspace__rich-content td {
border: 1px solid rgba(148, 163, 184, 0.22);
padding: 0.35rem 0.5rem;
vertical-align: top;
}
.mail-message__rich-content hr,
.ticket-workspace__rich-content hr {
border: 0;
border-top: 1px solid rgba(148, 163, 184, 0.22);
margin: 1rem 0;
}
.fi-panel-support .mail-message__rich-content *:not(a):not(img),
.ticket-workspace__rich-content *:not(a):not(img) {
color: inherit !important;
-webkit-text-fill-color: inherit !important;
}
.mail-message__rich-content a,
.ticket-workspace__rich-content a {
color: rgb(234 88 12) !important;
-webkit-text-fill-color: rgb(234 88 12) !important;
word-break: break-all;
}
.fi-ta-ctn,
.fi-ta-content,
.fi-ta-content-ctn,
body[class*="fi-panel-"] .fi-ta-ctn,
body[class*="fi-panel-"] .fi-ta-content,
body[class*="fi-panel-"] .fi-ta-content-ctn {
max-width: 100%;
overflow-x: auto;
}
.fi-ta-table,
.fi-ta-table table {
width: 100%;
border-collapse: separate !important;
border-spacing: 0 !important;
}
.fi-ta-header-cell,
.fi-ta-table thead th {
padding-top: 0.5rem !important;
padding-bottom: 0.5rem !important;
padding-inline: 0.75rem !important;
line-height: 1.3 !important;
vertical-align: middle;
}
.fi-ta-cell,
.fi-ta-table tbody td {
padding-top: 0.5rem !important;
padding-bottom: 0.5rem !important;
padding-inline: 0.75rem !important;
line-height: 1.4 !important;
vertical-align: middle;
}
.fi-ta-row,
.fi-ta-record {
line-height: 1.3;
}
.fi-ta-text,
.fi-ta-text-item,
.fi-ta-col {
line-height: 1.3 !important;
}
.fi-ta-actions {
gap: 0.2rem !important;
}
@media (max-width: 1023.98px) {
.fi-ta-ctn,
.fi-ta-content,
.fi-ta-content-ctn,
.fi-ta-table,
body[class*="fi-panel-"] .fi-ta-ctn,
body[class*="fi-panel-"] .fi-ta-content,
body[class*="fi-panel-"] .fi-ta-table {
overflow-x: hidden !important;
max-width: 100%;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile {
display: block !important;
width: 100% !important;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > thead {
display: block !important;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > thead:not(:has(.fi-ta-table-stacked-header-row)),
.fi-ta-table.fi-ta-table-stacked-on-mobile > thead > tr:not(.fi-ta-table-stacked-header-row),
.fi-ta-table.fi-ta-table-stacked-on-mobile > thead > tr > .fi-ta-header-cell,
.fi-ta-table.fi-ta-table-stacked-on-mobile > thead > tr > .fi-ta-selection-cell {
display: none !important;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > thead > .fi-ta-table-stacked-header-row,
.fi-ta-table.fi-ta-table-stacked-on-mobile > thead > .fi-ta-table-stacked-header-row > .fi-ta-table-stacked-header-cell {
display: block !important;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody {
display: block !important;
white-space: normal !important;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody > tr {
display: block !important;
position: relative !important;
padding: 0.45rem 0 0.55rem !important;
margin: 0 0 0.4rem !important;
border-bottom: 1px solid rgba(148, 163, 184, 0.28);
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody > tr > .fi-ta-cell:not(.fi-ta-selection-cell) {
display: none !important;
width: 100% !important;
padding: 0.15rem 0.85rem !important;
white-space: normal !important;
overflow-wrap: anywhere;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody > tr > .fi-ta-cell:not(.fi-ta-selection-cell):nth-child(-n+2),
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody > tr > .fi-ta-cell:has(.fi-badge),
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody > tr > .fi-ta-cell:has(.fi-ta-actions) {
display: block !important;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody > tr > .fi-ta-selection-cell {
position: absolute !important;
inset-inline-end: 0.75rem;
top: 0.35rem;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile .fi-ta-cell-label {
display: block;
font-size: 0.7rem;
font-weight: 600;
color: rgb(100 116 139);
margin-bottom: 0.1rem;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile > tbody > tr > .fi-ta-cell:not(.fi-ta-selection-cell):nth-child(-n+2) .fi-ta-cell-label {
display: none;
}
.fi-ta-table.fi-ta-table-stacked-on-mobile .fi-ta-actions {
justify-content: flex-start !important;
flex-wrap: wrap !important;
padding-top: 0.25rem;
}
}
body.fi-panel-support .fi-resource-create-record-page .fi-sc-form,
body.fi-panel-support .fi-resource-edit-record-page .fi-sc-form,
body.fi-panel-support .fi-resource-create-record-page .fi-form,
body.fi-panel-support .fi-resource-edit-record-page .fi-form,
body.fi-panel-support .fi-page .fi-sc-form,
body.fi-panel-support .fi-page .fi-form {
max-width: none;
width: 100%;
align-items: stretch;
}
body.fi-panel-support .fi-resource-create-record-page .fi-sc-form > *,
body.fi-panel-support .fi-resource-edit-record-page .fi-sc-form > *,
body.fi-panel-support .fi-page .fi-sc-form > *,
body.fi-panel-support .fi-page .fi-form > *,
body.fi-panel-support .fi-tabs,
body.fi-panel-support .fi-sc-tabs,
body.fi-panel-support .fi-fo-tabs,
body.fi-panel-support .fi-sc-grid,
body.fi-panel-support .fi-grid {
width: 100%;
max-width: none;
}
body.fi-panel-support .fi-page-content,
body.fi-panel-support .fi-header,
body.fi-panel-support .fi-audit-mode {
width: 100%;
max-width: none;
}
body.fi-panel-support .fi-audit-mode {
display: flex;
flex-direction: column;
gap: 1.5rem;
}
body.fi-panel-support .fi-audit-mode .org-hub-scoreboard__grid {
display: grid !important;
gap: 0.85rem;
grid-template-columns: minmax(0, 1fr);
width: 100%;
max-width: none;
}
body.fi-panel-support .fi-audit-mode .org-hub-grid {
display: grid !important;
gap: 1.25rem;
grid-template-columns: minmax(0, 1fr);
width: 100%;
max-width: none;
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi {
display: flex;
flex-direction: column;
gap: 0.35rem;
min-height: 7.5rem;
padding: 1rem 1.05rem;
border-radius: 1rem;
border: 1px solid rgba(148, 163, 184, 0.22);
background: rgba(15, 23, 42, 0.55);
width: auto;
max-width: none;
color: inherit;
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi__label {
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.04em;
text-transform: uppercase;
color: rgb(148 163 184);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi__value {
font-size: 1.65rem;
font-weight: 700;
line-height: 1.1;
color: rgb(248 250 252);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi__hint {
font-size: 0.75rem;
line-height: 1.35;
color: rgb(148 163 184);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi--success {
border-color: rgba(16, 185, 129, 0.35);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi--warning {
border-color: rgba(245, 158, 11, 0.4);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi--danger {
border-color: rgba(244, 63, 94, 0.4);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi--success .org-hub-kpi__value {
color: rgb(52 211 153);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi--warning .org-hub-kpi__value {
color: rgb(251 191 36);
}
body.fi-panel-support .fi-audit-mode .org-hub-kpi--danger .org-hub-kpi__value {
color: rgb(251 113 133);
}
body.fi-panel-support .fi-audit-mode .org-hub-card {
border-radius: 1.25rem;
border: 1px solid rgba(148, 163, 184, 0.16);
background: linear-gradient(145deg, rgba(15, 23, 42, 0.72), rgba(30, 41, 59, 0.55));
overflow: hidden;
width: 100%;
max-width: none;
}
body.fi-panel-support .fi-audit-mode .org-hub-card__header {
display: flex;
gap: 0.9rem;
align-items: flex-start;
padding: 1.1rem 1.25rem 0.95rem;
border-bottom: 1px solid rgba(148, 163, 184, 0.18);
}
body.fi-panel-support .fi-audit-mode .org-hub-card__title {
font-size: 1.125rem;
font-weight: 700;
line-height: 1.3;
color: rgb(248 250 252);
}
body.fi-panel-support .fi-audit-mode .org-hub-card__description {
margin-top: 0.25rem;
font-size: 0.875rem;
line-height: 1.45;
color: rgb(148 163 184);
}
body.fi-panel-support .fi-audit-mode .org-hub-card__body {
padding: 1rem 1.25rem 1.15rem;
}
body.fi-panel-support .fi-audit-mode .org-hub-card__count {
display: inline-flex;
align-items: center;
padding: 0.15rem 0.55rem;
border-radius: 9999px;
font-size: 0.6875rem;
font-weight: 700;
letter-spacing: 0.02em;
text-transform: uppercase;
color: rgb(203 213 225);
background: rgba(148, 163, 184, 0.16);
}
@media (min-width: 640px) {
body.fi-panel-support .fi-audit-mode .org-hub-scoreboard__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
body.fi-panel-support .fi-audit-mode .org-hub-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width: 1024px) {
body.fi-panel-support .fi-audit-mode .org-hub-scoreboard__grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
}
:not(.dark) body.fi-panel-support .fi-audit-mode .org-hub-kpi {
background: rgba(248, 250, 252, 0.9);
border-color: rgba(148, 163, 184, 0.22);
}
:not(.dark) body.fi-panel-support .fi-audit-mode .org-hub-kpi__label,
:not(.dark) body.fi-panel-support .fi-audit-mode .org-hub-kpi__hint,
:not(.dark) body.fi-panel-support .fi-audit-mode .org-hub-card__description {
color: rgb(100 116 139);
}
:not(.dark) body.fi-panel-support .fi-audit-mode .org-hub-kpi__value,
:not(.dark) body.fi-panel-support .fi-audit-mode .org-hub-card__title {
color: rgb(15 23 42);
}
:not(.dark) body.fi-panel-support .fi-audit-mode .org-hub-card {
background: linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(248, 250, 252, 0.88));
border-color: rgba(148, 163, 184, 0.22);
}
body.fi-panel-support .fi-navigation-favorite-btn .sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
body.fi-panel-support .fi-tabs-tab-list,
body.fi-panel-support .fi-sc-tabs-tab-list {
overflow-x: auto;
flex-wrap: nowrap;
max-width: 100%;
}
body.fi-panel-support .fi-resource-relation-managers,
body.fi-panel-support .fi-ta {
max-width: none;
}
body.fi-panel-support .fi-page .fi-section {
margin-bottom: 1rem;
}
body.fi-panel-support .fi-page .fi-section-header {
padding: 0.7rem 1rem 0.15rem !important;
}
body.fi-panel-support .fi-page .fi-section-header-heading {
font-size: 0.95rem !important;
letter-spacing: 0.01em;
}
body.fi-panel-support .fi-page .fi-section-header-description {
margin-top: 0.15rem !important;
font-size: 0.8rem !important;
line-height: 1.35 !important;
color: var(--upango-text-muted, #64748b);
}
body.fi-panel-support .fi-page .fi-section-content {
padding: 0.75rem 1rem 1rem !important;
gap: 0.75rem !important;
}
body.fi-panel-support .fi-fo-field-wrp {
gap: 0.28rem !important;
}
body.fi-panel-support .fi-fo-field-wrp-label {
font-size: 0.8rem !important;
font-weight: 600 !important;
}
body.fi-panel-support .fi-fo-field-wrp-helper-text,
body.fi-panel-support .fi-fo-field-wrp-hint {
font-size: 0.75rem !important;
line-height: 1.3 !important;
margin-top: 0.1rem !important;
}
body.fi-panel-support .fi-input-wrp,
body.fi-panel-support .fi-select-input-wrp {
min-height: 2.35rem;
}
.upango-risk-score {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 0.75rem;
padding: 0.75rem 0.9rem;
border-radius: 0.75rem;
background: var(--upango-surface-muted, #f8fafc);
border: 1px solid var(--upango-border, rgba(148, 163, 184, 0.35));
}
.upango-risk-score__item {
min-width: 0;
}
.upango-risk-score__label {
display: block;
font-size: 0.7rem;
font-weight: 650;
text-transform: uppercase;
letter-spacing: 0.04em;
color: var(--upango-text-muted, #64748b);
margin-bottom: 0.15rem;
}
.upango-risk-score__value {
font-family: 'Space Grotesk', Inter, sans-serif;
font-size: 1.45rem;
font-weight: 650;
line-height: 1.1;
color: var(--upango-text, #0f172a);
}
.upango-risk-score__value.is-danger { color: #dc2626; }
.upango-risk-score__value.is-warning { color: #d97706; }
.upango-risk-score__value.is-success { color: #059669; }
.upango-risk-score__meta {
margin-top: 0.2rem;
font-size: 0.75rem;
color: var(--upango-text-muted, #64748b);
}
.sr-review-layout {
display: grid;
gap: 1.5rem;
align-items: stretch;
width: 100%;
max-width: none;
grid-template-columns: minmax(0, 1fr);
}
.sr-review-layout__main,
.sr-review-layout__aside {
min-width: 0;
width: 100%;
}
.sr-review-layout__aside {
align-self: start;
}
@media (min-width: 1024px) {
.sr-review-layout {
grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem);
}
.upango-risk-score-aside {
position: sticky;
top: 5.25rem;
}
.upango-risk-score-aside .upango-risk-score {
grid-template-columns: 1fr;
}
}
@media (max-width: 767px) {
body.fi-panel-support .fi-main {
padding-inline: 0.75rem;
}
body.fi-panel-support .fi-page .fi-section-content {
padding: 0.65rem 0.75rem 0.85rem !important;
}
}
body.fi-panel-support a:focus-visible,
body.fi-panel-support button:focus-visible,
body.fi-panel-support input:focus-visible,
body.fi-panel-support select:focus-visible,
body.fi-panel-support textarea:focus-visible,
body.fi-panel-support [role="tab"]:focus-visible {
outline: 2px solid #ea580c;
outline-offset: 2px;
}

/* Page-level modal above raised form columns (see support-contrast-fixes.blade.php) */
body.fi-panel-support:has(.fi-modal.fi-modal-open) .fi-page-content :is(.fi-section, .fi-grid-col, .fi-fo-field-wrp, .fi-fo-select-wrp, .fi-input-wrp, .fi-select-input, .fi-select-input-ctn, .choices) {
z-index: auto !important;
}