/* in3pida Form 2 — Datepicker */

.ui-datepicker {
    width: 280px;
    padding: 0;
    display: none;
    background: #fff;
    border: none;
    border-radius: var(--if2-datepicker-radius, 14px);
    box-shadow: 0 8px 36px rgba(0,0,0,.18);
    font-family: inherit;
    font-size: 14px;
    z-index: 9999 !important;
    overflow: hidden;
}

/* Header mese/anno */
.ui-datepicker .ui-datepicker-header {
    position: relative;
    padding: 16px 48px;
    background: var(--if2-dp-header-bg, var(--if2-focus-color, #009bb9));
    color: #fff;
    font-weight: 700;
    font-size: 15px;
    letter-spacing: .02em;
}

/* Frecce navigazione */
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
}
.ui-datepicker .ui-datepicker-prev { left: 10px; }
.ui-datepicker .ui-datepicker-next { right: 10px; }
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover { background: rgba(255,255,255,.2); }

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
    display: block;
    position: absolute;
    left: 50%; top: 50%;
    transform: translate(-50%,-50%);
    font-size: 0;
    overflow: hidden;
}

.ui-datepicker .ui-icon-circle-triangle-e::before { content: "›"; font-size: 22px; color: #fff; line-height: 1; font-style: normal; }
.ui-datepicker .ui-icon-circle-triangle-w::before { content: "‹"; font-size: 22px; color: #fff; line-height: 1; font-style: normal; }
.ui-icon { display: inline-block; vertical-align: middle; background-image: none; text-indent: 0; overflow: visible; width: auto; height: auto; }

/* Titolo centrato */
.ui-datepicker .ui-datepicker-title {
    margin: 0;
    line-height: 1;
    text-align: center;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year { width: auto; }

/* Tabella giorni */
.ui-datepicker table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    padding: 10px 12px 14px;
    display: table;
}

/* Intestazione giorni settimana */
.ui-datepicker th {
    padding: 12px 0 8px;
    text-align: center;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    border: 0;
    color: #aaa;
}

/* Celle */
.ui-datepicker td {
    border: 0;
    padding: 2px 1px;
    text-align: center;
}

.ui-datepicker td span,
.ui-datepicker td a {
    display: block;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    text-decoration: none;
    color: #333;
    border-radius: 50%;
    border: none;
    margin: 0 auto;
    padding: 0;
    font-size: 13px;
    font-weight: 500;
    transition: background .12s, color .12s;
    cursor: pointer;
}

.ui-datepicker .ui-state-default { background: transparent; border: none; }

.ui-datepicker .ui-state-hover {
    background: color-mix(in srgb, var(--if2-dp-selected, #d82d6b) 15%, transparent);
    border: none;
    color: var(--if2-dp-selected, #d82d6b);
}

.ui-datepicker .ui-state-highlight {
    background: var(--if2-dp-today, var(--if2-focus-color, #009bb9));
    border: none;
    color: #fff;
    font-weight: 700;
}

.ui-datepicker .ui-state-active {
    background: var(--if2-dp-selected, #d82d6b);
    border: none;
    color: #fff;
    font-weight: 700;
}

/* Giorno fuori mese */
.ui-datepicker .ui-priority-secondary { opacity: .4; }

/* Giorni bloccati */
.ui-datepicker .ui-state-disabled,
.ui-datepicker .if2-blocked-date {
    opacity: .25;
    cursor: not-allowed;
    pointer-events: none;
}

/* Utils jQuery UI */
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.ui-datepicker-row-break { clear: both; width: 100%; font-size: 0; }
.ui-datepicker .ui-datepicker-buttonpane { background: #f6f6f6; margin: .5em 0 0; padding: 0 .2em; border-top: 1px solid #ddd; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; }

/* Fallback per browser senza color-mix */
@supports not (color: color-mix(in srgb, red 50%, blue)) {
    .ui-datepicker .ui-state-hover { background: rgba(0,155,185,.15); }
}

/* Menu mese/anno nell'header: stile in3pida (piatto, bordino bianco leggero, centrato).
   Blindato con !important: alcuni siti hanno altri plugin/temi (WPCode, ACF, ecc.) che
   resettano lo stile dei <select> e farebbero ricomparire la tendina nativa col triangolino. */
.ui-datepicker .ui-datepicker-title {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
}
.ui-datepicker .ui-datepicker-title select.ui-datepicker-month,
.ui-datepicker .ui-datepicker-title select.ui-datepicker-year,
.ui-datepicker .ui-datepicker-title select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background: transparent !important;
    background-image: none !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 3px 10px !important;
    margin: 0 !important;
    cursor: pointer !important;
    outline: none !important;
    text-align: center !important;
    text-align-last: center !important;
    -moz-text-align-last: center !important;
}
.ui-datepicker .ui-datepicker-title select option { color: #333 !important; background: #fff !important; text-align: center; }