/* ══════════════════════════════════════════════════════
   RCAD SEO Planner Pro — Frontend CSS v1.1.1
   RecursosCAD.com
   ══════════════════════════════════════════════════════ */

/* ── Variables ──────────────────────────────────────── */
:root {
  --rcad-primary:    #1a237e;
  --rcad-accent:     #1565c0;
  --rcad-orange:     #ff6a00;
  --rcad-orange-end: #ff4500;
  --rcad-green:      #2e7d32;
  --rcad-light-bg:   #f8f9ff;
  --rcad-border:     #e0e4ef;
  --rcad-text:       #1a1a2e;
  --rcad-muted:      #5f6368;
  --rcad-radius:     10px;
  --rcad-shadow:     0 2px 12px rgba(26,35,126,.10);
  --rcad-shadow-lg:  0 8px 32px rgba(26,35,126,.15);
}

/* ══════════════════════════════════════════════════════
   FAQ — Acordeón elegante
   Alta especificidad para sobreescribir temas
   ══════════════════════════════════════════════════════ */

/* Contenedor principal */
.entry-content .rcad-faq,
.post-content .rcad-faq,
article .rcad-faq,
.rcad-faq {
  margin: 2em 0 !important;
  border-radius: var(--rcad-radius) !important;
  overflow: hidden !important;
  box-shadow: 0 2px 16px rgba(26,35,126,.12) !important;
  border: 1px solid var(--rcad-border) !important;
  background: #fff !important;
}

/* Item individual */
.entry-content .rcad-faq-item,
.rcad-faq .rcad-faq-item {
  border-bottom: 1px solid var(--rcad-border) !important;
  background: #fff !important;
  margin: 0 !important;
  padding: 0 !important;
}

.entry-content .rcad-faq-item:last-child,
.rcad-faq .rcad-faq-item:last-child {
  border-bottom: none !important;
}

/* Pregunta — sobreescribir h3 del tema */
.entry-content .rcad-faq .rcad-faq-question,
.rcad-faq .rcad-faq-item .rcad-faq-question,
h3.rcad-faq-question {
  all: unset !important;
  display: block !important;
  font-family: inherit !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--rcad-primary) !important;
  padding: 1.1em 1.4em 1.1em 3.2em !important;
  margin: 0 !important;
  cursor: pointer !important;
  position: relative !important;
  line-height: 1.5 !important;
  background: #fff !important;
  transition: background .2s ease, color .2s ease !important;
  border: none !important;
  width: 100% !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

/* Flecha indicadora */
.entry-content .rcad-faq .rcad-faq-question::before,
.rcad-faq .rcad-faq-item .rcad-faq-question::before,
h3.rcad-faq-question::before {
  content: "▸" !important;
  position: absolute !important;
  left: 1.2em !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 1.15em !important;
  color: var(--rcad-accent) !important;
  transition: transform .25s ease !important;
  font-weight: 400 !important;
}

/* Estado abierto — pregunta */
.rcad-faq .rcad-faq-item.open .rcad-faq-question,
.entry-content .rcad-faq .rcad-faq-item.open .rcad-faq-question {
  background: var(--rcad-light-bg) !important;
  color: var(--rcad-accent) !important;
  border-bottom: 1px solid var(--rcad-border) !important;
}

/* Flecha rotada al abrir */
.rcad-faq .rcad-faq-item.open .rcad-faq-question::before,
.entry-content .rcad-faq .rcad-faq-item.open .rcad-faq-question::before {
  transform: translateY(-50%) rotate(90deg) !important;
  color: var(--rcad-accent) !important;
}

/* Hover en pregunta */
.rcad-faq .rcad-faq-item .rcad-faq-question:hover,
.entry-content .rcad-faq .rcad-faq-question:hover {
  background: var(--rcad-light-bg) !important;
  color: var(--rcad-accent) !important;
}

/* Respuesta — oculta por defecto */
.entry-content .rcad-faq .rcad-faq-answer,
.rcad-faq .rcad-faq-item .rcad-faq-answer {
  display: none !important;
  padding: 1em 1.4em 1.3em 3.2em !important;
  background: var(--rcad-light-bg) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

/* Respuesta visible cuando item está abierto */
.rcad-faq .rcad-faq-item.open .rcad-faq-answer,
.entry-content .rcad-faq .rcad-faq-item.open .rcad-faq-answer {
  display: block !important;
  animation: rcad-faq-open .22s ease !important;
}

/* Párrafos dentro de la respuesta */
.entry-content .rcad-faq .rcad-faq-answer p,
.rcad-faq .rcad-faq-answer p {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--rcad-text) !important;
  line-height: 1.75 !important;
  font-size: .97rem !important;
}

