/*
 * Tarjeta "Doná a CreeSer Bahía" (links de Mercado Pago). Solo en los remates de
 * remateConDonacion() (public/js/core.js). La usan el detalle del remate, la ficha
 * del lote y la sala del remate en vivo de la home (vistas new2b). Se linkea desde
 * el <head> de cada vista: Vue 2 borra cualquier <style> del body.
 * public/publica/css/index.css es global y pisa estilos con !important: por eso los
 * colores y el subrayado de los links llevan !important.
 */
.fdm-donar {
    margin-top: 18px;
    max-width: 500px;
    padding: 16px 18px 18px;
    border-radius: 18px;
    background: linear-gradient(135deg, #fff 0%, #fdecee 100%);
    border: 1px solid rgba(216, 30, 44, .18);
    box-shadow: 0 8px 24px rgba(216, 30, 44, .08);
    text-align: left;
}
.fdm-donar-head { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.fdm-donar-ico {
    flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, #d81e2c, #a20f1a); color: #fff; font-size: 17px;
    box-shadow: 0 4px 12px rgba(216, 30, 44, .3);
}
.fdm-donar-tit { font-size: 15px; font-weight: 800; color: #111722; line-height: 1.2; text-transform: none; letter-spacing: 0; }
.fdm-donar-sub { font-size: 12px; color: #6b7280; margin-top: 2px; }
.fdm-donar-btns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
a.fdm-donar-btn {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    padding: 12px 10px; border-radius: 12px;
    background: linear-gradient(135deg, #d81e2c, #a20f1a) !important;
    color: #fff !important; font-weight: 800; font-size: 15px; white-space: nowrap;
    text-decoration: none !important; line-height: 1.2;
    box-shadow: 0 6px 16px rgba(216, 30, 44, .25);
    transition: transform .2s, box-shadow .2s, filter .2s;
}
a.fdm-donar-btn i { font-size: 14px; opacity: .9; }
a.fdm-donar-btn:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(216, 30, 44, .35); filter: brightness(1.05); color: #fff !important; }
a.fdm-donar-btn:active { transform: translateY(0); }

/* Columnas angostas (tarjeta de ofertar del lote, sala en vivo): ocupa todo el ancho. */
.fdm-donar.fdm-donar-full { max-width: none; }

@media (max-width: 576px) {
    .fdm-donar { max-width: none; padding: 14px 14px 16px; border-radius: 16px; }
    .fdm-donar-btns { gap: 8px; }
    a.fdm-donar-btn { flex-direction: column; gap: 4px; padding: 11px 4px; font-size: 14px; }
    a.fdm-donar-btn i { font-size: 17px; }
}