/*
 Theme Name: ama-a11y-theme child
 Template: www-a11y-theme
 Description: AMA A11Y Theme for WordPress.
 Author: Ricardo Pauleta
 Version: 1.0.203
*/
@import "./css/forms.css";

:root {
    --ama-blue-0: #F0F0FA;
    --ama-gray-700: #515151;
    --ama-blue-50: #D2D1EF;
}

ul.ama-list > li {
    margin-left: 0;
    padding-left: 27px;
    background-image: url("./img/AMA-arrow-primary.svg");
    list-style: none;
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: 0 4px;
}

.dark-theme ul.ama-list > li {
    background-image: url("./img/AMA-arrow-quinary.svg");
}

#infos_right .access_monitor {
    background-color: var(--secondary);
    padding: 2rem;
}

.dark-theme #infos_right .access_monitor {
    background-color: var(--secondary-dark);
}


.img-avatar {
    border: 20px solid white;
    border-radius: 50%;
    aspect-ratio: 1;
    object-fit: cover;
    object-position: center;
}

#access {
    background-color: var(--secondary);
    /* padding: 3.5rem 0; */
}

.dark-theme #access {
    background-color: var(--secondary-dark);
}

#access .icon-check-monitor.icon {
    color: var(--primary);
}

.dark-theme #access .icon-check-monitor.icon {
    color: var(--quinary);
}

#access .version {
    color: white !important;
    font-size: 16px;
    line-height: 18px !important;
    background-color: #333399;
    padding: 3px 8px;
    max-height: 26px !important;
    margin-left: 10px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-decoration: none !important;
    font-weight: bold;
}

.dark-theme #access .version {
    color: var(--body-dark)!important;
    background-color:var(--quinary);
}

.img-avatar {
    border: 20px solid white;
    border-radius: 50%;
    aspect-ratio: 1;
    object-fit: cover;
    object-position: center;
}

.border-black.border {
    border-color: #000 !important;
}

.gap-1 {
    gap: 1rem;
}

.gap-1-5 {
    gap: 1.5rem;
}

.gap-2 {
    gap: 2rem;
}

.gap-2-5 {
    gap: 2.5rem;
}

.gap-3 {
    gap: 3rem;
}

.gap-4 {
    gap: 4rem;
}

/**
===========================================================
|| Grid templates
===========================================================
 */

/* Base grid styles */
.grid {
    display: grid;
    gap: 20px; /* Default gap */
    padding: 0;
}

/* One column grid */
.grid-1 {
    grid-template-columns: repeat(1, 1fr);
}

/* Two columns grid */
.grid-2 {
    grid-template-columns: repeat(2, 1fr);
}

/* Three columns grid */
.grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

/* Four columns grid */
.grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* Five columns grid */
.grid-5 {
    grid-template-columns: repeat(5, 1fr);
}

/* Six columns grid */
.grid-6 {
    grid-template-columns: repeat(6, 1fr);
}

/* Breakpoints */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .grid-sm-1 { grid-template-columns: repeat(1, 1fr); }
    .grid-sm-2 { grid-template-columns: repeat(2, 1fr); }
    .grid-sm-3 { grid-template-columns: repeat(3, 1fr); }
    .grid-sm-4 { grid-template-columns: repeat(4, 1fr); }
    .grid-sm-5 { grid-template-columns: repeat(5, 1fr); }
    .grid-sm-6 { grid-template-columns: repeat(6, 1fr); }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .grid-md-1 { grid-template-columns: repeat(1, 1fr); }
    .grid-md-2 { grid-template-columns: repeat(2, 1fr); }
    .grid-md-3 { grid-template-columns: repeat(3, 1fr); }
    .grid-md-4 { grid-template-columns: repeat(4, 1fr); }
    .grid-md-5 { grid-template-columns: repeat(5, 1fr); }
    .grid-md-6 { grid-template-columns: repeat(6, 1fr); }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .grid-lg-1 { grid-template-columns: repeat(1, 1fr); }
    .grid-lg-2 { grid-template-columns: repeat(2, 1fr); }
    .grid-lg-3 { grid-template-columns: repeat(3, 1fr); }
    .grid-lg-4 { grid-template-columns: repeat(4, 1fr); }
    .grid-lg-5 { grid-template-columns: repeat(5, 1fr); }
    .grid-lg-6 { grid-template-columns: repeat(6, 1fr); }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .grid-xl-1 { grid-template-columns: repeat(1, 1fr); }
    .grid-xl-2 { grid-template-columns: repeat(2, 1fr); }
    .grid-xl-3 { grid-template-columns: repeat(3, 1fr); }
    .grid-xl-4 { grid-template-columns: repeat(4, 1fr); }
    .grid-xl-5 { grid-template-columns: repeat(5, 1fr); }
    .grid-xl-6 { grid-template-columns: repeat(6, 1fr); }
}

