/**
 * Theme Name: chocamocha
 * Author: Nora Ferreirós
 * Author URI: http://noraferreiros.com/
 * Description: A child theme created by a designer who loves chocamocha flowers.
 * Template:   twentytwentyfive
 */

html {
    scroll-behavior: smooth;
}

label{
    text-transform:uppercase;
}

.below-group{
    z-index: -1;
}

/*-- BUTTONS --*/
.wp-block-button.is-style-outline--2 .wp-block-button__link, .wp-block-button.is-style-outline--3 .wp-block-button__link{
    font-size: 2rem;
}

/*-- MAIN NAVIGATION --*/

.main-navigation a.wp-block-navigation-item__content{
    font-family: var(--wp--preset--font-family--sofia);
    text-decoration: none;
    color: var(--wp--preset--color--milkshake-pink);
    text-transform: uppercase;
}

.main-navigation a.wp-block-navigation-item__content:hover{
    background-color: var(--wp--preset--color--blog-foreground);
    
}

.main-navigation a.wp-block-navigation-item__content, .main-navigation a.wp-block-navigation-item__content:hover{
    text-decoration: none;
    padding: 2px 8px;
}

.wp-block-navigation:not(.has-text-color) .wp-block-navigation__responsive-container.is-menu-open a{
    color: var(--wp--preset--color--milkshake-pink);
    text-align: center;
    font-size: var(--wp--preset--font-size--large);
    margin-bottom: var(--wp--preset--spacing--medium);
}
.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{
    background-color: var(--wp--preset--color--chocamocha);
}
.wp-block-navigation__responsive-container-close{
    margin: 2rem auto;
    position: relative;
}
.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close.wp-block-navigation__responsive-container-close{
    color: var(--wp--preset--color--electric-yellow);
    width: 100%;
}
nav.is-responsive.wp-block-navigation {
    text-transform: uppercase;
    font-size: var(--wp--preset--font-size--large);
    padding: 0 .5rem;
}

:where(.wp-site-blocks *:focus) {
	outline-width: 0 !important;
	outline-style: none !important;
}

/*-- HOME --*/

.home-hero{
    padding-top: clamp(1rem, 4vw, 12rem);
    background-image: url('../../uploads/2025/05/touchsketch.webp');
    background-position: 50% 15%;
    background-repeat: no-repeat;
    background-size: 130%;
}
@media (min-width:769px){
    .home-hero{
        background-position: 50% 23%;
        background-size: 110%;
    }
}
@media (min-width:1025px){
   .home-hero{
        background-position: 50% 7%;
        background-size: contain;
    } 
}
.introduction{
    font-size: 1.75rem;
}
.mision{
    font-size: clamp(1.4rem, 12vw, 1.6rem);
}

.practice-card{
    background-size: 226px 254px !important;
    aspect-ratio: 1 / 1;
}

/*-- HOME ARROW BG --*/
@media (min-width:769px){
.home-how{
    padding-right: var(--wp--preset--spacing--60) !important;
        padding-left: var(--wp--preset--spacing--60) !important;
}
}
.looklike::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url('../../uploads/2025/01/arrow.svg');
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;    
    transform: scaleX(-1); /* Inversión horizontal */
    z-index: -1;
}
@media (min-width:769px){
    .looklike::before {
    background-position: 70% 50%;
    background-size: 30vw;    
    }
}
@media (min-width:1025px){
    .looklike::before {
    background-position: 60% 50%;
    background-size: 12vw;    
    }
}


/*-- Imagen de fondo de listado de posts de la Home --*/
.thoughts{
    background-image: url('../../uploads/2025/05/thoughts.webp');
    background-position: 50% 0%;
    background-repeat: no-repeat;
    background-size: 80%;
}

@media (min-width:769px){
.thoughts{
    background-position: 24% 0%;
    background-size: 36vw;
}
}
@media (min-width:1025px){
.thoughts{
    background-size: 16vw;
}
}


/*-- HOME POST LIST (KADENCE) --*/

