/* Scoped to this integration, using the LP's icon, palette and form layout. */
#cordel-wa-open, #cordel-wa-dialog { --cordel-wa-green: #00b81a; font-family: Nunito, sans-serif; box-sizing: border-box; }
#cordel-wa-open { position: fixed; right: max(12px, env(safe-area-inset-right)); bottom: max(12px, env(safe-area-inset-bottom)); z-index: 9990; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 50%; background: var(--cordel-wa-green); color: white; cursor: pointer; box-shadow: 0 14px 30px -10px rgba(0,184,26,.6); transition: transform .2s; }
#cordel-wa-open::before { content: ''; position: absolute; inset: -3px; border-radius: 50%; background: var(--cordel-wa-green); opacity: .4; animation: cordel-wa-pulse 2s ease-out infinite; z-index: -1; }
#cordel-wa-open:hover { transform: scale(1.08); background: #009e16; }
#cordel-wa-open .cordel-wa-mark { width: 22px; height: 22px; }
#cordel-wa-open .cordel-wa-mark, #cordel-wa-dialog .cordel-wa-mark { filter: brightness(0) invert(1); display: block; }
#cordel-wa-open:focus-visible, #cordel-wa-dialog button:focus-visible, #cordel-wa-dialog a:focus-visible { outline: 3px solid #1d3850; outline-offset: 4px; }
#cordel-wa-open[hidden], #cordel-wa-dialog [hidden] { display: none !important; }
#cordel-wa-dialog, #cordel-wa-dialog * { box-sizing: border-box; }
#cordel-wa-dialog { position: fixed; inset: 0; margin: auto; padding: 0; border: 0; border-radius: 14px; width: calc(100% - 24px); max-width: 580px; max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px); background: white; color: #1d3850; box-shadow: 0 25px 80px rgba(0,0,0,.28); overflow: hidden; z-index: 10000; }
#cordel-wa-dialog:not([open]) { display: none; }
#cordel-wa-dialog[open] { display: flex; flex-direction: column; }
#cordel-wa-dialog::backdrop { background: rgba(0,0,0,.8); }
#cordel-wa-dialog .cordel-wa-header { display: flex; align-items: center; gap: 14px; padding: 20px 26px; background: var(--cordel-wa-green); color: white; flex-shrink: 0; }
#cordel-wa-dialog .cordel-wa-header > .cordel-wa-mark { width: 36px; height: 36px; flex-shrink: 0; }
#cordel-wa-title { font-family: inherit; font-size: 18px; font-weight: 800; line-height: 1.16; color: white; margin: 0 0 6px; padding: 0; }
#cordel-wa-description { color: white; font-family: inherit; font-size: 12.7px; line-height: 1.4; margin: 0; padding: 0; }
#cordel-wa-dialog .cordel-wa-close { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 36px; height: 36px; margin: 0 -8px 0 auto; padding: 0; border: 0; border-radius: 50%; background: transparent; color: white; font: 300 30px/1 Arial, sans-serif; cursor: pointer; }
#cordel-wa-dialog .cordel-wa-close:hover { background: rgba(255,255,255,.18); }
#cordel-wa-dialog .cordel-wa-body { padding: 26px; overflow-y: auto; overscroll-behavior: contain; min-height: 0; }
#cordel-wa-form { margin: 0; padding: 0; display: grid; gap: 10px; text-align: left; }
#cordel-wa-dialog .cordel-wa-field { position: relative; min-width: 0; }
#cordel-wa-dialog .cordel-wa-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 10px; }
#cordel-wa-dialog .cordel-wa-field input, #cordel-wa-dialog .cordel-wa-field select, #cordel-wa-dialog .cordel-wa-field textarea { display: block; width: 100%; height: 36px; margin: 0; padding: 8px 12px 8px 34px; border: 1px solid #d4d4d4; border-radius: 4px; background: white; color: #4a5d72; font: 400 12.5px/1.4 Nunito, sans-serif; box-shadow: none; outline: none; transition: border-color .2s; }
#cordel-wa-dialog .cordel-wa-field select { appearance: none; padding-right: 24px; color: #596d81; cursor: pointer; text-overflow: ellipsis; }
#cordel-wa-dialog .cordel-wa-field textarea { height: 96px; min-height: 96px; resize: vertical; }
#cordel-wa-dialog .cordel-wa-field label { position: absolute; top: 9px; left: 27px; margin: 0; padding: 0 6px; background: white; font: 400 12.5px/1.4 Nunito, sans-serif; color: #596d81; transform-origin: left; transition: transform .2s, color .2s; pointer-events: none; }
#cordel-wa-dialog .cordel-wa-field input:focus, #cordel-wa-dialog .cordel-wa-field select:focus, #cordel-wa-dialog .cordel-wa-field textarea:focus { border-color: var(--cordel-wa-green); box-shadow: 0 0 0 1px var(--cordel-wa-green); }
#cordel-wa-dialog .cordel-wa-field input:focus + label, #cordel-wa-dialog .cordel-wa-field input:not(:placeholder-shown) + label, #cordel-wa-dialog .cordel-wa-field textarea:focus + label, #cordel-wa-dialog .cordel-wa-field textarea:not(:placeholder-shown) + label { transform: translateY(-17px) scale(.82); color: #087625; }
#cordel-wa-dialog .cordel-wa-select label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#cordel-wa-dialog .cordel-wa-select::after { content: ''; position: absolute; top: 14px; right: 12px; width: 6px; height: 6px; border-right: 1.5px solid #7a8b9e; border-bottom: 1.5px solid #7a8b9e; transform: rotate(45deg); pointer-events: none; }
#cordel-wa-dialog .cordel-wa-field-icon { position: absolute; left: 12px; top: 12px; width: 12px; height: 12px; opacity: .45; pointer-events: none; }
#cordel-wa-dialog .cordel-wa-submit { display: block; width: 100%; border: 0; border-radius: 999px; margin: 2px 0 0; padding: 14px 22px; color: white; background: var(--cordel-wa-green); cursor: pointer; font: 800 15px/1.4 Nunito, sans-serif; text-transform: uppercase; letter-spacing: .4px; transition: background .2s, transform .2s; }
#cordel-wa-dialog .cordel-wa-submit:hover { background: #009e16; transform: translateY(-2px); }
#cordel-wa-dialog .cordel-wa-submit:disabled { cursor: wait; opacity: .7; transform: none; }
#cordel-wa-dialog .cordel-wa-status { padding: 0; margin: 0; color: #087625; font: 600 14px/1.5 Nunito, sans-serif; }
#cordel-wa-dialog .cordel-wa-status.cordel-wa-error { color: #b42318; }
#cordel-wa-dialog .cordel-wa-continue { display: block; text-align: center; color: #087625; text-decoration: underline; font: 700 14px/1.5 Nunito, sans-serif; }
#cordel-wa-dialog .cordel-wa-honey { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@keyframes cordel-wa-pulse { 0% { transform: scale(1); opacity: .4; } 100% { transform: scale(1.55); opacity: 0; } }
@media (min-width: 450px) { #cordel-wa-open { right: 14px; bottom: 14px; width: 50px; height: 50px; } #cordel-wa-open .cordel-wa-mark { width: 24px; height: 24px; } }
@media (min-width: 768px) { #cordel-wa-open { right: 18px; bottom: 18px; width: 54px; height: 54px; } #cordel-wa-open .cordel-wa-mark { width: 27px; height: 27px; } }
@media (min-width: 1024px) { #cordel-wa-open { right: 24px; bottom: 24px; width: 60px; height: 60px; } #cordel-wa-open .cordel-wa-mark { width: 30px; height: 30px; } }
@media (max-width: 600px) {
    #cordel-wa-dialog .cordel-wa-header { padding: 18px; gap: 12px; }
    #cordel-wa-dialog .cordel-wa-header > .cordel-wa-mark { width: 28px; height: 28px; }
    #cordel-wa-title { font-size: 16px; }
    #cordel-wa-description { font-size: 12px; }
    #cordel-wa-dialog .cordel-wa-body { padding: 20px 18px; }
    #cordel-wa-form, #cordel-wa-dialog .cordel-wa-row { gap: 12px; }
    #cordel-wa-dialog .cordel-wa-field input, #cordel-wa-dialog .cordel-wa-field select, #cordel-wa-dialog .cordel-wa-field textarea { height: 44px; font-size: 16px; }
    #cordel-wa-dialog .cordel-wa-field textarea { height: 96px; }
    #cordel-wa-dialog .cordel-wa-field label { top: 12px; font-size: 14px; }
    #cordel-wa-dialog .cordel-wa-field-icon { top: 16px; }
    #cordel-wa-dialog .cordel-wa-select::after { top: 17px; }
    #cordel-wa-dialog .cordel-wa-field input:focus + label, #cordel-wa-dialog .cordel-wa-field input:not(:placeholder-shown) + label, #cordel-wa-dialog .cordel-wa-field textarea:focus + label, #cordel-wa-dialog .cordel-wa-field textarea:not(:placeholder-shown) + label { transform: translateY(-21px) scale(.8); }
}
@media (max-width: 449px) { #cordel-wa-dialog .cordel-wa-row { grid-template-columns: minmax(0,1fr); } }
@media (prefers-reduced-motion: reduce) { #cordel-wa-open::before { animation: none; } #cordel-wa-open, #cordel-wa-dialog * { transition: none !important; } }
