/* === wrapper y SVG ================================= */
.sjd-rmop-map-wrapper        { position:relative; width:100%; overflow:hidden; }
.sjd-rmop-map-wrapper svg    { display:block; width:100%; height:auto; pointer-events:auto; }

/* === path de países ================================ */
.sjd-rmop-map-wrapper svg path                  { fill:#ddd; transition:fill .3s; pointer-events:auto; }
.sjd-rmop-map-wrapper svg path.sjd-rmop-country--clickable { cursor:pointer; fill:#E9C46A; }
.sjd-rmop-map-wrapper svg path.sjd-rmop-country--clickable:hover { fill:#F4A261; }
.sjd-rmop-map-wrapper svg path.sjd-rmop-country--active   { fill:#E76F51; }
.sjd-rmop-map-wrapper, .sjd-rmop-map-wrapper svg {
  width: 100% !important;
  height: auto  !important;
  display: block;
}
.et_pb_code_inner {
  max-width: none !important;
}

/* === modal ========================================= */
.sjd-rmop-modal          { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); align-items:center; justify-content:center; z-index:10000; }
.sjd-rmop-modal--open    { display:flex; }
.sjd-rmop-modal__content { background:#264653; color:#fff; border-radius:12px; padding:24px; max-width:600px; width:90%; position:relative; }
.sjd-rmop-modal__close   { position:absolute; top:12px; right:12px; background:none; border:none; color:#fff; font-size:24px; cursor:pointer; }

/* === tarjeta ======================================= */
.rmop-card__country-header { display:flex; align-items:center; margin-bottom:16px; }
.rmop-card__country-header img { width:32px; height:32px; border-radius:50%; margin-right:12px; }
.rmop-card__country-title  { margin:0; font-size:1.5em; font-weight:bold; color:#E9C46A; }

.rmop-card__network-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.rmop-card__network-title  { color:#F4A261; font-size:1.2em; font-weight:bold; }
.rmop-card__social-chips   { display:flex; }
.rmop-card__social-chip    { background:#2A9D8F; color:#fff; border-radius:12px; padding:4px 8px; font-size:.8em; margin-left:8px; text-decoration:none; }

.rmop-card__person         { margin-bottom:6px; }
.rmop-card__person-role    { font-size:.9em; color:#ccc; margin-right:8px; }
.rmop-card__person-name    { color:#fff; text-decoration:none; font-weight:500; }
.rmop-card__person-name .external-icon { margin-left:4px; font-size:.8em; }

/* === Contenedor y tarjetas de lista ======================== */
.rmop-country-cards-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 16px;
}

.rmop-list-card {
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 8px;
    padding: 16px;
    cursor: pointer;
    transition: all .3s ease;
    border-left: 5px solid #2A9D8F; /* Un color base */
}

.rmop-list-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
}

.rmop-list-card--active {
    border-left-color: #E76F51; /* Color de país activo */
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
    transform: translateY(-3px);
}

.rmop-list-card__title {
    margin: 0 0 12px 0;
    font-size: 1.2em;
    color: #264653;
}

.rmop-list-card__networks {
    display: flex;
    gap: 8px;
}

.rmop-list-card__network-tag {
    font-size: .8em;
    padding: 3px 8px;
    border-radius: 12px;
    color: #fff;
    font-weight: bold;
}

.rmop-list-card__network-tag.pwpn { background-color: #E76F51; }
.rmop-list-card__network-tag.eym  { background-color: #F4A261; }


