#contact .contact-feedback {
    --feedback-accent: #8befcc;
    position: relative; display: block; padding: 24px 22px 24px 78px; margin: 0 0 24px;
    border: 1px solid #8befcc66; border-inline-start: 4px solid var(--feedback-accent);
    border-radius: 16px; background: #102c32; color: #f0fff9;
    box-shadow: 0 12px 32px #0002; font-size: 1rem; font-weight: 700; line-height: 1.65;
    overflow-wrap: anywhere; animation: contact-feedback-in .35s ease-out both;
}
#contact .contact-feedback:empty { display: none; }
#contact .contact-feedback::before {
    content: '✓'; position: absolute; left: 20px; top: 50%; transform: translateY(-50%);
    width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%;
    border: 2px solid var(--feedback-accent); color: var(--feedback-accent); font-size: 24px;
}
#contact .contact-feedback[data-state="error"] { --feedback-accent: #ffbf98; border-color: #ffbf9866; background: #382923; }
#contact .contact-feedback[data-state="error"]::before { content: '!'; }
#contact .contact-feedback[data-state="loading"] { --feedback-accent: #9ad9f6; border-color: #9ad9f666; }
#contact .contact-feedback[data-state="loading"]::before { content: ''; width: 29px; height: 29px; border-color: #9ad9f640; border-top-color: var(--feedback-accent); animation: contact-feedback-spin .8s linear infinite; }
#contact .contact-feedback:focus-visible { outline: 2px solid var(--feedback-accent); outline-offset: 4px; }
#contact .contact-form-card[aria-busy="true"] #btnGonder { opacity: .7; cursor: wait; }
html[data-theme="white"] #contact .contact-feedback { --feedback-accent: #087b66; background: #edfaf5; color: #124b43; border-color: #087b6640; }
html[data-theme="white"] #contact .contact-feedback[data-state="error"] { --feedback-accent: #ac4d19; background: #fff5eb; color: #713813; border-color: #ac4d1940; }
html[data-theme="white"] #contact .contact-feedback[data-state="loading"] { --feedback-accent: #126e9b; background: #eef8ff; color: #164c69; }
@keyframes contact-feedback-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes contact-feedback-spin { to { transform: translateY(-50%) rotate(360deg); } }
@media (max-width: 575px) { #contact .contact-feedback { padding: 18px 14px 18px 63px; font-size: .94rem; } #contact .contact-feedback::before { left: 14px; width: 32px; height: 32px; } }
@media (prefers-reduced-motion: reduce) { #contact .contact-feedback, #contact .contact-feedback::before { animation: none !important; } }
