/* =============================================================
   COMPONENT / CONDITION-CLOUD
   
   Облако применённых фильтров-условий.
   По умолчанию скрыто, показывается когда есть условия.
   ============================================================= */

section.condition-cloud {
    display: none;
    position: relative;
}

/* Показать — через .show или .flex */
section.condition-cloud.show,
section.condition-cloud.flex {
    display: block;
}

section.condition-cloud span.condition {
    display: inline-flex;
    gap: var(--space-1);
    align-items: center;
    background-color: var(--gray-100);
    color: white;
    border-radius: var(--radius-full);
    border: 1px solid var(--border-default);
    padding: var(--space-1) var(--space-1) var(--space-1) var(--space-3);
    margin: 0 var(--space-1) var(--space-1) 0;
}

section.condition-cloud span.condition:hover,
section.condition-cloud span.condition:focus {
    background-color: var(--gray-100);
}

section.condition-cloud span.condition svg {
    stroke: white;
    cursor: pointer;
}