/* ================================================
   Organigrama Municipal — Estilos ESTRUCTURALES
   Solo layout y funcionalidad. Los estilos visuales
   van en WPCode como snippet CSS separado.
   ================================================ */

/* ── Wrapper general ── */
.om-wrap { width: 100%; }

/* ── Acordeón ── */
.om-acc-header { display: flex; align-items: center; cursor: pointer; user-select: none; }
.om-acc-info { flex: 1; }
.om-acc-info strong { display: block; }
.om-acc-right { display: flex; align-items: center; }
.om-acc-body { display: none; }
.om-accordion.is-open .om-acc-body { display: block; }


.om-grid {
    display: grid;
    grid-template-columns:  1fr;
}


/* ── Cards ── */
.om-card { display: flex; flex-direction: column; }
.om-card-links { margin-top: auto; display: flex; flex-wrap: wrap; }

/* ── Sub-cards ── */
.om-subcards { display: none; }
.om-subcards.open { display: block; }

/* ── Buscador ── */
.om-search-wrap { display: flex; align-items: center; width: 100%; }
.om-search-field { position: relative; flex: 1; }
.om-search-field input { width: 100%; box-sizing: border-box; outline: none; }
.om-search-icon {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    display: flex;
    align-items: center;
}
.om-search-icon svg { width: 20px; height: 20px; }
.om-search-btn { flex-shrink: 0; cursor: pointer; border: none; }

/* ── Resultados ── */
.om-results-wrap { display: none; }
.om-no-results { display: none; }
.om-search-results {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 700px) {
    .om-search-results { grid-template-columns: 1fr; }
}
@media (max-width: 900px) and (min-width: 701px) {
    .om-search-results { grid-template-columns: repeat(2, 1fr); }
}
.om-search-item { display: flex; flex-direction: column; }

/* ── Root card ── */
.om-root-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1rem;
}
.om-root-card a { display: inline-flex; align-items: center; text-decoration: none; }

/* ── Avatar ── */
.om-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Toggle ── */
.om-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Link botones ── */
.om-link { display: inline-flex; align-items: center; text-decoration: none; white-space: nowrap; }
.om-sub-btn { display: inline-flex; align-items: center; background: none; border: none; padding: 0; cursor: pointer; }

/* ── Decorativos root card ── */
.om-root-card { position: relative; overflow: hidden; }
.om-root-deco {
    position: absolute;
    pointer-events: none;
    overflow: hidden;
}
.om-root-deco--bl { bottom: -5px; left: 0; }
.om-root-deco--tr { top: 0; right: 0; }

/* ── Divisor ── */
.om-root-divider {
    width: 100%;
    display: flex;
    justify-content: center;
}
.om-root-divider svg { display: block; margin:40px auto; }
