/* 日数計算 */
#app-days .dy-panel {
    background: var(--bs-tertiary-bg);
    border-radius: .5rem;
}
#app-days .dy-result {
    background: var(--bs-body-bg);
    border-left: 4px solid var(--bs-primary);
    border-radius: .25rem;
}

/* タブ3つ: 等幅グリッド（btn-group は使わない） */
#app-days .dy-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
}
#app-days .dy-tabs .btn { white-space: nowrap; padding-inline: .25rem; font-weight: 700; }

/* 開始日 ⇄ 終了日: スマホは縦積み・PC は横並び */
#app-days .dy-dates {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .5rem;
    align-items: end;
}
#app-days .dy-dates .dy-swap { justify-self: center; transform: rotate(90deg); }
@media (min-width: 768px) {
    #app-days .dy-dates { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); }
    #app-days .dy-dates .dy-swap { transform: none; }
}
#app-days .dy-dates .form-control { min-width: 0; }
#app-days .dy-today { white-space: nowrap; }

#app-days .dy-offset-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: .5rem;
}
#app-days .dy-choice-2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}
#app-days .dy-choice-2 .btn { white-space: nowrap; font-weight: 700; }

#app-days .dy-checks {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem 1.25rem;
}

#app-days .dy-main { font-size: clamp(1.35rem, 5vw, 2rem); line-height: 1.25; font-variant-numeric: tabular-nums; }
#app-days .dy-main-sm { font-size: 1.15rem; }
#app-days .dy-reverse { border-top: 1px solid var(--bs-border-color); }
#app-days .dy-reverse-input { max-width: 16rem; }
#app-days .dy-extra-del { padding: .1rem .35rem; }