.vdm-formulario{
    --vdm-form-bg:#0b0f14;
    --vdm-form-border:#39424e;
    --vdm-form-label:#f4f5f7;
    --vdm-form-button:#d0a15a;
    --vdm-form-button-text:#111418;
    width:100%;
    box-sizing:border-box;
    padding:24px;
    border:1px solid var(--vdm-form-border);
    border-radius:20px;
    background:var(--vdm-form-bg);
    box-shadow:0 12px 32px rgba(0,0,0,.14);
}

.vdm-form-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px 16px;
}

.vdm-form-field{
    position:relative;
    min-width:0;
    padding-top:4px;
}

/* Etiqueta flotante: el fondo del formulario corta visualmente el borde del campo. */
.vdm-form-field>label:not(.vdm-choice){
    position:absolute;
    z-index:2;
    top:-7px;
    left:14px;
    display:inline-flex;
    align-items:center;
    gap:3px;
    max-width:calc(100% - 28px);
    margin:0;
    padding:0 7px;
    background:var(--vdm-form-bg);
    color:var(--vdm-form-label);
    font-size:13px;
    font-weight:700;
    line-height:1.35;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.vdm-form-field input:not([type=checkbox]):not([type=radio]),
.vdm-form-field select,
.vdm-form-field textarea{
    width:100%;
    min-height:52px;
    padding:14px 15px;
    border:1px solid var(--vdm-form-border);
    border-radius:13px;
    background:#fff;
    color:#1d2327;
    box-sizing:border-box;
    font:inherit;
    transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}

.vdm-form-field textarea{
    min-height:120px;
    resize:vertical;
}

.vdm-form-field input:not([type=checkbox]):not([type=radio]):hover,
.vdm-form-field select:hover,
.vdm-form-field textarea:hover{
    border-color:#7b8490;
}

.vdm-form-field input:not([type=checkbox]):not([type=radio]):focus,
.vdm-form-field select:focus,
.vdm-form-field textarea:focus{
    outline:none;
    border-color:var(--vdm-form-button);
    box-shadow:0 0 0 3px rgba(208,161,90,.18);
}

.vdm-form-field input::placeholder,
.vdm-form-field textarea::placeholder{
    color:#7a818b;
    opacity:1;
}

.vdm-required{color:#df5b64}

.vdm-radio-group{
    display:flex;
    flex-wrap:wrap;
    gap:9px 14px;
    min-height:52px;
    padding:15px 14px 10px;
    border:1px solid var(--vdm-form-border);
    border-radius:13px;
    background:rgba(255,255,255,.04);
    box-sizing:border-box;
}

.vdm-choice{
    display:flex!important;
    align-items:center;
    gap:8px;
    margin:0;
    color:var(--vdm-form-label);
    font-weight:500!important;
    cursor:pointer;
}

.vdm-choice input[type=checkbox],
.vdm-choice input[type=radio]{
    width:18px;
    height:18px;
    margin:0;
    accent-color:var(--vdm-form-button);
}

.vdm-field-type-checkbox{
    display:flex;
    align-items:center;
    min-height:52px;
    padding:0 2px;
}

.vdm-form-actions{
    display:flex;
    justify-content:flex-end;
    margin-top:22px;
}

.vdm-form-submit{
    min-height:48px;
    padding:12px 22px;
    border:1px solid rgba(0,0,0,.18);
    border-radius:12px;
    background:var(--vdm-form-button);
    color:var(--vdm-form-button-text);
    box-shadow:0 8px 18px rgba(0,0,0,.18);
    cursor:pointer;
    font:inherit;
    font-weight:800;
    transition:transform .16s ease,filter .16s ease,box-shadow .16s ease;
}

.vdm-form-submit:hover{
    transform:translateY(-1px);
    filter:brightness(1.04);
    box-shadow:0 10px 22px rgba(0,0,0,.24);
}

.vdm-form-submit:active{transform:translateY(0)}

.vdm-form-feedback{
    margin-top:12px;
    color:var(--vdm-form-label);
    font-size:14px;
}

.vdm-form-error{
    padding:12px 14px;
    border:1px solid #d26767;
    border-radius:10px;
    background:#fbeaea;
    color:#8a2424;
}

@media(max-width:680px){
    .vdm-formulario{
        padding:19px 14px;
        border-radius:17px;
    }
    .vdm-form-grid{
        grid-template-columns:1fr;
        gap:19px;
    }
    .vdm-form-actions{
        justify-content:stretch;
    }
    .vdm-form-submit{
        width:100%;
    }
}
