/* =============================================================================
   RUTA: wwwroot/css/gaia/modals.css
   =============================================================================
   GAIA VIP — Modals (Widgets Home)
   - Tema oscuro, bordes, radius
   - Title visible (pill style)
   - Cierre consistente (X + botón)
   ============================================================================= */

.gaia-modal .modal-content {
    background: var(--bg-surface);
    border: 1px solid var(--border-strong);
    border-radius: 1rem;
    box-shadow: 0 18px 44px rgba(0,0,0,.55);
}

.gaia-modal .modal-header,
.gaia-modal .modal-footer {
    border-color: var(--border-subtle);
}

.gaia-modal .modal-title {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .28rem .78rem;
    border-radius: 999px;
    background: var(--bg-surface-soft);
    border: 1px solid rgba(15,241,179,.55);
    color: var(--accent-primary);
    font-weight: 700;
    font-size: .95rem;
    margin: 0;
}

.gaia-modal .btn-close {
    filter: invert(1);
    opacity: .75;
}

    .gaia-modal .btn-close:hover {
        opacity: 1;
    }

.gaia-modal .gaia-modal-close {
    border-radius: 999px;
}

/* Wrapper dentro del modal */
.gaia-widget-wrap {
    display: block;
}

/* Lista “label - value” (Usuarios / Participaciones) */
.gaia-kv-list {
    margin-top: .25rem;
}

.gaia-kv {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .55rem .25rem;
    border-bottom: 1px solid var(--border-subtle);
}

.gaia-kv-last {
    border-bottom: none;
    padding-bottom: .15rem;
}

.gaia-kv-label {
    color: var(--text-muted);
    font-size: .92rem;
    font-weight: 600;
}

.gaia-kv-value {
    color: var(--text-main);
    font-size: 1.05rem;
    font-weight: 750;
}

/* Geo lists */
.gaia-geo-list {
    display: grid;
    gap: .55rem;
}

.gaia-country-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .55rem .75rem;
    border-radius: .85rem;
    background: rgba(255,255,255,.02);
    border: 1px solid var(--border-subtle);
    color: var(--text-main);
}

    .gaia-country-btn:hover {
        border-color: var(--border-strong);
        background: rgba(255,255,255,.03);
    }

.gaia-country-left {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    min-width: 0;
}

.gaia-country-name {
    font-weight: 650;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gaia-country-count {
    font-weight: 750;
    color: var(--accent-primary);
}