/* =========================
   ЭКРАН ВЫБОРА ВРЕМЕНИ (Calendar)
   ========================= */

* { box-sizing: border-box; }

/* ── Slide-in animation для карточек ── */
@keyframes slideInUp {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}
.slide-in-1 { animation: slideInUp .5s cubic-bezier(.34,1.56,.64,1) .10s both; }
.slide-in-2 { animation: slideInUp .5s cubic-bezier(.34,1.56,.64,1) .17s both; }
.slide-in-3 { animation: slideInUp .5s cubic-bezier(.34,1.56,.64,1) .24s both; }

/* ── Axolotl bob в хедере ── */
@keyframes axolotlBob {
    0%, 100% { transform: translateY(5px); }
    50%      { transform: translateY(-6px); }
}
@keyframes axolotlTilt {
    0%, 100% { transform: rotate(-4deg); }
    50%      { transform: rotate(4deg); }
}
.header-axolotl {
    animation: axolotlBob 2.2s ease-in-out infinite,
               axolotlTilt 2.8s ease-in-out infinite;
    transform-origin: center bottom;
}

.cal-sheet {
    padding: 22px 20px 160px 20px;
}

/* ── Карточки выбора ── */

.delivery-card {
    border-radius: 20px;
    margin-bottom: 14px;
    overflow: hidden;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform .12s ease, box-shadow .15s ease, background .3s ease;
    user-select: none;
}
.delivery-card:active { transform: scale(0.987); }

/* Scheduled card — активный (режим = scheduled) */
.delivery-card--scheduled {
    background: linear-gradient(135deg, #8FCCF7 0%, #70ADF5 100%);
    box-shadow: 0 6px 20px rgba(112,173,245,.25);
}

/* Scheduled card — приглушённый (режим = urgent) */
.delivery-card--scheduled.is-dimmed {
    background: linear-gradient(135deg, #C7E6FA 0%, #B3D6F7 100%);
    box-shadow: 0 3px 10px rgba(112,173,245,.10);
}

.delivery-card--scheduled.is-locked {
    background: rgba(200,200,210,.18);
    box-shadow: none;
    opacity: .6;
    cursor: default;
}

/* Urgent card */
.delivery-card--urgent {
    background: #fff;
    box-shadow: 0 4px 14px rgba(97,56,81,.07);
}
.delivery-card--urgent.is-selected {
    background: linear-gradient(135deg, #FF99B8, #F877A6);
    box-shadow: 0 8px 22px rgba(248,119,166,.32);
}
.delivery-card--urgent.is-locked {
    opacity: .55;
    cursor: default;
}

/* Шапка карточки */
.card-header {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
}
.card-icon {
    width: 46px; height: 46px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}
.delivery-card--scheduled .card-icon              { background: rgba(255,255,255,.22); }
.delivery-card--scheduled.is-dimmed .card-icon    { background: rgba(255,255,255,.20); }
.delivery-card--scheduled.is-locked .card-icon    { background: rgba(150,150,160,.12); }
.delivery-card--urgent .card-icon                 { background: rgba(255,153,184,.14); }
.delivery-card--urgent.is-selected .card-icon     { background: rgba(255,255,255,.22); }
.delivery-card--urgent.is-locked .card-icon       { background: rgba(150,150,160,.12); }

.card-text { flex: 1; min-width: 0; }
.card-title {
    font-size: 16px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 3px;
}
.delivery-card--urgent .card-title,
.delivery-card--urgent.is-locked .card-title { color: var(--lotti-text-title); }
.delivery-card--urgent.is-selected .card-title { color: #fff; }
.delivery-card--scheduled.is-locked .card-title { color: rgba(97,56,81,.45); }

.card-subtitle {
    font-size: 13px;
    color: rgba(255,255,255,.82);
}
/* Dimmed — текст слегка прозрачнее */
.delivery-card--scheduled.is-dimmed .card-subtitle { color: rgba(255,255,255,.65); }

.delivery-card--urgent .card-subtitle             { color: var(--lotti-text-sub); }
.delivery-card--urgent.is-selected .card-subtitle { color: rgba(255,255,255,.82); }
.delivery-card--scheduled.is-locked .card-subtitle { color: rgba(97,56,81,.35); }

/* Индикатор выбора для urgent */
.card-check {
    width: 26px; height: 26px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 700;
}
.delivery-card--urgent .card-check {
    border: 1.5px solid rgba(255,153,184,.40);
    color: transparent;
}
.delivery-card--urgent.is-selected .card-check {
    background: rgba(255,255,255,.22);
    border: none;
    color: #fff;
}

/* ── Разделитель внутри scheduled карточки ── */
.card-divider {
    height: 1px;
    background: rgba(255,255,255,.25);
    margin: 0 16px;
}
.delivery-card--scheduled.is-dimmed .card-divider { background: rgba(255,255,255,.40); }

/* ── Полоса дней ── */
.day-strip {
    display: flex;
    gap: 6px;
    padding: 16px 16px 0 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.day-strip::-webkit-scrollbar { display: none; }

.day-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    flex: 1;
    min-width: 40px;
    padding: 10px 4px;
    border: none;
    border-radius: 14px;
    background: rgba(255,255,255,.14);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background .15s ease;
}
/* Dimmed state day buttons */
.delivery-card--scheduled.is-dimmed .day-btn {
    background: rgba(255,255,255,.22);
}
.day-btn.is-selected {
    background: #fff;
}
.day-btn:active { opacity: .8; }

.day-btn__label {
    font-size: 11px;
    font-weight: 500;
    color: rgba(255,255,255,.70);
}
.delivery-card--scheduled.is-dimmed .day-btn__label { color: rgba(255,255,255,.55); }

.day-btn.is-selected .day-btn__label {
    color: #70ADF5;
}
.day-btn__num {
    font-size: 17px;
    font-weight: 400;
    color: rgba(255,255,255,.95);
}
.delivery-card--scheduled.is-dimmed .day-btn__num { color: rgba(255,255,255,.75); }

.day-btn.is-selected .day-btn__num {
    font-weight: 700;
    color: #70ADF5;
}

/* ── Сетка времени ── */
.time-section {
    padding: 14px 16px 16px 16px;
}
.time-section__label {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255,255,255,.80);
    margin-bottom: 10px;
}
.delivery-card--scheduled.is-dimmed .time-section__label { color: rgba(255,255,255,.60); }

.time-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}
.time-btn {
    padding: 10px 4px;
    border: none;
    border-radius: 12px;
    background: rgba(255,255,255,.18);
    color: rgba(255,255,255,.95);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background .12s ease;
    font-family: inherit;
}
/* Dimmed state time buttons */
.delivery-card--scheduled.is-dimmed .time-btn {
    background: rgba(255,255,255,.26);
    color: rgba(255,255,255,.75);
}
.time-btn.is-selected {
    background: #fff;
    color: #70ADF5;
    font-weight: 700;
}
.time-btn:disabled {
    opacity: .28;
    cursor: default;
}
.delivery-card--scheduled.is-dimmed .time-btn:disabled { opacity: .35; }
.time-btn:not(:disabled):active { opacity: .75; }

/* ── Hint под кнопкой ── */
.hint-text {
    text-align: center;
    font-size: 12px;
    color: var(--lotti-text-sub);
    margin-bottom: 8px;
    min-height: 18px;
    transition: opacity .2s ease;
}