:root {
    --bg-color: #575757e8;
    --bg-color-1: #cccccc;
    --bg-color-2: #747474;
    --bg-color-3: #a1a1a1;
    --bg-color-4: #b3b3b3;

    --bg-post: white;
    --bg-search: rgb(157, 234, 248);
    --bg-search-2: rgb(245, 254, 255);

    --btn-home: rgb(226, 228, 119);
    --btn-search: rgb(38, 192, 219);

    --btn-p-navbar: rgb(160, 231, 94) ;
    --btn-s-navbar: rgb(247, 117, 66) ;

    --btn-p: rgb(191, 243, 142) ;
    --btn-s: rgb(248, 71, 48) ;

    --btn-X-notification: rgb(255, 255, 255);
    --font-X-notification: rgb(255, 0, 0);

    --font-btn-p: rgb(0, 0, 0);
    --font-btn-s: rgb(0, 0, 0);

    font-family: Arial, sans-serif;
    font-size: clamp(2px, 5vw, 16px);
}

body {
    background-color: var(--bg-color-2);
}

main {
    max-width: 1440px;

    margin-top: 0;
    margin-bottom: 0;

    margin-left: auto;
    margin-right: auto;

    padding: 1rem;
    padding-top: 0;


    background-color: var(--bg-color-4);

}

/* video,
iframe {
    max-width: 100%;
} */

a {
    text-decoration: none;
}

* {
    box-sizing: border-box;
}

h1{
    padding-top: 1rem;
    background-color: var(--bg-color-1);
}

h1,
h2,
h3,
h4 {
    padding-bottom: 1rem;
}

h1,
h2,
h3,
h4,
p {
    margin: 0;
    text-align: left;
}

input,
textarea,
label,
p,
textarea,
select {
    padding: 7px;
    border-radius: 6px;
    border: none;
}

.radio-button{
    display: flex;
    flex-direction: row;        /* formato horizontal */
    align-items: center;        /* centra verticalmente el contenido */
    justify-content: start;    /* opcional: centra horizontalmente */
    gap: 1rem; 
}

.radio-button label{
    display: flex;
    align-items: center;  
}

.radio-button label input{
    margin: 0;
}



/* p {
    white-space: pre-line;
} */