/* ==========================================================================
   Noticias – Hoja optimizada (mobile-first)
   Iconos/Share: alineados 1:1 con critical-articulos.css
   ========================================================================== */

/* ===== Variables ===== */
:root{
  --azul-primario: #0A2F66;
  --azul-primario-hover: #0D3C85;
  --azul-brand: #172EEB;

  --texto-100: #111;
  --texto-300: #000;
  --texto-500: #6c757d;

  --gris-100: #f9f9f9;
  --gris-150: #f3f4f6;
  --gris-200: #e5e7eb;
  --gris-300: #e0e0e0;

  /* Social (misma paleta que Artículos) */
  --color-principal:#032A53; /* color base uniforme */
  --color-borde:#E8E8EA;

  /* Marcas por red */
  --fb: #1877F2;
  --tw: #111111; /* X */
  --ln: #0A66C2;
  --wa: #25D366;

  --shadow-xs:0 1px 2px rgba(16,24,40,.06);
  --shadow-sm:0 2px 5px rgba(16,24,40,.10);
}

/* ===== Base layout (mobile) ===== */
.post-layout{ display:block; }
.main-content{ width:100%; padding:15px; box-sizing:border-box; }
.post-category{ font-size:14px; color:#007bff; margin-bottom:10px; }

.post-title{
  font-size:24px; line-height:1.2; font-weight:800;
  color:var(--texto-100); margin:10px 0;
}
.post-excerpt{
  font-size:14px; line-height:1.4; color:var(--texto-500);
  margin-bottom:20px;
}

/* ===== Breadcrumbs ===== */
.custom-breadcrumbs{ padding-bottom:10px; }
.custom-breadcrumbs a{
  display:inline-flex; align-items:center; text-decoration:none;
  background:var(--gris-300); color:#555; font-weight:500; font-size:12px;
  border-radius:15px; padding:5px 10px; white-space:nowrap; text-transform:capitalize;
  transition:background-color .25s ease,color .25s ease;
}
.custom-breadcrumbs a:hover{ background:var(--azul-brand); color:#fff; }
.custom-breadcrumbs span{ color:#7D7F8A; }

.rank-math-breadcrumb .separator{
  display:inline-flex; align-items:center; transform:translateY(2px);
  margin:0 4px; font-size:16px; line-height:16px; color:#7D7F8A;
}

/* Home pill */
.custom-breadcrumbs a:first-of-type{
  text-indent:-9999px;
  background:url('https://cdn.inspenet.com/icon-home-breadcrumbs.webp') center/contain no-repeat;
  width:22px; height:26px; padding:0; border-radius:6px;
}

/* Último crumb activo */
.custom-breadcrumbs a:last-of-type{ background:var(--azul-brand); color:#fff; }

/* ===== Meta ===== */
.post-meta{
  display:flex; align-items:center; flex-wrap:wrap;
  gap:8px 14px; margin-bottom:10px; color:var(--texto-500);
  font-size:12px; line-height:1.3;
}
.post-meta span a{ font-weight:700; text-decoration:none; color:inherit; }
.post-meta span a:hover{ color:var(--azul-brand); }

/* ===== Share (idéntico a Artículos) ===== */
.post-share.social-row{
  display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top:4px;
}

/* Botón circular: soporta .btn-social y .share-btn */
.post-share .btn-social,
.post-share .share-btn{
  width:44px; height:44px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--color-principal); color:#fff; text-decoration:none; outline:none;
  box-shadow:0 1px 2px rgba(16,24,40,.12), inset 0 1px 0 rgba(255,255,255,.15);
  transition:transform .08s ease, filter .2s ease, background-color .2s ease;
  line-height:1;
}
.post-share .btn-social:hover,
.post-share .share-btn:hover{ filter:brightness(1.05); transform:translateY(-1px); }
.post-share .btn-social:focus-visible,
.post-share .share-btn:focus-visible{
  box-shadow:0 0 0 3px rgba(22,119,255,.25), 0 1px 2px rgba(16,24,40,.12);
}

/* SVG blanco, tamaño fijo, hereda color */
.post-share .btn-social svg,
.post-share .share-btn svg{
  display:block; width:20px; height:20px; fill:currentColor; color:#fff;
}

/* Colores por red (opcionales, igual que en Artículos) */
.post-share .share-facebook{ background:var(--fb); }
.post-share .share-facebook:hover{ background:#1C82FF; }
.post-share .share-twitter{  background:var(--tw); }
.post-share .share-twitter:hover{ background:#222; }
.post-share .share-linkedin{ background:var(--ln); }
.post-share .share-linkedin:hover{ background:#0D74DE; }
.post-share .share-whatsapp{ background:var(--wa); }
.post-share .share-whatsapp:hover{ background:#2FE07A; }

/* Neutraliza icon-fonts globales */
.post-share a i{ display:none !important; }

/* ===== Media ===== */
.post-thumbnail img{ width:100%; height:auto; display:block; margin-bottom:20px; }

/* ===== Contenido ===== */
.post-content{ font-size:16px; line-height:1.7; color:var(--texto-300); overflow-wrap:anywhere; }
.post-content figure{ margin:0 0 1rem; }

/* ===== Mobile hardening ===== */
@media (max-width:1023.98px){
  .insp-container, .post-layout, .main-content, .post-content { max-width:100%; overflow-x:hidden; }

  .post-content img,
  .post-content figure,
  .post-content .wp-block-image img,
  .post-content .wp-block-embed,
  .post-content .wp-block-video video,
  .post-content iframe,
  .post-content video{
    max-width:100% !important; height:auto !important;
  }

  .post-content .alignwide,
  .post-content .alignfull,
  .post-content figure.alignwide,
  .post-content figure.alignfull{
    width:100% !important; margin-left:auto !important; margin-right:auto !important;
  }

  .post-content table{
    display:block; width:100% !important; max-width:100% !important;
    overflow-x:auto; -webkit-overflow-scrolling:touch; border-collapse:collapse;
  }

  .post-content pre, .post-content code{ white-space:pre-wrap; word-break:break-word; }

  .custom-breadcrumbs a{ white-space:normal; }
  .rank-math-breadcrumb .separator{ flex:0 0 auto; }

  .post-meta{ justify-content:flex-start; gap:8px 10px; }

  /* Share compacto en móvil */
  .post-share .btn-social,
  .post-share .share-btn{ width:40px; height:40px; }
  .post-share .btn-social svg,
  .post-share .share-btn svg{ width:18px; height:18px; }
}

/* ===== Desktop layout (2 columnas) ===== */
@media (min-width:1024px){
  .post-layout{
    display:grid; grid-template-columns: minmax(0,1fr) 360px; gap:24px; align-items:start;
  }
  .main-content{ padding-right:20px; box-sizing:border-box; min-width:0; }
  .sidebar{ padding-left:20px; box-sizing:border-box; position:relative; z-index:1; }

  .post-title{ font-size:32px; }
  .post-meta{ font-size:14px; }
}

/* ===== Detalles estéticos ===== */
.single-articulo .aside-card{
  border:1px solid var(--color-borde);
  background:#fff; border-radius:14px; box-shadow:var(--shadow-xs);
}

/* Respeto reduce motion */
@media (prefers-reduced-motion:reduce){
  .post-share .btn-social,
  .post-share .share-btn{ transition:none; }
}

/* Utilidad */
html{ scroll-behavior:smooth; }

/* ==== Unificar Social Buttons con Artículos (override) ==== */

/* Fila y botón (mismos estilos que Artículos) */
.post-share.social-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:4px;
}

/* Azul único + icono blanco */
.post-share .btn-social{
  width:44px; height:44px;
  border-radius:50%;
  display:inline-flex;
  align-items:center; justify-content:center;
  background:var(--color-principal) !important; /* fuerza el azul único */
  color:#fff; text-decoration:none;
  box-shadow:0 1px 2px rgba(16,24,40,.12), inset 0 1px 0 rgba(255,255,255,.15);
  transition:transform .08s ease, filter .2s ease;
  outline:none; line-height:1;
}
.post-share .btn-social:hover{ filter:brightness(1.05); transform:translateY(-1px); }
.post-share .btn-social:focus-visible{
  box-shadow:0 0 0 3px rgba(22,119,255,.25), 0 1px 2px rgba(16,24,40,.12);
}

/* Íconos en blanco, tamaño fijo */
.post-share .btn-social svg{
  width:20px; height:20px; display:block;
  fill:currentColor; color:#fff;
}

/* Neutralizar icon-fonts del tema si existieran */
.post-share a i{ display:none !important; }

/* Anular colores por red (si quedaron reglas previas) */
.post-share .share-facebook,
.post-share .share-twitter,
.post-share .share-linkedin,
.post-share .share-whatsapp{
  background:var(--color-principal) !important;
}

/* Alineación a la derecha dentro de .post-meta (también cuando hace wrap) */
.post-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; }
.post-meta .post-share.social-row{ margin-left:auto; }

/* En desktop, mismo layout que Artículos */
@media (min-width:1024px){
  .post-meta{ justify-content:space-between; }
  .post-meta > span{ margin-right:auto; } /* autor/fecha a la izq, botones a la der */
}

/* Tamaño compacto en móviles (igual que Artículos) */
@media (max-width:1023.98px){
  .post-share .btn-social{ width:40px; height:40px; }
  .post-share .btn-social svg{ width:18px; height:18px; }
}
