:root {
    --showcase-icon-size: 1.25rem;
    --showcase-avatar-size: 2rem;
    --showcase-avatar-margin-left: 0.75rem;
    --showcase-header-padding: 0.625rem;
    --showcase-toolbar-margin-bottom: 1rem;
    --showcase-module-content-padding: 1rem;
    --showcase-toolbar-padding-x: 0.375rem;
    --showcase-messagelist-padding-x: 1.25rem;
    --showcase-messagelist-padding-y: 2rem;
    --showcase-submitarea-padding-x: 1.25rem;
    --showcase-submitarea-padding-y: 0.5rem;
}

.small-size {
    --showcase-icon-size: 1rem;
    --showcase-avatar-size: 1.5rem;
    --showcase-avatar-margin-left: 0.5rem;
    --showcase-toolbar-padding-x: 0.25rem;
    --showcase-messagelist-padding-x: 0.75rem;
    --showcase-messagelist-padding-y: 1.5rem;
    --showcase-submitarea-padding-x: 0.75rem;
    --showcase-submitarea-padding-y: 0.375rem;
}

.large-size {
    --showcase-icon-size: 1.5rem;
    --showcase-avatar-size: 2.5rem;
    --showcase-avatar-margin-left: 1rem;
    --showcase-toolbar-padding-x: 0.5rem;
    --showcase-messagelist-padding-x: 1.75rem;
    --showcase-messagelist-padding-y: 2.5rem;
    --showcase-submitarea-padding-x: 1.75rem;
    --showcase-submitarea-padding-y: 0.625rem;
}

html, body {
    height: 100%;
}

body {
    margin: 0;
    letter-spacing: var(--dxds-letter-spacing-base-md);
    background-color: var(--dxds-color-surface-neutral-subdued-rest);
}

*, ::after, ::before {
    box-sizing: border-box
}

.icon {
    opacity: 0.7;
    background-size: contain;
    mask-repeat: no-repeat;
    mask-position: center center;
    mask-size: 100% 100%;
    background-color: currentColor;
}

.medium-icon {
    width: var(--showcase-icon-size);
    height: var(--showcase-icon-size);
}

.avatar {
    width: var(--showcase-avatar-size);
    height: var(--showcase-avatar-size);
    margin-left: var(--showcase-avatar-margin-left);
}

.icon.small-icon {
    width: 0.75rem;
    height: 0.75rem;
}

.add-icon {
    mask-image: url("images/icons/add.svg");
}

.ai-chat-icon {
    mask-image: url("images/icons/ai-chat.svg");
}

.arrow-export-up-icon {
    mask-image: url("images/icons/arrow-export-up.svg");
}

.arrow-left-icon {
    mask-image: url("images/icons/arrow-left.svg");
}

.arrow-sync-icon {
    mask-image: url("images/icons/arrow-sync.svg");
}

.bell-icon {
    mask-image: url("images/icons/bell.svg");
}

.calendar-icon {
    mask-image: url("images/icons/calendar.svg");
}

.call-icon {
    mask-image: url("images/icons/call.svg");
}

.chevron-down-icon {
    mask-image: url("images/icons/chevron-down.svg");
}

.chevron-up-icon {
    mask-image: url("images/icons/chevron-up.svg");
}

.column-chooser-icon {
    mask-image: url("images/icons/column-chooser.svg");
}

.copy-icon {
    mask-image: url("images/icons/copy.svg");
}

.data-area-icon {
    mask-image: url("images/icons/data-area.svg");
}

.data-histogram-icon {
    mask-image: url("images/icons/data-histogram.svg");
}

.data-pie-icon {
    mask-image: url("images/icons/data-pie.svg");
}

.data-trending-icon {
    mask-image: url("images/icons/data-trending.svg");
}

.data-usage-icon {
    mask-image: url("images/icons/data-usage.svg");
}

.dismiss-icon {
    mask-image: url("images/icons/dismiss.svg");
}

.edit-icon {
    mask-image: url("images/icons/edit.svg");
}

.github-icon {
    mask-image: url("images/icons/github.svg");
}

.lock-closed-icon {
    mask-image: url("images/icons/lock-closed.svg");
}

.lock-open-icon {
    mask-image: url("images/icons/lock-open.svg");
}

.mail-icon {
    mask-image: url("images/icons/mail.svg");
}

.more-horizontal-icon {
    mask-image: url("images/icons/more-horizontal.svg");
}

.navigation-icon {
    mask-image: url("images/icons/navigation.svg");
}

.person-add-icon {
    mask-image: url("images/icons/person-add.svg");
}

.person-icon {
    mask-image: url("images/icons/person.svg");
}

.phone-desktop-icon {
    mask-image: url("images/icons/phone-desktop.svg");
}

.sign-out-icon {
    mask-image: url("images/icons/sign-out.svg");
}

.weather-moon-icon {
    mask-image: url("images/icons/weather-moon.svg");
}

.weather-sunny-icon {
    mask-image: url("images/icons/weather-sunny.svg");
}

.accountbox-icon {
    mask-image: url("images/icons/accountbox.svg");
}

.action_cancel-icon {
    mask-image: url("images/icons/Action_Cancel.svg");
}

.action_change_state-icon {
    mask-image: url("images/icons/Action_Change_State.svg");
}

.action_clear-icon {
    mask-image: url("images/icons/Action_Clear.svg");
}

.action_clear_settings-icon {
    mask-image: url("images/icons/Action_Clear_Settings.svg");
}

.action_clonemerge_clone_object-icon {
    mask-image: url("images/icons/Action_CloneMerge_Clone_Object.svg");
}

.action_close-icon {
    mask-image: url("images/icons/Action_Close.svg");
}

.action_columnchooser-icon {
    mask-image: url("images/icons/Action_ColumnChooser.svg");
}

.action_copy-icon {
    mask-image: url("images/icons/Action_Copy.svg");
}

.action_createdashboard-icon {
    mask-image: url("images/icons/Action_CreateDashboard.svg");
}

.action_dashboard_designer-icon {
    mask-image: url("images/icons/Action_Dashboard_Designer.svg");
}

.action_dashboard_new-icon {
    mask-image: url("images/icons/Action_Dashboard_New.svg");
}

.action_dashboard_showdesigner-icon {
    mask-image: url("images/icons/Action_Dashboard_ShowDesigner.svg");
}

.action_dashboard_viewer-icon {
    mask-image: url("images/icons/Action_Dashboard_Viewer.svg");
}

.action_delete-icon {
    mask-image: url("images/icons/Action_Delete.svg");
}

.action_deletedashboard-icon {
    mask-image: url("images/icons/Action_DeleteDashboard.svg");
}

.action_edit-icon {
    mask-image: url("images/icons/Action_Edit.svg");
}

.action_editmodel-icon {
    mask-image: url("images/icons/Action_EditModel.svg");
}

.action_export-icon {
    mask-image: url("images/icons/Action_Export.svg");
}

.action_export_tocsv-icon {
    mask-image: url("images/icons/Action_Export_ToCSV.svg");
}

.action_export_todocx-icon {
    mask-image: url("images/icons/Action_Export_ToDOCX.svg");
}

.action_export_tohtml-icon {
    mask-image: url("images/icons/Action_Export_ToHTML.svg");
}

.action_export_toimage-icon {
    mask-image: url("images/icons/Action_Export_ToImage.svg");
}

.action_export_tomht-icon {
    mask-image: url("images/icons/Action_Export_ToMHT.svg");
}

.action_export_topdf-icon {
    mask-image: url("images/icons/Action_Export_ToPDF.svg");
}

.action_export_tortf-icon {
    mask-image: url("images/icons/Action_Export_ToRTF.svg");
}

.action_export_totext-icon {
    mask-image: url("images/icons/Action_Export_ToText.svg");
}

.action_export_toxls-icon {
    mask-image: url("images/icons/Action_Export_ToXLS.svg");
}

