
/* VELINT+ Pronósticos Mundialistas v2.2
   Corrección fuerte de layout para evitar interferencias del tema TelNet/Elementor. */

.vpm-app,
.vpm-app *,
.vpm-admin,
.vpm-admin *{
    box-sizing:border-box !important;
}

.vpm-app{
    --vpm-bg:#080808;
    --vpm-card:#121212;
    --vpm-card2:#1a1a1a;
    --vpm-red:#ff1f1f;
    --vpm-gold:#f6b82e;
    --vpm-text:#ffffff;
    --vpm-muted:#b8b8b8;
    width:100% !important;
    max-width:1120px !important;
    margin:0 auto !important;
    padding:24px !important;
    border-radius:22px !important;
    background:radial-gradient(circle at top,#2a0000 0,#080808 38%,#050505 100%) !important;
    color:var(--vpm-text) !important;
    font-family:Inter,Arial,sans-serif !important;
    overflow:hidden !important;
    display:block !important;
    float:none !important;
    clear:both !important;
}

.vpm-app h1,
.vpm-app h2,
.vpm-app h3,
.vpm-app p,
.vpm-app label,
.vpm-app small,
.vpm-app strong,
.vpm-app span{
    color:inherit;
    font-family:Inter,Arial,sans-serif !important;
}

.vpm-hero{
    display:block !important;
    width:100% !important;
    text-align:center !important;
    padding:38px 20px !important;
    border:1px solid rgba(255,255,255,.12) !important;
    background:linear-gradient(135deg,#000000,#8B0000) !important;
    border-radius:24px !important;
    margin:0 0 22px !important;
}

.vpm-badge{
    display:inline-block !important;
    background:var(--vpm-gold) !important;
    color:#000000 !important;
    -webkit-text-fill-color:#000000 !important;
    padding:6px 13px !important;
    border-radius:999px !important;
    font-weight:900 !important;
    margin-bottom:12px !important;
}

.vpm-hero h1,
.vpm-hero h1 *{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    font-size:clamp(28px,5vw,54px) !important;
    line-height:1.05 !important;
    margin:0 0 10px !important;
    font-weight:900 !important;
    text-transform:uppercase !important;
    text-shadow:0 3px 12px rgba(0,0,0,.65) !important;
}

.vpm-hero p,
.vpm-note{
    color:var(--vpm-muted) !important;
    -webkit-text-fill-color:var(--vpm-muted) !important;
}

.vpm-card{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    float:none !important;
    clear:both !important;
    position:relative !important;
    background:linear-gradient(180deg,var(--vpm-card),var(--vpm-card2)) !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:18px !important;
    padding:20px !important;
    margin:18px 0 !important;
    box-shadow:0 14px 45px rgba(0,0,0,.35) !important;
    overflow:visible !important;
}

.vpm-card h2,
.vpm-section-title{
    margin-top:0 !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}

.vpm-section-title{
    text-align:center !important;
    font-size:30px !important;
}

/* Grillas controladas: evita que el tema las convierta en columnas raras */
.vpm-grid2,
.vpm-bonus-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:18px !important;
    width:100% !important;
    clear:both !important;
}

.vpm-grid2 p,
.vpm-bonus-grid p{
    width:100% !important;
    margin:0 0 12px !important;
    padding:0 !important;
}

/* Selects e inputs corregidos */
.vpm-app input[type="text"],
.vpm-app input[type="email"],
.vpm-app input[type="password"],
.vpm-app input[type="number"],
.vpm-app select,
.vpm-app .vpm-select{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-height:52px !important;
    height:52px !important;
    padding:0 42px 0 16px !important;
    border-radius:12px !important;
    border:1px solid rgba(255,255,255,.20) !important;
    background-color:#ffffff !important;
    color:#111111 !important;
    -webkit-text-fill-color:#111111 !important;
    font-size:15px !important;
    font-weight:700 !important;
    line-height:52px !important;
    box-shadow:0 8px 25px rgba(255,255,255,.12) !important;
    outline:none !important;
    appearance:auto !important;
    -webkit-appearance:menulist !important;
    -moz-appearance:auto !important;
    position:relative !important;
    z-index:2 !important;
}

.vpm-app select option,
.vpm-app .vpm-select option{
    color:#111111 !important;
    background:#ffffff !important;
    -webkit-text-fill-color:#111111 !important;
}

.vpm-app label{
    display:block !important;
    color:#d7d7d7 !important;
    -webkit-text-fill-color:#d7d7d7 !important;
    font-weight:700 !important;
    margin-bottom:6px !important;
}

.vpm-btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:linear-gradient(90deg,var(--vpm-gold),#ffb000) !important;
    color:#000000 !important;
    -webkit-text-fill-color:#000000 !important;
    border:none !important;
    border-radius:999px !important;
    padding:13px 24px !important;
    font-weight:900 !important;
    cursor:pointer !important;
    text-decoration:none !important;
    min-height:46px !important;
    width:auto !important;
}

.vpm-alert{
    display:block !important;
    background:#163b22 !important;
    color:#c9ffd8 !important;
    border:1px solid #319a50 !important;
    padding:12px 14px !important;
    border-radius:14px !important;
    margin:14px 0 !important;
}

.vpm-alert-error{
    background:#3b1616 !important;
    color:#ffd0d0 !important;
    border-color:#9a3131 !important;
}

.vpm-userbar{
    display:flex !important;
    justify-content:space-between !important;
    gap:12px !important;
    align-items:center !important;
    margin-bottom:14px !important;
}
.vpm-userbar a{color:var(--vpm-gold) !important}

.vpm-stats{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    gap:10px !important;
    width:100% !important;
}
.vpm-stats div{
    background:#080808 !important;
    border:1px solid rgba(255,255,255,.10) !important;
    border-radius:14px !important;
    padding:13px !important;
    text-align:center !important;
}
.vpm-stats strong{
    display:block !important;
    color:var(--vpm-gold) !important;
    -webkit-text-fill-color:var(--vpm-gold) !important;
    font-size:24px !important;
}
.vpm-stats span{
    display:block !important;
    color:var(--vpm-muted) !important;
    -webkit-text-fill-color:var(--vpm-muted) !important;
    font-size:12px !important;
}

.vpm-filter{
    display:block !important;
    width:100% !important;
    margin-bottom:16px !important;
    clear:both !important;
}

.vpm-matches,
.vpm-matches-list{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    width:100% !important;
    max-width:100% !important;
    clear:both !important;
    float:none !important;
}

.vpm-match{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto 110px !important;
    gap:12px !important;
    align-items:center !important;
    width:100% !important;
    max-width:100% !important;
    background:#090909 !important;
    border:1px solid rgba(255,255,255,.10) !important;
    padding:13px !important;
    border-radius:16px !important;
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:auto !important;
    float:none !important;
    transform:none !important;
}

.vpm-match.locked{opacity:.72 !important}

.vpm-date{
    display:block !important;
    color:var(--vpm-gold) !important;
    -webkit-text-fill-color:var(--vpm-gold) !important;
    font-size:12px !important;
    font-weight:900 !important;
}
.vpm-match-info strong{
    display:block !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    font-weight:900 !important;
}
.vpm-match-info small{
    display:block !important;
    color:var(--vpm-muted) !important;
    -webkit-text-fill-color:var(--vpm-muted) !important;
    margin-top:3px !important;
}

.vpm-score-input{
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    min-width:150px !important;
}
.vpm-score-input input[type="number"]{
    width:64px !important;
    min-width:64px !important;
    max-width:64px !important;
    height:48px !important;
    min-height:48px !important;
    padding:0 !important;
    text-align:center !important;
    background:#050505 !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    box-shadow:none !important;
}
.vpm-score-input span{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}

.vpm-lock{font-size:12px !important;color:var(--vpm-muted) !important}
.vpm-saved{font-size:12px !important;color:#9cffb1 !important;font-weight:900 !important}
.vpm-pending{font-size:12px !important;color:var(--vpm-gold) !important;font-weight:900 !important}

.vpm-ranking{
    width:100% !important;
    overflow:auto !important;
}
.vpm-ranking table{
    width:100% !important;
    border-collapse:collapse !important;
    overflow:hidden !important;
    border-radius:14px !important;
}
.vpm-ranking th,
.vpm-ranking td{
    padding:12px !important;
    border-bottom:1px solid rgba(255,255,255,.08) !important;
    text-align:left !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
}
.vpm-ranking th{
    color:var(--vpm-gold) !important;
    -webkit-text-fill-color:var(--vpm-gold) !important;
    background:#080808 !important;
}
.vpm-winner td{background:rgba(246,184,46,.08) !important}

.vpm-rules li{margin:10px 0 !important}

.vpm-admin .vpm-card{color:#1d2327 !important;background:#fff !important}
.vpm-admin .vpm-grid2 input,
.vpm-admin input,
.vpm-admin select,
.vpm-admin textarea{
    color:#1d2327 !important;
    background:#fff !important;
    width:100% !important;
}
.vpm-admin .vpm-danger{color:#b32d2e !important}
.vpm-inline{display:flex !important;align-items:center !important;gap:5px !important}
.vpm-inline input{max-width:58px !important}
.vpm-table-wrap{overflow:auto !important}
.vpm-danger-zone{border-left:4px solid #d63638 !important}

@media(max-width:900px){
    .vpm-stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
    .vpm-match{grid-template-columns:1fr !important}
    .vpm-score-input{min-width:0 !important}
}

@media(max-width:760px){
    .vpm-app{padding:14px !important;border-radius:0 !important}
    .vpm-grid2,
    .vpm-bonus-grid{grid-template-columns:1fr !important}
    .vpm-match{grid-template-columns:1fr !important}
    .vpm-score-input input[type="number"]{
        width:80px !important;
        min-width:80px !important;
        max-width:80px !important;
    }
    .vpm-userbar{display:block !important}
    .vpm-hero h1{font-size:30px !important}
}


/* v2.3 - Corrección para TelNet/Nice Select:
   El tema genera un select visual duplicado debajo del select real.
   Ocultamos esos duplicados dentro de la app y dejamos activo el select nativo. */
.vpm-app .nice-select,
.vpm-app .nice-select.open,
.vpm-app .select2,
.vpm-app .select2-container,
.vpm-app .bootstrap-select,
.vpm-app .chosen-container,
.vpm-app .fstdiv,
.vpm-app .dropdown-toggle[data-toggle="dropdown"]{
    display:none !important;
    visibility:hidden !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    overflow:hidden !important;
}

.vpm-app select.vpm-select,
.vpm-app select[data-vpm-select="1"],
.vpm-app .vpm-filter select{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
    position:relative !important;
    z-index:5 !important;
    pointer-events:auto !important;
    appearance:auto !important;
    -webkit-appearance:menulist !important;
    -moz-appearance:auto !important;
}

/* Evita espacio extra debajo de los selects cuando el tema inyecta elementos */
.vpm-app label + .nice-select,
.vpm-app select + .nice-select,
.vpm-app select + .select2,
.vpm-app select + .select2-container{
    display:none !important;
}

/* v3.0 - Grupos privados y filtro corregido */
.vpm-pool-card .vpm-grid2{
    align-items:end !important;
}
.vpm-current-pool{
    background:#080808 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    border-radius:14px !important;
    padding:12px 14px !important;
    margin:10px 0 18px !important;
    color:#fff !important;
}
.vpm-current-pool strong{
    color:var(--vpm-gold) !important;
    -webkit-text-fill-color:var(--vpm-gold) !important;
}
.vpm-current-pool code{
    background:#1d1d1d !important;
    color:#fff !important;
    padding:3px 7px !important;
    border-radius:8px !important;
}
.vpm-mini-form{
    display:block !important;
    width:100% !important;
}
.vpm-create-group{
    grid-column:1 / -1 !important;
}
.vpm-btn-small{
    margin-top:10px !important;
    min-height:40px !important;
    padding:10px 18px !important;
}
.vpm-ranking h3{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
    margin-top:0 !important;
}
