/* QGabarito | confirmação profissional reutilizável — UX Importação v1 */
html.qg-confirm-open { overflow: hidden; }

.qg-confirm-backdrop {
    position: fixed;
    inset: 0;
    z-index: 2400;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(9, 20, 36, .56);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}
.qg-confirm-backdrop[hidden] { display: none !important; }

.qg-confirm-dialog {
    width: min(560px, 100%);
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--warn, #92400e) 30%, var(--border, #e4e7ec));
    border-radius: 18px;
    background: var(--surface, #fff);
    color: var(--text, #172033);
    box-shadow: 0 26px 72px rgba(9, 20, 36, .32);
    transform-origin: center;
}

.qg-confirm-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px;
    align-items: center;
    padding: 20px 22px 16px;
    background: color-mix(in srgb, var(--warn-bg, #fffbeb) 88%, var(--surface, #fff));
    border-bottom: 1px solid color-mix(in srgb, var(--warn, #92400e) 22%, var(--border, #e4e7ec));
}

.qg-confirm-dialog[data-tone="danger"] {
    border-color: color-mix(in srgb, var(--bad, #b42318) 30%, var(--border, #e4e7ec));
}
.qg-confirm-dialog[data-tone="danger"] .qg-confirm-header {
    background: color-mix(in srgb, var(--bad-bg, #fef3f2) 84%, var(--surface, #fff));
    border-bottom-color: color-mix(in srgb, var(--bad, #b42318) 20%, var(--border, #e4e7ec));
}

.qg-confirm-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: var(--bad, #b42318);
    color: #fff;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--bad, #b42318) 23%, transparent);
    font-size: 1.08rem;
    font-weight: 950;
    line-height: 1;
}

.qg-confirm-copy h2 {
    margin: 0;
    color: var(--text, #172033);
    font-size: clamp(1.08rem, 2vw, 1.24rem);
    font-weight: 850;
    letter-spacing: -.015em;
}
.qg-confirm-eyebrow {
    display: block;
    margin-bottom: 4px;
    color: var(--warn, #92400e);
    font-size: .73rem;
    font-weight: 900;
    letter-spacing: .075em;
    text-transform: uppercase;
}
.qg-confirm-dialog[data-tone="danger"] .qg-confirm-eyebrow { color: var(--bad, #b42318); }

.qg-confirm-body {
    padding: 18px 22px 4px;
}
.qg-confirm-body p {
    margin: 0;
    color: var(--muted, #667085);
    font-size: .96rem;
    line-height: 1.65;
}

.qg-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 18px 22px 22px;
}
.qg-confirm-actions button {
    min-height: 43px;
    border-radius: 10px;
    padding: 9px 16px;
    font: inherit;
    font-weight: 850;
    cursor: pointer;
}
.qg-confirm-cancel {
    border: 1px solid var(--border, #e4e7ec);
    background: var(--surface, #fff);
    color: var(--text, #172033);
}
.qg-confirm-accept {
    border: 1px solid color-mix(in srgb, var(--bad, #b42318) 52%, var(--border, #e4e7ec));
    background: var(--bad, #b42318);
    color: #fff;
    box-shadow: 0 7px 16px color-mix(in srgb, var(--bad, #b42318) 18%, transparent);
}
.qg-confirm-actions button:hover { filter: brightness(.97); }
.qg-confirm-actions button:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--brand, #173b67) 24%, transparent);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: no-preference) {
    .qg-confirm-dialog { animation: qgConfirmIn .16s ease-out; }
    @keyframes qgConfirmIn {
        from { opacity: 0; transform: translateY(8px) scale(.985); }
        to { opacity: 1; transform: translateY(0) scale(1); }
    }
}

@media (max-width: 640px) {
    .qg-confirm-backdrop { padding: 14px; }
    .qg-confirm-header { padding: 18px 18px 15px; }
    .qg-confirm-body { padding: 16px 18px 2px; }
    .qg-confirm-actions { display: grid; grid-template-columns: 1fr; padding: 16px 18px 18px; }
    .qg-confirm-actions button { width: 100%; }
}