.action_export_toxlsx-icon {
    mask-image: url("images/icons/Action_Export_ToXLSX.svg");
}

.action_hideitem-icon {
    mask-image: url("images/icons/Action_HideItem.svg");
}

.action_hideitemfromdashboard-icon {
    mask-image: url("images/icons/Action_HideItemFromDashboard.svg");
}

.action_linkunlink_link-icon {
    mask-image: url("images/icons/Action_LinkUnlink_Link.svg");
}

.action_linkunlink_unlink-icon {
    mask-image: url("images/icons/Action_LinkUnlink_Unlink.svg");
}

.action_markcompleted-icon {
    mask-image: url("images/icons/Action_MarkCompleted.svg");
}

.action_modeldifferences_copy-icon {
    mask-image: url("images/icons/Action_ModelDifferences_Copy.svg");
}

.action_modeldifferences_create-icon {
    mask-image: url("images/icons/Action_ModelDifferences_Create.svg");
}

.action_modeldifferences_export-icon {
    mask-image: url("images/icons/Action_ModelDifferences_Export.svg");
}

.action_modeldifferences_import-icon {
    mask-image: url("images/icons/Action_ModelDifferences_Import.svg");
}

.action_modeldifferences_reset-icon {
    mask-image: url("images/icons/Action_ModelDifferences_Reset.svg");
}

.action_more-icon {
    mask-image: url("images/icons/Action_More.svg");
}

.action_navigation_chevron_left-icon {
    mask-image: url("images/icons/Action_Navigation_Chevron_Left.svg");
}

.action_navigation_chevron_right-icon {
    mask-image: url("images/icons/Action_Navigation_Chevron_Right.svg");
}

.action_navigation_next_object-icon {
    mask-image: url("images/icons/Action_Navigation_Next_Object.svg");
}

.action_navigation_previous_object-icon {
    mask-image: url("images/icons/Action_Navigation_Previous_Object.svg");
}

.action_new-icon {
    mask-image: url("images/icons/Action_New.svg");
}

.action_organizedashboard-icon {
    mask-image: url("images/icons/Action_OrganizeDashboard.svg");
}

.action_postpone-icon {
    mask-image: url("images/icons/Action_Postpone.svg");
}

.action_printing_preview-icon {
    mask-image: url("images/icons/Action_Printing_Preview.svg");
}

.action_refresh-icon {
    mask-image: url("images/icons/Action_Refresh.svg");
}

.action_report_showdesigner-icon {
    mask-image: url("images/icons/Action_Report_ShowDesigner.svg");
}

.action_resetpassword-icon {
    mask-image: url("images/icons/Action_ResetPassword.svg");
}

.action_save-icon {
    mask-image: url("images/icons/Action_Save.svg");
}

.action_save_close-icon {
    mask-image: url("images/icons/Action_Save_Close.svg");
}

.action_save_new-icon {
    mask-image: url("images/icons/Action_Save_New.svg");
}

.action_search-icon {
    mask-image: url("images/icons/Action_Search.svg");
}

.action_security_changepassword-icon {
    mask-image: url("images/icons/Action_Security_ChangePassword.svg");
}

.action_showinreport-icon {
    mask-image: url("images/icons/Action_ShowInReport.svg");
}

.action_showitemondashboard-icon {
    mask-image: url("images/icons/Action_ShowItemOnDashboard.svg");
}

.action_statemachine-icon {
    mask-image: url("images/icons/Action_StateMachine.svg");
}

.action_validation_validate-icon {
    mask-image: url("images/icons/Action_Validation_Validate.svg");
}

.add_group-icon {
    mask-image: url("images/icons/Add_Group.svg");
}

.addcirclefilled-icon {
    mask-image: url("images/icons/addcirclefilled.svg");
}

.addcircleoutline-icon {
    mask-image: url("images/icons/addcircleoutline.svg");
}

.add-header-icon {
    mask-image: url("images/icons/add-header.svg");
}

.add-table-icon {
    mask-image: url("images/icons/add-table.svg");
}

.airplane-icon {
    mask-image: url("images/icons/airplane.svg");
}

.aligncenter-icon {
    mask-image: url("images/icons/aligncenter.svg");
}

.alignjustify-icon {
    mask-image: url("images/icons/alignjustify.svg");
}

.alignleft-icon {
    mask-image: url("images/icons/alignleft.svg");
}

.alignright-icon {
    mask-image: url("images/icons/alignright.svg");
}

.arrowback-icon {
    mask-image: url("images/icons/arrowback.svg");
}

.arrowdown-icon {
    mask-image: url("images/icons/arrowdown.svg");
}

.arrowleft-icon {
    mask-image: url("images/icons/arrowleft.svg");
}

.arrowright-icon {
    mask-image: url("images/icons/arrowright.svg");
}

.arrowsortdown-icon {
    mask-image: url("images/icons/arrowsortdown.svg");
}

.arrowsortup-icon {
    mask-image: url("images/icons/arrowsortup.svg");
}

.arrowup-icon {
    mask-image: url("images/icons/arrowup.svg");
}

.attach-icon {
    mask-image: url("images/icons/attach.svg");
}

.attachment-icon {
    mask-image: url("images/icons/Attachment.svg");
}

.background-icon {
    mask-image: url("images/icons/background.svg");
}

.belloutline-icon {
    mask-image: url("images/icons/belloutline.svg");
}

.best_fit-icon {
    mask-image: url("images/icons/Best_Fit.svg");
}

.blockquote-icon {
    mask-image: url("images/icons/blockquote.svg");
}

.bmp-icon {
    mask-image: url("images/icons/bmp.svg");
}

.bo_audit_changehistory-icon {
    mask-image: url("images/icons/BO_Audit_ChangeHistory.svg");
}

.bo_calendar-icon {
    mask-image: url("images/icons/BO_Calendar.svg");
}

.bo_dashboard-icon {
    mask-image: url("images/icons/BO_Dashboard.svg");
}

.bo_department-icon {
    mask-image: url("images/icons/BO_Department.svg");
}

.bo_employee-icon {
    mask-image: url("images/icons/BO_Employee.svg");
}

.bo_folder-icon {
    mask-image: url("images/icons/BO_Folder.svg");
}

.bo_mailmerge-icon {
    mask-image: url("images/icons/BO_MailMerge.svg");
}

.bo_modeldifferences-icon {
    mask-image: url("images/icons/BO_ModelDifferences.svg");
}

.bo_mydetails-icon {
    mask-image: url("images/icons/BO_MyDetails.svg");
}

.bo_note-icon {
    mask-image: url("images/icons/BO_Note.svg");
}

.bo_person-icon {
    mask-image: url("images/icons/BO_Person.svg");
}

.bo_phone-icon {
    mask-image: url("images/icons/BO_Phone.svg");
}

.bo_report-icon {
    mask-image: url("images/icons/BO_Report.svg");
}

.bo_resources-icon {
    mask-image: url("images/icons/BO_Resources.svg");
}

.bo_resume-icon {
    mask-image: url("images/icons/BO_Resume.svg");
}

.bo_role-icon {
    mask-image: url("images/icons/BO_Role.svg");
}

.bo_saleitem-icon {
    mask-image: url("images/icons/BO_SaleItem.svg");
}

.bo_statemachine-icon {
    mask-image: url("images/icons/BO_StateMachine.svg");
}

.bo_task-icon {
    mask-image: url("images/icons/BO_Task.svg");
}

.bo_unknown-icon {
    mask-image: url("images/icons/BO_Unknown.svg");
}

.bo_user-icon {
    mask-image: url("images/icons/BO_User.svg");
}

.bold-icon {
    mask-image: url("images/icons/bold.svg");
}

.bookmark-icon {
    mask-image: url("images/icons/bookmark.svg");
}

.botfilled-icon {
    mask-image: url("images/icons/botfilled.svg");
}

