/**
 * Estilos compartidos para single-post, single-caso-de-exito y single-prensa
 */

 .prensa-category {
  color: #008b05;
}

.single .breadcrumb {
 margin-bottom: 2rem;
 font-size: 14px;
 font-weight: 500;
 color: #000;
 transition: color 0.3s ease;
}

.single .breadcrumb a {
 color: #008b05;
 text-decoration: none;
 transition: color 0.3s ease;
}

.single .breadcrumb a:hover {
 color: #008b05;
 text-decoration: underline;
}

.single .breadcrumb span {
 color: #000;
 font-weight: 500;
}

.single .prensa-single {
 font-family: 'Montserrat', sans-serif;
 max-width: 1200px;
 margin: 0 auto;
}

.single .prensa-content a {
 color: var(--e-global-color-primary);
 text-decoration: underline;
 transition: color 0.3s ease;
 font-weight: 500;
}

.single .prensa-content a:hover {
 color: var(--e-global-color-primary-hover);
}

.prensa-content-wrapper {
 background: #fff;
}

.prensa-header {
 margin-bottom: 2rem;
 padding-bottom: 1rem;
}

.prensa-utils {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
 padding: 10px 0;
}

.prensa-meta {
 color: #666;
 font-size: 0.9rem;
}

.prensa-meta .reading-time {
 white-space: nowrap;
}

/* Barra de progreso de lectura (debajo del sticky header) */
.reading-progress-bar {
 position: fixed;
 top: 76px;
 left: 0;
 right: 0;
 height: 6.5px;
 background: #e0e0e0;
 z-index: 9;
 overflow: hidden;
}

.reading-progress-fill {
 display: block;
 height: 100%;
 width: 0%;
 background: var(--e-global-color-primary, #333);
 transition: width 0.1s ease-out;
}

.prensa-content {
 margin-bottom: 3rem;
 line-height: 1.8;
 color: #000;
}

.prensa-content p {
 margin-bottom: 1.5rem;
}

.prensa-share h3 {
 margin-bottom: 1.5rem;
 font-size: 1.5rem;
}

.share-buttons {
 display: flex;
 align-items: center;
 flex-wrap: wrap;
 gap: 12px;
}

.share-button {
 width: 36px;
 height: 36px;
 display: flex;
 align-items: center;
 justify-content: center;
 border: 2px solid;
 border-radius: 100%;
 text-decoration: none;
 transition: all 0.3s ease;
 cursor: pointer;
 font-size: 0.9rem;
 padding: 0 !important;
}

.share-button svg {
 width: 20px;
 height: 20px;
}

.share-button:hover {
 transform: translateY(-2px);
}

.share-facebook {
 background: #4267B2;
 border-color: #4267B2;
}

.share-facebook svg path {
 fill: #fff;
 transition: fill 0.3s ease;
}

.share-facebook:hover svg path {
 fill: #4267B2;
}

.share-facebook:hover {
 background: #fff;
 border-color: #4267B2;
}

.share-twitter {
 background: #000;
 border-color: #000;
}

.share-twitter svg path {
 fill: #fff;
 transition: fill 0.3s ease;
}

.share-twitter:hover svg path {
 fill: #000;
}

.share-twitter:hover {
 background: #fff;
 border-color: #000;
}

.share-linkedin svg path {
 fill: #fff !important;
 transition: fill 0.3s ease;
}

.share-linkedin:hover svg path {
 fill: #0077b5 !important;
}

.share-linkedin {
 background: #0077b5;
 border-color: #0077b5;
}

.share-linkedin:hover {
 background: #fff;
 border-color: #0077b5;
}

.share-whatsapp {
 background: #25d366;
 border-color: #25d366;
}

.share-whatsapp svg path {
 fill: #fff !important;
 transition: fill 0.3s ease;
}

.share-whatsapp:hover svg path {
 fill: #25d366 !important;
}

.share-whatsapp:hover {
 background: #fff;
 border-color: #25d366;
}

.share-copy {
 background: var(--e-global-color-primary);
 border-color: var(--e-global-color-primary);
}

.share-copy svg {
 width: 17px;
 height: 17px;
}

.share-copy svg path {
 fill: #000 !important;
 transition: fill 0.3s ease;
}

.share-copy:hover svg path {
 fill: #fff !important;
}

.share-copy:hover {
 background: #000;
 border-color: #000;
}

.prensa-comments {
 margin: 3rem 0;
}

.prensa-related {
 margin: 3rem 0;
 padding-top: 2rem;
 border-top: 2px solid #e0e0e0;
}

.prensa-related h3 {
 margin-bottom: 2rem;
 font-size: 1.8rem;
}

.related-posts-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
 gap: 20px;
}

.related-post-item {
 background: #f1f1f1;
 border-radius: 26px;
 transition: transform 0.3s ease;
}

.related-post-item:hover {
 transform: translateY(-5px);
 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.related-post-title {
 margin-bottom: 1rem;
}

.related-post-title a {
 text-decoration: none;
 color: #000;
 font-size: 1.2rem;
}

.related-post-title a:hover {
 color: var(--e-global-color-primary);
}

.related-post-excerpt {
 margin-bottom: 1rem;
 color: #000;
 line-height: 1.6;
}

.related-post-link {
 display: inline-block;
 color: #000 !important;
 text-decoration: none;
 font-weight: 600;
}

.related-post-link:hover {
 text-decoration: underline;
 color: var(--e-global-color-primary) !important;
}

/* Estilos para toasts */
#toast-container {
 position: fixed;
 bottom: 20px;
 left: 50%;
 transform: translateX(-50%);
 z-index: 10000;
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 10px;
 pointer-events: none;
}

.toast {
 background-color: #333;
 color: #fff;
 padding: 12px 24px;
 border-radius: 8px;
 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
 font-size: 14px;
 font-family: 'Montserrat', sans-serif;
 white-space: nowrap;
 opacity: 0;
 transform: translateY(20px);
 transition: opacity 0.3s ease, transform 0.3s ease;
 pointer-events: auto;
 max-width: 90vw;
 text-align: center;
}

.toast-enter {
 opacity: 0;
 transform: translateY(20px);
}

.toast-visible {
 opacity: 1;
 transform: translateY(0);
}

.toast-exit {
 opacity: 0;
 transform: translateY(-20px);
}

/* Media queries compartidos */
@media (max-width: 768px) {
 .single .prensa-title {
   font-size: 2rem !important;
 }

 .single .share-buttons {
   flex-direction: row;
 }

 .single .share-button {
   text-align: center;
 }

 .single .related-posts-grid {
   grid-template-columns: 1fr;
 }

 .single .prensa-utils {
   flex-direction: column;
   align-items: flex-start;
   gap: 10px;
 }
}

@media (max-width: 576px) {
 .single .prensa-title {
   font-size: 1.75rem !important;
 }
}