/*
Theme Name: DJ M Dark
Theme URI: https://djm.djaleix.es
Description: Tema hijo oscuro estilo club/DJ (negro + degradado magenta/púrpura) para Dj M. Basado en Twenty Twenty-Five. CSS 100% original.
Author: Dj M
Template: twentytwentyfive
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 7.4
Text Domain: djm-dark
*/

/* ==========================================================================
   DJ M DARK — estilo "RawTracks-like", 100% original
   Paleta: negro profundo + degradado magenta→púrpura neón
   ========================================================================== */

:root{
  --djm-bg:        #0a0a0f;
  --djm-bg-2:      #111119;
  --djm-surface:   #16121f;
  --djm-surface-2: #1d1730;
  --djm-text:      #f2eef7;
  --djm-muted:     #a89fc0;
  --djm-magenta:   #ff1e8e;
  --djm-purple:    #7b2ff7;
  --djm-cyan:      #22d3ee;
  --djm-grad:      linear-gradient(135deg, #ff1e8e 0%, #7b2ff7 100%);
  --djm-grad-soft: linear-gradient(135deg, rgba(255,30,142,.18), rgba(123,47,247,.18));
  --djm-border:    rgba(255,255,255,.08);
  --djm-radius:    16px;
  --djm-shadow:    0 10px 40px rgba(123,47,247,.25);
}

/* ---- Base oscura -------------------------------------------------------- */
body,
.wp-site-blocks{
  background: var(--djm-bg);
  color: var(--djm-text);
}
body{
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

a{ color: var(--djm-magenta); text-decoration: none; }
a:hover{ color: #fff; }

/* Fondo con “glow” sutil arriba */
.wp-site-blocks::before{
  content:"";
  position: fixed; inset: 0;
  pointer-events: none; z-index: 0;
  background:
    radial-gradient(600px 300px at 15% -5%, rgba(255,30,142,.16), transparent 60%),
    radial-gradient(700px 340px at 90% 0%, rgba(123,47,247,.18), transparent 60%);
}
.wp-site-blocks > *{ position: relative; z-index: 1; }

/* ---- Titulares tipo cartel --------------------------------------------- */
h1,h2,h3,.wp-block-heading{
  font-family: "Archivo", "Inter", system-ui, sans-serif;
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.02;
  color: #fff;
}
h1,.wp-block-heading.has-xx-large-font-size{
  text-transform: uppercase;
  letter-spacing: .01em;
}

/* Texto con degradado (utilidad: añade clase djm-grad-text a un heading) */
.djm-grad-text{
  background: var(--djm-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ---- Botones ------------------------------------------------------------ */
.wp-block-button__link,
.wc-block-components-button,
.button, button.single_add_to_cart_button{
  background: var(--djm-grad) !important;
  color:#fff !important;
  border: 0 !important;
  border-radius: 999px !important;
  padding: .9em 1.8em !important;
  font-weight: 700 !important;
  letter-spacing: .02em;
  text-transform: uppercase;
  box-shadow: var(--djm-shadow);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.wp-block-button__link:hover,
.wc-block-components-button:hover,
.button:hover{
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: 0 14px 46px rgba(255,30,142,.4);
}
.wp-block-button.is-style-outline .wp-block-button__link{
  background: transparent !important;
  border: 1.5px solid var(--djm-magenta) !important;
  color:#fff !important;
  box-shadow:none;
}

/* ---- HERO --------------------------------------------------------------- */
.djm-hero{
  position: relative;
  min-height: 82vh;
  display:flex; align-items:center;
  padding: clamp(2rem,6vw,6rem);
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(10,10,15,.35), rgba(10,10,15,.85)),
    var(--djm-grad-soft),
    var(--djm-bg);
  border-bottom: 1px solid var(--djm-border);
}
.djm-hero h1{
  font-size: clamp(2.8rem, 8vw, 6.5rem);
  text-transform: uppercase;
}
.djm-hero .djm-kicker{
  display:inline-block;
  font-weight:700; letter-spacing:.28em; text-transform:uppercase;
  font-size:.8rem; color:var(--djm-magenta);
  margin-bottom:1rem;
}
.djm-hero p{ color:var(--djm-muted); max-width:46ch; font-size:1.1rem; }

/* ---- CARDS de tracks / sesiones / releases ------------------------------ */
.djm-card{
  background: var(--djm-surface);
  border: 1px solid var(--djm-border);
  border-radius: var(--djm-radius);
  overflow:hidden;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.djm-card:hover{
  transform: translateY(-4px);
  border-color: rgba(255,30,142,.5);
  box-shadow: var(--djm-shadow);
}
.djm-card__media{ position:relative; aspect-ratio:1/1; overflow:hidden; }
.djm-card__media img{ width:100%; height:100%; object-fit:cover; }
.djm-card__play{
  position:absolute; inset:auto 12px 12px auto;
  width:52px; height:52px; border-radius:50%;
  display:grid; place-items:center;
  background:var(--djm-grad); color:#fff;
  box-shadow:var(--djm-shadow);
}
.djm-card__body{ padding:1rem 1.2rem 1.3rem; }
.djm-card__title{ font-weight:800; color:#fff; margin:.2rem 0; }
.djm-card__meta{ color:var(--djm-muted); font-size:.9rem; }

/* Grid utilitario */
.djm-grid{
  display:grid; gap:1.4rem;
  grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
}

/* ---- Listado de sesiones/eventos --------------------------------------- */
.djm-event{
  display:flex; align-items:center; gap:1.2rem;
  padding:1.1rem 1.3rem;
  border:1px solid var(--djm-border); border-radius:14px;
  background:var(--djm-surface);
  transition:border-color .2s ease, background .2s ease;
}
.djm-event:hover{ border-color:rgba(123,47,247,.6); background:var(--djm-surface-2); }
.djm-event__date{
  min-width:64px; text-align:center;
  font-weight:800; line-height:1; color:#fff;
}
.djm-event__date small{ display:block; color:var(--djm-magenta); font-size:.72rem; letter-spacing:.15em; }
.djm-event__info{ flex:1; }
.djm-event__title{ font-weight:700; color:#fff; }
.djm-event__place{ color:var(--djm-muted); font-size:.9rem; }

/* ---- AudioIgniter: skin oscuro ----------------------------------------- */
.audioigniter-root,
.ai_root, .ai-root{
  border-radius: var(--djm-radius) !important;
  overflow:hidden;
  border:1px solid var(--djm-border);
  box-shadow: var(--djm-shadow);
}

/* ---- WooCommerce: adaptación oscura ------------------------------------ */
.woocommerce ul.products li.product,
.wc-block-grid__product{
  background:var(--djm-surface);
  border:1px solid var(--djm-border);
  border-radius:var(--djm-radius);
  padding:1rem;
  transition:transform .2s ease, border-color .2s ease;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);
  border-color:rgba(255,30,142,.5);
}
.woocommerce .price, .woocommerce ul.products li.product .price{
  color:var(--djm-magenta) !important; font-weight:800;
}
.woocommerce span.onsale{
  background:var(--djm-grad) !important; color:#fff; border-radius:999px;
}

/* ---- Footer ------------------------------------------------------------- */
.djm-footer{
  background:var(--djm-bg-2);
  border-top:1px solid var(--djm-border);
  padding: clamp(2rem,5vw,4rem);
  color:var(--djm-muted);
}
.djm-social{ display:flex; gap:1rem; flex-wrap:wrap; }
.djm-social a{
  width:44px; height:44px; border-radius:50%;
  display:grid; place-items:center;
  border:1px solid var(--djm-border); color:#fff;
  transition:background .2s ease, transform .2s ease;
}
.djm-social a:hover{ background:var(--djm-grad); transform:translateY(-2px); }

/* ---- Scrollbar y detalles ---------------------------------------------- */
::selection{ background:var(--djm-magenta); color:#fff; }

/* DJM NAV FIX 1.1 */
.wp-block-navigation__responsive-container.is-menu-open{
  background:#09090e !important;
  color:#f2eef7 !important;
  padding:clamp(1.5rem,6vw,3rem) !important;
  z-index:100000 !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{
  align-items:flex-end !important;
  padding-top:4rem !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{
  align-items:flex-end !important;
  gap:.55rem !important;
  width:100%;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item{
  width:100%; justify-content:flex-end;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
  color:#f2eef7 !important;
  font-family:"Archivo",sans-serif;
  font-size:clamp(1.5rem,7vw,2.5rem) !important;
  font-weight:700;
  line-height:1.25;
  padding:.35rem 0 !important;
  text-align:right;
}
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content{
  color:var(--djm-magenta) !important;
}
.djm-footer ul{list-style:none;padding:0;margin:0;}
.djm-footer li{margin:.45rem 0;}
.djm-footer a{color:var(--djm-muted);}
.djm-footer a:hover{color:var(--djm-magenta);}
.djm-footer .wp-block-separator{border-color:var(--djm-border);margin-top:2rem;margin-bottom:1.5rem;}
@media (max-width:781px){
 .djm-footer .wp-block-column{margin-bottom:1.5rem;}
 .djm-footer{text-align:center;}
}