.botoutline-icon {
    mask-image: url("images/icons/botoutline.svg");
}

.box-icon {
    mask-image: url("images/icons/box.svg");
}

.bulletlist-icon {
    mask-image: url("images/icons/bulletlist.svg");
}

.calendardateendfilled-icon {
    mask-image: url("images/icons/calendardateendfilled.svg");
}

.calendardateendoutline-icon {
    mask-image: url("images/icons/calendardateendoutline.svg");
}

.calendardatestartfilled-icon {
    mask-image: url("images/icons/calendardatestartfilled.svg");
}

.calendardatestartoutline-icon {
    mask-image: url("images/icons/calendardatestartoutline.svg");
}

.car-icon {
    mask-image: url("images/icons/car.svg");
}

.card-icon {
    mask-image: url("images/icons/card.svg");
}

.cardcontent-icon {
    mask-image: url("images/icons/cardcontent.svg");
}

.cart-icon {
    mask-image: url("images/icons/cart.svg");
}

.chart-icon {
    mask-image: url("images/icons/chart.svg");
}

.chat-icon {
    mask-image: url("images/icons/chat.svg");
}

.chatadd-icon {
    mask-image: url("images/icons/chatadd.svg");
}

.chatsparklefilled-icon {
    mask-image: url("images/icons/chatsparklefilled.svg");
}

.chatsparkleoutline-icon {
    mask-image: url("images/icons/chatsparkleoutline.svg");
}

.check-icon {
    mask-image: url("images/icons/check.svg");
}

.checklist-icon {
    mask-image: url("images/icons/checklist.svg");
}

.checkmarkcircle-icon {
    mask-image: url("images/icons/checkmarkcircle.svg");
}

.checkmarkcirclefilled-icon {
    mask-image: url("images/icons/checkmarkcirclefilled.svg");
}

.chevrondoubleleft-icon {
    mask-image: url("images/icons/chevrondoubleleft.svg");
}

.chevrondoubleright-icon {
    mask-image: url("images/icons/chevrondoubleright.svg");
}

.chevrondown-icon {
    mask-image: url("images/icons/chevrondown.svg");
}

.chevronleft-icon {
    mask-image: url("images/icons/chevronleft.svg");
}

.chevronright-icon {
    mask-image: url("images/icons/chevronright.svg");
}

.chevronup-icon {
    mask-image: url("images/icons/chevronup.svg");
}

.clear-icon {
    mask-image: url("images/icons/clear.svg");
}

.clearcircle-icon {
    mask-image: url("images/icons/clearcircle.svg");
}

.clearformat-icon {
    mask-image: url("images/icons/clearformat.svg");
}

.clearsquare-icon {
    mask-image: url("images/icons/clearsquare.svg");
}

.clipboardpastesparkle-icon {
    mask-image: url("images/icons/clipboardpastesparkle.svg");
}

.clipboardtasklist-icon {
    mask-image: url("images/icons/clipboardtasklist.svg");
}

.clock-icon {
    mask-image: url("images/icons/clock.svg");
}

.close-icon {
    mask-image: url("images/icons/close.svg");
}

.codeblock-icon {
    mask-image: url("images/icons/codeblock.svg");
}

.coffee-icon {
    mask-image: url("images/icons/coffee.svg");
}

.collapse-icon {
    mask-image: url("images/icons/collapse.svg");
}

.color-icon {
    mask-image: url("images/icons/color.svg");
}

.colordismiss-icon {
    mask-image: url("images/icons/colordismiss.svg");
}

.columnchooser-icon {
    mask-image: url("images/icons/columnchooser.svg");
}

.columnfield-icon {
    mask-image: url("images/icons/columnfield.svg");
}

.comment-icon {
    mask-image: url("images/icons/comment.svg");
}

.conferenceroomfilled-icon {
    mask-image: url("images/icons/conferenceroomfilled.svg");
}

.conferenceroomoutline-icon {
    mask-image: url("images/icons/conferenceroomoutline.svg");
}

.contains-icon {
    mask-image: url("images/icons/contains.svg");
}

.copyfilled-icon {
    mask-image: url("images/icons/copyfilled.svg");
}

.create_tabbed_group-icon {
    mask-image: url("images/icons/Create_Tabbed_Group.svg");
}

.csv-icon {
    mask-image: url("images/icons/csv.svg");
}

.cursormove-icon {
    mask-image: url("images/icons/cursormove.svg");
}

.cursorprohibition-icon {
    mask-image: url("images/icons/cursorprohibition.svg");
}

.cut-icon {
    mask-image: url("images/icons/cut.svg");
}

.dataarea-icon {
    mask-image: url("images/icons/dataarea.svg");
}

.dataareafilled-icon {
    mask-image: url("images/icons/dataareafilled.svg");
}

.dataareaoutline-icon {
    mask-image: url("images/icons/dataareaoutline.svg");
}

.databarfilled-icon {
    mask-image: url("images/icons/databarfilled.svg");
}

.databaroutline-icon {
    mask-image: url("images/icons/databaroutline.svg");
}

.datadoughnutfilled-icon {
    mask-image: url("images/icons/datadoughnutfilled.svg");
}

.datadoughnutoutline-icon {
    mask-image: url("images/icons/datadoughnutoutline.svg");
}

.datafield-icon {
    mask-image: url("images/icons/datafield.svg");
}

.datalinefilled-icon {
    mask-image: url("images/icons/datalinefilled.svg");
}

.datalineoutline-icon {
    mask-image: url("images/icons/datalineoutline.svg");
}

.datapie-icon {
    mask-image: url("images/icons/datapie.svg");
}

.datapiefilled-icon {
    mask-image: url("images/icons/datapiefilled.svg");
}

.datapieoutline-icon {
    mask-image: url("images/icons/datapieoutline.svg");
}

.datastackedbarfilled-icon {
    mask-image: url("images/icons/datastackedbarfilled.svg");
}

.datastackedbaroutline-icon {
    mask-image: url("images/icons/datastackedbaroutline.svg");
}

.datatrending-icon {
    mask-image: url("images/icons/datatrending.svg");
}

.datausage-icon {
    mask-image: url("images/icons/datausage.svg");
}

.daterangepicker-icon {
    mask-image: url("images/icons/daterangepicker.svg");
}

.decreaseindent-icon {
    mask-image: url("images/icons/decreaseindent.svg");
}

.description-icon {
    mask-image: url("images/icons/description.svg");
}

.details_view-icon {
    mask-image: url("images/icons/details_view.svg");
}

.doc-icon {
    mask-image: url("images/icons/doc.svg");
}

.doc_1-icon {
    mask-image: url("images/icons/doc_1.svg");
}

.doc-1-icon {
    mask-image: url("images/icons/doc-1.svg");
}

.docx-icon {
    mask-image: url("images/icons/docx.svg");
}

.doesnotcontain-icon {
    mask-image: url("images/icons/doesnotcontain.svg");
}

.download-icon {
    mask-image: url("images/icons/download.svg");
}

.drag-icon {
    mask-image: url("images/icons/drag.svg");
}

.drawer-left-icon {
    mask-image: url("images/icons/drawer-left.svg");
}

.drawer-right-icon {
    mask-image: url("images/icons/drawer-right.svg");
}

.drop_selected_into_this-icon {
    mask-image: url("images/icons/Drop_Selected_Into_This.svg");
}

.drop_selected_under_this-icon {
    mask-image: url("images/icons/Drop_Selected_Under_This.svg");
}

.dropzone-icon {
    mask-image: url("images/icons/dropzone.svg");
}

.edit-header-icon {
    mask-image: url("images/icons/edit-header.svg");
}

.email-icon {
    mask-image: url("images/icons/email.svg");
}

.endswith-icon {
    mask-image: url("images/icons/endswith.svg");
}

.equal-icon {
    mask-image: url("images/icons/equal.svg");
}

