/* ============================================
   Status control — same shape/size as .me5rine-lab-form-button.
   Color-only variants: -success, -warning, -error, -info.
   ============================================ */

.me5rine-lab-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35em;
    box-sizing: border-box;
    margin: 0;
    padding: var(--me5rine-lab-control-padding-y, 0.375rem) var(--me5rine-lab-control-padding-x, 0.75rem);
    min-height: auto;
    border: 1px solid transparent;
    border-radius: var(--me5rine-lab-control-radius, var(--me5rine-lab-radius-sm, 6px));
    background: var(--me5rine-lab-bg-secondary, #F9FAFB);
    color: var(--me5rine-lab-text, #11161E);
    font-family: var(--me5rine-lab-font);
    font-size: var(--me5rine-lab-control-font-size, 0.8125rem);
    font-weight: var(--me5rine-lab-control-font-weight, 600);
    line-height: var(--me5rine-lab-control-line-height, 1.3);
    letter-spacing: normal;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    white-space: nowrap;
    vertical-align: middle;
    cursor: default;
    pointer-events: none;
}

.me5rine-lab-status::before {
    content: "";
    flex-shrink: 0;
    width: 0.95em;
    height: 0.95em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3C/svg%3E") center / contain no-repeat;
}

.me5rine-lab-status:has(svg)::before {
    display: none;
}

.me5rine-lab-status svg {
    width: 0.95em;
    height: 0.95em;
    flex-shrink: 0;
}

.me5rine-lab-status-success {
    background: color-mix(in srgb, var(--me5rine-lab-success, #4CAF50) 16%, var(--me5rine-lab-bg, #fff));
    color: var(--me5rine-lab-status-success-text, var(--me5rine-lab-success, #4CAF50));
    border-color: color-mix(in srgb, var(--me5rine-lab-success, #4CAF50) 32%, transparent);
}

.me5rine-lab-status-success::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.2 10.8 15 16.2 9'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12.2 10.8 15 16.2 9'/%3E%3C/svg%3E") center / contain no-repeat;
}

.me5rine-lab-status-warning {
    background: color-mix(in srgb, var(--me5rine-lab-warning, #FF9800) 16%, var(--me5rine-lab-bg, #fff));
    color: var(--me5rine-lab-status-warning-text, var(--me5rine-lab-warning, #FF9800));
    border-color: color-mix(in srgb, var(--me5rine-lab-warning, #FF9800) 32%, transparent);
}

.me5rine-lab-status-error {
    background: color-mix(in srgb, var(--me5rine-lab-error, #F44336) 16%, var(--me5rine-lab-bg, #fff));
    color: var(--me5rine-lab-status-error-text, var(--me5rine-lab-error, #F44336));
    border-color: color-mix(in srgb, var(--me5rine-lab-error, #F44336) 32%, transparent);
}

.me5rine-lab-status-info {
    background: color-mix(in srgb, var(--me5rine-lab-info, #2196F3) 16%, var(--me5rine-lab-bg, #fff));
    color: var(--me5rine-lab-status-info-text, var(--me5rine-lab-info, #2196F3));
    border-color: color-mix(in srgb, var(--me5rine-lab-info, #2196F3) 32%, transparent);
}