/* =========================================================
   MI · Panel Loterías 2.0.0
   Estilos encapsulados del shortcode [mi_loterias_panel]
   ========================================================= */

.mi-loto,
.mi-loto *{
  box-sizing:border-box;
}

.mi-loto{
  --mi-loto-ink:#16323d;
  --mi-loto-muted:#607680;
  --mi-loto-line:#d8e5e9;
  --mi-loto-paper:#ffffff;
  --mi-loto-soft:#f3f8f9;
  --mi-loto-brand:#2d8399;
  --mi-loto-shadow:0 18px 48px rgba(29,72,84,.09);

  width:100%;
  max-width:1180px;
  margin:0 auto;
  color:var(--mi-loto-ink);
  font-family:inherit;
}

.mi-loto a{
  color:inherit;
}

.mi-loto__header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  margin:0 0 20px;
  padding:24px 26px;
  border:1px solid rgba(45,131,153,.20);
  border-radius:24px;
  background:
    radial-gradient(900px 300px at 6% 0%, rgba(93,177,197,.18), transparent 60%),
    linear-gradient(135deg, #f9fcfd 0%, #edf6f8 100%);
}

.mi-loto__header-copy{
  max-width:720px;
}

.mi-loto__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:8px;
  color:#39798a;
  font-size:.76rem;
  font-weight:850;
  letter-spacing:.11em;
  line-height:1.2;
  text-transform:uppercase;
}

.mi-loto__eyebrow::before{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#4b9fb3;
  box-shadow:0 0 0 5px rgba(75,159,179,.12);
  content:"";
}

.mi-loto__title{
  margin:0;
  color:var(--mi-loto-ink);
  font-size:clamp(1.65rem, 3vw, 2.45rem);
  font-weight:900;
  letter-spacing:-.035em;
  line-height:1.05;
}

.mi-loto__subtitle{
  max-width:680px;
  margin:10px 0 0;
  color:var(--mi-loto-muted);
  font-size:1rem;
  line-height:1.58;
}

.mi-loto__status{
  display:flex;
  align-items:center;
  gap:11px;
  min-width:250px;
  padding:12px 15px;
  border:1px solid rgba(45,131,153,.18);
  border-radius:16px;
  background:rgba(255,255,255,.76);
  box-shadow:0 8px 24px rgba(41,92,106,.06);
}

.mi-loto__status-dot{
  width:11px;
  height:11px;
  flex:0 0 auto;
  border-radius:50%;
  background:#2b9b67;
  box-shadow:0 0 0 6px rgba(43,155,103,.12);
}

.mi-loto__status > span:last-child{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:2px;
}

.mi-loto__status strong{
  color:#234650;
  font-size:.88rem;
  line-height:1.25;
}

.mi-loto__status small{
  color:#68808a;
  font-size:.76rem;
  line-height:1.35;
}

.mi-loto__notice{
  margin:0 0 18px;
  padding:13px 16px;
  border:1px solid #ead59d;
  border-radius:15px;
  background:#fff9e9;
  color:#735c1f;
  font-size:.91rem;
  line-height:1.48;
}

.mi-loto__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}

.mi-loto__quiniela{
  margin-top:16px;
}

.mi-loto__card{
  --game:#2d8399;
  --game-dark:#1c5968;
  --game-soft:#edf7f9;
  --game-line:#cde4e9;

  position:relative;
  display:flex;
  min-width:0;
  min-height:100%;
  scroll-margin-top:110px;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--game-line);
  border-radius:22px;
  background:var(--mi-loto-paper);
  box-shadow:0 12px 34px rgba(27,67,78,.075);
  isolation:isolate;
}

.mi-loto__card::before{
  position:absolute;
  z-index:-1;
  top:-100px;
  right:-90px;
  width:230px;
  height:230px;
  border-radius:50%;
  background:var(--game-soft);
  content:"";
}

