/* ═══════════════════════════════════════════════════════════════════
   DIGITAL PLANET — estilo propio
   Se carga SOLO cuando se entra por digitalplanetplus.com (ver includes/tienda.php).
   La base es la misma de Full; aquí va lo que lo hace distinto:
   espacio índigo, planeta rosado-violeta-cian, anillo amarillo y letra Sora.
   ═══════════════════════════════════════════════════════════════════ */

html[data-tienda="dp"]{
  --bg:#0d0b1f; --bg2:#15122b; --bg3:#1e1a3a;
  --accent:#ff4f8b; --accent2:#ff8fb8; --btn:#ff4f8b;
  --text:#f4f1ff; --muted:#9d96c8;
  --border:rgba(255,143,184,.10); --border2:rgba(255,143,184,.20);
  --dp-pink:#ff4f8b; --dp-violet:#8b5cf6; --dp-cyan:#22c7e8; --dp-yellow:#ffd23f;
  --dp-grad:linear-gradient(135deg,#ff4f8b 0%,#8b5cf6 55%,#22c7e8 100%);
  --dp-grad-btn:linear-gradient(135deg,#ff4f8b 0%,#c13cf0 55%,#8b5cf6 100%);
}
html[data-tienda="dp"] body{
  background:
    radial-gradient(1100px 650px at 88% -12%, rgba(139,92,246,.20), transparent 60%),
    radial-gradient(900px 600px at -12% 108%, rgba(34,199,232,.12), transparent 60%),
    #0d0b1f !important;
}
html[data-tienda="dp"] ::selection{ background:rgba(255,79,139,.35); color:#fff; }

/* Letra de títulos: Sora (geométrica, distinta a la de Full) */
html[data-tienda="dp"] :is(h1,h2,.promo-title,.brand,.topbar-title,.sb-l1,.sb-l2,.sec-title,.page-title,.cdx-hero h1,.hero h2,.m-title){
  font-family:'Sora','DM Sans',system-ui,sans-serif !important;
  letter-spacing:-.02em !important;
}
html[data-tienda="dp"] :is(.promo-title span,.brand span){ font-family:'Sora','DM Sans',system-ui,sans-serif !important; }

/* ─────────────────────────── LOGIN / REGISTRO ─────────────────────────── */
html[data-tienda="dp"] .bg-gradient.g1{ background:radial-gradient(circle,#ff4f8b 0%,transparent 70%) !important; opacity:.20; }
html[data-tienda="dp"] .bg-gradient.g2{ background:radial-gradient(circle,#22c7e8 0%,transparent 70%) !important; opacity:.16; }
html[data-tienda="dp"] .bg-gradient.g3{ background:radial-gradient(circle,#8b5cf6 0%,transparent 70%) !important; opacity:.20; }
html[data-tienda="dp"] .bg-grid{
  background-image:radial-gradient(rgba(255,255,255,.07) 1px, transparent 1.4px) !important;
  background-size:34px 34px !important;
}

/* El planeta con su anillo, de fondo (solo pantallas grandes) */
@media (min-width: 992px){
  html[data-tienda="dp"] .bg-animated::before,
  html[data-tienda="dp"] .bg-animated::after{ content:''; position:absolute; pointer-events:none; }
  html[data-tienda="dp"] .bg-animated::before{
    width:560px; height:560px; right:-170px; bottom:-200px; border-radius:50%;
    background:radial-gradient(circle at 32% 28%, rgba(255,255,255,.28), transparent 42%), var(--dp-grad);
    opacity:.20;
  }
  html[data-tienda="dp"] .bg-animated::after{
    width:980px; height:230px; right:-380px; bottom:-10px; border-radius:50%;
    border:3px solid rgba(255,210,63,.42); transform:rotate(-18deg);
    box-shadow:0 0 40px rgba(255,210,63,.12);
  }
}

html[data-tienda="dp"] .promo-title{ color:#fff; }
html[data-tienda="dp"] .promo-title span{
  background:linear-gradient(100deg,#ff6aa2 0%,#b46cff 45%,#22c7e8 100%) !important;
  -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important;
}
html[data-tienda="dp"] .promo-subtitle{ color:#c4bde6; }

html[data-tienda="dp"] .platform-card{
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.015)) !important;
  border:1px solid rgba(255,143,184,.12) !important; border-radius:22px !important;
}
html[data-tienda="dp"] .platform-card:hover{ border-color:rgba(255,79,139,.45) !important; box-shadow:0 14px 34px rgba(255,79,139,.14) !important; }
html[data-tienda="dp"] .advantage-badge{ border-color:rgba(255,210,63,.28) !important; background:rgba(255,210,63,.06) !important; color:#ffe7a6 !important; }

html[data-tienda="dp"] .auth-card{
  background:linear-gradient(180deg,rgba(28,23,58,.88),rgba(16,13,36,.92)) !important;
  border:1px solid rgba(255,143,184,.16) !important;
  border-radius:28px !important;
  box-shadow:0 30px 80px rgba(5,3,20,.65), 0 0 0 1px rgba(139,92,246,.10) inset !important;
  position:relative; overflow:hidden;
}
html[data-tienda="dp"] .auth-card::before{
  content:'' !important; position:absolute !important; inset:0 0 auto 0 !important; height:3px !important;
  background:linear-gradient(90deg,#ff4f8b,#8b5cf6,#22c7e8,#ffd23f) !important; opacity:1 !important;
  border-radius:0 !important; filter:none !important;
}
html[data-tienda="dp"] .brand-icon-img{ width:78px !important; height:78px !important; filter:drop-shadow(0 8px 22px rgba(255,79,139,.35)); }
html[data-tienda="dp"] .brand{ color:#fff !important; font-weight:800 !important; }
html[data-tienda="dp"] .brand span{
  background:linear-gradient(100deg,#ff4f8b,#ff8fb8) !important;
  -webkit-background-clip:text !important; background-clip:text !important; -webkit-text-fill-color:transparent !important;
}
html[data-tienda="dp"] .tagline{ color:#ffd23f !important; letter-spacing:5px !important; opacity:.85; }

html[data-tienda="dp"] .input-wrap input:focus,
html[data-tienda="dp"] .input-wrap:focus-within{ border-color:rgba(255,79,139,.55) !important; box-shadow:0 0 0 4px rgba(255,79,139,.12) !important; }

html[data-tienda="dp"] .btn-auth{
  background:var(--dp-grad-btn) !important;
  box-shadow:0 12px 30px -8px rgba(255,79,139,.6) !important;
  border-radius:16px !important;
}
html[data-tienda="dp"] .btn-auth:hover{ filter:brightness(1.07); box-shadow:0 16px 38px -8px rgba(255,79,139,.75) !important; }
html[data-tienda="dp"] .forgot-link{ color:#ff8fb8 !important; }

html[data-tienda="dp"] .register-btn{
  background:#120f28 !important;
  box-shadow:0 0 0 1px rgba(255,210,63,.30), 0 10px 28px rgba(0,0,0,.35), 0 0 22px -6px rgba(255,79,139,.40) !important;
}
html[data-tienda="dp"] .register-btn::before{
  background:conic-gradient(from 0deg,transparent 0 55%,#ffd23f 70%,#ff4f8b 82%,transparent 95%) !important;
}
html[data-tienda="dp"] .register-icon{ background:var(--dp-grad) !important; }
html[data-tienda="dp"] .register-text .sub-text{ color:#ffd23f !important; }
html[data-tienda="dp"] .free-badge{ background:#ffd23f !important; color:#1b1035 !important; box-shadow:0 6px 18px rgba(255,210,63,.35) !important; }
html[data-tienda="dp"] .register-arrow{ border-color:rgba(255,210,63,.4) !important; color:#ffd23f !important; }

html[data-tienda="dp"] .mobile-platforms-title{ color:#ffd23f !important; }
html[data-tienda="dp"] .legal-foot a{ color:#a9a2d2 !important; }

/* ─────────────────────────── PANELES (cliente / premium / distribuidor) ─────────────────────────── */
html[data-tienda="dp"] .sidebar{
  background:linear-gradient(180deg,#17133a 0%,#0f0c24 100%) !important;
  border-right:1px solid rgba(255,143,184,.12) !important;
}
html[data-tienda="dp"] .sidebar .sb-mark{
  background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.18),transparent 55%),#1d1745 !important;
  border-color:rgba(255,210,63,.35) !important;
  box-shadow:0 8px 20px rgba(255,79,139,.25) !important;
}
html[data-tienda="dp"] .sidebar .sb-l1{ color:#fff !important; font-size:15px !important; }
html[data-tienda="dp"] .sidebar .sb-l2{ color:#ff8fb8 !important; }
html[data-tienda="dp"] .sidebar .sb-l3{ color:#ffd23f !important; opacity:.8; }
html[data-tienda="dp"] .sidebar .ni.active{
  background:linear-gradient(90deg,rgba(255,79,139,.26),rgba(139,92,246,.08)) !important;
  box-shadow:inset 0 0 0 1px rgba(255,143,184,.26) !important;
}
html[data-tienda="dp"] .sidebar .ni.active .ni-ic{ background:var(--dp-grad-btn) !important; }
html[data-tienda="dp"] .sidebar .avatar-cli{ background:var(--dp-grad) !important; }

html[data-tienda="dp"] .topbar{ background:rgba(17,14,38,.88) !important; border-bottom-color:rgba(255,143,184,.10) !important; }
html[data-tienda="dp"] .saldo-chip{ background:rgba(255,210,63,.08) !important; border-color:rgba(255,210,63,.28) !important; }
html[data-tienda="dp"] .saldo-val{ color:#ffd23f !important; }

/* Botones principales con el degradado de la marca */
html[data-tienda="dp"] :is(.btn-primary,.cdx-go){
  background:var(--dp-grad-btn) !important;
  box-shadow:0 10px 26px -8px rgba(255,79,139,.55) !important;
}
html[data-tienda="dp"] :is(.hero,.cdx-hero){
  background:linear-gradient(135deg,rgba(255,79,139,.18),rgba(139,92,246,.10) 55%,rgba(34,199,232,.06)) !important;
  border-color:rgba(255,143,184,.24) !important;
}