/* Colores globales */
:root {

    /* Colores institucionales */
    --uthf-yellow: #FFB400;
    --uthf-blue: #0DAED3;
    --uthf-red: #FE2B2B;
    --uthf-olive: #959801;
    --uthf-green: #74B749;
    --uthf-pink: #de577b;
    --uthf-purple: #9D4A9C;

}

.bg-uthf-yellow { background-color: var(--uthf-yellow) !important; }
.bg-uthf-blue   { background-color: var(--uthf-blue) !important; }
.bg-uthf-red    { background-color: var(--uthf-red) !important; }
.bg-uthf-olive  { background-color: var(--uthf-olive) !important; }
.bg-uthf-green  { background-color: var(--uthf-green) !important; }
.bg-uthf-pink   { background-color: var(--uthf-pink) !important; }
.bg-uthf-purple { background-color: var(--uthf-purple) !important; }

html{
    font-family: system-ui, -apple-system, 
    "Segoe UI", Roboto, "Helvetica Neue", 
    Arial, "Noto Sans", "Liberation Sans", sans-serif, 
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

body {
    height: 100dvh;
    width: 100%;
}

/* Scroll */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: #2b2b2b;
}

::-webkit-scrollbar-thumb {
    background: #910c11;
    border-radius: 0; /* cuadrado */
}

::-webkit-scrollbar-thumb:hover {
    background: #a21d22;
}
/* Scroll */

/* Navbar */
.dropdown-menu {
    border-radius: 12px;
    border: none;
    font-size: 13px !important;
}

.dropdown-menu .dropdown-item {
    padding: 10px 16px;
    /* border-radius: 8px; */
}

.dropdown-menu .dropdown-item:hover {
    background: rgba(64, 64, 64, 0.2);
    /* color: white !important; */
}
.navbar-toggler {
    border: none;
}

.navbar-toggler:focus {
    box-shadow: none;
}
/*FIN Navbar */

/* INI Main Container */
    /* body container */
    #main-content {
        margin-top: 0px !important;
        margin-left: 0;
        height: 100%;
        width: 100% !important;
        /*margin-bottom: 40px !important;*/
    }
    /* Animacion de las cards */
    .metro-tile {
        transition: transform .3s ease, box-shadow .3s ease;
        cursor: pointer;
    }

    .metro-rotate-left {
        transform: translateY(-8px) rotate(-3deg) scale(1.05);
        box-shadow: 0 1.5rem 2rem rgba(0,0,0,.25);
    }

    .metro-rotate-right {
        transform: translateY(-8px) rotate(3deg) scale(1.05);
        box-shadow: 0 1.5rem 2rem rgba(0,0,0,.25);
    }
    /* Animacion de las cards */
/* FIN Main Container */

/* Payment buttons: match the 35px height configured in the PayPal SDK. */
.btn.portal-payment-button {
    box-sizing: border-box;
    height: 35px;
    min-height: 35px;
    padding: 0 .75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1.1;
}