.errorcircle-icon {
    mask-image: url("images/icons/errorcircle.svg");
}

.eventall-icon {
    mask-image: url("images/icons/eventall.svg");
}

.expand-icon {
    mask-image: url("images/icons/expand.svg");
}

.expandform-icon {
    mask-image: url("images/icons/expandform.svg");
}

.export-icon {
    mask-image: url("images/icons/export.svg");
}

.exportpdf-icon {
    mask-image: url("images/icons/exportpdf.svg");
}

.exportselected-icon {
    mask-image: url("images/icons/exportselected.svg");
}

.exportxlsx-icon {
    mask-image: url("images/icons/exportxlsx.svg");
}

.eyeclose-icon {
    mask-image: url("images/icons/eyeclose.svg");
}

.eyeopen-icon {
    mask-image: url("images/icons/eyeopen.svg");
}

.favorites-icon {
    mask-image: url("images/icons/favorites.svg");
}

.fieldchooser-icon {
    mask-image: url("images/icons/fieldchooser.svg");
}

.fields-icon {
    mask-image: url("images/icons/fields.svg");
}

.fill-icon {
    mask-image: url("images/icons/fill.svg");
}

.filter-icon {
    mask-image: url("images/icons/filter.svg");
}

.filter_editor-icon {
    mask-image: url("images/icons/Filter_Editor.svg");
}

.find-icon {
    mask-image: url("images/icons/find.svg");
}

.fixcolumn-icon {
    mask-image: url("images/icons/fixcolumn.svg");
}

.fixcolumnleft-icon {
    mask-image: url("images/icons/fixcolumnleft.svg");
}

.fixcolumnright-icon {
    mask-image: url("images/icons/fixcolumnright.svg");
}

.floppy-icon {
    mask-image: url("images/icons/floppy.svg");
}

.folder-icon {
    mask-image: url("images/icons/folder.svg");
}

.folder-close-icon {
    mask-image: url("images/icons/folder-close.svg");
}

.font-icon {
    mask-image: url("images/icons/font.svg");
}

.fontsize-icon {
    mask-image: url("images/icons/fontsize.svg");
}

.food-icon {
    mask-image: url("images/icons/food.svg");
}

.formula-icon {
    mask-image: url("images/icons/formula.svg");
}

.fullscreen-icon {
    mask-image: url("images/icons/fullscreen.svg");
}

.gift-icon {
    mask-image: url("images/icons/gift.svg");
}

.globe-icon {
    mask-image: url("images/icons/globe.svg");
}

.greater-icon {
    mask-image: url("images/icons/greater.svg");
}

.greaterorequal-icon {
    mask-image: url("images/icons/greaterorequal.svg");
}

.group-icon {
    mask-image: url("images/icons/group.svg");
}

.groupbycolumn-icon {
    mask-image: url("images/icons/groupbycolumn.svg");
}

.grouped-icon {
    mask-image: url("images/icons/grouped.svg");
}

.growfont-icon {
    mask-image: url("images/icons/growfont.svg");
}

.handlehorizontal-icon {
    mask-image: url("images/icons/handlehorizontal.svg");
}

.handlevertical-icon {
    mask-image: url("images/icons/handlevertical.svg");
}

.header-icon {
    mask-image: url("images/icons/header.svg");
}

.help-icon {
    mask-image: url("images/icons/help.svg");
}

.home-icon {
    mask-image: url("images/icons/home.svg");
}

.icon-library-for-blazor-ui-kit-community-icon {
    mask-image: url("images/icons/Icon Library for Blazor UI Kit (Community).svg");
}

.image-icon {
    mask-image: url("images/icons/image.svg");
}

.imagethumbnail-icon {
    mask-image: url("images/icons/imagethumbnail.svg");
}

.img-ar-lock-icon {
    mask-image: url("images/icons/img-ar-lock.svg");
}

.img-ar-unlock-icon {
    mask-image: url("images/icons/img-ar-unlock.svg");
}

.import-icon {
    mask-image: url("images/icons/import.svg");
}

.import-selected-icon {
    mask-image: url("images/icons/import-selected.svg");
}

.increaseindent-icon {
    mask-image: url("images/icons/increaseindent.svg");
}

.indent-icon {
    mask-image: url("images/icons/indent.svg");
}

.indent1-icon {
    mask-image: url("images/icons/indent1.svg");
}

.indeterminate-icon {
    mask-image: url("images/icons/Indeterminate.svg");
}

.info-icon {
    mask-image: url("images/icons/info.svg");
}

.isblank-icon {
    mask-image: url("images/icons/isblank.svg");
}

.isnotblank-icon {
    mask-image: url("images/icons/isnotblank.svg");
}

.italic-icon {
    mask-image: url("images/icons/italic.svg");
}

.jpg-icon {
    mask-image: url("images/icons/jpg.svg");
}

.key-icon {
    mask-image: url("images/icons/key.svg");
}

.keyboard-return-icon {
    mask-image: url("images/icons/keyboard-return.svg");
}

.layoutcustomization_group-icon {
    mask-image: url("images/icons/LayoutCustomization_Group.svg");
}

.layoutcustomization_group_hidden-icon {
    mask-image: url("images/icons/LayoutCustomization_Group_Hidden.svg");
}

.layoutcustomization_hide-icon {
    mask-image: url("images/icons/LayoutCustomization_Hide.svg");
}

.layoutcustomization_hidetext-icon {
    mask-image: url("images/icons/LayoutCustomization_HideText.svg");
}

.layoutcustomization_item-icon {
    mask-image: url("images/icons/LayoutCustomization_Item.svg");
}

.layoutcustomization_item_hidden-icon {
    mask-image: url("images/icons/LayoutCustomization_Item_Hidden.svg");
}

.layoutcustomization_makecollapsible-icon {
    mask-image: url("images/icons/LayoutCustomization_MakeCollapsible.svg");
}

.layoutcustomization_makenotcollapsible-icon {
    mask-image: url("images/icons/LayoutCustomization_MakeNotCollapsible.svg");
}

.layoutcustomization_rename-icon {
    mask-image: url("images/icons/LayoutCustomization_Rename.svg");
}

.layoutcustomization_reset-icon {
    mask-image: url("images/icons/LayoutCustomization_Reset.svg");
}

.layoutcustomization_show-icon {
    mask-image: url("images/icons/LayoutCustomization_Show.svg");
}

.layoutcustomization_showtext-icon {
    mask-image: url("images/icons/LayoutCustomization_ShowText.svg");
}

.layoutcustomization_smallsize-icon {
    mask-image: url("images/icons/LayoutCustomization_SmallSize.svg");
}

.layoutcustomization_tab-icon {
    mask-image: url("images/icons/LayoutCustomization_Tab.svg");
}

.layoutcustomization_tab_hidden-icon {
    mask-image: url("images/icons/LayoutCustomization_Tab_Hidden.svg");
}

.layoutcustomization_textposition-icon {
    mask-image: url("images/icons/LayoutCustomization_TextPosition.svg");
}

.layoutcustomization_textposition_left-icon {
    mask-image: url("images/icons/LayoutCustomization_TextPosition_Left.svg");
}

.layoutcustomization_textposition_top-icon {
    mask-image: url("images/icons/LayoutCustomization_TextPosition_Top.svg");
}

.less-icon {
    mask-image: url("images/icons/less.svg");
}

.lessorequal-icon {
    mask-image: url("images/icons/lessorequal.svg");
}

.like-icon {
    mask-image: url("images/icons/like.svg");
}

.link-icon {
    mask-image: url("images/icons/link.svg");
}

.lock-icon {
    mask-image: url("images/icons/lock.svg");
}

.login-icon {
    mask-image: url("images/icons/login.svg");
}

.mailmerge_template-icon {
    mask-image: url("images/icons/MailMerge_Template.svg");
}

.map-icon {
    mask-image: url("images/icons/map.svg");
}

