/* ════════════════════════════════════════
   POPUPS.CSS — Shared popup styles
   S.O. HUMANO / O.S. HUMAN
════════════════════════════════════════ */

.pop-overlay {
  position:fixed;inset:0;z-index:9999;
  background:rgba(4,4,4,0.94);
  backdrop-filter:blur(7px);
  display:flex;align-items:center;justify-content:center;
  padding:16px;
  animation:popIn .35s ease;
}
.pop-overlay.hidden { display:none; }

@keyframes popIn { from{opacity:0} to{opacity:1} }
@keyframes popUp { from{opacity:0;transform:translateY(32px)} to{opacity:1;transform:translateY(0)} }
@keyframes doBlink { 0%,100%{opacity:1} 50%{opacity:0} }
@keyframes doPulse { 0%,100%{box-shadow:0 0 0 0 rgba(201,168,76,0)} 50%{box-shadow:0 0 18px 4px rgba(201,168,76,0.18)} }

.pop-modal {
  background:#080808;
  border:1px solid rgba(201,168,76,0.28);
  border-radius:4px;
  width:100%;max-width:600px;
  max-height:92vh;overflow-y:auto;
  animation:popUp .5s cubic-bezier(.22,1,.36,1);
  position:relative;
  box-shadow:0 0 60px rgba(201,168,76,0.07);
}
.pop-modal::before,.pop-modal::after {
  content:'';position:absolute;
  width:18px;height:18px;
  border-color:#C9A84C;border-style:solid;
}
.pop-modal::before{top:-1px;left:-1px;border-width:2px 0 0 2px;}
.pop-modal::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0;}
.pop-modal::-webkit-scrollbar{width:3px;}
.pop-modal::-webkit-scrollbar-thumb{background:rgba(201,168,76,0.2);border-radius:2px;}