/* Animación de apertura */
@keyframes rcad-faq-open {
  from { opacity: 0; transform: translateY(-5px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ══════════════════════════════════════════════════════
   TABLAS — Estilos globales con alta especificidad
   ══════════════════════════════════════════════════════ */
.entry-content .rcad-table,
.entry-content .rcad-versions-table,
.entry-content .rcad-commands-table,
.entry-content .rcad-compare-table,
.entry-content .rcad-syntax-table,
.entry-content .rcad-shortcuts-table,
.entry-content .rcad-requirements-table,
.rcad-table,
.rcad-versions-table,
.rcad-commands-table,
.rcad-compare-table,
.rcad-syntax-table,
.rcad-shortcuts-table,
.rcad-requirements-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border-radius: var(--rcad-radius) !important;
  overflow: hidden !important;
  box-shadow: 0 2px 14px rgba(26,35,126,.10) !important;
  margin: 1.5em 0 !important;
  font-size: .93rem !important;
  border: none !important;
}

.entry-content .rcad-table th,
.entry-content .rcad-versions-table th,
.entry-content .rcad-commands-table th,
.entry-content .rcad-compare-table th,
.entry-content .rcad-syntax-table th,
.entry-content .rcad-shortcuts-table th,
.entry-content .rcad-requirements-table th,
.rcad-table th,
.rcad-versions-table th,
.rcad-commands-table th,
.rcad-compare-table th,
.rcad-syntax-table th,
.rcad-shortcuts-table th,
.rcad-requirements-table th {
  background: var(--rcad-primary) !important;
  color: #fff !important;
  padding: .75em 1.1em !important;
  text-align: left !important;
  font-weight: 700 !important;
  font-size: .85rem !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  border: none !important;
}

.entry-content .rcad-table td,
.entry-content .rcad-versions-table td,
.entry-content .rcad-commands-table td,
.entry-content .rcad-compare-table td,
.entry-content .rcad-syntax-table td,
.entry-content .rcad-shortcuts-table td,
.entry-content .rcad-requirements-table td,
.rcad-table td,
.rcad-versions-table td,
.rcad-commands-table td,
.rcad-compare-table td,
.rcad-syntax-table td,
.rcad-shortcuts-table td,
.rcad-requirements-table td {
  padding: .7em 1.1em !important;
  border-bottom: 1px solid var(--rcad-border) !important;
  border-left: none !important;
  border-right: none !important;
  color: var(--rcad-text) !important;
  vertical-align: middle !important;
  line-height: 1.5 !important;
  background: #fff !important;
}

/* Filas alternadas */
.rcad-table tr:nth-child(even) td,
.rcad-versions-table tr:nth-child(even) td,
.rcad-commands-table tr:nth-child(even) td,
.rcad-compare-table tr:nth-child(even) td,
.rcad-syntax-table tr:nth-child(even) td,
.rcad-shortcuts-table tr:nth-child(even) td,
.rcad-requirements-table tr:nth-child(even) td {
  background: #f4f6fb !important;
}

/* Última fila sin borde */
.rcad-table tr:last-child td,
.rcad-versions-table tr:last-child td,
.rcad-commands-table tr:last-child td,
.rcad-compare-table tr:last-child td,
.rcad-syntax-table tr:last-child td,
.rcad-shortcuts-table tr:last-child td,
.rcad-requirements-table tr:last-child td {
  border-bottom: none !important;
}

/* Hover */
.rcad-table tbody tr:hover td,
.rcad-versions-table tbody tr:hover td,
.rcad-commands-table tbody tr:hover td,
.rcad-compare-table tbody tr:hover td {
  background: #eef1fb !important;
}

/* Celda ganadora comparativa */
.rcad-compare-table .rcad-winner {
  background: #e8f5e9 !important;
  color: var(--rcad-green) !important;
  font-weight: 700 !important;
}

/* Responsive */
@media (max-width: 680px) {
  .rcad-table,
  .rcad-versions-table,
  .rcad-commands-table,
  .rcad-compare-table,
  .rcad-syntax-table,
  .rcad-shortcuts-table,
  .rcad-requirements-table {
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

/* ══════════════════════════════════════════════════════
   BOTÓN DESCARGA — Naranja llamativo
   ══════════════════════════════════════════════════════ */
.rcad-download-block {
  background: linear-gradient(135deg, #1a237e 0%, #1565c0 100%);
  border-radius: var(--rcad-radius);
  padding: 2em 2.4em;
  margin: 2em 0;
  box-shadow: var(--rcad-shadow-lg);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.5em;
  flex-wrap: wrap;
  position: relative;
  overflow: hidden;
}

.rcad-download-block::before {
  content: "";
  position: absolute;
  top: -40%; right: -10%;
  width: 300px; height: 300px;
  background: rgba(255,255,255,.05);
  border-radius: 50%;
  pointer-events: none;
}

.rcad-download-block-info { flex: 1; min-width: 200px; }

.rcad-download-block-title {
  font-size: 1.2rem;
  font-weight: 700;
  color: #fff;
  margin: 0 0 .4em;
  line-height: 1.3;
}

.rcad-download-block-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .5em;
  margin-top: .6em;
}

.rcad-download-tag {
  background: rgba(255,255,255,.15);
  color: #fff;
  font-size: .78rem;
  font-weight: 600;
  padding: .25em .75em;
  border-radius: 20px;
  letter-spacing: .02em;
}

.rcad-download-tag.rcad-tag-version {
  background: rgba(255,255,255,.25);
  font-size: .82rem;
}

/* Botón naranja principal */
.rcad-download-block-btn,
a.rcad-download-block-btn,
.entry-content a.rcad-download-block-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: .6em !important;
  background: linear-gradient(135deg, #ff7c00 0%, #ff4500 100%) !important;
  color: #fff !important;
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  padding: .9em 2em !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  box-shadow: 0 4px 20px rgba(255,100,0,.45), 0 2px 8px rgba(0,0,0,.2) !important;
  transition: transform .2s, box-shadow .2s, background .2s !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  border: none !important;
}

.rcad-download-block-btn:hover,
a.rcad-download-block-btn:hover,
.entry-content a.rcad-download-block-btn:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 28px rgba(255,100,0,.55), 0 4px 12px rgba(0,0,0,.25) !important;
  background: linear-gradient(135deg, #ff8c1a 0%, #ff5500 100%) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.rcad-download-block-btn svg { width: 22px; height: 22px; flex-shrink: 0; }

.rcad-download-block-subtitle {
  font-size: .83rem;
  color: rgba(255,255,255,.75);
  margin: .5em 0 0;
}

/* Botón compacto inline */
.rcad-btn-download,
a.rcad-btn-download,
.entry-content a.rcad-btn-download {
  display: inline-flex !important;
  align-items: center !important;
  gap: .5em !important;
  background: linear-gradient(135deg, #ff7c00 0%, #ff4500 100%) !important;
  color: #fff !important;
  font-weight: 800 !important;
  font-size: .95rem !important;
  padding: .7em 1.6em !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  transition: background .2s, transform .15s, box-shadow .2s !important;
  margin: .5em 0 !important;
  box-shadow: 0 3px 12px rgba(255,100,0,.4) !important;
  text-transform: uppercase !important;
  letter-spacing: .02em !important;
  border: none !important;
}

.rcad-btn-download:hover,
a.rcad-btn-download:hover,
.entry-content a.rcad-btn-download:hover {
  background: linear-gradient(135deg, #ff8c1a 0%, #ff5500 100%) !important;
  color: #fff !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 18px rgba(255,100,0,.5) !important;
  text-decoration: none !important;
}

@media (max-width: 640px) {
  .rcad-download-block { flex-direction: column; text-align: center; }
  .rcad-download-block-meta { justify-content: center; }
}

/* ══════════════════════════════════════════════════════
   CTAs
   ══════════════════════════════════════════════════════ */
.rcad-cta-primary {
  background: linear-gradient(135deg, #e8f0fe 0%, #f0f4ff 100%);
  border: 2px solid #c5d9f0;
  border-left: 5px solid var(--rcad-primary);
  border-radius: var(--rcad-radius);
  padding: 1.4em 1.8em;
  margin: 1.8em 0;
  text-align: center;
}

.rcad-cta-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--rcad-primary);
  margin: 0 0 .8em;
}

.rcad-cta-sub {
  font-size: .82rem;
  color: var(--rcad-muted);
  margin: .6em 0 0;
}

.rcad-cta-secondary {
  background: #f8f9ff;
  border: 1px solid var(--rcad-border);
  border-radius: var(--rcad-radius);
  padding: 1em 1.4em;
  margin: 1em 0;
  font-size: .93rem;
}

/* ══════════════════════════════════════════════════════
   ARTÍCULOS RELACIONADOS
   ══════════════════════════════════════════════════════ */
.rcad-related-posts {
  background: var(--rcad-light-bg);
  border: 1px solid var(--rcad-border);
  border-radius: var(--rcad-radius);
  padding: 1.4em 1.8em;
  margin: 2em 0;
}

.entry-content .rcad-related-posts h3,
.rcad-related-posts h3 {
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: var(--rcad-primary) !important;
  margin: 0 0 .8em !important;
  padding-bottom: .6em !important;
  border-bottom: 2px solid var(--rcad-border) !important;
}

.rcad-related-posts ul {
  margin: 0 !important; padding: 0 !important; list-style: none !important;
}

.rcad-related-posts li {
  padding: .4em 0 !important;
  border-bottom: 1px solid var(--rcad-border) !important;
}

.rcad-related-posts li:last-child { border-bottom: none !important; }

.rcad-related-posts a {
  color: var(--rcad-accent) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}

.rcad-related-posts a:hover {
  text-decoration: underline !important;
  color: var(--rcad-primary) !important;
}

/* ══════════════════════════════════════════════════════
   PRERREQUISITOS Y DIAGNÓSTICO
   ══════════════════════════════════════════════════════ */
.rcad-requisitos {
  background: #fff8e1;
  border-left: 4px solid #f9a825;
  border-radius: 0 var(--rcad-radius) var(--rcad-radius) 0;
  padding: 1.2em 1.6em;
  margin: 1.5em 0;
}

.rcad-quick-fix {
  background: #e8f5e9;
  border-left: 4px solid var(--rcad-green);
  border-radius: 0 var(--rcad-radius) var(--rcad-radius) 0;
  padding: 1.2em 1.6em;
  margin: 1.5em 0;
}