.mention-icon {
    mask-image: url("images/icons/mention.svg");
}

.menu-icon {
    mask-image: url("images/icons/menu.svg");
}

.micfilled-icon {
    mask-image: url("images/icons/micfilled.svg");
}

.micoutline-icon {
    mask-image: url("images/icons/micoutline.svg");
}

.minus-icon {
    mask-image: url("images/icons/minus.svg");
}

.money-icon {
    mask-image: url("images/icons/money.svg");
}

.move-icon {
    mask-image: url("images/icons/move.svg");
}

.music-icon {
    mask-image: url("images/icons/music.svg");
}

.navigation_group_viewvariant-icon {
    mask-image: url("images/icons/Navigation_Group_ViewVariant.svg");
}

.navigation_item_dashboard-icon {
    mask-image: url("images/icons/Navigation_Item_Dashboard.svg");
}

.navigation_item_view-icon {
    mask-image: url("images/icons/Navigation_Item_View.svg");
}

.navigation_item_viewvarient-icon {
    mask-image: url("images/icons/Navigation_Item_ViewVarient.svg");
}

.new-folder-icon {
    mask-image: url("images/icons/new-folder.svg");
}

.notequal-icon {
    mask-image: url("images/icons/notequal.svg");
}

.optionsfilled-icon {
    mask-image: url("images/icons/optionsfilled.svg");
}

.optionsgear-icon {
    mask-image: url("images/icons/optionsgear.svg");
}

.optionsoutline-icon {
    mask-image: url("images/icons/optionsoutline.svg");
}

.orderedlist-icon {
    mask-image: url("images/icons/orderedlist.svg");
}

.ordersbox-icon {
    mask-image: url("images/icons/ordersbox.svg");
}

.overflow-icon {
    mask-image: url("images/icons/overflow.svg");
}

.packagebox-icon {
    mask-image: url("images/icons/packagebox.svg");
}

.palette-icon {
    mask-image: url("images/icons/palette.svg");
}

.panelleft-icon {
    mask-image: url("images/icons/panelleft.svg");
}

.panelright-icon {
    mask-image: url("images/icons/panelright.svg");
}

.past-icon {
    mask-image: url("images/icons/past.svg");
}

.past-free-icon {
    mask-image: url("images/icons/past-free.svg");
}

.pdf-icon {
    mask-image: url("images/icons/pdf.svg");
}

.percent-icon {
    mask-image: url("images/icons/percent.svg");
}

.photo-icon {
    mask-image: url("images/icons/photo.svg");
}

.photooutline-icon {
    mask-image: url("images/icons/photooutline.svg");
}

.pin-icon {
    mask-image: url("images/icons/pin.svg");
}

.pinleft-icon {
    mask-image: url("images/icons/pinleft.svg");
}

.pinmap-icon {
    mask-image: url("images/icons/pinmap.svg");
}

.pinright-icon {
    mask-image: url("images/icons/pinright.svg");
}

.ppt-icon {
    mask-image: url("images/icons/ppt.svg");
}

.pptx-icon {
    mask-image: url("images/icons/pptx.svg");
}

.preferences-icon {
    mask-image: url("images/icons/preferences.svg");
}

.print-icon {
    mask-image: url("images/icons/print.svg");
}

.product-icon {
    mask-image: url("images/icons/product.svg");
}

.pulldown-icon {
    mask-image: url("images/icons/pulldown.svg");
}

.range-icon {
    mask-image: url("images/icons/range.svg");
}

.ratingfilled-icon {
    mask-image: url("images/icons/ratingfilled.svg");
}

.ratingoutline-icon {
    mask-image: url("images/icons/ratingoutline.svg");
}

.redo-icon {
    mask-image: url("images/icons/redo.svg");
}

.remove-table-icon {
    mask-image: url("images/icons/remove-table.svg");
}

.rename-icon {
    mask-image: url("images/icons/rename.svg");
}

.repeat-icon {
    mask-image: url("images/icons/repeat.svg");
}

.restore-icon {
    mask-image: url("images/icons/restore.svg");
}

.revert-icon {
    mask-image: url("images/icons/revert.svg");
}

.rowfield-icon {
    mask-image: url("images/icons/rowfield.svg");
}

.rtf-icon {
    mask-image: url("images/icons/rtf.svg");
}

.runner-icon {
    mask-image: url("images/icons/runner.svg");
}

.save-icon {
    mask-image: url("images/icons/save.svg");
}

.selectall-icon {
    mask-image: url("images/icons/selectall.svg");
}

.send-icon {
    mask-image: url("images/icons/send.svg");
}

.sendfilled-icon {
    mask-image: url("images/icons/sendfilled.svg");
}

.servicebell-icon {
    mask-image: url("images/icons/servicebell.svg");
}

.share-icon {
    mask-image: url("images/icons/share.svg");
}

.shrinkfont-icon {
    mask-image: url("images/icons/shrinkfont.svg");
}

.sortdown-icon {
    mask-image: url("images/icons/sortdown.svg");
}

.sortdowntext-icon {
    mask-image: url("images/icons/sortdowntext.svg");
}

.sorted-icon {
    mask-image: url("images/icons/sorted.svg");
}

.sortup-icon {
    mask-image: url("images/icons/sortup.svg");
}

.sortuptext-icon {
    mask-image: url("images/icons/sortuptext.svg");
}

.sparkle-icon {
    mask-image: url("images/icons/sparkle.svg");
}

.spindown-icon {
    mask-image: url("images/icons/spindown.svg");
}

.spinleft-icon {
    mask-image: url("images/icons/spinleft.svg");
}

.spinright-icon {
    mask-image: url("images/icons/spinright.svg");
}

.spinup-icon {
    mask-image: url("images/icons/spinup.svg");
}

.square-icon {
    mask-image: url("images/icons/square.svg");
}

.startswith-icon {
    mask-image: url("images/icons/startswith.svg");
}

.state_itemvisibility_hide-icon {
    mask-image: url("images/icons/State_ItemVisibility_Hide.svg");
}

.state_itemvisibility_show-icon {
    mask-image: url("images/icons/State_ItemVisibility_Show.svg");
}

.state_priority_high-icon {
    mask-image: url("images/icons/State_Priority_High.svg");
}

.state_priority_low-icon {
    mask-image: url("images/icons/State_Priority_Low.svg");
}

.state_priority_normal-icon {
    mask-image: url("images/icons/State_Priority_Normal.svg");
}

.state_task_completed-icon {
    mask-image: url("images/icons/State_Task_Completed.svg");
}

.state_task_deferred-icon {
    mask-image: url("images/icons/State_Task_Deferred.svg");
}

.state_task_inprogress-icon {
    mask-image: url("images/icons/State_Task_InProgress.svg");
}

.state_task_notstarted-icon {
    mask-image: url("images/icons/State_Task_NotStarted.svg");
}

.state_task_waitingforsomeoneelse-icon {
    mask-image: url("images/icons/State_Task_WaitingForSomeoneElse.svg");
}

.state_validation_information-icon {
    mask-image: url("images/icons/State_Validation_Information.svg");
}

.state_validation_invalid-icon {
    mask-image: url("images/icons/State_Validation_Invalid.svg");
}

.state_validation_skipped-icon {
    mask-image: url("images/icons/State_Validation_Skipped.svg");
}

.state_validation_valid-icon {
    mask-image: url("images/icons/State_Validation_Valid.svg");
}

.state_validation_warning-icon {
    mask-image: url("images/icons/State_Validation_Warning.svg");
}

.stickcolumn-icon {
    mask-image: url("images/icons/stickcolumn.svg");
}

.stopfilled-icon {
    mask-image: url("images/icons/stopfilled.svg");
}

.stopoutline-icon {
    mask-image: url("images/icons/stopoutline.svg");
}

.strike-icon {
    mask-image: url("images/icons/strike.svg");
}

.submenu-icon {
    mask-image: url("images/icons/submenu.svg");
}

