/* ============================================
   InmoPanama — F19A.2G (2026-11-11): cabecera compacta de identidad del
   agente en la landing de propiedades por agente (ib_agent_properties.php
   + ib_property_list.php, modo $ib_agent_properties_mode).

   Variables de marca: reutilizadas TAL CUAL de ib-overrides.css (cargado
   siempre antes de este archivo — mismo orden ya garantizado por
   ib_head.php para agent-detail.css/zone-experts.css). Ningún color nuevo.

   Avatar: ib_agent_render_avatar() (includes/ib_agent_helpers.php) ya
   devuelve <img class="al-card__avatar-img"> o
   <span class="al-card__avatar-initials"> — esas clases viven en
   agent-list.css, que esta página NUNCA carga (evita traer todo ese
   archivo solo por el avatar). Mismo criterio ya usado en
   zone-experts.css: se re-declara el tamaño/círculo bajo un wrapper
   propio namespaced, sin depender de agent-list.css.
   ============================================ */

.ib-agp-header {
    display: flex;
    align-items: center;
    gap: 20px;
    background: var(--ib-blanco);
    border: 1px solid var(--ib-gris-borde);
    border-radius: 10px;
    padding: 20px 24px;
    margin-bottom: 24px;
}

.ib-agp-header__avatar {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--ib-gris-fondo);
    display: flex;
    align-items: center;
    justify-content: center;
}
.ib-agp-header__avatar .al-card__avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.ib-agp-header__avatar .al-card__avatar-initials {
    font-size: 24px;
    font-weight: 700;
    color: var(--ib-negro-secundario);
}

.ib-agp-header__body {
    flex: 1 1 auto;
    min-width: 0;
}

.ib-agp-header__name {
    margin: 0 0 2px;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
    color: var(--ib-negro-principal);
}

.ib-agp-header__company {
    margin: 0 0 2px;
    font-size: 14px;
    line-height: 1.4;
    color: var(--ib-texto-oscuro);
}

.ib-agp-header__license {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 1.4;
    color: var(--ib-texto-oscuro);
    opacity: 0.8;
}

.ib-agp-header__bio {
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ib-texto-oscuro);
    max-width: 680px;
}

.ib-agp-header__cta {
    display: inline-block;
    font-size: 13px;
    font-weight: 600;
    color: var(--ib-negro-principal);
    text-decoration: underline;
    text-decoration-color: var(--ib-gris-borde);
}
.ib-agp-header__cta:hover,
.ib-agp-header__cta:focus {
    color: var(--ib-negro-principal);
    text-decoration-color: var(--ib-amarillo-hover);
}

/* Mobile: avatar+texto apilados, sin desbordar ni generar scroll
   horizontal (validación sección 39). */
@media (max-width: 575.98px) {
    .ib-agp-header {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
        padding: 16px 18px;
        gap: 12px;
    }
    .ib-agp-header__avatar {
        width: 60px;
        height: 60px;
    }
    .ib-agp-header__bio {
        max-width: 100%;
    }
}