/**
 * ============================================================================
 * MUAADH CONTACT — Contact info card + form
 * ============================================================================
 *
 * Single source of truth for contact UI (14 rules) extracted from
 * muaadh-frontend.css in Phase 13 Wave 11 (band 13, 2026-05-13).
 *
 * Owns:
 *   - .muaadh-contact-info (card with phone/email/address)
 *   - .muaadh-contact-form (input layout)
 *   - .muaadh-contact-link (clickable phone/email links)
 *
 * Loaded via layout-customer.blade.php.
 * ============================================================================
 */


/* ============================================================================
 * APPENDED (Phase 13 Wave 11 — 2026-05-13): rules pulled from muaadh-frontend.css
 * ============================================================================ */

.muaadh-contact-section {
    padding-block: var(--space-12);
}

.muaadh-contact-section__layout {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
    align-items: stretch;
}

.muaadh-contact-info {
    flex: 5 1 280px;
    background: var(--surface-card);
    border-radius: var(--chassis-radius-card);
    padding: var(--space-6);
    box-shadow: var(--chassis-shadow-card-elevated);
}

.muaadh-contact-info__title {
    font-size: var(--text-2xl);
    font-weight: var(--theme-font-bold);
    color: var(--text-primary);
    margin-block-end: var(--space-6);
}

.muaadh-contact-info__item {
    display: flex;
    align-items: flex-start;
    gap: var(--space-4);
    margin-block-end: var(--space-5);
}

.muaadh-contact-info__item:last-child {
    margin-block-end: 0;
}

.muaadh-contact-info__icon {
    flex-shrink: 0;
    width: var(--size-img-md);
    height: var(--size-img-md);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--theme-text-on-primary);
    font-size: var(--text-lg);
}

.muaadh-contact-info__icon--address { background: var(--theme-primary); }

.muaadh-contact-info__icon--phone   { background: var(--theme-success); color: var(--theme-text-on-success); }

.muaadh-contact-info__icon--email   { background: var(--theme-info);    color: var(--theme-text-on-info); }

.muaadh-contact-info__details h5 {
    font-size: var(--text-base);
    font-weight: var(--theme-font-semibold);
    color: var(--text-primary);
    margin: 0 0 var(--space-1) 0;
}

.muaadh-contact-info__details p {
    font-size: var(--text-sm);
    color: var(--text-muted);
    margin: 0;
    line-height: 1.5;
}

.muaadh-contact-form {
    flex: 7 1 320px;
    background: var(--surface-card);
    border-radius: var(--chassis-radius-card);
    padding: var(--space-6);
    box-shadow: var(--chassis-shadow-card-elevated);
}

.muaadh-contact-form__title {
    font-size: var(--text-2xl);
    font-weight: var(--theme-font-bold);
    color: var(--text-primary);
    margin-block-end: var(--space-6);
}


/* ============================================================================
 * APPENDED (Phase 13 Wave 30): rules pulled from muaadh-core.css
 * ============================================================================ */

.muaadh-contact-form { margin-top: 1rem; }