myprestarocks
c6fd5cee13
- Unified _setBadgeCount for ALL badge updates - target-conditions-trait → entity-selector-trait - target-* → es-* class rename (20+ classes) - SCSS recompiled: zero duplicate selectors - CSS transitions replace jQuery slideDown/slideUp - Serialize cache, method swap cache - Badge: no-matches gray, consistent hover, no blending - Inline condition count always visible - Preview popover refreshes in-place on sort change - Categories add chips immediately - Entity type icons on chips - Consistent info_outline icons via buildHelpIcon - Method dropdown text clipping fix (line-height) - mpr-input-compact on all inputs - Dropdown padding fixed in SCSS source - Chips wrapper: same container always - Reusable helpers: _buildEmptyState, _buildSearchBoxHtml, _buildInfoTooltip - Asset path: uses $this->module->getPathUri() not reflection - Debug logs removed Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
9613 lines
247 KiB
CSS
9613 lines
247 KiB
CSS
@charset "UTF-8";
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Entity Selector Variables
|
||
* Bootstrap 4 compatible values for PrestaShop admin theme
|
||
*
|
||
* Imports shared variables from prestashop-admin package
|
||
* and maps them to $es-* prefixed aliases for this package
|
||
*/
|
||
/**
|
||
* MPR Admin Variables
|
||
* @package prestashop-admin
|
||
*
|
||
* Color token system:
|
||
* - PS theme vars (--primary, --danger, etc.) → set by PrestaShop admin theme
|
||
* - MPR tokens (--mpr-*) → set here as defaults, overridable per module/theme
|
||
*
|
||
* Usage in SCSS: var(--token, $fallback)
|
||
* The $fallback SCSS vars below ensure compilation succeeds even without :root.
|
||
*/
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Entity Selector Mixins
|
||
* Reusable patterns - prefer Bootstrap utilities in HTML where possible
|
||
*/
|
||
@keyframes spin {
|
||
from {
|
||
transform: rotate(0deg);
|
||
}
|
||
to {
|
||
transform: rotate(360deg);
|
||
}
|
||
}
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Form Integration Styles
|
||
* Handles PrestaShop admin form layout overrides
|
||
*/
|
||
.entity-selector-trait,
|
||
.entity-selector-trait *,
|
||
.method-dropdown-menu,
|
||
.method-dropdown-menu *,
|
||
.es-preview-popover,
|
||
.es-preview-popover * {
|
||
border-style: solid;
|
||
border-width: 0;
|
||
border-color: #dee2e6;
|
||
}
|
||
|
||
.form-group:has(.entity-selector-trait:not(.layout-form-group)),
|
||
.form-group:has(.entity-selector-trait:not(.layout-form-group)),
|
||
.form-group:has(.condition-trait:not(.layout-form-group)) {
|
||
display: block;
|
||
}
|
||
.form-group:has(.entity-selector-trait:not(.layout-form-group)) > .control-label,
|
||
.form-group:has(.entity-selector-trait:not(.layout-form-group)) > .control-label,
|
||
.form-group:has(.condition-trait:not(.layout-form-group)) > .control-label {
|
||
display: none;
|
||
}
|
||
.form-group:has(.entity-selector-trait:not(.layout-form-group)) > .col-lg-8,
|
||
.form-group:has(.entity-selector-trait:not(.layout-form-group)) > .col-lg-8,
|
||
.form-group:has(.condition-trait:not(.layout-form-group)) > .col-lg-8 {
|
||
width: 100%;
|
||
max-width: 100%;
|
||
padding-left: 1rem;
|
||
padding-right: 1rem;
|
||
flex: 0 0 100% !important;
|
||
}
|
||
|
||
.form-group.condition-trait-fullwidth {
|
||
display: block;
|
||
}
|
||
.form-group.condition-trait-fullwidth > .control-label {
|
||
display: none;
|
||
}
|
||
.form-group.condition-trait-fullwidth > .col-lg-8 {
|
||
width: 100%;
|
||
max-width: 100%;
|
||
padding-left: 1rem;
|
||
padding-right: 1rem;
|
||
flex: 0 0 100% !important;
|
||
}
|
||
|
||
.form-group:has(.layout-form-group) > .control-label {
|
||
display: flex !important;
|
||
}
|
||
|
||
.panel:has(.es-search-dropdown.show),
|
||
.card:has(.es-search-dropdown.show),
|
||
.form-wrapper:has(.es-search-dropdown.show),
|
||
.panel-body:has(.es-search-dropdown.show),
|
||
.card-body:has(.es-search-dropdown.show),
|
||
.form-group:has(.es-search-dropdown.show),
|
||
.col-lg-8:has(.es-search-dropdown.show),
|
||
.col-lg-12:has(.es-search-dropdown.show) {
|
||
overflow: visible !important;
|
||
}
|
||
|
||
.entity-selector-trait:has(.es-search-dropdown.show),
|
||
.entity-selector-trait:has(.es-search-dropdown.show),
|
||
.condition-trait-body:has(.es-search-dropdown.show),
|
||
.es-block-content:has(.es-search-dropdown.show),
|
||
.es-block-groups:has(.es-search-dropdown.show),
|
||
.es-group:has(.es-search-dropdown.show),
|
||
.es-group-body:has(.es-search-dropdown.show),
|
||
.es-search-wrapper:has(.es-search-dropdown.show) {
|
||
overflow: visible !important;
|
||
}
|
||
|
||
.entity-selector-trait.layout-embedded,
|
||
.entity-selector-trait.layout-embedded {
|
||
background: transparent;
|
||
border: none;
|
||
border-radius: 0;
|
||
}
|
||
.entity-selector-trait.layout-embedded .groups-container,
|
||
.entity-selector-trait.layout-embedded .groups-container {
|
||
padding: 0;
|
||
}
|
||
.entity-selector-trait.layout-embedded .block-body,
|
||
.entity-selector-trait.layout-embedded .block-body {
|
||
padding: 0;
|
||
}
|
||
.entity-selector-trait.layout-embedded .block-footer,
|
||
.entity-selector-trait.layout-embedded .block-footer {
|
||
border-top: none;
|
||
padding: 0.5rem 0 0;
|
||
}
|
||
.entity-selector-trait.layout-embedded .selection-group,
|
||
.entity-selector-trait.layout-embedded .selection-group {
|
||
background: #ffffff;
|
||
border: 1px solid #e2e8f0;
|
||
border-radius: 0.25rem;
|
||
}
|
||
.entity-selector-trait.layout-embedded .selection-group .group-header,
|
||
.entity-selector-trait.layout-embedded .selection-group .group-header {
|
||
background: #f8fafc;
|
||
border-bottom-color: #e2e8f0;
|
||
padding: 0.25rem 0.5rem;
|
||
border-radius: 0.25rem 0.25rem 0 0;
|
||
}
|
||
.entity-selector-trait.layout-embedded .selection-group .group-body,
|
||
.entity-selector-trait.layout-embedded .selection-group .group-body {
|
||
padding: 0.75rem;
|
||
}
|
||
.entity-selector-trait.layout-embedded .selection-group .group-include,
|
||
.entity-selector-trait.layout-embedded .selection-group .group-include {
|
||
padding: 0.25rem;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.entity-selector-trait.layout-embedded .selection-group .group-modifiers,
|
||
.entity-selector-trait.layout-embedded .selection-group .group-modifiers {
|
||
padding: 0.25rem 0.5rem;
|
||
margin: 0.5rem -0.5rem -0.5rem;
|
||
}
|
||
.entity-selector-trait.layout-embedded .groups-empty-state,
|
||
.entity-selector-trait.layout-embedded .groups-empty-state {
|
||
padding: 1rem;
|
||
}
|
||
.entity-selector-trait.layout-embedded .btn-add-group,
|
||
.entity-selector-trait.layout-embedded .btn-add-group {
|
||
padding: 0.375rem 0.625rem;
|
||
font-size: 0.75rem;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Responsive Styles
|
||
* Media query adjustments for different screen sizes
|
||
*/
|
||
@media (max-width: 991px) {
|
||
.entity-selector-trait .condition-trait-header {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .trait-header-right {
|
||
width: 100%;
|
||
justify-content: flex-end;
|
||
}
|
||
.entity-selector-trait .es-block-tabs {
|
||
flex-wrap: wrap;
|
||
}
|
||
}
|
||
@media (max-width: 767px) {
|
||
.entity-selector-trait .es-block-tab {
|
||
padding: 0.5rem;
|
||
font-size: 0.75rem;
|
||
}
|
||
.entity-selector-trait .es-group-header {
|
||
flex-direction: column;
|
||
align-items: flex-start;
|
||
}
|
||
.entity-selector-trait .es-search-dropdown {
|
||
width: 100% !important;
|
||
left: 0 !important;
|
||
right: 0 !important;
|
||
}
|
||
.entity-selector-trait .dropdown-results-grid {
|
||
grid-template-columns: 1fr !important;
|
||
}
|
||
}
|
||
@media (min-width: 1600px) {
|
||
.entity-selector-trait .dropdown-results-grid.view-grid-3 {
|
||
grid-template-columns: repeat(4, 1fr);
|
||
}
|
||
}
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Entity Selector - Main Component Styles
|
||
* Wrapper, header, body, tabs, blocks
|
||
*/
|
||
.entity-selector-trait {
|
||
position: relative;
|
||
overflow: visible;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
}
|
||
.entity-selector-trait .condition-trait-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
flex-wrap: wrap;
|
||
gap: 1rem;
|
||
padding: 0.875rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0.3rem 0.3rem 0 0;
|
||
cursor: pointer;
|
||
user-select: none;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .condition-trait-header:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.entity-selector-trait .trait-header-left {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.75rem;
|
||
min-width: 0;
|
||
flex: 1;
|
||
}
|
||
.entity-selector-trait .trait-icon {
|
||
font-size: 1.125rem;
|
||
color: #6c757d;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .trait-title-group {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.125rem;
|
||
min-width: 0;
|
||
}
|
||
.entity-selector-trait .trait-title {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .trait-subtitle {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.entity-selector-trait .trait-total-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .trait-total-count:hover {
|
||
transform: scale(1.05);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .trait-total-count:focus {
|
||
outline: none;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.3), 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .trait-total-count.loading {
|
||
cursor: wait;
|
||
}
|
||
.entity-selector-trait .trait-total-count.loading i {
|
||
font-size: 10px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .trait-total-count.loading:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .trait-total-count.inactive, .entity-selector-trait .trait-total-count.no-matches {
|
||
background: #94a3b8;
|
||
cursor: default;
|
||
}
|
||
.entity-selector-trait .trait-total-count.inactive:hover, .entity-selector-trait .trait-total-count.no-matches:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .trait-total-count.popover-open {
|
||
background: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .trait-total-count i {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.entity-selector-trait .trait-total-count:hover i {
|
||
opacity: 1;
|
||
}
|
||
.entity-selector-trait .trait-total-count .preview-count {
|
||
font-weight: 700;
|
||
}
|
||
.entity-selector-trait .trait-total-count {
|
||
margin-left: 0.5rem;
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
margin-right: 0.75rem;
|
||
padding: 0.25rem 0.5rem;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
user-select: none;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle:hover {
|
||
background: rgba(0, 0, 0, 0.05);
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle .toggle-label {
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle .show-all-checkbox {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle .toggle-slider {
|
||
position: relative;
|
||
width: 36px;
|
||
height: 20px;
|
||
background: #cbd5e1;
|
||
border-radius: 50rem;
|
||
transition: background-color 0.2s ease-in-out;
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle .toggle-slider::after {
|
||
content: "";
|
||
position: absolute;
|
||
top: 2px;
|
||
left: 2px;
|
||
width: 16px;
|
||
height: 16px;
|
||
background: #ffffff;
|
||
border-radius: 50%;
|
||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
|
||
transition: transform 0.2s ease-in-out;
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle .show-all-checkbox:checked + .toggle-slider {
|
||
background: #70b580;
|
||
}
|
||
.entity-selector-trait .trait-show-all-toggle .show-all-checkbox:checked + .toggle-slider::after {
|
||
transform: translateX(16px);
|
||
}
|
||
.entity-selector-trait.has-validation-error {
|
||
border-color: #dc3545;
|
||
box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1);
|
||
}
|
||
.entity-selector-trait.has-validation-error .condition-trait-header {
|
||
border-bottom-color: #dc3545;
|
||
}
|
||
.entity-selector-trait .trait-validation-error {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.625rem 1rem;
|
||
background: #f8d7da;
|
||
color: #b91c1c;
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
border-bottom: 1px solid #fecaca;
|
||
}
|
||
.entity-selector-trait .trait-validation-error i {
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait.trait-required .trait-title::after {
|
||
content: " *";
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .condition-trait-body {
|
||
padding: 0;
|
||
background: #ffffff;
|
||
border-radius: 0 0 0.3rem 0.3rem;
|
||
}
|
||
.entity-selector-trait .es-block-tabs {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0;
|
||
padding: 0;
|
||
background: #f1f5f9;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .es-block-tab {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
flex: none;
|
||
min-width: 0;
|
||
padding: 0.625rem 1rem;
|
||
margin-bottom: -1px;
|
||
background: transparent;
|
||
border: 0;
|
||
border-bottom: 2px solid transparent;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .es-block-tab:hover {
|
||
background: #e2e8f0;
|
||
color: #334155;
|
||
}
|
||
.entity-selector-trait .es-block-tab.active {
|
||
background: #ffffff;
|
||
border-bottom-color: #06b6d4;
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .es-block-tab i {
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-label {
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge:hover {
|
||
transform: scale(1.05);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge:focus {
|
||
outline: none;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.3), 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge.loading {
|
||
cursor: wait;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge.loading i {
|
||
font-size: 10px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge.loading:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge.inactive, .entity-selector-trait .es-block-tab .tab-badge.no-matches {
|
||
background: #94a3b8;
|
||
cursor: default;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge.inactive:hover, .entity-selector-trait .es-block-tab .tab-badge.no-matches:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge.popover-open {
|
||
background: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge i {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge:hover i {
|
||
opacity: 1;
|
||
}
|
||
.entity-selector-trait .es-block-tab .tab-badge .preview-count {
|
||
font-weight: 700;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
background: #94a3b8;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge:hover {
|
||
transform: scale(1.05);
|
||
box-shadow: 0 2px 8px rgba(148, 163, 184, 0.4);
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge:focus {
|
||
outline: none;
|
||
box-shadow: 0 0 0 2px rgba(148, 163, 184, 0.3), 0 2px 8px rgba(148, 163, 184, 0.4);
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.loading {
|
||
cursor: wait;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.loading i {
|
||
font-size: 10px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.loading:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.inactive, .entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.no-matches {
|
||
background: #94a3b8;
|
||
cursor: default;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.inactive:hover, .entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.no-matches:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge.popover-open {
|
||
background: rgb(117.3426966292, 136.6404494382, 163.6573033708);
|
||
box-shadow: 0 2px 8px rgba(148, 163, 184, 0.4);
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge i {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge:hover i {
|
||
opacity: 1;
|
||
}
|
||
.entity-selector-trait .es-block-tab.has-data:not(.active) .tab-badge .preview-count {
|
||
font-weight: 700;
|
||
}
|
||
.entity-selector-trait .entity-selector-tabs-row {
|
||
display: flex;
|
||
align-items: stretch;
|
||
background: #f1f5f9;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0.3rem 0.3rem 0 0;
|
||
}
|
||
.entity-selector-trait .entity-selector-tabs-row .es-block-tabs {
|
||
flex: 1;
|
||
border-bottom: 0;
|
||
border-radius: 0.3rem 0 0 0;
|
||
}
|
||
.entity-selector-trait .entity-selector-actions.btn-toggle-blocks {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 0 1rem;
|
||
background: #f1f5f9;
|
||
border-left: 1px solid #dee2e6;
|
||
color: #94a3b8;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .entity-selector-actions.btn-toggle-blocks:hover {
|
||
background: #e2e8f0;
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .entity-selector-actions.btn-toggle-blocks .material-icons {
|
||
font-size: 20px !important;
|
||
}
|
||
.entity-selector-trait .entity-selector-trait:not(.blocks-collapsed) .entity-selector-actions.btn-toggle-blocks {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-left-color: #25b9d7;
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .es-block-container {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .es-block-container.active {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .es-block-content {
|
||
padding: 1rem;
|
||
}
|
||
.entity-selector-trait .es-block-groups {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1rem;
|
||
}
|
||
.entity-selector-trait .es-block-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .es-block-empty {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
text-align: center;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .es-block-empty i {
|
||
font-size: 2rem;
|
||
opacity: 0.5;
|
||
}
|
||
.entity-selector-trait .es-block-empty p {
|
||
margin: 0;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .trait-collapse-toggle,
|
||
.entity-selector-trait .collapse-toggle {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
cursor: pointer;
|
||
transition: transform 0.2s ease-in-out;
|
||
}
|
||
.entity-selector-trait .trait-collapse-toggle.collapsed,
|
||
.entity-selector-trait .collapse-toggle.collapsed {
|
||
transform: rotate(-90deg);
|
||
}
|
||
.entity-selector-trait .trait-header-right {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait.collapsed .condition-trait-body {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait.collapsed .condition-trait-header {
|
||
border-radius: 0.3rem;
|
||
}
|
||
|
||
.entity-selector-trait.single-mode .es-block-tabs,
|
||
.entity-selector-trait.single-mode .es-block-tabs {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait.single-mode .es-block-container,
|
||
.entity-selector-trait.single-mode .es-block-container {
|
||
display: block;
|
||
}
|
||
|
||
.entity-selector-trait .header-actions {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .header-action-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .header-action-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .header-action-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #6c757d;
|
||
background: transparent;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .header-action-btn:hover {
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .header-action-btn i {
|
||
font-size: 12px;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Entity Item - Shared Base Component
|
||
* Unified styling for entity items in chips, lists, and previews
|
||
*
|
||
* Variants:
|
||
* - .entity-item (base) - default list-row style
|
||
* - .entity-item.chip-style - pill/chip style (compact)
|
||
* - .entity-item.card-style - card/grid style
|
||
*/
|
||
.entity-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
background: #ffffff;
|
||
border-radius: 0.2rem;
|
||
transition: background 0.15s ease-in-out;
|
||
}
|
||
.entity-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.entity-item.clickable {
|
||
cursor: pointer;
|
||
}
|
||
.entity-item.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
|
||
.entity-item-image {
|
||
flex-shrink: 0;
|
||
width: 32px;
|
||
height: 32px;
|
||
object-fit: cover;
|
||
border-radius: 0.2rem;
|
||
background: #f1f5f9;
|
||
}
|
||
|
||
.entity-item-image--sm {
|
||
width: 20px;
|
||
height: 20px;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.entity-item-image--lg {
|
||
width: 48px;
|
||
height: 48px;
|
||
}
|
||
|
||
.entity-item-no-image {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 32px;
|
||
height: 32px;
|
||
background: #f1f5f9;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-item-no-image--sm {
|
||
width: 20px;
|
||
height: 20px;
|
||
font-size: 10px;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.entity-item-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.125rem;
|
||
}
|
||
|
||
.entity-item-name {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.entity-item-meta {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.entity-item-badge {
|
||
flex-shrink: 0;
|
||
padding: 0.125rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
background: #f1f5f9;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
}
|
||
|
||
.entity-item-price {
|
||
flex-shrink: 0;
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #25b9d7;
|
||
}
|
||
|
||
.entity-item-action {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-item-action:focus {
|
||
outline: none;
|
||
}
|
||
.entity-item-action {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 20px;
|
||
height: 20px;
|
||
color: #6c757d;
|
||
border-radius: 50%;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-item-action:hover {
|
||
background: rgba(0, 0, 0, 0.1);
|
||
color: #dc3545;
|
||
}
|
||
.entity-item-action i {
|
||
font-size: 10px;
|
||
}
|
||
|
||
.entity-item.chip-style {
|
||
display: inline-flex;
|
||
gap: 0.375rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #f1f5f9;
|
||
border-radius: 50rem;
|
||
}
|
||
.entity-item.chip-style:hover {
|
||
background: #e2e8f0;
|
||
}
|
||
.entity-item.chip-style .entity-item-image {
|
||
width: 20px;
|
||
height: 20px;
|
||
border-radius: 50%;
|
||
}
|
||
.entity-item.chip-style .entity-item-no-image {
|
||
width: 20px;
|
||
height: 20px;
|
||
font-size: 10px;
|
||
border-radius: 50%;
|
||
}
|
||
.entity-item.chip-style .entity-item-info {
|
||
flex-direction: row;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-item.chip-style .entity-item-name {
|
||
font-size: 0.75rem;
|
||
}
|
||
.entity-item.chip-style .entity-item-meta {
|
||
display: none;
|
||
}
|
||
.entity-item.chip-style .entity-item-action {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-left: 0.125rem;
|
||
}
|
||
|
||
.entity-item.list-style {
|
||
padding: 0.5rem 0;
|
||
background: transparent;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0;
|
||
}
|
||
.entity-item.list-style:last-child {
|
||
border-bottom: none;
|
||
}
|
||
.entity-item.list-style:hover {
|
||
background: #e9ecef;
|
||
}
|
||
|
||
.entity-items-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
background: #f8fafc;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.entity-items-toolbar {
|
||
display: none;
|
||
align-items: center;
|
||
flex-wrap: nowrap;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
padding-bottom: 0;
|
||
background: transparent;
|
||
}
|
||
.entity-items-toolbar.has-items {
|
||
display: flex;
|
||
}
|
||
|
||
.entity-items-filter {
|
||
all: unset;
|
||
display: block;
|
||
flex: 1 1 auto;
|
||
min-width: 80px;
|
||
width: auto;
|
||
height: auto;
|
||
padding: 0.2rem 0.5rem 0.2rem 1.5rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") no-repeat 0.375rem center;
|
||
background-size: 10px;
|
||
border: 1px solid #cbd5e1;
|
||
border-radius: 0.2rem;
|
||
font-size: 11px;
|
||
line-height: 1.4;
|
||
color: #212529;
|
||
box-sizing: border-box;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-items-filter::placeholder {
|
||
color: #6c757d;
|
||
font-size: 11px;
|
||
}
|
||
.entity-items-filter:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
|
||
.entity-items-sort {
|
||
all: unset;
|
||
flex: 0 0 auto;
|
||
padding: 0.2rem 1.25rem 0.2rem 0.5rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.375rem center;
|
||
background-size: 8px;
|
||
font-size: 10px;
|
||
line-height: 1.4;
|
||
color: #495057;
|
||
cursor: pointer;
|
||
box-sizing: border-box;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-items-sort:hover {
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-items-sort:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
|
||
.entity-items-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
flex-shrink: 0;
|
||
gap: 0.125rem;
|
||
padding: 0.2rem 0.5rem;
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
font-size: 10px;
|
||
font-weight: 600;
|
||
border-radius: 0.2rem;
|
||
white-space: nowrap;
|
||
line-height: 1.4;
|
||
}
|
||
.entity-items-count.has-filter {
|
||
background: #cffafe;
|
||
color: #0e7490;
|
||
}
|
||
|
||
.entity-items-clear {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-items-clear:focus {
|
||
outline: none;
|
||
}
|
||
.entity-items-clear {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
flex-shrink: 0;
|
||
gap: 0.25rem;
|
||
padding: 0.2rem 0.5rem;
|
||
color: #dc3545;
|
||
font-size: 10px;
|
||
font-weight: 500;
|
||
background: rgba(220, 53, 69, 0.1);
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
white-space: nowrap;
|
||
line-height: 1.4;
|
||
}
|
||
.entity-items-clear:hover {
|
||
background: #dc3545;
|
||
color: #ffffff;
|
||
}
|
||
.entity-items-clear i {
|
||
font-size: 9px;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.entity-items-list {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
padding: 0.5rem 1rem 1rem;
|
||
min-height: 40px;
|
||
max-height: 300px;
|
||
overflow-y: auto;
|
||
}
|
||
.entity-items-list::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.entity-items-list::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.entity-items-list::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.entity-items-list::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
.entity-items-list:empty {
|
||
display: none;
|
||
}
|
||
.entity-items-list.list-layout {
|
||
flex-direction: column;
|
||
flex-wrap: nowrap;
|
||
gap: 0;
|
||
padding: 0.5rem;
|
||
}
|
||
|
||
.entity-items-load-more {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
background: transparent;
|
||
border-top: 1px dashed #dee2e6;
|
||
}
|
||
.entity-items-load-more .load-more-label {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-items-load-more .load-more-select {
|
||
appearance: none;
|
||
padding: 0.25rem 1.75rem 0.25rem 0.5rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.5rem center;
|
||
background-size: 8px;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #25b9d7;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
height: auto;
|
||
min-height: 0;
|
||
line-height: 1.3;
|
||
}
|
||
.entity-items-load-more .load-more-select:hover {
|
||
border-color: #25b9d7;
|
||
background-color: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-items-load-more .load-more-select:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-items-load-more .load-more-remaining {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-items-load-more .load-more-remaining .remaining-count {
|
||
font-weight: 600;
|
||
color: #495057;
|
||
}
|
||
.entity-items-load-more .btn-load-more {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 0.25rem;
|
||
margin: 0;
|
||
border: none;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
font: inherit;
|
||
}
|
||
.entity-items-load-more .btn-load-more i {
|
||
font-size: 14px;
|
||
}
|
||
.entity-items-load-more .btn-load-more:hover {
|
||
background: rgba(37, 185, 215, 0.2);
|
||
}
|
||
.entity-items-load-more .btn-load-more.loading {
|
||
cursor: wait;
|
||
}
|
||
.entity-items-load-more .btn-load-more.loading i {
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
|
||
.entity-items-empty {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
text-align: center;
|
||
color: #6c757d;
|
||
}
|
||
.entity-items-empty i {
|
||
font-size: 2rem;
|
||
opacity: 0.5;
|
||
}
|
||
.entity-items-empty p {
|
||
margin: 0;
|
||
font-size: 0.875rem;
|
||
}
|
||
|
||
.entity-items-loading {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-items-loading i {
|
||
font-size: 20px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Search Dropdown Component
|
||
* Includes search input, filter panel, results grid
|
||
*/
|
||
.entity-selector-trait .es-search-wrapper {
|
||
position: relative;
|
||
}
|
||
.entity-selector-trait .es-search-dropdown {
|
||
position: absolute;
|
||
z-index: 1000;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
|
||
display: none;
|
||
width: 600px;
|
||
max-width: calc(100vw - 40px);
|
||
}
|
||
.entity-selector-trait .es-search-dropdown.show {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .dropdown-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0.3rem 0.3rem 0 0;
|
||
}
|
||
.entity-selector-trait .dropdown-search-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .dropdown-search-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .dropdown-search-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .dropdown-search-input {
|
||
flex: 1;
|
||
padding: 0.5rem 1rem;
|
||
}
|
||
.entity-selector-trait .dropdown-close-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .dropdown-close-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .dropdown-close-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 32px;
|
||
height: 32px;
|
||
color: #6c757d;
|
||
border-radius: 0.25rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .dropdown-close-btn:hover {
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .dropdown-controls {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #ffffff;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .dropdown-controls-left,
|
||
.entity-selector-trait .dropdown-controls-right {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .view-mode-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .view-mode-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .view-mode-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #6c757d;
|
||
background: transparent;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .view-mode-btn:hover {
|
||
background: #f1f5f9;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .view-mode-btn.active {
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
}
|
||
.entity-selector-trait .dropdown-results-count {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .dropdown-body {
|
||
max-height: 400px;
|
||
overflow-y: auto;
|
||
}
|
||
.entity-selector-trait .dropdown-body::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.entity-selector-trait .dropdown-body::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.entity-selector-trait .dropdown-body::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.entity-selector-trait .dropdown-body::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
.entity-selector-trait .dropdown-results {
|
||
padding: 0;
|
||
}
|
||
.entity-selector-trait .results-count {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
padding: 0.25rem 0.5rem;
|
||
}
|
||
.entity-selector-trait .results-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.25rem 1rem;
|
||
background: #f1f5f9;
|
||
border-bottom: 1px solid #dee2e6;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .dropdown-results-grid {
|
||
display: grid;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .dropdown-results-grid.view-list {
|
||
grid-template-columns: 1fr;
|
||
}
|
||
.entity-selector-trait .dropdown-results-grid.view-grid-2 {
|
||
grid-template-columns: repeat(2, 1fr);
|
||
}
|
||
.entity-selector-trait .dropdown-results-grid.view-grid-3 {
|
||
grid-template-columns: repeat(3, 1fr);
|
||
}
|
||
.entity-selector-trait .dropdown-result-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
background: #ffffff;
|
||
border: none;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0;
|
||
cursor: pointer;
|
||
transition: background 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .dropdown-result-item:last-child {
|
||
border-bottom: none;
|
||
}
|
||
.entity-selector-trait .dropdown-result-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.entity-selector-trait .dropdown-result-item.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .dropdown-result-item.disabled {
|
||
opacity: 0.5;
|
||
cursor: not-allowed;
|
||
}
|
||
.entity-selector-trait .dropdown-result-item.disabled:hover {
|
||
background: #ffffff;
|
||
}
|
||
.entity-selector-trait .result-item-image,
|
||
.entity-selector-trait .result-image {
|
||
flex-shrink: 0;
|
||
width: 40px;
|
||
height: 40px;
|
||
overflow: hidden;
|
||
border-radius: 0.2rem;
|
||
background: #f1f5f9;
|
||
}
|
||
.entity-selector-trait .result-item-image img,
|
||
.entity-selector-trait .result-image img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.entity-selector-trait .result-item-image.result-flag,
|
||
.entity-selector-trait .result-image.result-flag {
|
||
width: 32px;
|
||
height: 24px;
|
||
border-radius: 2px;
|
||
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
|
||
background: transparent;
|
||
}
|
||
.entity-selector-trait .result-item-image.result-flag img,
|
||
.entity-selector-trait .result-image.result-flag img {
|
||
object-fit: contain;
|
||
}
|
||
.entity-selector-trait .result-item-image.result-flag .flag-fallback,
|
||
.entity-selector-trait .result-image.result-flag .flag-fallback {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
height: 100%;
|
||
background: linear-gradient(135deg, #e8eaed 0%, #dadce0 100%);
|
||
font-size: 14px;
|
||
color: #5f6368;
|
||
}
|
||
.entity-selector-trait .result-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 40px;
|
||
height: 40px;
|
||
background: #f1f5f9;
|
||
border-radius: 0.2rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .result-icon i {
|
||
font-size: 16px;
|
||
}
|
||
.entity-selector-trait .result-item-info,
|
||
.entity-selector-trait .result-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.entity-selector-trait .result-item-name,
|
||
.entity-selector-trait .result-name {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .result-item-meta,
|
||
.entity-selector-trait .result-subtitle {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .subtitle-line {
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .subtitle-line-primary {
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .subtitle-line-secondary {
|
||
color: #6c757d;
|
||
font-size: 11px;
|
||
}
|
||
.entity-selector-trait .result-col {
|
||
flex-shrink: 0;
|
||
width: 70px;
|
||
text-align: right;
|
||
font-size: 0.75rem;
|
||
}
|
||
.entity-selector-trait .result-col-price {
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .result-col-sale {
|
||
color: #dc3545;
|
||
font-weight: 600;
|
||
}
|
||
.entity-selector-trait .result-col-stock .col-value.stock-ok {
|
||
color: #70b580;
|
||
}
|
||
.entity-selector-trait .result-col-stock .col-value.stock-low {
|
||
color: #fab000;
|
||
}
|
||
.entity-selector-trait .result-col-stock .col-value.stock-out {
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .result-col-sales {
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .col-value {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .result-item-checkbox,
|
||
.entity-selector-trait .result-checkbox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 18px;
|
||
height: 18px;
|
||
border: 2px solid #ced4da;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .result-item-checkbox i,
|
||
.entity-selector-trait .result-checkbox i {
|
||
display: none;
|
||
font-size: 10px;
|
||
color: #ffffff;
|
||
}
|
||
.dropdown-result-item.selected .entity-selector-trait .result-item-checkbox, .dropdown-item.selected .entity-selector-trait .result-item-checkbox,
|
||
.dropdown-result-item.selected .entity-selector-trait .result-checkbox,
|
||
.dropdown-item.selected .entity-selector-trait .result-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.dropdown-result-item.selected .entity-selector-trait .result-item-checkbox i, .dropdown-item.selected .entity-selector-trait .result-item-checkbox i,
|
||
.dropdown-result-item.selected .entity-selector-trait .result-checkbox i,
|
||
.dropdown-item.selected .entity-selector-trait .result-checkbox i {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .result-item-product {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .no-results {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .no-results i {
|
||
font-size: 1.25rem;
|
||
opacity: 0.5;
|
||
}
|
||
.entity-selector-trait .dropdown-empty {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
text-align: center;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .dropdown-empty i {
|
||
font-size: 2rem;
|
||
opacity: 0.5;
|
||
}
|
||
.entity-selector-trait .dropdown-empty p {
|
||
margin: 0;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .dropdown-loading {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .dropdown-loading i {
|
||
font-size: 1.5rem;
|
||
animation: spin 1s linear infinite;
|
||
}
|
||
.entity-selector-trait .dropdown-footer {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8fafc;
|
||
border-top: 1px solid #dee2e6;
|
||
border-radius: 0 0 0.3rem 0.3rem;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .load-label {
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .load-more-select,
|
||
.entity-selector-trait .dropdown-footer-left select.load-more-select {
|
||
appearance: none;
|
||
padding: 0.25rem 1.5rem 0.25rem 0.5rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.4rem center;
|
||
background-size: 8px;
|
||
font-size: 0.75rem;
|
||
color: #495057;
|
||
cursor: pointer;
|
||
min-width: 55px;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .load-more-select:hover,
|
||
.entity-selector-trait .dropdown-footer-left select.load-more-select:hover {
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .load-more-select:focus,
|
||
.entity-selector-trait .dropdown-footer-left select.load-more-select:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .remaining-text {
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .remaining-text strong {
|
||
color: #495057;
|
||
font-weight: 600;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .btn-load-all {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .btn-load-all:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .btn-load-all {
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: #25b9d7;
|
||
background: transparent;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .dropdown-footer-left .btn-load-all:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .dropdown-footer-right {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
padding: 0.375rem 0.75rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn .btn-shortcut {
|
||
font-size: 10px;
|
||
padding: 0.125rem 0.25rem;
|
||
background: rgba(0, 0, 0, 0.08);
|
||
border-radius: 3px;
|
||
font-weight: 400;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn.btn-cancel {
|
||
color: #495057;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn.btn-cancel:hover {
|
||
background: #f1f5f9;
|
||
border-color: #ced4da;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn.btn-apply, .entity-selector-trait .dropdown-action-btn.btn-save {
|
||
color: #ffffff;
|
||
background: #25b9d7;
|
||
border: 1px solid #25b9d7;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn.btn-apply:hover, .entity-selector-trait .dropdown-action-btn.btn-save:hover {
|
||
background: #1a9ab7;
|
||
border-color: #1a9ab7;
|
||
}
|
||
.entity-selector-trait .dropdown-action-btn.btn-apply .btn-shortcut, .entity-selector-trait .dropdown-action-btn.btn-save .btn-shortcut {
|
||
background: rgba(255, 255, 255, 0.2);
|
||
}
|
||
.entity-selector-trait .dropdown-load-more {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .load-more-controls {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .dropdown-filter-panel {
|
||
padding: 1rem;
|
||
background: #f8fafc;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .filter-panel-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.entity-selector-trait .filter-panel-title {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
}
|
||
.entity-selector-trait .filter-panel-toggle {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .filter-panel-toggle:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .filter-panel-toggle {
|
||
font-size: 0.75rem;
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .filter-panel-toggle:hover {
|
||
text-decoration: underline;
|
||
}
|
||
.entity-selector-trait .filter-panel-content {
|
||
display: grid;
|
||
gap: 0.5rem;
|
||
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
|
||
}
|
||
.entity-selector-trait .filter-group {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .filter-label {
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .filter-select,
|
||
.entity-selector-trait .filter-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .filter-select:focus,
|
||
.entity-selector-trait .filter-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .filter-select::placeholder,
|
||
.entity-selector-trait .filter-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .filter-select,
|
||
.entity-selector-trait .filter-input {
|
||
padding: 0.375rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
}
|
||
|
||
.entity-selector-trait .category-tree {
|
||
padding: 0.5rem;
|
||
}
|
||
.entity-selector-trait .tree-loading {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .tree-loading i {
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .tree-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem 0.5rem;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .tree-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.entity-selector-trait .tree-item.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .tree-item.selected .tree-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .tree-item.selected .tree-checkbox i {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .tree-info {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.entity-selector-trait .tree-name {
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .tree-subtitle {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .category-tree-item {
|
||
padding: 0.25rem 0;
|
||
}
|
||
.entity-selector-trait .category-tree-node {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.25rem 0.5rem;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .category-tree-node:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.entity-selector-trait .category-tree-node.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .category-tree-toggle {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 16px;
|
||
height: 16px;
|
||
color: #6c757d;
|
||
transition: transform 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .category-tree-toggle.expanded {
|
||
transform: rotate(90deg);
|
||
}
|
||
.entity-selector-trait .category-tree-toggle.empty {
|
||
visibility: hidden;
|
||
}
|
||
.entity-selector-trait .category-tree-checkbox {
|
||
flex-shrink: 0;
|
||
width: 16px;
|
||
height: 16px;
|
||
border: 2px solid #ced4da;
|
||
border-radius: 3px;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .category-tree-checkbox.checked {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .category-tree-checkbox.checked::after {
|
||
content: "✓";
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
height: 100%;
|
||
color: #ffffff;
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .category-tree-checkbox.indeterminate {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .category-tree-checkbox.indeterminate::after {
|
||
content: "−";
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 100%;
|
||
height: 100%;
|
||
color: #ffffff;
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .category-tree-name {
|
||
flex: 1;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .category-tree-count {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .category-tree-children {
|
||
margin-left: 24px;
|
||
}
|
||
.entity-selector-trait .search-history-list {
|
||
padding: 0.5rem;
|
||
}
|
||
.entity-selector-trait .history-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .history-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.entity-selector-trait .history-item > i {
|
||
color: #6c757d;
|
||
font-size: 14px;
|
||
}
|
||
.entity-selector-trait .history-query {
|
||
flex: 1;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
}
|
||
.entity-selector-trait .btn-delete-history {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-delete-history:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-delete-history {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
opacity: 0;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.history-item:hover .entity-selector-trait .btn-delete-history {
|
||
opacity: 1;
|
||
}
|
||
.entity-selector-trait .btn-delete-history:hover {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .btn-delete-history i {
|
||
font-size: 12px;
|
||
}
|
||
.entity-selector-trait .filter-panel {
|
||
display: none;
|
||
padding: 1rem;
|
||
background: #f8fafc;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .filter-panel.show {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .filter-row {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.entity-selector-trait .filter-row:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
.entity-selector-trait .view-mode-select {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .view-mode-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .view-mode-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .view-mode-select {
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
min-width: 80px;
|
||
}
|
||
|
||
body > .es-search-dropdown,
|
||
.es-search-dropdown {
|
||
position: absolute;
|
||
z-index: 1000;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
|
||
display: none;
|
||
width: 600px;
|
||
max-width: calc(100vw - 40px);
|
||
}
|
||
body > .es-search-dropdown.show,
|
||
.es-search-dropdown.show {
|
||
display: block;
|
||
}
|
||
body > .es-search-dropdown .dropdown-header,
|
||
.es-search-dropdown .dropdown-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0.3rem 0.3rem 0 0;
|
||
flex-wrap: wrap;
|
||
}
|
||
body > .es-search-dropdown .results-count,
|
||
.es-search-dropdown .results-count {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .dropdown-actions,
|
||
.es-search-dropdown .dropdown-actions {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
flex-wrap: wrap;
|
||
flex: 1;
|
||
justify-content: flex-end;
|
||
}
|
||
body > .es-search-dropdown .btn-select-all,
|
||
body > .es-search-dropdown .btn-clear-selection,
|
||
.es-search-dropdown .btn-select-all,
|
||
.es-search-dropdown .btn-clear-selection {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .btn-select-all:focus,
|
||
body > .es-search-dropdown .btn-clear-selection:focus,
|
||
.es-search-dropdown .btn-select-all:focus,
|
||
.es-search-dropdown .btn-clear-selection:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .btn-select-all,
|
||
body > .es-search-dropdown .btn-clear-selection,
|
||
.es-search-dropdown .btn-select-all,
|
||
.es-search-dropdown .btn-clear-selection {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: #495057;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .btn-select-all:hover,
|
||
body > .es-search-dropdown .btn-clear-selection:hover,
|
||
.es-search-dropdown .btn-select-all:hover,
|
||
.es-search-dropdown .btn-clear-selection:hover {
|
||
background: #e9ecef;
|
||
border-color: #cbd5e1;
|
||
}
|
||
body > .es-search-dropdown .btn-select-all kbd,
|
||
body > .es-search-dropdown .btn-clear-selection kbd,
|
||
.es-search-dropdown .btn-select-all kbd,
|
||
.es-search-dropdown .btn-clear-selection kbd {
|
||
font-size: 0.65rem;
|
||
padding: 0.125rem 0.25rem;
|
||
background: #f1f5f9;
|
||
border-radius: 2px;
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .sort-controls,
|
||
.es-search-dropdown .sort-controls {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
body > .es-search-dropdown .sort-field-select,
|
||
.es-search-dropdown .sort-field-select {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .sort-field-select:focus,
|
||
.es-search-dropdown .sort-field-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
body > .es-search-dropdown .sort-field-select::placeholder,
|
||
.es-search-dropdown .sort-field-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
body > .es-search-dropdown .sort-field-select,
|
||
.es-search-dropdown .sort-field-select {
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
min-width: 80px;
|
||
height: 28px;
|
||
border-radius: 0.2rem 0 0 0.2rem;
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown .btn-sort-dir,
|
||
.es-search-dropdown .btn-sort-dir {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 38px;
|
||
min-width: 38px;
|
||
flex-shrink: 0;
|
||
height: 28px;
|
||
padding: 0;
|
||
margin: 0;
|
||
color: #6c757d;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0 0.2rem 0.2rem 0;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .btn-sort-dir i,
|
||
.es-search-dropdown .btn-sort-dir i {
|
||
font-size: 14px;
|
||
}
|
||
body > .es-search-dropdown .btn-sort-dir:hover,
|
||
.es-search-dropdown .btn-sort-dir:hover {
|
||
background: #e9ecef;
|
||
color: #212529;
|
||
}
|
||
body > .es-search-dropdown .btn-sort-dir.active,
|
||
.es-search-dropdown .btn-sort-dir.active {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-color: #25b9d7;
|
||
color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .view-mode-select,
|
||
.es-search-dropdown .view-mode-select {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .view-mode-select:focus,
|
||
.es-search-dropdown .view-mode-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
body > .es-search-dropdown .view-mode-select::placeholder,
|
||
.es-search-dropdown .view-mode-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
body > .es-search-dropdown .view-mode-select,
|
||
.es-search-dropdown .view-mode-select {
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
min-width: 80px;
|
||
margin-left: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown .btn-toggle-filters,
|
||
body > .es-search-dropdown .btn-show-history,
|
||
.es-search-dropdown .btn-toggle-filters,
|
||
.es-search-dropdown .btn-show-history {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 32px;
|
||
min-width: 32px;
|
||
flex-shrink: 0;
|
||
height: 28px;
|
||
padding: 0;
|
||
margin: 0;
|
||
color: #6c757d;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .btn-toggle-filters i,
|
||
body > .es-search-dropdown .btn-show-history i,
|
||
.es-search-dropdown .btn-toggle-filters i,
|
||
.es-search-dropdown .btn-show-history i {
|
||
font-size: 14px;
|
||
}
|
||
body > .es-search-dropdown .btn-toggle-filters:hover,
|
||
body > .es-search-dropdown .btn-show-history:hover,
|
||
.es-search-dropdown .btn-toggle-filters:hover,
|
||
.es-search-dropdown .btn-show-history:hover {
|
||
background: #e9ecef;
|
||
color: #212529;
|
||
}
|
||
body > .es-search-dropdown .btn-toggle-filters.active,
|
||
body > .es-search-dropdown .btn-show-history.active,
|
||
.es-search-dropdown .btn-toggle-filters.active,
|
||
.es-search-dropdown .btn-show-history.active {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-color: #25b9d7;
|
||
color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .refine-compact,
|
||
.es-search-dropdown .refine-compact {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .btn-refine-negate,
|
||
.es-search-dropdown .refine-compact .btn-refine-negate {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 32px;
|
||
min-width: 32px;
|
||
flex-shrink: 0;
|
||
height: 28px;
|
||
padding: 0;
|
||
margin: 0;
|
||
color: #6c757d;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-right: none;
|
||
border-radius: 0.2rem 0 0 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .btn-refine-negate:hover,
|
||
.es-search-dropdown .refine-compact .btn-refine-negate:hover {
|
||
background: #e9ecef;
|
||
color: #212529;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .btn-refine-negate.active,
|
||
.es-search-dropdown .refine-compact .btn-refine-negate.active {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
border-color: #dc3545;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .refine-input,
|
||
.es-search-dropdown .refine-compact .refine-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .refine-input:focus,
|
||
.es-search-dropdown .refine-compact .refine-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
body > .es-search-dropdown .refine-compact .refine-input::placeholder,
|
||
.es-search-dropdown .refine-compact .refine-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .refine-input,
|
||
.es-search-dropdown .refine-compact .refine-input {
|
||
width: 100px;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
border-radius: 0 0.2rem 0.2rem 0;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .btn-clear-refine,
|
||
.es-search-dropdown .refine-compact .btn-clear-refine {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
padding: 0;
|
||
margin: 0;
|
||
margin-left: -1px;
|
||
color: #6c757d;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0 0.2rem 0.2rem 0;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .refine-compact .btn-clear-refine:hover,
|
||
.es-search-dropdown .refine-compact .btn-clear-refine:hover {
|
||
background: #e9ecef;
|
||
color: #212529;
|
||
}
|
||
body > .es-search-dropdown .filter-panel,
|
||
.es-search-dropdown .filter-panel {
|
||
display: none;
|
||
padding: 1rem;
|
||
background: #f8fafc;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown .filter-panel.show,
|
||
.es-search-dropdown .filter-panel.show {
|
||
display: block;
|
||
}
|
||
body > .es-search-dropdown .filter-row,
|
||
.es-search-dropdown .filter-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
flex-wrap: wrap;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
body > .es-search-dropdown .filter-row:last-child,
|
||
.es-search-dropdown .filter-row:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
body > .es-search-dropdown .filter-label,
|
||
.es-search-dropdown .filter-label {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
font-size: 0.75rem;
|
||
color: #495057;
|
||
cursor: pointer;
|
||
}
|
||
body > .es-search-dropdown .filter-label input[type=checkbox],
|
||
.es-search-dropdown .filter-label input[type=checkbox] {
|
||
margin: 0;
|
||
}
|
||
body > .es-search-dropdown .filter-price-range,
|
||
.es-search-dropdown .filter-price-range {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown .filter-price-range .filter-price-label,
|
||
.es-search-dropdown .filter-price-range .filter-price-label {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .filter-price-range .filter-price-min,
|
||
body > .es-search-dropdown .filter-price-range .filter-price-max,
|
||
.es-search-dropdown .filter-price-range .filter-price-min,
|
||
.es-search-dropdown .filter-price-range .filter-price-max {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .filter-price-range .filter-price-min:focus,
|
||
body > .es-search-dropdown .filter-price-range .filter-price-max:focus,
|
||
.es-search-dropdown .filter-price-range .filter-price-min:focus,
|
||
.es-search-dropdown .filter-price-range .filter-price-max:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
body > .es-search-dropdown .filter-price-range .filter-price-min::placeholder,
|
||
body > .es-search-dropdown .filter-price-range .filter-price-max::placeholder,
|
||
.es-search-dropdown .filter-price-range .filter-price-min::placeholder,
|
||
.es-search-dropdown .filter-price-range .filter-price-max::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
body > .es-search-dropdown .filter-price-range .filter-price-min,
|
||
body > .es-search-dropdown .filter-price-range .filter-price-max,
|
||
.es-search-dropdown .filter-price-range .filter-price-min,
|
||
.es-search-dropdown .filter-price-range .filter-price-max {
|
||
width: 70px;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
}
|
||
body > .es-search-dropdown .filter-price-range .filter-price-sep,
|
||
.es-search-dropdown .filter-price-range .filter-price-sep {
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .btn-clear-filters,
|
||
.es-search-dropdown .btn-clear-filters {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .btn-clear-filters:focus,
|
||
.es-search-dropdown .btn-clear-filters:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .btn-clear-filters,
|
||
.es-search-dropdown .btn-clear-filters {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
margin-left: auto;
|
||
}
|
||
body > .es-search-dropdown .btn-clear-filters:hover,
|
||
.es-search-dropdown .btn-clear-filters:hover {
|
||
background: #e2e8f0;
|
||
color: #212529;
|
||
}
|
||
body > .es-search-dropdown .filter-row-multi,
|
||
.es-search-dropdown .filter-row-multi {
|
||
flex-direction: column;
|
||
align-items: stretch;
|
||
gap: 0.5rem;
|
||
}
|
||
body > .es-search-dropdown .filter-subrow,
|
||
.es-search-dropdown .filter-subrow {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
flex-wrap: wrap;
|
||
}
|
||
body > .es-search-dropdown .filter-range-group,
|
||
body > .es-search-dropdown .filter-date-group,
|
||
body > .es-search-dropdown .filter-select-group,
|
||
.es-search-dropdown .filter-range-group,
|
||
.es-search-dropdown .filter-date-group,
|
||
.es-search-dropdown .filter-select-group {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown .filter-range-label,
|
||
body > .es-search-dropdown .filter-date-label,
|
||
body > .es-search-dropdown .filter-select-label,
|
||
body > .es-search-dropdown .filter-row-label,
|
||
.es-search-dropdown .filter-range-label,
|
||
.es-search-dropdown .filter-date-label,
|
||
.es-search-dropdown .filter-select-label,
|
||
.es-search-dropdown .filter-row-label {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .filter-range-label i,
|
||
body > .es-search-dropdown .filter-date-label i,
|
||
body > .es-search-dropdown .filter-select-label i,
|
||
body > .es-search-dropdown .filter-row-label i,
|
||
.es-search-dropdown .filter-range-label i,
|
||
.es-search-dropdown .filter-date-label i,
|
||
.es-search-dropdown .filter-select-label i,
|
||
.es-search-dropdown .filter-row-label i {
|
||
margin-right: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown .filter-range-sep,
|
||
.es-search-dropdown .filter-range-sep {
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .filter-product-count-min,
|
||
body > .es-search-dropdown .filter-product-count-max,
|
||
body > .es-search-dropdown .filter-sales-min,
|
||
body > .es-search-dropdown .filter-sales-max,
|
||
body > .es-search-dropdown .filter-turnover-min,
|
||
body > .es-search-dropdown .filter-turnover-max,
|
||
body > .es-search-dropdown .filter-date-add-from,
|
||
body > .es-search-dropdown .filter-date-add-to,
|
||
body > .es-search-dropdown .filter-last-product-from,
|
||
body > .es-search-dropdown .filter-last-product-to,
|
||
.es-search-dropdown .filter-product-count-min,
|
||
.es-search-dropdown .filter-product-count-max,
|
||
.es-search-dropdown .filter-sales-min,
|
||
.es-search-dropdown .filter-sales-max,
|
||
.es-search-dropdown .filter-turnover-min,
|
||
.es-search-dropdown .filter-turnover-max,
|
||
.es-search-dropdown .filter-date-add-from,
|
||
.es-search-dropdown .filter-date-add-to,
|
||
.es-search-dropdown .filter-last-product-from,
|
||
.es-search-dropdown .filter-last-product-to {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .filter-product-count-min:focus,
|
||
body > .es-search-dropdown .filter-product-count-max:focus,
|
||
body > .es-search-dropdown .filter-sales-min:focus,
|
||
body > .es-search-dropdown .filter-sales-max:focus,
|
||
body > .es-search-dropdown .filter-turnover-min:focus,
|
||
body > .es-search-dropdown .filter-turnover-max:focus,
|
||
body > .es-search-dropdown .filter-date-add-from:focus,
|
||
body > .es-search-dropdown .filter-date-add-to:focus,
|
||
body > .es-search-dropdown .filter-last-product-from:focus,
|
||
body > .es-search-dropdown .filter-last-product-to:focus,
|
||
.es-search-dropdown .filter-product-count-min:focus,
|
||
.es-search-dropdown .filter-product-count-max:focus,
|
||
.es-search-dropdown .filter-sales-min:focus,
|
||
.es-search-dropdown .filter-sales-max:focus,
|
||
.es-search-dropdown .filter-turnover-min:focus,
|
||
.es-search-dropdown .filter-turnover-max:focus,
|
||
.es-search-dropdown .filter-date-add-from:focus,
|
||
.es-search-dropdown .filter-date-add-to:focus,
|
||
.es-search-dropdown .filter-last-product-from:focus,
|
||
.es-search-dropdown .filter-last-product-to:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
body > .es-search-dropdown .filter-product-count-min::placeholder,
|
||
body > .es-search-dropdown .filter-product-count-max::placeholder,
|
||
body > .es-search-dropdown .filter-sales-min::placeholder,
|
||
body > .es-search-dropdown .filter-sales-max::placeholder,
|
||
body > .es-search-dropdown .filter-turnover-min::placeholder,
|
||
body > .es-search-dropdown .filter-turnover-max::placeholder,
|
||
body > .es-search-dropdown .filter-date-add-from::placeholder,
|
||
body > .es-search-dropdown .filter-date-add-to::placeholder,
|
||
body > .es-search-dropdown .filter-last-product-from::placeholder,
|
||
body > .es-search-dropdown .filter-last-product-to::placeholder,
|
||
.es-search-dropdown .filter-product-count-min::placeholder,
|
||
.es-search-dropdown .filter-product-count-max::placeholder,
|
||
.es-search-dropdown .filter-sales-min::placeholder,
|
||
.es-search-dropdown .filter-sales-max::placeholder,
|
||
.es-search-dropdown .filter-turnover-min::placeholder,
|
||
.es-search-dropdown .filter-turnover-max::placeholder,
|
||
.es-search-dropdown .filter-date-add-from::placeholder,
|
||
.es-search-dropdown .filter-date-add-to::placeholder,
|
||
.es-search-dropdown .filter-last-product-from::placeholder,
|
||
.es-search-dropdown .filter-last-product-to::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
body > .es-search-dropdown .filter-product-count-min,
|
||
body > .es-search-dropdown .filter-product-count-max,
|
||
body > .es-search-dropdown .filter-sales-min,
|
||
body > .es-search-dropdown .filter-sales-max,
|
||
body > .es-search-dropdown .filter-turnover-min,
|
||
body > .es-search-dropdown .filter-turnover-max,
|
||
body > .es-search-dropdown .filter-date-add-from,
|
||
body > .es-search-dropdown .filter-date-add-to,
|
||
body > .es-search-dropdown .filter-last-product-from,
|
||
body > .es-search-dropdown .filter-last-product-to,
|
||
.es-search-dropdown .filter-product-count-min,
|
||
.es-search-dropdown .filter-product-count-max,
|
||
.es-search-dropdown .filter-sales-min,
|
||
.es-search-dropdown .filter-sales-max,
|
||
.es-search-dropdown .filter-turnover-min,
|
||
.es-search-dropdown .filter-turnover-max,
|
||
.es-search-dropdown .filter-date-add-from,
|
||
.es-search-dropdown .filter-date-add-to,
|
||
.es-search-dropdown .filter-last-product-from,
|
||
.es-search-dropdown .filter-last-product-to {
|
||
width: 70px;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
}
|
||
body > .es-search-dropdown .filter-depth-select,
|
||
body > .es-search-dropdown .filter-attribute-group-select,
|
||
body > .es-search-dropdown .filter-feature-group-select,
|
||
.es-search-dropdown .filter-depth-select,
|
||
.es-search-dropdown .filter-attribute-group-select,
|
||
.es-search-dropdown .filter-feature-group-select {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .filter-depth-select:focus,
|
||
body > .es-search-dropdown .filter-attribute-group-select:focus,
|
||
body > .es-search-dropdown .filter-feature-group-select:focus,
|
||
.es-search-dropdown .filter-depth-select:focus,
|
||
.es-search-dropdown .filter-attribute-group-select:focus,
|
||
.es-search-dropdown .filter-feature-group-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
body > .es-search-dropdown .filter-depth-select::placeholder,
|
||
body > .es-search-dropdown .filter-attribute-group-select::placeholder,
|
||
body > .es-search-dropdown .filter-feature-group-select::placeholder,
|
||
.es-search-dropdown .filter-depth-select::placeholder,
|
||
.es-search-dropdown .filter-attribute-group-select::placeholder,
|
||
.es-search-dropdown .filter-feature-group-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
body > .es-search-dropdown .filter-depth-select,
|
||
body > .es-search-dropdown .filter-attribute-group-select,
|
||
body > .es-search-dropdown .filter-feature-group-select,
|
||
.es-search-dropdown .filter-depth-select,
|
||
.es-search-dropdown .filter-attribute-group-select,
|
||
.es-search-dropdown .filter-feature-group-select {
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
min-width: 100px;
|
||
}
|
||
body > .es-search-dropdown .filter-attributes-container,
|
||
body > .es-search-dropdown .filter-features-container,
|
||
body > .es-search-dropdown .filter-values-container,
|
||
.es-search-dropdown .filter-attributes-container,
|
||
.es-search-dropdown .filter-features-container,
|
||
.es-search-dropdown .filter-values-container {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle,
|
||
.es-search-dropdown .filter-group-toggle {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle:focus,
|
||
.es-search-dropdown .filter-group-toggle:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle,
|
||
.es-search-dropdown .filter-group-toggle {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: #495057;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle:hover,
|
||
.es-search-dropdown .filter-group-toggle:hover {
|
||
background: #e9ecef;
|
||
border-color: #cbd5e1;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle.active,
|
||
.es-search-dropdown .filter-group-toggle.active {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-color: #25b9d7;
|
||
color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle.active .toggle-count,
|
||
.es-search-dropdown .filter-group-toggle.active .toggle-count {
|
||
color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle.has-selection,
|
||
.es-search-dropdown .filter-group-toggle.has-selection {
|
||
border-color: #70b580;
|
||
background: rgba(112, 181, 128, 0.05);
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle.has-selection .toggle-count,
|
||
.es-search-dropdown .filter-group-toggle.has-selection .toggle-count {
|
||
color: #70b580;
|
||
font-weight: 600;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-name,
|
||
.es-search-dropdown .filter-group-toggle .toggle-name {
|
||
font-weight: 500;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.125rem;
|
||
color: #6c757d;
|
||
font-size: 0.65rem;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count i,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count i {
|
||
font-size: 10px;
|
||
color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count.clickable,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count.clickable {
|
||
cursor: pointer;
|
||
padding: 0.125rem 0.25rem;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count.clickable:hover,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count.clickable:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count.clickable:hover i,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count.clickable:hover i {
|
||
color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count.clickable.popover-open,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count.clickable.popover-open {
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count.clickable.popover-open i,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count.clickable.popover-open i {
|
||
color: #ffffff;
|
||
}
|
||
body > .es-search-dropdown .filter-group-toggle .toggle-count.clickable.loading i,
|
||
.es-search-dropdown .filter-group-toggle .toggle-count.clickable.loading i {
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
body > .es-search-dropdown .filter-chip, body > .es-search-dropdown .filter-attr-chip,
|
||
body > .es-search-dropdown .filter-feat-chip,
|
||
.es-search-dropdown .filter-chip,
|
||
.es-search-dropdown .filter-attr-chip,
|
||
.es-search-dropdown .filter-feat-chip {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .filter-chip:focus,
|
||
.es-search-dropdown .filter-chip:focus,
|
||
.es-search-dropdown .filter-attr-chip:focus,
|
||
.es-search-dropdown .filter-feat-chip:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .filter-chip, body > .es-search-dropdown .filter-attr-chip,
|
||
body > .es-search-dropdown .filter-feat-chip,
|
||
.es-search-dropdown .filter-chip,
|
||
.es-search-dropdown .filter-attr-chip,
|
||
.es-search-dropdown .filter-feat-chip {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: #495057;
|
||
background: #f1f5f9;
|
||
border: 1px solid transparent;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .filter-chip:hover,
|
||
.es-search-dropdown .filter-chip:hover,
|
||
.es-search-dropdown .filter-attr-chip:hover,
|
||
.es-search-dropdown .filter-feat-chip:hover {
|
||
background: #e2e8f0;
|
||
}
|
||
body > .es-search-dropdown .filter-chip.active,
|
||
.es-search-dropdown .filter-chip.active,
|
||
.es-search-dropdown .active.filter-attr-chip,
|
||
.es-search-dropdown .active.filter-feat-chip {
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
}
|
||
body > .es-search-dropdown .filter-row-values,
|
||
.es-search-dropdown .filter-row-values {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
}
|
||
body > .es-search-dropdown .filter-row-values .filter-values-container,
|
||
.es-search-dropdown .filter-row-values .filter-values-container {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
flex: 1;
|
||
}
|
||
body > .es-search-dropdown .filter-row-values .filter-values-label,
|
||
.es-search-dropdown .filter-row-values .filter-values-label {
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
color: #495057;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .filter-row-values .btn-close-values,
|
||
.es-search-dropdown .filter-row-values .btn-close-values {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .filter-row-values .btn-close-values:focus,
|
||
.es-search-dropdown .filter-row-values .btn-close-values:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .filter-row-values .btn-close-values,
|
||
.es-search-dropdown .filter-row-values .btn-close-values {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 20px;
|
||
height: 20px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
}
|
||
body > .es-search-dropdown .filter-row-values .btn-close-values:hover,
|
||
.es-search-dropdown .filter-row-values .btn-close-values:hover {
|
||
background: #e2e8f0;
|
||
color: #212529;
|
||
}
|
||
body > .es-search-dropdown .chip-name,
|
||
.es-search-dropdown .chip-name {
|
||
font-weight: 500;
|
||
}
|
||
body > .es-search-dropdown .chip-count,
|
||
.es-search-dropdown .chip-count {
|
||
font-size: 0.6rem;
|
||
color: #6c757d;
|
||
margin-left: 0.125rem;
|
||
}
|
||
body > .es-search-dropdown .filter-chip.active .chip-count,
|
||
.es-search-dropdown .filter-chip.active .chip-count,
|
||
.es-search-dropdown .active.filter-attr-chip .chip-count,
|
||
.es-search-dropdown .active.filter-feat-chip .chip-count {
|
||
color: rgba(255, 255, 255, 0.8);
|
||
}
|
||
body > .es-search-dropdown .dropdown-content,
|
||
.es-search-dropdown .dropdown-content {
|
||
max-height: 400px;
|
||
overflow-y: auto;
|
||
}
|
||
body > .es-search-dropdown .dropdown-content::-webkit-scrollbar,
|
||
.es-search-dropdown .dropdown-content::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-content::-webkit-scrollbar-track,
|
||
.es-search-dropdown .dropdown-content::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-content::-webkit-scrollbar-thumb,
|
||
.es-search-dropdown .dropdown-content::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-content::-webkit-scrollbar-thumb:hover,
|
||
.es-search-dropdown .dropdown-content::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
body > .es-search-dropdown .dropdown-items,
|
||
.es-search-dropdown .dropdown-items {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.25rem;
|
||
padding: 0.5rem;
|
||
}
|
||
body > .es-search-dropdown .item-checkbox,
|
||
.es-search-dropdown .item-checkbox {
|
||
flex-shrink: 0;
|
||
width: 16px;
|
||
height: 16px;
|
||
border: 2px solid #ced4da;
|
||
border-radius: 3px;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.dropdown-item.selected body > .es-search-dropdown .item-checkbox,
|
||
.dropdown-item.selected .es-search-dropdown .item-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .item-image,
|
||
.es-search-dropdown .item-image {
|
||
flex-shrink: 0;
|
||
width: 40px;
|
||
height: 40px;
|
||
object-fit: cover;
|
||
border-radius: 0.2rem;
|
||
background: #f1f5f9;
|
||
}
|
||
body > .es-search-dropdown .item-info,
|
||
.es-search-dropdown .item-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
body > .es-search-dropdown .item-name,
|
||
.es-search-dropdown .item-name {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .item-meta,
|
||
.es-search-dropdown .item-meta {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer,
|
||
.es-search-dropdown .dropdown-footer {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8fafc;
|
||
border-top: 1px solid #dee2e6;
|
||
border-radius: 0 0 0.3rem 0.3rem;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-left,
|
||
.es-search-dropdown .dropdown-footer-left {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-left .load-label,
|
||
.es-search-dropdown .dropdown-footer-left .load-label {
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-left .load-more-select,
|
||
body > .es-search-dropdown .dropdown-footer-left select.load-more-select,
|
||
.es-search-dropdown .dropdown-footer-left .load-more-select,
|
||
.es-search-dropdown .dropdown-footer-left select.load-more-select {
|
||
appearance: none;
|
||
padding: 0.25rem 1.5rem 0.25rem 0.5rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.4rem center;
|
||
background-size: 8px;
|
||
font-size: 0.75rem;
|
||
color: #495057;
|
||
cursor: pointer;
|
||
min-width: 55px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-left .load-more-select:hover,
|
||
body > .es-search-dropdown .dropdown-footer-left select.load-more-select:hover,
|
||
.es-search-dropdown .dropdown-footer-left .load-more-select:hover,
|
||
.es-search-dropdown .dropdown-footer-left select.load-more-select:hover {
|
||
border-color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-left .load-more-select:focus,
|
||
body > .es-search-dropdown .dropdown-footer-left select.load-more-select:focus,
|
||
.es-search-dropdown .dropdown-footer-left .load-more-select:focus,
|
||
.es-search-dropdown .dropdown-footer-left select.load-more-select:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-left .remaining-text,
|
||
.es-search-dropdown .dropdown-footer-left .remaining-text {
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-left .remaining-text strong,
|
||
.es-search-dropdown .dropdown-footer-left .remaining-text strong {
|
||
color: #495057;
|
||
font-weight: 600;
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-right,
|
||
.es-search-dropdown .dropdown-footer-right {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn,
|
||
.es-search-dropdown .dropdown-action-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn:focus,
|
||
.es-search-dropdown .dropdown-action-btn:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn,
|
||
.es-search-dropdown .dropdown-action-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
padding: 0.375rem 0.75rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn .btn-shortcut,
|
||
.es-search-dropdown .dropdown-action-btn .btn-shortcut {
|
||
font-size: 10px;
|
||
padding: 0.125rem 0.25rem;
|
||
background: rgba(0, 0, 0, 0.08);
|
||
border-radius: 3px;
|
||
font-weight: 400;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn.btn-cancel,
|
||
.es-search-dropdown .dropdown-action-btn.btn-cancel {
|
||
color: #495057;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn.btn-cancel:hover,
|
||
.es-search-dropdown .dropdown-action-btn.btn-cancel:hover {
|
||
background: #f1f5f9;
|
||
border-color: #ced4da;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn.btn-apply, body > .es-search-dropdown .dropdown-action-btn.btn-save,
|
||
.es-search-dropdown .dropdown-action-btn.btn-apply,
|
||
.es-search-dropdown .dropdown-action-btn.btn-save {
|
||
color: #ffffff;
|
||
background: #25b9d7;
|
||
border: 1px solid #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn.btn-apply:hover, body > .es-search-dropdown .dropdown-action-btn.btn-save:hover,
|
||
.es-search-dropdown .dropdown-action-btn.btn-apply:hover,
|
||
.es-search-dropdown .dropdown-action-btn.btn-save:hover {
|
||
background: #1a9ab7;
|
||
border-color: #1a9ab7;
|
||
}
|
||
body > .es-search-dropdown .dropdown-action-btn.btn-apply .btn-shortcut, body > .es-search-dropdown .dropdown-action-btn.btn-save .btn-shortcut,
|
||
.es-search-dropdown .dropdown-action-btn.btn-apply .btn-shortcut,
|
||
.es-search-dropdown .dropdown-action-btn.btn-save .btn-shortcut {
|
||
background: rgba(255, 255, 255, 0.2);
|
||
}
|
||
body > .es-search-dropdown .dropdown-footer-info,
|
||
.es-search-dropdown .dropdown-footer-info {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .btn-cancel-dropdown,
|
||
.es-search-dropdown .btn-cancel-dropdown {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .btn-cancel-dropdown:focus,
|
||
.es-search-dropdown .btn-cancel-dropdown:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .btn-cancel-dropdown,
|
||
.es-search-dropdown .btn-cancel-dropdown {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem 0.75rem;
|
||
font-size: 0.875rem;
|
||
color: #ffffff;
|
||
background: #25b9d7;
|
||
border: 1px solid #25b9d7;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
}
|
||
body > .es-search-dropdown .btn-cancel-dropdown:hover,
|
||
.es-search-dropdown .btn-cancel-dropdown:hover {
|
||
background: #1a9ab7;
|
||
border-color: #1a9ab7;
|
||
}
|
||
body > .es-search-dropdown .btn-cancel-dropdown i,
|
||
.es-search-dropdown .btn-cancel-dropdown i {
|
||
font-size: 10px;
|
||
}
|
||
body > .es-search-dropdown .btn-cancel-dropdown kbd,
|
||
.es-search-dropdown .btn-cancel-dropdown kbd {
|
||
font-size: 0.65rem;
|
||
padding: 0.125rem 0.25rem;
|
||
background: rgba(255, 255, 255, 0.2);
|
||
border-radius: 2px;
|
||
color: rgba(255, 255, 255, 0.8);
|
||
}
|
||
body > .es-search-dropdown .filter-chips-row,
|
||
.es-search-dropdown .filter-chips-row {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 1rem;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown .filter-chip, body > .es-search-dropdown .filter-attr-chip,
|
||
body > .es-search-dropdown .filter-feat-chip,
|
||
.es-search-dropdown .filter-chip,
|
||
.es-search-dropdown .filter-attr-chip,
|
||
.es-search-dropdown .filter-feat-chip {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
background: #e9ecef;
|
||
color: #495057;
|
||
border-radius: 50rem;
|
||
}
|
||
body > .es-search-dropdown .filter-chip .chip-remove,
|
||
.es-search-dropdown .filter-chip .chip-remove,
|
||
.es-search-dropdown .filter-attr-chip .chip-remove,
|
||
.es-search-dropdown .filter-feat-chip .chip-remove {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .filter-chip .chip-remove:focus,
|
||
.es-search-dropdown .filter-chip .chip-remove:focus,
|
||
.es-search-dropdown .filter-attr-chip .chip-remove:focus,
|
||
.es-search-dropdown .filter-feat-chip .chip-remove:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .filter-chip .chip-remove,
|
||
.es-search-dropdown .filter-chip .chip-remove,
|
||
.es-search-dropdown .filter-attr-chip .chip-remove,
|
||
.es-search-dropdown .filter-feat-chip .chip-remove {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 14px;
|
||
height: 14px;
|
||
font-size: 10px;
|
||
color: #6c757d;
|
||
border-radius: 50%;
|
||
}
|
||
body > .es-search-dropdown .filter-chip .chip-remove:hover,
|
||
.es-search-dropdown .filter-chip .chip-remove:hover,
|
||
.es-search-dropdown .filter-attr-chip .chip-remove:hover,
|
||
.es-search-dropdown .filter-feat-chip .chip-remove:hover {
|
||
background: rgba(0, 0, 0, 0.1);
|
||
color: #dc3545;
|
||
}
|
||
body > .es-search-dropdown .dropdown-empty,
|
||
body > .es-search-dropdown .dropdown-loading,
|
||
.es-search-dropdown .dropdown-empty,
|
||
.es-search-dropdown .dropdown-loading {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 2rem;
|
||
text-align: center;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
body > .es-search-dropdown .dropdown-empty i,
|
||
body > .es-search-dropdown .dropdown-loading i,
|
||
.es-search-dropdown .dropdown-empty i,
|
||
.es-search-dropdown .dropdown-loading i {
|
||
font-size: 2rem;
|
||
opacity: 0.5;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
body > .es-search-dropdown .search-history-panel,
|
||
.es-search-dropdown .search-history-panel {
|
||
display: none;
|
||
padding: 0.5rem;
|
||
background: #ffffff;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown .search-history-panel.show,
|
||
.es-search-dropdown .search-history-panel.show {
|
||
display: block;
|
||
}
|
||
body > .es-search-dropdown .history-item,
|
||
.es-search-dropdown .history-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.25rem 0.5rem;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: background 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .history-item:hover,
|
||
.es-search-dropdown .history-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
body > .es-search-dropdown .history-item i,
|
||
.es-search-dropdown .history-item i {
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
body > .es-search-dropdown .history-item span,
|
||
.es-search-dropdown .history-item span {
|
||
flex: 1;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
}
|
||
body > .es-search-dropdown .history-item .btn-remove-history,
|
||
body > .es-search-dropdown .history-item .btn-delete-history,
|
||
.es-search-dropdown .history-item .btn-remove-history,
|
||
.es-search-dropdown .history-item .btn-delete-history {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .history-item .btn-remove-history:focus,
|
||
body > .es-search-dropdown .history-item .btn-delete-history:focus,
|
||
.es-search-dropdown .history-item .btn-remove-history:focus,
|
||
.es-search-dropdown .history-item .btn-delete-history:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .history-item .btn-remove-history,
|
||
body > .es-search-dropdown .history-item .btn-delete-history,
|
||
.es-search-dropdown .history-item .btn-remove-history,
|
||
.es-search-dropdown .history-item .btn-delete-history {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 20px;
|
||
height: 20px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .history-item .btn-remove-history:hover,
|
||
body > .es-search-dropdown .history-item .btn-delete-history:hover,
|
||
.es-search-dropdown .history-item .btn-remove-history:hover,
|
||
.es-search-dropdown .history-item .btn-delete-history:hover {
|
||
background: #e2e8f0;
|
||
color: #dc3545;
|
||
}
|
||
body > .es-search-dropdown .search-history-list,
|
||
.es-search-dropdown .search-history-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown .results-header,
|
||
.es-search-dropdown .results-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.25rem 1rem;
|
||
background: #f1f5f9;
|
||
border-bottom: 1px solid #dee2e6;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
color: #495057;
|
||
}
|
||
body > .es-search-dropdown .results-header .header-spacer,
|
||
.es-search-dropdown .results-header .header-spacer {
|
||
width: 58px;
|
||
flex-shrink: 0;
|
||
}
|
||
body > .es-search-dropdown .results-header .header-col,
|
||
.es-search-dropdown .results-header .header-col {
|
||
flex-shrink: 0;
|
||
width: 70px;
|
||
text-align: right;
|
||
}
|
||
body > .es-search-dropdown .results-header .header-col-name,
|
||
.es-search-dropdown .results-header .header-col-name {
|
||
flex: 1;
|
||
text-align: left;
|
||
}
|
||
body > .es-search-dropdown .dropdown-results,
|
||
.es-search-dropdown .dropdown-results {
|
||
padding: 0;
|
||
background: #ffffff;
|
||
min-height: 200px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-item,
|
||
.es-search-dropdown .dropdown-item {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
background: #ffffff;
|
||
border: none;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0;
|
||
cursor: pointer;
|
||
transition: background 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .dropdown-item:last-child,
|
||
.es-search-dropdown .dropdown-item:last-child {
|
||
border-bottom: none;
|
||
}
|
||
body > .es-search-dropdown .dropdown-item:hover,
|
||
.es-search-dropdown .dropdown-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
body > .es-search-dropdown .dropdown-item.selected,
|
||
.es-search-dropdown .dropdown-item.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
body > .es-search-dropdown .dropdown-item.selected .result-checkbox,
|
||
.es-search-dropdown .dropdown-item.selected .result-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
color: #ffffff;
|
||
}
|
||
body > .es-search-dropdown .dropdown-item.selected .result-checkbox i,
|
||
.es-search-dropdown .dropdown-item.selected .result-checkbox i {
|
||
display: block;
|
||
}
|
||
body > .es-search-dropdown .dropdown-item.disabled,
|
||
.es-search-dropdown .dropdown-item.disabled {
|
||
opacity: 0.5;
|
||
cursor: not-allowed;
|
||
}
|
||
body > .es-search-dropdown .result-checkbox,
|
||
.es-search-dropdown .result-checkbox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 18px;
|
||
height: 18px;
|
||
background: #ffffff;
|
||
border: 2px solid #ced4da;
|
||
border-radius: 3px;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .result-checkbox i,
|
||
.es-search-dropdown .result-checkbox i {
|
||
display: none;
|
||
font-size: 10px;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-results,
|
||
.es-search-dropdown.view-cols-2 .dropdown-results {
|
||
display: grid;
|
||
grid-template-columns: repeat(2, 1fr);
|
||
gap: 0;
|
||
padding: 0;
|
||
border-top: 1px solid #dee2e6;
|
||
border-left: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown.view-cols-3 .dropdown-results,
|
||
.es-search-dropdown.view-cols-3 .dropdown-results {
|
||
display: grid;
|
||
grid-template-columns: repeat(3, 1fr);
|
||
gap: 0;
|
||
padding: 0;
|
||
border-top: 1px solid #dee2e6;
|
||
border-left: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown.view-cols-4 .dropdown-results,
|
||
.es-search-dropdown.view-cols-4 .dropdown-results {
|
||
display: grid;
|
||
grid-template-columns: repeat(4, 1fr);
|
||
gap: 0;
|
||
padding: 0;
|
||
border-top: 1px solid #dee2e6;
|
||
border-left: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown.view-cols-5 .dropdown-results,
|
||
.es-search-dropdown.view-cols-5 .dropdown-results {
|
||
display: grid;
|
||
grid-template-columns: repeat(5, 1fr);
|
||
gap: 0;
|
||
padding: 0;
|
||
border-top: 1px solid #dee2e6;
|
||
border-left: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown.view-cols-6 .dropdown-results,
|
||
.es-search-dropdown.view-cols-6 .dropdown-results {
|
||
display: grid;
|
||
grid-template-columns: repeat(6, 1fr);
|
||
gap: 0;
|
||
padding: 0;
|
||
border-top: 1px solid #dee2e6;
|
||
border-left: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown.view-cols-7 .dropdown-results,
|
||
.es-search-dropdown.view-cols-7 .dropdown-results {
|
||
display: grid;
|
||
grid-template-columns: repeat(7, 1fr);
|
||
gap: 0;
|
||
padding: 0;
|
||
border-top: 1px solid #dee2e6;
|
||
border-left: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown.view-cols-8 .dropdown-results,
|
||
.es-search-dropdown.view-cols-8 .dropdown-results {
|
||
display: grid;
|
||
grid-template-columns: repeat(8, 1fr);
|
||
gap: 0;
|
||
padding: 0;
|
||
border-top: 1px solid #dee2e6;
|
||
border-left: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item, body > .es-search-dropdown.view-cols-3 .dropdown-item, body > .es-search-dropdown.view-cols-4 .dropdown-item, body > .es-search-dropdown.view-cols-5 .dropdown-item, body > .es-search-dropdown.view-cols-6 .dropdown-item, body > .es-search-dropdown.view-cols-7 .dropdown-item, body > .es-search-dropdown.view-cols-8 .dropdown-item,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item {
|
||
flex-direction: column;
|
||
align-items: center;
|
||
text-align: center;
|
||
padding: 0.5rem;
|
||
border: none;
|
||
border-right: 1px solid #dee2e6;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-checkbox, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-checkbox, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-checkbox, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-checkbox, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-checkbox, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-checkbox, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-checkbox,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-checkbox,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-checkbox,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-checkbox,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-checkbox,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-checkbox,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-checkbox,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-checkbox {
|
||
position: absolute;
|
||
top: 0.25rem;
|
||
left: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-3 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-4 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-5 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-6 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-7 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-8 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-icon {
|
||
width: 48px;
|
||
height: 48px;
|
||
margin-bottom: 0.25rem;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-info, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-info, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-info, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-info, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-info, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-info, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-info,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-info,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-info,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-info,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-info,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-info,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-info,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-info {
|
||
width: 100%;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-name {
|
||
font-size: 0.75rem;
|
||
line-height: 1.3;
|
||
display: -webkit-box;
|
||
-webkit-line-clamp: 2;
|
||
-webkit-box-orient: vertical;
|
||
overflow: hidden;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-subtitle, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-subtitle, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-subtitle, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-subtitle, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-subtitle, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-subtitle, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-subtitle,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-subtitle,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-subtitle,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-subtitle,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-subtitle,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-subtitle,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-subtitle,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-subtitle {
|
||
display: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-col, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-col, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-col, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-col, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-col, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-col, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-col,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-col,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-col,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-col,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-col,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-col,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-col,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-col {
|
||
display: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
margin-top: 0.25rem;
|
||
font-size: 0.65rem;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-price, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-price, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-price, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-price, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-price, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-price, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-price,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-price,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-price,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-price,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-price,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-price,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-price,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-price {
|
||
color: #212529;
|
||
font-weight: 600;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-stock, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-stock, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-stock, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-stock, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-stock, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-stock, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-stock,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-stock,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-stock,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-stock,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-stock,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-stock,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-stock,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-stock {
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-stock.stock-out, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-stock.stock-out, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-stock.stock-out, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-stock.stock-out, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-stock.stock-out, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-stock.stock-out, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-stock.stock-out,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-stock.stock-out,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-stock.stock-out,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-stock.stock-out,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-stock.stock-out,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-stock.stock-out,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-stock.stock-out,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-stock.stock-out {
|
||
color: #dc3545;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-stock.stock-low, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-stock.stock-low, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-stock.stock-low, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-stock.stock-low, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-stock.stock-low, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-stock.stock-low, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-stock.stock-low,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-stock.stock-low,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-stock.stock-low,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-stock.stock-low,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-stock.stock-low,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-stock.stock-low,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-stock.stock-low,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-stock.stock-low {
|
||
color: #fab000;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-discount, body > .es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-discount, body > .es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-discount, body > .es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-discount, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-discount, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-discount, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-discount,
|
||
.es-search-dropdown.view-cols-2 .dropdown-item .result-grid-info .grid-discount,
|
||
.es-search-dropdown.view-cols-3 .dropdown-item .result-grid-info .grid-discount,
|
||
.es-search-dropdown.view-cols-4 .dropdown-item .result-grid-info .grid-discount,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-grid-info .grid-discount,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-grid-info .grid-discount,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-grid-info .grid-discount,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-grid-info .grid-discount {
|
||
color: #70b580;
|
||
font-weight: 500;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .results-header, body > .es-search-dropdown.view-cols-3 .results-header, body > .es-search-dropdown.view-cols-4 .results-header, body > .es-search-dropdown.view-cols-5 .results-header, body > .es-search-dropdown.view-cols-6 .results-header, body > .es-search-dropdown.view-cols-7 .results-header, body > .es-search-dropdown.view-cols-8 .results-header,
|
||
.es-search-dropdown.view-cols-2 .results-header,
|
||
.es-search-dropdown.view-cols-3 .results-header,
|
||
.es-search-dropdown.view-cols-4 .results-header,
|
||
.es-search-dropdown.view-cols-5 .results-header,
|
||
.es-search-dropdown.view-cols-6 .results-header,
|
||
.es-search-dropdown.view-cols-7 .results-header,
|
||
.es-search-dropdown.view-cols-8 .results-header {
|
||
display: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-2 .dropdown-results .dropdown-item:nth-child(2n),
|
||
.es-search-dropdown.view-cols-2 .dropdown-results .dropdown-item:nth-child(2n) {
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-3 .dropdown-results .dropdown-item:nth-child(3n),
|
||
.es-search-dropdown.view-cols-3 .dropdown-results .dropdown-item:nth-child(3n) {
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-4 .dropdown-results .dropdown-item:nth-child(4n),
|
||
.es-search-dropdown.view-cols-4 .dropdown-results .dropdown-item:nth-child(4n) {
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-5 .dropdown-results .dropdown-item:nth-child(5n),
|
||
.es-search-dropdown.view-cols-5 .dropdown-results .dropdown-item:nth-child(5n) {
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-6 .dropdown-results .dropdown-item:nth-child(6n),
|
||
.es-search-dropdown.view-cols-6 .dropdown-results .dropdown-item:nth-child(6n) {
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-7 .dropdown-results .dropdown-item:nth-child(7n),
|
||
.es-search-dropdown.view-cols-7 .dropdown-results .dropdown-item:nth-child(7n) {
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-8 .dropdown-results .dropdown-item:nth-child(8n),
|
||
.es-search-dropdown.view-cols-8 .dropdown-results .dropdown-item:nth-child(8n) {
|
||
border-right: none;
|
||
}
|
||
body > .es-search-dropdown.view-cols-5 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-5 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-6 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-7 .dropdown-item .result-icon, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-image,
|
||
body > .es-search-dropdown.view-cols-8 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-icon,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-image,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-icon {
|
||
width: 40px;
|
||
height: 40px;
|
||
}
|
||
body > .es-search-dropdown.view-cols-5 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-6 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-7 .dropdown-item .result-name, body > .es-search-dropdown.view-cols-8 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-5 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-6 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-7 .dropdown-item .result-name,
|
||
.es-search-dropdown.view-cols-8 .dropdown-item .result-name {
|
||
font-size: 0.65rem;
|
||
}
|
||
body > .es-search-dropdown .result-item-product,
|
||
.es-search-dropdown .result-item-product {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
body > .es-search-dropdown .result-item-image,
|
||
body > .es-search-dropdown .result-image,
|
||
.es-search-dropdown .result-item-image,
|
||
.es-search-dropdown .result-image {
|
||
flex-shrink: 0;
|
||
width: 40px;
|
||
height: 40px;
|
||
overflow: hidden;
|
||
border-radius: 0.2rem;
|
||
background: #f1f5f9;
|
||
}
|
||
body > .es-search-dropdown .result-item-image img,
|
||
body > .es-search-dropdown .result-image img,
|
||
.es-search-dropdown .result-item-image img,
|
||
.es-search-dropdown .result-image img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
body > .es-search-dropdown .result-icon,
|
||
.es-search-dropdown .result-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 40px;
|
||
height: 40px;
|
||
background: #f1f5f9;
|
||
border-radius: 0.2rem;
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .result-icon i,
|
||
.es-search-dropdown .result-icon i {
|
||
font-size: 16px;
|
||
}
|
||
body > .es-search-dropdown .result-item-info,
|
||
body > .es-search-dropdown .result-info,
|
||
.es-search-dropdown .result-item-info,
|
||
.es-search-dropdown .result-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
body > .es-search-dropdown .result-item-name,
|
||
body > .es-search-dropdown .result-name,
|
||
.es-search-dropdown .result-item-name,
|
||
.es-search-dropdown .result-name {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .result-item-meta,
|
||
body > .es-search-dropdown .result-subtitle,
|
||
.es-search-dropdown .result-item-meta,
|
||
.es-search-dropdown .result-subtitle {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .subtitle-line,
|
||
.es-search-dropdown .subtitle-line {
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .subtitle-line-primary,
|
||
.es-search-dropdown .subtitle-line-primary {
|
||
color: #495057;
|
||
}
|
||
body > .es-search-dropdown .subtitle-line-secondary,
|
||
.es-search-dropdown .subtitle-line-secondary {
|
||
color: #6c757d;
|
||
font-size: 11px;
|
||
}
|
||
body > .es-search-dropdown .result-col,
|
||
.es-search-dropdown .result-col {
|
||
flex-shrink: 0;
|
||
width: 70px;
|
||
text-align: right;
|
||
font-size: 0.75rem;
|
||
}
|
||
body > .es-search-dropdown .result-col-price,
|
||
.es-search-dropdown .result-col-price {
|
||
color: #495057;
|
||
}
|
||
body > .es-search-dropdown .result-col-sale,
|
||
.es-search-dropdown .result-col-sale {
|
||
color: #dc3545;
|
||
font-weight: 600;
|
||
}
|
||
body > .es-search-dropdown .result-col-stock .col-value.stock-ok,
|
||
.es-search-dropdown .result-col-stock .col-value.stock-ok {
|
||
color: #70b580;
|
||
}
|
||
body > .es-search-dropdown .result-col-stock .col-value.stock-low,
|
||
.es-search-dropdown .result-col-stock .col-value.stock-low {
|
||
color: #fab000;
|
||
}
|
||
body > .es-search-dropdown .result-col-stock .col-value.stock-out,
|
||
.es-search-dropdown .result-col-stock .col-value.stock-out {
|
||
color: #dc3545;
|
||
}
|
||
body > .es-search-dropdown .result-col-sales,
|
||
.es-search-dropdown .result-col-sales {
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .col-value,
|
||
.es-search-dropdown .col-value {
|
||
display: block;
|
||
}
|
||
body > .es-search-dropdown .result-item-checkbox,
|
||
body > .es-search-dropdown .result-checkbox,
|
||
.es-search-dropdown .result-item-checkbox,
|
||
.es-search-dropdown .result-checkbox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 18px;
|
||
height: 18px;
|
||
border: 2px solid #ced4da;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .result-item-checkbox i,
|
||
body > .es-search-dropdown .result-checkbox i,
|
||
.es-search-dropdown .result-item-checkbox i,
|
||
.es-search-dropdown .result-checkbox i {
|
||
display: none;
|
||
font-size: 10px;
|
||
color: #ffffff;
|
||
}
|
||
.dropdown-result-item.selected body > .es-search-dropdown .result-item-checkbox, .dropdown-item.selected body > .es-search-dropdown .result-item-checkbox,
|
||
.dropdown-result-item.selected body > .es-search-dropdown .result-checkbox,
|
||
.dropdown-item.selected body > .es-search-dropdown .result-checkbox,
|
||
.dropdown-result-item.selected .es-search-dropdown .result-item-checkbox,
|
||
.dropdown-item.selected .es-search-dropdown .result-item-checkbox,
|
||
.dropdown-result-item.selected .es-search-dropdown .result-checkbox,
|
||
.dropdown-item.selected .es-search-dropdown .result-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.dropdown-result-item.selected body > .es-search-dropdown .result-item-checkbox i, .dropdown-item.selected body > .es-search-dropdown .result-item-checkbox i,
|
||
.dropdown-result-item.selected body > .es-search-dropdown .result-checkbox i,
|
||
.dropdown-item.selected body > .es-search-dropdown .result-checkbox i,
|
||
.dropdown-result-item.selected .es-search-dropdown .result-item-checkbox i,
|
||
.dropdown-item.selected .es-search-dropdown .result-item-checkbox i,
|
||
.dropdown-result-item.selected .es-search-dropdown .result-checkbox i,
|
||
.dropdown-item.selected .es-search-dropdown .result-checkbox i {
|
||
display: block;
|
||
}
|
||
body > .es-search-dropdown .no-results,
|
||
.es-search-dropdown .no-results {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
body > .es-search-dropdown .no-results i,
|
||
.es-search-dropdown .no-results i {
|
||
font-size: 1.25rem;
|
||
opacity: 0.5;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls,
|
||
.es-search-dropdown .load-more-controls {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .load-more-label,
|
||
body > .es-search-dropdown .load-more-controls .load-more-of,
|
||
.es-search-dropdown .load-more-controls .load-more-label,
|
||
.es-search-dropdown .load-more-controls .load-more-of {
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .remaining-count,
|
||
.es-search-dropdown .load-more-controls .remaining-count {
|
||
font-weight: 600;
|
||
color: #495057;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .load-more-select,
|
||
.es-search-dropdown .load-more-controls .load-more-select {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .load-more-select:focus,
|
||
.es-search-dropdown .load-more-controls .load-more-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .load-more-select::placeholder,
|
||
.es-search-dropdown .load-more-controls .load-more-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .load-more-select,
|
||
.es-search-dropdown .load-more-controls .load-more-select {
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
min-width: 60px;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .btn-load-more,
|
||
.es-search-dropdown .load-more-controls .btn-load-more {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 0.25rem;
|
||
margin: 0;
|
||
border: none;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1) !important;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
font: inherit;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .btn-load-more i,
|
||
.es-search-dropdown .load-more-controls .btn-load-more i {
|
||
font-size: 14px;
|
||
}
|
||
body > .es-search-dropdown .load-more-controls .btn-load-more:hover,
|
||
.es-search-dropdown .load-more-controls .btn-load-more:hover {
|
||
background: rgba(37, 185, 215, 0.2) !important;
|
||
}
|
||
body > .es-search-dropdown .dropdown-load-more,
|
||
.es-search-dropdown .dropdown-load-more {
|
||
display: flex;
|
||
justify-content: center;
|
||
padding: 1rem;
|
||
border-top: 1px solid #dee2e6;
|
||
}
|
||
body > .es-search-dropdown .dropdown-load-more .load-more-btn,
|
||
.es-search-dropdown .dropdown-load-more .load-more-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
body > .es-search-dropdown .dropdown-load-more .load-more-btn:focus,
|
||
.es-search-dropdown .dropdown-load-more .load-more-btn:focus {
|
||
outline: none;
|
||
}
|
||
body > .es-search-dropdown .dropdown-load-more .load-more-btn,
|
||
.es-search-dropdown .dropdown-load-more .load-more-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-radius: 0.25rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .dropdown-load-more .load-more-btn:hover,
|
||
.es-search-dropdown .dropdown-load-more .load-more-btn:hover {
|
||
background: rgba(37, 185, 215, 0.2);
|
||
}
|
||
body > .es-search-dropdown .dropdown-load-more .load-more-btn.loading,
|
||
.es-search-dropdown .dropdown-load-more .load-more-btn.loading {
|
||
opacity: 0.7;
|
||
cursor: wait;
|
||
}
|
||
body > .es-search-dropdown .dropdown-body,
|
||
.es-search-dropdown .dropdown-body {
|
||
max-height: 400px;
|
||
overflow-y: auto;
|
||
}
|
||
body > .es-search-dropdown .dropdown-body::-webkit-scrollbar,
|
||
.es-search-dropdown .dropdown-body::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-body::-webkit-scrollbar-track,
|
||
.es-search-dropdown .dropdown-body::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-body::-webkit-scrollbar-thumb,
|
||
.es-search-dropdown .dropdown-body::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
body > .es-search-dropdown .dropdown-body::-webkit-scrollbar-thumb:hover,
|
||
.es-search-dropdown .dropdown-body::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
body > .es-search-dropdown .tree-container,
|
||
.es-search-dropdown .tree-container {
|
||
padding: 0.5rem;
|
||
}
|
||
body > .es-search-dropdown .tree-loading,
|
||
.es-search-dropdown .tree-loading {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
body > .es-search-dropdown .tree-loading i,
|
||
.es-search-dropdown .tree-loading i {
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
body > .es-search-dropdown .tree-item,
|
||
.es-search-dropdown .tree-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem 0.5rem;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
body > .es-search-dropdown .tree-item:hover,
|
||
.es-search-dropdown .tree-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
body > .es-search-dropdown .tree-item.selected,
|
||
.es-search-dropdown .tree-item.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
body > .es-search-dropdown .tree-item.selected .tree-checkbox,
|
||
.es-search-dropdown .tree-item.selected .tree-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
body > .es-search-dropdown .tree-item.selected .tree-checkbox i,
|
||
.es-search-dropdown .tree-item.selected .tree-checkbox i {
|
||
display: block;
|
||
}
|
||
body > .es-search-dropdown .tree-info,
|
||
.es-search-dropdown .tree-info {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
body > .es-search-dropdown .tree-name,
|
||
.es-search-dropdown .tree-name {
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
body > .es-search-dropdown .tree-subtitle,
|
||
.es-search-dropdown .tree-subtitle {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
|
||
.es-search-dropdown .dropdown-results {
|
||
max-height: 400px;
|
||
overflow-y: auto;
|
||
padding: 0;
|
||
}
|
||
.es-search-dropdown .dropdown-results::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.es-search-dropdown .dropdown-results::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.es-search-dropdown .dropdown-results::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.es-search-dropdown .dropdown-results::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
.es-search-dropdown .results-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.25rem 1rem;
|
||
background: #f1f5f9;
|
||
border-bottom: 1px solid #dee2e6;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
color: #495057;
|
||
}
|
||
.es-search-dropdown .results-header .header-spacer {
|
||
width: 58px;
|
||
flex-shrink: 0;
|
||
}
|
||
.es-search-dropdown .results-header .header-col {
|
||
flex-shrink: 0;
|
||
width: 70px;
|
||
text-align: right;
|
||
}
|
||
.es-search-dropdown .results-header .header-col-name {
|
||
flex: 1;
|
||
text-align: left;
|
||
}
|
||
.es-search-dropdown:not(.view-list) .results-header, .es-search-dropdown.view-tree .results-header {
|
||
display: none;
|
||
}
|
||
.es-search-dropdown .result-item-product {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.es-search-dropdown .result-col {
|
||
flex-shrink: 0;
|
||
width: 70px;
|
||
text-align: right;
|
||
font-size: 0.75rem;
|
||
}
|
||
.es-search-dropdown .result-col-price {
|
||
color: #495057;
|
||
}
|
||
.es-search-dropdown .result-col-sale {
|
||
color: #dc3545;
|
||
font-weight: 600;
|
||
}
|
||
.es-search-dropdown .result-col-stock .col-value.stock-ok {
|
||
color: #70b580;
|
||
}
|
||
.es-search-dropdown .result-col-stock .col-value.stock-low {
|
||
color: #fab000;
|
||
}
|
||
.es-search-dropdown .result-col-stock .col-value.stock-out {
|
||
color: #dc3545;
|
||
}
|
||
.es-search-dropdown .result-col-sales {
|
||
color: #6c757d;
|
||
}
|
||
.es-search-dropdown .dropdown-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
border: none;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.es-search-dropdown .dropdown-item:last-child {
|
||
border-bottom: none;
|
||
}
|
||
.es-search-dropdown .dropdown-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.es-search-dropdown .dropdown-item.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.es-search-dropdown .result-checkbox {
|
||
flex-shrink: 0;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 18px;
|
||
height: 18px;
|
||
border: 2px solid #ced4da;
|
||
border-radius: 3px;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.es-search-dropdown .result-checkbox i {
|
||
font-size: 10px;
|
||
color: transparent;
|
||
}
|
||
.dropdown-item.selected .es-search-dropdown .result-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.dropdown-item.selected .es-search-dropdown .result-checkbox i {
|
||
color: #ffffff;
|
||
}
|
||
.es-search-dropdown .result-image {
|
||
flex-shrink: 0;
|
||
width: 40px;
|
||
height: 40px;
|
||
overflow: hidden;
|
||
border-radius: 0.2rem;
|
||
background: #f1f5f9;
|
||
}
|
||
.es-search-dropdown .result-image img {
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
}
|
||
.es-search-dropdown .result-icon {
|
||
flex-shrink: 0;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 40px;
|
||
height: 40px;
|
||
background: #f1f5f9;
|
||
border-radius: 0.2rem;
|
||
}
|
||
.es-search-dropdown .result-icon i {
|
||
font-size: 16px;
|
||
color: #6c757d;
|
||
}
|
||
.es-search-dropdown .result-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.es-search-dropdown .result-name {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.es-search-dropdown .result-subtitle {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.es-search-dropdown .subtitle-line {
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.es-search-dropdown .subtitle-line-primary {
|
||
color: #495057;
|
||
}
|
||
.es-search-dropdown .subtitle-line-secondary {
|
||
color: #6c757d;
|
||
font-size: 11px;
|
||
}
|
||
.es-search-dropdown[class*=view-cols-] .result-col, .es-search-dropdown.view-tree .result-col {
|
||
display: none;
|
||
}
|
||
.es-search-dropdown .entity-search-box {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
background: #ffffff;
|
||
border: none;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0;
|
||
}
|
||
.es-search-dropdown .entity-search-box .entity-search-icon {
|
||
color: #6c757d;
|
||
flex-shrink: 0;
|
||
margin-left: 0.25rem;
|
||
}
|
||
.es-search-dropdown .entity-search-box input.entity-search-input,
|
||
.es-search-dropdown .entity-search-box input.entity-search-input[type=text] {
|
||
flex: 1;
|
||
min-width: 0;
|
||
width: auto !important;
|
||
max-width: none !important;
|
||
height: auto;
|
||
padding: 0;
|
||
margin: 0;
|
||
border: none !important;
|
||
outline: none;
|
||
background: transparent !important;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
box-shadow: none !important;
|
||
}
|
||
.es-search-dropdown .entity-search-box input.entity-search-input::placeholder,
|
||
.es-search-dropdown .entity-search-box input.entity-search-input[type=text]::placeholder {
|
||
color: #6c757d;
|
||
}
|
||
.es-search-dropdown .entity-search-box input.entity-search-input:focus,
|
||
.es-search-dropdown .entity-search-box input.entity-search-input[type=text]:focus {
|
||
border: none !important;
|
||
box-shadow: none !important;
|
||
outline: none;
|
||
}
|
||
.es-search-dropdown .entity-search-box .search-loading {
|
||
color: #6c757d;
|
||
}
|
||
|
||
body > .es-search-dropdown .dropdown-item {
|
||
border: none;
|
||
border-radius: 0;
|
||
}
|
||
body > .es-search-dropdown .dropdown-item:not(:last-child) {
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
|
||
@keyframes spin {
|
||
from {
|
||
transform: rotate(0deg);
|
||
}
|
||
to {
|
||
transform: rotate(360deg);
|
||
}
|
||
}
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Chips Component
|
||
* Entity chips, selection pills, tags
|
||
*/
|
||
.entity-selector-trait .chips-wrapper {
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-top: 0.5rem;
|
||
background: #f8fafc;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
overflow: hidden;
|
||
}
|
||
.entity-selector-trait .chips-toolbar {
|
||
display: none;
|
||
align-items: center;
|
||
flex-wrap: nowrap;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
padding-bottom: 0;
|
||
background: transparent;
|
||
}
|
||
.entity-selector-trait .chips-toolbar.has-chips {
|
||
display: flex;
|
||
}
|
||
.entity-selector-trait .chips-toolbar input[type=text].chips-search-input {
|
||
all: unset;
|
||
display: block;
|
||
flex: 1 1 auto;
|
||
min-width: 80px;
|
||
width: auto;
|
||
height: auto;
|
||
padding: 0.2rem 0.5rem 0.2rem 1.5rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") no-repeat 0.375rem center;
|
||
background-size: 10px;
|
||
border: 1px solid #cbd5e1;
|
||
border-radius: 0.2rem;
|
||
font-size: 11px;
|
||
line-height: 1.4;
|
||
color: #212529;
|
||
box-sizing: border-box;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .chips-toolbar input[type=text].chips-search-input::placeholder {
|
||
color: #6c757d;
|
||
font-size: 11px;
|
||
}
|
||
.entity-selector-trait .chips-toolbar input[type=text].chips-search-input:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .chips-toolbar select.chips-sort-select {
|
||
all: unset;
|
||
flex: 0 0 auto;
|
||
padding: 0.2rem 1.25rem 0.2rem 0.5rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.375rem center;
|
||
background-size: 8px;
|
||
font-size: 10px;
|
||
line-height: 1.4;
|
||
color: #495057;
|
||
cursor: pointer;
|
||
box-sizing: border-box;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .chips-toolbar select.chips-sort-select:hover {
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .chips-toolbar select.chips-sort-select:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .chips-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
flex-shrink: 0;
|
||
gap: 0.125rem;
|
||
padding: 0.2rem 0.5rem;
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
font-size: 10px;
|
||
font-weight: 600;
|
||
border-radius: 0.2rem;
|
||
white-space: nowrap;
|
||
line-height: 1.4;
|
||
}
|
||
.entity-selector-trait .chips-count.has-filter {
|
||
background: #cffafe;
|
||
color: #0e7490;
|
||
}
|
||
.entity-selector-trait .chips-count .count-filtered {
|
||
font-weight: 700;
|
||
}
|
||
.entity-selector-trait .chips-count .count-separator {
|
||
opacity: 0.6;
|
||
margin: 0 0.125rem;
|
||
}
|
||
.entity-selector-trait .chips-actions {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
margin-left: auto;
|
||
}
|
||
.entity-selector-trait .btn-chips-clear {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-chips-clear:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-chips-clear {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
flex-shrink: 0;
|
||
gap: 0.25rem;
|
||
padding: 0.2rem 0.5rem;
|
||
color: #dc3545;
|
||
font-size: 10px;
|
||
font-weight: 500;
|
||
background: rgba(220, 53, 69, 0.1);
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
white-space: nowrap;
|
||
line-height: 1.4;
|
||
}
|
||
.entity-selector-trait .btn-chips-clear:hover {
|
||
background: #dc3545;
|
||
color: #ffffff;
|
||
}
|
||
.entity-selector-trait .btn-chips-clear i {
|
||
font-size: 9px;
|
||
flex-shrink: 0;
|
||
}
|
||
@media (max-width: 480px) {
|
||
.entity-selector-trait .btn-chips-clear .clear-text {
|
||
display: none;
|
||
}
|
||
}
|
||
.entity-selector-trait .entity-chips {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
padding: 0.5rem 1rem 1rem;
|
||
min-height: 40px;
|
||
max-height: 300px;
|
||
overflow-y: auto;
|
||
}
|
||
.entity-selector-trait .entity-chips:empty {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .chips-load-more {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
background: transparent;
|
||
border-top: 1px dashed #dee2e6;
|
||
}
|
||
.entity-selector-trait .chips-load-more .load-more-label {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .chips-load-more .load-more-select,
|
||
.entity-selector-trait .chips-load-more select.load-more-select {
|
||
appearance: none;
|
||
padding: 0.25rem 1.75rem 0.25rem 0.5rem !important;
|
||
border: 1px solid #dee2e6 !important;
|
||
border-radius: 0.2rem !important;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.5rem center !important;
|
||
background-size: 8px !important;
|
||
font-size: 0.75rem !important;
|
||
font-weight: 500;
|
||
color: #25b9d7;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
height: auto !important;
|
||
min-height: 0 !important;
|
||
line-height: 1.3 !important;
|
||
}
|
||
.entity-selector-trait .chips-load-more .load-more-select:hover,
|
||
.entity-selector-trait .chips-load-more select.load-more-select:hover {
|
||
border-color: #25b9d7 !important;
|
||
background-color: rgba(37, 185, 215, 0.1) !important;
|
||
}
|
||
.entity-selector-trait .chips-load-more .load-more-select:focus,
|
||
.entity-selector-trait .chips-load-more select.load-more-select:focus {
|
||
outline: none !important;
|
||
border-color: #25b9d7 !important;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1) !important;
|
||
}
|
||
.entity-selector-trait .chips-load-more .load-more-remaining {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .entity-chip {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #f1f5f9;
|
||
color: #495057;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 50rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .entity-chip:hover {
|
||
background: #e2e8f0;
|
||
}
|
||
.entity-selector-trait .entity-chip.has-image {
|
||
padding-left: 0.25rem;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-filtered-out, .entity-selector-trait .entity-chip.chip-paginated-out {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .chip-image {
|
||
width: 20px;
|
||
height: 20px;
|
||
object-fit: cover;
|
||
border-radius: 50%;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .chip-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 12px;
|
||
color: #6c757d;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .chip-icon img {
|
||
width: 20px;
|
||
height: 20px;
|
||
object-fit: cover;
|
||
border-radius: 0.2rem;
|
||
}
|
||
.entity-selector-trait .chip-flag {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .chip-flag img {
|
||
width: 18px;
|
||
height: 12px;
|
||
object-fit: cover;
|
||
border-radius: 2px;
|
||
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
|
||
}
|
||
.entity-selector-trait .chip-flag .flag-fallback {
|
||
width: 18px;
|
||
height: 12px;
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background: linear-gradient(135deg, #e8eaed 0%, #dadce0 100%);
|
||
border-radius: 2px;
|
||
font-size: 10px;
|
||
color: #5f6368;
|
||
}
|
||
.entity-selector-trait .chip-preview-holidays {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .chip-preview-holidays:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .chip-preview-holidays {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 18px;
|
||
height: 18px;
|
||
color: #25b9d7;
|
||
border-radius: 50%;
|
||
flex-shrink: 0;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .chip-preview-holidays:hover {
|
||
background: rgba(37, 185, 215, 0.15);
|
||
color: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
}
|
||
.entity-selector-trait .chip-preview-holidays i.material-icons {
|
||
font-size: 14px;
|
||
}
|
||
.entity-selector-trait .chip-text,
|
||
.entity-selector-trait .chip-name {
|
||
word-break: break-word;
|
||
}
|
||
.entity-selector-trait .chip-remove {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .chip-remove:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .chip-remove {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-left: 0.125rem;
|
||
color: #6c757d;
|
||
border-radius: 50%;
|
||
flex-shrink: 0;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .chip-remove:hover {
|
||
background: rgba(0, 0, 0, 0.1);
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .chip-remove i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-primary {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-primary:hover {
|
||
background: rgba(37, 185, 215, 0.2);
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-success {
|
||
background: #d4edda;
|
||
color: #1e7e34;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-success:hover {
|
||
background: rgba(112, 181, 128, 0.2);
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-danger {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-danger:hover {
|
||
background: rgba(220, 53, 69, 0.2);
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-warning {
|
||
background: #fff3cd;
|
||
color: rgb(148, 104.192, 0);
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-warning:hover {
|
||
background: rgba(250, 176, 0, 0.3);
|
||
}
|
||
.entity-selector-trait .entity-chip.loading,
|
||
.entity-selector-trait .entity-chip-loading {
|
||
opacity: 0.7;
|
||
}
|
||
.entity-selector-trait .entity-chip.loading .chip-remove,
|
||
.entity-selector-trait .entity-chip-loading .chip-remove {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .entity-chip.loading .chip-icon i,
|
||
.entity-selector-trait .entity-chip-loading .chip-icon i {
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-hidden {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .entity-chips.chips-collapsed,
|
||
.entity-selector-trait .entity-chips.chips-expanded {
|
||
position: relative;
|
||
}
|
||
.entity-selector-trait .chips-show-more-toggle {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
color: #25b9d7;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
cursor: pointer;
|
||
transition: color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .chips-show-more-toggle:hover {
|
||
color: #1a9ab7;
|
||
}
|
||
.entity-selector-trait .chips-show-more-toggle i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .chips-more {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .chips-more:hover {
|
||
background: #cbd5e1;
|
||
}
|
||
.entity-selector-trait .chip-add-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .chip-add-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .chip-add-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: transparent;
|
||
color: #25b9d7;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border: 1px dashed #25b9d7;
|
||
border-radius: 50rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .chip-add-btn:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .chip-add-btn i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .entity-chips.inline {
|
||
display: inline-flex;
|
||
padding: 0;
|
||
min-height: auto;
|
||
}
|
||
.entity-selector-trait .entity-chips.inline .entity-chip {
|
||
padding: 0.125rem 0.375rem;
|
||
font-size: 11px;
|
||
}
|
||
.entity-selector-trait .selected-chips-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .selected-chips-label {
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-pattern {
|
||
background: #fef3c7;
|
||
color: #92400e;
|
||
font-family: monospace;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-pattern:hover {
|
||
background: #fde68a;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-pattern .chip-icon {
|
||
color: #d97706;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-range,
|
||
.entity-selector-trait .range-chip {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #ecfeff;
|
||
color: #0891b2;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 50rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .entity-chip.chip-range:hover,
|
||
.entity-selector-trait .range-chip:hover {
|
||
background: #cffafe;
|
||
}
|
||
.entity-selector-trait .range-chip-text {
|
||
font-family: monospace;
|
||
}
|
||
.entity-selector-trait .btn-remove-range {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-remove-range:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-remove-range {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 16px;
|
||
height: 16px;
|
||
color: #0891b2;
|
||
border-radius: 50%;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-remove-range:hover {
|
||
background: rgba(0, 0, 0, 0.1);
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .btn-remove-range i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .multi-range-chips {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
margin-bottom: 0.25rem;
|
||
}
|
||
.entity-selector-trait .multi-range-chips:empty {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .pattern-chips {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
padding: 0.5rem 0;
|
||
min-height: 32px;
|
||
}
|
||
.entity-selector-trait .pattern-chips:empty::before {
|
||
content: attr(data-placeholder);
|
||
color: #6c757d;
|
||
font-size: 0.75rem;
|
||
font-style: italic;
|
||
}
|
||
.entity-selector-trait .pattern-tag {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #fef3c7;
|
||
color: #92400e;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .pattern-tag:hover {
|
||
background: #fde68a;
|
||
}
|
||
.entity-selector-trait .pattern-tag.case-sensitive .case-icon {
|
||
color: #70b580;
|
||
font-weight: 700;
|
||
}
|
||
.entity-selector-trait .pattern-tag.draft-tag {
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
padding: 0;
|
||
flex: 1;
|
||
min-width: 150px;
|
||
}
|
||
.entity-selector-trait .pattern-tag.draft-tag:hover {
|
||
background: #ffffff;
|
||
}
|
||
.entity-selector-trait .pattern-tag.draft-tag .pattern-input {
|
||
flex: 1;
|
||
min-width: 100px;
|
||
padding: 0.375rem;
|
||
border: 0;
|
||
background: transparent;
|
||
font-size: 0.875rem;
|
||
font-family: inherit;
|
||
}
|
||
.entity-selector-trait .pattern-tag.draft-tag .pattern-input:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .pattern-tag.draft-tag .pattern-input::placeholder {
|
||
color: #6c757d;
|
||
font-style: italic;
|
||
}
|
||
.entity-selector-trait .pattern-tag-text {
|
||
font-family: monospace;
|
||
max-width: 200px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .btn-toggle-case {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-toggle-case:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-toggle-case {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-toggle-case:hover {
|
||
background: rgba(0, 0, 0, 0.1);
|
||
}
|
||
.entity-selector-trait .case-icon {
|
||
font-size: 11px;
|
||
font-weight: 600;
|
||
font-family: monospace;
|
||
}
|
||
.entity-selector-trait .btn-remove-pattern {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-remove-pattern:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-remove-pattern {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 18px;
|
||
height: 18px;
|
||
color: #d97706;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-remove-pattern:hover {
|
||
background: rgba(0, 0, 0, 0.1);
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .btn-remove-pattern i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .btn-add-pattern {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-add-pattern:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-add-pattern {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #25b9d7;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-add-pattern:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .btn-add-pattern i {
|
||
font-size: 12px;
|
||
}
|
||
.entity-selector-trait .pattern-match-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0 0.375rem;
|
||
color: #6c757d;
|
||
font-size: 0.75rem;
|
||
cursor: pointer;
|
||
}
|
||
.entity-selector-trait .pattern-match-count.count-zero {
|
||
color: #fab000;
|
||
}
|
||
.entity-selector-trait .pattern-match-count.count-found {
|
||
color: #70b580;
|
||
}
|
||
.entity-selector-trait .pattern-match-count .count-value {
|
||
font-weight: 600;
|
||
}
|
||
.entity-selector-trait .pattern-input-row {
|
||
display: flex;
|
||
align-items: stretch;
|
||
gap: 0.25rem;
|
||
}
|
||
|
||
.holiday-preview-popover {
|
||
position: absolute;
|
||
z-index: 10001;
|
||
width: 320px;
|
||
max-width: 90vw;
|
||
background: #ffffff;
|
||
border-radius: 0.3rem;
|
||
box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.2);
|
||
overflow: hidden;
|
||
}
|
||
.holiday-preview-popover .popover-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.holiday-preview-popover .popover-title {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
}
|
||
.holiday-preview-popover .popover-flag {
|
||
border-radius: 2px;
|
||
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
|
||
}
|
||
.holiday-preview-popover .popover-close {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.holiday-preview-popover .popover-close:focus {
|
||
outline: none;
|
||
}
|
||
.holiday-preview-popover .popover-close {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #6c757d;
|
||
border-radius: 0.25rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.holiday-preview-popover .popover-close:hover {
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
}
|
||
.holiday-preview-popover .popover-close i.material-icons {
|
||
font-size: 18px;
|
||
}
|
||
.holiday-preview-popover .popover-body {
|
||
max-height: 350px;
|
||
overflow-y: auto;
|
||
padding: 0.5rem;
|
||
}
|
||
.holiday-preview-popover .popover-body::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.holiday-preview-popover .popover-body::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.holiday-preview-popover .popover-body::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.holiday-preview-popover .popover-body::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
.holiday-preview-popover .holiday-preview-loading {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem 0;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
.holiday-preview-popover .holiday-preview-loading i.material-icons {
|
||
font-size: 20px;
|
||
}
|
||
.holiday-preview-popover .holiday-preview-loading .icon-spin {
|
||
animation: spin 1s linear infinite;
|
||
}
|
||
.holiday-preview-popover .holiday-preview-empty {
|
||
text-align: center;
|
||
padding: 2rem 0;
|
||
color: #6c757d;
|
||
}
|
||
.holiday-preview-popover .holiday-preview-empty i.material-icons {
|
||
font-size: 48px;
|
||
opacity: 0.4;
|
||
margin-bottom: 0.5rem;
|
||
display: block;
|
||
}
|
||
.holiday-preview-popover .holiday-preview-empty p {
|
||
margin: 0;
|
||
font-size: 0.875rem;
|
||
}
|
||
.holiday-preview-popover .holiday-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.25rem;
|
||
}
|
||
.holiday-preview-popover .holiday-item {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 1rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8fafc;
|
||
border-radius: 0.25rem;
|
||
border-left: 3px solid #70b580;
|
||
}
|
||
.holiday-preview-popover .holiday-item.holiday-type-bank, .holiday-preview-popover .holiday-item.holiday-type-bank-holiday {
|
||
border-left-color: #17a2b8;
|
||
}
|
||
.holiday-preview-popover .holiday-item.holiday-type-observance {
|
||
border-left-color: #fab000;
|
||
}
|
||
.holiday-preview-popover .holiday-item.holiday-type-regional, .holiday-preview-popover .holiday-item.holiday-type-local-holiday {
|
||
border-left-color: #8b5cf6;
|
||
}
|
||
.holiday-preview-popover .holiday-date {
|
||
flex-shrink: 0;
|
||
min-width: 80px;
|
||
}
|
||
.holiday-preview-popover .holiday-date .holiday-day {
|
||
display: block;
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
}
|
||
.holiday-preview-popover .holiday-date .holiday-weekday {
|
||
display: block;
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.holiday-preview-popover .holiday-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.holiday-preview-popover .holiday-country-flag {
|
||
vertical-align: middle;
|
||
margin-right: 0.25rem;
|
||
border-radius: 2px;
|
||
box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
|
||
}
|
||
.holiday-preview-popover .holiday-name {
|
||
display: inline;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
word-wrap: break-word;
|
||
}
|
||
.holiday-preview-popover .holiday-type-badge {
|
||
display: inline-block;
|
||
margin-left: 0.5rem;
|
||
padding: 0.125rem 0.375rem;
|
||
font-size: 10px;
|
||
font-weight: 500;
|
||
text-transform: capitalize;
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
border-radius: 0.2rem;
|
||
vertical-align: middle;
|
||
}
|
||
.holiday-preview-popover .holiday-preview-note {
|
||
margin-top: 1rem;
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
text-align: center;
|
||
}
|
||
.holiday-preview-popover .popover-filter {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 1rem;
|
||
border-bottom: 1px solid #dee2e6;
|
||
background: #f8fafc;
|
||
}
|
||
.holiday-preview-popover .popover-filter i.material-icons {
|
||
font-size: 18px;
|
||
color: #6c757d;
|
||
}
|
||
.holiday-preview-popover .popover-filter .holiday-filter-input {
|
||
flex: 1;
|
||
border: none;
|
||
background: transparent;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
outline: none;
|
||
padding: 0.25rem 0;
|
||
}
|
||
.holiday-preview-popover .popover-filter .holiday-filter-input::placeholder {
|
||
color: #6c757d;
|
||
}
|
||
|
||
@keyframes spin {
|
||
from {
|
||
transform: rotate(0deg);
|
||
}
|
||
to {
|
||
transform: rotate(360deg);
|
||
}
|
||
}
|
||
#content.bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input,
|
||
#content .bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input,
|
||
.bootstrap #content .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input {
|
||
all: unset;
|
||
display: block;
|
||
flex: 1 1 auto;
|
||
min-width: 80px;
|
||
width: auto;
|
||
height: auto;
|
||
padding: 0.2rem 0.5rem 0.2rem 1.5rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") no-repeat 0.375rem center;
|
||
background-size: 10px;
|
||
border: 1px solid #cbd5e1;
|
||
border-radius: 0.2rem;
|
||
font-size: 11px;
|
||
line-height: 1.4;
|
||
color: #212529;
|
||
box-sizing: border-box;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
#content.bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input::placeholder,
|
||
#content .bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input::placeholder,
|
||
.bootstrap #content .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input::placeholder {
|
||
color: #6c757d;
|
||
font-size: 11px;
|
||
}
|
||
#content.bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input:focus,
|
||
#content .bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input:focus,
|
||
.bootstrap #content .entity-selector-trait .chips-wrapper .chips-toolbar input[type=text].chips-search-input.chips-search-input:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
#content.bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select,
|
||
#content .bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select,
|
||
.bootstrap #content .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select {
|
||
all: unset;
|
||
flex: 0 0 auto;
|
||
padding: 0.2rem 1.25rem 0.2rem 0.5rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.375rem center;
|
||
background-size: 8px;
|
||
font-size: 10px;
|
||
line-height: 1.4;
|
||
color: #495057;
|
||
cursor: pointer;
|
||
box-sizing: border-box;
|
||
white-space: nowrap;
|
||
height: auto;
|
||
}
|
||
#content.bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select:hover,
|
||
#content .bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select:hover,
|
||
.bootstrap #content .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select:hover {
|
||
border-color: #25b9d7;
|
||
}
|
||
#content.bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select:focus,
|
||
#content .bootstrap .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select:focus,
|
||
.bootstrap #content .entity-selector-trait .chips-wrapper .chips-toolbar select.chips-sort-select.chips-sort-select:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Groups Component
|
||
* Selection groups, include/exclude sections, method selectors
|
||
*/
|
||
.entity-selector-trait .es-group {
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
overflow: hidden;
|
||
}
|
||
.entity-selector-trait .es-group-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .es-group-title {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
}
|
||
.entity-selector-trait .es-group-title .group-number {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.25rem;
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 700;
|
||
border-radius: 50rem;
|
||
}
|
||
.entity-selector-trait .es-group-actions {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .group-action-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .group-action-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .group-action-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .group-action-btn:hover {
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .group-action-btn.danger:hover {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .es-group-body,
|
||
.entity-selector-trait .group-body {
|
||
padding: 1rem;
|
||
}
|
||
.entity-selector-trait .include-section {
|
||
margin-bottom: 1rem;
|
||
}
|
||
.entity-selector-trait .section-label {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
margin-bottom: 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.05em;
|
||
}
|
||
.entity-selector-trait .section-label.label-include {
|
||
color: #1e7e34;
|
||
}
|
||
.entity-selector-trait .section-label.label-include i {
|
||
color: #70b580;
|
||
}
|
||
.entity-selector-trait .section-label.label-exclude {
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .section-label.label-exclude i {
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .method-selector {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.entity-selector-trait .method-selector-wrapper {
|
||
flex: 1;
|
||
position: relative;
|
||
}
|
||
.entity-selector-trait .method-select {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .method-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .method-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .method-select {
|
||
padding-right: 2rem;
|
||
cursor: pointer;
|
||
appearance: none;
|
||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");
|
||
background-position: right 0.5rem center;
|
||
background-repeat: no-repeat;
|
||
background-size: 1.5em 1.5em;
|
||
}
|
||
.entity-selector-trait .method-help-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .method-help-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .method-help-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #6c757d;
|
||
border-radius: 50rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .method-help-btn:hover {
|
||
background: #f1f5f9;
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .value-picker {
|
||
position: relative;
|
||
}
|
||
.entity-selector-trait .value-picker-trigger {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .value-picker-trigger:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .value-picker-trigger {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
text-align: left;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .value-picker-trigger:hover {
|
||
border-color: #cbd5e1;
|
||
}
|
||
.entity-selector-trait .value-picker-trigger:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .value-picker-trigger i {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .pattern-input-wrapper {
|
||
position: relative;
|
||
}
|
||
.entity-selector-trait .pattern-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .pattern-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .pattern-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .pattern-input {
|
||
font-family: monospace;
|
||
}
|
||
.entity-selector-trait .pattern-add-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .pattern-add-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .pattern-add-btn {
|
||
position: absolute;
|
||
right: 0.25rem;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #25b9d7;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .pattern-add-btn:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .multi-range-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .range-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .range-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .range-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .range-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .range-input {
|
||
width: 100px;
|
||
text-align: center;
|
||
}
|
||
.entity-selector-trait .range-separator {
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .range-remove-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .range-remove-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .range-remove-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .range-remove-btn:hover {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .range-add-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .range-add-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .range-add-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
color: #25b9d7;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .range-add-btn:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .multi-select-tiles {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .multi-select-tile {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .multi-select-tile:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .multi-select-tile {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem 0.75rem;
|
||
background: #f1f5f9;
|
||
color: #495057;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border: 1px solid transparent;
|
||
border-radius: 50rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .multi-select-tile:hover {
|
||
background: #e2e8f0;
|
||
}
|
||
.entity-selector-trait .multi-select-tile.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
color: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .exclude-section {
|
||
margin-top: 1rem;
|
||
padding-top: 1rem;
|
||
border-top: 1px dashed #dee2e6;
|
||
}
|
||
.entity-selector-trait .exclude-rows {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .exclude-row-content {
|
||
flex: 1;
|
||
}
|
||
.entity-selector-trait .exclude-remove-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .exclude-remove-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .exclude-remove-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
flex-shrink: 0;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .exclude-remove-btn:hover {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .add-exclude-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .add-exclude-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .add-exclude-btn {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
margin-top: 0.5rem;
|
||
padding: 0.25rem 0.5rem;
|
||
color: #dc3545;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border: 1px dashed #dc3545;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .add-exclude-btn:hover {
|
||
background: #f8d7da;
|
||
}
|
||
.entity-selector-trait .btn-add-group {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-add-group:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-add-group {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
padding: 0.5rem 0.875rem;
|
||
color: #25b9d7;
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
background: rgba(37, 185, 215, 0.05);
|
||
border: 1px dashed #25b9d7;
|
||
border-radius: 0.375rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-add-group:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .btn-add-group i {
|
||
font-size: 12px;
|
||
}
|
||
.entity-selector-trait .block-footer {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 1rem;
|
||
border-top: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .block-body {
|
||
padding: 0;
|
||
}
|
||
.entity-selector-trait .groups-container {
|
||
padding: 1rem;
|
||
}
|
||
.entity-selector-trait .groups-empty-state {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .selection-group {
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
margin-bottom: 1rem;
|
||
}
|
||
.entity-selector-trait .selection-group:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
.entity-selector-trait .selection-group.collapsed .group-body {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .selection-group.collapsed .group-collapse-toggle i {
|
||
transform: rotate(-90deg);
|
||
}
|
||
.entity-selector-trait .group-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0.3rem 0.3rem 0 0;
|
||
cursor: pointer;
|
||
}
|
||
.entity-selector-trait .group-header.group-header-single {
|
||
padding: 0.25rem 1rem;
|
||
background: transparent;
|
||
border-bottom: none;
|
||
}
|
||
.entity-selector-trait .group-collapse-toggle {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 20px;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .group-collapse-toggle i {
|
||
transition: transform 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .group-name-wrapper {
|
||
flex: 1;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .group-name-input {
|
||
flex: 1;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
background: transparent;
|
||
border: 1px solid transparent;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .group-name-input:hover, .entity-selector-trait .group-name-input:focus {
|
||
background: #ffffff;
|
||
border-color: #dee2e6;
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .group-name-input::placeholder {
|
||
color: #6c757d;
|
||
font-weight: 500;
|
||
}
|
||
.entity-selector-trait .group-count-badge {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .group-count-badge:hover {
|
||
transform: scale(1.05);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .group-count-badge:focus {
|
||
outline: none;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.3), 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .group-count-badge.loading {
|
||
cursor: wait;
|
||
}
|
||
.entity-selector-trait .group-count-badge.loading i {
|
||
font-size: 10px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .group-count-badge.loading:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .group-count-badge.inactive, .entity-selector-trait .group-count-badge.no-matches {
|
||
background: #94a3b8;
|
||
cursor: default;
|
||
}
|
||
.entity-selector-trait .group-count-badge.inactive:hover, .entity-selector-trait .group-count-badge.no-matches:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .group-count-badge.popover-open {
|
||
background: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .group-count-badge i {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.entity-selector-trait .group-count-badge:hover i {
|
||
opacity: 1;
|
||
}
|
||
.entity-selector-trait .group-count-badge .preview-count {
|
||
font-weight: 700;
|
||
}
|
||
.entity-selector-trait .btn-remove-group {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-remove-group:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-remove-group {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-remove-group:hover {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .group-include {
|
||
margin-bottom: 1rem;
|
||
padding: 0.5rem;
|
||
background: rgba(112, 181, 128, 0.03);
|
||
border: 1px solid rgba(112, 181, 128, 0.2);
|
||
border-radius: 0.25rem;
|
||
}
|
||
.entity-selector-trait .section-row {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .method-selector-wrapper {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .method-info-placeholder {
|
||
display: flex;
|
||
align-items: center;
|
||
min-width: 20px;
|
||
}
|
||
.entity-selector-trait .include-method-select,
|
||
.entity-selector-trait .exclude-method-select {
|
||
flex: 1;
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .include-method-select:focus,
|
||
.entity-selector-trait .exclude-method-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .include-method-select::placeholder,
|
||
.entity-selector-trait .exclude-method-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .include-method-select,
|
||
.entity-selector-trait .exclude-method-select {
|
||
cursor: pointer;
|
||
}
|
||
.entity-selector-trait .selector-locked .include-method-select {
|
||
opacity: 0.7;
|
||
cursor: not-allowed;
|
||
}
|
||
.entity-selector-trait .lock-indicator {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #fab000;
|
||
cursor: help;
|
||
}
|
||
.entity-selector-trait .lock-indicator i {
|
||
font-size: 14px;
|
||
}
|
||
.entity-selector-trait .lock-indicator .mpr-tooltip {
|
||
display: none;
|
||
position: absolute;
|
||
bottom: calc(100% + 8px);
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
padding: 0.25rem 0.5rem;
|
||
background: #1e293b;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 400;
|
||
white-space: nowrap;
|
||
border-radius: 0.2rem;
|
||
z-index: 100;
|
||
}
|
||
.entity-selector-trait .lock-indicator:hover .mpr-tooltip {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .group-excludes {
|
||
margin-top: 1rem;
|
||
}
|
||
.entity-selector-trait .except-separator {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
margin: 0 0 0.5rem 0;
|
||
}
|
||
.entity-selector-trait .except-separator::before, .entity-selector-trait .except-separator::after {
|
||
content: "";
|
||
flex: 1;
|
||
height: 1px;
|
||
background: rgba(220, 53, 69, 0.3);
|
||
}
|
||
.entity-selector-trait .except-label {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.75rem;
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
white-space: nowrap;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .except-label i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .exclude-rows-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .exclude-row {
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding: 0.5rem;
|
||
background: rgba(220, 53, 69, 0.03);
|
||
border: 1px solid rgba(220, 53, 69, 0.15);
|
||
border-radius: 0.25rem;
|
||
}
|
||
.entity-selector-trait .exclude-row .value-picker {
|
||
width: 100%;
|
||
margin-top: 0.5rem;
|
||
}
|
||
.entity-selector-trait .exclude-header-row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 0.5rem;
|
||
width: 100%;
|
||
}
|
||
.entity-selector-trait .exclude-header-row .method-selector-wrapper {
|
||
flex: 1;
|
||
}
|
||
.entity-selector-trait .exclude-header-row .btn-remove-exclude-row {
|
||
flex-shrink: 0;
|
||
margin-left: auto;
|
||
}
|
||
.entity-selector-trait .btn-remove-exclude-row {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-remove-exclude-row:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-remove-exclude-row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28px;
|
||
height: 28px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-remove-exclude-row:hover {
|
||
background: #f8d7da;
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .btn-add-exclude,
|
||
.entity-selector-trait .btn-add-another-exclude {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-add-exclude:focus,
|
||
.entity-selector-trait .btn-add-another-exclude:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-add-exclude,
|
||
.entity-selector-trait .btn-add-another-exclude {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
margin-top: 0.5rem;
|
||
padding: 0.375rem 0.625rem;
|
||
color: #dc3545;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
background: transparent;
|
||
border: 1px dashed rgba(220, 53, 69, 0.5);
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-add-exclude:hover,
|
||
.entity-selector-trait .btn-add-another-exclude:hover {
|
||
background: #f8d7da;
|
||
border-color: #dc3545;
|
||
}
|
||
.entity-selector-trait .btn-add-exclude i,
|
||
.entity-selector-trait .btn-add-another-exclude i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .group-modifiers {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
padding: 0.5rem 1rem;
|
||
margin: 1rem -1rem -1rem;
|
||
background: #f8fafc;
|
||
border-top: 1px solid #dee2e6;
|
||
border-radius: 0 0 0.3rem 0.3rem;
|
||
}
|
||
.entity-selector-trait .modifier-inline {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
}
|
||
.entity-selector-trait .group-modifier-limit {
|
||
width: 50px;
|
||
max-width: 50px;
|
||
height: 26px;
|
||
padding: 0 0.375rem;
|
||
font-size: 0.75rem;
|
||
text-align: center;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
}
|
||
.entity-selector-trait .group-modifier-limit:focus {
|
||
border-color: #25b9d7;
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .modifier-sort {
|
||
gap: 0;
|
||
}
|
||
.entity-selector-trait .modifier-sort .modifier-label {
|
||
margin-right: 0.375rem;
|
||
}
|
||
.entity-selector-trait .modifier-sort .group-modifier-sort {
|
||
height: 26px;
|
||
padding: 0 0.5rem;
|
||
font-size: 0.75rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem 0 0 0.2rem;
|
||
border-right: none;
|
||
cursor: pointer;
|
||
}
|
||
.entity-selector-trait .modifier-sort .group-modifier-sort:focus {
|
||
border-color: #25b9d7;
|
||
outline: none;
|
||
position: relative;
|
||
z-index: 1;
|
||
}
|
||
.entity-selector-trait .modifier-sort .btn-sort-dir {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .modifier-sort .btn-sort-dir:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .modifier-sort .btn-sort-dir {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 26px;
|
||
height: 26px;
|
||
color: #6c757d;
|
||
background: #f1f5f9;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0 0.2rem 0.2rem 0;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .modifier-sort .btn-sort-dir:hover {
|
||
background: #e2e8f0;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .modifier-sort .btn-sort-dir i {
|
||
font-size: 11px;
|
||
}
|
||
.entity-selector-trait .group-modifier-sort {
|
||
height: 26px;
|
||
padding: 0 0.5rem;
|
||
font-size: 0.75rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
}
|
||
.entity-selector-trait .group-modifier-sort:focus {
|
||
border-color: #25b9d7;
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-sort-dir {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-sort-dir:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-sort-dir {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 26px;
|
||
height: 26px;
|
||
color: #6c757d;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-sort-dir:hover {
|
||
background: #f1f5f9;
|
||
color: #495057;
|
||
}
|
||
.entity-selector-trait .group-preview-badge {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #f1f5f9;
|
||
color: #6c757d;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 50rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .group-preview-badge.clickable {
|
||
cursor: pointer;
|
||
}
|
||
.entity-selector-trait .group-preview-badge.clickable:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .group-separator {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 0.5rem 0;
|
||
color: #6c757d;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.1em;
|
||
}
|
||
.entity-selector-trait .group-separator::before, .entity-selector-trait .group-separator::after {
|
||
content: "";
|
||
flex: 1;
|
||
height: 1px;
|
||
background: #dee2e6;
|
||
margin: 0 1rem;
|
||
}
|
||
.entity-selector-trait .group-modifiers {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 1rem;
|
||
padding-top: 1rem;
|
||
margin-top: 1rem;
|
||
border-top: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .modifier-group {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .modifier-label {
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #6c757d;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .modifier-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .modifier-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .modifier-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .modifier-input {
|
||
width: 80px;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
}
|
||
.entity-selector-trait .modifier-select {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .modifier-select:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .modifier-select::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .modifier-select {
|
||
width: auto;
|
||
padding: 0.25rem 1.5rem 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
cursor: pointer;
|
||
appearance: none;
|
||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");
|
||
background-position: right 0.25rem center;
|
||
background-repeat: no-repeat;
|
||
background-size: 1.25em 1.25em;
|
||
}
|
||
.entity-selector-trait .condition-match-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.125rem 0.375rem;
|
||
background: #f1f5f9;
|
||
color: #6c757d;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .condition-match-count:hover {
|
||
background: #e2e8f0;
|
||
}
|
||
.entity-selector-trait .condition-match-count.has-results {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .condition-match-count.country-holidays {
|
||
background: rgba(139, 92, 246, 0.1);
|
||
color: #8b5cf6;
|
||
}
|
||
.entity-selector-trait .condition-match-count.country-holidays:hover {
|
||
background: rgba(139, 92, 246, 0.2);
|
||
}
|
||
.entity-selector-trait .condition-match-count.country-holidays.clickable {
|
||
background: rgba(139, 92, 246, 0.15);
|
||
}
|
||
.entity-selector-trait .condition-match-count i {
|
||
font-size: 10px;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Value Picker Component
|
||
* Search boxes, input types, range inputs
|
||
*/
|
||
.entity-selector-trait .value-picker {
|
||
padding: 0.5rem 0;
|
||
}
|
||
.entity-selector-trait .value-picker[style*="display: none"], .entity-selector-trait .value-picker[style*="display:none"] {
|
||
padding: 0;
|
||
}
|
||
.entity-selector-trait .entity-search-box {
|
||
position: relative;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.25rem;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .entity-search-box:focus-within {
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .chips-wrapper + .entity-search-box {
|
||
margin-top: 1rem;
|
||
}
|
||
.entity-selector-trait .entity-search-icon {
|
||
color: #6c757d;
|
||
font-size: 14px;
|
||
flex-shrink: 0;
|
||
margin-left: 0.25rem;
|
||
}
|
||
.entity-selector-trait input.entity-search-input,
|
||
.entity-selector-trait input.entity-search-input[type=text] {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait input.entity-search-input:focus,
|
||
.entity-selector-trait input.entity-search-input[type=text]:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait input.entity-search-input,
|
||
.entity-selector-trait input.entity-search-input[type=text] {
|
||
flex: 1;
|
||
min-width: 0;
|
||
width: auto !important;
|
||
max-width: none !important;
|
||
padding: 0.375rem;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
border: none !important;
|
||
background: transparent !important;
|
||
box-shadow: none !important;
|
||
}
|
||
.entity-selector-trait input.entity-search-input::placeholder,
|
||
.entity-selector-trait input.entity-search-input[type=text]::placeholder {
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait input.entity-search-input:focus,
|
||
.entity-selector-trait input.entity-search-input[type=text]:focus {
|
||
border: none !important;
|
||
box-shadow: none !important;
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .search-loading {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .search-loading i {
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .btn-browse-tree {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-browse-tree:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-browse-tree {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 32px;
|
||
height: 32px;
|
||
margin-left: auto;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-radius: 0.2rem;
|
||
flex-shrink: 0;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-browse-tree:hover {
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
}
|
||
.entity-selector-trait .btn-browse-tree i {
|
||
font-size: 14px;
|
||
}
|
||
.entity-selector-trait .numeric-range-box,
|
||
.entity-selector-trait .multi-range-input-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .range-min-input,
|
||
.entity-selector-trait .range-max-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .range-min-input:focus,
|
||
.entity-selector-trait .range-max-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .range-min-input::placeholder,
|
||
.entity-selector-trait .range-max-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .range-min-input,
|
||
.entity-selector-trait .range-max-input {
|
||
width: 100px;
|
||
padding: 0.5rem;
|
||
text-align: center;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .range-min-input::-webkit-inner-spin-button, .entity-selector-trait .range-min-input::-webkit-outer-spin-button,
|
||
.entity-selector-trait .range-max-input::-webkit-inner-spin-button,
|
||
.entity-selector-trait .range-max-input::-webkit-outer-spin-button {
|
||
-webkit-appearance: none;
|
||
margin: 0;
|
||
}
|
||
.entity-selector-trait .range-min-input,
|
||
.entity-selector-trait .range-max-input {
|
||
-moz-appearance: textfield;
|
||
}
|
||
.entity-selector-trait .range-separator {
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
}
|
||
.entity-selector-trait .btn-add-range {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-add-range:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-add-range {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 32px;
|
||
height: 32px;
|
||
color: #ffffff;
|
||
background: #25b9d7;
|
||
border-radius: 0.25rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-add-range:hover {
|
||
background: #1a9ab7;
|
||
}
|
||
.entity-selector-trait .btn-add-range i {
|
||
font-size: 12px;
|
||
}
|
||
.entity-selector-trait .multi-range-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .date-range-box {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .date-from-input,
|
||
.entity-selector-trait .date-to-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .date-from-input:focus,
|
||
.entity-selector-trait .date-to-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .date-from-input::placeholder,
|
||
.entity-selector-trait .date-to-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .date-from-input,
|
||
.entity-selector-trait .date-to-input {
|
||
width: 140px;
|
||
padding: 0.5rem;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .multi-select-tiles {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .tile-option {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .tile-option:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .tile-option {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem 0.75rem;
|
||
color: #6c757d;
|
||
background: transparent;
|
||
border: 1px dashed #dee2e6;
|
||
border-radius: 100px;
|
||
font-size: 0.75rem;
|
||
font-weight: 400;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .tile-option:hover {
|
||
color: #495057;
|
||
border-color: #94a3b8;
|
||
border-style: solid;
|
||
}
|
||
.entity-selector-trait .tile-option.selected {
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border: 1px solid #25b9d7;
|
||
font-weight: 500;
|
||
}
|
||
.entity-selector-trait .tile-option i {
|
||
font-size: 11px;
|
||
opacity: 0.6;
|
||
}
|
||
.entity-selector-trait .tile-option.selected i {
|
||
opacity: 1;
|
||
}
|
||
.entity-selector-trait .tile-label {
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .select-input-box {
|
||
display: inline-block;
|
||
}
|
||
.entity-selector-trait .select-value-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .select-value-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.entity-selector-trait .select-value-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
.entity-selector-trait .select-value-input {
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
min-width: 150px;
|
||
}
|
||
.entity-selector-trait .boolean-input-box {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
padding: 0.5rem 1rem;
|
||
background: #d4edda;
|
||
color: #1e7e34;
|
||
border-radius: 0.25rem;
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
}
|
||
.entity-selector-trait .boolean-label {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
}
|
||
.entity-selector-trait .boolean-label::before {
|
||
content: "✓";
|
||
font-weight: bold;
|
||
}
|
||
.entity-selector-trait .condition-match-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.entity-selector-trait .condition-match-count:hover {
|
||
transform: scale(1.05);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .condition-match-count:focus {
|
||
outline: none;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.3), 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .condition-match-count.loading {
|
||
cursor: wait;
|
||
}
|
||
.entity-selector-trait .condition-match-count.loading i {
|
||
font-size: 10px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.entity-selector-trait .condition-match-count.loading:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .condition-match-count.inactive, .entity-selector-trait .condition-match-count.no-matches {
|
||
background: #94a3b8;
|
||
cursor: default;
|
||
}
|
||
.entity-selector-trait .condition-match-count.inactive:hover, .entity-selector-trait .condition-match-count.no-matches:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.entity-selector-trait .condition-match-count.popover-open {
|
||
background: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.entity-selector-trait .condition-match-count i {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.entity-selector-trait .condition-match-count:hover i {
|
||
opacity: 1;
|
||
}
|
||
.entity-selector-trait .condition-match-count .preview-count {
|
||
font-weight: 700;
|
||
}
|
||
.entity-selector-trait .condition-match-count {
|
||
margin-left: 0.5rem;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* List Preview Component
|
||
* Popover and modal views for entity preview
|
||
*
|
||
* Uses shared entity-item base for item styling.
|
||
* This file only contains popover/modal container styles.
|
||
*/
|
||
.es-preview-popover,
|
||
.es-list-preview-popover {
|
||
position: absolute;
|
||
z-index: 10000;
|
||
min-width: 320px;
|
||
max-width: 480px;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
|
||
overflow: hidden;
|
||
}
|
||
.es-preview-popover::before,
|
||
.es-list-preview-popover::before {
|
||
content: "";
|
||
position: absolute;
|
||
top: -8px;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
border-left: 8px solid transparent;
|
||
border-right: 8px solid transparent;
|
||
border-bottom: 8px solid #dee2e6;
|
||
}
|
||
.es-preview-popover::after,
|
||
.es-list-preview-popover::after {
|
||
content: "";
|
||
position: absolute;
|
||
top: -6px;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
border-left: 6px solid transparent;
|
||
border-right: 6px solid transparent;
|
||
border-bottom: 6px solid #ffffff;
|
||
}
|
||
.es-preview-popover.position-right::before, .es-preview-popover.position-right::after,
|
||
.es-list-preview-popover.position-right::before,
|
||
.es-list-preview-popover.position-right::after {
|
||
left: 20px;
|
||
transform: none;
|
||
}
|
||
.es-preview-popover.position-left::before, .es-preview-popover.position-left::after,
|
||
.es-list-preview-popover.position-left::before,
|
||
.es-list-preview-popover.position-left::after {
|
||
left: auto;
|
||
right: 20px;
|
||
transform: none;
|
||
}
|
||
|
||
.preview-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.preview-header .preview-title {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
}
|
||
.preview-header .preview-close {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.preview-header .preview-close:focus {
|
||
outline: none;
|
||
}
|
||
.preview-header .preview-close {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.preview-header .preview-close:hover {
|
||
background: #e2e8f0;
|
||
color: #212529;
|
||
}
|
||
|
||
.preview-tabs {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0;
|
||
padding: 0;
|
||
background: #f8fafc;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
|
||
.preview-tab {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
padding: 0.5rem 0.75rem;
|
||
background: transparent;
|
||
border: 0;
|
||
border-bottom: 2px solid transparent;
|
||
margin-bottom: -1px;
|
||
color: #6c757d;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
white-space: nowrap;
|
||
}
|
||
.preview-tab:hover {
|
||
background: #f1f5f9;
|
||
color: #495057;
|
||
}
|
||
.preview-tab.active {
|
||
background: #ffffff;
|
||
border-bottom-color: #25b9d7;
|
||
color: #25b9d7;
|
||
}
|
||
.preview-tab i {
|
||
font-size: 12px;
|
||
}
|
||
|
||
.preview-filter {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #ffffff;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.preview-filter i {
|
||
color: #6c757d;
|
||
font-size: 12px;
|
||
}
|
||
.preview-filter .preview-filter-input {
|
||
all: unset;
|
||
flex: 1;
|
||
padding: 0.25rem 0;
|
||
font-size: 0.75rem;
|
||
color: #212529;
|
||
box-sizing: border-box;
|
||
}
|
||
.preview-filter .preview-filter-input::placeholder {
|
||
color: #6c757d;
|
||
}
|
||
|
||
.preview-contents {
|
||
max-height: 350px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.preview-content {
|
||
display: none;
|
||
max-height: 350px;
|
||
overflow-y: auto;
|
||
}
|
||
.preview-content::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.preview-content::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.preview-content::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.preview-content::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
.preview-content.active {
|
||
display: block;
|
||
}
|
||
|
||
.preview-items {
|
||
display: flex;
|
||
flex-direction: column;
|
||
padding: 0.25rem 0.5rem;
|
||
}
|
||
|
||
.preview-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
background: #ffffff;
|
||
border-radius: 0.2rem;
|
||
transition: background 0.15s ease-in-out;
|
||
}
|
||
.preview-item:hover {
|
||
background: #e9ecef;
|
||
}
|
||
.preview-item[data-id] {
|
||
cursor: pointer;
|
||
}
|
||
|
||
.preview-item-image {
|
||
flex-shrink: 0;
|
||
width: 32px;
|
||
height: 32px;
|
||
object-fit: cover;
|
||
border-radius: 0.2rem;
|
||
background: #f1f5f9;
|
||
}
|
||
|
||
.preview-item-no-image {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
flex-shrink: 0;
|
||
width: 32px;
|
||
height: 32px;
|
||
background: #f1f5f9;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
font-size: 0.875rem;
|
||
}
|
||
|
||
.preview-item-info {
|
||
flex: 1;
|
||
min-width: 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.125rem;
|
||
}
|
||
|
||
.preview-item-name {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.preview-item-ref,
|
||
.preview-item-meta {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.preview-item-price {
|
||
flex-shrink: 0;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-radius: 0.2rem;
|
||
}
|
||
|
||
.preview-footer {
|
||
padding: 0.5rem 1rem;
|
||
background: #f8fafc;
|
||
border-top: 1px solid #dee2e6;
|
||
}
|
||
|
||
.load-more-controls {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
.load-more-controls .load-more-label {
|
||
white-space: nowrap;
|
||
}
|
||
.load-more-controls .load-more-select {
|
||
appearance: none;
|
||
padding: 0.25rem 1.75rem 0.25rem 0.5rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
background: #ffffff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3E%3Cpath fill='%23666' d='M0 2l4 4 4-4z'/%3E%3C/svg%3E") no-repeat right 0.5rem center;
|
||
background-size: 8px;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #25b9d7;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
height: auto;
|
||
min-height: 0;
|
||
line-height: 1.3;
|
||
}
|
||
.load-more-controls .load-more-select:hover {
|
||
border-color: #25b9d7;
|
||
background-color: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.load-more-controls .load-more-select:focus {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.1);
|
||
}
|
||
.load-more-controls .load-more-of {
|
||
white-space: nowrap;
|
||
}
|
||
.load-more-controls .remaining-count {
|
||
font-weight: 600;
|
||
color: #495057;
|
||
}
|
||
.load-more-controls .btn-load-more {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 0.25rem;
|
||
margin: 0;
|
||
border: none;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-radius: 0.2rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
font: inherit;
|
||
}
|
||
.load-more-controls .btn-load-more i {
|
||
font-size: 14px;
|
||
}
|
||
.load-more-controls .btn-load-more:hover {
|
||
background: rgba(37, 185, 215, 0.2);
|
||
}
|
||
.load-more-controls .btn-load-more.loading {
|
||
cursor: wait;
|
||
}
|
||
.load-more-controls .btn-load-more.loading i {
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
|
||
.preview-empty {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.5rem;
|
||
padding: 2rem;
|
||
text-align: center;
|
||
color: #6c757d;
|
||
}
|
||
.preview-empty i {
|
||
font-size: 2rem;
|
||
opacity: 0.5;
|
||
}
|
||
.preview-empty p {
|
||
margin: 0;
|
||
font-size: 0.875rem;
|
||
}
|
||
|
||
.preview-loading {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
}
|
||
.preview-loading i {
|
||
font-size: 20px;
|
||
color: #25b9d7;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
|
||
.total-preview-popover {
|
||
min-width: 240px;
|
||
max-width: 320px;
|
||
}
|
||
.total-preview-popover .preview-popover-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
}
|
||
.total-preview-popover .preview-popover-header .preview-popover-title {
|
||
font-weight: 600;
|
||
color: #212529;
|
||
font-size: 0.875rem;
|
||
}
|
||
.total-preview-popover .preview-popover-header .preview-popover-count {
|
||
flex-shrink: 0;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #6c757d;
|
||
background: #e2e8f0;
|
||
padding: 0.125rem 0.5rem;
|
||
border-radius: 0.2rem;
|
||
}
|
||
.total-preview-popover .preview-popover-body {
|
||
padding: 0.25rem 0;
|
||
}
|
||
.total-preview-popover .total-summary-list {
|
||
list-style: none;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
.total-preview-popover .total-summary-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease;
|
||
}
|
||
.total-preview-popover .total-summary-item:hover {
|
||
background: #f8fafc;
|
||
}
|
||
.total-preview-popover .total-summary-item i {
|
||
width: 18px;
|
||
text-align: center;
|
||
color: #6c757d;
|
||
font-size: 14px;
|
||
}
|
||
.total-preview-popover .total-summary-item .summary-item-label {
|
||
flex: 1;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
}
|
||
.total-preview-popover .total-summary-item .summary-item-count {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
padding: 2px 8px;
|
||
border-radius: 0.2rem;
|
||
}
|
||
|
||
.trait-total-count {
|
||
cursor: pointer;
|
||
transition: all 0.15s ease;
|
||
}
|
||
.trait-total-count:hover {
|
||
opacity: 0.8;
|
||
}
|
||
.trait-total-count.popover-open {
|
||
opacity: 0.9;
|
||
}
|
||
|
||
.mpr-dropdown-preview {
|
||
display: none;
|
||
position: absolute;
|
||
top: 100%;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
margin-top: 6px;
|
||
z-index: 1000;
|
||
padding: 0.625rem 0.75rem;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
|
||
font-size: 12px;
|
||
text-align: left;
|
||
text-transform: none;
|
||
font-weight: normal;
|
||
white-space: nowrap;
|
||
}
|
||
.mpr-dropdown-preview.is-open {
|
||
display: block;
|
||
}
|
||
|
||
.mpr-dropdown-preview__item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.375rem 0;
|
||
color: #666;
|
||
line-height: 1.4;
|
||
}
|
||
.mpr-dropdown-preview__item:not(:last-child) {
|
||
margin-bottom: 0.25rem;
|
||
padding-bottom: 0.5rem;
|
||
border-bottom: 1px solid rgba(222, 226, 230, 0.5);
|
||
}
|
||
.mpr-dropdown-preview__item > .material-icons,
|
||
.mpr-dropdown-preview__item > i:first-child {
|
||
flex-shrink: 0;
|
||
width: 16px;
|
||
font-size: 14px;
|
||
color: #999;
|
||
text-align: center;
|
||
}
|
||
|
||
.mpr-dropdown-preview__muted {
|
||
color: #999;
|
||
}
|
||
|
||
.mpr-dropdown-preview__schedule {
|
||
display: inline;
|
||
}
|
||
|
||
.mpr-dropdown-preview__schedule-row {
|
||
display: inline;
|
||
}
|
||
.mpr-dropdown-preview__schedule-row:not(:last-child)::after {
|
||
content: ",";
|
||
margin-right: 0.5rem;
|
||
}
|
||
|
||
.mpr-dropdown-preview__day {
|
||
color: #666;
|
||
}
|
||
|
||
.mpr-dropdown-preview__hours {
|
||
color: #25b9d7;
|
||
font-weight: 500;
|
||
margin-left: 0.25rem;
|
||
}
|
||
|
||
.mpr-badge--preview {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
position: relative;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
text-transform: none;
|
||
}
|
||
.mpr-badge--preview .icon-eye {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.mpr-badge--preview .material-icons {
|
||
font-size: 12px;
|
||
line-height: 1;
|
||
}
|
||
|
||
.mpr-badge--preview-primary {
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
}
|
||
|
||
.mpr-badge--preview-success {
|
||
background: #d4edda;
|
||
color: #155724;
|
||
}
|
||
|
||
.mpr-badge--preview-warning {
|
||
background: #fff3cd;
|
||
color: #856404;
|
||
}
|
||
|
||
.mpr-badge--preview-muted {
|
||
background: #e2e8f0;
|
||
color: #6c757d;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Schedule Conditions Component
|
||
* DateTime picker, weekly timeline, holidays
|
||
*/
|
||
.schedule-conditions-trait {
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
}
|
||
|
||
.schedule-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1rem;
|
||
padding: 0.875rem 1rem;
|
||
background: #f8f9fa;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0.3rem 0.3rem 0 0;
|
||
cursor: pointer;
|
||
user-select: none;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.schedule-header:hover {
|
||
background: #e9ecef;
|
||
}
|
||
|
||
.schedule-title {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.75rem;
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
}
|
||
.schedule-title i {
|
||
color: #6c757d;
|
||
}
|
||
|
||
.schedule-body {
|
||
padding: 1rem;
|
||
}
|
||
|
||
.schedule-section {
|
||
margin-bottom: 1.5rem;
|
||
}
|
||
.schedule-section:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.schedule-section-title {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
margin-bottom: 0.5rem;
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #212529;
|
||
}
|
||
.schedule-section-title i {
|
||
color: #6c757d;
|
||
}
|
||
|
||
.schedule-section-description {
|
||
margin-bottom: 1rem;
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
}
|
||
|
||
.datetime-range {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 1rem;
|
||
}
|
||
|
||
.datetime-field {
|
||
flex: 1;
|
||
min-width: 200px;
|
||
}
|
||
|
||
.datetime-label {
|
||
display: block;
|
||
margin-bottom: 0.25rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #495057;
|
||
}
|
||
|
||
.datetime-input {
|
||
width: 100%;
|
||
padding: 0.5rem 1rem;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
color: #212529;
|
||
background-color: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||
}
|
||
.datetime-input:focus {
|
||
border-color: #25b9d7;
|
||
outline: 0;
|
||
box-shadow: 0 0 0 0.2rem rgba(37, 185, 215, 0.25);
|
||
}
|
||
.datetime-input::placeholder {
|
||
color: #adb5bd;
|
||
}
|
||
|
||
.weekly-schedule {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
}
|
||
|
||
.day-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
padding: 0.5rem;
|
||
background: #f8fafc;
|
||
border-radius: 0.25rem;
|
||
}
|
||
.day-row.disabled {
|
||
opacity: 0.5;
|
||
}
|
||
|
||
.day-toggle {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
min-width: 100px;
|
||
}
|
||
|
||
.day-checkbox {
|
||
width: 18px;
|
||
height: 18px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.day-name {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
}
|
||
|
||
.timeline-slider {
|
||
flex: 1;
|
||
position: relative;
|
||
height: 24px;
|
||
background: #e2e8f0;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.timeline-fill {
|
||
position: absolute;
|
||
top: 0;
|
||
height: 100%;
|
||
background: #25b9d7;
|
||
border-radius: 50rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
|
||
.timeline-handle {
|
||
position: absolute;
|
||
top: 50%;
|
||
width: 16px;
|
||
height: 16px;
|
||
background: #ffffff;
|
||
border: 2px solid #25b9d7;
|
||
border-radius: 50%;
|
||
transform: translate(-50%, -50%);
|
||
cursor: grab;
|
||
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
|
||
transition: box-shadow 0.15s ease-in-out;
|
||
}
|
||
.timeline-handle:hover {
|
||
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
|
||
}
|
||
.timeline-handle:active {
|
||
cursor: grabbing;
|
||
}
|
||
.timeline-handle.handle-start {
|
||
z-index: 2;
|
||
}
|
||
.timeline-handle.handle-end {
|
||
z-index: 1;
|
||
}
|
||
|
||
.day-times {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
min-width: 120px;
|
||
font-size: 0.75rem;
|
||
font-family: monospace;
|
||
color: #495057;
|
||
}
|
||
|
||
.time-separator {
|
||
color: #6c757d;
|
||
}
|
||
|
||
.holiday-section {
|
||
padding: 1rem;
|
||
background: #f8fafc;
|
||
border-radius: 0.25rem;
|
||
}
|
||
|
||
.holiday-toggle {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
margin-bottom: 1rem;
|
||
}
|
||
|
||
.holiday-checkbox {
|
||
width: 18px;
|
||
height: 18px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.holiday-label {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
}
|
||
|
||
.holiday-countries {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
}
|
||
|
||
.holiday-country-chip {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
background: #e9ecef;
|
||
color: #495057;
|
||
border-radius: 50rem;
|
||
}
|
||
.holiday-country-chip .chip-remove {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.holiday-country-chip .chip-remove:focus {
|
||
outline: none;
|
||
}
|
||
.holiday-country-chip .chip-remove {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 14px;
|
||
height: 14px;
|
||
font-size: 10px;
|
||
color: #6c757d;
|
||
border-radius: 50%;
|
||
}
|
||
.holiday-country-chip .chip-remove:hover {
|
||
background: rgba(0, 0, 0, 0.1);
|
||
color: #dc3545;
|
||
}
|
||
.holiday-country-chip {
|
||
cursor: pointer;
|
||
}
|
||
.holiday-country-chip.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
color: #25b9d7;
|
||
}
|
||
|
||
.server-time {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
background: #d1ecf1;
|
||
border-radius: 0.25rem;
|
||
font-size: 0.75rem;
|
||
color: #17a2b8;
|
||
}
|
||
.server-time i {
|
||
font-size: 0.875rem;
|
||
}
|
||
.server-time .time-value {
|
||
font-family: monospace;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.schedule-summary {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.25rem;
|
||
padding: 1rem;
|
||
background: #f8fafc;
|
||
border-radius: 0.25rem;
|
||
font-size: 0.875rem;
|
||
color: #495057;
|
||
}
|
||
.schedule-summary .summary-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
.schedule-summary .summary-item i {
|
||
color: #70b580;
|
||
font-size: 0.875rem;
|
||
}
|
||
.schedule-summary .summary-item.inactive i {
|
||
color: #6c757d;
|
||
}
|
||
|
||
.schedule-conditions-trait.collapsed .schedule-body {
|
||
display: none;
|
||
}
|
||
.schedule-conditions-trait.collapsed .schedule-header {
|
||
border-radius: 0.3rem;
|
||
}
|
||
|
||
.schedule-toggle-row {
|
||
display: flex;
|
||
align-items: center;
|
||
background: #f1f5f9;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
}
|
||
.schedule-toggle-row .schedule-toggle-switch {
|
||
padding: 0.5rem 1rem;
|
||
}
|
||
.schedule-toggle-row .schedule-toggle-actions {
|
||
padding: 0.5rem 1rem;
|
||
border-left: 1px solid #dee2e6;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.schedule-toggle-row .schedule-toggle-actions:hover {
|
||
background: #e2e8f0;
|
||
}
|
||
.schedule-toggle-row .schedule-toggle-actions .material-icons {
|
||
color: #94a3b8;
|
||
font-size: 20px;
|
||
}
|
||
|
||
.schedule-summary-badges {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
margin-left: auto;
|
||
padding: 0 0.5rem;
|
||
}
|
||
|
||
.schedule-badge {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #e2e8f0;
|
||
color: #475569;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
border-radius: 50rem;
|
||
white-space: nowrap;
|
||
}
|
||
.schedule-badge .material-icons {
|
||
font-size: 14px;
|
||
opacity: 0.7;
|
||
}
|
||
|
||
.schedule-holidays .section-hint {
|
||
margin-top: 1rem;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Tips Box Component
|
||
* Pro tips and help information display
|
||
*/
|
||
.entity-selector-trait .es-tips-box {
|
||
margin: 1.5rem 1rem 1rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
overflow: hidden;
|
||
background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
|
||
}
|
||
.entity-selector-trait .tips-header {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.625rem;
|
||
padding: 1rem 1.5rem;
|
||
cursor: pointer;
|
||
user-select: none;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .tips-header:hover {
|
||
background: rgba(0, 0, 0, 0.02);
|
||
}
|
||
.entity-selector-trait .tips-header > i:first-child {
|
||
font-size: 1rem;
|
||
color: #fab000;
|
||
}
|
||
.entity-selector-trait .tips-header > span {
|
||
flex: 1;
|
||
font-size: 13px;
|
||
font-weight: 600;
|
||
color: #475569;
|
||
}
|
||
.entity-selector-trait .tips-toggle {
|
||
font-size: 0.75rem;
|
||
color: #94a3b8;
|
||
transition: transform 0.2s;
|
||
}
|
||
.entity-selector-trait .es-tips-box.expanded .tips-toggle {
|
||
transform: rotate(180deg);
|
||
}
|
||
.entity-selector-trait .es-tips-box.expanded .tips-content {
|
||
display: block;
|
||
}
|
||
.entity-selector-trait .tips-content {
|
||
display: none;
|
||
padding: 0 1.5rem 1.5rem;
|
||
}
|
||
.entity-selector-trait .tips-grid {
|
||
display: grid;
|
||
gap: 1rem;
|
||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||
}
|
||
.entity-selector-trait .tip-item {
|
||
display: flex;
|
||
gap: 1rem;
|
||
padding: 1rem;
|
||
background: #ffffff;
|
||
border-radius: 0.25rem;
|
||
border: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .tip-icon {
|
||
flex-shrink: 0;
|
||
width: 2rem;
|
||
height: 2rem;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
border-radius: 0.25rem;
|
||
color: #25b9d7;
|
||
font-size: 0.875rem;
|
||
}
|
||
.entity-selector-trait .tip-text {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.entity-selector-trait .tip-text strong {
|
||
display: block;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
color: #334155;
|
||
margin-bottom: 0.25rem;
|
||
}
|
||
.entity-selector-trait .tip-text p {
|
||
font-size: 11px;
|
||
color: #6c757d;
|
||
line-height: 1.625;
|
||
margin: 0;
|
||
}
|
||
.entity-selector-trait .tips-footer {
|
||
margin-top: 1rem;
|
||
padding: 0.625rem 1rem;
|
||
background: #ffffff;
|
||
border-radius: 0.25rem;
|
||
border: 1px dashed #dee2e6;
|
||
font-size: 11px;
|
||
color: #6c757d;
|
||
line-height: 1.625;
|
||
}
|
||
.entity-selector-trait .tips-footer i {
|
||
color: #25b9d7;
|
||
margin-right: 0.25rem;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Condition Trait Base Styles
|
||
* Shared styling for all condition trait components
|
||
*/
|
||
.condition-trait {
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.3rem;
|
||
margin-bottom: 1.5rem;
|
||
}
|
||
.condition-trait:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
|
||
.condition-trait.collapsed .condition-trait-header {
|
||
border-bottom-color: transparent;
|
||
border-radius: 0.3rem;
|
||
}
|
||
.condition-trait.collapsed .collapse-icon {
|
||
transform: rotate(180deg);
|
||
}
|
||
|
||
.condition-trait-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
gap: 1.5rem;
|
||
flex-wrap: wrap;
|
||
padding: 0.875rem 1.5rem;
|
||
background: #f8fafc;
|
||
border-bottom: 1px solid #dee2e6;
|
||
border-radius: 0.3rem 0.3rem 0 0;
|
||
cursor: pointer;
|
||
transition: background-color 0.15s ease-in-out;
|
||
}
|
||
.condition-trait-header:hover {
|
||
background: #f1f5f9;
|
||
}
|
||
|
||
.trait-header-left {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
min-width: 0;
|
||
flex: 1;
|
||
}
|
||
|
||
.trait-icon {
|
||
font-size: 1.125rem;
|
||
color: #6c757d;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
.trait-title-group {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.125rem;
|
||
min-width: 0;
|
||
}
|
||
|
||
.trait-title {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #1e293b;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.trait-subtitle {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
.trait-summary {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.375rem;
|
||
padding: 0.25rem 0.625rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.08);
|
||
border-radius: 50rem;
|
||
white-space: nowrap;
|
||
margin-left: 1rem;
|
||
flex-shrink: 0;
|
||
max-width: 320px;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.trait-summary:empty {
|
||
display: none;
|
||
}
|
||
|
||
.trait-header-right {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 1rem;
|
||
flex-shrink: 0;
|
||
margin-left: auto;
|
||
}
|
||
|
||
.trait-header-actions {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
}
|
||
|
||
.collapse-icon {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 1.5rem;
|
||
height: 1.5rem;
|
||
font-size: 0.875rem;
|
||
color: #6c757d;
|
||
cursor: pointer;
|
||
transition: all 0.2s;
|
||
border-radius: 0.2rem;
|
||
background: transparent;
|
||
}
|
||
.collapse-icon:hover {
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.08);
|
||
}
|
||
|
||
.trait-show-all-toggle {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
font-size: 0.75rem;
|
||
color: #25b9d7;
|
||
cursor: pointer;
|
||
}
|
||
.trait-show-all-toggle:hover {
|
||
text-decoration: underline;
|
||
}
|
||
|
||
.trait-total-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.trait-total-count:hover {
|
||
transform: scale(1.05);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.trait-total-count:focus {
|
||
outline: none;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.3), 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.trait-total-count.loading {
|
||
cursor: wait;
|
||
}
|
||
.trait-total-count.loading i {
|
||
font-size: 10px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.trait-total-count.loading:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.trait-total-count.inactive, .trait-total-count.no-matches {
|
||
background: #94a3b8;
|
||
cursor: default;
|
||
}
|
||
.trait-total-count.inactive:hover, .trait-total-count.no-matches:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.trait-total-count.popover-open {
|
||
background: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.trait-total-count i {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.trait-total-count:hover i {
|
||
opacity: 1;
|
||
}
|
||
.trait-total-count .preview-count {
|
||
font-weight: 700;
|
||
}
|
||
|
||
.trait-required {
|
||
color: #dc3545;
|
||
font-size: 0.75rem;
|
||
}
|
||
|
||
.trait-validation-error {
|
||
color: #dc3545;
|
||
font-size: 0.75rem;
|
||
margin-top: 0.25rem;
|
||
}
|
||
|
||
.trait-toggle {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.trait-toggle:focus {
|
||
outline: none;
|
||
}
|
||
.trait-toggle {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem 0.75rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #495057;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.25rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.trait-toggle:hover {
|
||
background: #f8fafc;
|
||
border-color: #dee2e6;
|
||
}
|
||
.trait-toggle.active {
|
||
color: #25b9d7;
|
||
border-color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
|
||
.condition-trait-body {
|
||
padding: 1.5rem;
|
||
border-radius: 0 0 0.3rem 0.3rem;
|
||
background: #ffffff;
|
||
animation: slideDown 0.2s ease-out;
|
||
}
|
||
|
||
.condition-trait.collapsed .condition-trait-body {
|
||
display: none;
|
||
}
|
||
|
||
.schedule-section,
|
||
.context-section {
|
||
margin-bottom: 1.25rem;
|
||
padding-bottom: 1.25rem;
|
||
border-bottom: 1px solid #f1f5f9;
|
||
}
|
||
.schedule-section:last-child,
|
||
.context-section:last-child {
|
||
margin-bottom: 0;
|
||
padding-bottom: 0;
|
||
border-bottom: 0;
|
||
}
|
||
|
||
.section-label {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
font-size: 13px;
|
||
font-weight: 600;
|
||
color: #475569;
|
||
margin-bottom: 1rem;
|
||
}
|
||
.section-label i {
|
||
font-size: 0.875rem;
|
||
color: #94a3b8;
|
||
margin-right: 0.25rem;
|
||
}
|
||
|
||
.section-hint {
|
||
margin-top: 0.5rem;
|
||
font-size: 11px;
|
||
color: #94a3b8;
|
||
}
|
||
|
||
.form-group.condition-trait-fullwidth {
|
||
display: block !important;
|
||
}
|
||
.form-group.condition-trait-fullwidth > .control-label {
|
||
display: none !important;
|
||
}
|
||
.form-group.condition-trait-fullwidth > .col-lg-8,
|
||
.form-group.condition-trait-fullwidth > .col-lg-8.col-lg-offset-3 {
|
||
width: 100% !important;
|
||
max-width: 100% !important;
|
||
flex: 0 0 100% !important;
|
||
padding-left: 1.5rem !important;
|
||
padding-right: 1.5rem !important;
|
||
margin: 0 !important;
|
||
margin-left: 0 !important;
|
||
}
|
||
|
||
.condition-traits-group-label {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #334155;
|
||
margin-bottom: 1rem;
|
||
}
|
||
|
||
.condition-traits-wrapper {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 1rem;
|
||
}
|
||
|
||
.entity-selector-collapse-header {
|
||
padding: 0;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.entity-selector-collapse-header .btn-collapse-toggle {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0;
|
||
background: none;
|
||
border: none;
|
||
color: #25b9d7;
|
||
font-size: 0.875rem;
|
||
cursor: pointer;
|
||
transition: color 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-collapse-header .btn-collapse-toggle:hover {
|
||
color: #1a9ab7;
|
||
}
|
||
.entity-selector-collapse-header .btn-collapse-toggle .collapse-icon {
|
||
font-size: 1.25rem;
|
||
transition: transform 0.2s;
|
||
}
|
||
.entity-selector-collapse-header .btn-collapse-toggle .collapse-label {
|
||
font-weight: 500;
|
||
}
|
||
|
||
@keyframes slideDown {
|
||
from {
|
||
opacity: 0;
|
||
transform: translateY(-10px);
|
||
}
|
||
to {
|
||
opacity: 1;
|
||
transform: translateY(0);
|
||
}
|
||
}
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Combination Attributes Picker Component
|
||
* Product attribute combination selection styles
|
||
*/
|
||
.entity-selector-trait .combination-attributes-picker {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.625rem;
|
||
}
|
||
.entity-selector-trait .combination-mode-toggle {
|
||
display: inline-flex;
|
||
gap: 0.25rem;
|
||
padding: 0.125rem;
|
||
background: #f1f5f9;
|
||
border-radius: 0.25rem;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.entity-selector-trait .combination-mode-option {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
cursor: pointer;
|
||
font-size: 11px;
|
||
color: #6c757d;
|
||
padding: 0.25rem 0.625rem;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .combination-mode-option input[type=radio] {
|
||
display: none;
|
||
}
|
||
.entity-selector-trait .combination-mode-option .mode-label {
|
||
user-select: none;
|
||
}
|
||
.entity-selector-trait .combination-mode-option:hover {
|
||
color: #25b9d7;
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .combination-mode-option:has(input[type=radio]:checked) {
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-weight: 500;
|
||
}
|
||
.entity-selector-trait .combination-groups-container {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 1rem;
|
||
}
|
||
.entity-selector-trait .combination-loading,
|
||
.entity-selector-trait .combination-empty,
|
||
.entity-selector-trait .combination-error {
|
||
color: #6c757d;
|
||
font-style: italic;
|
||
padding: 0.5rem;
|
||
}
|
||
.entity-selector-trait .combination-error {
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .combinations-section {
|
||
margin-bottom: 1rem;
|
||
}
|
||
.entity-selector-trait .combinations-header {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 0.5rem;
|
||
}
|
||
.entity-selector-trait .combinations-label {
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #6c757d;
|
||
}
|
||
.entity-selector-trait .combinations-help {
|
||
font-size: 11px;
|
||
color: #94a3b8;
|
||
}
|
||
.entity-selector-trait .btn-toggle-combinations {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-toggle-combinations:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-toggle-combinations {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: #25b9d7;
|
||
background: transparent;
|
||
border: 1px solid #25b9d7;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-toggle-combinations:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .btn-remove-combinations {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-remove-combinations:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-remove-combinations {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
color: #dc3545;
|
||
background: transparent;
|
||
}
|
||
.entity-selector-trait .btn-remove-combinations:hover {
|
||
text-decoration: underline;
|
||
}
|
||
.entity-selector-trait .comb-attr-group {
|
||
flex: none;
|
||
min-width: 120px;
|
||
max-width: 200px;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
overflow: hidden;
|
||
}
|
||
.entity-selector-trait .comb-attr-group.has-selections {
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .comb-attr-group-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 0.375rem 0.625rem;
|
||
background: #f1f5f9;
|
||
border-bottom: 1px solid #dee2e6;
|
||
font-weight: 600;
|
||
font-size: 0.75rem;
|
||
color: #1e293b;
|
||
}
|
||
.comb-attr-group.has-selections .entity-selector-trait .comb-attr-group-header {
|
||
background: #ecfeff;
|
||
border-bottom-color: #a5f3fc;
|
||
}
|
||
.entity-selector-trait .comb-attr-group-name {
|
||
flex: 1;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.entity-selector-trait .comb-attr-group-count {
|
||
flex-shrink: 0;
|
||
min-width: 18px;
|
||
height: 18px;
|
||
padding: 0 0.25rem;
|
||
background: #dee2e6;
|
||
border-radius: 50rem;
|
||
font-size: 11px;
|
||
font-weight: 600;
|
||
line-height: 18px;
|
||
text-align: center;
|
||
color: #6c757d;
|
||
}
|
||
.comb-attr-group.has-selections .entity-selector-trait .comb-attr-group-count {
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
}
|
||
.entity-selector-trait .comb-attr-toolbar {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.375rem;
|
||
background: #f8fafc;
|
||
border-bottom: 1px solid #f1f5f9;
|
||
}
|
||
.entity-selector-trait .comb-toolbar-btn {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .comb-toolbar-btn:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .comb-toolbar-btn {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 22px;
|
||
height: 22px;
|
||
padding: 0;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
color: #6c757d;
|
||
cursor: pointer;
|
||
font-size: 0.75rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .comb-toolbar-btn:hover {
|
||
background: #f1f5f9;
|
||
border-color: #94a3b8;
|
||
color: #1e293b;
|
||
}
|
||
.entity-selector-trait .comb-attr-search {
|
||
flex: 1;
|
||
min-width: 60px;
|
||
padding: 0.125rem 0.375rem;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
font-size: 11px;
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .comb-attr-search:focus {
|
||
border-color: #25b9d7;
|
||
}
|
||
.entity-selector-trait .comb-attr-search::placeholder {
|
||
color: #94a3b8;
|
||
}
|
||
.entity-selector-trait .comb-attr-values {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem;
|
||
max-height: 150px;
|
||
overflow-y: auto;
|
||
}
|
||
.entity-selector-trait .comb-attr-values::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.entity-selector-trait .comb-attr-values::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.entity-selector-trait .comb-attr-values::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.entity-selector-trait .comb-attr-values::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
.entity-selector-trait .comb-attr-loading,
|
||
.entity-selector-trait .comb-attr-empty,
|
||
.entity-selector-trait .comb-attr-error {
|
||
width: 100%;
|
||
text-align: center;
|
||
color: #94a3b8;
|
||
font-size: 11px;
|
||
padding: 0.25rem;
|
||
}
|
||
.entity-selector-trait .comb-attr-error {
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .comb-attr-value {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.125rem 0.5rem;
|
||
background: #ffffff;
|
||
border: 1px solid #94a3b8;
|
||
border-radius: 0.75rem;
|
||
font-size: 11px;
|
||
color: #475569;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
white-space: nowrap;
|
||
}
|
||
.entity-selector-trait .comb-attr-value:hover {
|
||
background: #f1f5f9;
|
||
border-color: #6c757d;
|
||
}
|
||
.entity-selector-trait .comb-attr-value.selected {
|
||
background: #25b9d7;
|
||
border-color: #1a9ab7;
|
||
color: #ffffff;
|
||
}
|
||
.entity-selector-trait .comb-attr-value.selected:hover {
|
||
background: #1a9ab7;
|
||
border-color: rgb(22.8277511962, 135.2105263158, 160.6722488038);
|
||
}
|
||
.entity-selector-trait .comb-attr-value-count {
|
||
font-size: 9px;
|
||
color: #94a3b8;
|
||
background: #f1f5f9;
|
||
padding: 1px 0.25rem;
|
||
border-radius: 0.5rem;
|
||
min-width: 14px;
|
||
text-align: center;
|
||
}
|
||
.comb-attr-value.selected .entity-selector-trait .comb-attr-value-count {
|
||
color: #ffffff;
|
||
background: rgba(255, 255, 255, 0.3);
|
||
}
|
||
.entity-selector-trait .combination-conditions-container {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 0.5rem;
|
||
}
|
||
.entity-selector-trait .combination-condition-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
background: #f8fafc;
|
||
border-radius: 0.2rem;
|
||
}
|
||
.entity-selector-trait .combination-group-select,
|
||
.entity-selector-trait .combination-values-select {
|
||
flex: 1;
|
||
min-width: 120px;
|
||
}
|
||
.entity-selector-trait .combination-equals {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
padding: 0 0.25rem;
|
||
}
|
||
.entity-selector-trait .btn-add-combination-condition {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-add-combination-condition:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-add-combination-condition {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.375rem 0.75rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #25b9d7;
|
||
background: transparent;
|
||
border: 1px dashed #25b9d7;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-add-combination-condition:hover {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .btn-add-combination-condition i {
|
||
font-size: 10px;
|
||
}
|
||
.entity-selector-trait .btn-remove-combination-row {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.entity-selector-trait .btn-remove-combination-row:focus {
|
||
outline: none;
|
||
}
|
||
.entity-selector-trait .btn-remove-combination-row {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.entity-selector-trait .btn-remove-combination-row:hover {
|
||
background: rgba(220, 53, 69, 0.1);
|
||
color: #dc3545;
|
||
}
|
||
.entity-selector-trait .btn-remove-combination-row i {
|
||
font-size: 12px;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Method Dropdown Component
|
||
* Custom select dropdown with icons for method selection
|
||
*/
|
||
.entity-selector-trait .method-dropdown-trigger {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
min-height: 36px;
|
||
padding: 0.25rem 1rem;
|
||
border-radius: 0.25rem;
|
||
background: #ffffff;
|
||
color: #1e293b;
|
||
font-size: 0.875rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
min-width: 180px;
|
||
max-width: 320px;
|
||
border: 1px solid #dee2e6;
|
||
}
|
||
.entity-selector-trait .method-dropdown-trigger:hover {
|
||
background: #f8fafc;
|
||
border-color: #dee2e6;
|
||
}
|
||
.entity-selector-trait .method-dropdown-trigger:focus, .entity-selector-trait .method-dropdown-trigger:active {
|
||
outline: none;
|
||
border-color: #25b9d7;
|
||
box-shadow: 0 0 0 3px rgba(37, 185, 215, 0.1);
|
||
}
|
||
.entity-selector-trait .method-trigger-icon {
|
||
font-size: 0.875rem;
|
||
color: #6c757d;
|
||
flex-shrink: 0;
|
||
width: 18px;
|
||
text-align: center;
|
||
}
|
||
.entity-selector-trait .method-trigger-label {
|
||
flex: 1;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
font-weight: 500;
|
||
line-height: 1.4;
|
||
}
|
||
.entity-selector-trait .method-trigger-caret {
|
||
font-size: 0.75rem;
|
||
color: #94a3b8;
|
||
flex-shrink: 0;
|
||
margin-left: auto;
|
||
}
|
||
.entity-selector-trait .selector-locked .method-dropdown-trigger {
|
||
background: #f1f5f9;
|
||
color: #94a3b8;
|
||
cursor: not-allowed;
|
||
border-color: #dee2e6;
|
||
}
|
||
.entity-selector-trait .selector-locked .method-dropdown-trigger:hover {
|
||
background: #f1f5f9;
|
||
border-color: #dee2e6;
|
||
}
|
||
.entity-selector-trait .method-selector-wrapper {
|
||
position: relative;
|
||
}
|
||
.entity-selector-trait .method-select-hidden {
|
||
position: absolute !important;
|
||
opacity: 0 !important;
|
||
pointer-events: none !important;
|
||
width: 0 !important;
|
||
height: 0 !important;
|
||
overflow: hidden !important;
|
||
}
|
||
|
||
.method-select-hidden {
|
||
position: absolute !important;
|
||
opacity: 0 !important;
|
||
pointer-events: none !important;
|
||
width: 0 !important;
|
||
height: 0 !important;
|
||
overflow: hidden !important;
|
||
}
|
||
|
||
.method-dropdown-menu {
|
||
position: absolute;
|
||
z-index: 1001;
|
||
min-width: 200px;
|
||
max-width: 360px;
|
||
max-height: 400px;
|
||
overflow-y: auto;
|
||
background: #ffffff;
|
||
border-radius: 0.3rem;
|
||
padding: 0.375rem 0;
|
||
border: 1px solid #dee2e6;
|
||
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
|
||
animation: methodDropdownFadeIn 0.15s ease;
|
||
}
|
||
.method-dropdown-menu::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.method-dropdown-menu::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.method-dropdown-menu::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.method-dropdown-menu::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
|
||
@keyframes methodDropdownFadeIn {
|
||
from {
|
||
opacity: 0;
|
||
transform: translateY(-4px);
|
||
}
|
||
to {
|
||
opacity: 1;
|
||
transform: translateY(0);
|
||
}
|
||
}
|
||
.method-dropdown-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.625rem;
|
||
padding: 0.5rem 1rem;
|
||
cursor: pointer;
|
||
transition: background-color 0.1s;
|
||
position: relative;
|
||
}
|
||
.method-dropdown-item:hover {
|
||
background: #f1f5f9;
|
||
}
|
||
.method-dropdown-item.selected {
|
||
background: rgba(37, 185, 215, 0.08);
|
||
}
|
||
.method-dropdown-item .method-item-icon {
|
||
font-size: 0.875rem;
|
||
color: #6c757d;
|
||
width: 18px;
|
||
text-align: center;
|
||
flex-shrink: 0;
|
||
}
|
||
.method-dropdown-item.selected .method-item-icon {
|
||
color: #25b9d7;
|
||
}
|
||
.method-dropdown-item .method-item-label {
|
||
flex: 1;
|
||
font-size: 0.875rem;
|
||
color: #334155;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.method-dropdown-item.selected .method-item-label {
|
||
color: #0e7490;
|
||
font-weight: 500;
|
||
}
|
||
.method-dropdown-item .method-item-check {
|
||
font-size: 0.75rem;
|
||
flex-shrink: 0;
|
||
margin-left: auto;
|
||
color: #25b9d7;
|
||
}
|
||
|
||
.method-dropdown-optgroup {
|
||
margin-top: 0.25rem;
|
||
}
|
||
.method-dropdown-optgroup:first-child {
|
||
margin-top: 0;
|
||
}
|
||
|
||
.method-optgroup-label {
|
||
padding: 0.5rem 1rem;
|
||
font-size: 11px;
|
||
font-weight: 600;
|
||
color: #6c757d;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.05em;
|
||
background: #f8fafc;
|
||
border-top: 1px solid #f1f5f9;
|
||
border-bottom: 1px solid #f1f5f9;
|
||
}
|
||
.method-dropdown-optgroup:first-child .method-optgroup-label {
|
||
border-top: 0;
|
||
}
|
||
|
||
.method-optgroup-items {
|
||
padding: 0.25rem 0;
|
||
}
|
||
.method-optgroup-items .method-dropdown-item {
|
||
padding-left: 1.5rem;
|
||
}
|
||
|
||
.method-info-placeholder {
|
||
font-size: 0.75rem;
|
||
color: #6c757d;
|
||
font-style: italic;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Tooltip Component
|
||
* Info tooltips for method help
|
||
*/
|
||
.mpr-info-wrapper {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
position: relative;
|
||
cursor: help;
|
||
vertical-align: middle;
|
||
margin-left: 0.25rem;
|
||
}
|
||
.mpr-info-wrapper .material-icons {
|
||
font-size: 16px;
|
||
color: #6c757d;
|
||
transition: color 0.15s ease;
|
||
}
|
||
.mpr-info-wrapper:hover .material-icons {
|
||
color: #25b9d7;
|
||
}
|
||
|
||
.mpr-tooltip-fixed {
|
||
position: fixed;
|
||
background: #ffffff;
|
||
color: #1e293b;
|
||
padding: 1rem 1.5rem;
|
||
border-radius: 0.25rem;
|
||
font-size: 13px;
|
||
line-height: 1.5;
|
||
white-space: normal;
|
||
z-index: 10500;
|
||
max-width: 320px;
|
||
min-width: 180px;
|
||
text-align: left;
|
||
box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 1px 0px, rgba(64, 68, 82, 0.16) 0px 0px 0px 1px, rgba(64, 68, 82, 0.08) 0px 2px 5px 0px;
|
||
pointer-events: none;
|
||
}
|
||
.mpr-tooltip-fixed.pinned {
|
||
pointer-events: auto;
|
||
padding-right: 3rem;
|
||
}
|
||
.mpr-tooltip-fixed strong {
|
||
display: block;
|
||
margin-bottom: 0.375rem;
|
||
font-weight: 600;
|
||
color: #25b9d7;
|
||
}
|
||
.mpr-tooltip-fixed p {
|
||
margin: 0;
|
||
color: #495057;
|
||
}
|
||
.mpr-tooltip-fixed ul {
|
||
margin: 0.5rem 0 0;
|
||
padding-left: 1.25rem;
|
||
}
|
||
.mpr-tooltip-fixed ul li {
|
||
margin: 0.25rem 0;
|
||
color: #495057;
|
||
}
|
||
|
||
.mpr-tooltip-close {
|
||
position: absolute;
|
||
top: 0.375rem;
|
||
right: 0.375rem;
|
||
padding: 0.125rem;
|
||
border: none;
|
||
background: transparent;
|
||
cursor: pointer;
|
||
border-radius: 0.2rem;
|
||
line-height: 1;
|
||
transition: background-color 0.15s ease;
|
||
}
|
||
.mpr-tooltip-close .material-icons {
|
||
font-size: 16px;
|
||
color: #6c757d;
|
||
}
|
||
.mpr-tooltip-close:hover {
|
||
background: #f1f5f9;
|
||
}
|
||
.mpr-tooltip-close:hover .material-icons {
|
||
color: #334155;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Category Tree Component
|
||
* Hierarchical tree view for category selection inside dropdown
|
||
*/
|
||
.category-tree {
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.category-tree .tree-toolbar {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.25rem 0.5rem;
|
||
background: #f8fafc;
|
||
border-bottom: 1px solid #e9ecef;
|
||
flex-shrink: 0;
|
||
}
|
||
.category-tree .tree-toolbar .btn-expand-all,
|
||
.category-tree .tree-toolbar .btn-collapse-all {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.category-tree .tree-toolbar .btn-expand-all:focus,
|
||
.category-tree .tree-toolbar .btn-collapse-all:focus {
|
||
outline: none;
|
||
}
|
||
.category-tree .tree-toolbar .btn-expand-all,
|
||
.category-tree .tree-toolbar .btn-collapse-all {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 500;
|
||
color: #495057;
|
||
background: #ffffff;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.category-tree .tree-toolbar .btn-expand-all:hover,
|
||
.category-tree .tree-toolbar .btn-collapse-all:hover {
|
||
background: #f1f5f9;
|
||
border-color: #cbd5e1;
|
||
}
|
||
.category-tree .tree-toolbar .btn-expand-all i,
|
||
.category-tree .tree-toolbar .btn-collapse-all i {
|
||
font-size: 12px;
|
||
}
|
||
|
||
.category-tree .tree-items {
|
||
padding: 0;
|
||
}
|
||
|
||
.tree-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.25rem;
|
||
padding: 0.25rem 0.5rem;
|
||
cursor: pointer;
|
||
transition: background 0.15s ease-in-out;
|
||
border-radius: 0;
|
||
}
|
||
.tree-item:hover {
|
||
background: #f1f5f9;
|
||
}
|
||
.tree-item.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
.tree-item.selected .tree-name {
|
||
font-weight: 600;
|
||
color: #25b9d7;
|
||
}
|
||
.tree-item.selected .tree-checkbox {
|
||
color: #25b9d7;
|
||
}
|
||
.tree-item.selected .tree-checkbox i {
|
||
opacity: 1;
|
||
}
|
||
.tree-item.inactive {
|
||
opacity: 0.6;
|
||
}
|
||
.tree-item.inactive .tree-name {
|
||
font-style: italic;
|
||
}
|
||
.tree-item.filtered-out {
|
||
display: none;
|
||
}
|
||
.tree-item.filter-match {
|
||
background: #fff3cd;
|
||
}
|
||
.tree-item.filter-match.selected {
|
||
background: rgba(37, 185, 215, 0.1);
|
||
}
|
||
|
||
.category-tree .tree-indent {
|
||
flex-shrink: 0;
|
||
}
|
||
.category-tree .tree-toggle {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 12px;
|
||
height: 12px;
|
||
box-sizing: border-box;
|
||
color: #495057;
|
||
flex-shrink: 0;
|
||
border-radius: 0.2rem;
|
||
transition: all 0.15s ease-in-out;
|
||
cursor: pointer;
|
||
}
|
||
.category-tree .tree-toggle:hover {
|
||
background: #e2e8f0;
|
||
color: #212529;
|
||
}
|
||
.category-tree .tree-toggle.tree-leaf {
|
||
cursor: default;
|
||
visibility: hidden;
|
||
}
|
||
.category-tree .tree-toggle.tree-leaf:hover {
|
||
background: transparent;
|
||
}
|
||
.category-tree .tree-toggle i {
|
||
font-size: 10px;
|
||
transition: transform 0.15s ease-in-out;
|
||
}
|
||
.category-tree .tree-item.collapsed > .tree-toggle i {
|
||
transform: rotate(-90deg);
|
||
}
|
||
.category-tree .tree-checkbox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 12px;
|
||
height: 12px;
|
||
box-sizing: border-box;
|
||
flex-shrink: 0;
|
||
border: 1px solid #dee2e6;
|
||
border-radius: 2px;
|
||
background: #ffffff;
|
||
}
|
||
.category-tree .tree-checkbox i {
|
||
font-size: 8px;
|
||
opacity: 0;
|
||
color: #ffffff;
|
||
transition: opacity 0.15s ease-in-out;
|
||
}
|
||
.category-tree .tree-item.selected .tree-checkbox {
|
||
background: #25b9d7;
|
||
border-color: #25b9d7;
|
||
}
|
||
.category-tree .tree-item.selected .tree-checkbox i {
|
||
opacity: 1;
|
||
}
|
||
.category-tree .tree-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 12px;
|
||
height: 12px;
|
||
box-sizing: border-box;
|
||
color: #6c757d;
|
||
flex-shrink: 0;
|
||
}
|
||
.category-tree .tree-icon i {
|
||
font-size: 12px;
|
||
}
|
||
.category-tree .tree-item.selected .tree-icon {
|
||
color: #25b9d7;
|
||
}
|
||
.category-tree .tree-name {
|
||
flex: 1;
|
||
font-size: 0.875rem;
|
||
color: #212529;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.category-tree .tree-count {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
gap: 0.25rem;
|
||
min-width: 20px;
|
||
height: 20px;
|
||
padding: 0 0.5rem;
|
||
background: #25b9d7;
|
||
color: #ffffff;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
border-radius: 50rem;
|
||
cursor: pointer;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.category-tree .tree-count:hover {
|
||
transform: scale(1.05);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.category-tree .tree-count:focus {
|
||
outline: none;
|
||
box-shadow: 0 0 0 2px rgba(37, 185, 215, 0.3), 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.category-tree .tree-count.loading {
|
||
cursor: wait;
|
||
}
|
||
.category-tree .tree-count.loading i {
|
||
font-size: 10px;
|
||
animation: spin 0.6s linear infinite;
|
||
}
|
||
.category-tree .tree-count.loading:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.category-tree .tree-count.inactive, .category-tree .tree-count.no-matches {
|
||
background: #94a3b8;
|
||
cursor: default;
|
||
}
|
||
.category-tree .tree-count.inactive:hover, .category-tree .tree-count.no-matches:hover {
|
||
transform: none;
|
||
box-shadow: none;
|
||
}
|
||
.category-tree .tree-count.popover-open {
|
||
background: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
box-shadow: 0 2px 8px rgba(37, 185, 215, 0.4);
|
||
}
|
||
.category-tree .tree-count i {
|
||
font-size: 10px;
|
||
line-height: 1;
|
||
opacity: 0.8;
|
||
}
|
||
.category-tree .tree-count:hover i {
|
||
opacity: 1;
|
||
}
|
||
.category-tree .tree-count .preview-count {
|
||
font-weight: 700;
|
||
}
|
||
.category-tree .tree-count {
|
||
height: 18px;
|
||
min-width: 18px;
|
||
padding: 0 0.5rem;
|
||
}
|
||
.category-tree .tree-count i {
|
||
font-size: 10px;
|
||
}
|
||
.category-tree .tree-count.clickable.loading {
|
||
pointer-events: none;
|
||
}
|
||
.category-tree .tree-count.clickable.loading i {
|
||
animation: spin 1s linear infinite;
|
||
}
|
||
.category-tree .tree-count.clickable.popover-open {
|
||
background: rgb(29.5119047619, 147.5595238095, 171.4880952381);
|
||
}
|
||
.category-tree .btn-select-children {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.category-tree .btn-select-children:focus {
|
||
outline: none;
|
||
}
|
||
.category-tree .btn-select-children {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 12px;
|
||
height: 12px;
|
||
box-sizing: border-box;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
opacity: 0.3;
|
||
transition: all 0.15s ease-in-out;
|
||
flex-shrink: 0;
|
||
}
|
||
.category-tree .btn-select-children i {
|
||
font-size: 14px;
|
||
}
|
||
.category-tree .btn-select-children:hover {
|
||
color: #25b9d7;
|
||
opacity: 1;
|
||
}
|
||
.category-tree .tree-item:hover .btn-select-children {
|
||
opacity: 0.6;
|
||
}
|
||
.category-tree .tree-badge {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
padding: 0.125rem 0.25rem;
|
||
font-size: 9px;
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.025em;
|
||
border-radius: 0.2rem;
|
||
flex-shrink: 0;
|
||
}
|
||
.category-tree .tree-badge.inactive {
|
||
color: #fab000;
|
||
background: #fff3cd;
|
||
}
|
||
.category-tree .tree-children {
|
||
display: block;
|
||
}
|
||
.category-tree .tree-children.filter-expanded {
|
||
display: block !important;
|
||
}
|
||
.category-tree .tree-item.collapsed + .tree-children {
|
||
display: none;
|
||
}
|
||
.category-tree .tree-item.filtered-out {
|
||
display: none !important;
|
||
}
|
||
|
||
.category-tree .tree-loading,
|
||
.category-tree .dropdown-empty,
|
||
.category-tree .dropdown-error {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
padding: 2rem;
|
||
color: #6c757d;
|
||
font-size: 0.875rem;
|
||
}
|
||
.category-tree .tree-loading i,
|
||
.category-tree .dropdown-empty i,
|
||
.category-tree .dropdown-error i {
|
||
margin-right: 0.5rem;
|
||
}
|
||
|
||
.category-tree .dropdown-error {
|
||
color: #dc3545;
|
||
}
|
||
|
||
.es-search-dropdown.view-tree .dropdown-results {
|
||
padding: 0;
|
||
}
|
||
.es-search-dropdown.view-tree .category-tree {
|
||
max-height: 100%;
|
||
overflow-y: auto;
|
||
}
|
||
.es-search-dropdown.view-tree .category-tree::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.es-search-dropdown.view-tree .category-tree::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.es-search-dropdown.view-tree .category-tree::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.es-search-dropdown.view-tree .category-tree::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
.es-search-dropdown.view-tree .tree-items {
|
||
max-height: calc(100% - 40px);
|
||
overflow-y: auto;
|
||
}
|
||
.es-search-dropdown.view-tree .tree-items::-webkit-scrollbar {
|
||
width: 6px;
|
||
height: 6px;
|
||
}
|
||
.es-search-dropdown.view-tree .tree-items::-webkit-scrollbar-track {
|
||
background: #f8f9fa;
|
||
border-radius: 3px;
|
||
}
|
||
.es-search-dropdown.view-tree .tree-items::-webkit-scrollbar-thumb {
|
||
background: #dee2e6;
|
||
border-radius: 3px;
|
||
}
|
||
.es-search-dropdown.view-tree .tree-items::-webkit-scrollbar-thumb:hover {
|
||
background: #ced4da;
|
||
}
|
||
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
/**
|
||
* Validation Toast Component
|
||
* Error notifications for selection conflicts
|
||
*/
|
||
.es-validation-toast {
|
||
display: flex;
|
||
align-items: flex-start;
|
||
gap: 0.5rem;
|
||
padding: 1rem;
|
||
background: #ffffff;
|
||
border: 1px solid #dc3545;
|
||
border-left: 4px solid #dc3545;
|
||
border-radius: 0.25rem;
|
||
box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175);
|
||
max-width: 400px;
|
||
animation: es-toast-slide-in 0.2s ease-out;
|
||
}
|
||
.es-validation-toast .es-toast-icon {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 24px;
|
||
height: 24px;
|
||
color: #dc3545;
|
||
flex-shrink: 0;
|
||
}
|
||
.es-validation-toast .es-toast-icon i {
|
||
font-size: 18px;
|
||
}
|
||
.es-validation-toast .es-toast-content {
|
||
flex: 1;
|
||
min-width: 0;
|
||
}
|
||
.es-validation-toast .es-toast-title {
|
||
font-size: 0.875rem;
|
||
font-weight: 600;
|
||
color: #dc3545;
|
||
margin-bottom: 2px;
|
||
}
|
||
.es-validation-toast .es-toast-message {
|
||
font-size: 0.75rem;
|
||
color: #495057;
|
||
line-height: 1.4;
|
||
}
|
||
.es-validation-toast .es-toast-close {
|
||
padding: 0;
|
||
margin: 0;
|
||
background: none;
|
||
border: none;
|
||
cursor: pointer;
|
||
font: inherit;
|
||
color: inherit;
|
||
}
|
||
.es-validation-toast .es-toast-close:focus {
|
||
outline: none;
|
||
}
|
||
.es-validation-toast .es-toast-close {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 20px;
|
||
height: 20px;
|
||
color: #6c757d;
|
||
border-radius: 0.2rem;
|
||
flex-shrink: 0;
|
||
transition: all 0.15s ease-in-out;
|
||
}
|
||
.es-validation-toast .es-toast-close:hover {
|
||
background: #f1f5f9;
|
||
color: #212529;
|
||
}
|
||
.es-validation-toast .es-toast-close i {
|
||
font-size: 12px;
|
||
}
|
||
|
||
@keyframes es-toast-slide-in {
|
||
from {
|
||
opacity: 0;
|
||
transform: translateY(-10px);
|
||
}
|
||
to {
|
||
opacity: 1;
|
||
transform: translateY(0);
|
||
}
|
||
}
|
||
/**
|
||
* Entity Selector Styles
|
||
* @package prestashop-entity-selector
|
||
* @version 2.0.0
|
||
*
|
||
* Compiles to: assets/css/admin/entity-selector.css
|
||
*/
|
||
.mpr-replace-body {
|
||
padding: 0.5rem 0;
|
||
}
|
||
|
||
.mpr-replace-message {
|
||
margin: 0 0 1rem;
|
||
color: #495057;
|
||
font-size: 0.875rem;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.mpr-replace-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem 1rem;
|
||
border-radius: 0.25rem;
|
||
border: 1px solid #dee2e6;
|
||
background: #ffffff;
|
||
}
|
||
|
||
.mpr-replace-current {
|
||
border-color: #dc3545;
|
||
background: #f8d7da;
|
||
}
|
||
.mpr-replace-current .mpr-replace-label {
|
||
color: #bd2130;
|
||
background: rgba(220, 53, 69, 0.12);
|
||
}
|
||
|
||
.mpr-replace-new {
|
||
border-color: #70b580;
|
||
background: #d4edda;
|
||
}
|
||
.mpr-replace-new .mpr-replace-label {
|
||
color: #1e7e34;
|
||
background: rgba(112, 181, 128, 0.12);
|
||
}
|
||
|
||
.mpr-replace-label {
|
||
flex-shrink: 0;
|
||
padding: 2px 0.5rem;
|
||
border-radius: 0.2rem;
|
||
font-size: 0.75rem;
|
||
font-weight: 600;
|
||
text-transform: uppercase;
|
||
letter-spacing: 0.03em;
|
||
}
|
||
|
||
.mpr-replace-value {
|
||
font-size: 0.875rem;
|
||
font-weight: 500;
|
||
color: #212529;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
text-overflow: ellipsis;
|
||
min-width: 0;
|
||
}
|
||
|
||
.mpr-replace-arrow {
|
||
display: flex;
|
||
justify-content: center;
|
||
padding: 0.25rem 0;
|
||
color: #adb5bd;
|
||
}
|
||
.mpr-replace-arrow .material-icons {
|
||
font-size: 20px;
|
||
}
|
||
|
||
.loading-count {
|
||
opacity: 0.5;
|
||
transition: opacity 0.15s;
|
||
}
|
||
|
||
.tab-badge.loading {
|
||
opacity: 0.5;
|
||
transition: opacity 0.15s;
|
||
}
|
||
|
||
.entity-selector-blocks-content,
|
||
.condition-trait-body,
|
||
.group-modifiers-content {
|
||
transition: max-height 0.2s ease-out, opacity 0.2s ease-out;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.entity-selector-blocks-content:not(.es-expanded),
|
||
.condition-trait-body:not(.es-expanded),
|
||
.group-modifiers-content:not(.es-expanded) {
|
||
max-height: 0 !important;
|
||
opacity: 0;
|
||
pointer-events: none;
|
||
}
|
||
|
||
.entity-selector-blocks-content.es-expanded,
|
||
.condition-trait-body.es-expanded,
|
||
.group-modifiers-content.es-expanded {
|
||
max-height: 2000px;
|
||
opacity: 1;
|
||
pointer-events: auto;
|
||
}
|
||
|
||
.es-empty-state,
|
||
.chips-empty-state {
|
||
display: block;
|
||
padding: 0.75rem 1rem;
|
||
color: #94a3b8;
|
||
font-size: 0.8rem;
|
||
font-style: italic;
|
||
text-align: center;
|
||
}
|
||
/*# sourceMappingURL=entity-selector.css.map */
|