.donate-form { margin-top: 10px; }
.df-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.df-col-2 { grid-column: span 2; }
.df-label { display:block; font-weight:600; color:#2c3e50; margin-bottom:6px; }
.df-input, .df-textarea { width:100%; padding:12px 14px; border:2px solid #e5e7eb; border-radius:10px; font-size:16px; transition:all .2s; }
.df-input:focus, .df-textarea:focus { outline:none; border-color:#106e3c; box-shadow:0 0 0 3px rgba(16,110,60,.12); }
.df-error { color:#dc2626; font-size:13px; min-height:16px; margin-top:4px; }
.df-check { display:flex; align-items:flex-start; gap:8px; font-size:14px; color:#374151; }
.df-actions { margin-top: 10px; display:flex; align-items:center; gap:12px; }
.df-loading { color:#6b7280; }

.df-drop { position:relative; border:2px dashed #cbd5e1; border-radius:12px; padding:24px; text-align:center; color:#6b7280; background:#f9fafb; }
.df-drop input[type="file"] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.df-previews { display:flex; gap:10px; margin-top:10px; flex-wrap:wrap; }
.df-previews img { width:100px; height:100px; object-fit:cover; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,.1); }
/* logo preview shares same styles */

@media (max-width: 768px) {
  .df-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  
  .df-col-2 {
    grid-column: span 1;
  }
  
  .df-input,
  .df-textarea {
    font-size: 16px; /* Prevents zoom on iOS */
    min-height: 44px;
  }
  
  .df-actions {
    flex-direction: column;
    gap: 12px;
  }
  
  .df-actions .btn {
    width: 100%;
    min-height: 44px;
  }
}

@media (max-width: 480px) {
  .df-grid {
    gap: 12px;
  }
  
  .df-label {
    font-size: 14px;
  }
  
  .df-input,
  .df-textarea {
    padding: 10px 12px;
    font-size: 16px;
  }
  
  .df-drop {
    padding: 20px;
  }
  
  .df-previews img {
    width: 80px;
    height: 80px;
  }
}


