/* EDUC English — css/features/dictionary.css */

/* ════ DICIONÁRIO INTEGRADO ═══════════════════════════════════ */
#sc-dict{
  position:fixed;inset:0;z-index:8800;
  background:var(--bg);display:none;flex-direction:column;
  overflow:hidden;
}
#sc-dict.visivel{display:flex}


/* Header */
.dict-header{
  background:rgba(0,0,0,.6);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  padding:10px 16px;display:flex;align-items:center;gap:10px;
  position:sticky;top:0;z-index:10;flex-shrink:0;
}
.dict-back{
  padding:6px 12px;border-radius:7px;border:1px solid var(--border2);
  background:rgba(255,255,255,.05);color:var(--muted);
  font-family:var(--h);font-size:12px;font-weight:700;cursor:pointer;
  transition:.15s;flex-shrink:0;
}
.dict-back:hover{color:#fff;border-color:rgba(255,255,255,.3)}

/* Search bar */
.dict-search-wrap{
  flex:1;display:flex;align-items:center;gap:8px;
  background:rgba(255,255,255,.07);border:1.5px solid var(--border2);
  border-radius:10px;padding:0 12px;transition:.18s;
}
.dict-search-wrap:focus-within{border-color:var(--green);background:rgba(16,185,129,.06)}
.dict-search-ico{font-size:1rem;color:var(--muted);flex-shrink:0}
.dict-search-input{
  flex:1;background:none;border:none;outline:none;
  color:#fff;font-family:var(--h);font-size:14px;font-weight:600;
  padding:9px 0;
}
.dict-search-input::placeholder{color:rgba(255,255,255,.25)}
.dict-clear-btn{
  background:none;border:none;color:var(--muted);cursor:pointer;
  font-size:1rem;padding:4px;display:none;
}
.dict-clear-btn.show{display:block}

/* Corpo */
.dict-body{flex:1;overflow-y:auto;padding:20px 16px;max-width:680px;margin:0 auto;width:100%}

/* Estado vazio / inicial */
.dict-empty{
  text-align:center;padding:60px 20px;
  display:flex;flex-direction:column;align-items:center;gap:12px;
}
.dict-empty-ico{font-size:3.5rem;opacity:.4;filter:grayscale(1)}
.dict-empty-txt{font-size:14px;color:var(--muted);line-height:1.7}
.dict-empty-tip{
  font-size:11px;color:rgba(255,255,255,.2);font-family:var(--m);
  background:rgba(255,255,255,.04);border:1px solid var(--border);
  border-radius:8px;padding:6px 14px;
}

/* Loading */
.dict-loading{
  text-align:center;padding:48px 20px;
  color:var(--muted);font-size:13px;
  display:flex;flex-direction:column;align-items:center;gap:12px;
}
.dict-spinner{
  width:32px;height:32px;border:3px solid rgba(255,255,255,.1);
  border-top-color:var(--green);border-radius:50%;
  animation:dictSpin .7s linear infinite;
}
@keyframes dictSpin{to{transform:rotate(360deg)}}

/* Resultado */
.dict-word-header{
  display:flex;align-items:flex-start;justify-content:space-between;
  margin-bottom:16px;gap:12px;flex-wrap:wrap;
}
.dict-word{
  font-family:var(--h);font-size:2rem;font-weight:900;color:#fff;
  line-height:1.1;
}
.dict-phonetic{font-size:14px;color:var(--muted);font-family:var(--m);margin-top:4px}
.dict-audio-btn{
  display:flex;align-items:center;gap:6px;
  background:linear-gradient(135deg,var(--green),var(--teal));
  border:none;border-radius:10px;padding:9px 16px;
  color:#fff;font-family:var(--h);font-size:12px;font-weight:800;
  cursor:pointer;transition:.18s;flex-shrink:0;
}
.dict-audio-btn:hover{transform:translateY(-1px);opacity:.9}
.dict-audio-btn.playing{animation:dictPulse .8s ease-in-out infinite}
@keyframes dictPulse{0%,100%{box-shadow:none}50%{box-shadow:0 0 18px rgba(16,185,129,.5)}}

/* Part of speech block */
.dict-pos-block{margin-bottom:18px}
.dict-pos-label{
  font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--green);font-family:var(--m);margin-bottom:10px;
  display:flex;align-items:center;gap:8px;
}
.dict-pos-label::after{content:'';flex:1;height:1px;background:rgba(16,185,129,.2)}

