/*
 * Visual copiado do padrão nativo de extras do MyD Delivery Pro (barra
 * cinza, checkbox simples, preço em negrito) — não é design novo, é o
 * mesmo que o MyD já usa, pra não destoar visualmente dentro do popup.
 * !important generalizado porque roda dentro de tema + Elementor
 * (convenção já validada na Fase 1).
 */

.ds-dash-grupos-popup {
    margin-top: 12px !important;
}

.ds-dash-grupo-extra {
    margin-bottom: 4px !important;
}

.ds-dash-grupo-extra-titulo {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    background: #e9e9e9 !important;
    color: #333333 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    padding: 11px 10px !important;
    margin: 0 !important;
}

.ds-dash-grupo-extra-obrigatorio {
    color: #d93025 !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    letter-spacing: .02em !important;
    flex-shrink: 0 !important;
}

.ds-dash-grupo-extra-lista {
    padding: 0 2px !important;
}

.ds-dash-opcao-linha {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
    padding: 13px 4px !important;
    border-bottom: 1px solid #ececec !important;
    font-size: 16px !important;
    color: #333333 !important;
    cursor: pointer !important;
}

.ds-dash-grupo-extra-lista .ds-dash-opcao-linha:last-child {
    border-bottom: none !important;
}

.ds-dash-opcao-imagem {
    width: 44px !important;
    height: 44px !important;
    border-radius: 8px !important;
    object-fit: cover !important;
    flex-shrink: 0 !important;
    background: #f2f2f2 !important;
}

.ds-dash-opcao-texto {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
}

.ds-dash-opcao-nome {
    font-weight: 400 !important;
    font-size: 16px !important;
}

.ds-dash-opcao-preco {
    font-weight: 700 !important;
    color: #1a1a1a !important;
    font-size: 14px !important;
}

.ds-dash-opcao-linha input[type="checkbox"] {
    width: 22px !important;
    height: 22px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    accent-color: #333333 !important;
}

.ds-dash-opcao-stepper {
    cursor: default !important;
}

.ds-dash-stepper {
    display: flex !important;
    align-items: center !important;
    gap: 0 !important;
    border: 1px solid #d8d8d8 !important;
    border-radius: 9px !important;
    overflow: hidden !important;
    flex-shrink: 0 !important;
}

.ds-dash-stepper button {
    width: 36px !important;
    height: 36px !important;
    border: none !important;
    background: #fafafa !important;
    color: #333333 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    line-height: 1 !important;
}

.ds-dash-stepper button:disabled {
    color: #cccccc !important;
    cursor: not-allowed !important;
}

.ds-dash-stepper-qtd {
    width: 28px !important;
    text-align: center !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    color: #333333 !important;
    background: #ffffff !important;
}