/* ═══ ALMA IA · ASSESSMENT MODULE STYLES ═══ */
/* Prefijo .as- · 100% aislado · no sobrescribe CSS existente */

/* ── Root overlay ── */
.as-root {
  position: fixed; inset: 0; z-index: 8800;
  display: flex; align-items: center; justify-content: center;
  background: rgba(4, 4, 14, 0.94);
  backdrop-filter: blur(16px);
  opacity: 0; pointer-events: none;
  transition: opacity 0.35s ease;
  overflow-y: auto; padding: 20px 0;
}
.as-root.open { opacity: 1; pointer-events: all; }

/* ── Panel ── */
.as-panel {
  width: 92%; max-width: 440px;
  background: linear-gradient(170deg, #0d0426 0%, #05050f 100%);
  border: 1px solid rgba(147, 51, 234, 0.3);
  border-radius: 28px; padding: 32px 24px 28px;
  box-shadow: 0 0 60px rgba(88, 28, 135, 0.35), 0 24px 64px rgba(0,0,0,0.7);
  position: relative; text-align: center;
  transform: scale(0.93) translateY(12px);
  transition: transform 0.4s cubic-bezier(0.34,1.1,0.64,1);
}
.as-root.open .as-panel { transform: scale(1) translateY(0); }
.as-panel-center { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 340px; }
.as-panel-profile { max-width: 480px; }
.as-panel-q { text-align: left; }

/* ── Close ── */
.as-close-btn {
  position: absolute; top: 14px; right: 16px;
  background: rgba(255,255,255,0.05); border: 1px solid rgba(147,51,234,0.2);
  color: #666; width: 32px; height: 32px; border-radius: 50%;
  font-size: 13px; cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: all 0.2s; z-index: 2;
}
.as-close-btn:hover { color: #fff; border-color: #9333ea; }

/* ── Typography ── */
.as-hero-icon { font-size: 52px; margin-bottom: 12px; }
.as-pulse-icon { font-size: 52px; animation: asPulse 1.5s ease-in-out infinite; }
@keyframes asPulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.15);opacity:0.7} }