/* Definition item */
.dict-def-item{
  display:flex;gap:10px;margin-bottom:10px;
  background:rgba(255,255,255,.03);border:1px solid var(--border);
  border-radius:10px;padding:12px 14px;
}
.dict-def-num{
  font-family:var(--m);font-size:11px;font-weight:700;
  color:var(--muted);flex-shrink:0;padding-top:2px;
  width:18px;text-align:right;
}
.dict-def-text{font-size:13px;color:var(--text);line-height:1.65;flex:1}
.dict-def-example{
  font-size:11.5px;color:rgba(255,255,255,.4);font-style:italic;
  margin-top:5px;line-height:1.6;
  border-left:2px solid rgba(16,185,129,.25);padding-left:8px;
}

/* Synonyms / Antonyms */
.dict-tags-wrap{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.dict-tag{
  font-size:11px;font-weight:700;padding:3px 10px;border-radius:8px;
  cursor:pointer;transition:.15s;font-family:var(--m);
}
.dict-tag.syn{background:rgba(59,130,246,.12);color:var(--blue);border:1px solid rgba(59,130,246,.2)}
.dict-tag.syn:hover{background:rgba(59,130,246,.25)}
.dict-tag.ant{background:rgba(239,68,68,.1);color:#f87171;border:1px solid rgba(239,68,68,.18)}
.dict-tag.ant:hover{background:rgba(239,68,68,.2)}
.dict-tags-label{font-size:10px;color:var(--muted);font-weight:700;width:100%;font-family:var(--m);letter-spacing:.05em}

/* Divider */
.dict-divider{height:1px;background:var(--border);margin:18px 0}

/* Erro */
.dict-error{
  text-align:center;padding:40px 20px;
}
.dict-error-ico{font-size:2.5rem;margin-bottom:10px;display:block}
.dict-error-txt{font-size:14px;color:var(--muted);line-height:1.7;margin-bottom:16px}
.dict-error-suggest{font-size:12px;color:rgba(255,255,255,.25)}

/* History chips */
.dict-history{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:20px}
.dict-hist-chip{
  font-size:11px;font-weight:700;padding:5px 12px;border-radius:20px;
  background:rgba(255,255,255,.06);border:1px solid var(--border2);
  color:var(--muted);cursor:pointer;transition:.15s;font-family:var(--m);
}
.dict-hist-chip:hover{color:#fff;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.1)}

/* Botão flutuante dicionário (aparece nas telas do curso) */
.dict-fab{
  position:fixed;bottom:22px;right:18px;z-index:500;
  width:48px;height:48px;border-radius:50%;border:none;
  background:linear-gradient(135deg,var(--blue),var(--purple));
  color:#fff;font-size:1.4rem;cursor:pointer;
  box-shadow:0 4px 18px rgba(59,130,246,.4);
  transition:.2s;display:none;align-items:center;justify-content:center;
}
.dict-fab:hover{transform:scale(1.1);box-shadow:0 6px 24px rgba(59,130,246,.55)}
.dict-fab.show{display:flex}

/* Tooltip do FAB */
.dict-fab-tip{
  position:fixed;bottom:26px;right:76px;z-index:500;
  background:rgba(13,27,46,.95);border:1px solid var(--border2);
  border-radius:8px;padding:5px 11px;
  font-size:11px;font-weight:700;color:var(--text);
  white-space:nowrap;pointer-events:none;
  opacity:0;transition:.2s;
}
.dict-fab:hover ~ .dict-fab-tip{opacity:1}