.submenu-list-icon {
    mask-image: url("images/icons/submenu-list.svg");
}

.subscript-icon {
    mask-image: url("images/icons/subscript.svg");
}

.superscript-icon {
    mask-image: url("images/icons/superscript.svg");
}

.svg-icon {
    mask-image: url("images/icons/svg.svg");
}

.table-add-column-after-icon {
    mask-image: url("images/icons/table-add-column-after.svg");
}

.table-add-column-before-icon {
    mask-image: url("images/icons/table-add-column-before.svg");
}

.table-add-row-after-icon {
    mask-image: url("images/icons/table-add-row-after.svg");
}

.table-add-row-before-icon {
    mask-image: url("images/icons/table-add-row-before.svg");
}

.table-cell-properties-icon {
    mask-image: url("images/icons/table-cell-properties.svg");
}

.table-column-properties-icon {
    mask-image: url("images/icons/table-column-properties.svg");
}

.table-merge-cells-icon {
    mask-image: url("images/icons/table-merge-cells.svg");
}

.table-properties-icon {
    mask-image: url("images/icons/table-properties.svg");
}

.table-remove-column-icon {
    mask-image: url("images/icons/table-remove-column.svg");
}

.table-remove-row-icon {
    mask-image: url("images/icons/table-remove-row.svg");
}

.table-row-properties-icon {
    mask-image: url("images/icons/table-row-properties.svg");
}

.table-split-cells-icon {
    mask-image: url("images/icons/table-split-cells.svg");
}

.tag-icon {
    mask-image: url("images/icons/tag.svg");
}

.task-icon {
    mask-image: url("images/icons/Task.svg");
}

.taskcomplete-icon {
    mask-image: url("images/icons/taskcomplete.svg");
}

.taskhelpneeded-icon {
    mask-image: url("images/icons/taskhelpneeded.svg");
}

.taskinprogress-icon {
    mask-image: url("images/icons/taskinprogress.svg");
}

.taskrejected-icon {
    mask-image: url("images/icons/taskrejected.svg");
}

.taskstop-icon {
    mask-image: url("images/icons/taskstop.svg");
}

.tel-icon {
    mask-image: url("images/icons/tel.svg");
}

.thumbnails_view-icon {
    mask-image: url("images/icons/thumbnails_view.svg");
}

.tips-icon {
    mask-image: url("images/icons/tips.svg");
}

.to-icon {
    mask-image: url("images/icons/to.svg");
}

.today-icon {
    mask-image: url("images/icons/today.svg");
}

.toolbox-icon {
    mask-image: url("images/icons/toolbox.svg");
}

.trash-icon {
    mask-image: url("images/icons/trash.svg");
}

.triangledown-icon {
    mask-image: url("images/icons/triangledown.svg");
}

.triangleleft-icon {
    mask-image: url("images/icons/triangleleft.svg");
}

.triangleright-icon {
    mask-image: url("images/icons/triangleright.svg");
}

.triangleup-icon {
    mask-image: url("images/icons/triangleup.svg");
}

.txt-icon {
    mask-image: url("images/icons/txt.svg");
}

.underline-icon {
    mask-image: url("images/icons/underline.svg");
}

.unfixcolumn-icon {
    mask-image: url("images/icons/unfixcolumn.svg");
}

.ungroup-icon {
    mask-image: url("images/icons/Ungroup.svg");
}

.ungroupallcolumns-icon {
    mask-image: url("images/icons/ungroupallcolumns.svg");
}

.ungroupcolumn-icon {
    mask-image: url("images/icons/ungroupcolumn.svg");
}

.unlock-icon {
    mask-image: url("images/icons/unlock.svg");
}

.unpin-icon {
    mask-image: url("images/icons/unpin.svg");
}

.unselectall-icon {
    mask-image: url("images/icons/unselectall.svg");
}

.upload-icon {
    mask-image: url("images/icons/upload.svg");
}

.up-to-icon {
    mask-image: url("images/icons/up-to.svg");
}

.user-icon {
    mask-image: url("images/icons/user.svg");
}

.variable-icon {
    mask-image: url("images/icons/variable.svg");
}

.vert-align-bottom-icon {
    mask-image: url("images/icons/vert-align-bottom.svg");
}

.vert-align-center-icon {
    mask-image: url("images/icons/vert-align-center.svg");
}

.vert-align-top-icon {
    mask-image: url("images/icons/vert-align-top.svg");
}

.video-icon {
    mask-image: url("images/icons/video.svg");
}

.warning-icon {
    mask-image: url("images/icons/warning.svg");
}

.xls-icon {
    mask-image: url("images/icons/xls.svg");
}

.xlsx-icon {
    mask-image: url("images/icons/xlsx.svg");
}

.zoominfilled-icon {
    mask-image: url("images/icons/zoominfilled.svg");
}

.zoominoutline-icon {
    mask-image: url("images/icons/zoominoutline.svg");
}

.zoomoutfilled-icon {
    mask-image: url("images/icons/zoomoutfilled.svg");
}

.zoomoutoutline-icon {
    mask-image: url("images/icons/zoomoutoutline.svg");
}

/* Additional icon mappings and legacy aliases. */
.sun-icon {
    mask-image: url("images/icons/sun.svg");
}

.moon-icon {
    mask-image: url("images/icons/moon.svg");
}

.back-icon {
    mask-image: url("images/icons/arrow-left.svg");
}

.refresh-icon {
    mask-image: url("images/icons/refresh.svg");
}

.more-icon {
    mask-image: url("images/icons/more.svg");
}

.event-icon {
    mask-image: url("images/icons/event.svg");
}

.chart-type-line-icon {
    mask-image: url("images/icons/data-trending.svg");
}

.notification {
    position: relative;
}

    .notification::after {
        content: attr(notification-count) / "";
        color: white;
        display: flex;
        position: absolute;
        top: 0;
        left: 5%;
        font-size: 0.8em;
        width: 1.2em;
        height: 1.2em;
        border-radius: 50%;
        background-color: red;
        align-items: center;
        justify-content: center;
    }

.dropdown-no-padding {
    --dxbl-dropdown-body-padding-x: 0;
    --dxbl-dropdown-body-padding-y: 0;
}

@media (min-width: 899.98px) {
    .pw-800 {
        max-width: 800px !important;
        width: 800px !important;
    }
}

.loading-panel {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .loading-panel > .loader {
        display: flex;
        align-items: center;
    }

        .loading-panel > .loader > .spinner {
            width: 2rem;
            height: 2rem;
            border: 0.25rem solid color-mix(in sRGB, var(--dxds-color-surface-primary-default-rest) 30%, transparent);
            border-bottom-color: var(--dxds-color-surface-primary-default-rest);
            border-radius: 50%;
            display: inline-block;
            box-sizing: border-box;
            animation: rotation 0.75s linear infinite;
        }

        .loading-panel > .loader > .label {
            color: var(--dxds-color-content-neutral-default-rest);
            font-size: var(--dxds-font-size-base-lg);
            font-weight: var(--dxds-font-weight-base-strong);
            margin-left: 0.75rem;
        }

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.admin-page {
    display: grid;
    gap: 1.25rem;
}

.admin-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 14%, var(--dxbl-border-color));
    border-radius: 1.15rem;
    background: linear-gradient(135deg, color-mix(in srgb, var(--dxbl-btn-primary-bg) 10%, transparent), transparent 62%), var(--dxbl-card-bg, var(--dxbl-bg));
    box-shadow: 0 12px 28px color-mix(in srgb, black 6%, transparent);
}

    .admin-header h1,
    .admin-card h2,
    .admin-card h3,
    .admin-card h4 {
        margin: 0;
    }

    .admin-header h1 {
        font-size: clamp(1.45rem, 2.5vw, 1.9rem);
        letter-spacing: -0.02em;
    }

    .admin-header p,
    .admin-card p,
    .admin-empty {
        margin: 0.35rem 0 0;
        line-height: 1.5;
        color: var(--dxds-color-content-neutral-subdued-rest);
    }

