/*!
Theme Name: Brand Insurance Theme
Theme URI: https://themes.leotryskel.com/brand-insurance
Author: @shotokanleo
Author URI: https://themes.leotryskel.com
Description: Es un tema para trabajar blogs de seguros de autos para diferentes aseguradoras de México.
Version: 3.7.0
Requires at least: 5.0
Tested up to: 6.8
Requires PHP: 7.2
License: GPL version 2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0
Tags: custom-background, custom-colors, featured-images, flexible-header, microformats, post-formats, rtl-language-support, theme-options, translation-ready, accessibility-ready
Text Domain: brand-insurance
*/

/*--------------------------------------------------------------
# Variables de Colores y Estilos
--------------------------------------------------------------*/
:root {
    --brand-insurance-gradient-primary-color: linear-gradient(90deg, #aa0383 0%, #aa0383 100%);
    --brand-insurance-primary-color: #aa0383;
    --brand-insurance-primary-color-hover: #830365;
    --brand-insurance-secondary-color: #049383;
    --brand-insurance-secondary-color-hover: #02776a;
    --brand-insurance-accent-color: #aedf1c;
    --brand-insurance-dark-color: #333;
    --brand-insurance-body-color: #5c6166;
    --brand-insurance-light-gray: #F8F9FA;
    --brand-insurance-border-color:var(--brand-insurance-primary-color);
    --brand-insurance-white-color: #FFFFFF;
    
    --bs-primary: var(--brand-insurance-primary-color);
    --bs-secondary: var(--brand-insurance-secondary-color);
    --bs-success: var(--brand-insurance-accent-color);
    --bs-dark: var(--brand-insurance-dark-color);
    --bs-light: var(--brand-insurance-light-gray);
    --bs-body-color: var(--brand-insurance-body-color);
    --bs-border-color: var(--brand-insurance-border-color);
    --bs-body-bg: var(--brand-insurance-white-color);

    --bs-info-text-emphasis:var(--brand-insurance-white-color);
    --bs-info-bg-subtle:var(--brand-insurance-primary-color);
    --bs-info-border-subtle:var(--brand-insurance-primary-color);
}
.alert-info {
    --bs-alert-color: var(--bs-info-text-emphasis);
    --bs-alert-bg: var(--bs-info-bg-subtle);
    --bs-alert-border-color: var(--bs-info-border-subtle);
    --bs-alert-link-color: var(--bs-info-text-emphasis);
}
/*--------------------------------------------------------------
# Estilos Base y Tipografía
--------------------------------------------------------------*/
body {
    color: var(--brand-insurance-body-color);
}

a,.sidebar-nav a  {
    color: var(--brand-insurance-primary-color);
    text-decoration: none;
}
a:hover {
    color: var(--brand-insurance-primary-color-hover);
    text-decoration: underline;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .entry-title a {
    color: var(--brand-insurance-dark-color) !important;
    font-weight: 700;
}
.entry-title a:hover {
    color: var(--brand-insurance-primary-color) !important;
}
/* botones */
.btn-primary,.wp-block-button .wp-block-button__link {
    --bs-btn-color: var(--brand-insurance-white-color);
    --bs-btn-bg:var(--brand-insurance-primary-color);
    --bs-btn-border-color:var(--brand-insurance-primary-color);
    --bs-btn-hover-color: var(--brand-insurance-white-color);
    --bs-btn-hover-bg:var(--brand-insurance-primary-color-hover);
    --bs-btn-hover-border-color:var(--brand-insurance-primary-color-hover);
    --bs-btn-focus-shadow-rgb: 49,132,253;
    --bs-btn-active-color: var(--brand-insurance-white-color);
    --bs-btn-active-bg:var(--brand-insurance-primary-color-hover);
    --bs-btn-active-border-color:var(--brand-insurance-primary-color-hover);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    --bs-btn-disabled-color: var(--brand-insurance-white-color);
    --bs-btn-disabled-bg:var(--brand-insurance-primary-color);
    --bs-btn-disabled-border-color:var(--brand-insurance-primary-color);
}
.btn-secondary {
    --bs-btn-color: var(--brand-insurance-white-color)!important;
    --bs-btn-bg: var(--brand-insurance-secondary-color)!important;
    --bs-btn-border-color: var(--brand-insurance-secondary-color)!important;
    --bs-btn-hover-color: var(--brand-insurance-white-color)!important;
    --bs-btn-hover-bg:var(--brand-insurance-secondary-color-hover)!important;
    --bs-btn-hover-border-color: var(--brand-insurance-secondary-color-hover)!important;
    --bs-btn-focus-shadow-rgb: 130,138,145;
    --bs-btn-active-color: var(--brand-insurance-white-color-hover)!important;
    --bs-btn-active-bg: var(--brand-insurance-secondary-color-hover)!important;
    --bs-btn-active-border-color: var(--brand-insurance-secondary-color-hover)!important;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0,0,0,.125);
    --bs-btn-disabled-color: var(--brand-insurance-white-color)!important;
    --bs-btn-disabled-bg: var(--brand-insurance-secondary-color)!important;
    --bs-btn-disabled-border-color: var(--brand-insurance-secondary-color)!important;
}
.btn-secondary:hover {
    --bs-btn-color: var(--brand-insurance-white-color)!important;
}
/*--------------------------------------------------------------
# Alineación y Clases de WordPress
--------------------------------------------------------------*/
.alignnone { margin: 5px 20px 20px 0; }
.aligncenter, div.aligncenter { display: block; margin: 5px auto; }
.alignright { float: right; margin: 5px 0 20px 20px; }
.alignleft { float: left; margin: 5px 20px 20px 0; }
a img.alignright { float: right; margin: 5px 0 20px 20px; }
a img.alignnone { margin: 5px 20px 20px 0; }
a img.alignleft { float: left; margin: 5px 20px 20px 0; }
a img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 96%; padding: 5px 3px 10px; text-align: center; }
.wp-caption.alignnone { margin: 5px 20px 20px 0; }
.wp-caption.alignleft { margin: 5px 20px 20px 0; }
.wp-caption.alignright { margin: 5px 0 20px 20px; }
.wp-caption img { border: 0 none; height: auto; margin: 0; max-width: 98.5%; padding: 0; width: auto; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; }
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; }

