/* ════════════════════════════════════════════════════════════════
   ADVANCED TOOLS MODULES — DarkMuse
   Estilos específicos de los módulos funcionales:
   · Presets · Generate Scope · Lock System
   Todos los selectores con prefijo .atpm- (módulos) para no chocar
   con .atp- (panel base) ni con el resto de la app.
   ════════════════════════════════════════════════════════════════ */

/* ── Layout común de los módulos ─────────────────────────────── */
.atpm{
  padding:14px 16px 18px;
  display:flex;
  flex-direction:column;
  gap:14px;
  animation:atpmFadeIn .25s ease forwards;
}
@keyframes atpmFadeIn{
  from{opacity:0;transform:translateY(4px)}
  to  {opacity:1;transform:translateY(0)}
}
.atpm-section-label{
  font-family:var(--ff-cinzel);
  font-size:9px;
  letter-spacing:2px;
  color:var(--text3);
  text-transform:uppercase;
  margin-bottom:-4px;
}
.atpm-divider{
  height:1px;
  background:var(--border);
  margin:2px 0;
}
.atpm-empty{
  font-family:var(--ff-crimson);
  font-size:12px;
  color:var(--text3);
  font-style:italic;
  text-align:center;
  padding:14px 8px;
  border:1px dashed var(--border2);
  border-radius:6px;
}
.atpm-toast{
  position:fixed;
  bottom:24px;
  right:24px;
  background:var(--bg3);
  border:1px solid var(--gold);
  color:var(--text);
  padding:10px 16px;
  border-radius:6px;
  font-family:var(--ff-cinzel);
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  box-shadow:0 8px 24px rgba(0,0,0,.5);
  z-index:1200;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .2s, transform .2s;
  pointer-events:none;
}
.atpm-toast.atpm-show{opacity:1;transform:translateY(0)}

/* ────────────────────────────────────────────────────────────── */
/* ── 1) PRESETS ───────────────────────────────────────────────── */
/* ────────────────────────────────────────────────────────────── */
.atpm-search-row{
  display:flex;
  gap:6px;
  align-items:center;
}
.atpm-search{
  flex:1;
  background:var(--bg3);
  border:1px solid var(--border2);
  color:var(--text);
  font-family:var(--ff-crimson);
  font-size:13px;
  padding:7px 10px;
  border-radius:5px;
  outline:none;
  transition:border-color .15s;
}
.atpm-search:focus{ border-color:var(--gold) }
.atpm-search::placeholder{ color:var(--text3) }

.atpm-icon-btn{
  width:32px;height:32px;
  border-radius:5px;
  border:1px solid var(--border2);
  background:var(--bg3);
  color:var(--text2);
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;line-height:1;
  transition:.15s;
  flex-shrink:0;
}
.atpm-icon-btn:hover{
  background:var(--bg4);
  color:var(--gold2);
  border-color:var(--gold);
}

.atpm-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.atpm-chip{
  padding:5px 10px;
  border-radius:14px;
  border:1px solid var(--border2);
  background:var(--bg3);
  color:var(--text2);
  font-family:var(--ff-cinzel);
  font-size:9px;
  letter-spacing:1.4px;
  text-transform:uppercase;
  cursor:pointer;
  transition:.15s;
  white-space:nowrap;
}
.atpm-chip:hover{
  background:var(--bg4);
  color:var(--text);
}
.atpm-chip.atpm-active{
  background:rgba(232,184,75,.15);
  color:var(--gold2);
  border-color:var(--gold);
}

.atpm-preset-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  max-height:340px;
  overflow-y:auto;
  padding-right:2px;
}
.atpm-preset-card{
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:7px;
  padding:11px 12px;
  display:flex;
  align-items:flex-start;
  gap:10px;
  transition:.15s;
  position:relative;
}
.atpm-preset-card:hover{
  border-color:var(--gold);
  background:var(--bg4);
}
.atpm-preset-icon{
  flex-shrink:0;
  width:32px;height:32px;
  border-radius:5px;
  background:rgba(232,184,75,.1);
  border:1px solid rgba(232,184,75,.35);
  display:flex;align-items:center;justify-content:center;
  font-size:14px;
  color:var(--gold2);
}
.atpm-preset-main{
  flex:1;
  min-width:0;
}
.atpm-preset-name{
  font-family:var(--ff-cinzel);
  font-size:12px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text);
  margin-bottom:3px;
  line-height:1.2;
  display:flex;
  align-items:center;
  gap:6px;
}
.atpm-preset-badge{
  font-family:var(--ff-mono);
  font-size:8px;
  letter-spacing:.5px;
  color:var(--text3);
  background:var(--bg);
  border:1px solid var(--border2);
  padding:1px 5px;
  border-radius:3px;
  text-transform:uppercase;
}
.atpm-preset-badge.atpm-badge-user{ color:var(--gold2); border-color:rgba(232,184,75,.4) }
.atpm-preset-desc{
  font-family:var(--ff-crimson);
  font-size:12px;
  color:var(--text3);
  line-height:1.3;
}
.atpm-preset-actions{
  display:flex;
  gap:4px;
  flex-direction:column;
  flex-shrink:0;
}
.atpm-mini-btn{
  width:26px;height:26px;
  border-radius:4px;
  border:1px solid var(--border2);
  background:transparent;
  color:var(--text3);
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;
  transition:.15s;
}
.atpm-mini-btn:hover{
  background:var(--bg);
  color:var(--gold2);
  border-color:var(--gold);
}
.atpm-mini-btn.atpm-danger:hover{
  color:var(--crimson);
  border-color:var(--crimson);
}