.admin-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(20rem, 0.9fr);
    gap: 1.25rem;
}

    .admin-grid.single-column {
        grid-template-columns: minmax(0, 1fr);
    }

.admin-stacked-grid {
    display: grid;
    gap: 1.25rem;
}

.admin-card {
    display: grid;
    gap: 1rem;
    padding: 1.35rem;
    border-radius: 1.15rem;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 10%, var(--dxbl-border-color));
    background: linear-gradient(180deg, color-mix(in srgb, white 2%, transparent), transparent 28%), var(--dxbl-card-bg, var(--dxbl-bg));
    box-shadow: 0 14px 34px color-mix(in srgb, black 5%, transparent);
}

    .admin-card h2 {
        font-size: 1.05rem;
        padding-bottom: 0.75rem;
        border-bottom: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 10%, var(--dxbl-border-color));
    }

.admin-table-shell {
    overflow-x: auto;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 8%, var(--dxbl-border-color));
    border-radius: 0.95rem;
    background: color-mix(in srgb, var(--dxbl-card-bg, var(--dxbl-bg)) 92%, transparent);
}

.admin-table {
    width: 100%;
    border-collapse: collapse;
}

    .admin-table th,
    .admin-table td {
        padding: 0.85rem 0.9rem;
        border-bottom: 1px solid var(--dxbl-border-color);
        text-align: left;
        vertical-align: top;
    }

    .admin-table th {
        font-size: 0.82rem;
        text-transform: uppercase;
        letter-spacing: 0.07em;
        color: var(--dxds-color-content-neutral-subdued-rest);
        background: color-mix(in srgb, var(--dxbl-btn-primary-bg) 6%, transparent);
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .admin-table tbody tr:last-child td {
        border-bottom: 0;
    }

    .admin-table tbody tr {
        transition: background-color 0.18s ease;
    }

        .admin-table tbody tr:hover {
            background: color-mix(in srgb, var(--dxbl-btn-primary-bg) 7%, transparent);
        }

.admin-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1.05rem;
}

    .admin-form-grid.compact {
        grid-template-columns: minmax(16rem, 22rem);
    }

.admin-field {
    display: grid;
    gap: 0.5rem;
}

    .admin-field span,
    .admin-subsection h3,
    .admin-module-group h4 {
        font-weight: 600;
    }

    .admin-field input,
    .admin-field select,
    .admin-field textarea {
        width: 100%;
        padding: 0.7rem 0.8rem;
        border-radius: 0.75rem;
        border: 1px solid var(--dxbl-border-color);
        background: var(--dxbl-card-bg, var(--dxbl-bg));
        color: inherit;
        font: inherit;
    }

.admin-select {
    width: 100%;
    padding: 0.7rem 0.8rem;
    border-radius: 0.75rem;
    border: 1px solid var(--dxbl-border-color);
    background: var(--dxbl-card-bg, var(--dxbl-bg));
    color: inherit;
    font: inherit;
}

.admin-field textarea {
    min-height: 8rem;
    resize: vertical;
}

    .admin-field input:focus,
    .admin-field select:focus,
    .admin-field textarea:focus,
    .admin-select:focus {
        outline: none;
        border-color: color-mix(in srgb, var(--dxbl-btn-primary-bg) 50%, var(--dxbl-border-color));
        box-shadow: 0 0 0 0.22rem color-mix(in srgb, var(--dxbl-btn-primary-bg) 14%, transparent);
    }

.admin-field small {
    color: var(--dxds-color-content-neutral-subdued-rest);
}

.admin-subsection {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
    border-radius: 0.95rem;
    background: color-mix(in srgb, var(--dxbl-btn-primary-bg) 4%, transparent);
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 9%, var(--dxbl-border-color));
}

.admin-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 0.75rem;
}

.admin-check-item,
.admin-toggle {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.65rem 0.75rem;
    border-radius: 0.85rem;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 8%, var(--dxbl-border-color));
    background: color-mix(in srgb, var(--dxbl-card-bg, var(--dxbl-bg)) 94%, transparent);
}

.admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.admin-primary-button,
.admin-secondary-button,
.admin-link-button {
    border-radius: 0.8rem;
    padding: 0.7rem 1rem;
    font: inherit;
    cursor: pointer;
    transition: transform 0.18s ease, opacity 0.18s ease;
}

    .admin-primary-button:hover,
    .admin-secondary-button:hover,
    .admin-link-button:hover {
        transform: translateY(-1px);
    }

.admin-primary-button {
    border: 0;
    color: white;
    font-weight: 600;
    background: linear-gradient(135deg, color-mix(in srgb, var(--dxbl-btn-primary-bg) 88%, white 12%), var(--dxbl-btn-primary-bg));
    box-shadow: 0 10px 20px color-mix(in srgb, var(--dxbl-btn-primary-bg) 25%, transparent);
}

.admin-secondary-button {
    border: 1px solid var(--dxbl-border-color);
    background: color-mix(in srgb, var(--dxbl-card-bg, var(--dxbl-bg)) 90%, transparent);
    color: inherit;
}

.admin-link-button {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--dxbl-btn-primary-bg);
    font-weight: 600;
}

.admin-status {
    padding: 0.95rem 1.05rem;
    border-radius: 0.95rem;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 14%, var(--dxbl-border-color));
    background: color-mix(in srgb, var(--dxbl-btn-primary-bg) 8%, transparent);
}

    .admin-status.success {
        border-color: color-mix(in srgb, #1f8b4c 35%, var(--dxbl-border-color));
    }

    .admin-status.error {
        border-color: color-mix(in srgb, #c53b32 35%, var(--dxbl-border-color));
        background: color-mix(in srgb, #c53b32 10%, transparent);
    }

.admin-quick-links {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 1.1rem;
}

.admin-link-card {
    display: grid;
    gap: 0.45rem;
    padding: 1.1rem 1.15rem;
    border-radius: 1.05rem;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 12%, var(--dxbl-border-color));
    background: linear-gradient(160deg, color-mix(in srgb, var(--dxbl-btn-primary-bg) 7%, transparent), transparent 68%), var(--dxbl-card-bg, var(--dxbl-bg));
    color: inherit;
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

    .admin-link-card:hover {
        transform: translateY(-2px);
        border-color: color-mix(in srgb, var(--dxbl-btn-primary-bg) 45%, var(--dxbl-border-color));
        box-shadow: 0 12px 24px color-mix(in srgb, var(--dxbl-btn-primary-bg) 12%, transparent);
    }

.admin-role-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.admin-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    border: 1px solid var(--dxbl-border-color);
    background: color-mix(in srgb, var(--dxbl-btn-primary-bg) 10%, transparent);
    font-size: 0.9rem;
}

.admin-module-groups {
    display: grid;
    gap: 1rem;
}

.admin-profile-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
    gap: 0.9rem;
}

    .admin-profile-summary > div {
        display: grid;
        gap: 0.2rem;
        padding: 0.95rem 1rem;
        border-radius: 1rem;
        border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 10%, var(--dxbl-border-color));
        background: color-mix(in srgb, var(--dxbl-btn-primary-bg) 6%, transparent);
    }

    .admin-profile-summary strong {
        font-size: 1.05rem;
    }

    .admin-profile-summary span,
    .admin-tree-meta {
        color: var(--dxds-color-content-neutral-subdued-rest);
    }

.admin-module-group {
    display: grid;
    gap: 0.75rem;
    padding: 1rem 1.05rem;
    border-radius: 1rem;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 12%, var(--dxbl-border-color));
    background: linear-gradient(135deg, color-mix(in srgb, var(--dxbl-btn-primary-bg) 6%, transparent), transparent 70%), color-mix(in srgb, var(--dxbl-card-bg, var(--dxbl-bg)) 94%, transparent);
}