.small{font-size:0.5em!important;}
/*--------------------------------------------------------------
# Layout y Componentes del Tema
--------------------------------------------------------------*/

/* Hero del Blog */
.blog-hero-section {
    background: var(--brand-insurance-primary-color);
    color: var(--brand-insurance-white-color);
}
.blog-hero-section .search-form .search-field {
    border-radius: 50rem;
    border: 1px solid transparent;
    padding: 0.75rem 1.5rem;
    padding-right: 4rem;
}
.blog-hero-section .search-form .search-submit {
    position: absolute;
    top: 5px; right: 6px; bottom: 5px;
    border: none;
    background-color: var(--brand-insurance-secondary-color);
    color: var(--brand-insurance-white-color);
    border-radius: 50rem;
    padding: 0 1.5rem;
    font-weight: 500;
}
.blog-hero-section .search-form .search-submit:hover {
    background-color: var(--brand-insurance-secondary-color-hover);
}

/* Tarjeta de Extracto de Post */
.post-excerpt-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.post-excerpt-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}
.post-excerpt-card .post-thumbnail-link img {
    transition: transform 0.4s ease;
}
.post-excerpt-card:hover .post-thumbnail-link img {
    transform: scale(1.05);
}
.post-excerpt-card .entry-summary a {
    font-weight: 500;
    text-decoration: underline;
    color: var(--brand-insurance-primary-color);
}
.post-excerpt-card .entry-summary a:hover {
    text-decoration: none;
}
.entry-summary > p{
    font-size: 1.25rem;
    font-weight: 300;
}
/* Sidebar Widgets */
.widget-area .widget {
    background-color: var(--brand-insurance-white-color);
    border: 1px solid var(--brand-insurance-border-color);
    padding: 1.5rem;
    margin-bottom: 2rem;
    border-radius: .5rem;
}
.widget-area .widget-title {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--brand-insurance-primary-color);
    display: inline-block;
}
.widget-area .widget ul{
    padding-left: 0;
    list-style: none;
    margin-bottom: 0;
}
/* Categorias */
.widget-area ul li{list-style: none;}

