:root {
    --color-primary: var(--bs-primary);
    --color-primary-light: #466AA2;
    --color-primary-dark: #0D2143;
    --color-green-start: #1DD51E;
    --color-green-end: #00BE4E;
    --color-cyan-start: #6189D5;
    --color-cyan-end: #91BCFF;

    --color-blue-light-bg: #F0F5FF;
    --color-overlay-dark: rgba(15, 36, 70, 0.34);

    --gradient-blue-card: linear-gradient(117deg, var(--color-primary-dark) 0%, var(--color-primary-light) 100%);
    --gradient-green: linear-gradient(45deg, var(--color-green-start) 0%, var(--color-green-end) 100%);
    --gradient-cyan: linear-gradient(45deg, var(--color-cyan-start) 0%, var(--color-cyan-end) 100%);

    --swiper-pagination-color: var(--color-primary) !important;
}

html,
body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.bg-blue-light {
    background-color: var(--color-blue-light-bg);
}

.bg-blue-card {
    background:
        url('/PortalWebEstatal/UIPF/fallecidos/no-reclamados/assets/images/background/bg-card-fallecidos.webp') no-repeat center/cover,
        var(--gradient-blue-card) padding-box;
}

.bg-blue-gradient {
    background: var(--gradient-blue-card) padding-box;
}

.bg-green-gradient {
    background: transparent var(--gradient-green) padding-box;
}

.bg-cyan-gradient {
    background: transparent var(--gradient-cyan) padding-box;
}

.bg-blue-transparent {
    background: var(--color-overlay-dark) padding-box;
}

.contact-icon {
    width: 90px;
    height: 90px;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 10px;
    color: var(--bs-light);
}

.contact-icon.whatsapp-icon {
    background-color: #25D366;
}

.contact-icon.email-icon {
    background-color: #8DB3F4;
}

.swiper-button-next,
.swiper-button-prev {
    width: 50px;
    height: 50px;
    background-color: var(--color-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bs-light);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    border: none;
}

.swiper-button-next::after,
.swiper-button-prev::after {
    font-size: 1.2rem;
}

.swiper-pagination-bullet {
    font-family: 'Courier New', Courier, monospace;
    color: var(--swiper-pagination-color);
}

.modal {
    --bs-modal-border-width: 0 !important;
}

.pswp__custom-caption {
    position: absolute;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    max-width: 300px;
    width: 80%;
    padding: 4px 12px;
    background: var(--color-primary);
    color: var(--bs-light);
    font-family: 'Poppins', Helvetica Neue, Helvetica, Arial, sans-serif;
    font-weight: bold;
    font-size: 16px;
    text-align: center;
    border-radius: var(--bs-border-radius-pill);
}

.pswp__custom-caption a {
    color: var(--bs-light);
    text-decoration: underline;
}

.hidden-caption-content {
    display: none;
}

.link-item {
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

.link-item i,
.link-item span {
    transition: color 0.2s;
}

.link-item:hover {
    background-color: #1E3A8A;
    color: var(--bs-light);
}

.link-item:hover i,
.link-item:hover span {
    color: var(--bs-light);
}

.list-item {
    position: relative;
    cursor: pointer;
    transition: color 0.3s, background-color 0.3s;
    overflow: hidden;
}

.list-item:hover {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5) !important;
}

.list-item .icon-hidden {
    display: inline-block;
    width: 0;
    height: 1.25rem;
    margin-right: 0;
    opacity: 0;
    transform: translateX(-30px);
    visibility: hidden;
    transition: width 0.3s ease, margin-right 0.3s ease,
        opacity 0.5s, transform 0.5s;
}

.list-item:hover .icon-hidden {
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.5rem;
    opacity: 1;
    transform: translateX(0);
    visibility: visible;
    fill: var(--color-primary);
}

.list-item p {
    display: inline-block;
    color: var(--bs-light) !important;
    transition: color 0.5s cubic-bezier(0.4, 0, 0.2, 1),
        transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.list-item:hover p {
    color: var(--color-primary) !important;
    transform: translateX(10px);
}

.list-item .arrow-circle {
    width: 2.5rem;
    height: 2.5rem;
    transition: background-color 0.3s, transform 0.3s;
}

.list-item .arrow-circle svg {
    transition: transform 0.3s;
}

.list-item:hover .arrow-circle {
    background-color: var(--color-primary) !important;
    transform: rotate(30deg);
}

.list-item:hover .arrow-circle svg {
    color: var(--bs-light);
}

.autoplay-progress {
    position: absolute;
    right: 16px;
    bottom: 16px;
    z-index: 10;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: var(--bs-light);
}

.autoplay-progress svg {
    --progress: 0;
    position: absolute;
    inset: 0;
    stroke-width: 4px;
    stroke: var(--bs-light);
    fill: none;
    stroke-dasharray: 125.6;
    stroke-dashoffset: calc(125.6px * (1 - var(--progress)));
    transform: rotate(-90deg);
}

#gSlideTitle_4 {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: bold !important;
}

.mw-img {
    max-width: 350px !important;
}

@media (max-width: 680px) {
    .bg-blue-gradient {
        background-position-x: 30% !important;
    }
}

canvas {
    max-width: 100%;
    height: auto;
    display: block;
    margin: auto;
}

.div-canvas {
    max-width: 100%; 
    overflow-x: auto;
}

.dropup .hide-toggle.dropdown-toggle::after {
    display: none !important;
}