.as-title { font-family:'Cinzel',serif; font-size:20px; color:#e9d5ff; letter-spacing:2px; margin-bottom:8px; }
.as-subtitle { font-size:11px; color:#7c3aed; letter-spacing:3px; text-transform:uppercase; margin-bottom:18px; }
.as-body { font-size:13px; line-height:1.85; color:#c4b5d4; margin-bottom:20px; }
.as-legal { font-size:10px; color:#4b5563; margin-top:14px; letter-spacing:0.5px; }

/* ── Info grid ── */
.as-info-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:22px; }
.as-info-item {
  background: rgba(88,28,135,0.1); border:1px solid rgba(88,28,135,0.2);
  border-radius:14px; padding:12px 8px; display:flex; flex-direction:column;
  align-items:center; gap:6px; font-size:11px; color:#c4b5d4; line-height:1.4;
}
.as-info-icon { font-size:20px; }
.as-info-item small { font-size:9px; color:#7c3aed; letter-spacing:1px; }

/* ── Free badge ── */
.as-badge-free {
  display:inline-block; padding:6px 18px; margin-bottom:18px;
  background:linear-gradient(135deg,rgba(74,222,128,0.15),rgba(52,211,153,0.08));
  border:1px solid rgba(74,222,128,0.3); border-radius:50px;
  font-size:10px; color:#4ade80; letter-spacing:2px; font-weight:700;
}

/* ── Buttons ── */
.as-btn-primary {
  display:block; width:100%; padding:16px; margin-bottom:10px;
  background:linear-gradient(135deg,#7c3aed,#9333ea);
  border:none; border-radius:60px; color:#fff;
  font-size:14px; font-weight:700; font-family:'Montserrat',sans-serif;
  letter-spacing:1.5px; cursor:pointer; text-decoration:none; text-align:center;
  box-shadow:0 8px 28px rgba(124,58,237,0.4);
  transition:transform 0.2s,box-shadow 0.2s;
}
.as-btn-primary:hover { transform:scale(1.03); box-shadow:0 10px 36px rgba(124,58,237,0.6); }
.as-btn-primary:active { transform:scale(0.97); }
.as-btn-secondary {
  display:block; width:100%; padding:13px; margin-bottom:10px;
  background:rgba(147,51,234,0.1); border:1px solid rgba(147,51,234,0.35);
  border-radius:60px; color:#c4b5d4;
  font-size:13px; font-weight:600; font-family:'Montserrat',sans-serif;
  letter-spacing:1px; cursor:pointer;
  transition:all 0.2s;
}
.as-btn-secondary:hover { color:#fff; border-color:#9333ea; background:rgba(147,51,234,0.18); }
.as-btn-ghost {
  display:block; width:100%; padding:11px;
  background:transparent; border:1px solid rgba(255,255,255,0.07);
  border-radius:50px; color:#555; font-size:11px;
  font-family:'Montserrat',sans-serif; letter-spacing:1px; cursor:pointer;
  transition:all 0.2s;
}
.as-btn-ghost:hover { color:#888; border-color:rgba(255,255,255,0.15); }
.as-btn-next {
  display:block; width:100%; padding:15px; margin-top:20px;
  background:linear-gradient(135deg,#7c3aed,#9333ea);
  border:none; border-radius:60px; color:#fff;
  font-size:14px; font-weight:700; font-family:'Montserrat',sans-serif;
  letter-spacing:1.5px; cursor:pointer;
  box-shadow:0 6px 24px rgba(124,58,237,0.35);
  transition:transform 0.2s,box-shadow 0.2s,opacity 0.2s;
}
.as-btn-next:disabled { opacity:0.35; cursor:not-allowed; transform:none !important; }
.as-btn-next:not(:disabled):hover { transform:scale(1.02); }
.as-actions { display:flex; flex-direction:column; gap:0; margin-top:20px; }

/* ── Question header ── */
.as-q-header { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.as-q-counter { font-size:11px; color:#7c3aed; font-weight:700; letter-spacing:1px; white-space:nowrap; }
.as-progress-bar { flex:1; height:4px; background:rgba(147,51,234,0.15); border-radius:4px; overflow:hidden; }
.as-progress-fill { height:100%; background:linear-gradient(90deg,#7c3aed,#c084fc); border-radius:4px; transition:width 0.4s ease; }

/* Timer ring */
.as-timer-wrap { flex-shrink:0; }
.as-timer-ring { position:relative; width:42px; height:42px; }
.as-timer-ring svg { transform:rotate(-90deg); }
.as-ring-bg { fill:none; stroke:rgba(147,51,234,0.15); stroke-width:3; }
.as-ring-fill { fill:none; stroke:#9333ea; stroke-width:3; stroke-linecap:round; transition:stroke-dashoffset 1s linear,stroke 0.5s; }
.as-timer-num {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700; color:#c4b5d4;
}

/* ── Question body ── */
.as-q-type-badge { font-size:10px; color:#7c3aed; letter-spacing:2px; text-transform:uppercase; margin-bottom:12px; }
.as-q-text { font-size:16px; color:#e9d5ff; line-height:1.7; margin-bottom:20px; font-weight:500; }

/* ── Options ── */
.as-opts { display:flex; flex-direction:column; gap:10px; }
.as-opt {
  display:flex; align-items:center; gap:14px; padding:14px 16px;
  background:rgba(88,28,135,0.08); border:1px solid rgba(147,51,234,0.2);
  border-radius:16px; cursor:pointer; text-align:left;
  transition:all 0.22s; width:100%;
}
.as-opt:hover { background:rgba(147,51,234,0.15); border-color:rgba(147,51,234,0.5); }
.as-opt.selected { background:rgba(124,58,237,0.25); border-color:#9333ea; box-shadow:0 0 20px rgba(124,58,237,0.2); }
.as-opt-letter {
  width:28px; height:28px; border-radius:50%; flex-shrink:0;
  background:rgba(147,51,234,0.15); border:1px solid rgba(147,51,234,0.3);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:#a855f7;
}
.as-opt.selected .as-opt-letter { background:#7c3aed; color:#fff; border-color:#9333ea; }
.as-opt-text { font-size:13px; color:#c4b5d4; line-height:1.5; }
.as-opt.selected .as-opt-text { color:#fff; }

/* ── Loader bar ── */
.as-loader-bar { width:100%; height:5px; background:rgba(147,51,234,0.1); border-radius:5px; overflow:hidden; margin:20px 0; }
.as-loader-fill { height:100%; width:0; background:linear-gradient(90deg,#7c3aed,#c084fc); border-radius:5px; animation:asLoad 2.2s ease forwards; }
@keyframes asLoad { 0%{width:0} 100%{width:100%} }

/* ── Result ── */
.as-result-header { margin-bottom:20px; }
.as-result-icon { font-size:40px; margin-bottom:8px; }
.as-result-type { font-size:10px; color:#7c3aed; letter-spacing:3px; text-transform:uppercase; margin-bottom:6px; }
.as-result-label { font-family:'Cinzel',serif; font-size:22px; font-weight:700; letter-spacing:2px; }
.as-result-desc { font-size:13px; color:#c4b5d4; line-height:1.8; margin:0 0 20px; }

.as-score-ring-wrap { position:relative; width:150px; height:150px; margin:0 auto 20px; }
.as-score-svg { transform:rotate(-90deg); }
.as-score-bg { fill:none; stroke:rgba(147,51,234,0.12); stroke-width:6; }
.as-score-arc { fill:none; stroke-width:6; stroke-linecap:round; transition:stroke-dashoffset 1.4s cubic-bezier(0.4,0,0.2,1); }
.as-score-inner {
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center;
}
.as-score-num { font-family:'Cinzel',serif; font-size:30px; color:#e9d5ff; font-weight:700; }
.as-score-sublabel { font-size:10px; color:#7c3aed; letter-spacing:2px; text-transform:uppercase; margin-top:2px; }

/* ── Lock section ── */
.as-lock-section { margin:0 0 20px; }
.as-lock-icon { font-size:36px; margin-bottom:10px; }
.as-lock-title { font-size:15px; color:#e9d5ff; font-weight:700; margin-bottom:10px; }
.as-lock-text { font-size:12px; color:#c4b5d4; line-height:1.7; margin-bottom:18px; }
.as-lock-btn { display:block; text-decoration:none; }

/* ── Cooldown ── */
.as-days-left { font-family:'Cinzel',serif; font-size:32px; color:#9333ea; display:block; margin:10px 0; }
.as-prev-score { margin:16px 0; }
.as-prev-label { font-size:10px; color:#555; letter-spacing:2px; text-transform:uppercase; margin-bottom:8px; }
.as-prev-scores { display:flex; gap:16px; justify-content:center; font-size:14px; color:#c4b5d4; }
.as-prev-scores strong { color:#9333ea; }

/* ── Profile ── */
.as-profile-header { margin-bottom:24px; }
.as-profile-icon { font-size:44px; margin-bottom:12px; }
.as-dual-scores { display:flex; flex-direction:column; gap:14px; margin-bottom:18px; }
.as-dual-item { text-align:left; }
.as-dual-label { font-size:12px; color:#c4b5d4; margin-bottom:6px; font-weight:600; }
.as-dual-bar { height:8px; background:rgba(147,51,234,0.12); border-radius:8px; overflow:hidden; margin-bottom:5px; }
.as-dual-fill { height:100%; border-radius:8px; transition:width 1.2s cubic-bezier(0.4,0,0.2,1); }
.as-dual-num { font-size:12px; font-weight:700; letter-spacing:1px; }
.as-combined-score {
  font-size:13px; color:#c4b5d4; padding:12px 20px; margin-bottom:20px;
  background:rgba(147,51,234,0.08); border:1px solid rgba(147,51,234,0.2);
  border-radius:14px;
}
.as-combined-score strong { color:#c084fc; font-size:18px; }

/* ── Insights ── */
.as-insights { text-align:left; margin-bottom:20px; }
.as-insights-label { font-size:10px; color:#7c3aed; letter-spacing:3px; text-transform:uppercase; margin-bottom:12px; }
.as-insight-item {
  font-size:13px; color:#c4b5d4; line-height:1.7; padding:10px 14px; margin-bottom:8px;
  background:rgba(88,28,135,0.1); border-left:2px solid #7c3aed;
  border-radius:0 12px 12px 0;
}

/* ── Launcher button (floating) ── */
.as-launcher {
  position: fixed; bottom: 70px; right: 16px; z-index: 7500;
  width: 52px; height: 52px; border-radius: 50%;
  background: linear-gradient(135deg,#7c3aed,#9333ea);
  border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  box-shadow: 0 6px 24px rgba(124,58,237,0.5);
  transition: transform 0.25s, box-shadow 0.25s;
}
.as-launcher:hover { transform: scale(1.12); box-shadow: 0 8px 32px rgba(124,58,237,0.7); }
.as-launcher-tooltip {
  position: fixed; bottom: 128px; right: 16px; z-index: 7500;
  background: rgba(13,4,38,0.95); border: 1px solid rgba(147,51,234,0.3);
  border-radius: 12px; padding: 8px 14px;
  font-size: 11px; color: #c4b5d4; letter-spacing: 1px;
  white-space: nowrap; pointer-events: none;
  opacity: 0; transition: opacity 0.2s;
}
.as-launcher:hover + .as-launcher-tooltip,
.as-launcher:focus + .as-launcher-tooltip { opacity: 1; }