.mi-loto__card--euromillones{
  --game:#1f59a8;
  --game-dark:#173f78;
  --game-soft:#edf3fc;
  --game-line:#cfdcf1;
}

.mi-loto__card--primitiva{
  --game:#158756;
  --game-dark:#0d6040;
  --game-soft:#edf8f2;
  --game-line:#cce8d9;
}

.mi-loto__card--bonoloto{
  --game:#2d7954;
  --game-dark:#1f573c;
  --game-soft:#eff8f3;
  --game-line:#d2e8dc;
}

.mi-loto__card--loteria_nacional{
  --game:#1970b8;
  --game-dark:#125185;
  --game-soft:#eef6fc;
  --game-line:#cee3f3;
}

.mi-loto__card--gordo_primitiva{
  --game:#d83c55;
  --game-dark:#9f263c;
  --game-soft:#fff0f3;
  --game-line:#f1ccd4;
}

.mi-loto__card--eurodreams{
  --game:#7754b6;
  --game-dark:#543888;
  --game-soft:#f5f0fc;
  --game-line:#ddd1ef;
}

.mi-loto__card--quiniela{
  --game:#c92935;
  --game-dark:#8f1c25;
  --game-soft:#fff0f1;
  --game-line:#efccd0;
}

.mi-loto__card-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:18px 18px 14px;
}

.mi-loto__brand{
  display:flex;
  min-width:0;
  align-items:center;
  gap:12px;
}

.mi-loto__logo-wrap{
  display:flex;
  width:54px;
  height:54px;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:1px solid rgba(22,50,61,.09);
  border-radius:15px;
  background:#fff;
  box-shadow:0 7px 18px rgba(29,68,80,.07);
}

.mi-loto__logo-wrap--empty{
  background:var(--game-soft);
}

.mi-loto__logo{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

.mi-loto__brand-copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:4px;
}

.mi-loto__game{
  color:var(--mi-loto-ink);
  font-size:1.03rem;
  font-weight:900;
  letter-spacing:-.015em;
  line-height:1.18;
}

.mi-loto__date{
  color:var(--mi-loto-muted);
  font-size:.79rem;
  line-height:1.3;
}

.mi-loto__latest{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  min-height:26px;
  padding:5px 9px;
  border:1px solid var(--game-line);
  border-radius:999px;
  background:var(--game-soft);
  color:var(--game-dark);
  font-size:.67rem;
  font-weight:850;
  letter-spacing:.035em;
  line-height:1;
  text-transform:uppercase;
}

.mi-loto__card-body{
  display:flex;
  flex:1;
  flex-direction:column;
  padding:2px 18px 18px;
}

.mi-loto__numbers{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:10px 0 15px;
}

