/* Temas deste componente. Os VARs PHP são resolvidos no rebuild. */
:root, [data-theme="light"] {
    --whatsapp-contact-popup-var_font_color: _VAR_font_color_;
    --whatsapp-contact-popup-var_others: _VAR_others_;
    --whatsapp-contact-popup-var_others_dark: _VAR_others_dark_;
    --whatsapp-contact-popup-bg-color: #ffffff;
    --whatsapp-contact-popup-site-others: var(--whatsapp-contact-popup-var_others);
    --whatsapp-contact-popup-site-others-dark: var(--whatsapp-contact-popup-var_others_dark);
    --whatsapp-contact-popup-site-font-color: var(--whatsapp-contact-popup-var_font_color);
    --whatsapp-contact-popup-color-border-333333: #333333;
    --whatsapp-contact-popup-color-border-cccccc: #cccccc;
    --whatsapp-contact-popup-color-shadow-rgba-0-0-0--25: rgba(0,0,0,.25);
    --whatsapp-contact-popup-color-surface-cccccc: #cccccc;
    --whatsapp-contact-popup-color-surface-f5f5f5: #f5f5f5;
    --whatsapp-contact-popup-color-surface-ffffff: var(--whatsapp-contact-popup-bg-color);
    --whatsapp-contact-popup-color-surface-rgba-0-0-0--6: rgba(0,0,0,.6);
    --whatsapp-contact-popup-color-text-b00020: #b00020;
    --whatsapp-contact-popup-color-text-cccccc: #cccccc;
    --whatsapp-contact-popup-color-text-ffffff: #ffffff;
}