/* Spacing classes for columns and rows */
.gap-10 { gap: 10px; }
.gap-20 { gap: 20px; }
.gap-30 { gap: 30px; }
.gap-40 { gap: 40px; }
.gap-50 { gap: 50px; }

/* For finer control over row and column gaps */
.column-gap-10 { column-gap: 10px; }
.column-gap-20 { column-gap: 20px; }
.column-gap-30 { column-gap: 30px; }
.column-gap-40 { column-gap: 40px; }
.column-gap-50 { column-gap: 50px; }

.row-gap-10 { row-gap: 10px; }
.row-gap-20 { row-gap: 20px; }
.row-gap-30 { row-gap: 30px; }
.row-gap-40 { row-gap: 40px; }
.row-gap-50 { row-gap: 50px; }


/**
========================
|| Colunas
========================
 */
/* Base styles for the column container */
.colunas {
    column-gap: 16px;
    padding: 16px;
    box-sizing: border-box;
}

/* Column span classes */
.colunas-1 { columns: 1; }
.colunas-2 { columns: 2; }
.colunas-3 { columns: 3; }
.colunas-4 { columns: 4; }
.colunas-5 { columns: 5; }
.colunas-6 { columns: 6; }

@media (min-width: 577px) {
    .colunas-md-1 { columns: 1; }
    .colunas-md-2 { columns: 2; }
    .colunas-md-3 { columns: 3; }
    .colunas-md-4 { columns: 4; }
    .colunas-md-5 { columns: 5; }
    .colunas-md-6 { columns: 6; }
}

@media (min-width: 769px)  {
    .colunas-lg-1 { columns: 1; }
    .colunas-lg-2 { columns: 2; }
    .colunas-lg-3 { columns: 3; }
    .colunas-lg-4 { columns: 4; }
    .colunas-lg-5 { columns: 5; }
    .colunas-lg-6 { columns: 6; }
}

@media (min-width: 993px) {
    .colunas-xl-1 { columns: 1; }
    .colunas-xl-2 { columns: 2; }
    .colunas-xl-3 { columns: 3; }
    .colunas-xl-4 { columns: 4; }
    .colunas-xl-5 { columns: 5; }
    .colunas-xl-6 { columns: 6; }
}


/**
========================
|| Posts cards
========================
 */
a.post-card-wrapper {
    text-decoration: unset;
}