.mi-loto__ball{
  display:inline-flex;
  width:43px;
  height:43px;
  align-items:center;
  justify-content:center;
  border:1px solid var(--game-line);
  border-radius:50%;
  background:linear-gradient(145deg, #fff 0%, var(--game-soft) 100%);
  box-shadow:inset 0 -4px 9px rgba(30,70,80,.04), 0 5px 12px rgba(30,70,80,.06);
  color:var(--game-dark);
  font-size:.98rem;
  font-variant-numeric:tabular-nums;
  font-weight:900;
  line-height:1;
}

.mi-loto__specials{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:2px;
}

.mi-loto__special{
  display:flex;
  min-width:98px;
  flex:1 1 auto;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:9px 11px;
  border:1px solid #e3ecef;
  border-radius:12px;
  background:#f8fbfc;
}

.mi-loto__special span{
  color:var(--mi-loto-muted);
  font-size:.75rem;
  line-height:1.2;
}

.mi-loto__special strong{
  color:var(--game-dark);
  font-size:.91rem;
  font-variant-numeric:tabular-nums;
  line-height:1.2;
}

.mi-loto__special--stars{
  border-color:#f0dfaa;
  background:#fffaf0;
}

.mi-loto__special--stars strong{
  color:#8a6508;
}

.mi-loto__jackpot{
  position:relative;
  display:grid;
  grid-template-columns:1fr auto;
  gap:3px 14px;
  margin-top:auto;
  padding:13px 38px 13px 14px;
  border:1px solid var(--game-line);
  border-radius:14px;
  background:var(--game-soft);
  text-decoration:none !important;
  transition:transform .2s ease, box-shadow .2s ease;
}

.mi-loto__jackpot:hover{
  transform:translateY(-2px);
  box-shadow:0 9px 22px rgba(34,77,89,.09);
}

.mi-loto__jackpot span:first-child{
  color:var(--mi-loto-muted);
  font-size:.73rem;
  line-height:1.2;
}

.mi-loto__jackpot strong{
  grid-column:1 / -1;
  color:var(--game-dark);
  font-size:1rem;
  font-weight:900;
  line-height:1.25;
}

.mi-loto__jackpot-arrow{
  position:absolute;
  top:50%;
  right:13px;
  color:var(--game);
  font-size:1rem;
  transform:translateY(-50%);
}

.mi-loto__national{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
  margin:10px 0 14px;
  padding:17px 16px;
  border:1px solid var(--game-line);
  border-radius:16px;
  background:linear-gradient(135deg, #fff 0%, var(--game-soft) 100%);
}

.mi-loto__result-label{
  color:var(--mi-loto-muted);
  font-size:.73rem;
  font-weight:800;
  letter-spacing:.08em;
  line-height:1.2;
  text-transform:uppercase;
}

.mi-loto__national-number{
  color:var(--game-dark);
  font-size:clamp(2rem, 4vw, 2.75rem);
  font-variant-numeric:tabular-nums;
  font-weight:950;
  letter-spacing:.12em;
  line-height:1;
}

.mi-loto__facts{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}

.mi-loto__fact{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 11px;
  border:1px solid #e3ecef;
  border-radius:12px;
  background:#f8fbfc;
}

.mi-loto__fact span{
  color:var(--mi-loto-muted);
  font-size:.75rem;
}

.mi-loto__fact strong{
  color:var(--game-dark);
  font-size:1rem;
}

.mi-loto__empty{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin:10px 0 14px;
  padding:15px;
  border:1px dashed var(--game-line);
  border-radius:14px;
  background:var(--game-soft);
}

.mi-loto__empty strong{
  color:var(--game-dark);
  font-size:.91rem;
}

.mi-loto__empty span{
  color:var(--mi-loto-muted);
  font-size:.79rem;
  line-height:1.4;
}

.mi-loto__card-footer{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  margin-top:auto;
  padding:12px 18px 15px;
  border-top:1px solid rgba(22,50,61,.075);
  background:rgba(248,251,252,.7);
}

.mi-loto__source-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--game-dark) !important;
  font-size:.78rem;
  font-weight:850;
  line-height:1.2;
  text-decoration:none !important;
}

.mi-loto__source-link:hover{
  text-decoration:underline !important;
  text-underline-offset:3px;
}

/* Quiniela */
.mi-loto__card--quiniela .mi-loto__card-body{
  padding-top:4px;
}

.mi-loto__matches{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  overflow:hidden;
  border:1px solid var(--game-line);
  border-radius:16px;
  background:#fff;
}

.mi-loto__match{
  display:grid;
  grid-template-columns:34px minmax(0, 1fr) 42px;
  min-width:0;
  align-items:center;
  gap:10px;
  padding:10px 11px;
  border-bottom:1px solid #edf1f2;
}

.mi-loto__match:nth-child(odd){
  border-right:1px solid #edf1f2;
}

.mi-loto__match:nth-last-child(-n+2){
  border-bottom:0;
}

.mi-loto__match--pleno{
  grid-column:1 / -1;
  border-top:1px solid var(--game-line);
  border-right:0 !important;
  border-bottom:0;
  background:var(--game-soft);
}