.admin-tree {
    display: grid;
    gap: 1rem;
}

.admin-tree-group {
    display: grid;
    gap: 0.85rem;
    padding: 1rem 1.1rem;
    border-radius: 1rem;
    border: 1px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 12%, var(--dxbl-border-color));
    background: linear-gradient(180deg, color-mix(in srgb, var(--dxbl-btn-primary-bg) 6%, transparent), transparent 46%), var(--dxbl-card-bg, var(--dxbl-bg));
}

.admin-tree-parent {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px dashed color-mix(in srgb, var(--dxbl-btn-primary-bg) 14%, var(--dxbl-border-color));
}

.admin-check-item.parent {
    font-weight: 700;
}

.admin-tree-children {
    display: grid;
    gap: 0.55rem;
    padding-left: 1rem;
    border-left: 2px solid color-mix(in srgb, var(--dxbl-btn-primary-bg) 18%, var(--dxbl-border-color));
}

.admin-check-item.child {
    border-style: dashed;
}

.admin-tree-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    align-items: center;
    padding-left: 4rem;
    margin-top: -0.25rem;
    font-size: 0.9rem;
}

.admin-tree-code {
    display: inline-flex;
    align-items: center;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    background: color-mix(in srgb, var(--dxbl-btn-primary-bg) 10%, transparent);
    color: var(--dxds-color-content-neutral-default-rest);
    font-size: 0.8rem;
    letter-spacing: 0.03em;
}

@media (max-width: 960px) {
    .admin-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .admin-header,
    .admin-role-header {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-tree-parent {
        flex-direction: column;
        align-items: stretch;
    }

    .admin-tree-meta {
        padding-left: 0;
    }
}

/* Gestion Manager */
.gestion-root {
    min-height: calc(100vh - 84px);
    padding: 1rem;
    background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 96%, transparent);
}

.gestion-layout {
    height: 100%;
    min-height: calc(100vh - 116px);
}

.gestion-header-card,
.gestion-panel,
.gestion-editor,
.gestion-summary-card,
.gestion-link-card {
    border: 1px solid color-mix(in srgb, var(--dxds-color-border-neutral-default-rest) 78%, transparent);
    border-radius: 0.5rem;
    background: var(--dxds-color-surface-neutral-default-rest);
    box-shadow: 0 10px 24px color-mix(in srgb, black 8%, transparent);
}

.gestion-header-card {
    padding: 0.9rem 1rem;
}

.gestion-title {
    display: grid;
    gap: 0.2rem;
}

    .gestion-title h1 {
        margin: 0;
        font-size: 1.2rem;
        line-height: 1.25;
        color: var(--dxds-color-content-neutral-default-rest);
    }

    .gestion-title p {
        margin: 0;
        max-width: 68rem;
        color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 72%, transparent);
    }

.gestion-content {
    display: grid;
    gap: 1rem;
    align-content: start;
}

.gestion-two-columns {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(20rem, 0.65fr);
    gap: 1rem;
    align-items: start;
}

.gestion-panel,
.gestion-editor {
    min-width: 0;
    overflow: hidden;
}

.gestion-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.8rem 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--dxds-color-border-neutral-default-rest) 78%, transparent);
}

.gestion-panel-title {
    display: grid;
    gap: 0.15rem;
}

    .gestion-panel-title h2,
    .gestion-panel-title h3 {
        margin: 0;
        font-size: 0.98rem;
        line-height: 1.25;
        color: var(--dxds-color-content-neutral-default-rest);
    }

    .gestion-panel-title span {
        color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 68%, transparent);
        font-size: 0.82rem;
    }

.gestion-panel-body {
    padding: 1rem;
}

.gestion-grid-shell {
    height: min(62vh, 42rem);
    min-height: 26rem;
}

    .gestion-grid-shell.compact {
        height: min(48vh, 32rem);
        min-height: 20rem;
    }

    .gestion-grid-shell.tall {
        height: min(70vh, 48rem);
        min-height: 34rem;
    }

.gestion-grid {
    height: 100%;
}

.gestion-status {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.75rem 1rem;
    border: 1px solid color-mix(in srgb, var(--dxds-color-border-neutral-default-rest) 78%, transparent);
    border-radius: 0.45rem;
    background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 88%, var(--dxds-color-primary-default-rest) 8%);
    color: var(--dxds-color-content-neutral-default-rest);
}

    .gestion-status.success {
        background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 84%, #1f9d55 14%);
    }

    .gestion-status.error {
        background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 82%, #d92d20 14%);
    }

.gestion-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: flex-end;
    padding-top: 0.85rem;
}

.gestion-help {
    margin: 0.3rem 0 0;
    color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 66%, transparent);
    font-size: 0.8rem;
}

.gestion-chip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.gestion-chip {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    min-height: 1.45rem;
    padding: 0 0.45rem;
    border: 1px solid color-mix(in srgb, var(--dxds-color-border-neutral-default-rest) 76%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 88%, var(--dxds-color-primary-default-rest) 8%);
    color: var(--dxds-color-content-neutral-default-rest);
    font-size: 0.78rem;
    white-space: nowrap;
}

    .gestion-chip.muted {
        background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 92%, transparent);
        color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 68%, transparent);
    }

.gestion-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
    gap: 0.55rem;
    padding: 0.6rem;
    border: 1px solid color-mix(in srgb, var(--dxds-color-border-neutral-default-rest) 70%, transparent);
    border-radius: 0.45rem;
    background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 94%, transparent);
}

.gestion-check-item {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
}

.gestion-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.gestion-summary-card {
    padding: 1rem;
}

    .gestion-summary-card span {
        display: block;
        color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 68%, transparent);
        font-size: 0.82rem;
    }

    .gestion-summary-card strong {
        display: block;
        margin-top: 0.3rem;
        color: var(--dxds-color-content-neutral-default-rest);
        font-size: 1.9rem;
        line-height: 1;
    }

.gestion-link-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
    gap: 0.75rem;
}

.gestion-link-card {
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem;
    color: inherit;
    text-decoration: none;
}

    .gestion-link-card:hover {
        border-color: color-mix(in srgb, var(--dxds-color-primary-default-rest) 65%, transparent);
    }

    .gestion-link-card strong {
        color: var(--dxds-color-content-neutral-default-rest);
    }

    .gestion-link-card span {
        color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 68%, transparent);
        font-size: 0.83rem;
    }

.gestion-module-map {
    display: grid;
    gap: 0.75rem;
}

.gestion-module-group {
    border: 1px solid color-mix(in srgb, var(--dxds-color-border-neutral-default-rest) 78%, transparent);
    border-radius: 0.45rem;
    overflow: hidden;
}

.gestion-module-parent {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.65rem 0.75rem;
    background: color-mix(in srgb, var(--dxds-color-surface-neutral-default-rest) 88%, var(--dxds-color-primary-default-rest) 8%);
}

.gestion-module-children {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
    gap: 0.5rem;
    padding: 0.75rem;
}

.gestion-module-card {
    display: grid;
    gap: 0.25rem;
    padding: 0.6rem;
    border: 1px solid color-mix(in srgb, var(--dxds-color-border-neutral-default-rest) 64%, transparent);
    border-radius: 0.4rem;
}

.gestion-module-code {
    color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 62%, transparent);
    font-size: 0.76rem;
}

.gestion-empty {
    padding: 1.5rem;
    text-align: center;
    color: color-mix(in srgb, var(--dxds-color-content-neutral-default-rest) 64%, transparent);
}

@media (max-width: 1100px) {
    .gestion-two-columns {
        grid-template-columns: 1fr;
    }

    .gestion-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .gestion-root {
        padding: 0.65rem;
    }

    .gestion-summary-grid {
        grid-template-columns: 1fr;
    }

    .gestion-panel-header {
        align-items: flex-start;
        flex-direction: column;
    }
}