/* Shared phone and tablet layout; loaded after each page's styles. */
#donation-form select { color: #fff !important; color-scheme: dark; }
#donation-form select option { background: #222; color: #fff; }
body:has(.donate-modal.active) .floating-donate { display: none; }
@media (max-width: 768px) {
    .navbar .nav-container {
        padding: 0 12px;
        gap: 14px;
    }
    .navbar .nav-logo { flex-shrink: 0; }
    .navbar .nav-links {
        display: flex;
        min-width: 0;
        gap: 16px;
        overflow-x: auto;
        align-items: center;
    }
    .navbar .nav-links li,
    .navbar .nav-links li:nth-child(2),
    .navbar .nav-links li:nth-child(3) {
        display: block;
        flex-shrink: 0;
    }
    .navbar .nav-links a {
        display: flex;
        align-items: center;
        min-height: 44px;
        white-space: nowrap;
    }
    .page-enter .entry-title { font-size: clamp(2.5rem, 10vw, 4.5rem); }
    .page-enter .hero-title { font-size: clamp(2rem, 8vw, 3rem); }
    .donate-modal-content {
        width: calc(100% - 24px);
        max-height: 90vh;
        max-height: 90dvh;
    }
    .donate-modal-header { padding: 18px 16px; gap: 10px; }
    .donate-modal-title { font-size: 21px; letter-spacing: 0; }
    .donate-modal-close { flex-shrink: 0; min-width: 44px; min-height: 44px; }
    .donate-modal-body { padding: 20px 16px; }
    #donation-form .donation-form-row { grid-template-columns: minmax(0, 1fr) !important; }
    #donation-form input, #donation-form select, #donation-form textarea,
    .form-input, .form-textarea { min-width: 0; max-width: 100%; font-size: 16px !important; }
    .payment-info { overflow-wrap: anywhere; }
    .contact-form-section .form-grid { grid-template-columns: minmax(0, 1fr); }
    .contact-form-section .form-group { min-width: 0; }
    .contact-form-section .full-width { grid-column: 1; }
    .footer-inner { flex-direction: column; }
    .floating-donate { max-width: calc(100% - 32px); text-align: center; }
}