.mi-loto__match-number{
  display:inline-flex;
  width:30px;
  height:30px;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:var(--game-soft);
  color:var(--game-dark);
  font-size:.76rem;
  font-variant-numeric:tabular-nums;
  font-weight:900;
}

.mi-loto__teams{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:2px;
  color:#2b4650;
  font-size:.79rem;
  line-height:1.25;
}

.mi-loto__teams span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.mi-loto__sign{
  display:inline-flex;
  min-width:34px;
  height:30px;
  align-items:center;
  justify-content:center;
  padding:0 8px;
  border-radius:9px;
  background:var(--game);
  color:#fff;
  font-size:.81rem;
  font-variant-numeric:tabular-nums;
  font-weight:900;
}

.mi-loto__sign--wide{
  min-width:54px;
}

.mi-loto__footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  margin-top:16px;
  padding:17px 19px;
  border:1px solid var(--mi-loto-line);
  border-radius:18px;
  background:#f7fafb;
}

.mi-loto__footer-copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:3px;
}

.mi-loto__footer-copy strong{
  color:#284751;
  font-size:.86rem;
}

.mi-loto__footer-copy span{
  color:var(--mi-loto-muted);
  font-size:.78rem;
  line-height:1.4;
}

.mi-loto__official{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  gap:7px;
  padding:10px 13px;
  border:1px solid #c9dce1;
  border-radius:999px;
  background:#fff;
  color:#245a68 !important;
  font-size:.77rem;
  font-weight:850;
  line-height:1.2;
  text-decoration:none !important;
  transition:transform .2s ease, border-color .2s ease;
}

.mi-loto__official:hover{
  transform:translateY(-1px);
  border-color:#87b7c3;
}

@media (max-width:1050px){
  .mi-loto__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:820px){
  .mi-loto__header{
    align-items:flex-start;
    flex-direction:column;
  }

  .mi-loto__status{
    width:100%;
    min-width:0;
  }

  .mi-loto__matches{
    grid-template-columns:1fr;
  }

  .mi-loto__match:nth-child(odd){
    border-right:0;
  }

  .mi-loto__match:nth-last-child(-n+2){
    border-bottom:1px solid #edf1f2;
  }

  .mi-loto__match:last-child,
  .mi-loto__match--pleno{
    border-bottom:0;
  }

  .mi-loto__match--pleno{
    grid-column:auto;
  }
}

@media (max-width:640px){
  .mi-loto__header{
    gap:18px;
    padding:20px 18px;
    border-radius:19px;
  }

  .mi-loto__grid{
    grid-template-columns:1fr;
    gap:13px;
  }

  .mi-loto__quiniela{
    margin-top:13px;
  }

  .mi-loto__card{
    border-radius:18px;
  }

  .mi-loto__card-header{
    align-items:center;
    padding:15px 15px 12px;
  }

  .mi-loto__logo-wrap{
    width:48px;
    height:48px;
    border-radius:13px;
  }

  .mi-loto__latest{
    display:none;
  }

  .mi-loto__card-body{
    padding:2px 15px 15px;
  }

  .mi-loto__card-footer{
    padding:11px 15px 14px;
  }

  .mi-loto__numbers{
    gap:7px;
  }

  .mi-loto__ball{
    width:40px;
    height:40px;
    font-size:.91rem;
  }

  .mi-loto__national-number{
    font-size:2.05rem;
    letter-spacing:.09em;
  }

  .mi-loto__footer{
    align-items:flex-start;
    flex-direction:column;
    gap:13px;
    padding:15px;
  }

  .mi-loto__official{
    width:100%;
    justify-content:center;
  }
}

@media (max-width:390px){
  .mi-loto__ball{
    width:37px;
    height:37px;
  }

  .mi-loto__match{
    grid-template-columns:30px minmax(0, 1fr) 39px;
    gap:8px;
    padding:9px;
  }
}

@media (prefers-reduced-motion:reduce){
  .mi-loto__jackpot,
  .mi-loto__official{
    transition:none;
  }
}