.widget-area .widget ul li {
    padding: 0.5rem 0;
    border-bottom: 1px solid #f0f0f0;
}
.widget-area .widget ul li:last-child {
    border-bottom: none;
}
.widget-area .widget ul li a {
    text-decoration: none;
    font-weight: 500;
}
.widget_categories ul li {
    display: flex;
    justify-content: space-between;
}
#sidebar .widget-area nav ul li{list-style: none;}

/* Contenido de Entrada Individual y Página */
.single-post-content, .page-content {
    background-color: #fff;
    padding: 2rem;
    border-radius: .5rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, .075);
}

@media (min-width: 992px) {
    .single-post-content, .page-content {
        padding: 3rem;
    }
}
.single-post-content .entry-title, .page-content .entry-title {
    font-size: 2.5rem;
    color: var(--brand-insurance-primary-color);
    line-height: 1.2;
}
.single-post-article .entry-meta {
    font-size: 0.9rem;
}
.single-post-content .entry-meta {
    font-size: 0.9rem;
    color: var(--brand-insurance-accent-color);
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--brand-insurance-border-color);
}
.single-post-content .entry-meta a {
    /* color: var(--bs-gray); */
    text-decoration: none;
}
.single-post-content .entry-meta a:hover {
    color: var(--brand-insurance-primary-color);
}

/* .single-post-article .entry-meta a {
    text-decoration: none;
}
.single-post-article .entry-meta a:hover {
    color: var(--brand-insurance-primary-color);
} */
.single-post-content .post-thumbnail {
    margin-bottom: 2rem;
}
.single-post-content .post-thumbnail img {
    border-radius: .5rem;
}
h1 > a,h2 > a,h3 > a,h4 > a,h5 > a,.entry-title a,article header h1{color: var(--brand-insurance-primary-color)!important;}
.entry-content h2,.entry-content h3,.entry-content h4 {
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    color: var(--brand-insurance-primary-color);
}
/* Tipografía del Contenido */
.entry-content {
    font-size: 1.1rem;
    line-height: 1.8;
}
.entry-content p {
    margin-bottom: 1.5rem;
    line-height: 1.8;
    font-size:1.25rem;
    font-weight:300;
    padding:0 1rem;
}
.entry-content h2, 
.entry-content h3, 
.entry-content h4 {
    font-weight: 700;
    margin-top: 2.5rem;
    margin-bottom: 1.25rem;
    color: var(--brand-insurance-primary-color);
    padding:0 1rem;
}
.entry-content h2 {
    font-size: 1.8rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid var(--brand-insurance-primary-color);
}
.entry-content h3 {
    font-size: 1.5rem;
}
.entry-content a {
    font-weight: 600;
    color: var(--brand-insurance-primary-color);
    text-decoration: none;
    border-bottom: 2px solid rgba(170, 3, 131, 0.2);
    transition: border-color 0.3s ease;
}
.entry-content a:hover {
    border-bottom-color: var(--brand-insurance-primary-color);
}
.entry-content ul, .entry-content ol {
    padding-left: 1.5rem;
    margin-bottom: 1.5rem;
}
.entry-content ul li {
    padding-left: 0.5rem;
}
.entry-content ul li::marker {
    color: var(--brand-insurance-primary-color);
    font-weight: bold;
}
.entry-content blockquote {
    border-left: 4px solid var(--brand-insurance-primary-color);
    padding: 1rem 1.5rem;
    margin: 2rem 0;
    background-color: var(--brand-insurance-light-gray);
    font-style: italic;
    font-size: 1.2rem;
}
.entry-content blockquote p {
    margin-bottom: 0;
}
.attachment-large{
    border-radius:0.8rem;
    margin-bottom:2rem;
}
article a > img{width:100%;height:auto;}