@charset "utf-8";
/* CSS Document */

/*
:root {
    --color-terracota: #984D2E;
    --color-arcilla: #B46C46;
    --color-arena: #CEB499;
    --color-verde-oliva: #625B3F;
    --color-madera-clara: #B18F6A;
}
    */

:root{
    --terracota:#984D2E;
    --arcilla:#B46C46;
    --arena:#CEB499;
    --verde-oliva:#625B3F;
    --madera-clara:#B18F6A;

    --color-primary:var(--terracota);
    --color-secondary:var(--arcilla);
    --color-accent:var(--verde-oliva);

    --body-bg:#faf7f4;
    --body-color:#984D2E;

    --board-text-olive: #474f2c;
    --board-text-wine: #a23b16;
    --board-bg: #e9d4b5;
    --board-border: #3c4220;
}

/* board definition */
.gallery-img{
    width:100%;
    aspect-ratio:1/1;
    object-fit:cover;
    border-radius:18px;
    border:4px solid #fff;
    box-shadow:0 8px 20px rgba(0,0,0,.12);
}

.board-position{
    position:absolute;
    left:0;
    right:0;
    bottom:100%;
    translate:0 100%;
    padding:4%;
}

.board-card{
    padding:3%;
}

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

.board-border{
    border-style:solid;
    border-color:var(--board-border);
    border-width:4px;
}

.dish-title{
    margin:0;
    line-height:1;
    font-weight:700;
    font-size:clamp(.8rem, 2vw, 2rem);

    display:-webkit-box;
    /* -webkit-line-clamp:2; */
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.dish-subtitle {
    margin:0;
    line-height:1;
    font-weight:600;
    font-size:clamp(.55rem, 1vw, 1rem);

    display:-webkit-box;
    /* -webkit-line-clamp:2; */
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.board-text-stroke {
    -webkit-text-stroke: 2px #484a3f;
    font-family: math;
}

@media (max-width: 767.98px){
    .board-position {
        padding:6%;
    }

    .board-card {
        padding:2%;
    }

    .board-border {
        border-width:2px;
    }

    .dish-subtitle {
        display:none;
    }

    .board-text-stroke {
        -webkit-text-stroke: 0px #484a3f;
    }
}

.board-text-olive {
    color: var(--board-text-olive);
}

.board-text-wine {
    color: var(--board-text-wine);
}
/* end board */

/* whats app */
@keyframes whatsappPulse {
    0%   { transform: scale(1); }
    10%  { transform: scale(1.08); }
    20%  { transform: scale(1); }
    100% { transform: scale(1); }
}

.btn-whatsapp-fixed{
    position:fixed;
    right:20px;
    bottom:20px;
    width:85px;
    height:85px;
    z-index:9999;
    animation: whatsappPulse 5s infinite;
}

.btn-whatsapp-fixed img{
    width:100%;
    height:100%;
    object-fit:contain;
}
/* end whatsapp */

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

.body-text {
    color: var(--body-color);
}

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

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

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

.bg-verde-oliva {
    background-color: var(--verde-oliva);
}

.bg-madera-clara {
    background-color: var(--madera-clara);
}

.text-terracota {
    color: var(--terracota);
}

.text-arcilla {
    color: var(--arcilla);
}

.text-arena {
    color: var(--arena);
}

.text-verde-oliva {
    color: var(--verde-oliva);
}

.text-madera-clara {
    color: var(--madera-clara);
}

.fs-7 {
    font-size: .9rem !important;
}

.fs-8 {
    font-size: .8rem !important;
}

.fs-9 {
    font-size: .75rem !important;
}

.app-input {
    font-size: 1rem;
    border: solid 1px #dee2e6;
    outline: 0 !important;
    width: 100%;
}

.btn-print-label {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: solid 2px green;
    width: 50px;
    height: 50px;
    background-color: rgb(16 100 16 / 75%);
    color: white;
    border-radius: 50%;
}

.count-box{
    min-width:120px;
    background:#fff;
    border:2px solid #CEB499;
    border-radius:15px;
    padding:20px 15px;
    box-shadow:0 4px 12px rgba(0,0,0,.08);
}

.count-number{
    font-size:3rem;
    font-weight:700;
    color:#984D2E;
    line-height:1;
}

.count-label{
    margin-top:10px;
    font-size:.9rem;
    text-transform:uppercase;
    letter-spacing:2px;
    color:#625B3F;
}