.post-card {
    position: relative;
    height: 100%;
    background-color: var(--tertiary);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dark-theme .post-card {
    background-color: var(--body-lighter-dark);
}

.post-card-wrapper:hover .post-card {
    background-color: var(--primary);
}

.post-card > .post-thumbnail {
    aspect-ratio: 16/9;
    width: 100%;
}

.post-card > .post-thumbnail img {
    aspect-ratio: 16/9;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

.post-card > .post-body {
    padding: 1.5rem;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.post-card > .post-body > .post-title {
    color: var(--primary);
    font-family: inherit;
    font-size: 28px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.5;
}

.dark-theme .post-card > .post-body > .post-title {
    color: var(--quinary);
}

.post-card a {
    color: var(--primary);
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
}

.post-card a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}

.post-card:hover a {
    color: #fff;
}

.post-date {
    color: #333;
    font-family: inherit;
    font-size: 12pt;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5;
    margin-top: auto;
}

.dark-theme .post-date {
    color: var(--quinary);
}

.dark-theme .post-card > .post-body > .post-date {
    color: var(--quinary);
}

.post-card-wrapper:hover .post-card > .post-body .post-date {
    color: #fff;
}

/** Posts list items **/
.post-list {
    padding-left: 0;
    list-style: none;
    position: relative;
}
.post-list .post-item {
    padding: 2rem 0;
    border-bottom: 1px solid #000;
}
.dark-theme .post-list .post-item {
    border-bottom: 1px solid var(--body-lighter-dark);
}

/* CSS PARA O SLIDER DOS DESTAQUES */
.slider-controls {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1rem;
    padding: 3px;
    overflow: visible;
    position: absolute;
    width: 110px;
    min-height: 60px;
    z-index: 2;
    top: 5px;
    left: 5px;
}

.ama.carousel.slide .slider-controls .carousel-control-next,
.ama.carousel.slide .slider-controls .carousel-control-prev {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    color: #333;
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    border: 2px solid var(--primary);
    background-color: var(--primary);
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 50%;
    height: 48px;
    width: 48px;
    opacity: 1;
}

.ama.carousel.slide .slider-controls .carousel-control-next {
    background-image: url("../www-a11y-theme/img/chevron-right-light.svg");
}

.ama.carousel.slide .slider-controls .carousel-control-prev {
    background-image: url("../www-a11y-theme/img/chevron-left-light.svg");
}

.dark-theme .ama.carousel.slide .slider-controls .carousel-control-next {
    background-image: url("../www-a11y-theme/img/chevron-right-light.svg");
}

.dark-theme .ama.carousel.slide .slider-controls .carousel-control-prev {
    background-image: url("../www-a11y-theme/img/chevron-left-light.svg");
}

.ama.carousel.slide .slider-controls .carousel-control-next:focus,
.ama.carousel.slide .slider-controls .carousel-control-prev:focus {
    box-shadow: 0 0 0 3px var(--warning);
}

.ama.carousel.slide .slider-controls .carousel-control-next:hover,
.ama.carousel.slide .slider-controls .carousel-control-prev:hover {
    border-color: var(--primary);
    background-color: transparent;
}

.dark-theme .ama.carousel.slide .slider-controls .carousel-control-next:hover,
.dark-theme .ama.carousel.slide .slider-controls .carousel-control-prev:hover {
    background-color: var(--quinary);
}

.ama.carousel.slide .slider-controls .carousel-control-next:hover {
    background-image: url("../www-a11y-theme/img/chevron-right-dark.svg");
}

.dark-theme .ama.carousel.slide .slider-controls .carousel-control-next:hover {
    background-image: url("../www-a11y-theme/img/chevron-right-dark.svg");
}

.ama.carousel.slide .slider-controls .carousel-control-prev:hover {
    background-image: url("../www-a11y-theme/img/chevron-left-dark.svg");
}

.dark-theme .ama.carousel.slide .slider-controls .carousel-control-prev:hover {
    background-image: url("../www-a11y-theme/img/chevron-left-dark.svg");
}

.ama.carousel.slide .second-column {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 1rem;
    padding: 2rem 2rem 2rem 0;
    text-align: left;
}

.ama.carousel.slide .first-column {
    margin-top: 80px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0;
}

.ama.carousel.slide .first-column .feature-image {
    aspect-ratio: 16/9;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

@media screen and (min-width: 768px ) and (max-width: 1199.98px){
    .ama.carousel.slide .second-column {
        margin-top: 47px;
    }

    .ama.carousel.slide .first-column {
        margin-top: 0;
        justify-content: center;
    }
}

@media screen and (min-width: 1200px) {
    .ama.carousel.slide .first-column {
        margin-top: 0;
        justify-content: flex-start;
    }

    .ama.carousel.slide .second-column {
        margin-top: 47px;
    }
}

.dark-theme .wp-block-lazyblock-section.has-background.has-secundaria-background-color {
    background-color: var(--secondary-dark);
}

/** Highlights Cards **/
.card-highlight {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: var(--quinary);
    padding: 1rem;
    border: unset;
    border-radius: 4px;
}

.dark-theme .card-highlight {
    background-color: var(--primary);
}

.card-highlight a::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}

.card-highlight .card-footer {
    margin-top: auto;
    padding-top: 0;
    color: var(--primary);
    background-color: unset;
}

.dark-theme .card-highlight .card-footer {
    color: #fff;
}

.card-highlight:hover .card-footer {
    color: #fff;
}

.card-highlight .card-title {
    margin-bottom: 2rem;
}

.card-highlight:hover .card-title a,
.card-highlight:hover .card-text,
.card-highlight:hover .card-footer {
    color: #fff;
}

.dark-theme .card-highlight .card-text {
    color: #fff;
}

.card-highlight .card-footer .icon_card,
.card-highlight .card-footer .icon-xl-forms {
    color: var(--primary) !important;
    width: 72px;
    filter: brightness(0) saturate(100%) invert(22%) sepia(28%) saturate(4199%) hue-rotate(225deg) brightness(88%) contrast(103%);
}

.card-highlight:hover .card-footer .icon_card,
.card-highlight:hover .card-footer .icon-xl-forms,
.dark-theme .card-highlight .card-footer .icon_card,
.dark-theme .card-highlight .card-footer .icon-xl-forms {
    color: #fff !important;
    width: 72px;
    filter: brightness(0) invert(100%);
}

@media screen and (min-width: 576px) and (max-width: 992px) {
    .card-highlight .card-body {
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 1.5rem;
    }

    .card-highlight .card-body > * {
        flex-shrink: 0;
        flex-grow: 0;
        margin: 0;
        width: fit-content;
        max-width: 75%;
    }

    .card-highlight .card-body .card-footer {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
}

.dark-theme .card-highlight {
    background-color: var(--primary);
    color: #000;
}

.card-highlight:hover {
    background-color: var(--primary);
    color: #000;
}

.dark-theme .card-highlight:hover {
    background-color: var(--primary);
    color: #fff;
}



/** Tutoriais **/
.tutorial aside .sidebar-menu {
    position: sticky;
    top: 40px;
    bottom: 40px;
    margin-left: 0;
}

a.version {
    padding: .5rem 1rem;
    color: white;
    font-size: 16px;
    line-height: 1.5;
    font-weight: bold;
    text-decoration: unset;
    background-color: var(--primary);
}

a.version:hover {
    background-color: var(--quinary);
    color: #000;
}

.dark-theme a.version {
    background-color: var(--quinary);
    color: #000;
}

.dark-theme a.version:hover {
    background-color: var(--primary);
    color: #fff;
}

.featured-image [class^="icon"]::before {
    font-size: 130px !important;
}

.post-list-container {
    position: relative;
}

.loading-posts {
    display: none;
}

.loading-posts.show {
    position: absolute;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-color: white;
    background-image: url('./img/loading-spinner.gif');
    background-repeat: no-repeat;
    background-size: 50px;
    background-position: center center;
    transition: all 250ms ease-in-out;
}

/* posts */
.post.featured-image {
    text-align: center;
    margin: 1.5rem 0;
}

.most-read {
    padding: 0;
    list-style-type: none;
}

.most-read .item {
    padding: 1rem 0;
    border-bottom: 1px solid #d8d8d8;
}

.most-read .item:last-child {
    border-bottom: unset;
}

/* Paginação */
.paginacao-artigos .total-posts {
    margin-bottom: 1rem;
}
.post-navigation {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 2rem 0;
}
.post-navigation .artigo-anterior {
    text-align: left;
}

.post-navigation .artigo-seguinte {
    text-align: right;
}

.paginacao-artigos .paginas {
    padding-left: 0;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: .5rem;
}

.paginacao-artigos .paginas li {
    list-style: none;
}

.paginacao-artigos .paginas .page-item {
    border-radius: 50%;
    width: 46px;
    height: 46px;
    background-color: var(--ama-blue-0);
    color: var(--primary);
    border: 2px solid var(--ama-blue-0);
    background-size: 46px;
    background-repeat: no-repeat;
    background-position: center;
    font-weight: bold;
}

.dark-theme .paginacao-artigos .paginas .page-item {
    background-color: var(--ama-gray-700);
    color: var(--ama-blue-0);
    border: 2px solid var(--ama-gray-700);
}

.paginacao-artigos .paginas .page-item.first {
    background-image: url("./img/AMA_first_page_light.svg");
}

.paginacao-artigos .paginas .page-item.first:disabled {
    background-image: url("./img/AMA_first_page_disabled_light.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.first {
    background-image: url("./img/AMA_first_page_dark.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.first:disabled {
    background-image: url("./img/AMA_first_page_disabled_dark.svg");
}


.paginacao-artigos .paginas .page-item.last {
    background-image: url("./img/AMA_last_page_light.svg");
}

.paginacao-artigos .paginas .page-item.last:disabled {
    background-image: url("./img/AMA_last_page_disabled_light.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.last {
    background-image: url("./img/AMA_last_page_dark.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.last:disabled {
    background-image: url("./img/AMA_last_page_disabled_dark.svg");
}

.paginacao-artigos .paginas .page-item.prev {
    background-image: url("./img/AMA_prev_page_light.svg");
}

.paginacao-artigos .paginas .page-item.prev:disabled {
    background-image: url("./img/AMA_prev_page_disabled_light.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.prev {
    background-image: url("./img/AMA_prev_page_dark.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.prev:disabled {
    background-image: url("./img/AMA_prev_page_disabled_dark.svg");
}

.paginacao-artigos .paginas .page-item.next {
    background-image: url("./img/AMA_next_page_light.svg");
}

.paginacao-artigos .paginas .page-item.next:disabled {
    background-image: url("./img/AMA_next_page_disabled_light.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.next {
    background-image: url("./img/AMA_next_page_dark.svg");
}

.dark-theme .paginacao-artigos .paginas .page-item.next:disabled {
    background-image: url("./img/AMA_next_page_disabled_dark.svg");
}

.paginacao-artigos .paginas .page-item[aria-current="page"] {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

.paginacao-artigos .paginas .page-item:not([aria-current="page"]):hover {
    border-color: var(--primary);
    color: var(--primary);
    cursor: pointer;
}

.dark-theme .paginacao-artigos .paginas .page-item:not([aria-current="page"]):hover {
    border-color: var(--ama-blue-50);
    color: var(--ama-blue-50);
    cursor: pointer;
}

.paginacao-artigos .paginas .page-item:disabled:hover {
    cursor: not-allowed;
}

.paginacao-artigos .paginas .page-item:focus,
.paginacao-artigos .paginas .page-item:focus-visible {
    border-color: var(--warning);
    box-shadow: unset;
}

.paginacao-artigos .paginas .page-item[aria-curent="page"] {
    background-color: var(--secondary);
    border-color: var(--secondary);
}

.paginacao-artigos .paginas .page-item:disabled,
.paginacao-artigos .paginas .page-item[aria-disabled="true"] {
    background-color: transparent;
    border-color: transparent;
    color: #fff;
    cursor: not-allowed;
}

.paginacao-artigos .paginas .page-item:disabled:hover,
.paginacao-artigos .paginas .page-item[aria-disabled="true"]:hover,
.dark-theme .paginacao-artigos .paginas .page-item:disabled:hover,
.dark-theme .paginacao-artigos .paginas .page-item[aria-disabled="true"]:hover {
    background-color: transparent;
    border-color: transparent;
    color: #fff;
    cursor: not-allowed;
}