/* Lupo Rooms — date picker de marca para la página de habitación.
   Mejora progresiva sobre <input type="date">: el input nativo se oculta y
   conserva el valor (YYYY-MM-DD); este popup lo pinta con la identidad Lupo,
   abre en el mes disponible y bloquea los días anteriores (ocupados). */

.ldp-native-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}

.ldp-combo {
    position: relative;
    width: 100%;
    font-family: "Montserrat", sans-serif;
}

/* Disparador: imita el input pero estilizado */
.ldp-trigger {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 44px;
    padding: 10px 12px;
    background: #fff;
    border: 1px solid #e7e5e4;
    border-radius: 10px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    color: #1c1917;
    cursor: pointer;
    text-align: left;
}
.ldp-trigger.is-empty { color: #a8a29e; font-weight: 500; }
.ldp-trigger:focus-visible {
    outline: 2px solid var(--clr-lupo-red, #b81f22);
    outline-offset: 1px;
}
.ldp-trigger-ico {
    margin-left: auto;
    color: var(--clr-lupo-red, #b81f22);
    font-size: 18px;
    line-height: 1;
    flex-shrink: 0;
}

/* Popup del calendario */
.ldp-pop {
    position: absolute;
    z-index: 1000;
    top: calc(100% + 6px);
    left: 0;
    width: 300px;
    max-width: 92vw;
    background: #fff;
    border: 1px solid var(--clr-lupo-dark, #ebd9ba);
    border-radius: 14px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .16);
    padding: 14px;
}
.ldp-pop[hidden] { display: none; }

.ldp-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}
.ldp-title {
    font-weight: 700;
    font-size: 15px;
    color: #1c1917;
    text-transform: capitalize;
}
.ldp-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px; height: 34px;
    border: 1px solid #ece9e4;
    border-radius: 9px;
    background: var(--clr-lupo-lighter, #fefbf5);
    color: var(--clr-lupo-red, #b81f22);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}
.ldp-nav:hover:not(:disabled) { background: var(--clr-lupo-light, #f3eee2); }
.ldp-nav:disabled { color: #d6d3d1; cursor: default; background: #faf9f7; }

.ldp-dows,
.ldp-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 2px;
}
.ldp-dow {
    text-align: center;
    font-size: 11px;
    font-weight: 700;
    color: #a8a29e;
    text-transform: uppercase;
    padding: 4px 0;
}

.ldp-day {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    font-family: inherit;
    font-size: 14px;
    color: #1c1917;
    cursor: pointer;
}
.ldp-day.is-blank { visibility: hidden; cursor: default; }
.ldp-day:hover:not(:disabled):not(.is-selected) {
    background: var(--clr-lupo-light, #f3eee2);
}
.ldp-day:disabled {
    color: #d6d3d1;
    cursor: not-allowed;
    text-decoration: line-through;
    background: transparent;
}
.ldp-day.is-today { font-weight: 800; }
.ldp-day.is-available {
    box-shadow: inset 0 0 0 1.5px var(--clr-lupo-red, #b81f22);
    font-weight: 700;
}
.ldp-day.is-selected {
    background: var(--clr-lupo-red, #b81f22) !important;
    color: #fff;
    font-weight: 700;
}

/* Pie: leyenda "disponible desde" */
.ldp-foot {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0ece3;
    font-size: 11.5px;
    color: #78716c;
    line-height: 1.4;
}
.ldp-foot b { color: var(--clr-lupo-red, #b81f22); }

@media (max-width: 360px) {
    .ldp-day { height: 34px; font-size: 13px; }
}