/* header */
.pop-hd {
  padding:26px 30px 18px;
  border-bottom:1px solid rgba(201,168,76,0.12);
  position:relative;
}
.pop-tag {
  font-family:'Share Tech Mono',monospace;
  font-size:10px;color:#C9A84C;
  letter-spacing:3px;text-transform:uppercase;
  margin-bottom:9px;
  display:flex;align-items:center;gap:7px;
}
.pop-tag::before {
  content:'';display:inline-block;
  width:6px;height:6px;
  background:#C9A84C;border-radius:50%;
  animation:doBlink 1.4s infinite;
}
.pop-title {
  font-family:'Cinzel',serif;
  font-size:20px;color:#F0EDE6;letter-spacing:1px;margin-bottom:5px;
}
.pop-sub {
  font-family:'Rajdhani',sans-serif;
  font-size:13px;color:#777;line-height:1.5;
}
.pop-close {
  position:absolute;top:18px;right:22px;
  background:none;border:none;
  color:#555;font-size:18px;cursor:pointer;
  font-family:'Share Tech Mono',monospace;
  transition:color .2s;
}
.pop-close:hover{color:#C9A84C;}

/* progress */
.pop-progress {
  padding:13px 30px;
  border-bottom:1px solid rgba(201,168,76,0.07);
  display:flex;align-items:center;gap:12px;
}
.pop-bar-bg{flex:1;height:2px;background:rgba(201,168,76,0.1);border-radius:2px;overflow:hidden;}
.pop-bar-fill{height:100%;background:#C9A84C;border-radius:2px;transition:width .5s cubic-bezier(.22,1,.36,1);width:0%;}
.pop-bar-lbl{font-family:'Share Tech Mono',monospace;font-size:10px;color:#C9A84C;white-space:nowrap;}

/* body */
.pop-body{padding:26px 30px 30px;}

/* ── LANGUAGE POPUP ── */
#lang-modal{max-width:460px;}
.lang-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:4px;}
.lang-btn {
  background:#0f0f0f;
  border:1px solid rgba(201,168,76,0.2);
  border-radius:3px;padding:28px 20px 22px;
  cursor:pointer;text-align:center;
  transition:border-color .2s,background .2s,box-shadow .2s;
  position:relative;overflow:hidden;
}
.lang-btn::before {
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(201,168,76,0.07),transparent);
  opacity:0;transition:opacity .3s;
}
.lang-btn:hover{border-color:#C9A84C;box-shadow:0 0 20px rgba(201,168,76,0.1);}
.lang-btn:hover::before{opacity:1;}
.lang-flag{font-size:36px;display:block;margin-bottom:12px;}
.lang-name{font-family:'Cinzel',serif;font-size:15px;color:#C9A84C;letter-spacing:1px;display:block;margin-bottom:4px;}
.lang-sub{font-family:'Rajdhani',sans-serif;font-size:12px;color:#666;}

/* ── DIAGNOSTIC POPUP ── */
.diag-q-wrap{animation:popUp .35s ease;}
.diag-q-num{font-family:'Share Tech Mono',monospace;font-size:10px;color:#9A7A2E;letter-spacing:2px;margin-bottom:9px;}
.diag-q-text{font-family:'Rajdhani',sans-serif;font-size:18px;font-weight:600;color:#F0EDE6;line-height:1.45;margin-bottom:20px;}
.diag-opcoes{display:flex;flex-direction:column;gap:9px;}
.diag-opcao {
  display:flex;align-items:flex-start;gap:13px;
  background:#111;border:1px solid rgba(201,168,76,0.12);
  border-radius:3px;padding:13px 15px;
  cursor:pointer;text-align:left;width:100%;
  transition:border-color .2s,background .2s,box-shadow .2s;
  position:relative;overflow:hidden;
}
.diag-opcao::before {
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(201,168,76,0.07),transparent);
  opacity:0;transition:opacity .3s;
}
.diag-opcao:hover{border-color:#C9A84C;box-shadow:0 0 10px rgba(201,168,76,0.08);}
.diag-opcao:hover::before{opacity:1;}
.diag-opcao.sel{border-color:#C9A84C;background:rgba(201,168,76,0.05);pointer-events:none;animation:doPulse 1s ease;}
.diag-letra {
  font-family:'Share Tech Mono',monospace;font-size:10px;color:#C9A84C;
  background:rgba(201,168,76,0.08);border:1px solid rgba(201,168,76,0.25);
  border-radius:2px;width:24px;height:24px;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;margin-top:1px;transition:background .2s,color .2s;
}
.diag-opcao.sel .diag-letra{background:#C9A84C;color:#080808;}
.diag-opcao-txt{font-family:'Rajdhani',sans-serif;font-size:14px;color:#777;line-height:1.4;transition:color .2s;}
.diag-opcao:hover .diag-opcao-txt,.diag-opcao.sel .diag-opcao-txt{color:#F0EDE6;}

/* resultado */
.diag-res{animation:popUp .4s ease;}
.diag-status{font-family:'Share Tech Mono',monospace;font-size:10px;letter-spacing:3px;margin-bottom:14px;display:flex;align-items:center;gap:7px;}
.s-critico{color:#e06060;} .s-moderado{color:#e0b060;} .s-otimizado{color:#60c080;}
.diag-alerta {
  font-family:'Rajdhani',sans-serif;font-size:15px;color:#F0EDE6;line-height:1.55;
  margin-bottom:22px;padding:15px 18px;
  border-left:2px solid #C9A84C;background:rgba(201,168,76,0.03);border-radius:0 3px 3px 0;
}
.diag-ex-card {
  background:#111;border:1px solid rgba(201,168,76,0.25);border-radius:3px;padding:20px 22px;position:relative;
}
.diag-ex-card::before{content:'';position:absolute;top:0;left:0;bottom:0;width:2px;background:#C9A84C;border-radius:2px 0 0 2px;}
.diag-ex-badge{font-family:'Share Tech Mono',monospace;font-size:9px;letter-spacing:2px;color:#9A7A2E;margin-bottom:10px;text-transform:uppercase;}
.diag-ex-num{font-family:'Cinzel',serif;font-size:24px;color:#C9A84C;margin-bottom:4px;letter-spacing:1px;}
.diag-ex-nome{font-family:'Rajdhani',sans-serif;font-size:15px;color:#F0EDE6;font-weight:600;margin-bottom:10px;}
.diag-ex-local{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px;}
.diag-ex-local span {
  font-family:'Share Tech Mono',monospace;font-size:10px;color:#C9A84C;
  background:rgba(201,168,76,0.08);border:1px solid rgba(201,168,76,0.2);
  border-radius:2px;padding:3px 8px;
}
.diag-passos{border-top:1px solid rgba(201,168,76,0.1);padding-top:16px;display:flex;flex-direction:column;gap:11px;}
.diag-passo{display:flex;gap:12px;align-items:flex-start;}
.diag-passo-n{font-family:'Share Tech Mono',monospace;font-size:10px;color:#080808;background:#C9A84C;border-radius:2px;width:20px;height:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-weight:700;margin-top:2px;}
.diag-passo-txt{font-family:'Rajdhani',sans-serif;font-size:13px;color:#888;line-height:1.5;}
.diag-prazo{font-family:'Share Tech Mono',monospace;font-size:10px;color:#555;letter-spacing:1px;margin-top:20px;padding-top:16px;border-top:1px solid rgba(201,168,76,0.08);text-align:center;}
.btn-fechar{margin-top:20px;width:100%;background:#C9A84C;color:#080808;border:none;border-radius:2px;font-family:'Cinzel',serif;font-size:13px;letter-spacing:2px;padding:14px;cursor:pointer;transition:opacity .2s,box-shadow .2s;box-shadow:0 0 22px rgba(201,168,76,0.22);}
.btn-fechar:hover{opacity:.87;box-shadow:0 0 34px rgba(201,168,76,0.38);}
.btn-refazer{margin-top:9px;width:100%;background:transparent;border:1px solid rgba(201,168,76,0.2);color:#666;font-family:'Rajdhani',sans-serif;font-size:13px;letter-spacing:1px;padding:10px;cursor:pointer;border-radius:2px;transition:border-color .2s,color .2s;}
.btn-refazer:hover{border-color:#C9A84C;color:#C9A84C;}

@media(max-width:500px){
  .pop-hd,.pop-body{padding-left:18px;padding-right:18px;}
  .pop-progress{padding-left:18px;padding-right:18px;}
  .lang-grid{gap:10px;}
  .diag-q-text{font-size:16px;}
}