:root {
--hook-bg: #fade8d;
--hook-sc: #FCB813;
--hook-sc-light: #fcd57c;
--hook-text: #FCB813;
--hook-dark: #826217;
}
:root,
[data-bs-theme=light] {
--bs-light: #F5F5F5;
--bs-primary-light: rgba(232, 236, 252, .3);
--bs-text-muted: #7a8091;
}
:root,
[data-theme=light] {
--kt-app-bg-color: #f5f8fa;
--kt-app-blank-bg-color: #ffffff;
--kt-app-header-base-bg-color: #ffffff;
--kt-app-header-base-bg-color-mobile: #ffffff;
--kt-app-header-base-box-shadow: 0px 10px 30px 0px rgba(82, 63, 105, 0.05);
--kt-app-header-base-box-shadow-mobile: 0px 10px 30px 0px rgba(82, 63, 105, 0.05);
--kt-app-toolbar-base-bg-color: #ffffff;
--kt-app-toolbar-base-bg-color-mobile: #ffffff;
--kt-app-toolbar-base-box-shadow: 0px 10px 30px 0px rgba(82, 63, 105, 0.05);
--kt-app-toolbar-base-box-shadow-mobile: 0px 10px 30px 0px rgba(82, 63, 105, 0.05);
--kt-app-toolbar-base-border-top: 1px solid #e9ecef;
--kt-app-toolbar-base-border-top-mobile: 1px solid #e9ecef;
--kt-app-footer-bg-color: #ffffff;
--kt-app-footer-bg-color-mobile: #ffffff;
}
:root,
[data-theme=light] {
--kt-xs: 0;
--kt-sm: 576px;
--kt-md: 768px;
--kt-lg: 992px;
--kt-xl: 1200px;
--kt-xxl: 1400px;
--kt-white: #ffffff;
--kt-white-bg-rgb: 255, 255, 255;
--kt-black: #000000;
--kt-black-bg-rgb: 0, 0, 0;
--kt-text-muted: #A1A5B7;
--kt-gray-100: #f5f8fa;
--kt-gray-200: #e9ecef;
--kt-gray-300: #dee2e6;
--kt-gray-400: #B5B5C3;
--kt-gray-500: #A1A5B7;
--kt-gray-600: #7E8299;
--kt-gray-700: #5E6278;
--kt-gray-800: #3F4254;
--kt-gray-900: #181C32;
--kt-gray-100-rgb: 245, 248, 250;
--kt-gray-200-rgb: 233, 236, 239;
--kt-gray-300-rgb: 222, 226, 230;
--kt-gray-400-rgb: 181, 181, 195;
--kt-gray-500-rgb: 161, 165, 183;
--kt-gray-600-rgb: 126, 130, 153;
--kt-gray-700-rgb: 94, 98, 120;
--kt-gray-800-rgb: 63, 66, 84;
--kt-gray-900-rgb: 24, 28, 50;
--kt-white: #ffffff;
--kt-light: #F5F5F5;
--kt-primary: #5463A5;
--kt-secondary: #979EBD;
--kt-success: #0BB783;
--kt-info: #00ABE6;
--kt-warning: #FCB813;
--kt-danger: #F0762F;
--kt-dark: #3F4254;
--kt-primary-active: #5463A5;
--kt-secondary-active: #B5B5C3;
--kt-light-active: #e9ecef;
--kt-success-active: #0BB783;
--kt-info-active: #00ABE6;
--kt-warning-active: #FCB813;
--kt-danger-active: #F0762F;
--kt-dark-active: #131628;
--kt-primary-light: #E8ECFC;
--kt-secondary-light: #f5f8fa;
--kt-success-light: #D7F9EF;
--kt-info-light: #F8F5FF;
--kt-warning-light: #FFF8DD;
--kt-danger-light: #FFF5F8;
--kt-dark-light: #e9ecef;
--kt-primary-inverse: #FFFFFF;
--kt-secondary-inverse: #3F4254;
--kt-light-inverse: #7E8299;
--kt-success-inverse: #FFFFFF;
--kt-info-inverse: #FFFFFF;
--kt-warning-inverse: #FFFFFF;
--kt-danger-inverse: #FFFFFF;
--kt-dark-inverse: #ffffff;
--kt-white-rgb: 255, 255, 255;
--kt-light-rgb: 245, 245, 245;
--kt-primary-rgb: 84, 99, 165;
--kt-secondary-rgb: 151, 158, 189;
--kt-success-rgb: 11, 183, 131;
--kt-info-rgb: 0, 171, 230;
--kt-warning-rgb: 252, 184, 19;
--kt-danger-rgb: 240, 118, 47;
--kt-dark-rgb: 63, 66, 84;
--kt-text-white: #ffffff;
--kt-text-primary: #5463A5;
--kt-text-secondary: #979EBD;
--kt-text-light: #F5F5F5;
--kt-text-success: #0BB783;
--kt-text-info: #00ABE6;
--kt-text-warning: #FCB813;
--kt-text-danger: #F0762F;
--kt-text-dark: #3F4254;
--kt-text-muted: #A1A5B7;
--kt-text-gray-100: #f5f8fa;
--kt-text-gray-200: #e9ecef;
--kt-text-gray-300: #dee2e6;
--kt-text-gray-400: #B5B5C3;
--kt-text-gray-500: #A1A5B7;
--kt-text-gray-600: #7E8299;
--kt-text-gray-700: #5E6278;
--kt-text-gray-800: #3F4254;
--kt-text-gray-900: #181C32;
--kt-body-bg: #ffffff;
--kt-body-bg-rgb: 255, 255, 255;
--kt-body-color: #181C32;
--kt-link-color: #5463A5;
--kt-link-hover-color: #5463A5;
--kt-border-color: #e9ecef;
--kt-border-dashed-color: #dee2e6;
--kt-component-active-color: #FFFFFF;
--kt-component-active-bg: #5463A5;
--kt-component-hover-color: #5463A5;
--kt-component-hover-bg: #F4F6FA;
--kt-component-checked-color: #FFFFFF;
--kt-component-checked-bg: #5463A5;
--kt-box-shadow-xs: 0 0.1rem 0.75rem 0.25rem rgba(0, 0, 0, 0.05);
--kt-box-shadow-sm: 0 0.1rem 1rem 0.25rem rgba(0, 0, 0, 0.05);
--kt-box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075);
--kt-box-shadow-lg: 0 1rem 2rem 1rem rgba(0, 0, 0, 0.1);
--kt-headings-color: #181C32;
--kt-table-color: #181C32;
--kt-table-bg: transparent;
--kt-table-striped-color: #181C32;
--kt-table-striped-bg: rgba(245, 248, 250, 0.75);
--kt-table-accent-bg: transparent;
--kt-table-active-color: #181C32;
--kt-table-active-bg: #f5f8fa;
--kt-table-hover-colorr: #181C32;
--kt-table-hover-bg: #f5f8fa;
--kt-table-border-color: #e9ecef;
--kt-table-caption-color: #A1A5B7;
--kt-table-loading-message-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
--kt-table-loading-message-bg: #ffffff;
--kt-table-loading-message-color: #5E6278;
--kt-input-btn-focus-color: rgba(84, 99, 165, 0.25);
--kt-input-btn-focus-box-shadow: 0 0 0 0.25rem rgba(84, 99, 165, 0.25);
--kt-input-btn-focus-color-opacity: 0.25;
--kt-input-color: #5E6278;
--kt-input-placeholder-color: #A1A5B7;
--kt-input-plaintext-color: #5E6278;
--kt-btn-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
--kt-btn-focus-box-shadow: 0 0 0 0.25rem rgba(84, 99, 165, 0.25);
--kt-btn-active-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
--kt-btn-disabled-opacity: 0.65;
--kt-btn-link-color: #5463A5;
--kt-btn-link-hover-color: #5463A5;
--kt-btn-link-disabled-color: #7E8299;
--kt-form-label-color: #3F4254;
--kt-form-text-color: #A1A5B7;
--kt-input-bg: #ffffff;
--kt-input-disabled-bg: #e9ecef;
--kt-input-disabled-color: ;
--kt-input-disabled-border-color: #dee2e6;
--kt-input-color: #5E6278;
--kt-input-border-color: #dee2e6;
--kt-input-focus-bg: #ffffff;
--kt-input-focus-border-color: #B5B5C3;
--kt-input-focus-color: #5E6278;
--kt-input-solid-bg: #f5f8fa;
--kt-input-solid-bg-focus: #eef3f7;
--kt-input-solid-placeholder-color: #A1A5B7;
--kt-input-solid-color: #5E6278;
--kt-form-check-label-color: #A1A5B7;
--kt-form-check-label-color-checked: #5E6278;
--kt-form-check-input-active-filter: brightness(90%);
--kt-form-check-input-bg: transparent;
--kt-form-check-input-bg-solid: #e9ecef;
--kt-form-check-input-border: 1px solid #dee2e6;
--kt-form-check-input-focus-border: #B5B5C3;
--kt-form-check-input-focus-box-shadow: none;
--kt-form-check-input-checked-color: #FFFFFF;
--kt-form-check-input-checked-bg-color: #5463A5;
--kt-form-check-input-checked-bg-color-solid: #5463A5;
--kt-form-check-input-checked-border-color: #5463A5;
--kt-form-check-input-checked-bg-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 11' width='13' height='11' fill='none'%3e%3cpath d='M11.0426 1.02893C11.3258 0.695792 11.8254 0.655283 12.1585 0.938451C12.4917 1.22162 12.5322 1.72124 12.249 2.05437L5.51985 9.97104C5.23224 10.3094 4.72261 10.3451 4.3907 10.05L0.828197 6.88335C0.50141 6.59288 0.471975 6.09249 0.762452 5.7657C1.05293 5.43891 1.55332 5.40948 1.88011 5.69995L4.83765 8.32889L11.0426 1.02893Z' fill='%23FFFFFF'/%3e%3c/svg%3e);
--kt-form-check-radio-checked-bg-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23FFFFFF'/%3e%3c/svg%3e);
--kt-form-check-input-indeterminate-color: #FFFFFF;
--kt-form-check-input-indeterminate-bg-color: #5463A5;
--kt-form-check-input-indeterminate-border-color: #5463A5;
--kt-form-check-input-indeterminate-bg-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e);
--kt-form-check-input-disabled-opacity: 0.5;
--kt-form-check-label-disabled-opacity: 0.5;
--kt-form-check-btn-check-disabled-opacity: 0.65;
--kt-form-switch-color: rgba(0, 0, 0, 0.25);
--kt-form-switch-color-solid: #ffffff;
--kt-form-switch-bg-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e);
--kt-form-switch-bg-image-solid: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e);
--kt-form-switch-focus-color: #B5B5C3;
--kt-form-switch-focus-bg-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23B5B5C3'/%3e%3c/svg%3e);
--kt-form-switch-checked-color: #FFFFFF;
--kt-form-switch-checked-bg-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23FFFFFF'/%3e%3c/svg%3e);
--kt-input-group-addon-color: #5E6278;
--kt-input-group-addon-bg: #f5f8fa;
--kt-input-group-addon-border-color: #dee2e6;
--kt-form-select-color: #5E6278;
--kt-form-select-bg: #ffffff;
--kt-form-select-disabled-color: ;
--kt-form-select-disabled-bg: #e9ecef;
--kt-form-select-disabled-border-color: #dee2e6;
--kt-form-select-indicator-color: #7E8299;
--kt-form-select-indicator: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%237E8299' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e);
--kt-form-select-border-color: #dee2e6;
--kt-form-select-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
--kt-form-select-focus-border-color: #B5B5C3;
--kt-form-select-focus-box-shadow: 0 0 0 0.25rem rgba(84, 99, 165, 0.25);
--kt-form-file-button-color: #5E6278;
--kt-form-file-button-bg: #f5f8fa;
--kt-form-file-button-hover-bg: shade-color(#f5f8fa, 5%);
--kt-nav-tabs-border-color: #e9ecef;
--kt-nav-tabs-link-hover-border-color: #e9ecef #e9ecef #e9ecef;
--kt-nav-tabs-link-active-color: #5E6278;
--kt-nav-tabs-link-active-bg: #ffffff;
--kt-nav-tabs-link-active-border-color: #dee2e6 #dee2e6 #ffffff;
--kt-nav-pills-link-active-color: #FFFFFF;
--kt-nav-pills-link-active-bg: #5463A5;
--kt-dropdown-color: #181C32;
--kt-dropdown-bg: #ffffff;
--kt-dropdown-divider-bg: #f5f8fa;
--kt-dropdown-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
--kt-dropdown-link-color: #181C32;
--kt-dropdown-link-hover-color: shade-color(#181C32, 10%);
--kt-dropdown-link-hover-bg: #e9ecef;
--kt-dropdown-link-active-color: #FFFFFF;
--kt-dropdown-link-active-bg: #5463A5;
--kt-dropdown-link-disabled-color: #A1A5B7;
--kt-dropdown-header-color: #7E8299;
--kt-pagination-item-bg: #ffffff;
--kt-pagination-color: #5E6278;
--kt-pagination-bg: transparent;
--kt-pagination-border-color: transparent;
--kt-pagination-focus-color: #5463A5;
--kt-pagination-focus-bg: #F4F6FA;
--kt-pagination-focus-box-shadow: none;
--kt-pagination-focus-outline: 0;
--kt-pagination-hover-color: #5463A5;
--kt-pagination-hover-bg: #F4F6FA;
--kt-pagination-hover-border-color: transparent;
--kt-pagination-active-color: #FFFFFF;
--kt-pagination-active-bg: #5463A5;
--kt-pagination-active-border-color: transparent;
--kt-pagination-disabled-color: #B5B5C3;
--kt-pagination-disabled-bg: transparent;
--kt-card-color: ;
--kt-card-bg: #ffffff;
--kt-card-box-shadow: 0px 0px 20px 0px rgba(76, 87, 125, 0.02);
--kt-card-border-color: #e9ecef;
--kt-card-border-dashed-color: #dee2e6;
--kt-card-cap-bg: transparent;
--kt-accordion-color: #181C32;
--kt-accordion-bg: #ffffff;
--kt-accordion-border-color: #e9ecef;
--kt-accordion-button-bg: #ffffff;
--kt-accordion-button-color: #181C32;
--kt-accordion-button-active-bg: #f5f8fa;
--kt-accordion-button-active-color: #5463A5;
--kt-accordion-button-focus-border-color: #e9ecef;
--kt-accordion-button-focus-box-shadow: none;
--kt-accordion-icon-color: #181C32;
--kt-accordion-icon-active-color: #5463A5;
--kt-accordion-button-icon: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23181C32'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e);
--kt-accordion-button-active-icon: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%235463A5'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e);
--kt-tooltip-color: #3F4254;
--kt-tooltip-bg: #ffffff;
--kt-tooltip-opacity: 1;
--kt-tooltip-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
--kt-popover-bg: #ffffff;
--kt-popover-border-color: #ffffff;
--kt-popover-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
--kt-popover-header-bg: #ffffff;
--kt-popover-header-color: #3F4254;
--kt-popover-header-border-color: #e9ecef;
--kt-popover-body-color: #3F4254;
--kt-dropdown-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
--kt-dropdown-bg: #ffffff;
--kt-toast-color: ;
--kt-toast-background-color: rgba(255, 255, 255, 0.85);
--kt-toast-box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075);
--kt-toast-header-color: #7E8299;
--kt-toast-header-background-color: rgba(255, 255, 255, 0.85);
--kt-toast-header-border-color: rgba(0, 0, 0, 0.05);
--kt-badge-color: #ffffff;
--kt-modal-bg: #ffffff;
--kt-modal-color: ;
--kt-modal-border-color: var(--bs-border-color-translucent);
--kt-modal-box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);
--kt-modal-content-color: ;
--kt-modal-content-bg: #ffffff;
--kt-modal-content-border-color: var(--bs-border-color-translucent);
--kt-modal-content-box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.05);
--kt-modal-content-box-shadow-xs: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
--kt-modal-content-box-shadow-sm-up: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
--kt-modal-header-border-color: #e9ecef;
--kt-modal-footer-border-color: #e9ecef;
--kt-modal-backdrop-bg: #000000;
--kt-modal-backdrop-opacity: 0.3;
--kt-progress-bg: #f5f8fa;
--kt-progress-box-shadow: none;
--kt-list-group-color: #181C32;
--kt-list-group-bg: #ffffff;
--kt-list-group-border-color: rgba(0, 0, 0, 0.125);
--kt-list-group-hover-bg: #f5f8fa;
--kt-list-group-active-color: #FFFFFF;
--kt-list-group-active-bg: #5463A5;
--kt-list-group-active-border-colorg: #5463A5;
--kt-list-group-disabled-color: #7E8299;
--kt-list-group-disabled-bg: #ffffff;
--kt-list-group-action-colorg: #5E6278;
--kt-list-group-action-hover-color: #5E6278;
--kt-list-group-action-active-color: #181C32;
--kt-list-group-action-active-bg: #e9ecef;
--kt-thumbnail-bg: #ffffff;
--kt-thumbnail-border-color: #e9ecef;
--kt-thumbnail-box-shadow: 0 0.1rem 1rem 0.25rem rgba(0, 0, 0, 0.05);
--kt-figure-caption-color: #7E8299;
--kt-breadcrumb-bg: ;
--kt-breadcrumb-divider-color: #7E8299;
--kt-breadcrumb-active-color: #5463A5;
--kt-carousel-custom-indicator-default-bg-color: #e9ecef;
--kt-carousel-custom-indicator-active-bg-color: #B5B5C3;
--kt-carousel-custom-bullet-indicator-default-bg-color: #B5B5C3;
--kt-carousel-custom-bullet-indicator-active-bg-color: #7E8299;
--kt-code-bg: #F1F3F8;
--kt-code-box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.08);
--kt-code-color: #b93993;
--kt-btn-close-color: #000000;
--kt-btn-close-bg: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e);
--kt-offcanvas-border-color: var(--bs-border-color-translucent);
--kt-offcanvas-bg-color: #ffffff;
--kt-offcanvas-color: ;
--kt-offcanvas-box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
--kt-offcanvas-backdrop-bg: #000000;
--kt-offcanvas-backdrop-opacity: 0.3;
--kt-symbol-label-color: #3F4254;
--kt-symbol-label-bg: #f5f8fa;
--kt-symbol-border-color: rgba(255, 255, 255, 0.5);
--kt-bullet-bg-color: #B5B5C3;
--kt-scrolltop-opacity: 0;
--kt-scrolltop-opacity-on: 0.3;
--kt-scrolltop-opacity-hover: 1;
--kt-scrolltop-box-shadow: 0 0.5rem 1.5rem 0.5rem rgba(0, 0, 0, 0.075);
--kt-scrolltop-bg-color: #5463A5;
--kt-scrolltop-bg-color-hover: #5463A5;
--kt-scrolltop-icon-color: #FFFFFF;
--kt-scrolltop-icon-color-hover: #FFFFFF;
--kt-drawer-box-shadow: 0px 1px 9px -3px rgba(0, 0, 0, 0.05);
--kt-drawer-bg-color: #ffffff;
--kt-drawer-overlay-bg-color: rgba(0, 0, 0, 0.2);
--kt-menu-dropdown-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
--kt-menu-dropdown-bg-color: #ffffff;
--kt-menu-heading-color: #A1A5B7;
--kt-menu-link-color-hover: #5463A5;
--kt-menu-link-color-show: #5463A5;
--kt-menu-link-color-here: #5463A5;
--kt-menu-link-color-active: #5463A5;
--kt-menu-link-bg-color-hover: #F4F6FA;
--kt-menu-link-bg-color-show: #F4F6FA;
--kt-menu-link-bg-color-here: #F4F6FA;
--kt-menu-link-bg-color-active: #F4F6FA;
--kt-feedback-popup-box-shadow: 0px 0px 50px 0px rgba(82, 63, 105, 0.15);
--kt-feedback-popup-background-color: #ffffff;
--kt-scrollbar-color: #e9ecef;
--kt-scrollbar-hover-color: #e3e7eb;
--kt-scrollbar-width: 0.4rem;
--kt-scrollbar-height: 0.4rem;
--kt-scrollbar-space: 0.5rem;
--kt-overlay-bg: rgba(0, 0, 0, 0.05);
--kt-blockui-overlay-bg: rgba(0, 0, 0, 0.05);
--kt-rating-color-default: #B5B5C3;
--kt-rating-color-active: #FFAD0F;
--kt-ribbon-label-box-shadow: 0px -1px 5px 0px rgba(63, 66, 84, 0.1);
--kt-ribbon-label-bg: #5463A5;
--kt-ribbon-label-border-color: #323a61;
--kt-ribbon-clip-bg: #3F4254;
--kt-engage-btn-bg: #ffffff;
--kt-engage-btn-color: #7E8299;
--kt-engage-btn-color-active: #3F4254;
}
[data-kt-app-header-minimize=on] {
--bs-app-header-height: 70px;
}
@media screen and (min-width:992px) {
:root {
--bs-app-sidebar-width: 225px;
--bs-app-sidebar-width-actual: 225px;
--bs-app-header-height: 70px;
--bs-app-header-height-actual: 70px;
}
}
html,body {
font-family:
"PingFang TC",
"Microsoft JhengHei",
"Helvetica Neue",
"Arial Black",
"Arial",
"sans-serif";
}
body[data-kt-drawer="on"]{
margin-right: -16px;
overflow: hidden;
}
.drawer.drawer-on{
margin-right: -16px;
}
#edm-followup-component-drawer.drawer.drawer-on{
margin-right: 0px;
}
.mw-1200px {
max-width: 1200px !important;
}
.w-120px {
width: 120px !important;
}
.h-180px {
height: 180px !important;
}
.lh-24px {
line-height: 24px;
}
.min-vh-fill-90 {
min-height: calc(100vh - 90px);
}
.min-vh-fill-240 {
min-height: calc(100vh - 240px);
}
.min-vh-fill-430 {
min-height: calc(100vh - 430px);
}
.pointer-none {
pointer-events: none;
}
.border-gray-300{
border-color: var(--bs-gray-300);
}
.border-gray-400{
border-color: var(--bs-gray-400);
}
.border-gray-500{
border-color: var(--bs-gray-500);
}
.border-gray-600{
border-color: var(--bs-gray-600);
}
.border-gray-700{
border-color: var(--bs-gray-700);
}
.bg-hover-transparent{
background-color: transparent !important;
}
.border-bottom-2{
border-bottom-width: 2px !important;
}
/* menu reset */
.app-sidebar-logo {
background-color: #434F84;
}
.aside-menu {
background-color: #5463A5;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-title,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.hover:not(.here)>.menu-link:not(.disabled):not(.active):not(.here),
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) {
color: #f5f5f5;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active {
background-color: rgba(255, 255, 255, 0.1);
color: #FCB813;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-title,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-bullet .bullet {
color: #FCB813;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link.active .menu-bullet .bullet,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.hover:not(.here)>.menu-link:not(.disabled):not(.active):not(.here) .menu-bullet .bullet,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) .menu-bullet .bullet {
background-color: #FCB813;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.hover:not(.here)>.menu-link:not(.disabled):not(.active):not(.here) .menu-title,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item:not(.here) .menu-link:hover:not(.disabled):not(.active):not(.here) .menu-title {
color: #FCB813;
}
.menu-item .menu-link svg path {
fill: #e5e5e5 !important;
}
.menu-item.hover .menu-link svg path,
.menu-item:hover .menu-link svg path {
fill: #FCB813 !important;
}
.svg-icon-dark .menu-item.hover .menu-link svg path,
.svg-icon-dark .menu-item:hover .menu-link svg path,
.svg-icon-dark .menu-item .menu-link svg path {
fill: #000000 !important;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.show>.menu-link .menu-title {
color: #FCB813;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.show>.menu-link .menu-link svg path,
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item.show>.menu-link .menu-icon .svg-icon svg path {
fill: #FCB813 !important;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-bullet .bullet {
background-color: #fff;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu .menu-item .menu-link .menu-arrow:after {
background-color: #c9c9c9;
}
/* reset dropzone */
.dropzone .dz-preview .dz-image {
width: 120px !important;
height: 120px !important;
}
.no-after::after,.no-before::before {
display: none;
}
.shadow-sm-bottom {
box-shadow: 0 0.4rem 0.5rem 0 rgba(0, 0, 0, 0.05) !important;
}
.btn.btn-account {
background-color: #def8ef;
color: #0BB783;
}
.btn.btn-account:hover,
.btn.btn-account:focus,
.btn.btn-account:active {
background-color: #d6f5ea;
color: #0BB783;
border: 0;
}
ul.dropdown-menu li .btn.btn-secondary {
background-color: transparent;
border-radius: 0px;
border-width: 0px;
word-spacing: normal;
}
ul.dropdown-menu li .btn.btn-secondary.text-success:not(.text-dark) {
background-color: rgba(255, 255, 255, 0.7) !important;
pointer-events: none;
}
ul.dropdown-menu li .btn.btn-secondary.text-success.text-dark:hover {
background-color: rgba(255, 255, 255, 0.7) !important;
}
ul.dropdown-menu li .btn.btn-secondary.text-dark:hover:not(.btn-active) {
background-color: rgba(255, 255, 255, 0.3) !important;
}
.dropdown .btn.btn-account~.dropdown-menu.bg-white .btn.dropdown-item.text-success:not(.text-dark) {
border-radius: 0;
pointer-events: none;
font-weight: 600;
}
.dropdown .btn.btn-account~.dropdown-menu.bg-white .btn.dropdown-item.text-dark:hover {
border-radius: 0;
background-color: #d6f5ea55 !important;
}
.dropdown .btn.btn-account~.dropdown-menu.bg-white .btn.dropdown-item.text-dark:focus {
border: 0 !important;
}
.btn-account+.dropdown-menu li:not(li:last-child) {
border-bottom: 1px solid #ededed;
}
.btn-account+.dropdown-menu {
max-height: calc(100vh - 230px);
}
.dropdown-menu {
cursor: pointer;
}
.account-box {
padding-right: 8px;
max-height: calc(100vh - 254px);
scrollbar-color: #e2e2e2 #f5f5f5;
}
.account-box::-webkit-scrollbar-track {
background: #f5f5f5;
}
.account-box::-webkit-scrollbar-thumb {
background: #e2e2e2;
}
ul.dropdown-menu:hover .account-box::-webkit-scrollbar-thumb {
background: #e2e2e2;
}
ul.dropdown-menu:hover .account-box {
scrollbar-color: #e2e2e2 #f5f5f5;
}
.btn-account~.dropdown-menu .dropdown-item {
position: relative;
}
.btn-account~.dropdown-menu .dropdown-item.now::before,
.dropdown-menu .dropdown-item.now::before {
content: "";
display: block;
position: absolute;
left: 0;
top: 0;
width: 6px;
border-radius: 0 2px 2px 0;
height: 100%;
background-color: #0BB783;
}
.dropdown-menu .dropdown-item.now::before {
background-color: var(--bs-primary);
}
.menu-item .menu-link.active svg path {
fill: var(--kt-warning) !important;
}
.symbol.symbol-90px.symbol-1by2 .symbol-label {
width: 90px;
height: 45px;
}
/* reset theme */
.conversion-preview-btn {
z-index: 17;
}
#kt_app_header {
background-color: #fff;
box-shadow: 0px 8px 20px -6px rgba(0, 0, 0, 0.05);
z-index: 102;
}
#kt_app_header_wrapper .dropdown-menu {
width: 100%;
min-width: 200px;
}
/* 調整table信件 */
table:not(.dataTable),
#kt_content_container table:not(.dataTable) {
border-collapse: initial;
}
table.dataTable table,
.table-responsive table {
border-collapse: collapse;
}
.table-bordered> :not(caption)>*>* {
border-width: 0;
}
.dataTables_length label {
margin-bottom: 0rem;
}
svg .apexcharts-series path:first-of-type {
fill-opacity: 0.15;
/* 設置填充顏色的透明度為0.5，使其半透明 */
}
.chart-primary svg .apexcharts-series path:first-of-type {
fill: #5463A5;
}
.chart-success svg .apexcharts-series path:first-of-type {
fill: #0BB783;
}
.chart-danger svg .apexcharts-series path:first-of-type {
fill: #F0762F;
}
.btn.btn-secondary,
.btn.btn-secondary:focus:not(.btn-active),
.top-bar.edit-content .btn-secondary {
background-color: #fff !important;
color: #5463A5;
border: 1px solid #5463A5 !important;
}
.btn.btn-circle.stripo-btn:focus,
.btn.btn-circle.toolbar-btn:focus {
border: 0 !important;
color: initial;
}
[data-kt-app-layout=dark-sidebar] .app-sidebar .menu>.menu-item .menu-sub .menu-item .menu-link .menu-title {
color: #fff;
}
.btn-circle.btn.btn-secondary {
border: 0px !important;
color: #3F4254;
}
.btn.btn-secondary.stripo-btn:hover svg path,
.btn.btn-secondary.toolbar-btn:hover svg path {
fill: #fff;
}
.badge.badge-white,
.edm-status-badge,
.sms-status-badge {
background-color: #fff;
}
.badge.badge-primary,
.badge.badge-danger,
.badge.bg-secondary,
.badge.badge-success,
.badge.badge-dark,
.badge.badge-secondary {
color: #fff;
}
.badge.badge-outline.badge-primary {
color: var(--kt-primary);
}
.badge.badge-outline.badge-danger {
color: var(--kt-danger);
}
.badge.badge-outline.badge-success {
color: var(--kt-success);
}
.badge.badge-outline.badge-secondary {
color: var(--kt-secondary);
}
.badge.badge-outline.badge-light {
color: var(--kt-light);
}
.badge.badge-outline.badge-info {
color: var(--kt-info);
}
.badge.badge-outline.badge-dark {
color: var(--kt-dark);
}
ul.dropdown-menu li .btn.btn-secondary {
background-color: transparent;
border-radius: 0px;
border-width: 0px !important;
}
.badge-light-primary.badge {
color: var(--kt-primary);
}
.badge-light-success.badge.bg-secondary {
color: #0BB783;
}
/* other */
.table>thead {
font-weight: 700;
color: #979797;
}
/* datatable */
table.dataTable.table-hover>tbody>tr:hover>* {
box-shadow: inset 0 0 0 9999px #e8ecfc47;
}
.table-hover tbody tr:hover {
background-color: #e8ecfc47;
}
.dataTables_processing {
width: 100% !important;
height: 100% !important;
z-index: 4;
backdrop-filter: blur(5px);
/* 模糊效果 */
color: transparent !important;
background-color: rgba(255, 255, 255, 0.25) !important;
background-image: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.85), transparent);
background-size: 50% 100%;
animation: processing 1.5s infinite;
}
.dataTable td {
word-break: break-word;
}
.table-no-border table {
border: 0px !important;
border-color: transparent;
}
.table-no-border table th,
.table-no-border table td {
border: 0px;
border-bottom: 1px dashed var(--bs-light);
}
.profile-fields-table table {
border-radius: .625rem;
border: 0px
}
.profile-fields-table th {
color: var(--bs-text-gray-600);
padding: .75rem;
}
.profile-fields-table th,
.profile-fields-table td {
border-color: var(--bs-light) !important;
}
.loading-placeholder {
border-radius: 8px;
background: #f6f7f8;
background-image: linear-gradient(to right, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
background-repeat: no-repeat;
background-size: 800px 104px;
display: inline-block;
position: relative;
overflow: hidden;
animation: placeholderShimmer 1.5s linear infinite;
}
@keyframes placeholderShimmer {
0% {
background-position: -468px 0;
}
100% {
background-position: 468px 0;
}
}
@keyframes processing {
0% {
background-position: -50% 0;
}
100% {
background-position: 150% 0;
}
}
/* radio */
.radio-btn {
position: relative;
overflow: hidden;
padding-left: 0;
}
.radio-btn.no-before{
display: flex;
}
.radio-btn .form-check-input {
opacity: 0;
position: absolute;
left: -40px;
}
.radio-btn.no-before .form-check-label::before{
display: none;
}
.radio-btn .form-check-label::before {
content: '';
width: 20px;
height: 20px;
background-color: #fff;
border-radius: 50%;
display: inline-block;
border: 1px solid var(--bs-gray-300);
position: relative;
flex-shrink: 0;
}
.radio-btn .form-check-label {
border-radius: .625rem;
padding: 1rem;
border: 1px solid var(--bs-primary-light);
position: relative;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
background-color: #fff;
}
.radio-btn .form-check-input:checked[type=radio]+.form-check-label,
.radio-btn:hover .form-check-label {
font-weight: 600;
background-color: #d1d8f756;
border: 1px solid var(--bs-primary);
}
.radio-btn .form-check-input:checked[type=radio]+.form-check-label::before {
border: 6px solid var(--bs-primary);
}
.check-require input,
.view-timeline input {
display: none;
}
.check-require label,
.view-timeline label {
background-color: var(--bs-light);
color: var(--bs-gray-500);
gap: 2px
}
.view-timeline label {
background-color: #fff;
border: 1px solid #f5f5f5;
color: var(--bs-gray-700);
border-radius: 8px;
}
.view-timeline .view {
opacity: 0;
}
.view-timeline input[type="checkbox"]:checked+label {
color: var(--bs-primary);
font-weight: 600;
}
.view-timeline.info-light-20 input[type="checkbox"]:checked+label {
background-color: #6dcff634;
color: var(--bs-info);
}
.view-timeline.primary-light input[type="checkbox"]:checked+label {
background-color: var(--bs-primary-light);
color: var(--bs-primary);
}
.view-timeline.danger-light input[type="checkbox"]:checked+label {
background-color: var(--bs-danger-light);
color: var(--bs-danger);
}
.view-timeline input[type="checkbox"]:checked+label .view {
opacity: 1;
}
.check-require label::before {
position: relative;
content: url('data:image/svg+xml;utf8,');
;
width: 18px;
height: 18px;
display: block;
}
.check-require input[type="checkbox"]:checked+label {
background-color: var(--bs-success-light);
color: var(--bs-success);
}
.check-require input[type="checkbox"]:checked+label::before {
content: url('data:image/svg+xml;utf8,');
}
/* stripo */
.sripo-watermark {
display: none !important;
}
/* preview mail */
.symbol .symbol-label.inner-device-btn {
color: #979797;
}
.symbol .symbol-label.inner-device-btn.bg-light-primary {
color: var(--bs-primary);
}
/* loading */
.x-loading {
font-size: 20px;
letter-spacing: 3px;
}
.x-loading span {
animation-name: blink;
animation-duration: 1.4s;
animation-iteration-count: infinite;
animation-fill-mode: both;
}
.x-loading span:nth-child(2) {
animation-delay: 0.2s;
}
.x-loading span:nth-child(3) {
animation-delay: 0.4s;
}
@keyframes blink {
0% {
opacity: 0.2;
}
20% {
opacity: 1;
}
100% {
opacity: 0.2;
}
}
/* end datatable */
.badge.badge-outline {
background-color: #fff;
}
.infobar .badge.badge-success {
background-color: #D7F9EF;
color: #0BB783 !important;
padding: .5rem;
}
.badge.badge-outline.badge-outline-primary {
border: 1px solid #5463A5;
color: #5463A5;
}
.badge.badge-outline.badge-outline-light {
border: 1px solid #979797;
color: #979797;
}
.badge.badge-outline.badge-outline-success {
border: 1px solid #0BB783;
color: #0BB783;
}
.badge.badge-light {
background-color: #f5f5f5;
color: #979797;
padding: .5rem;
}
.topic_thumb {
width: 100%;
max-width: 78px;
max-height: 52px;
}
.header_shadow {
box-shadow: 0px 4px 4px rgba(215, 214, 214, 0.07);
}
.wrapto100 {
flex-grow: 1;
flex-shrink: 1;
width: initial;
}
.css-show {
display: none;
}
input[type="radio"]:checked+label,
input[type="checkbox"]:checked+label,#settings-div input:checked:disabled +.form-check-label{
color: var(--bs-gray-900);
opacity: 1;
}
#settings-div input:checked:disabled{
opacity: 1;
background-color: var(--bs-gray-600);
border-color: var(--bs-gray-600);
cursor: not-allowed;
}
#settings-div input[name="enable_purchase_amt"]{
margin-top:8px ;
}
#settings-div [id^="settings-"]:last-of-type .separator{
display: none;
}
.quick_sum {
background-color: #6DCFF60D;
color: #00ABE6;
display: flex;
}
.sum_list {
gap: 20px;
text-align: center;
width: 100%;
}
.sl_item .sum_pic,
.chead_pic {
width: 60px;
vertical-align: middle;
}
.sl_item {
flex: 1 1 50%;
padding: .75rem 1rem;
}
.imgfit,
.imgcontain {
object-fit: cover !important;
width: 100% !important;
height: 100% !important;
}
.imgcontain {
object-fit: contain !important;
}
.borr0_top {
border-top-left-radius: 0 !important;
border-top-right-radius: 0 !important;
}
.borr0_start {
border-top-left-radius: 0 !important;
border-bottom-left-radius: 0 !important;
}
.borr0_end {
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
.borr0_bottom {
border-bottom-left-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
.bg_f5,
.bg-sc-light {
background-color: #E8ECFC33;
}
.hover-bg-sc-light:hover {
background-color: #E8ECFC33 !important;
}
.bg-sc {
background-color: #E8ECFC;
}
.bg-l_sc {
background-color: #ffffff;
}
.bg-gray {
background-color: #e2e4eb !important;
}
.bg-ddd {
background-color: #dddddd44;
}
.bg-l_light {
background-color: #f9f9f9;
}
.bg-warning-light {
background-color: #f8dc80 !important;
}
.bg-info-light-10 {
background-color: #6DCFF61A;
}
.bg-info-light-20 {
background-color: #6dcff634;
}
.btn-circle {
border-radius: 50%;
padding: .75rem !important;
}
.btn-circle:hover {
background-color: #f5f5f5;
}
.border-light-warning {
border: 1px solid var(--kt-warning-light);
}
.border-light-danger {
border: 1px solid var(--kt-danger-light);
}
.border-light-success {
border: 1px solid var(--kt-success-light);
}
.border-light-info {
border: 1px solid var(--kt-info-light);
}
.border-light-primary {
border: 1px solid var(--kt-primary-light);
}
.btn-min{
padding: 2px;
border-radius: 4px;
display: inline-block;
}
.btn-min:hover{
background-color: var(--bs-primary);
color: #fff;
}
.del-btn.btn-min:hover{
background-color: var(--bs-danger);
border-radius: 4px;
}
.btn-min:hover i::before{
color: #fff !important;
}
.btn-min:hover svg path{
fill: #fff !important;
}
.btn-min:hover svg{
margin: 4px;
}
.pointer {
cursor: pointer;
}
.input-center-1 .radio .form-check:nth-child(2) input[type="radio"],
.input-center-2 .radio .form-check:nth-child(3) input[type="radio"],
.input-center-3 .radio .form-check:nth-child(4) input[type="radio"] {
margin-top: .5rem;
}
.card_border {
border-width: 8px;
}
.step_circle {
width: 28px;
height: 28px;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
}
.lh-reset {
line-height: initial;
}
.btn-outline-mini {
padding: 2px 10px !important;
color: #5463A5;
border: 1px solid #5463A5 !important;
}
.btn-add-searchgroup {
border-radius: 4px;
padding: .75rem 2rem;
background-image: repeating-linear-gradient(to right, #ddd 0%, #ddd 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to right, #ddd 0%, #ddd 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to bottom, #ddd 0%, #ddd 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to bottom, #ddd 0%, #ddd 50%, transparent 50%, transparent 100%);
background-position: left top, left bottom, left top, right top;
background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
background-size: 4px 1px, 4px 1px, 1px 4px, 1px 4px;
background-color: #E8ECFC4D;
}
.btn-add-searchgroup:hover,
.btn-add-searchgroup:focus {
background-image: repeating-linear-gradient(to right, #5463A5 0%, #5463A5 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to right, #5463A5 0%, #5463A5 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to bottom, #5463A5 0%, #5463A5 50%, transparent 50%, transparent 100%), repeating-linear-gradient(to bottom, #5463A5 0%, #5463A5 50%, transparent 50%, transparent 100%);
font-weight: 600;
color: #5463A5;
}
.btn.btn-outline.btn-outline-primary:active,
.btn.btn-outline.btn-outline-primary:focus,
.btn.btn-outline.btn-outline-primary:active:not(.btn-active),
.btn.btn-outline.btn-outline-primary.show.active,
.btn.btn-light-primary:active,
.btn.btn-light-primary:focus,
.btn.btn-light-primary:active:not(.btn-active),
.btn.btn-light-primary:focus:not(.btn-active) {
background-color: initial !important;
color: #5463a5 !important;
}
.btn.btn-outline.btn-outline-primary:active,
.btn.btn-outline.btn-outline-primary:focus,
.btn.btn-outline.btn-outline-primary:active:not(.btn-active),
.btn.btn-outline.btn-outline-primary:focus:not(.btn-active) {
background-color: #fff !important;
}
.btn.btn-outline.btn-outline-info {
border: 1px solid #00ABE6;
color: #00ABE6;
background-color: #fff;
}
.btn.btn-outline.btn-outline-info:hover:not(.btn-active) {
border: 1px solid #00ABE6;
background-color: #00ABE6 !important;
color: #fff !important;
}
.btn.btn-light-primary:active,
.btn.btn-light-primary:focus,
.btn.btn-light-primary:active:not(.btn-active),
.btn.btn-light-primary:focus:not(.btn-active) {
background-color: #F1FAFF !important;
}
.btn.btn-outline.btn-outline-primary {
background-color: #fff;
padding: calc(0.775rem + 1px) calc(1.5rem + 1px);
}
.btn.btn-outline.btn-outline-primary.menu-dropdown:focus,
.btn.btn-outline.btn-outline-primary.menu-dropdown:active,
.btn.btn-secondary:hover:not(.btn-active) {
background-color: #5463A5 !important;
color: #fff;
}
.btn.btn-outline.btn-outline-primary.btn-sm {
font-size: 0.925rem;
padding-top: .65rem;
padding-bottom: 0.65rem;
}
.btn.btn-outline.btn-outline-primary.open {
background-color: #5463A5 !important;
color: #fff;
}
.btn.btn-secondary:hover .svg-icon,
.btn.btn-secondary:not(.active):hover i,
.btn-circle.btn-secondary:hover {
color: #fff !important;
}
.form-switch .form-check-input:checked {
border: 0px !important;
}
.hovershadow {
cursor: pointer;
}
.card,
.hovershadow:hover {
box-shadow: 0px 0px 30px 0px #38476D17 !important;
}
.dropzone {
border: 1px solid #ddd;
}
.empty_circle {
width: 13px;
height: 13px;
border-radius: 50%;
display: inline-block;
}
.badge.badge-closed {
background-color: #ededed;
color: #979797;
}
.no-shadow,
.card.no-shadow {
box-shadow: initial !important;
}
.text-gray {
color: #979797;
}
.pic24px {
width: 24px;
}
.pic12px {
width: 12px;
}
.pic18px {
width: 18px;
}
.pic24px img,
.pic12px img,
.pic18px img {
width: 100%;
}
.fz12 {
font-size: 12px !important;
}
.fz14 {
font-size: 14px !important;
}
.fz16 {
font-size: 16px !important;
}
.w-25 {
width: 25%;
}
.w-270px {
width: 270px;
}
.mw-30 {
max-width: 30%;
}
.mw-60 {
max-width: 60%;
}
.mw-70 {
max-width: 70%;
}
.mw-40 {
max-width: 40%;
}
.mw-80 {
max-width: 80%;
}
.mw-90 {
max-width: 90%;
}
.mw-mx {
max-width: max-content;
}
.minfit {
min-width: fit-content;
}
.min-100px {
min-width: 100px;
max-width: 120px;
}
.min-w-110px {
min-width: 110px;
}
.min-w-220px {
min-width: 220px;
}
.min-w-240px {
min-width: 240px;
}
.mw-120px {
max-width: 120px;
;
}
.mh-41px {
min-height: 41px !important;
}
.border-collapse {
border-collapse: collapse !important;
}
.icon-staff {
height: 14px;
background-color: #84D5F1;
}
.fixtop {
scroll-margin-top: 70px;
}
.top-n-10px {
top: -10px;
}
a.fixtop:target {
display: block;
position: relative;
top: -70px;
visibility: hidden;
}
.longfancy .fancybox__content {
min-height: 620px !important;
}
.gap1r {
gap: 1rem;
}
.ellipsis {
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
white-space: normal;
overflow: hidden;
}
.ellipsis1 {
-webkit-line-clamp: 1;
}
.ellipsis1_mail {
-webkit-line-clamp: 1;
white-space: nowrap;
display: inline-block;
}
.ellipsis2 {
-webkit-line-clamp: 2 !important;
}
.ellipsis3 {
-webkit-line-clamp: 3;
}
.ellipsis4 {
-webkit-line-clamp: 4;
}
.item-ellipsis {
max-height: 200px;
/* 設定顯示的最大高度 */
overflow: hidden;
/* 超出的文字隱藏 */
position: relative;
/* 因為要使用 ::after 偽元素，所以需要設定 relative */
cursor: pointer;
}
.item-expanded,
.dialogbox-pg-type.item-ellipsis.item-expanded {
max-height: 100%;
}
.item-ellipsis__more-btn {
display: none;
position: absolute;
padding: 10px 40px;
width: 100%;
border: 0px;
border-radius: .625rem;
bottom: 5px;
left: 50%;
transform: translateX(-50%);
z-index: 2;
opacity: 0.85;
color: #5463A5;
background-color: #fff;
/* box-shadow: 0 0.1rem 1rem 0.15rem rgba(0, 0, 0, 0.04); */
text-align: center;
}
.dialogbox-pg-type .item-ellipsis__more-btn {
padding: 4px 40px;
bottom: 0;
}
.item-ellipsis__more-btn:hover {
background-color: #fbfcff;
}
.item-expanded .item-ellipsis__more-btn {
position: relative;
bottom: 0;
box-shadow: none;
}
.item-ellipsis__more-btn.show {
display: block;
}
.item-ellipsis::before,
.item-ellipsis::after {
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 90px;
/* 可調整高度以控制模糊效果的範圍 */
background: linear-gradient(transparent, rgba(255, 255, 255, 0.99));
/* 使用半透明的背景色 */
pointer-events: none;
/* 確保不影響下方元素的交互 */
opacity: 1;
/* 預設透明度為1 (完全不透明) */
transition: opacity 0.3s;
/* 修改過渡效果應用於透明度 */
}
.dialogbox-pg-type.item-ellipsis::before,
.dialogbox-pg-type.item-ellipsis::after {
height: 16px;
}
.item-ellipsis.item-expanded::before,
.item-ellipsis.item-expanded::after,
.hide-pseudo-elements::before,
.hide-pseudo-elements::after {
opacity: 0;
}
.miniborder {
position: relative;
}
.miniborder::after {
content: "";
width: 1px;
height: 80%;
background-color: #eeeeee;
position: absolute;
right: -30%;
top: 50%;
transform: translateY(-50%);
}
.float-btn-right.float-fixed {
position: fixed;
top: 150px;
/* 調整浮動位置距離上方的距離 */
}
.sticky-box {
margin-left: -60px;
padding-top: 32px;
}
/* .float-btn-right{
top: 40px;
z-index: 4;
} */
nav.editornav.navbar {
position: sticky;
background-color: #fff;
flex-direction: column;
}
.statebar {
flex: 1 1 40%;
max-width: 100%;
}
.sl_item_state {
min-width: 100px;
max-width: 120px;
}
.flex_1 {
flex: 1 1 auto;
}
.subbar {
flex: 1 1 25%;
max-width: 100%;
}
.minitb_line {
flex: 1 1 55%;
max-width: calc(80.67% - 3px);
}
.minitb_line .campaign_list {
margin-top: 8px;
border-top: 1px solid #f5f5f5;
padding-top: 6px;
}
.minitb_line .campaign_list:first-of-type {
border: 0px;
margin-top: 0;
padding-top: 0;
}
.cl_state {
flex: 1 1 auto;
max-width: 93%;
align-items: center;
}
.fill_60 {
justify-content: start;
flex: 1 1 60%;
max-width: 100%;
}
.cl_state_time {
flex: 1 0 190px;
max-width: 120px;
}
.cl_state_chart {
flex: 1 0 500px;
max-width: 600px;
}
.sent_sum {
width: 20%;
}
.sent_chart {
width: 60%;
}
.text-lowdark {
color: #3F4254 !important;
}
.fancybox__content {
border-radius: .625rem;
}
.fancybox-noscroll::before,
.fancybox-noscroll::after {
display: none;
}
.fancybox-noscroll {
height: 100vh;
align-items: center;
padding: 3.5rem 100px;
}
.fancybox__carousel .fancybox__slide.has-iframe.fancybox-noscroll .fancybox__content {
height: 100%;
}
.pageheader {
border-radius: 12px;
background-color: #fff;
box-shadow: 0px 0px 20px 0px #4C577D1A;
}
.pageheader .form-switch {
padding-left: 0;
}
.infobar {
padding: 16px 30px 8px 30px;
}
.infobar.infobar-notab {
padding-bottom: 16px;
}
.infobar span.funnel-name-display,
.infobar span.hook-name-display,
.infobar span.sales-name-display,
.infobar .infobar_name {
color: #181C32;
}
.infobar span.fz14,
.infobar span.fz12 {
color: #979797;
}
.infobar .x_tooltip span.funnel-name-display,
.infobar .x_tooltip span.hook-name-display,
.infobar .x_tooltip span.sales-name-display {
color: #fff;
}
.x_tooltip .text-muted {
color: #c1c1c1 !important;
}
.infobar span.badge.badge-danger,
.infobar span.badge.badge-primary {
color: #fff;
}
.infobar .badge.badge-success span {
color: #0BB783;
}
.head_stepper {
background-color: #E8ECFC4D;
padding: 0px 30px;
}
.head_stepper_style {
padding: 16px 30px;
max-width: max-content;
}
.bg-hsc {
background-color: #9fa6f0;
}
.del-btn {
color: var(--bs-danger);
position: relative;
z-index: 10;
cursor: pointer;
}
.del-btn:hover {
background-color: var(--bs-danger);
color: #fff;
border-radius: 50%;
}
.del-btn-no-hover:hover {
background-color: initial;
border-radius: initial;
color: initial;
}
.menu-item .del-btn:hover {
border-radius: 0;
background-color:var(--bs-danger-light) ;
}
.sub-menu-middle{
top: 50% !important;
transform: translateY(-50%) !important;
left: 100% !important;
}
.sticky-menu .vertical-menu-item:not(:last-of-type){
border-bottom:1px solid var(--bs-light)
}
.sticky-menu .vertical-menu-item:hover{
background-image: none;
background-color: var(--bs-primary-light);
border-radius: 8px 25px 25px 8px;
}
.pageheader-tab{
background-color: #fff;
border:1px solid #e0e4f8;
border-top:4px solid #ededff !important;
border-radius: 0 0 12px 12px;
overflow: hidden;
padding-bottom: 12px;
}
.pageheader-tab:not(.left) .nav{
padding-left: 2.25rem;
}
.pageheader-tab .nav-item:not(:last-of-type){
border-right: 1px solid #fff;
}
.pageheader-tab .nav-item .nav-link{
padding: 8px 32px !important;
margin-right: 0px !important;
color: var(--bs-primary);
border-right: 1px solid #fff;
font-weight: normal;
display: flex ;
align-items: center;
justify-content: center;
border:0px !important;
background-color: #ededff;
}
.pageheader-tab .nav-item:first-of-type{
border-radius: 0 0 0 12px;
overflow: hidden;
}
.pageheader-tab .nav-item:last-of-type{
border-radius: 0 0 12px 0px;
overflow: hidden;
}
.pageheader-tab .nav-link.active,.pageheader-tab .nav-link:hover{
border-bottom: 0px !important;
font-weight: 600;
transition: 1s;
}
.pageheader-tab .nav-link.active,.pageheader-tab .nav-link.active:hover{
background-color: var(--bs-primary) !important;
color: #fff !important;
}
.pageheader-tab .nav-link:hover{
background-color: #7183d4 !important;
color: #fff !important;
}
.pageheader.l-shape{
height: 51.68px;
border-bottom: 1px solid #f5f5f5;
border-top:4px solid #ededff
}
.pageheader-tab.left{
align-self: flex-start;
border: 0px !important;
padding-bottom: 0px;
}
.mini.pageheader-tab{
position: absolute;
left: 50%;
top: 0;
transform: translateX(-50%);
border:0px;
border-radius: 0 0 4px 4px;
box-shadow: 0 .5rem 1rem 0.25rem rgba(0, 0, 0, 0.05) !important;
z-index: 3;
}
.pageheader-l{
position: absolute;
background-color: #fff;
top: 100%;
box-shadow: 0 .5rem 1rem 0.25rem rgba(0, 0, 0, 0.05) !important;
border:1px solid #f5f5f5;
border-top:2px solid #fff;
z-index: 3;
width: 350px;
border-radius: 0 0 12px 12px;
padding-right: 12px;
}
.pageheader-l::before{
content: '';
position: absolute;
top: -7px;
left: 0;
right: 0;
height:10px;
background: white;
z-index: 4;
}
.mini.pageheader-tab .nav-item .nav-link{
padding: 2px 16px !important;
font-size: 14px;
}
.pageheader-mini-breadcrumb{
height: 51.68px;
min-width:340px ;
}
.pageheader-mini-title{
height: calc( 51.68px - .5rem );
max-width: 200px;
}
.pg-breadcrumb{
padding-right: 8px;
display: inline-block;
position: relative;
}
.pg-breadcrumb::after{
content: '';
width: 2px;
height: 2px;
border-radius: 50%;
display: inline-block;
background-color: #555;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: -4px;
}
.date{
flex-wrap: wrap;
border-bottom: 1px dashed var(--bs-light);
margin-bottom: .5rem;
}
.date .hor_label_div{
padding-bottom: 4px;
}
.date .form-select-sm{
padding-right: 12px;
}
.date input{
max-width: 75px !important;
min-width: 60px !important;
}
.date select{
width: 100%;
}
.flex-basis-150px {
flex: 1 1 150px;
}
.sales-name-display-div,
.infobar_name {
min-width: 20%;
max-width: 260px;
height: 50px;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.infobar_name,
.infobar_mailname,
.infobar_sender {
max-width: 260px;
min-width: auto;
}
.series .infobar_name {
max-width: 400px;
}
.infobar_mailname,
.infobar_sender {
flex-grow: 1;
max-width: max-content;
}
.infobar_type {
min-width: 90px;
}
.infobar_type ul {
display: flex;
gap: 8px;
}
.infobar_time {
min-width: 165px;
}
.infobar_prd {
max-width: 180px;
}
.infobar_info {
max-width: 180px;
}
.infobar_more {
flex: 1 1 350px;
}
.infobar_more.near_ctrl {
flex: 1 0 170px;
}
.series .infobar_more.near_ctrl {
flex: 1 0 200px;
}
.near_ctrl~div {
min-width: 87px;
}
.infobar_more-collapse {
display: none;
}
.infobar_more-nocollapse {
display: flex;
}
.skunum {
font-weight: 300;
}
.x_tooltip {
visibility: hidden;
position: absolute;
background-color: #3F4254;
color: #fff !important;
padding: 1rem;
border-radius: 12px;
}
.x_tooltip .border-dot-top,
.tippy-box .border-dot-top {
border-top: 1px dashed #d0d0d089;
}
.x_tooltip ol {
list-style: decimal inside;
}
.toparrow {
position: relative;
}
.toparrow::after {
content: "";
position: absolute;
top: -2.25rem;
left: 50%;
transform: translateX(-50%);
border-width: 10px;
border-style: solid;
border-color: transparent transparent #3F4254 transparent;
}
.infobar_prd:hover .x_tooltip,
.infobar_time:hover .x_tooltip,
.sales-name-display-div:hover .x_tooltip,
.infobar_lang:hover .x_tooltip,
.infobar_name:hover .x_tooltip,
.infobar_info:hover .x_tooltip,
.infobar_tip:hover .x_tooltip {
visibility: visible;
top: 100%;
left: 50%;
transform: translateX(-50%);
margin-top: .5rem;
z-index: 200;
width: 100%;
min-width: 250px;
}
.infobar_time:hover .x_tooltip {
min-width: 280px;
}
.triangle-right {
width: 0;
height: 0;
border-top: 5px solid transparent;
border-bottom: 5px solid transparent;
border-left: 10px solid #fff;
}
.arrow-right {
position: relative;
}
.arrow-right::before {
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 6px 0 6px 6px;
border-color: transparent transparent transparent #979797;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.triangle-top,
.dialogbox__info .hover-div::after {
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 10px solid black;
}
.hor_label_div {
flex: 0 0 100px;
}
.hor_label_div-120px {
flex: 0 0 120px;
}
.hor_label_div-140px {
flex: 0 0 140px;
}
.upload_logo {
background-position: left;
background-size: contain !important;
}
.funnel-graphic__page {
margin: 10px auto;
overflow: hidden;
z-index: 2;
position: relative;
display: flex;
justify-content: center;
}
.funnel-graphic__area .funnel-graphic__page:nth-child(1) {
margin-top: 0;
}
.funnel-graphic__area .funnel-graphic__page:nth-child(2),
.funnel-graphic-state__area .funnel-graphic-state__line:nth-child(2) .funnel-graphic__page {
padding-left: 22px;
padding-right: 22px;
}
.funnel-graphic__area .funnel-graphic__page:nth-child(3),
.funnel-graphic-state__area .funnel-graphic-state__line:nth-child(3) .funnel-graphic__page {
padding-left: 42px;
padding-right: 42px;
}
.funnel-graphic__area .funnel-graphic__page:nth-child(4),
.funnel-graphic-state__area .funnel-graphic-state__line:nth-child(4) .funnel-graphic__page {
padding-left: 52px;
padding-right: 52px;
}
.funnel-graphic__area .funnel-graphic__page:nth-child(5),
.funnel-graphic-state__area .funnel-graphic-state__line:nth-child(5) .funnel-graphic__page {
padding-left: 62px;
padding-right: 62px;
}
.funnel-graphic__area .funnel-graphic__page:last-child {
margin-bottom: 0;
}
.funnel-graphic__area .funnel-graphic__page:last-child .funnel-graphic__bg {
height: 100px;
clip-path: polygon(100% 0, 90% 75%, 50% 100%, 10% 75%, 0 0);
padding-top: 0;
margin-top: -10px;
}
.funnel-graphic-state__area .funnel-graphic-state__line:last-child .funnel-graphic__page {
clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.funnel-graphic-state__area .funnel-graphic-state__line:last-child .funnel-graphic__page .funnel-graphic__bg {
padding-top: 0;
margin-top: -20px;
height: 110px;
}
.funnel-graphic__area .funnel-graphic__page:last-child .funnel-graphic__bg::after {
/* content: ''; */
width: 0;
height: 0;
border-style: solid;
border-width: 5rem 5rem 0 5rem;
border-color: #007bff transparent transparent transparent;
position: absolute;
top: 100%;
}
.funnel-graphic__bg {
background-color: #E8ECFC;
padding: .75rem 1rem;
clip-path: polygon(0 0, 100% 0, 94% 100%, 6% 100%);
display: flex;
flex-direction: column;
align-items: center;
color: #3F4254;
justify-content: center;
position: relative;
}
.funnel-graphic__page a:hover .funnel-graphic__bg {
background-color: #5463a5;
color: #fff;
}
.funnel-graphic__bg span.ellipsis {
max-width: 120px;
}
.funnel-graphic__state {
background-color: #fff;
padding: 8px;
border-radius: 4px;
}
.funnel-graphic-state__area .funnel-graphic__bg {
background-color: #dfecfb;
color: #378dd9;
width: 100%;
height: 90px;
justify-content: center;
box-shadow: 0px 0px 20px 0px #38476D0D;
}
.funnel-graphic-state__area .funnel-graphic__page {
margin: 0;
display: flex;
align-items: center;
}
.funnel-graphic-state__line {
position: relative;
justify-content: start;
}
.funnel-graphic-state__line .funnel-graphic__page {
width: 300px;
position: relative;
z-index: 2;
}
.funnel-graphic__state {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
box-shadow: 0px 0px 20px 0px #38476D0D;
z-index: 2;
}
.funnel-graphic-state__line::before {
content: '';
position: absolute;
width: 70%;
height: 1px;
border: 1px dashed #e0dfdf;
right: 10%;
top: 50%;
transform: translateY(-50%);
z-index: 1;
}
.funnel-graphic-state__convert {
background-color: #E1F0FF;
padding: .25rem .5rem;
border-radius: 4px;
display: inline-flex;
align-items: center;
color: #00ABE6;
width: 100%;
}
.com-send-record {
padding: 16px 30px;
background-color: #aaf5c844;
border-radius: .625rem .625rem 0 0;
}
.com-send-record h2 {
color: #0BB783;
}
.com-send-record.com-send-record_all {
background-color: #E1F0FF;
position: relative;
}
.com-send-record.com-send-record_all h2 {
color: #007bff;
}
.com-send-record_all::before {
content: '';
width: 20px;
height: 55px;
background-color: #007bff;
position: absolute;
top: 0;
left: 0;
border-radius: .625rem 0 0 0;
}
#rules-div .rules:last-of-type .or-circle {
display: none;
}
.or-circle::before {
content: 'or';
font-size: 11px;
background-color: #F5F5F5;
color: #979797;
border-radius: 50%;
width: 24px;
height: 24px;
position: absolute;
display: flex;
align-items: center;
justify-content: center;
left: 4.15rem;
}
.card-header.active {
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
}
.rule-result .badge:hover~#search-collapsible .card-body,
.rule-result .badge:active #search-collapsible .card-body {
display: none;
}
.rule-result .badge {
cursor: default;
}
.autowidth {
flex: 1 1 auto;
}
#search-collapsible {
position: absolute;
width: 100%;
top: 100%;
left: 0;
z-index: 4;
}
.fancybox-phone .fancybox__slide::before,
.fancybox-phone .fancybox__slide::after {
max-width: 0 auto;
}
.fancybox-phone .fancybox__carousel .fancybox__slide.has-iframe .fancybox__content {
height: 100%;
}
.sim_size {
width: 350px;
}
.sim_phone {
background-color: #181C32;
padding: 2rem 1rem;
border-radius: 20px;
}
.sim_phone_screen {
height: calc(70vh + 40px);
overflow-y: auto;
overflow-x: hidden;
border-radius: 10px;
}
#SimScrollbar.sim_phone_screen::-webkit-scrollbar-track {
background-color: #181C32;
}
#SimScrollbar.sim_phone_screen::-webkit-scrollbar-thumb {
background-color: #676767;
}
.sim_phone-body {
background-color: #f5f5f5;
padding: 2rem;
display: flex;
flex-direction: column;
gap: .5rem;
min-height: 100%;
justify-content: stretch;
}
.sim_phone-body.mms-body {
padding: 1rem 1.5rem;
}
.sim_phone-msg {
background-color: #fff;
padding: 1.5rem 2rem;
border-radius: 12px;
box-shadow: 0px 0px 10px 0px #38476d27;
}
.sim_phone-msg.mms-pic {
padding: 0;
overflow: hidden;
width: 100%;
}
.scroll-pagemap__box {
position: sticky;
top: 110px;
right: 0;
height: 100%;
max-height: 700px;
padding: 2rem;
background-color: #f8f9fa;
left: 100%;
z-index: 5;
display: block;
}
.scroll-pagemap__frame {
height: 550px;
/* overflow: hidden; */
position: relative;
width: 400px;
}
.scroll-pagemap__frame .nav.nav-pills {
width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
align-items: center;
justify-content: center;
}
.scroll-pagemap__frame .nav-pills .nav-item {
margin-right: 0;
flex: 1;
min-height: 0;
flex-basis: auto;
align-items: center;
width: 100%;
min-width: 0;
}
.scroll-pagemap__frame .nav-pills .nav-link {
/* -webkit-filter:blur(1px); */
transform: scale(1);
transition: transform .2s, opacity .2s;
padding: 0px;
text-align: center;
display: block;
opacity: 0;
}
.scroll-pagemap__frame .nav-pills .nav-link.active,
.scroll-pagemap__frame .nav-pills .nav-link.open {
-webkit-filter: blur(0px);
filter: blur(0px);
transform: scale(1.3);
z-index: 15;
padding: 4px;
opacity: 1;
/* background-color: #f6f6f6; */
}
.scroll-pagemap__frame .nav-pills .nav-link.active:first-of-type {
margin-top: 5.2rem;
}
.scroll-pagemap__frame .nav-pills .nav-link.active img {
border-radius: .475rem;
overflow: hidden;
}
.scroll-pagemap__frame .nav-pills .nav-link>img {
width: 100%;
object-fit: contain;
height: 100%;
object-position: center;
}
.scroll-pagemap__bg {
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.scroll-pagemap__bg[data-banner_style="original_upload"] {
background-image: url('../img/ui/hook/redeem_bg1.webp');
}
.scroll-pagemap__bg[data-banner_style="sys_synthesize"] {
background-image: url('../img/ui/hook/redeem_bg1_1.webp');
}
.EVT.scroll-pagemap__bg[data-banner_style="original_upload"][data-map_style="MAP"i] {
background-image: url('../img/ui/hook/event_bg1.webp');
}
.EVT.scroll-pagemap__bg[data-banner_style="original_upload"][data-map_style="NO_MAP"i] {
background-image: url('../img/ui/hook/event_bg1_online.webp');
}
.EVT.scroll-pagemap__bg[data-banner_style="sys_synthesize"][data-map_style="MAP"i] {
background-image: url('../img/ui/hook/event_bg2.webp');
}
.EVT.scroll-pagemap__bg[data-banner_style="sys_synthesize"][data-map_style="NO_MAP"i] {
background-image: url('../img/ui/hook/event_bg2_online.webp');
}
.sales-collective-buying.scroll-pagemap__bg {
background-image: url('../img/ui/sales/teamsales_bg.webp');
}
.sales-general-activity.scroll-pagemap__bg[data-addon_style="ROW"] {
background-image: url('../img/ui/sales/basicsales_bg1_hor.webp');
}
.sales-general-activity.scroll-pagemap__bg[data-addon_style="COL"] {
background-image: url('../img/ui/sales/basicsales_bg2_ver.webp');
}
.LEAD.scroll-pagemap__bg[data-banner_style="original_upload"] {
background-image: url('../img/ui/hook/lead_bg1.webp');
}
.LEAD.scroll-pagemap__bg[data-banner_style="sys_synthesize"] {
background-image: url('../img/ui/hook/lead_bg1_1.webp');
}
.scroll-pagemap__bg.hook-offer-direct[data-form_display_type="CTR"] {
background-image: url('../img/ui/hook/form_first_bg1_CTR.webp');
}
.scroll-pagemap__bg.hook-offer-direct[data-form_display_type="LIR"] {
background-image: url('../img/ui/hook/form_first_bg1_LIR.webp');
}
.scroll-pagemap__bg.hook-offer-direct[data-form_display_type="LTR"] {
background-image: url('../img/ui/hook/form_first_bg1_LTR.webp');
}
.scroll-pagemap__bg.VOTING {
background-image: url('../img/ui/hook/vote_bg1.webp');
}
.data-repeater-item {
margin-bottom: .75rem;
}
.data-repeater-list .data-repeater-item:last-child {
margin-bottom: 0;
}
#scrollspy-placeholder {
/* position: fixed; */
top: 0;
left: 0;
width: 100%;
z-index: -1;
}
.follow-up__box {
border: 1px solid #f5f5f5;
overflow: hidden;
cursor: pointer;
}
.follow-up__pic,
.follow-up__text {
padding: 4px 6px;
background-color: #F5F5F5;
}
.follow-up__box.open .follow-up__pic,
.follow-up__box.send .follow-up__pic {
color: #3F4254;
}
.follow-up__box.open .follow-up__text,
.follow-up__box .follow-up__text,
.follow-up__box.send .follow-up__text {
background-color: #fff;
font-size: 1rem;
font-weight: 600;
color: var(--bs-gray-600);
gap: 16px;
}
.follow-up__box .follow-up__text,
.follow-up__box .follow-up__pic {
color: #CCC;
}
.follow-up__box .follow-up__pic img {
opacity: .25;
}
.follow-up__box.open .follow-up__text .badge,
.follow-up__box.send .follow-up__text .badge,
.follow-up__box.open .follow-up__pic img,
.follow-up__box.send .follow-up__pic img {
opacity: 1;
}
.follow-up__box .follow-up__text .badge {
opacity: .5;
}
.follow-up__text .badge {
padding-top: 4px;
padding-bottom: 4px;
}
.follow-up-size {
padding: 4px 0px;
}
.follow-up__box::before {
width: 14px;
height: 14px;
display: flex;
align-items: center;
justify-content: center;
position: absolute;
top: 0;
left: 0;
background-color: #F5F5F5;
border-radius: 50px;
}
.follow-up__box.open::before {
background-color: #5463A5;
}
.follow-up__box.send::before {
display: none;
}
.follow-up__box.send {
pointer-events: none;
}
.follow-up__box.open {
border-color: #5463A520;
}
.follow-up__box:hover .follow-up__text {
background-color: #eeeeee27;
}
.follow-up__box:hover .follow-up__text__btn,
.pg__info:hover .pg__info__btns {
visibility: visible;
transition: .5s;
}
.pg__info__pic {
width: 128px;
height: 72px;
overflow: hidden;
border-radius: 6px;
}
.pg__info__pic img {
object-position: left top;
}
.pg__info {
border-radius: 6px 6px 0 0;
}
.pg__box {
border-radius: 6px;
border: 1px solid #E4E6EFE5;
}
.pg__box.hook {
border: 1px solid #FCB8134D;
}
.pg__box.sales-name-display-div {
border: 1px solid #6DCFF64D;
}
.pg__box.meber {
border: 1px solid #E8ECFC4D;
}
.pg__box .pg__info {
background-color: #F5F5F580;
cursor: pointer;
}
.pg__box.hook .pg__info {
background-color: #FCB8131A;
}
.pg__box.sales .pg__info {
background-color: #6DCFF61A;
}
.pg__box.member .pg__info {
background-color: #E8ECFC4D;
}
.pg__box.hook+.follow-up__convert .follow-up__convert__info {
border-left: 1px solid #FCB8134D;
padding: 16px 16px 0 16px;
}
.pg__box.sales+.follow-up__convert .follow-up__convert__info {
border-left: 1px solid #6DCFF64D;
padding: 16px 16px 0 16px;
}
.pg__box.member+.follow-up__convert .follow-up__convert__info {
border-left: 1px solid #E8ECFC;
padding: 16px 16px 0 16px;
}
.pg__box.hook .pg__info__text .badge.badge-outline {
color: #FCB813;
border: 1px solid #FCB813;
}
.pg__box.sales .pg__info__text .badge.badge-outline {
color: #6DCFF6;
border: 1px solid #6DCFF6;
}
.pg__box.member .pg__info__text .badge.badge-outline {
color: #5463A5;
border: 1px solid #5463A5;
}
.bg-sales-icon {
background-color: #a9d4f3 !important;
}
.border-hook.timeline-line {
border-left-color: #FCB8134D;
}
.border-sales.timeline-line {
border-left-color: #6DCFF64D;
}
.border-member.timeline-line {
border-left-color: #5463A5B2;
}
.border-pg.timeline-line {
border-left-color: #E4E6EFE5;
}
.iframe-card{
box-shadow: none !important;
border: 0px;
margin-left: calc(var(--bs-gutter-x)* -0.5);
}
.iframe-card [id$="-other"]{
margin-top: 6px;
}
.iframe-card [id$="-other"].has-other +.form-check-label{
display: flex;
gap: 4px;
align-items: center;
flex-wrap: wrap;
}
.iframe-card [id$="-other"].has-other + .form-check-label .other-option-div .form-control{
border:0px !important ;
border-bottom: 1px solid var(--bs-gray-500) !important;
margin-bottom: 0 !important;
background-color: initial;
border-radius: 0;
padding: 2px;
}
.iframe-card [id$="-other"].has-other + .form-check-label .other-option-div .mb-3.form-group{
margin-bottom: 0 !important;
margin-top: -6px;
min-width: 200px;
}
.follow-up-drawer .card .card-header,.iframe-card .card-header {
min-height: 42px;
}
.follow-up-drawer .card .card-scroll,.iframe-card .card-scroll {
height: calc(100vh - 122px) !important;
}
.follow-up-drawer .card .card-body ,.iframe-card .card-body{
padding: 1rem 2.25rem;
}
.follow-up-drawer .card-footer ,.iframe-card .card-footer{
padding: 1rem;
background-color: #fff;
}
.follow-up-drawer .card{
border: 0px;
}
#mms-followup-component-drawer .accordion-button::after {
margin-left: 0;
}
.fnl-pageheader {
z-index: 101;
position: relative;
}
.fnl-pageheader.position-fixed.w-100 {
width: calc(100% - var(--bs-app-sidebar-width) - 4rem) !important;
}
.fnl-pageheader.position-fixed.w-100.edit-pg,
.fnl-pageheader.position-fixed.w-100.edit-edm,
.fnl-pageheader.position-fixed.w-100.edit-sms,
.fnl-pageheader.position-fixed.w-100.edit-mms,
.fnl-pageheader.position-fixed.w-100.edit-line {
width: calc(100% - var(--bs-app-sidebar-width)) !important;
right: 0;
top: 70px;
border-radius: 0 0 .652rem .625rem;
}
.top-bar.edit-content {
width: calc(100% - 60px);
right: 0;
z-index: 2;
}
.mt-0.edit-content {
margin-left: 60px;
margin-top: var(--header-height) !important;
}
.edit-content>#page-builder.mt-3 {
margin-top: 0 !important;
}
.edit-pg .pageheader {
border-radius: 0;
}
.edit-pg-fixed-area {
/* height: calc(100vh - 163.45px); */
overflow: hidden;
margin-top: calc(51.68px - 0.75rem);
}
.edit-pg-fixed-area__main {
padding: 2rem;
}
.edit-pg-fixed-area__main {
height: calc(100vh - 122px - 32.8px - 0.75rem);
}
.edit-pg-acc .accordion-item {
border: 0;
}
.edit-pg-acc .accordion-body {
padding: 8px 1.5rem 8px 0;
}
.edit-pg-acc .accordion-button {
background-color: #E8ECFC55;
color: var(--bs-primary);
}
.edit-pg-acc .accordion-button.nav-link {
border-radius: 0;
}
.edit-pg-acc .accordion-button.no_acc::after {
rotate: 90deg;
}
.edit-pg-acc .nav-pills .nav-link.active,
.nav-pills .show>.nav-link,
.edit-pg-acc .nav-link:hover {
background-color: var(--bs-primary-light);
color: #5463A5;
}
.acc-scroll-open {
position: absolute;
left: -225px;
height: 1px;
width: 1px;
}
.pg-catalog .current .pg-catalog__btn,
#steps li.current,
#steps .steps li:hover {
background-color: var(--bs-primary-light);
}
.qk-btn {
background-color: #fff;
}
.pg-catalog__btn:hover,
.qk-btn:hover,
.hover-sc:hover {
background-color: #E8ECFC44;
}
.hover-shadow:hover {
box-shadow: 4px 8px 12px -8px rgba(0, 0, 0, 0.05);
}
.collapse-arrow {
transition: transform 0.2s;
}
.collapse .collapse-arrow {
transform: rotate(180deg);
}
.collapse.collapsed .collapse-arrow {
transform: rotate(0deg);
}
.re-upload.collapse.collapsed{
padding: 4px 8px;
}
.re-upload +.collapse.show {
padding: 1rem;
background-color: var(--bs-primary-light);
border-radius: .625rem 0 .625rem .625rem;
}
.upload-file::before{
content: 'file';
width: 42px;
height: 18px;
display: flex;
background-color: var(--bs-info);
color: #fff;
align-items: center;
justify-content: center;
border-radius: 8px;
flex-shrink: 0;
}
.re-upload.collapse:not(.collapsed){
background-color: var(--bs-primary-light);
padding: 4px 8px;
border-radius: .625rem .625rem 0 0;
}
.iframe-content {
transform-origin: 0 0;
transform: scale(0.5);
height: 60vh;
max-width: 1200px;
}
.iframe-container {
position: relative;
cursor: pointer;
}
.iframe-overlay {
display: none;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #fff;
z-index: 10;
/* 確保在 iframe 上面 */
text-align: center;
}
.iframe-container:hover .iframe-overlay {
display: block;
}
.iframe-overlay .csswidth {
max-width: 650px;
}
.iframe-content iframe {
width: 200%;
height: 200%;
min-height: 80vh;
}
.w-50 iframe {
min-height: 90vh;
/* 這裡可以根據需要調整 */
height: 100%;
;
}
/* jq step */
[id^="steps-h-"] {
display: none;
}
.edit-pg-fixed-area .content {
flex-grow: 1;
height: auto;
padding: 2rem 4rem 1rem 4rem;
overflow-y: scroll;
}
.edit-pg-fixed-area .steps {
height: auto;
width: 300px;
flex-shrink: 0;
padding-top: 60px;
}
.edit-pg-fixed-area .edit-pg-fixed-area__main {
display: flex;
padding-top: 0;
padding-bottom: 0;
}
.edit-edm .pageheader {
position: relative;
border-radius: 0 0 .625rem .625rem;
}
.edit-edm__content,
.edit-sms__content,
.edit-line__content,
.edit-mms__content {
margin-top: 60px !important;
}
.toolbar-card,
.edm-card,
.sms-card,
.line-card,
.mms-card {
background-color: #fff;
box-shadow: 0 8px 18px rgba(0, 0, 0, 0.06),
6px 4px 18px rgba(0, 0, 0, 0.06),
-6px 4px 18px rgba(0, 0, 0, 0.06) !important;
z-index: 10;
}
#toolbar-info+.toolbar-card,
#edm-info+.edm-card,
#sms-info+.sms-card,
#line-info+.sms-card,
#mms-info+.mms-card,.toolbar-btn +.toolbar-card {
display: none;
position: absolute;
top: 100%;
right: 0;
width: 600px;
border-radius: 0px 0px .625rem .625rem !important;
}
.fnl-model-box.toolbar-btn +.toolbar-card{
left: 44px;
right: initial;
max-width: 350px;
}
#toolbar-info.open,
#edm-info.open,
#sms-info.open,
#line-info.open,
#mms-info.open {
background-color: #5463A5 !important;
color: #fff !important;
}
.edm-card .accordion-button:not(.collapsed) {
border-left: 10px solid var(--bs-primary);
}
#steps .steps>ul {
list-style: none;
background-color: #fff;
border-radius: .625rem;
box-shadow: 0 0.1rem 1rem 0.25rem rgba(0, 0, 0, 0.05) !important;
padding: 1rem;
margin-top: 1rem;
}
.steps .title {
padding: 1rem;
color: #5463A5;
font-size: 1.25rem;
border-bottom: 1px solid #f5f5f5;
display: flex;
align-items: center;
justify-content: space-between;
}
.steps .title::after {
content: "";
height: 12px;
width: 12px;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23979797'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
rotate: 270deg;
}
.steps .title:last-of-type {
border: 0;
}
.auto-save {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
padding: 4px 1rem;
border-radius: 0 0 6px 6px;
}
#steps .actions {
display: none;
}
.form-select option {
padding: 10px;
}
.top-70px {
top: 70px;
}
.fnl-pageheader.open #pageheader.open {
display: block;
}
.fnl-pageheader.close .pageheader {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
.fnl-pageheader.close .fnl-innerbar {
width: 100%;
margin: 0;
border-radius: 0;
box-shadow: 0px 8px 20px -6px rgba(0, 0, 0, 0.2);
padding: .35rem 3rem .35rem 2rem;
}
.fnl-pageheader.open.fnl-innerbar {
box-shadow: none;
}
.pageheader.close {
display: none;
}
.fnl-innerbar {
background-color: #00ABE6;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
padding: .25rem 2rem .25rem .75rem;
color: #FFF;
}
.fnl-pageheader.position-sticky.top-0 {
top: -1px !important;
}
.fnl-innerbar .badge {
color: #00ABE6;
}
.fnl-pageheader.hook .fnl-innerbar,
.hook .fnl-innerbar {
background-color: var(--hook-bg);
color: #bc9201;
}
.fnl-pageheader.hook .fnl-innerbar .badge,
.hook .fnl-innerbar .badge {
color: var(--hook-text);
}
.fnl-pageheader.hook .fnl-innerbar .badge:last-of-type {
color: var(--hook-text);
}
.fnl-pageheader.hook .fnl-hint,
.hook .fnl-innerbar .fnl-hint {
color: #bc9201c9;
}
.fnl-hint {
font-size: 12px !important;
}
.fnl-innerbar a {
color: #fff !important;
}
.fnl-pageheader.hook .fnl-innerbar a,
.hook .fnl-innerbar a {
color: #826217 !important;
}
.fnl-pageheader .fnl-innerbar {
border-radius: .625rem .625rem 0 0;
margin: 0 1.25rem;
width: calc(100% - 2.25rem);
padding: .35rem 1.5rem .35rem 1rem;
}
.info .fnl-innerbar {
background-color: #d0d2da;
color: #6c6c6c;
}
.info .fnl-innerbar a,
.info .fnl-hint {
color: #534747 !important;
}
.info .fnl-innerbar .badge {
color: #979797;
}
.sales .fnl-innerbar {
background-color: #d2ecf9;
color: #4aa7cc;
}
.sales .fnl-innerbar .badge {
color: #4aa7cc;
}
.sales .fnl-innerbar a {
color: #4aa7cc !important;
}
nav.info span {
width: auto;
padding-right: initial;
font-size: inherit;
}
.info .fnl-innerbar span.badge {
width: auto;
padding-right: 0.75em;
font-size: 0.85em;
}
.platform.fnl-pageheader .fnl-innerbar {
margin: 0;
width: 100%;
border-radius: .625rem;
}
.fnl-innerbar-more {
position: absolute;
top: 20px;
left: 50%;
transform: translateX(-50%);
width: 40px;
height: 30px;
border-radius: 0 0 50% 50%;
background-color: #00ABE6;
}
.fnl-innerbar-more.open svg {
transform: rotate(0deg);
}
.fnl-innerbar-more.close svg {
transform: rotate(180deg);
}
.fnl-innerbar-more.close {
box-shadow: 4px 8px 20px -6px rgba(0, 0, 0, 0.2);
}
.fnl-innerbar-more.open {
display: block;
}
.ph-tab {
display: flex;
padding: 0 20px;
}
.ph-tab-opt {
background-color: #E1F0FF;
width: 100%;
color: var(--bs-info);
padding: 4px 16px;
border-radius: .625rem .625rem 0 0;
}
.ph-tab-opt:not(.open):hover {
background-color: #7ecaed;
color: #fff;
}
.ph-tab-opt.open {
color: #fff;
font-weight: 600;
background-color: var(--bs-info);
cursor: initial;
pointer-events: none;
}
.ph-tab+.pageheader .infobar {
padding-bottom: 16px;
}
.fnl-tab {
background-color: #E1F0FF;
padding: 8px 20px 0 20px;
display: flex;
gap: .5rem;
}
.fnl-tab-opt.open {
background-color: #fff;
color: var(--bs-primary);
}
.fnl-tab-opt.open .step_circle,
.fnl-model-pg {
background-color: #E8ECFC;
}
.fnl-tab-opt {
background-color: #E1F0FF;
}
.fnl-tab .step_circle {
background-color: #fff;
}
.fnl-tab-opt:not(.open):hover {
background-color: #EFF5FC;
}
.fnl-model {
gap: 2px;
width: 80px;
}
.fnl-model.now-1 #fnl-type g:nth-of-type(1) .fnl-model-color,
.fnl-model.now-2 #fnl-type g:nth-of-type(2) .fnl-model-color,
.fnl-model.now-3 #fnl-type g:nth-of-type(3) .fnl-model-color,
.fnl-model.now-4 #fnl-type g:nth-of-type(4) .fnl-model-color,
.fnl-model.now-5 #fnl-type g:nth-of-type(5) .fnl-model-color {
fill: #5463A5 !important;
}
.start-box__header {
background-image: url(../img/add.jpg);
background-size: cover;
background-position: right;
background-repeat: no-repeat;
padding: 55px 40px 30px;
}
.start-box__add {
border: 1px solid #E8ECFC;
padding: 8px 12px;
background-color: #fff;
}
.start-box__add:hover {
border-color: #5463A5;
}
.index-sum__start,
.index-sum__center,
.index-sum__end {
display: flex;
}
.index-sum__item {
border-right: 1px solid #eee;
padding: 0 1rem;
}
.index-sum__start .index-sum__item:first-of-type {
padding-left: 0;
}
.index-sum__end .index-sum__item:last-of-type {
border: 0;
}
.addon-product-div .accordion-header {
background-color: #E8ECFC33;
}
.addon-product-div .accordion-header {
border-bottom: 1px solid #E8ECFC33;
}
.addon-product-div .accordion-button:not(.collapsed) {
background-color: #fff;
}
.filter-div>div:last-of-type .adv_search_hint {
display: none;
}
#operations-div {
position: fixed;
background-color: #fff;
padding: 1rem 4.5rem;
box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.05);
width: calc(100% - var(--bs-app-sidebar-width));
right: 0;
bottom: 0;
z-index: 999;
}
.choice-fnl.nav .badge {
border: 1px solid var(--bs-gray-500);
color: var(--bs-gray-500);
}
.choice-fnl.nav .nav-link.active,
.choice-fnl.nav .nav-link.active .badge {
color: var(--kt-primary);
}
.choice-fnl.nav .nav-link.active .badge {
border-color: var(--kt-primary);
}
/* reset breadcrumb */
.breadcrumb .pe-3 {
padding-right: 0 !important;
}
.edit-fnl-bg {
background-image: url('../img/fnl_bg.jpg');
background-position: 100%;
background-repeat: no-repeat;
}
.dialogbox {
border-radius: .625rem;
position: relative;
border: 1px solid #dfdfdf;
}
.dialogbox.timeline-content {
overflow: initial;
}
.dialogbox::before,
.dialogbox::after {
content: '';
width: 0;
height: 0;
position: absolute;
z-index: 2;
}
.dialogbox::before {
border-top: 11px solid transparent;
/* 增加 1px 作為邊框 */
border-bottom: 11px solid transparent;
/* 增加 1px 作為邊框 */
border-right: 11px solid #dfdfdf;
/* 黑色邊框 */
left: -11px;
/* 調整位置 */
top: 14px;
/* 調整位置 */
}
.dialogbox::after {
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
border-right: 10px solid #f5f5f5;
/* 這是內部三角形的背景顏色 */
left: -10px;
top: 15px;
filter: drop-shadow(0 0.1rem 1rem rgba(0, 0, 0, 0.05));
}
.dialogbox.hook::after {
border-right: 10px solid #fdf8e5;
}
.dialogbox.sales::after {
border-right: 10px solid #f3fafe;
}
.dialogbox.hook {
background-color: #fdf8e5;
}
.dialogbox.sales {
background-color: #f3fafe;
}
.dialogbox {
background-color: #f5f5f5;
}
.dialogbox.hook .dialogbox-pg-type .badge {
color: #FCB813;
border: 1px solid #FCB813;
}
.dialogbox.sales .dialogbox-pg-type .badge {
color: #6DCFF6;
border: 1px solid #6DCFF6;
}
.dialogbox .dialogbox__page .badge {
background-color: #979797;
color: #fff;
}
.dialogbox.hook .dialogbox__page .badge {
background-color: #FCB813;
color: #fff;
}
.dialogbox.sales .dialogbox__page .badge {
background-color: #6DCFF6;
color: #fff;
}
.dialogbox.hook .dialogbox-type p {
color: #fff;
}
.dialogbox .dialogbox__info {
background-color: #fff;
position: relative;
}
.dialogbox.hook .dialogbox__info,
.fnl-pg-group__box.hook {
background-color: #fffdf6;
}
.dialogbox.sales .dialogbox__info,
.fnl-pg-group__box.sales {
background-color: #fafeff;
}
.fnl-pg-group__box {
background-color: #f9f9f9;
}
.dialogbox__info__col {
flex: 1 1 50%;
}
.dialogbox__info__col.time {
max-width: 300px;
}
.dialogbox-pg-type.item-ellipsis {
max-height: 62px;
overflow: hidden;
padding-right: 2rem;
cursor: initial;
}
.fol-info__box {
border: 1px solid #f5f5f5;
background-color: #fff;
color: var(--bs-gray-600);
font-weight: 600;
padding: 0 8px 0 0;
}
.fol-info__pic {
padding: 4px 6px;
background-color: #f5f5f5;
}
.fol-info__text__btn {
transition: .3s;
opacity: 0;
}
.fol-info__box:hover .fol-info__text__btn {
opacity: 1;
}
.fol-info__text {
gap: 4px;
}
.fol-info__text p {
padding: 4px 4px 4px 8px;
}
.fol-info__box__btn .followup-btn,
.fol-info__box__btn .btn {
font-size: 13px;
}
.followup-scenario-edit-btn-div+.followup-tippy {
border-left: 0px !important;
}
/* dropzone ui */
.dz-size {
width: 100% !important;
white-space: nowrap;
}
.dz-preview .dz-remove {
position: absolute;
top: 0;
right: 0;
}
/* table */
.table-box {
overflow-x: auto;
position: relative;
}
.table-box.table-box-user .table-responsive {
min-width: 1320px;
}
.table-box th {
white-space: nowrap;
}
/* paginate */
.paginate_button {
padding: 4px 6px;
border-radius: .625rem;
background-color: #E8ECFC53;
cursor: pointer;
}
.paginate_button:hover {
filter: brightness(80%);
}
input.paginate_input {
width: 3rem;
border: 1px solid var(--bs-light);
border-radius: .625rem;
text-align: center;
}
input.paginate_input:focus {
width: 5rem;
}
.previous.page-item+span {
display: none;
}
.paginate_total {
color: var(--bs-text-gray-600);
}
input.paginate_input+span {
color: var(--bs-text-gray-400);
}
.dataTables_paginate {
display: inline-flex;
align-items: center;
gap: 4px;
}
.page-item {
color: transparent;
position: relative;
width: 28px;
white-space: nowrap;
display: inline-block;
overflow: hidden;
}
.first.page-item::before,
.last.page-item::before,
.previous.page-item::before,
.next.page-item::before {
position: absolute;
content: url('data:image/svg+xml;utf8,');
width: 100%;
height: 100%;
display: flex;
align-items: center;
top: 3px;
justify-content: start;
}
.last.page-item::before {
transform: scaleX(-1);
justify-content: end;
}
.last.page-item,
.first.page-item {
background-color: #E8ECFC23;
}
.previous.page-item,
.next.page-item {
width: 34px;
padding-left: 8px;
padding-right: 8px;
}
.previous.page-item::before,
.next.page-item::before {
content: url('data:image/svg+xml;utf8,');
justify-content: center;
left: 0;
}
.next.page-item::before {
transform: scaleX(-1);
}
.page-item.disabled {
opacity: .6;
}
.layout-3 {
flex-grow: 1;
width: 33.333%;
}
.layout-3 .layout-3-wrap {
flex-wrap: wrap;
}
.mail-sent-sub {
width: initial;
padding-right: 12px;
}
.sent-record {
width: 62%;
}
.sent-abstract {
width: 39%;
max-width: 400px;
}
.sent-record.sent-real {
flex-grow: 1;
max-width: calc(100% - 150px);
}
.sent-record__num {
width: 25%;
}
.fnl-state .fnl-state__slide {
display: none !important;
}
.fnl-state .fnl-state__fill {
display: flex !important;
}
.fnl-state .carousel-indicators {
top: -20px;
left: initial;
right: -10%;
margin-bottom: 0;
}
.fnl-state:nth-child(2) .carousel-indicators {
top: -10px;
}
.fnl-state .carousel-indicators li {
background-color: var(--bs-primary);
border-radius: 50%;
width: 10px;
height: 10px;
border: 0;
}
.fnl-state .carousel-indicators li.active {
width: 20px;
border-radius: 15%;
}
.fnl-state__slide .carousel-inner {
min-height: 70px;
}
.fnl-state__slide .carousel-item {
align-self: center;
}
.react-datepicker__input-container {
display: flex;
align-items: center;
}
.form-check-label {
color: var(--bs-gray-700);
}
.form-check-input {
background-color: #fff;
}
.has-tag-done,
.has-score-done {
opacity: 0;
}
.has-tag .has-tag-done,
.has-score .has-score-done {
opacity: 1;
fill: #0BB783;
}
.mem-time-word::after {
position: absolute;
content: ";";
right: 0;
bottom: 2px;
}
.mem-time .mem-time-word:last-child::after {
display: none;
}
.select-screenplay.list-group {
border-radius: 0;
}
.select-screenplay.list-group a {
border-radius: 8px;
margin-bottom: 8px;
border: 1px dashed var(--bs-gray-300);
padding: 8px 12px;
position: relative;
}
.select-screenplay.list-group a p:last-of-type {
margin-bottom: 0;
}
.select-screenplay.list-group a.active {
background-color: initial;
color: initial;
border: 1px solid var(--bs-primary);
}
.json-display {
overflow-x: scroll;
display: block;
width: 100%;
word-break: break-word;
}
.templates {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(33.33%, 1fr));
}
.modal-inline.templates {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(33.33%, 1fr));
}
.template-card {
padding: 8px;
}
.form-section-group {
margin-top: 32px;
position: relative;
}
.form-list .form-section-group:nth-child(1) {
margin-top: 0;
}
.form-section-group__desc,
.score_desc {
padding: 8px 12px 4px;
}
.form-section-list {
position: relative;
}
.form-section-title {
position: relative;
padding-left: 8px;
}
.form-section-title::after {
content: '';
width: 100%;
height: 5px;
background-color: var(--bs-primary);
border-radius: 8px;
bottom: -4px;
left: 0;
position: absolute;
z-index: 3;
}
.iframe-card .form-section-title .flex-shrink-0,.iframe-card .form-section-title::after{
display: none !important;
}
.iframe-card .form-section-list .form-group,.iframe-card .form-section-group{
margin-bottom: 0;
margin-top: 0;
}
.iframe-card .form-section-list{
padding-bottom: 0 !important;
border-color: #eee !important;
}
.iframe-card .form-section-group ~ .form-section-list:last-of-type{
border:0px !important
}
.iframe-card .form-list .form-check-input[disabled] ~ .form-check-label,.iframe-card .form-list .form-check-input:disabled ~ .form-check-label{
opacity: 1;
}
.form-list .xt_area {
max-width: 500px;
}
.form-list .xt_area img {
max-width: 300px;
}
.booking-rule.item-ellipsis {
min-height: 270px;
max-height: 100%;
}
.form-graphic-text.item-ellipsis,
.form-border.item-ellipsis {
min-height: 90px;
}
.form-plain.item-ellipsis {
min-height: 40px;
}
.form-graphic-text.item-ellipsis.form-quote.item-ellipsis {
min-height: 130px;
}
.form-border.item-ellipsis::before,
.form-border.item-ellipsis::after,.form-quote.item-ellipsis::before,.form-quote.item-ellipsis::after {
display: none;
}
.form-graphic-text.item-ellipsis::before,
.form-graphic-text.item-ellipsis::after {
background: #f6f6f6;
}
.form-border .xt_area {
border: 1px solid #e3e3e3;
padding: 1.25rem;
border-radius: .625rem;
}
.form-quote .xt_area::before {
content: url(../img/catalog/member/bxs-quote-left.svg);
display: block;
}
.form-title .xt_area {
border-radius: .625rem !important;
background-color: #eeeeee;
padding: .5rem 1rem;
font-weight: 600;
position: relative;
}
.form-title .xt_area::before {
content: '';
height: 12px;
width: 4px;
display: inline-block;
background-color: #bbb;
border-radius: 8px;
position: absolute;
left: 6px;
top: 50%;
transform: translateY(-50%);
}
.xt_area p:last-of-type {
margin-bottom: 0;
}
.form-section-group__desc.item-ellipsis::before,
.form-section-group__desc.item-ellipsis.item-ellipsis::after,
.score_desc.item-ellipsis::before,
.score_desc.item-ellipsis::after,
.booking-rule.item-ellipsis::before,
.booking-rule.item-ellipsis::after,
.form-graphic-text.item-ellipsis::before,
.form-graphic-text.item-ellipsis::after {
height: 20px;
}
.form-graphic-text.form-plain.item-ellipsis::before,
.form-graphic-text.form-plain.item-ellipsis::after,.form-section-group__desc.item-ellipsis::before,.form-section-group__desc.item-ellipsis::after{
display: none;
}
.mini-btn {
background-color: #fff;
color: var(--bs-gray-700);
}
.mini-btn.open {
background-color: var(--bs-primary);
color: #fff;
}
.zebra-odd-row .row:nth-of-type(2n+1) {
background-color: var(--bs-primary-light);
}
.input-border-bottom {
border: none !important;
border-bottom: 1px solid #ccc !important;
}
.filter-drop-btn{
max-width: 220px;
min-width: 50px;
height: 34px;
display: flex;
align-items: center;
justify-content: space-between;
padding: .5rem .75rem;
border-radius: .625rem;
}
.hor-menu.dropdown-menu.show{
display: flex;
padding: 1rem;
min-width: 500px;
}
.dropdown-column{
border-right: 1px dashed #f5f5f5;
padding: 0 8px;
}
.dropdown-column:last-child{
border: 0;
}
.dropdown-column li{
margin-bottom: .5rem;
}
.dropdown-column li .dropdown-header{
font-weight: 600;
padding: 6px 12px;
background-color: var(--bs-primary-light);
border-radius: 4px;
text-align: center;
color: var(--bs-primary);
}
.dropdown-column .radio-btn .form-check-label{
padding-top: 4px;
padding-bottom: 4px;
border-style: dashed;
}
@media screen and (max-width:1680px) {
.fnl-state {
height: 160px;
width: 33.333%;
}
.fnl-state .card {
align-items: center;
}
.fnl-state .fnl-state__slide {
display: flex !important;
}
.fnl-state .fnl-state__fill {
display: none !important;
}
.sent-abstract {
width: 38%;
}
.sent-record,
.sent-abstract {
width: 50%;
}
.sent-record {
flex-wrap: wrap;
}
.sent-record__num {
width: 50%;
}
.sent-record__num .pic24px {
width: 12px;
}
.sent-record__num__fg {
display: flex;
gap: 2px;
}
.date .hor_label_div{
flex: 0 0 100%;
}
}
@media screen and (max-width:1630px) {
.sent-people.sent-test>.col-4:last-child {
display: none !important;
}
.sent-people>.col-4 {
width: 50%;
}
.templates {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(50%, 1fr));
}
}
@media screen and (max-width:1540px) {
.mail-sent-sub {
max-width: 300px;
flex-grow: 0 !important;
flex-shrink: 1;
}
.mail-sent-sub .mail-sent-sub__num {
flex-grow: 1;
}
.mail-sent-sub>.d-flex:first-child {
max-width: 50%;
}
.sent-abstract {
width: 42%;
}
.sent-record {
width: 58%;
}
.sent-record.sent-real {
max-width: calc(100% - 150px);
}
.sent-record.justify-content-evenly {
justify-content: start !important;
}
.sent-record__num {
width: 48%;
}
.sent-record__num .ps-4,
.sent-people .ps-2 {
display: flex;
}
.sent-record__num .pic24px {
width: 16px;
}
.sent-people>.col-4:last-child {
display: none !important;
}
.sent-people {
padding-right: 1rem;
}
}
@media screen and (max-width:1440px) {
.sl_item {
flex-wrap: wrap;
}
.cl_state_time {
flex: 1 0 210px;
max-width: 210px;
}
.column-1440 {
flex-direction: column;
}
.als-1440 {
align-items: start !important;
}
.edit-pg-fixed-area__main {
padding: 2rem 10px;
}
.edit-pg-fixed-area .steps {
width: 250px;
}
.edit-pg-fixed-area .content {
padding: 2rem 10px 1rem 1rem;
}
.index-sum__start,
.index-sum__end,
.index-sum__center {
flex-direction: column;
flex-grow: 1;
gap: .5rem;
}
.index-sum__item {
border: 0;
}
.index-sum__start .index-sum__item:first-of-type {
padding-left: 1rem;
}
.iframe-overlay .csswidth {
max-width: 400px;
}
#rules-div .form-select {
max-width: 150px;
}
.minitb_line {
max-width: 100%;
}
.start-box__add .d-flex {
flex-direction: column;
}
.start-box__add span {
display: none;
}
.warning-notes span {
display: none;
}
.warning-notes {
position: absolute;
cursor: pointer;
}
.warning-notes:hover {
width: 380px;
transition: .5s ease-in-out;
}
.warning-notes:hover span {
display: inline;
font-size: 13px;
transition: .5s;
}
}
@media screen and (max-width:1366px) {
.sent-record__num {
width: 50%;
}
}
@media screen and (max-width:1280px) {
.infobar_more {
flex: 1 1 36px;
position: relative;
padding-left: 12px;
border-left: 1px solid #e9ecef;
height: 42px;
align-items: center;
}
.infobar_more.near_ctrl,
.series .infobar_more.near_ctrl {
flex: 1 1 36px;
padding-right: 12px;
}
.series .infobar_more.near_ctrl {
flex-basis: 210px;
padding-left: 0;
}
.series .form-check-custom .form-check-label {
margin-left: 0.5rem;
}
.layout-3 {
width: 100%;
}
.layout-3 .layout-3-wrap {
flex-wrap: nowrap;
}
.infobar_more-collapse {
display: flex;
}
.infobar_more-nocollapse {
display: none;
}
.infobar_more-collapse:hover .x_tooltip {
visibility: visible;
top: 120%;
right: -15px;
margin-top: .5rem;
z-index: 200;
width: 100%;
min-width: 250px;
}
.near_ctrl .infobar_more-collapse:hover .x_tooltip {
right: 0px;
}
.infobar_more-collapse .toparrow::after {
left: initial;
right: 4px;
transform: initial;
}
.scroll-pagemap__box {
max-height: 500px;
}
.scroll-pagemap__frame {
width: 300px;
height: 400px;
}
.sim_size {
width: 350px;
}
.fancybox-phone .fancybox__slide {
padding: 40px 100px 10px 100px;
}
.fnl-state .carousel-item .currency-display {
position: absolute;
top: -5px;
left: -10px;
}
.sent-abstract {
width: 55%;
}
.sent-record {
width: 35%;
}
.sent-record__num {
width: 100%;
}
.sent-record .sent-record__num:nth-child(3),
.sent-record .sent-record__num:nth-child(4) {
display: none !important;
}
.pageheader-l{
width: 250px;
}
.pageheader-mini-title{
max-width: 180px;
}
.date .flex-grow-1 .d-flex{
flex-wrap: wrap;
}
}
@media screen and (max-width:1152px) {
.minitb_line {
max-width: 100%;
}
.funnel-graphic-state__line .funnel-graphic__page {
width: 240px;
}
}
@media screen and (max-width:1024px) {
.sl_item {
flex: 1 1 20%;
}
.subbar {
flex: 1 1 100%;
max-width: 100%;
}
}
@media screen and (max-height:720px) {
.sim_size {
width: 260px;
}
.sim_phone_screen {
height: calc(75vh + 40px);
}
}
@media screen and (max-height:540px) {
.sim_phone_screen {
height: calc(70vh + 40px);
}
}
@media (any-hover:hover) {
.btn-check:checked+.btn.btn-outline.btn-outline-primary,
.btn-check:active+.btn.btn-outline.btn-outline-primary,
.btn.btn-outline.btn-outline-primary:hover:not(.btn-active),
.btn.btn-outline.btn-outline-primary.show,
.show>.btn.btn-outline.btn-outline-primary,
.btn-outline-mini:hover {
background-color: #5463A5 !important;
color: #fff !important;
}
}