.tc-leave-portal {
    --tc-leave-text: #172033;
    --tc-leave-border: #d7deea;
    --tc-leave-primary: #2857a4;
    box-sizing: border-box;
    width: 100%;
    max-width: 1280px;
    margin: 24px auto;
    padding: 0 14px 40px;
    color: var(--tc-leave-text);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", sans-serif;
}
.tc-leave-card,
.tc-leave-header {
    margin-bottom: 18px;
    padding: 22px;
    border: 1px solid var(--tc-leave-border);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 18px rgba(24, 39, 75, .06);
}
.tc-leave-header { display: flex; align-items: center; justify-content: space-between; }
.tc-leave-header h2, .tc-leave-card h2, .tc-leave-card h3 { margin: 0 0 12px; }
.tc-leave-eyebrow { margin: 0 0 3px; color: #5d6a7e; font-size: .84rem; }
/* タイムカードを申請操作から独立して開けるようにする。 */
#tc-leave-timecard-card > summary { min-height: 24px; padding: 8px 0; font-weight: 700; cursor: pointer; }
#tc-leave-timecard-card > p { font-size: .9rem; line-height: 1.6; }
.tc-leave-login-card { max-width: 480px; margin: 48px auto; }
.tc-leave-login-card label,
.tc-leave-pin-card label,
.tc-leave-reason-label { display: block; margin: 14px 0; font-weight: 600; }
.tc-leave-login-card select,
.tc-leave-login-card input,
.tc-leave-pin-card input,
.tc-leave-reason-label textarea { box-sizing: border-box; width: 100%; margin-top: 6px; padding: 12px; border: 1px solid #aeb9cb; border-radius: 8px; font: inherit; }
.tc-leave-login-card select {
    height: 48px;
    min-height: 48px;
    padding: 10px 12px;
    line-height: 1.4;
    color: var(--tc-leave-text);
    background-color: #fff;
}
.tc-leave-login-card select option { line-height: 1.5; }
.tc-leave-primary-button,
.tc-leave-secondary-button { min-height: 44px; padding: 9px 18px; border: 1px solid var(--tc-leave-primary); border-radius: 8px; font: inherit; font-weight: 700; cursor: pointer; }
.tc-leave-primary-button { color: #fff; background: var(--tc-leave-primary); }
.tc-leave-secondary-button { color: var(--tc-leave-primary); background: #fff; }
.tc-leave-primary-button:disabled { cursor: not-allowed; opacity: .45; }
.tc-leave-step { display: flex; gap: 12px; align-items: center; margin: 22px 0 10px; }
.tc-leave-step > span { display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; color: #fff; background: var(--tc-leave-primary); font-weight: 700; }
.tc-leave-step p { margin: 2px 0 0; color: #617086; font-size: .9rem; }
.tc-leave-choice-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; max-width: 570px; }
#tc-leave-type-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tc-leave-choice-row button { min-height: 48px; border: 2px solid #bac5d5; border-radius: 9px; color: #314056; background: #fff; font-size: 1rem; font-weight: 700; cursor: pointer; }
.tc-leave-choice-row button.is-active { border-color: var(--tc-leave-primary); color: #fff; background: var(--tc-leave-primary); }
.tc-leave-legend { display: flex; gap: 16px; flex-wrap: wrap; margin: 14px 0; font-size: .84rem; }
.tc-leave-legend span { display: inline-flex; gap: 5px; align-items: center; }
.tc-leave-legend i { width: 14px; height: 14px; border-radius: 3px; border: 1px solid rgba(0, 0, 0, .15); }
.tc-legend-preferred { background: #d9e9ff; }
.tc-legend-paid { background: #ffe0ad; }
.tc-legend-fixed { background: repeating-linear-gradient(135deg, #e3e6eb, #e3e6eb 4px, #c7ccd4 4px, #c7ccd4 8px); }
.tc-legend-submitted { background: #ded2f6; }
.tc-leave-count-controls { display: flex; gap: 18px; align-items: end; justify-content: space-between; margin: 14px 0; padding: 14px; border: 1px solid var(--tc-leave-border); border-radius: 9px; background: #f7f9fc; }
.tc-leave-count-controls label { display: grid; gap: 6px; min-width: min(100%, 320px); }
.tc-leave-count-controls select { box-sizing: border-box; width: 100%; min-height: 44px; padding: 8px 36px 8px 11px; border: 1px solid #aeb9cb; border-radius: 8px; color: var(--tc-leave-text); background-color: #fff; font: inherit; }
.tc-leave-count-controls p { max-width: 620px; margin: 0; color: #5d6a7e; font-size: .86rem; line-height: 1.5; }
.tc-leave-calendar { display: grid; grid-template-columns: minmax(0, 1fr); width: 100%; }
.tc-leave-month { box-sizing: border-box; width: 100%; padding: 18px; border: 1px solid var(--tc-leave-border); border-radius: 10px; }
.tc-leave-month h3 { margin: 0; text-align: center; font-size: 1.35rem; }
.tc-leave-month-navigation { display: grid; grid-template-columns: minmax(100px, 140px) 1fr minmax(100px, 140px); gap: 12px; align-items: center; margin-bottom: 14px; }
.tc-leave-month-navigation button { min-height: 48px; padding: 8px 14px; border: 1px solid var(--tc-leave-primary); border-radius: 8px; color: var(--tc-leave-primary); background: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.tc-leave-month-navigation button:disabled { border-color: #c9d0da; color: #929ba8; background: #f2f4f7; cursor: not-allowed; }
.tc-leave-weekdays,
.tc-leave-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.tc-leave-weekdays span { padding: 7px 0; color: #637188; text-align: center; font-size: .9rem; font-weight: 700; }
.tc-leave-day { display: flex; min-width: 0; min-height: 108px; padding: 9px 6px; flex-direction: column; overflow: hidden; border: 1px solid #cdd5e1; border-radius: 7px; color: #27354a; background: #fff; text-align: center; cursor: pointer; }
.tc-leave-day strong { display: block; font-size: 1.15rem; }
.tc-leave-day small { display: block; margin-top: 5px; font-size: .75rem; line-height: 1.25; }
.tc-leave-day-counts { display: flex; gap: 3px; justify-content: center; flex-wrap: wrap; margin-top: auto; padding-top: 5px; }
.tc-leave-count-badge { display: inline-flex; padding: 2px 5px; border-radius: 999px; font-size: .7rem; font-weight: 700; line-height: 1.35; white-space: nowrap; }
.tc-leave-count-badge.is-preferred { color: #174d8f; background: #d9e9ff; }
.tc-leave-count-badge.is-paid { color: #7a4200; background: #ffe0ad; }
.tc-leave-count-short { display: none; }
.tc-leave-day.is-empty { border-color: transparent; background: transparent; }
.tc-leave-day.is-disabled { color: #9199a6; background: #f2f4f7; cursor: not-allowed; }
.tc-leave-day.is-fixed-full,
.tc-leave-day.is-fixed-am,
.tc-leave-day.is-fixed-pm { background: repeating-linear-gradient(135deg, #f1f2f4, #f1f2f4 5px, #d9dde3 5px, #d9dde3 10px); }
.tc-leave-day.is-selected-preferred-full { border-color: #3268b2; background: #cfe2ff; box-shadow: inset 0 0 0 2px #3268b2; }
.tc-leave-day.is-selected-preferred-am { border-color: #3878c7; background: linear-gradient(to bottom, #cfe2ff 50%, #fff 50%); box-shadow: inset 0 0 0 2px #3878c7; }
.tc-leave-day.is-selected-preferred-pm { border-color: #3878c7; background: linear-gradient(to bottom, #fff 50%, #cfe2ff 50%); box-shadow: inset 0 0 0 2px #3878c7; }
.tc-leave-day.is-selected-paid-full { border-color: #b76b00; background: #ffe0ad; box-shadow: inset 0 0 0 2px #b76b00; }
.tc-leave-day.is-selected-paid-am { border-color: #b76b00; background: linear-gradient(to bottom, #ffe0ad 50%, #fff 50%); box-shadow: inset 0 0 0 2px #b76b00; }
.tc-leave-day.is-selected-paid-pm { border-color: #b76b00; background: linear-gradient(to bottom, #fff 50%, #ffe0ad 50%); box-shadow: inset 0 0 0 2px #b76b00; }
.tc-leave-day.is-submitted { border-color: #7652ad; background: #e5daf8; }
.tc-leave-selection-summary { margin: 18px 0; padding: 14px; border-radius: 9px; background: #f5f7fa; }
#tc-leave-selected-list { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 9px; }
#tc-leave-selected-list button { padding: 7px 10px; border: 1px solid #9cabc0; border-radius: 999px; cursor: pointer; }
#tc-leave-selected-list .is-selected-preferred-full,
#tc-leave-selected-list .is-selected-preferred-am,
#tc-leave-selected-list .is-selected-preferred-pm { background: #d9e9ff; }
#tc-leave-selected-list .is-selected-paid-full,
#tc-leave-selected-list .is-selected-paid-am,
#tc-leave-selected-list .is-selected-paid-pm { background: #ffe0ad; }
.tc-leave-message { min-height: 1.4em; color: #3f5e87; }
.tc-leave-message.is-error { color: #a61b1b; }
.tc-leave-muted { color: #6b7687; }
.tc-leave-request-table { display: grid; gap: 6px; }
.tc-leave-request-row { display: grid; grid-template-columns: 1.2fr .8fr .6fr .8fr auto; gap: 10px; align-items: center; padding: 9px; border-bottom: 1px solid #e4e8ef; }
.tc-leave-link-button { border: 0; color: #a61b1b; background: none; text-decoration: underline; cursor: pointer; }
.tc-leave-pin-card summary { font-weight: 700; cursor: pointer; }
.tc-leave-pin-card form { max-width: 420px; margin-top: 14px; }
@media (max-width: 640px) {
    .tc-leave-portal { padding-right: 6px; padding-left: 6px; }
    .tc-leave-card, .tc-leave-header { padding: 12px; border-radius: 10px; }
    .tc-leave-count-controls { display: grid; gap: 8px; padding: 10px; }
    .tc-leave-count-controls p { font-size: .78rem; }
    .tc-leave-month { padding: 8px; }
    .tc-leave-month-navigation { grid-template-columns: 84px 1fr 84px; gap: 6px; margin-bottom: 9px; }
    .tc-leave-month-navigation button { min-height: 44px; padding: 6px 4px; font-size: .84rem; }
    .tc-leave-month h3 { font-size: 1.08rem; }
    .tc-leave-weekdays, .tc-leave-days { gap: 2px; }
    .tc-leave-weekdays span { padding: 5px 0; font-size: .75rem; }
    .tc-leave-day { min-height: 84px; padding: 6px 2px; border-radius: 5px; }
    .tc-leave-day strong { font-size: 1rem; }
    .tc-leave-day small { margin-top: 3px; font-size: .62rem; line-height: 1.15; }
    .tc-leave-day-counts { gap: 2px; padding-top: 3px; }
    .tc-leave-count-badge { padding: 1px 3px; font-size: .62rem; }
    .tc-leave-count-full { display: none; }
    .tc-leave-count-short { display: inline; }
    .tc-leave-request-row { grid-template-columns: 1fr 1fr; }
}