.atpm-action-btn{
  width:100%;
  padding:9px 12px;
  border-radius:5px;
  border:1px solid var(--border2);
  background:var(--bg3);
  color:var(--text2);
  font-family:var(--ff-cinzel);
  font-size:11px;
  letter-spacing:1.6px;
  text-transform:uppercase;
  cursor:pointer;
  transition:.15s;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.atpm-action-btn:hover{
  background:var(--bg4);
  border-color:var(--gold);
  color:var(--gold2);
}
.atpm-action-btn.atpm-primary{
  border-color:var(--gold);
  color:var(--gold2);
}
.atpm-action-btn.atpm-primary:hover{
  background:rgba(232,184,75,.15);
}
.atpm-action-btn.atpm-danger{
  border-color:rgba(232,74,96,.4);
  color:var(--crimson);
}
.atpm-action-btn.atpm-danger:hover{
  background:rgba(232,74,96,.08);
  border-color:var(--crimson);
}

/* ────────────────────────────────────────────────────────────── */
/* ── 2) GENERATE SCOPE ────────────────────────────────────────── */
/* ────────────────────────────────────────────────────────────── */
.atpm-scope-list{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.atpm-scope-item{
  display:flex;
  align-items:flex-start;
  gap:11px;
  padding:11px 12px;
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:6px;
  cursor:pointer;
  transition:.15s;
  text-align:left;
  width:100%;
  color:var(--text2);
  font-family:inherit;
}
.atpm-scope-item:hover{
  background:var(--bg4);
  border-color:rgba(232,184,75,.4);
}
.atpm-scope-item.atpm-selected{
  background:rgba(232,184,75,.1);
  border-color:var(--gold);
}
.atpm-scope-radio{
  flex-shrink:0;
  width:16px;height:16px;
  border-radius:50%;
  border:2px solid var(--border2);
  position:relative;
  margin-top:1px;
  transition:.15s;
}
.atpm-scope-item.atpm-selected .atpm-scope-radio{
  border-color:var(--gold);
}
.atpm-scope-item.atpm-selected .atpm-scope-radio::after{
  content:'';
  position:absolute;
  inset:2px;
  border-radius:50%;
  background:var(--gold);
}
.atpm-scope-text{flex:1;min-width:0}
.atpm-scope-name{
  font-family:var(--ff-cinzel);
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
  color:var(--text);
  margin-bottom:3px;
  line-height:1.2;
}
.atpm-scope-item.atpm-selected .atpm-scope-name{color:var(--gold2)}
.atpm-scope-desc{
  font-family:var(--ff-crimson);
  font-size:12px;
  color:var(--text3);
  line-height:1.3;
}
.atpm-scope-count{
  margin-top:4px;
  font-family:var(--ff-mono);
  font-size:9px;
  color:var(--gold);
  letter-spacing:.5px;
}

/* ────────────────────────────────────────────────────────────── */
/* ── 3) LOCK SYSTEM ───────────────────────────────────────────── */
/* ────────────────────────────────────────────────────────────── */
.atpm-lock-stats{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:9px 12px;
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:6px;
}
.atpm-lock-stats-num{
  font-family:var(--ff-cinzel);
  font-size:22px;
  color:var(--gold2);
  line-height:1;
}
.atpm-lock-stats-lbl{
  font-family:var(--ff-cinzel);
  font-size:9px;
  letter-spacing:1.5px;
  color:var(--text3);
  text-transform:uppercase;
}

.atpm-lock-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.atpm-lock-actions .atpm-action-btn{
  font-size:10px;
  padding:8px 6px;
  letter-spacing:1.3px;
}

.atpm-lock-grid{
  display:flex;
  flex-direction:column;
  gap:4px;
  max-height:220px;
  overflow-y:auto;
  padding:8px;
  background:var(--bg3);
  border:1px solid var(--border2);
  border-radius:6px;
}
.atpm-lock-grid-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  background:var(--bg);
  border-radius:4px;
  font-family:var(--ff-mono);
  font-size:11px;
  color:var(--text2);
}
.atpm-lock-grid-icon{
  color:var(--gold2);
  font-size:11px;
  flex-shrink:0;
}
.atpm-lock-grid-text{
  flex:1;
  min-width:0;
  display:flex;
  gap:4px;
  align-items:baseline;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.atpm-lock-grid-track{color:var(--text)}
.atpm-lock-grid-sec{color:var(--text3);font-size:10px}
.atpm-lock-grid-rm{
  width:22px;height:22px;
  border:1px solid transparent;
  background:transparent;
  color:var(--text3);
  border-radius:3px;
  cursor:pointer;
  font-size:12px;
  display:flex;align-items:center;justify-content:center;
  transition:.15s;
}
.atpm-lock-grid-rm:hover{
  color:var(--crimson);
  border-color:var(--crimson);
  background:rgba(232,74,96,.08);
}

/* ── Indicador visual de celda bloqueada en el sequencer ─────── */
/* Aplicado al `.seq-cell` original sin tocar su renderizado.    */
.seq-cell.atp-locked::before{
  content:'🔒';
  position:absolute;
  top:3px;
  left:3px;
  font-size:9px;
  z-index:5;
  pointer-events:none;
  text-shadow:0 0 4px rgba(0,0,0,.8);
  opacity:.85;
}
.seq-cell.atp-locked{
  position:relative;
  box-shadow:inset 0 0 0 1px rgba(232,184,75,.4);
}

/* ── Hint de selección actual (común a los tres módulos) ─────── */
.atpm-selection-hint{
  font-family:var(--ff-mono);
  font-size:10px;
  color:var(--text3);
  padding:6px 9px;
  background:rgba(232,184,75,.05);
  border:1px dashed rgba(232,184,75,.3);
  border-radius:4px;
  line-height:1.35;
}
.atpm-selection-hint b{color:var(--gold2);font-weight:normal}