@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');
/*  verde caruso : #104c31 */

body {
    font-family: Nunito, "Seoge UI", Arial, Helvetica, sans-serif;
    background-color: #e4ede3;
}
.imgLogo{
    width: 80%;
}

.b{
    font-weight: 600;
}

.bkgCaruso{
    background-color: #0e5635;
}

.bkgOficina{
    background-image: url("../img/oficinaJC.webp");
    background-size: cover;  
    background-repeat: no-repeat; 
}

.headerPrincipal{
    font-family: "ZCOOL XiaoWei";
    font-size: 3em;
    color: #104c31;
}

.txtFont{
    font-family: "ZCOOL XiaoWei";
}

.txtDescri{
    font-family: "ZCOOL XiaoWei";
    font-size: 1.5em;
}

.colJc{
    color: #104c31 !important
}

.bkgLight {
    background-color: #104c3170;
}

.btnCaruso{
    color: white;
    background-color: #104c31;;
    border-color: #104c31;

}

.btnCaruso:hover{
    background-color: #158e58;;
}

.btnCaruso:active{
    background-color: #1dac6c !important;
}
.btnCaruso:disabled{
    background-color: #7e9389 !important;
}

.btnCaruso:focus-visible{
    --bs-btn-focus-box-shadow: 0 0 0 .25rem #0e563660;
    color:  #0e5635;
    background-color: #1dac6c;
    border-color: #2ad387; 
}
input:focus{
    box-shadow: 0 0 0 .25rem #0e563660 !important;
    border-color: #2ad387 !important;
}
.nav-link{
    color:  #0e5635;  
}

.nav-link:focus{
    color:  #0e5635; 
}
.nav-link:hover{
    color:  #2ad387; 
}

.nav-link:focus-visible{
    color:  #0e5635; 
    box-shadow: 0 0 0 .25rem #0e563660;
}

.nav-link.active {
    color: white !important;
    background-color: #0e5635 !important;
}

.icoAg{
    display:inline-block;
    font-size: 3em;
    color:  #104c31; 
}

.navBarBgk{
    background-color: #a6c1b5;
}

.loader1{
    width: 1em;
    height: 1em;
}

.oculto{
    display: none;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.tblCaruso {
    background-color: #e4ede3;
}
.tblCaruso td{
    background-color: #e4ede3;
}
.tblCaruso tbody th{
    background-color: #9fb79c;
}

.tblCaruso thead th {
    background-color: #8ca489; 
    color: #ffffff; 
    border-bottom: 2px solid #ccc; 
}

.tblCaruso tbody tr {
    border-bottom: 1px solid #ddd; /* Light dividers between rows */
}

.tblCaruso tbody tr:nth-child(odd) {
    background-color: #f9f9f9; /* Alternating row colors for readability */
}

.txtSm{
    color: #ccc;
    font-size: 0.8em;
}
.txtSm a{
    color: #9fb79c;
}

.chkD{
    height : 1.2em;
    width: 1.2em;
}

.tblSm {
    /* Adjust padding in table cells */
    td, th {
        padding: 4px 8px; /* Adjust these values as needed */
    }

    /* Adjust spacing between rows */
    tr {
        margin: 0; /* Ensure there's no extra margin */
    }

    /* Optional: Adjust font size if needed */
    td, th {
        font-size: 0.875rem; /* Adjust font size if necessary */
    }
}

.modal-content{
    background-color: #daedd7;
    border-color: #557151;
}

.modal-header{
    border-color: #557151;
}

.modal-footer{
    border-color: #daedd7;
}

.ldrCaruso{
    width: 3em;
    height: 3em;
}

.cardPago{
    background-color: #104c31;
    color: white;
    cursor: pointer;
    height: 12em;
    transition: background-image 1.5s, background-color 1.5s, color 1.5s; 
}

.cardPago:hover{
    background-color: #2ad38770;
    color: rgb(215, 215, 215);
   
}

.cardTarjeta:hover{
    background: linear-gradient(to top, #2ad38770, #23651bcc), url('/img/pagoCc.jpg'); background-size: cover; background-position: top center; background-repeat: no-repeat;


}

.cardEft:hover{
    background: linear-gradient(to top, #2ad38770, #23651bcc), url('/img/pagoEft.jpg'); background-size: cover; background-position: top center; background-repeat: no-repeat;
}

.o50{
    opacity: 50%;
}

.fl{
    text-decoration: underline;
    color: rgba(var(--bs-link-color-rgb),var(--bs-link-opacity,1));
    cursor: pointer;
}

.pwSmall{
    width: 10em;
    height: auto;
}

/* Reset padding and margin for elements inside chkAnimado */
.chkAnimado * {
    padding: 0;
    margin: 0;
}

/* Center the chkAnimado checkmark in the viewport */
.chkAnimado {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #fff;
    stroke-miterlimit: 10;
    margin-left: auto;
    margin-right: auto;
    box-shadow: inset 0px 0px 0px #7ac142;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

/* Styles for the chkAnimado circle */
.chkAnimado__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #7ac142;
    fill: none;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

/* Styles for the chkAnimado path */
.chkAnimado__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

/* Keyframes for animations */
@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {
    0%, 100% {
        transform: none;
    }
    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 30px #7ac142;
    }
}

.lnkCaruso{
    color: #2ad387;
}

.logoRpi{
    width: 5em;
    height: auto;
}