.home-posts.wp-block-kadence-posts .loop-entry .entry-header .entry-meta {
    margin: 0;
}
.home-posts.wp-block-kadence-posts .loop-entry.type-post .entry-taxonomies .category-style-pill a{
     color: var(--wp--preset--color--electric-yellow);
}
.home-posts.wp-block-kadence-posts .loop-entry.type-post .entry-taxonomies .category-style-pill a:hover{
     color: var(--wp--preset--color--chocamocha);
    text-decoration: underline;
}
.home-posts.wp-block-kadence-posts .entry-taxonomies .category-style-pill a{
    background: var(--wp--preset--color--chocamocha);
    border-radius: 0;
    padding: .4rem .75rem .3rem;
    font-family: var(--wp--preset--font-family--sofia);
    font-size: var(--wp--preset--font-size--medium);
    margin-bottom: .75rem;
}
.home-posts.wp-block-kadence-posts .entry-taxonomies .category-style-pill a:hover{
     background: var(--wp--preset--color--electric-yellow);
}
.home-posts.wp-block-kadence-posts .loop-entry .entry-header .entry-title{
    font-size: var(--wp--preset--font-size--x-large);
    line-height: 2.5rem;
}
.home-posts .entry.loop-entry .entry-header .entry-title a {
    text-decoration: none;
}
.home-posts .entry.loop-entry .entry-header .entry-title a:hover {
    text-decoration: underline;
    color: var(--wp--preset--color--milkshake-pink);
}
.home-posts.wp-block-kadence-posts .loop-entry .entry-summary p{
    margin: .75rem 0 .5rem;
}
.home-posts.wp-block-kadence-posts a.post-more-link{
    text-transform: none;
    text-decoration: underline;
    font-weight: normal;
    font-size: 1rem;
    color: var(--wp--preset--color--electric-yellow);
}
.home-posts.wp-block-kadence-posts a.post-more-link:hover{
    text-decoration: none;
}
.home-posts footer{
    margin-top:0;
}


/*-- FOOTER NAVIGATION --*/

footer{
    background-position: center bottom;
}


/*-- POST TERMS STYLES --*/

.wp-block-post-terms{
    width: fit-content;
}


/*-- SINGLE POST TEMPLATE --*/
.upsidedown{
  transform: rotate(180deg) scaleX(-1);
}

.blog-blocks-spaces{
    margin-block-start: 0
}

.main-post-content figure.wp-block-image{
    margin: 1.4em 0;
    max-width: 680px;
}
.main-post-content h2{
  font-size: clamp(3.75rem, 3.75rem + ((1vw - 0.2rem) * 1.786), 4rem);  
  margin-top: 1em;
}
.main-post-content h2, .main-post-content h3, .main-post-content h4, .main-post-content h5{
  color: var(--wp--preset--color--burgundy);
}
h3#reply-title {
    margin-top: 0;
}
h2#comments {
    margin: 3rem 0 1.5rem;
}
p.logged-in-as {
    font-size: 1.1rem;
    margin-top: 0;
}
p.comment-form-comment {
    margin-top: 0;
}

.wp-block-post-comments-form :where(input[type=submit]){
    background: transparent none;
    border-radius: 0px;
    border-color: var(--wp--preset--color--chocamocha);
    border-width: 2px;
    border-style: solid;
    color: var(--wp--preset--color--chocamocha);
    font-size: clamp(1.25rem, 1.25rem +((1vw - 0.2rem)* 1.071), 2rem);
    padding-top: calc(.65rem - 1px);
    padding-right: calc(1.5rem - 1px);
    padding-bottom: calc(.5rem - 1px);
    padding-left: calc(1.5rem - 1px);
}

.wp-block-post-comments-form .wp-block-button__link:hover{
    background-color: var(--wp--preset--color--chocamocha);
    color: var(--wp--preset--color--blog-background);
}

.blog-additional-content{
    background-size: 300px !important;
}

/*-- EASY TABLE OF CONTENTS --*/
#ez-toc-container{
    padding: 16px 20px 20px 24px;
    border-radius: 0;
    max-width: 656px;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 32px auto;
}

#ez-toc-container .ez-toc-js-icon-con, #ez-toc-container .ez-toc-toggle label, .ez-toc-cssicon{
    border: none;
    border-radius: 0;
    left: 8px;
    width: 35px;
}

#ez-toc-container label{
    font-family: var(--wp--preset--font-family--sofia);
    font-weight: 800;
}

#ez-toc-container nav{
    margin-top: 8px;
}
#ez-toc-container li, #ez-toc-container ul {
    padding: 2px !important;
}

#ez-toc-container a{
    text-decoration: underline !important;
}

#ez-toc-container a:hover{
    text-decoration: none !important;
}

/*-- ABOUT PAGE --*/

.about-attribution{
    width:90%;
}
.about-img-mobile{
    z-index:-1;
}

.fliparrow{
    transform: rotate(180deg);
}