@media (max-width: 767px) {
.fi-ta-header-ctn .fi-ta-filters-above-content-ctn > .fi-ta-filters-trigger-action-ctn,
.fi-ta-filters-trigger-action-ctn {
display: block !important;
width: 100% !important;
max-width: 100% !important;
justify-self: stretch !important;
margin: 0 !important;
}
.fi-ta-header-ctn .fi-ta-filters-above-content-ctn .fi-ta-filters-trigger-action-ctn > *,
.fi-ta-header-ctn .fi-ta-filters-above-content-ctn .fi-ta-filters-trigger-action-ctn .fi-btn,
.fi-ta-filters-trigger-action-ctn > *,
.fi-ta-filters-trigger-action-ctn .fi-btn,
.fi-ta-filters-trigger-action-ctn .fi-icon-btn,
.fi-ta-filters-trigger-action {
display: inline-flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: center !important;
gap: 0.45rem !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: auto !important;
min-height: 2.5rem !important;
padding-inline: 1rem !important;
padding-block: 0.55rem !important;
white-space: nowrap !important;
box-sizing: border-box !important;
flex-shrink: 1 !important;
}
.fi-ta-filters-trigger-action-ctn .fi-btn-label,
.fi-ta-filters-trigger-action .fi-btn-label {
display: inline !important;
font-size: 13px !important;
white-space: nowrap !important;
}
.fi-ta-filters-trigger-action-ctn svg,
.fi-ta-filters-trigger-action svg {
width: 16px !important;
height: 16px !important;
flex-shrink: 0 !important;
}
.fi-ta-filters-trigger-action-ctn .fi-badge {
position: static !important;
margin-inline-start: auto !important;
box-shadow: none !important;
flex-shrink: 0 !important;
}
}
.fi-ta-filters-above-content-ctn .fi-ta-filters-header,
.fi-ta-filters .fi-ta-filters-header,
.fi-ta-filters > .fi-section-header,
.fi-ta-filters-heading {
display: none !important;
}
.fi-ta-filters .fi-ta-filters-indicators,
.fi-ta-filters .fi-ta-filter-indicators,
.fi-ta-filters-above-content-ctn .fi-ta-filters-indicators {
display: none !important;
}
.fi-ta-filters > *:empty,
.fi-ta-filters > * > *:empty,
.fi-ta-filters .fi-fo-component-ctn > *:empty {
display: none !important;
margin: 0 !important;
padding: 0 !important;
border: 0 !important;
}
.fi-ta-filters-above-content-ctn .fi-ta-filters .fi-fo-grid,
.fi-ta-filters-above-content-ctn .fi-ta-filters .fi-sc-grid,
.fi-ta-filters .fi-fo-grid,
.fi-ta-filters .fi-sc-grid {
display: flex !important;
flex-wrap: nowrap !important;
align-items: flex-end !important;
gap: 0.75rem !important;
width: 100% !important;
}
.fi-ta-filters .fi-fo-grid > *,
.fi-ta-filters .fi-sc-grid > * {
flex: 1 1 0 !important;
min-width: 0 !important;
max-width: none !important;
grid-column: auto !important;
}
.fi-ta-filters *:has(> .fi-fo-field-wrp + .fi-fo-field-wrp),
.fi-ta-filters *:has(> .fi-sc-component + .fi-sc-component),
.fi-ta-filters *:has(> .fi-schema-component + .fi-schema-component) {
display: flex !important;
flex-direction: row !important;
flex-wrap: nowrap !important;
align-items: flex-end !important;
gap: 0.75rem !important;
width: 100% !important;
}
.fi-ta-filters *:has(> .fi-fo-field-wrp + .fi-fo-field-wrp) > .fi-fo-field-wrp,
.fi-ta-filters *:has(> .fi-sc-component + .fi-sc-component) > .fi-sc-component,
.fi-ta-filters *:has(> .fi-schema-component + .fi-schema-component) > .fi-schema-component {
flex: 1 1 0 !important;
min-width: 0 !important;
max-width: none !important;
margin: 0 !important;
}
@media (max-width: 639px) {
.fi-ta-filters *:has(> .fi-fo-field-wrp + .fi-fo-field-wrp),
.fi-ta-filters *:has(> .fi-sc-component + .fi-sc-component),
.fi-ta-filters *:has(> .fi-schema-component + .fi-schema-component) {
flex-wrap: wrap !important;
}
.fi-ta-filters .fi-fo-grid,
.fi-ta-filters .fi-sc-grid {
flex-wrap: wrap !important;
}
.fi-ta-filters .fi-fo-grid > *,
.fi-ta-filters .fi-sc-grid > * {
flex: 1 1 100% !important;
}
}
.fi-ta-filters-above-content-ctn .fi-ta-filters,
.fi-ta-header-ctn .fi-ta-filters-above-content-ctn > .fi-ta-filters {
border-radius: 0 !important;
}
.fi-ta-filters .fi-fo-field-wrp,
.fi-ta-filters .fi-input-wrp,
.fi-ta-filters .fi-input,
.fi-ta-filters .fi-select-input {
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
}
.fi-ta-filters *:has(> .fi-ta-filters-actions-ctn),
.fi-ta-filters-above-content-ctn.fi-open > .fi-ta-filters:has(> .fi-ta-filters-actions-ctn) {
display: flex !important;
align-items: flex-end !important;
flex-wrap: wrap !important;
gap: 0.85rem !important;
width: 100% !important;
}
.fi-ta-filters *:has(> .fi-ta-filters-actions-ctn) > *:not(.fi-ta-filters-actions-ctn),
.fi-ta-filters-above-content-ctn.fi-open > .fi-ta-filters:has(> .fi-ta-filters-actions-ctn) > *:not(.fi-ta-filters-actions-ctn) {
flex: 1 1 260px !important;
min-width: 0 !important;
}
.fi-ta-filters-above-content-ctn .fi-ta-filters-actions-ctn,
.fi-ta-filters .fi-ta-filters-actions-ctn {
flex: 0 0 auto !important;
margin-block-start: 0 !important;
padding-block-start: 0 !important;
border-top: 0 !important;
align-items: flex-end !important;
}
@media (max-width: 639px) {
.fi-ta-filters-above-content-ctn .fi-ta-filters-actions-ctn,
.fi-ta-filters .fi-ta-filters-actions-ctn {
display: flex !important;
width: 100% !important;
gap: 0.5rem !important;
}
.fi-ta-filters-above-content-ctn .fi-ta-filters-actions-ctn > *,
.fi-ta-filters .fi-ta-filters-actions-ctn > * {
flex: 1 1 0 !important;
justify-content: center !important;
text-align: center !important;
}
}
.fi-ta-pagination {
padding: 0.6rem 0.85rem !important;
border-top: 1px solid #f1f1f4 !important;
background: transparent !important;
}
.dark .fi-ta-pagination { border-top-color: rgba(255,255,255,.06) !important; }
.fi-ta-pagination .fi-pagination-item,
.fi-pagination-item {
min-width: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
padding: 0.28rem 0.5rem !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #71717a !important;
font-size: 0.78rem !important;
font-weight: 500 !important;
line-height: 1.2 !important;
transition: background-color .13s ease, color .13s ease !important;
}
.fi-ta-pagination .fi-pagination-item-label,
.fi-pagination-item-label {
min-width: 0 !important;
width: auto !important;
height: auto !important;
min-height: 0 !important;
padding: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
font-size: 0.78rem !important;
font-weight: 500 !important;
line-height: 1.2 !important;
}
.fi-ta-pagination .fi-pagination-item:hover,
.fi-pagination-item:hover {
background: #f4f4f5 !important;
color: #18181b !important;
}
.dark .fi-pagination-item:hover { background: rgba(255,255,255,.06) !important; color: #fafafa !important; }
.fi-ta-pagination .fi-pagination-item[aria-current="page"],
.fi-pagination-item[aria-current="page"],
.fi-pagination-item-active {
background: #f97316 !important;
color: #ffffff !important;
font-weight: 700 !important;
box-shadow: none !important;
border-radius: 0 !important;
}
.fi-pagination-item[aria-current="page"] .fi-pagination-item-label,
.fi-pagination-item[aria-current="page"] span,
.fi-pagination-item-active .fi-pagination-item-label,
.fi-pagination-item-active span {
color: #ffffff !important;
font-weight: 700 !important;
}
.fi-ta-pagination .fi-pagination-item svg,
.fi-pagination-item svg {
width: 0.9rem !important;
height: 0.9rem !important;
}
.fi-ta-pagination .fi-pagination-items-per-page-select .fi-input-wrp,
.fi-pagination-items-per-page-select .fi-input-wrp {
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
border-radius: 0 !important;
}
.fi-ta-pagination .fi-pagination-items-per-page-select .fi-select-input,
.fi-pagination-items-per-page-select .fi-select-input {
height: 1.9rem !important;
min-height: 1.9rem !important;
font-size: 0.78rem !important;
padding-inline-start: 0.25rem !important;
color: #52525b !important;
}
.dark .fi-pagination-items-per-page-select .fi-select-input { color: #d4d4d8 !important; }
.fi-ta-pagination .fi-pagination-items-per-page-select label,
.fi-pagination-items-per-page-select label,
.fi-pagination-overview {
font-size: 0.72rem !important;
color: #a1a1aa !important;
font-weight: 500 !important;
}
@media (max-width: 639px) {
.fi-ta-pagination { padding: 0.5rem 0.6rem !important; }
.fi-ta-pagination .fi-pagination-item,
.fi-pagination-item {
padding: 0.24rem 0.42rem !important;
font-size: 0.72rem !important;
}
}
.fi-section,
.fi-wi,
.fi-wi-chart,
.fi-wi-stats-overview,
.fi-wi-stats-overview-stat,
.fi-wi-stats-overview .fi-wi-stats-overview-stat,
.fi-wi-stats-overview-stats-ctn,
.tya-sc-card,
.tya-hs-card,
.tya-card,
.tya-summary-card,
.tya-outlet-card,
.cmr-card {
border: 0 !important;
outline: 0 !important;
box-shadow: 0 1px 2px rgba(24, 24, 27, .05), 0 4px 14px rgba(24, 24, 27, .05) !important;
}
.tya-hs-card,
.tya-hs-icon-ctn {
border-radius: 0 !important;
}
.fi-wi-stats-overview,
.fi-wi-stats-overview-stats-ctn {
box-shadow: none !important;
background: transparent !important;
}
.dark .fi-section,
.dark .fi-wi,
.dark .fi-wi-chart,
.dark .tya-sc-card,
.dark .tya-hs-card,
.dark .tya-card,
.dark .tya-summary-card,
.dark .tya-outlet-card,
.dark .cmr-card {
box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 4px 14px rgba(0, 0, 0, .25) !important;
}
.fi-wi .fi-section-header,
.fi-wi-chart .fi-section-header,
.fi-section > .fi-section-header {
border-bottom: 0 !important;
}
.fi-modal-content .fi-section {
box-shadow: none !important;
}
.tya-donut-head {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.5rem !important;
padding-block-end: 0.6rem !important;
margin-block-end: 0.7rem !important;
border-bottom: 1px solid #f0f0f2 !important;
}
.dark .tya-donut-head { border-bottom-color: rgba(255,255,255,.07) !important; }
.tya-donut-head-icon {
width: auto !important;
height: auto !important;
flex-shrink: 0 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
background: transparent !important;
color: #f97316 !important;
padding: 0 !important;
border: 0 !important;
}
.tya-donut-head-icon svg { width: 1.1rem !important; height: 1.1rem !important; }
.tya-donut-head-title {
font-size: 0.78rem !important;
font-weight: 800 !important;
text-transform: uppercase !important;
letter-spacing: 0.01em !important;
line-height: 1.2 !important;
}
.tya-donut-head-dark { color: #18181b !important; }
.dark .tya-donut-head-dark { color: #fafafa !important; }
.tya-donut-head-accent { color: #f97316 !important; }
.tya-donut-legend {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 0.22rem 0.6rem !important;
max-height: none !important;
overflow: visible !important;
margin-block-start: 0.7rem !important;
}
.tya-donut-legend-row {
display: grid !important;
grid-template-columns: 0.55rem minmax(0, 1fr) auto !important;
align-items: center !important;
gap: 0.4rem !important;
padding: 0.26rem 0.15rem !important;
border-block-end: 0 !important;
background: transparent !important;
}
.dark .tya-donut-legend-row { background: transparent !important; }
.tya-donut-dot {
width: 0.55rem !important;
height: 0.55rem !important;
border-radius: 999px !important;
}
.tya-donut-name {
font-size: 0.64rem !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: 0.01em !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
.tya-donut-pct {
font-size: 0.6rem !important;
font-weight: 700 !important;
padding: 0.1rem 0.35rem !important;
border-radius: 0.3rem !important;
justify-self: end !important;
}
.tya-donut-amount { display: none !important; }
@media (max-width: 639px) {
.tya-donut-legend {
grid-template-columns: minmax(0, 1fr) !important;
}
}
@media (max-width: 639px) {
.fi-wi-chart canvas {
max-height: 240px !important;
}
.tya-revsum {
gap: 0.5rem !important;
}
.tya-revsum-box {
padding: 0.55rem 0.6rem !important;
gap: 0.45rem !important;
}
.tya-revsum-label {
font-size: 9.5px !important;
letter-spacing: 0 !important;
}
.tya-revsum-value {
font-size: 11.5px !important;
}
.tya-revsum-delta {
font-size: 9px !important;
}
.tya-revsum-icon {
width: 1.6rem !important;
height: 1.6rem !important;
}
.tya-revsum-icon svg {
width: 0.85rem !important;
height: 0.85rem !important;
}
}
.fi-modal-content .fi-sc-wizard-header,
.fi-modal-content .fi-fo-wizard-header {
padding-block-end: 0.8rem !important;
margin-block-end: 1rem !important;
overflow-x: auto !important;
scrollbar-width: none !important;
}
.fi-modal-content .fi-sc-wizard-header::-webkit-scrollbar,
.fi-modal-content .fi-fo-wizard-header::-webkit-scrollbar { display: none !important; }
.fi-modal-content .fi-sc-wizard-header-step-label,
.fi-modal-content .fi-fo-wizard-header-step-label {
font-size: 9.5px !important;
letter-spacing: 0.04em !important;
}
.fi-modal-content .fi-sc-wizard-header-step-description,
.fi-modal-content .fi-fo-wizard-header-step-description {
display: none !important;
}
.fi-modal-content .fi-sc-wizard-header-step-icon-ctn,
.fi-modal-content .fi-fo-wizard-header-step-icon-ctn {
width: 1.6rem !important;
height: 1.6rem !important;
}
.fi-modal-content .fi-sc-wizard-header-step-icon-ctn svg,
.fi-modal-content .fi-fo-wizard-header-step-icon-ctn svg {
width: 0.85rem !important;
height: 0.85rem !important;
}
.fi-modal-content .fi-sc-wizard-header + * .fi-ac,
.fi-modal-content .fi-sc-wizard-actions,
.fi-modal-content .fi-fo-wizard-actions {
gap: 0.5rem !important;
margin-block-start: 1.1rem !important;
}
.fi-modal-content .fi-btn svg {
width: 0.9rem !important;
height: 0.9rem !important;
}
.tya-nas-wizard {
--spacing: 0.2rem !important;
}
.tya-nas-wizard .fi-fo-component-ctn,
.tya-nas-wizard .fi-schema-component-ctn {
gap: 0.85rem !important;
}
.tya-nas-wizard .fi-fo-field-wrp-label {
margin-block-end: 0.25rem !important;
}
.tya-nas-wizard .fi-sc-actions {
margin-block: 0.35rem 0 !important;
}
.tya-nas-wizard .fi-sc-wizard-footer {
margin-block-start: 0.9rem !important;
padding-block-end: 1rem !important;
}
.tya-nas-wizard .fi-sc-wizard-step {
min-height: 200px;
transition: min-height 120ms ease;
}
@media (min-width: 1024px) and (min-height: 700px) {
.fi-page .fi-wi-ctn,
.fi-page .fi-wi-grid {
gap: 0.6rem !important;
}
.fi-page .fi-wi:first-child .fi-section {
padding-block: 0.7rem !important;
}
.fi-wi-stats-overview-stat {
padding: 0.6rem 0.75rem 2.1rem !important;
}
.fi-wi-stats-overview-stat-value {
font-size: 1.05rem !important;
}
.fi-wi-stats-overview-stat-label {
font-size: 0.68rem !important;
}
.fi-wi-stats-overview-stat-description {
font-size: 0.62rem !important;
}
.fi-wi-stats-overview-stat-chart,
.fi-wi-stats-overview-stat canvas {
max-height: 30px !important;
}
.fi-wi .fi-ta-content {
max-height: 10rem !important;
overflow-y: auto !important;
}
.fi-wi .tya-donut-legend {
max-height: none !important;
overflow: visible !important;
}
.fi-wi .fi-ta-pagination {
display: none !important;
}
.fi-wi .fi-section-header:empty,
.fi-wi .fi-section-header-description:empty,
.fi-wi .fi-section-header-heading:empty,
.fi-wi .fi-section-content-ctn > *:empty {
display: none !important;
}
.fi-wi-chart .fi-section-header {
min-height: 0 !important;
padding-block: 0 !important;
margin-block-end: 0.3rem !important;
border-bottom: 0 !important;
}
.tya-donut-widget .fi-section-header {
display: none !important;
}
.fi-wi-chart-frame,
.fi-wi-chart-canvas-ctn {
margin-block: 0 !important;
}
.fi-page .fi-wi .fi-section {
padding: 0.75rem 0.9rem !important;
}
.fi-page .fi-wi .fi-section-header {
padding-block-end: 0.5rem !important;
margin-block-end: 0.6rem !important;
}
.fi-wi .fi-ta-table td,
.fi-wi .fi-ta-table th {
padding-block: 0.3rem !important;
font-size: 11px !important;
height: auto !important;
}
.tya-revsum-box {
padding: 0.5rem 0.6rem !important;
}
.tya-revsum-value {
font-size: 0.9rem !important;
}
.tya-revsum-label {
font-size: 0.62rem !important;
}
.tya-revsum-icon {
width: 1.7rem !important;
height: 1.7rem !important;
}
.tya-revsum-icon svg {
width: 0.9rem !important;
height: 0.9rem !important;
}
}
.tya-revsum-3 {
display: grid !important;
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 0.5rem !important;
}
.tya-revsum-icon-hotspot {
background: rgba(37, 99, 235, 0.12) !important;
color: #2563eb !important;
}
.tya-revsum-icon-pppoe {
background: rgba(234, 179, 8, 0.18) !important;
color: #a16207 !important;
}
.fi-section,
.fi-section-content-ctn,
.fi-modal-window,
.fi-modal-header,
.fi-modal-footer,
.fi-input-wrp,
.fi-input,
.fi-select-input,
.choices__inner,
.fi-btn,
.fi-icon-btn,
.fi-badge,
.fi-ta-ctn,
.fi-ta-content,
.fi-ta-table,
.fi-ta-filters,
.fi-ta-search-field .fi-input-wrp,
.fi-fo-repeater-item,
.fi-fo-file-upload .filepond--panel-root,
.fi-fo-file-upload .filepond--drop-label,
.fi-wi,
.fi-wi-stats-overview-stat,
.fi-pagination-item,
.fi-sidebar-item-btn,
.fi-sidebar-group-btn,
.fi-header,
.fi-page,
.tya-card,
.tya-summary-card,
.tya-outlet-card,
.tya-outlet-foot,
.tya-report-filter-card,
.tya-print-btn,
.tya-tab-btn,
.tya-type-card,
.tya-select-native,
.cmr-card,
.cmr-table,
.cmr-foot {
border-radius: 0 !important;
}
[role="switch"],
[role="switch"] span,
input[type="radio"],
.fi-avatar,
.fi-user-avatar,
.fi-loading-indicator,
.animate-spin {
border-radius: 999px !important;
}
input[type="checkbox"],
.fi-checkbox-input,
.fi-ta-record-checkbox,
.fi-ta-selection-checkbox {
appearance: none !important;
-webkit-appearance: none !important;
width: 1rem !important;
height: 1rem !important;
border: 1.5px solid #cbd2dd !important;
border-radius: 0 !important;
background-color: #fff !important;
background-image: none !important;
background-position: center !important;
background-repeat: no-repeat !important;
background-size: 0.7rem !important;
box-shadow: none !important;
cursor: pointer !important;
transition: background-color .13s ease, border-color .13s ease !important;
flex-shrink: 0 !important;
--tw-ring-color: transparent !important;
--tw-ring-shadow: 0 0 #0000 !important;
--tw-ring-offset-shadow: 0 0 #0000 !important;
}
input[type="checkbox"]:hover,
.fi-checkbox-input:hover {
border-color: #f97316 !important;
}
input[type="checkbox"]:checked,
.fi-checkbox-input:checked,
.fi-ta-record-checkbox:checked,
.fi-ta-selection-checkbox:checked {
background-color: #f97316 !important;
border-color: #f97316 !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 8.5l3.2 3.2L13 5'/%3E%3C/svg%3E") !important;
}
input[type="checkbox"]:indeterminate,
.fi-checkbox-input:indeterminate {
background-color: #f97316 !important;
border-color: #f97316 !important;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='square'%3E%3Cpath d='M4 8h8'/%3E%3C/svg%3E") !important;
}
input[type="checkbox"]:focus-visible,
.fi-checkbox-input:focus-visible {
outline: 2px solid rgba(249, 115, 22, .35) !important;
outline-offset: 1px !important;
}
.dark input[type="checkbox"],
.dark .fi-checkbox-input {
background-color: #26262a !important;
border-color: rgba(255, 255, 255, .22) !important;
}
input[type="radio"] {
accent-color: #f97316 !important;
}
@media (max-width: 639px) {
.fi-ta-content,
.fi-ta-ctn {
overflow-x: auto !important;
-webkit-overflow-scrolling: touch !important;
}
table.fi-ta-table {
table-layout: auto !important;
width: auto !important;
min-width: 100% !important;
}
table.fi-ta-table th,
table.fi-ta-table td {
white-space: nowrap !important;
width: 1% !important;
padding-inline: 0.4rem !important;
padding-block: 0.28rem !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
font-size: 10px !important;
line-height: 1.35 !important;
}
table.fi-ta-table th {
font-size: 9px !important;
letter-spacing: 0.02em !important;
}
.fi-ta-table .fi-badge {
font-size: 9px !important;
padding-inline: 0.32rem !important;
padding-block: 0.05rem !important;
}
.fi-ta-table .fi-ta-actions {
gap: 0.15rem !important;
}
.fi-ta-table .fi-ta-actions .fi-icon-btn {
width: 1.45rem !important;
height: 1.45rem !important;
padding: 0 !important;
}
.fi-ta-table .fi-ta-actions .fi-icon-btn svg {
width: 0.8rem !important;
height: 0.8rem !important;
}
table.fi-ta-table th:has(input[type="checkbox"]),
table.fi-ta-table td:has(input[type="checkbox"]) {
width: 1.6rem !important;
padding-inline: 0.3rem !important;
}
table.fi-ta-table input[type="checkbox"] {
width: 0.85rem !important;
height: 0.85rem !important;
background-size: 0.6rem !important;
}
}
@media (max-width: 639px) {
.fi-fo-grid,
.fi-sc-grid,
.fi-schema-component-ctn > .grid,
.fi-modal-content .grid,
.fi-section-content-ctn > .grid {
grid-template-columns: 1fr !important;
}
.fi-fo-field-wrp,
.fi-sc-component,
.fi-schema-component {
grid-column: 1 / -1 !important;
}
.fi-fo-field-wrp,
.fi-sc-component,
.fi-schema-component,
.fi-input-wrp,
.fi-modal-content,
.fi-section {
min-width: 0 !important;
max-width: 100% !important;
}
.fi-modal-content,
.fi-section {
overflow-x: hidden !important;
}
.fi-input-wrp .fi-icon svg,
.fi-fo-field-wrp .fi-icon svg,
.fi-section-header .fi-icon svg {
width: 1rem !important;
height: 1rem !important;
}
.fi-icon-btn {
width: 2rem !important;
height: 2rem !important;
padding: 0 !important;
}
.fi-icon-btn svg {
width: 1rem !important;
height: 1rem !important;
}
.fi-modal-footer .fi-ac,
.fi-form-actions .fi-ac {
display: flex !important;
width: 100% !important;
gap: 0.5rem !important;
}
.fi-modal-footer .fi-ac .fi-btn,
.fi-form-actions .fi-ac .fi-btn {
flex: 1 1 0 !important;
justify-content: center !important;
}
.fi-sc-wizard-header,
.fi-fo-wizard-header {
overflow-x: auto !important;
-webkit-overflow-scrolling: touch !important;
scrollbar-width: none !important;
}
.fi-sc-wizard-header::-webkit-scrollbar,
.fi-fo-wizard-header::-webkit-scrollbar { display: none !important; }
}
.fi-sidebar .fi-dropdown {
position: relative !important;
}
.fi-sidebar .fi-dropdown-panel {
position: absolute !important;
left: calc(100% + 1.75rem) !important;
right: auto !important;
top: 0 !important;
bottom: auto !important;
transform: none !important;
margin: 0 !important;
min-width: 12.5rem !important;
z-index: 60 !important;
padding: 0 !important;
border: 1px solid #e4e4e7 !important;
border-radius: 0 !important;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
overflow: hidden !important;
}
.fi-sidebar .fi-dropdown-panel .fi-dropdown-header {
padding: 0.55rem 0.75rem 0.4rem !important;
font-size: 0.66rem !important;
font-weight: 800 !important;
text-transform: uppercase !important;
letter-spacing: 0.06em !important;
color: #a1a1aa !important;
border-bottom: 1px solid #f4f4f5 !important;
}
.fi-sidebar .fi-dropdown-panel .fi-dropdown-list {
padding: 0.2rem !important;
row-gap: 0 !important;
}
.fi-sidebar .fi-dropdown-panel .fi-dropdown-list-item {
border-radius: 0 !important;
padding: 0.42rem 0.55rem !important;
font-size: 0.8rem !important;
font-weight: 600 !important;
color: #3f3f46 !important;
}
.fi-sidebar .fi-dropdown-panel .fi-dropdown-list-item:hover {
background: rgba(249, 115, 22, 0.1) !important;
color: #ea580c !important;
}
.fi-sidebar .fi-dropdown-panel .fi-dropdown-list-item-label {
font-size: inherit !important;
font-weight: inherit !important;
color: inherit !important;
}
.dark .fi-sidebar .fi-dropdown-panel {
border-color: rgba(255, 255, 255, 0.08) !important;
}
.dark .fi-sidebar .fi-dropdown-panel .fi-dropdown-header {
border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}
.dark .fi-sidebar .fi-dropdown-panel .fi-dropdown-list-item {
color: #d4d4d8 !important;
}
.fi-sidebar-open .tya-help-dock {
position: fixed !important;
inset-inline-start: 0 !important;
bottom: 0 !important;
width: var(--sidebar-width, 16.5rem) !important;
box-sizing: border-box !important;
margin: 0 !important;
padding: 0.55rem 0.95rem 0.45rem !important;
z-index: 31 !important;
background: #ffffff !important;
border-inline-end: 1px solid rgb(228 228 231) !important;
}
.dark .fi-sidebar-open .tya-help-dock {
background: #18181b !important;
border-inline-end-color: rgba(255, 255, 255, 0.08) !important;
}
.fi-sidebar-open .fi-sidebar-nav {
padding-bottom: 11.5rem !important;
}
.fi-sidebar-open .tya-help-card {
position: relative !important;
overflow: hidden !important;
margin: 0 !important;
padding: 0.6rem 0.6rem 0.65rem !important;
border: none !important;
border-radius: 0.9rem !important;
background: linear-gradient(150deg, #fff6ef 0%, #ffeadd 55%, #ffe3d2 100%) !important;
box-shadow: none !important;
}
.dark .fi-sidebar-open .tya-help-card {
background: linear-gradient(150deg, rgba(249,115,22,.14) 0%, rgba(249,115,22,.08) 100%) !important;
}
.tya-help-blob {
position: absolute;
top: -2.2rem;
inset-inline-end: -2.2rem;
width: 6rem;
height: 6rem;
border-radius: 999px;
background: rgba(249, 115, 22, 0.10);
pointer-events: none;
}
.tya-help-head {
position: relative;
display: flex !important;
align-items: flex-start !important;
gap: 0.45rem !important;
margin-block-end: 0.6rem !important;
}
.tya-help-badge {
flex-shrink: 0;
width: 1.8rem;
height: 1.8rem;
border-radius: 999px;
background: #f97316;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4px 10px rgba(249, 115, 22, 0.35);
}
.tya-help-badge .tya-help-icon {
width: 1rem !important;
height: 1rem !important;
color: #ffffff !important;
}
.tya-help-title {
font-size: 0.76rem !important;
font-weight: 800 !important;
color: #1c1917 !important;
line-height: 1.2 !important;
}
.dark .tya-help-title { color: #fafafa !important; }
.tya-help-sub {
font-size: 0.62rem !important;
font-weight: 500 !important;
color: #8a8a93 !important;
line-height: 1.35 !important;
margin-block-start: 0.15rem !important;
}
.fi-sidebar-open .tya-help-btn {
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.5rem !important;
width: 100% !important;
box-sizing: border-box !important;
padding: 0.42rem 0.6rem !important;
border: none !important;
border-radius: 0.6rem !important;
background: #f97316 !important;
color: #ffffff !important;
font-size: 0.7rem !important;
font-weight: 700 !important;
text-decoration: none !important;
box-shadow: 0 4px 12px rgba(249, 115, 22, 0.35) !important;
transition: background-color .15s ease, transform .15s ease !important;
}
.fi-sidebar-open .tya-help-btn:hover {
background: #ea580c !important;
transform: translateY(-1px) !important;
}
.tya-help-btn-icon {
width: 0.85rem !important;
height: 0.85rem !important;
color: #ffffff !important;
}
.tya-help-brand {
text-align: center;
padding-block-start: 0.55rem;
}
.tya-help-brand-name {
font-size: 0.73rem;
font-weight: 800;
color: #1c1917;
letter-spacing: -0.01em;
line-height: 1.1;
}
.tya-help-brand-name span { color: #f97316; }
.dark .tya-help-brand-name { color: #fafafa; }
.tya-help-brand-tag {
font-size: 0.53rem;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #b4b4bb;
margin-block-start: 0.2rem;
}
.fi-ta-cell .fi-toggle,
td .fi-toggle {
transform: scale(0.8) !important;
transform-origin: center !important;
}