[data-theme="dark"] {
    --whatsapp-contact-popup-var_font_color: color-mix(in srgb, _VAR_font_color_ 10%, #ffffff 90%);
    --whatsapp-contact-popup-var_others: _VAR_others_;
    --whatsapp-contact-popup-var_others_dark: _VAR_others_dark_;
    --whatsapp-contact-popup-bg-color: #151a23;
    --whatsapp-contact-popup-color-border-cccccc: #465369;
    --whatsapp-contact-popup-color-surface-cccccc: #303b4c;
    --whatsapp-contact-popup-color-surface-f5f5f5: #202938;
    --whatsapp-contact-popup-color-surface-ffffff: var(--whatsapp-contact-popup-bg-color);
}

.form.more-info .captcha-contact-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; box-sizing: border-box; width: 100%; margin: 8px 0; }
.form.more-info .captcha-contact-row img { display: block; flex: 0 0 150px; width: 150px; height: 65px; max-width: 100%; float: none !important; margin: 0 !important; object-fit: contain; }
.form.more-info .captcha-contact-row .captcha-field { flex: 1 1 170px; min-width: 0; width: auto !important; height: 50px; box-sizing: border-box; float: none !important; margin: 0 !important; padding: 10px 12px; }
.form.more-info .captcha-contact-row .validation-text { display: none; position: static; flex: 0 0 100%; width: 100%; margin: 0; }
.form.more-info .captcha-contact-row .validation-text.visible { display: block; }
.whatsapp-contact-modal[hidden] { display: none !important; }
.whatsapp-contact-modal { position: fixed; inset: 0; z-index: 2147483647; display: flex; align-items: center; justify-content: center; padding: 16px; box-sizing: border-box; background: var(--whatsapp-contact-popup-color-surface-rgba-0-0-0--6); }
.whatsapp-contact-panel { position: relative; width: min(460px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; box-sizing: border-box; padding: 24px; background: var(--whatsapp-contact-popup-color-surface-ffffff); border-radius: 8px; box-shadow: 0 12px 35px var(--whatsapp-contact-popup-color-shadow-rgba-0-0-0--25); }
.whatsapp-contact-panel h3 { margin: 0 36px 8px 0; color: var(--whatsapp-contact-popup-site-font-color, var(--whatsapp-contact-popup-color-text-cccccc)); font-size: 20px; }
.whatsapp-contact-close { position: absolute; top: 8px; right: 12px; border: 0; background: none; color: var(--whatsapp-contact-popup-site-font-color, var(--whatsapp-contact-popup-color-text-cccccc)); font-size: 30px; line-height: 1; cursor: pointer; }
.whatsapp-contact-panel p { margin: 0 0 16px; color: var(--whatsapp-contact-popup-site-font-color, var(--whatsapp-contact-popup-color-text-cccccc)); font-size: 14px; line-height: 1.4; }
.whatsapp-contact-panel [hidden] { display: none !important; }
.whatsapp-contact-panel .whatsapp-contact-error { color: var(--whatsapp-contact-popup-color-text-b00020); }
.whatsapp-contact-phone-form label { display: block; margin-bottom: 6px; color: var(--whatsapp-contact-popup-site-font-color, var(--whatsapp-contact-popup-color-text-cccccc)); font-size: 14px; }
.whatsapp-contact-phone-form input[type="tel"] { display: block; box-sizing: border-box; width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid var(--whatsapp-contact-popup-color-border-cccccc); border-radius: 3px; background: var(--whatsapp-contact-popup-color-surface-ffffff); color: var(--whatsapp-contact-popup-site-font-color, var(--whatsapp-contact-popup-color-text-cccccc)); font: inherit; font-size: 15px; }
.whatsapp-contact-panel :focus-visible { outline: 2px solid var(--whatsapp-contact-popup-site-others, var(--whatsapp-contact-popup-color-border-333333)); outline-offset: 3px; }
.whatsapp-contact-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; padding-top: 18px; }
.whatsapp-contact-actions button, .whatsapp-contact-actions a { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 9px 16px; box-sizing: border-box; border: 1px solid var(--whatsapp-contact-popup-site-others, var(--whatsapp-contact-popup-color-border-cccccc)); border-radius: 4px; background: var(--whatsapp-contact-popup-site-others, var(--whatsapp-contact-popup-color-surface-cccccc)); color: var(--whatsapp-contact-popup-color-text-ffffff); font: inherit; font-size: 14px; text-decoration: none; cursor: pointer; }
.whatsapp-contact-actions .whatsapp-contact-confirm { order: 2; }
.whatsapp-contact-actions .whatsapp-contact-direct { order: 1; }
.whatsapp-contact-actions .whatsapp-contact-yes { order: 3; }
.whatsapp-contact-actions .whatsapp-contact-no { order: 2; background: var(--whatsapp-contact-popup-color-surface-ffffff); color: var(--whatsapp-contact-popup-site-font-color, var(--whatsapp-contact-popup-color-text-cccccc)); }
.whatsapp-contact-actions button:disabled { opacity: .6; cursor: default; }
.whatsapp-contact-actions button:hover, .whatsapp-contact-actions a:hover { border-color: var(--whatsapp-contact-popup-site-others-dark, var(--whatsapp-contact-popup-color-border-cccccc)); background: var(--whatsapp-contact-popup-site-others-dark, var(--whatsapp-contact-popup-color-surface-cccccc)); color: var(--whatsapp-contact-popup-color-text-ffffff); }
.whatsapp-contact-actions .whatsapp-contact-direct { border-color: var(--whatsapp-contact-popup-color-border-cccccc); background: var(--whatsapp-contact-popup-color-surface-ffffff); color: var(--whatsapp-contact-popup-site-font-color, var(--whatsapp-contact-popup-color-text-cccccc)); }
.whatsapp-contact-actions .whatsapp-contact-direct:hover { border-color: var(--whatsapp-contact-popup-site-others-dark, var(--whatsapp-contact-popup-color-border-cccccc)); background: var(--whatsapp-contact-popup-color-surface-f5f5f5); color: var(--whatsapp-contact-popup-site-others-dark, var(--whatsapp-contact-popup-color-text-cccccc)); }
@media (max-width: 480px) {
    .whatsapp-contact-actions button, .whatsapp-contact-actions a { width: 100%; }
    .whatsapp-contact-actions .whatsapp-contact-confirm { order: 1; }
    .whatsapp-contact-actions .whatsapp-contact-direct { order: 2; }
    .whatsapp-contact-actions .whatsapp-contact-yes { order: 0; }
    .whatsapp-contact-actions .whatsapp-contact-no { order: 1; }
}