/**
 * officesystem × Material Dashboard 追加スタイル
 */

/* --------------------------------------------------------------------------
 * テーマカラー（ここを変更すると全体のアクセント色が変わります）
 * Material Dashboard 標準はピンク (#e91e63)。本システムはダークグレー系を採用。
 * -------------------------------------------------------------------------- */
body.shanai-material {
    --shanai-accent: #262626;
    --shanai-accent-light: #42424a;
    --shanai-accent-dark: #191919;
    --shanai-accent-rgb: 38, 38, 38;

    --bs-primary: var(--shanai-accent);
    --bs-primary-rgb: var(--shanai-accent-rgb);
    --bs-primary-text-emphasis: var(--shanai-accent-dark);
    --bs-primary-bg-subtle: #e9ecef;
    --bs-primary-border-subtle: #ced4da;
    --bs-link-color: var(--shanai-accent-light);
    --bs-link-hover-color: var(--shanai-accent-dark);

    --shanai-success: #64dfdf;
    --shanai-success-light: #82ebeb;
    --shanai-success-dark: #46c3c3;

    --shanai-error: #e5343f;
    --shanai-error-light: #ea4d5a;
    --shanai-error-dark: #cf2438;
}

body.shanai-material .bg-gradient-primary,
body.shanai-material .btn.bg-gradient-primary {
    background-image: linear-gradient(195deg, var(--shanai-accent-light) 0%, var(--shanai-accent-dark) 100%);
}

body.shanai-material .shadow-primary {
    box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(64, 64, 64, 0.4) !important;
}

body.shanai-material .btn-outline-primary {
    color: var(--shanai-accent);
    border-color: var(--shanai-accent);
}

body.shanai-material .btn-outline-primary:hover,
body.shanai-material .btn-outline-primary:focus {
    background-color: var(--shanai-accent);
    border-color: var(--shanai-accent);
    color: #fff;
}

/* ボタン・サイドバーアクティブメニュー共通ホバー（削除アイコンと同様に薄く。box-shadow は Material 標準のまま維持） */
body.shanai-material .btn[class*="bg-gradient-"],
body.shanai-material .btn.btn-outline-secondary,
body.shanai-material .btn.btn-outline-dark,
body.shanai-material .btn.btn-outline-primary,
body.shanai-material .btn.btn-outline-danger,
body.shanai-material .sidenav .navbar-nav .nav-link[class*="bg-gradient-"] {
    transition: opacity 0.2s ease;
}

body.shanai-material .btn[class*="bg-gradient-"]:hover:not(:disabled):not(.disabled),
body.shanai-material .btn[class*="bg-gradient-"]:focus:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-secondary:hover:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-secondary:focus:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-dark:hover:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-dark:focus:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-primary:hover:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-primary:focus:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-danger:hover:not(:disabled):not(.disabled),
body.shanai-material .btn.btn-outline-danger:focus:not(:disabled):not(.disabled),
body.shanai-material .sidenav .navbar-nav .nav-link[class*="bg-gradient-"]:hover,
body.shanai-material .sidenav .navbar-nav .nav-link[class*="bg-gradient-"]:focus {
    opacity: 0.7;
}

body.shanai-material .sidenav .navbar-nav .nav-link.bg-gradient-dark:hover,
body.shanai-material .sidenav .navbar-nav .nav-link.bg-gradient-dark:focus {
    color: #fff;
}

body.shanai-material .text-primary {
    color: var(--shanai-accent) !important;
}

body.shanai-material .alert-primary {
    background-image: linear-gradient(195deg, var(--shanai-accent-light) 0%, var(--shanai-accent-dark) 100%);
    border: 0;
}

body.shanai-material .shanai-alert-success {
    background-color: var(--shanai-success);
    background-image: linear-gradient(195deg, var(--shanai-success-light) 0%, var(--shanai-success-dark) 100%);
    border: 0;
    color: #fff;
}

body.shanai-material .shanai-alert-error {
    background-color: var(--shanai-error);
    background-image: linear-gradient(195deg, var(--shanai-error-light) 0%, var(--shanai-error-dark) 100%);
    border: 0;
    color: #fff;
}

body.shanai-material .alert {
    --bs-alert-padding-y: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

body.shanai-material .alert-dismissible .btn-close {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

body.shanai-material .shanai-alert-success .btn-close,
body.shanai-material .shanai-alert-error .btn-close {
    filter: brightness(0) invert(1);
    opacity: 0.8;
}

body.shanai-material .shanai-alert-success .btn-close:hover,
body.shanai-material .shanai-alert-error .btn-close:hover {
    opacity: 1;
}

body.shanai-material .alert.text-white .btn-close {
    filter: brightness(0) invert(1);
    opacity: 0.8;
}

body.shanai-material .alert.text-white .btn-close:hover {
    opacity: 1;
}

body.shanai-material .mask.bg-gradient-primary {
    background-image: linear-gradient(195deg, rgba(66, 66, 74, 0.9) 0%, rgba(25, 25, 25, 0.9) 100%);
}

body.shanai-material .form-check {
    padding-left: 0;
}

body.shanai-material .form-check:not(.form-switch) .form-check-input[type=checkbox]:checked {
    border-color: var(--shanai-accent);
    background: var(--shanai-accent);
}

/* 一部選択（indeterminate）: ピンク塗りつぶしではなく、アクセント色＋横線 */
body.shanai-material .form-check:not(.form-switch) .form-check-input[type=checkbox]:indeterminate {
    border-color: var(--shanai-accent);
    background: var(--shanai-accent);
    background-image: none;
}

body.shanai-material .form-check:not(.form-switch) .form-check-input[type=checkbox]:indeterminate:after {
    content: "";
    opacity: 1;
    color: transparent;
    font-size: 0;
    background-image: linear-gradient(#fff, #fff);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 0.55rem 0.125rem;
}

/* モーダル表示中は背景ページのスクロールを止める（ホイールの伝播対策） */
body.shanai-material.modal-open {
    overflow: hidden !important;
    overscroll-behavior: none;
}

body.shanai-material.modal-open .main-content {
    overflow: hidden !important;
    overscroll-behavior: none;
}

body.shanai-material .modal {
    overscroll-behavior: contain;
}

body.shanai-material .modal .modal-dialog-scrollable .modal-content,
body.shanai-material .modal .modal-dialog-scrollable .modal-body,
body.shanai-material .job-customer-picker-results,
body.shanai-material .job-customer-picker-table-wrap,
body.shanai-material .job-member-picker-results,
body.shanai-material .job-member-picker-table-wrap,
body.shanai-material .headquarters-search-results,
body.shanai-material .bank-candidate-list,
body.shanai-material .bank-search-result-wrap {
    overscroll-behavior: contain;
}

/* モーダル（z-index: 1050）よりサイドナビ（標準 9999）が前面に出ないよう調整 */
body.shanai-material .sidenav {
    z-index: 1030;
}

/*
 * サイドバー: タイトル／ログアウト固定、メニュー一覧のみスクロール
 * (.navbar 由来の横並びを抑止するため flex-direction / flex-wrap を明示)
 */
body.shanai-material .sidenav.navbar-vertical {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
}

body.shanai-material .sidenav .sidenav-header,
body.shanai-material .sidenav > hr.horizontal {
    flex-shrink: 0;
}

body.shanai-material .sidenav.navbar-vertical .navbar-collapse {
    flex: 1 1 auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    position: relative;
}

body.shanai-material .sidenav .sidenav-footer {
    position: static !important;
    flex-shrink: 0;
    width: 100%;
}

/* --------------------------------------------------------------------------
 * 入力欄（input-group-outline）
 * Material 標準は上辺を透明にするため、border-top-color を明示的に上書きする。
 * 枠線は4辺すべて描き、浮いたラベルは白背景で切り欠く。
 * -------------------------------------------------------------------------- */
body.shanai-material .input-group-outline .form-control,
body.shanai-material .input-group-outline .form-label + .form-control {
    border: 1px solid #dee2e6 !important;
    border-top-color: #dee2e6 !important;
    border-radius: 0.375rem !important;
    box-shadow: none !important;
}

/* 疑似要素による上辺の描き直しを無効化（フォーカス時のラベル横線を防ぐ） */
body.shanai-material .input-group-outline .form-label:before,
body.shanai-material .input-group-outline .form-label:after,
body.shanai-material .input-group.input-group-outline.is-focused .form-label:before,
body.shanai-material .input-group.input-group-outline.is-focused .form-label:after,
body.shanai-material .input-group.input-group-outline.is-filled .form-label:before,
body.shanai-material .input-group.input-group-outline.is-filled .form-label:after {
    display: none !important;
    content: none !important;
    border: 0 !important;
    box-shadow: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
}

/* フォーカス / 入力あり：4辺すべてアクセント色（上辺も明示） */
body.shanai-material .input-group-outline.is-focused .form-control,
body.shanai-material .input-group-outline.is-filled .form-control,
body.shanai-material .input-group-outline.is-focused .form-label + .form-control,
body.shanai-material .input-group-outline.is-filled .form-label + .form-control {
    border-color: var(--shanai-accent) !important;
    border-top-color: var(--shanai-accent) !important;
    box-shadow: none !important;
    outline: none !important;
}

body.shanai-material .input-group-outline .form-control:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* 浮いたラベルは白背景で上辺を切り欠く */
body.shanai-material .input-group-outline.is-focused .form-label,
body.shanai-material .input-group-outline.is-filled .form-label {
    display: inline-block !important;
    position: absolute;
    color: var(--shanai-accent) !important;
    background-color: #fff !important;
    padding: 2px 0.45rem !important;
    margin-left: 0.35rem;
    width: auto !important;
    height: auto !important;
    line-height: 1.2 !important;
    z-index: 2;
    box-shadow: 0 0 0 2px #fff;
}

/* カードヘッダー（タイトル + 補足） */
body.shanai-material .card .card-header h6 {
    color: #344767;
    font-weight: 600;
    margin-bottom: 0.25rem;
}

body.shanai-material .card .card-header .text-sm {
    color: #7b809a;
}

/* ページタイトル（ナビ直下） */
body.shanai-material .main-content h3.font-weight-bolder {
    color: #344767;
}

/* =====================================================
 * スマホ専用（～1199px）: PC レイアウトには一切影響しない
 * ===================================================== */
@media (max-width: 1199.98px) {

    /* navbar-collapse を常に表示（Bootstrap の collapse を解除） */
    .g-sidenav-show .navbar.navbar-main .navbar-collapse {
        display: flex !important;
        flex-basis: auto;
        flex-shrink: 0;
        flex-grow: 0;
        margin-top: 0 !important;
    }
    .g-sidenav-show .navbar.navbar-main .navbar-nav {
        flex-direction: row;
        margin-left: 0 !important;
    }

    /* ハンバーガー・アイコン行の高さを揃える */
    .material-sidenav-toggler {
        display: flex;
        align-items: center;
        flex-shrink: 0;
        padding-right: 8px !important;
        height: 20px; /* material-symbols-rounded の font-size と揃える */
    }
    .material-sidenav-toggler .sidenav-toggler-inner {
        width: 18px;
    }
    /* アイコンリンクを flex 化してフォントメトリクス由来の余分な高さを除去 */
    .navbar.navbar-main .navbar-collapse .navbar-nav .nav-link {
        display: flex !important;
        align-items: center;
        height: 20px;
    }

    /* パンくずが中央で伸縮し、ハンバーガーとアイコンに挟まれる */
    .navbar.navbar-main > .container-fluid > nav[aria-label="breadcrumb"] {
        flex: 1 1 0;
        min-width: 0;
        overflow: hidden;
        align-self: center;
        line-height: 1;
    }
    .navbar.navbar-main > .container-fluid > nav[aria-label="breadcrumb"] .breadcrumb {
        flex-wrap: nowrap;
        margin-bottom: 0;
    }
    .navbar.navbar-main > .container-fluid > nav[aria-label="breadcrumb"] .breadcrumb-item {
        white-space: nowrap;
    }

    /* サイドナビオーバーレイ */
    .material-sidenav-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.35);
        z-index: 1015;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.25s ease, visibility 0.25s ease;
    }
    body.g-sidenav-pinned .material-sidenav-overlay {
        opacity: 1;
        visibility: visible;
    }
    .g-sidenav-show.g-sidenav-pinned .sidenav {
        z-index: 1020;
    }
}

/* PC：overlay は非表示（念のため） */
@media (min-width: 1200px) {
    .material-sidenav-overlay {
        display: none !important;
    }
}

/* スライドパネル：会社ロゴ */
.material-configurator-header {
    padding-bottom: 1.25rem;
}

.material-configurator-header::after {
    content: "";
    display: table;
    clear: both;
}

.material-configurator-company-name {
    margin-bottom: 0;
}

.material-configurator-logo {
    display: block;
    max-height: 56px;
    max-width: 220px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* スライドパネル：会社情報ボタン（fixed-plugin 内の outline 上書きを解除） */
.fixed-plugin .btn.material-drawer-btn-filled {
    background-image: linear-gradient(195deg, var(--shanai-accent-light) 0%, var(--shanai-accent-dark) 100%) !important;
    background-color: var(--shanai-accent) !important;
    border: 1px solid transparent !important;
    color: #fff !important;
    box-shadow: 0 2px 2px 0 rgba(38, 38, 38, 0.1), 0 3px 1px -2px rgba(38, 38, 38, 0.18), 0 1px 5px 0 rgba(38, 38, 38, 0.15) !important;
}

.fixed-plugin .btn.material-drawer-btn-filled:hover,
.fixed-plugin .btn.material-drawer-btn-filled:focus {
    color: #fff !important;
}

@media (max-width: 1199.98px) {
    /* スライドパネル幅 */
    .fixed-plugin .card {
        width: 300px;
        right: -300px;
    }

    .material-configurator-logo {
        max-height: 36px;
        max-width: 140px;
    }
    p.material-configurator-company-name {
        font-size: 0.75rem !important; /* text-sm(0.875rem) × 0.64 */
    }
    h5.material-configurator-company-name {
        font-size: 0.8rem !important; /* h5(1.25rem) × 0.64 */
    }
}

/* お知らせカード（ダッシュボード） */
.material-info-card .info-title {
    font-weight: 700;
    font-size: 0.95rem;
    margin-bottom: 0.35rem;
}

.material-info-card .info-body {
    font-size: 0.875rem;
    color: #67748e;
    white-space: pre-wrap;
}

/* ログイン・入力欄：ラベル浮上時の位置 */
body.shanai-material .input-group-outline.is-filled label,
body.shanai-material .input-group-outline.is-focused label,
.input-group-outline.is-filled label,
.input-group-outline.is-focused label {
    top: -0.5rem;
    font-size: 0.75rem;
}

/* パンくず（Cake Breadcrumbs 互換） */
.material-breadcrumb.bread_crumb_ul {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 0;
    margin: 0;
}

.material-breadcrumb.bread_crumb_ul li {
    font-size: 0.875rem;
}

.material-breadcrumb.bread_crumb_ul li + li::before {
    content: "/";
    padding: 0 0.35rem;
    color: #adb5bd;
}

.material-breadcrumb.bread_crumb_ul li a {
    color: #67748e;
    text-decoration: none;
}

.material-breadcrumb.bread_crumb_ul li:last-child {
    color: #344767;
    font-weight: 600;
}

/* 一覧テーブル：行クリック */
body.shanai-material .table tbody tr.row_selected {
    cursor: pointer;
}

body.shanai-material .table tbody tr.row_selected:hover {
    background-color: #f8f9fa;
}

/* Material Dashboard の thead 既定（capitalize 等）を上書き */
body.shanai-material .table thead th {
    padding: 0.65rem 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    border-bottom: 1px solid #e9ecef;
}

/* 定型文一覧 */
body.shanai-material .default-wording-table {
    table-layout: fixed;
    width: 100%;
}

/* PC（1200px～）：全列 */
@media (min-width: 1200px) {
    body.shanai-material .default-wording-col-doc {
        width: 8%;
    }

    body.shanai-material .default-wording-col-subject {
        width: 14%;
    }

    body.shanai-material .default-wording-col-body {
        width: 32%;
    }

    body.shanai-material .default-wording-col-sign {
        width: 28%;
    }

    body.shanai-material .default-wording-col-updated {
        width: 18%;
    }
}

/* タブレット（768px～1199px）：書類・件名・更新日時 */
@media (min-width: 768px) and (max-width: 1199.98px) {
    body.shanai-material .default-wording-col-body,
    body.shanai-material .default-wording-col-sign {
        display: none;
    }

    body.shanai-material .default-wording-col-doc {
        width: 18%;
    }

    body.shanai-material .default-wording-col-subject {
        width: 42%;
    }

    body.shanai-material .default-wording-col-updated {
        width: 40%;
    }
}

/* スマホ（～767px）：書類・件名のみ */
@media (max-width: 767.98px) {
    body.shanai-material .default-wording-col-body,
    body.shanai-material .default-wording-col-sign,
    body.shanai-material .default-wording-col-updated {
        display: none;
    }

    body.shanai-material .default-wording-col-doc {
        width: 32%;
    }

    body.shanai-material .default-wording-col-subject {
        width: 68%;
    }
}

body.shanai-material .default-wording-body {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.5;
}

/* 休日設定一覧 */
body.shanai-material .holidays-table {
    table-layout: fixed;
    width: 100%;
}

@media (min-width: 768px) {
    body.shanai-material .holidays-col-date {
        width: 28%;
    }

    body.shanai-material .holidays-col-name {
        width: 72%;
    }
}

@media (max-width: 767.98px) {
    body.shanai-material .holidays-col-date {
        width: 38%;
    }

    body.shanai-material .holidays-col-name {
        width: 62%;
    }
}

body.shanai-material .holidays-preview-table tbody td {
    padding-top: 0.65rem;
    padding-bottom: 0.65rem;
}

body.shanai-material .holidays-preview-table tbody p {
    font-size: 0.75rem;
    line-height: 1.25;
}

/* お知らせ一覧 */
body.shanai-material .input-information-table {
    table-layout: fixed;
    width: 100%;
}

@media (min-width: 1200px) {
    body.shanai-material .input-information-col-period {
        width: 22%;
    }

    body.shanai-material .input-information-col-title {
        width: 16%;
    }

    body.shanai-material .input-information-col-body {
        width: 30%;
    }

    body.shanai-material .input-information-col-target {
        width: 12%;
    }

    body.shanai-material .input-information-col-enabled {
        width: 8%;
    }
}

@media (min-width: 768px) and (max-width: 1199.98px) {
    body.shanai-material .input-information-col-body,
    body.shanai-material .input-information-col-target {
        display: none;
    }

    body.shanai-material .input-information-col-period {
        width: 38%;
    }

    body.shanai-material .input-information-col-title {
        width: 52%;
    }

    body.shanai-material .input-information-col-enabled {
        width: 10%;
    }
}

@media (max-width: 767.98px) {
    body.shanai-material .input-information-col-body,
    body.shanai-material .input-information-col-target {
        display: none;
    }

    body.shanai-material .input-information-col-period {
        width: 58%;
    }

    body.shanai-material .input-information-col-title {
        width: 22%;
    }

    body.shanai-material .input-information-col-enabled {
        width: 20%;
    }
}

body.shanai-material .input-information-period-row .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .input-information-period-row .shanai-field-error {
    margin-top: 0.25rem;
    margin-bottom: 0;
}

body.shanai-material .input-information-body {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.5;
}

body.shanai-material .input-information-table th.input-information-col-enabled,
body.shanai-material .input-information-table td.input-information-col-enabled {
    text-align: center !important;
    vertical-align: middle !important;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

body.shanai-material .input-information-list-check {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 0;
    margin: 0;
    min-height: 1.25rem;
    pointer-events: none;
}

body.shanai-material .input-information-list-check .form-check-input {
    float: none !important;
    margin: 0 !important;
    margin-left: 0 !important;
    pointer-events: none;
}

body.shanai-material .input-information-search-period .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .input-information-search-checks .form-check {
    min-height: 1.25rem;
}

body.shanai-material .employee-menu-accesses-employee-field {
    min-width: min(100%, 280px);
    flex: 1 1 240px;
}

body.shanai-material .employee-menu-accesses-employee-field .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .employee-menu-accesses-table,
body.shanai-material .employee-menu-accesses-edit-table {
    table-layout: fixed;
    width: 100%;
}

body.shanai-material .employee-menu-accesses-col-menu {
    width: 70%;
}

body.shanai-material .employee-menu-accesses-col-auth {
    width: 30%;
}

body.shanai-material .employee-menu-accesses-edit-table .form-select {
    max-width: 12rem;
}

/* select 用アウトライン（ラベル常時浮上） */
body.shanai-material .shanai-outlined-field--select .shanai-outlined-label {
    top: 0;
    left: 0.65rem;
    transform: translateY(-50%);
    font-size: 0.75rem;
    background-color: #fff;
    padding: 0 0.35rem;
}

body.shanai-material .shanai-outlined-field--select:focus-within .shanai-outlined-box {
    border-color: var(--shanai-accent);
}

body.shanai-material .shanai-outlined-field--select:focus-within .shanai-outlined-label {
    color: var(--shanai-accent);
}

body.shanai-material .shanai-outlined-field--select .form-select {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    padding-left: 0.75rem !important;
    padding-right: 2rem !important;
}

/* native date 用アウトライン（ラベル常時浮上・ブラウザ日付UIと重ならないようにする） */
body.shanai-material .shanai-outlined-field--date .shanai-outlined-label {
    top: 0;
    left: 0.65rem;
    transform: translateY(-50%);
    font-size: 0.75rem;
    background-color: #fff;
    padding: 0 0.35rem;
}

body.shanai-material .shanai-outlined-field--date:focus-within .shanai-outlined-box {
    border-color: var(--shanai-accent);
}

body.shanai-material .shanai-outlined-field--date:focus-within .shanai-outlined-label {
    color: var(--shanai-accent);
}

body.shanai-material .shanai-required-mark {
    color: #f44335;
    font-weight: 600;
}

body.shanai-material .shanai-field-error {
    color: #f44335;
    font-size: 0.75rem;
    margin: 0.25rem 0 0;
    padding-left: 0.25rem;
    line-height: 1.4;
}

/* --------------------------------------------------------------------------
 * アウトライン入力欄（shanai-outlined-field）
 * 枠線は外側ボックスに描画し、ラベルはその上に重ねる（フォーカス時の横線なし）
 * -------------------------------------------------------------------------- */
body.shanai-material .shanai-outlined-field {
    position: relative;
    margin-bottom: 0.25rem;
}

body.shanai-material .shanai-outlined-box {
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    transition: border-color 0.15s ease;
}

body.shanai-material .shanai-outlined-field:focus-within .shanai-outlined-box,
body.shanai-material .shanai-outlined-field:has(.shanai-outlined-input:not(:placeholder-shown)) .shanai-outlined-box {
    border-color: var(--shanai-accent);
}

body.shanai-material .shanai-outlined-input {
    display: block;
    width: 100%;
    border: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    background: transparent !important;
    border-radius: 0.375rem !important;
    /* 標準 .btn と同じ高さ: padding-y 0.5rem + line-height 1.25rem（枠は .shanai-outlined-box） */
    padding: 0.5rem 0.75rem !important;
    font-size: 0.875rem !important;
    line-height: 1.25rem !important;
    min-height: calc(1.25rem + 1rem);
}

body.shanai-material .shanai-outlined-input:focus {
    outline: none !important;
    box-shadow: none !important;
}

body.shanai-material .shanai-outlined-textarea {
    min-height: 8rem;
    resize: vertical;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

body.shanai-material .shanai-outlined-textarea::-webkit-scrollbar {
    display: none;
}

/* 空欄：ラベルをフィールド内に表示 */
body.shanai-material .shanai-outlined-label {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    margin: 0;
    padding: 0 0.25rem;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    color: #7b809a;
    background: transparent;
    pointer-events: none;
    z-index: 1;
    transition: top 0.15s ease, transform 0.15s ease, font-size 0.15s ease, color 0.15s ease;
}

body.shanai-material .shanai-outlined-field--textarea:not(:focus-within):has(.shanai-outlined-input:placeholder-shown) .shanai-outlined-label {
    top: 1rem;
    transform: none;
}

/* 入力あり / フォーカス：ラベルを枠線上に浮かせる */
body.shanai-material .shanai-outlined-field:focus-within .shanai-outlined-label,
body.shanai-material .shanai-outlined-field:has(.shanai-outlined-input:not(:placeholder-shown)) .shanai-outlined-label {
    top: 0;
    left: 0.65rem;
    transform: translateY(-50%);
    font-size: 0.75rem;
    color: var(--shanai-accent);
    background-color: #fff;
    padding: 0 0.35rem;
}

/* 会社情報 */
body.shanai-material .company-info-detail-item {
    min-width: 0;
}

body.shanai-material .company-info-detail-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: #67748e;
    margin-bottom: 0.25rem;
}

body.shanai-material .company-info-detail-label--image {
    margin-bottom: 0.5rem;
}

body.shanai-material .company-info-detail-value {
    font-size: 0.875rem;
    font-weight: 400;
    color: inherit;
    margin-bottom: 0;
}

body.shanai-material .company-info-detail-value--block {
    margin-bottom: 1rem;
}

body.shanai-material .company-info-detail-value--line {
    margin-bottom: 0.25rem;
}

body.shanai-material .company-info-detail-value--line:last-child {
    margin-bottom: 0;
}

body.shanai-material .company-info-detail-empty {
    font-size: 0.875rem;
    color: #6c757d;
    margin-bottom: 0;
}

body.shanai-material .company-info-preview-image {
    max-height: 100px;
    max-width: 100%;
    object-fit: contain;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0.25rem;
    background-color: #fff;
}

body.shanai-material .company-info-image-input {
    display: none;
}

body.shanai-material .company-info-image-preview-wrap {
    position: relative;
    display: inline-block;
    max-width: 100%;
}

body.shanai-material .company-info-image-picker {
    display: block;
    cursor: pointer;
    margin-bottom: 0;
    border: 1px dashed #dee2e6;
    border-radius: 0.375rem;
    background-color: #fff;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

body.shanai-material .company-info-image-picker:hover {
    border-color: var(--shanai-accent);
    background-color: #f8f9fa;
}

body.shanai-material .company-info-image-preview-inner {
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
}

body.shanai-material .company-info-image-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    min-height: 100px;
    color: #6c757d;
    pointer-events: none;
}

body.shanai-material .company-info-image-delete-btn {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    padding: 0;
    border-radius: 0.375rem;
}

body.shanai-material .company-info-field-row .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .company-info-field-row > [class*="col"] {
    min-width: 0;
}

body.shanai-material .company-info-field-row .shanai-field-error {
    margin-top: 0.25rem;
    margin-bottom: 0;
}

body.shanai-material .company-info-edit-form .company-info-field-gap {
    margin-bottom: 1.5rem;
}

body.shanai-material .company-info-edit-form .company-info-field-gap .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .company-info-edit-form .company-info-field-gap .shanai-field-error {
    margin-top: 0.25rem;
    margin-bottom: 0;
}

body.shanai-material .company-info-edit-form .company-info-section-heading {
    margin-top: 2rem;
    margin-bottom: 1rem;
}

body.shanai-material .company-info-bank-top-row {
    --bs-gutter-x: 0.75rem;
}

body.shanai-material .company-info-bank-top-row > [class*="col"] {
    min-width: 0;
}

body.shanai-material .company-info-bank-top-row > .company-info-bank-code-col {
    flex: 0 0 7rem;
    max-width: 7rem;
}

body.shanai-material .company-info-bank-top-row .company-info-bank-search-btn {
    white-space: nowrap;
}

body.shanai-material .company-info-bank-top-row .shanai-outlined-field {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    body.shanai-material .company-info-bank-top-row > .company-info-bank-code-col {
        flex: 0 0 auto;
        width: 50%;
        max-width: 50%;
    }

    body.shanai-material .company-info-bank-top-row .company-info-bank-search-btn {
        width: 100%;
    }
}

@media (min-width: 768px) {
    body.shanai-material .company-info-bank-top-row {
        flex-wrap: nowrap;
        overflow-x: auto;
    }
}

/* 銀行検索モーダル */
body.shanai-material .bank-search-form-row .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .bank-search-form-row > [class*="col"] {
    min-width: 0;
}

body.shanai-material .bank-search-code-col {
    flex: 0 0 auto;
    max-width: 8rem;
}

body.shanai-material .bank-search-submit-btn {
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* 検索ボタンは入力欄に伸ばさず、通常高さのまま上下中央揃え */
body.shanai-material .bank-search-form-row {
    align-items: center !important;
}

@media (min-width: 768px) {
    body.shanai-material .bank-search-form-row .bank-search-submit-col {
        display: flex;
        align-items: center;
    }
}

body.shanai-material .bank-search-result-wrap {
    max-height: 12rem;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 0.5rem;
}

body.shanai-material .bank-search-table {
    table-layout: fixed;
    width: 100%;
    margin-bottom: 0;
}

body.shanai-material .bank-search-col-select {
    width: 2.75rem;
}

body.shanai-material .bank-search-col-code {
    width: 5.5rem;
}

body.shanai-material .bank-search-table .form-check-input {
    float: none;
    margin: 0;
}

@media (max-width: 767.98px) {
    body.shanai-material .bank-search-code-col {
        max-width: none;
    }

    body.shanai-material .bank-search-submit-btn {
        width: 100%;
    }
}

/* --------------------------------------------------------------------------
 * ダイアログ（モーダル）共通：ヘッダードラッグで移動
 * -------------------------------------------------------------------------- */
body.shanai-material .modal-header {
    cursor: move;
    /* ドラッグ時にヘッダー文字が選択されないように */
    user-select: none;
    -webkit-user-select: none;
    /* タッチ端末でドラッグ中にスクロールへ取られないように */
    touch-action: none;
}

/* ヘッダー内のボタン等は通常のカーソルに戻す */
body.shanai-material .modal-header .btn-close,
body.shanai-material .modal-header button,
body.shanai-material .modal-header a {
    cursor: pointer;
}

body.shanai-material .modal-header.shanai-modal-dragging {
    cursor: grabbing;
}

/* ドラッグ中は画面全体でのテキスト選択を抑止する */
body.shanai-material.shanai-modal-drag-active {
    user-select: none;
    -webkit-user-select: none;
}

/* ドラッグ後に閉じるとき、Bootstrap の dialog transform で中央へ飛ばない */
body.shanai-material .modal.shanai-modal-drag-closing .modal-dialog {
    transform: none !important;
    transition: none !important;
}

/* --------------------------------------------------------------------------
 * 共通ダイアログ（ブラウザ標準の alert/confirm 置き換え）
 * dialog.js が body 直下に生成する #shanai_common_dialog に適用される。
 * -------------------------------------------------------------------------- */
body.shanai-material .shanai-dialog .modal-title {
    font-size: 1rem;
    font-weight: 600;
    color: #344767;
}

body.shanai-material .shanai-dialog .shanai-dialog-message {
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 0.95rem;
    line-height: 1.6;
    color: #344767;
}

body.shanai-material .shanai-dialog .modal-footer {
    gap: 0.5rem;
}

/* --------------------------------------------------------------------------
 * 銀行／支店 検索の候補リスト（縦並び・クリックで選択）
 * -------------------------------------------------------------------------- */
body.shanai-material .bank-candidate-list {
    max-height: 60vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

body.shanai-material .bank-candidate-list .bank-candidate-item {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    text-align: left;
    padding: 0.65rem 1rem;
    font-size: 0.9rem;
    color: #344767;
    cursor: pointer;
}

body.shanai-material .bank-candidate-list .bank-candidate-item:hover,
body.shanai-material .bank-candidate-list .bank-candidate-item:focus {
    background-color: var(--bs-primary-bg-subtle);
}

body.shanai-material .bank-candidate-list .bank-candidate-code {
    flex-shrink: 0;
    min-width: 3.5em;
    font-variant-numeric: tabular-nums;
    color: #8392ab;
}

body.shanai-material .bank-candidate-list .bank-candidate-name {
    word-break: break-word;
}

/* 社員管理 */
body.shanai-material .employees-search-checks .form-check {
    min-height: 1.25rem;
}

body.shanai-material .employees-search-color-checks {
    gap: 0.5rem;
}

body.shanai-material .employees-search-color-option {
    position: relative;
    margin: 0;
    cursor: pointer;
}

body.shanai-material .employees-search-display-color {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

body.shanai-material .employees-color-swatch--search {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 0.375rem;
    border: 2px solid transparent;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.shanai-material .employees-search-color-option:hover .employees-color-swatch--search {
    box-shadow: 0 0 0 2px rgba(52, 71, 103, 0.15);
}

body.shanai-material .employees-search-display-color:checked + .employees-color-swatch--search {
    border-color: #344767;
    box-shadow: 0 0 0 2px rgba(52, 71, 103, 0.25);
}

body.shanai-material .employees-search-display-color:focus-visible + .employees-color-swatch--search {
    outline: 2px solid var(--shanai-accent);
    outline-offset: 2px;
}

body.shanai-material .employees-password-field .shanai-outlined-box,
body.shanai-material .account-password-field .shanai-outlined-box {
    position: relative;
}

body.shanai-material .employees-password-field .shanai-outlined-input,
body.shanai-material .account-password-field .shanai-outlined-input {
    padding-right: 2.75rem !important;
}

body.shanai-material .employees-password-toggle,
body.shanai-material .account-password-toggle {
    position: absolute;
    top: 50%;
    right: 0.5rem;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: #67748e;
    padding: 0.25rem;
    cursor: pointer;
    line-height: 1;
}

body.shanai-material .employees-password-toggle:hover,
body.shanai-material .account-password-toggle:hover {
    color: var(--shanai-accent);
}

body.shanai-material .employees-password-toggle .material-symbols-rounded,
body.shanai-material .account-password-toggle .material-symbols-rounded {
    font-size: 1.25rem;
}

body.shanai-material .employees-search-name-field {
    min-width: min(100%, 240px);
    flex: 1 1 200px;
}

body.shanai-material .employees-search-name-field .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .employees-table {
    table-layout: fixed;
    width: 100%;
    min-width: 62rem;
}

body.shanai-material .employees-col-name {
    width: auto;
}

body.shanai-material .employees-col-kana {
    width: auto;
}

body.shanai-material .employees-col-color {
    width: 3.5rem;
}

body.shanai-material .employees-col-role {
    width: auto;
}

body.shanai-material .employees-col-enabled {
    width: 4.5rem;
    text-align: center;
}

body.shanai-material .employees-col-attendance {
    width: 9rem;
    white-space: nowrap;
    text-align: center;
}

body.shanai-material .employees-attendance-btn {
    --bs-btn-padding-y: 0.2rem;
    --bs-btn-padding-x: 0.75rem;
    --bs-btn-line-height: 1.15;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    white-space: nowrap;
}

body.shanai-material .employees-attendance-btn .material-symbols-rounded {
    font-size: 0.95rem;
    line-height: 1;
    margin-top: 0;
    margin-bottom: 0;
}

body.shanai-material .employees-list-check {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 0;
    margin: 0;
    min-height: 1.25rem;
    pointer-events: none;
}

body.shanai-material .employees-list-check .form-check-input {
    float: none !important;
    margin: 0 !important;
    pointer-events: none;
}

body.shanai-material .employees-color-swatch {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    vertical-align: middle;
}

body.shanai-material .employees-display-color-field {
    margin-top: 1.25rem;
}

body.shanai-material .employees-color-picker {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

body.shanai-material .employees-color-option {
    position: relative;
    margin: 0;
    cursor: pointer;
}

body.shanai-material .employees-color-input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

body.shanai-material .employees-color-swatch--pick {
    width: 2rem;
    height: 2rem;
    border-radius: 0.375rem;
    border: 2px solid transparent;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.shanai-material .employees-color-option:hover .employees-color-swatch--pick {
    box-shadow: 0 0 0 2px rgba(52, 71, 103, 0.15);
}

body.shanai-material .employees-color-input:checked + .employees-color-swatch--pick {
    border-color: #344767;
    box-shadow: 0 0 0 2px rgba(52, 71, 103, 0.25);
}

body.shanai-material .employees-color-input:focus-visible + .employees-color-swatch--pick {
    outline: 2px solid var(--shanai-accent);
    outline-offset: 2px;
}

body.shanai-material .employees-table td.employees-col-color {
    text-align: center;
}

body.shanai-material .shanai-list-pagination .shanai-pagination-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
}

body.shanai-material .shanai-list-pagination .Pagination {
    display: flex;
    align-items: center;
    margin: 0;
}

body.shanai-material .shanai-list-pagination .Pagination--mobile {
    display: none;
}

@media (max-width: 767.98px) {
    body.shanai-material .shanai-list-pagination .Pagination--desktop {
        display: none;
    }

    body.shanai-material .shanai-list-pagination .Pagination--mobile {
        display: flex;
    }
}

body.shanai-material .shanai-list-pagination .Pagination > * + * {
    margin-left: 8px;
}

body.shanai-material .shanai-list-pagination .Pagination-Item-Link {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 32px;
    height: 32px;
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0.375rem;
    color: #344767;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    transition: background 0.15s linear, color 0.15s linear, border-color 0.15s linear, box-shadow 0.15s linear, opacity 0.15s linear;
}

body.shanai-material .shanai-list-pagination .Pagination-Item-Link-Icon {
    font-size: 0.875rem;
    font-weight: 700;
}

body.shanai-material .shanai-list-pagination .Pagination-Item-Link.isActive {
    pointer-events: none;
    background-color: var(--shanai-accent-dark);
    background-image: linear-gradient(195deg, var(--shanai-accent-light) 0%, var(--shanai-accent-dark) 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07);
}

body.shanai-material .shanai-list-pagination .Pagination-Item-Link:not(.isActive):not(.isDisabled):hover {
    background-color: var(--shanai-accent-dark);
    background-image: linear-gradient(195deg, var(--shanai-accent-light) 0%, var(--shanai-accent-dark) 100%);
    border-color: transparent;
    color: #fff;
    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07);
}

body.shanai-material .shanai-list-pagination .Pagination-Item-Link.isDisabled {
    pointer-events: none;
    cursor: default;
    box-shadow: none;
    background: #fff;
    border-color: #e9ecef;
    color: rgba(52, 71, 103, 0.35);
}

body.shanai-material .bank-candidate-list .bank-candidate-empty {
    text-align: center;
}

/* 顧客管理 */
body.shanai-material .customers-table,
body.shanai-material .customers-branches-table,
body.shanai-material .customers-persons-table {
    table-layout: fixed;
    width: 100%;
}

@media (min-width: 768px) {
    body.shanai-material .customers-col-code {
        width: 16%;
    }

    body.shanai-material .customers-col-name {
        width: 34%;
    }

    body.shanai-material .customers-col-eob {
        width: 6rem;
    }

    body.shanai-material .customers-col-branch,
    body.shanai-material .customers-col-person {
        width: 18%;
    }

    body.shanai-material .customers-branches-col-name {
        width: 55%;
    }

    body.shanai-material .customers-branches-col-tel {
        width: 45%;
    }

    body.shanai-material .customers-persons-col-name {
        width: 28%;
    }

    body.shanai-material .customers-persons-col-tel,
    body.shanai-material .customers-persons-col-mobile {
        width: 18%;
    }

    body.shanai-material .customers-persons-col-email {
        width: 36%;
    }
}

body.shanai-material .customers-list-check {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 0;
}

body.shanai-material .customers-list-check .form-check-input {
    float: none !important;
    margin: 0 !important;
    pointer-events: none;
}

@media (max-width: 767.98px) {
    body.shanai-material .customers-col-branch,
    body.shanai-material .customers-col-person {
        white-space: nowrap;
    }

    body.shanai-material .customers-related-name {
        width: 100%;
    }
}

body.shanai-material .customers-related-name .customer_name_span {
    font-weight: 600;
    color: #344767;
}

body.shanai-material .headquarters-search-results {
    max-height: 22rem;
    overflow-y: auto;
    border: 1px solid #f0f2f5;
    border-radius: 0.5rem;
}

body.shanai-material .headquarters-candidate {
    cursor: pointer;
}

body.shanai-material .headquarters-candidate:hover,
body.shanai-material .headquarters-candidate:focus {
    background: #f8f9fa;
    outline: 0;
}

/* 並び替えハンドル（nishizen .handle / fa-equals 相当） */
body.shanai-material #sort_table .handle {
    cursor: grab;
    color: #7b809a;
    user-select: none;
}

body.shanai-material #sort_table .handle:active {
    cursor: grabbing;
}

/* 勤怠管理 */
body.shanai-material .employee-attendance-card {
    position: relative;
    overflow: hidden;
}

body.shanai-material .employee-attendance-loading {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(1px);
}

body.shanai-material .employee-attendance-list-area {
    min-height: 20rem;
}

body.shanai-material .employee-attendance-empty-state {
    min-height: 20rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

body.shanai-material .employee-attendance-empty-state .material-symbols-rounded {
    color: #adb5bd;
    font-size: 2.5rem;
}

body.shanai-material .employee-attendance-calendar-toolbar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f0f2f5;
    min-height: 4.5rem;
}

body.shanai-material .employee-attendance-calendar-toolbar-legend {
    position: absolute;
    left: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
    max-width: min(14rem, calc(50% - 9rem));
}

body.shanai-material .employee-attendance-calendar-toolbar-center {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.75rem 1rem;
}

body.shanai-material .employee-attendance-calendar-toolbar-actions {
    position: absolute;
    right: 1.5rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}

body.shanai-material .employee-attendance-calendar-toolbar > .min-w-0,
body.shanai-material .employee-attendance-calendar-toolbar-center .min-w-0 {
    text-align: center;
}

body.shanai-material .employee-attendance-month-button {
    display: inline-flex;
    align-items: center;
    gap: 0.15rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: #344767;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.375;
    cursor: pointer;
}

body.shanai-material .employee-attendance-month-button:hover {
    color: var(--shanai-accent-dark);
}

body.shanai-material .employee-attendance-month-button .material-symbols-rounded {
    font-size: 1.25rem;
}

body.shanai-material .employee-attendance-employee-switcher {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 1.5rem;
}

body.shanai-material .employee-attendance-employee-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #344767;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
}

body.shanai-material .employee-attendance-employee-nav:hover {
    background: #f0f2f5;
    color: var(--shanai-accent-dark);
}

body.shanai-material .employee-attendance-employee-nav:disabled {
    color: #adb5bd;
    cursor: default;
}

body.shanai-material .attendance-dialog-date {
    color: var(--attendance-day-color, #737373);
    font-weight: 600;
}

body.shanai-material .attendance-dialog-day-nav {
    min-width: 2.75rem;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
    font-size: 1rem;
}

body.shanai-material .employee-attendance-calendar-scroll {
    width: 100%;
    overflow-x: auto;
}

body.shanai-material .employee-attendance-calendar-table {
    table-layout: fixed;
    width: 100%;
    min-width: 56rem;
}

body.shanai-material .employee-attendance-calendar-table th,
body.shanai-material .employee-attendance-calendar-table td {
    width: calc(100% / 7);
    border-right: 1px solid #f0f2f5;
}

body.shanai-material .employee-attendance-calendar-table th:last-child,
body.shanai-material .employee-attendance-calendar-table td:last-child {
    border-right: 0;
}

body.shanai-material .employee-attendance-weekday {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: 0.75rem 0.5rem !important;
    background: #fff;
}

body.shanai-material .employee-attendance-weekday--0 {
    color: #e91e63 !important;
}

body.shanai-material .employee-attendance-weekday--6 {
    color: #1a73e8 !important;
}

body.shanai-material .employee-attendance-day {
    height: 5rem;
    padding: 0 !important;
    vertical-align: top;
    background: #fff;
}

body.shanai-material .employee-attendance-day--empty {
    background: #f8f9fa;
}

body.shanai-material .employee-attendance-day-button {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    width: 100%;
    height: 100%;
    min-height: 5.75rem;
    padding: 0.4rem;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

body.shanai-material .employee-attendance-day-button:hover {
    background: #f8f9fa;
}

body.shanai-material .employee-attendance-day-button--active,
body.shanai-material .employee-attendance-day-button--active:hover {
    background: #fff8c5;
    box-shadow: inset 0 0 0 1px #f5e07a;
}

body.shanai-material .employee-attendance-day-button:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--shanai-accent-dark);
    outline-offset: -2px;
}

body.shanai-material .employee-attendance-day-header {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 0.35rem;
    min-height: 1.75rem;
    margin-bottom: 0.15rem;
}

body.shanai-material .employee-attendance-day-number {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 50%;
    color: var(--attendance-day-color, #344767);
    font-size: 0.75rem;
    font-weight: 700;
}

body.shanai-material .employee-attendance-day-number--today {
    color: #fff;
    background-image: linear-gradient(195deg, var(--shanai-accent-light) 0%, var(--shanai-accent-dark) 100%);
    box-shadow: 0 2px 4px rgba(52, 71, 103, 0.25);
}

body.shanai-material .employee-attendance-holiday {
    min-width: 0;
    color: #e91e63;
    font-size: 0.65rem;
}

body.shanai-material .employee-attendance-summary {
    display: block;
    margin-top: 0.2rem;
    color: #344767;
    font-size: 0.8rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-align: center;
    white-space: nowrap;
}

body.shanai-material .attendance-dialog-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.65rem;
}

body.shanai-material .attendance-dialog-section-label {
    margin-bottom: 0.65rem;
    color: #344767;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

body.shanai-material .attendance-dialog-section-header .attendance-dialog-section-label {
    margin-bottom: 0;
}

body.shanai-material .attendance-dialog-schedule-switch .form-check-input {
    width: 2.2rem;
    height: 1.15rem;
    margin-top: 0;
    cursor: pointer;
}

body.shanai-material .attendance-dialog-schedule-fields--disabled {
    opacity: 0.55;
    pointer-events: none;
}

body.shanai-material .employee-attendance-legend {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0.25rem;
    color: #7b809a;
    font-size: 0.72rem;
    line-height: 1.25;
}

body.shanai-material .employee-attendance-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

body.shanai-material .employee-attendance-legend-key {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    padding: 0.05rem 0.35rem;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    background: #fff;
    color: #344767;
    font-size: 0.65rem;
    font-weight: 700;
}

body.shanai-material .employee-attendance-legend-key--actual {
    background: #fff;
    color: #344767;
}

body.shanai-material .employee-attendance-legend-text {
    color: #7b809a;
    font-size: 0.68rem;
    font-weight: 500;
    white-space: nowrap;
}

body.shanai-material .employee-attendance-times {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    margin-top: 0.35rem;
    width: 100%;
}

body.shanai-material .employee-attendance-time-row {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    min-width: 0;
    line-height: 1.2;
}

body.shanai-material .employee-attendance-time-key {
    flex: 0 0 auto;
    min-width: 1.75rem;
    color: #7b809a;
    font-size: 0.62rem;
    font-weight: 700;
}

body.shanai-material .employee-attendance-time-row--actual .employee-attendance-time-key {
    color: #344767;
}

body.shanai-material .employee-attendance-time-value {
    min-width: 0;
    overflow: hidden;
    color: #344767;
    font-size: 0.72rem;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.shanai-material .employee-attendance-time-row--holiday .employee-attendance-time-value {
    color: #e91e63;
    font-weight: 700;
}

body.shanai-material .employee-attendance-time-row--empty .employee-attendance-time-value {
    color: #adb5bd;
    font-weight: 500;
}

@media (max-width: 767.98px) {
    body.shanai-material .employee-attendance-calendar-toolbar {
        padding: 0.85rem 1rem;
        padding-top: 3.75rem;
        padding-bottom: 3.25rem;
    }

    body.shanai-material .employee-attendance-calendar-toolbar-legend {
        left: 1rem;
        right: 1rem;
        top: 0.75rem;
        transform: none;
        max-width: none;
    }

    body.shanai-material .employee-attendance-calendar-toolbar-actions {
        right: 1rem;
        top: auto;
        bottom: 0.75rem;
        transform: none;
    }

    body.shanai-material .employee-attendance-calendar-toolbar .btn {
        padding-right: 0.75rem;
        padding-left: 0.75rem;
    }

    body.shanai-material .employee-attendance-calendar-table {
        min-width: 52.5rem;
    }

    body.shanai-material .employee-attendance-legend-text {
        white-space: normal;
    }
}

body.shanai-material .assignment-start-position--disabled {
    opacity: 0.55;
    pointer-events: none;
}

body.shanai-material .assignment-rule-preview-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

body.shanai-material .assignment-rule-preview-field {
    flex: 1 1 auto;
    min-width: 0;
}

body.shanai-material .assignment-rule-preview-field .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .assignment-rule-preview-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

/* 勤務予定管理 */
body.shanai-material .work-schedules-hub-btn {
    height: 100%;
    white-space: normal;
    line-height: 1.35;
}

body.shanai-material .work-schedules-table .form-select,
body.shanai-material .work-schedules-table .form-control {
    min-height: 2rem;
    font-size: 0.8125rem;
}

body.shanai-material .work-schedules-day-select {
    max-width: 28rem;
}

body.shanai-material .work-schedules-pattern-preview-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

body.shanai-material .work-schedules-pattern-preview-row .work-schedules-day-select {
    flex: 1 1 auto;
    min-width: 0;
    max-width: none;
}

body.shanai-material .work-schedules-pattern-preview-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

body.shanai-material .work-schedules-day-select .shanai-outlined-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

body.shanai-material .work-schedules-day-select .shanai-outlined-input {
    font-size: 0.8125rem !important;
}

body.shanai-material .work-schedules-table tr[data-rule-day] > td {
    padding-top: 0.85rem;
    padding-bottom: 0.85rem;
}

/* Jobs list / edit */
/*
 * table-responsive の overflow-x:auto は overflow-y も auto 扱いになり、
 * 行内アイコン分のわずかな高さ超過で縦スクロールバーが出る。
 * 一覧は横方向のみスクロールさせる。
 */
body.shanai-material .jobs-table-wrap.table-responsive {
    overflow-x: auto;
    overflow-y: hidden;
}

body.shanai-material .jobs-table {
    table-layout: auto;
    width: 100%;
    min-width: 52rem;
}

body.shanai-material .jobs-col-date {
    white-space: nowrap;
}

body.shanai-material .jobs-col-docs {
    width: 2.5rem;
    padding-left: 0.35rem;
    padding-right: 0.75rem;
    vertical-align: middle !important;
    text-align: center;
}

/* 行高を文字行に合わせる（btn の min-height / 余白で縦に膨らませない） */
body.shanai-material .jobs-docs-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #7b809a;
    line-height: 0;
    cursor: pointer;
    vertical-align: middle;
}

body.shanai-material .jobs-docs-btn:hover,
body.shanai-material .jobs-docs-btn:focus-visible,
body.shanai-material .jobs-docs-btn[aria-expanded="true"] {
    color: #344767;
}

body.shanai-material .jobs-docs-btn .material-symbols-rounded {
    display: block;
    font-size: 1.125rem;
    line-height: 1;
    width: 1.125rem;
    height: 1.125rem;
    /* フォントのアセント寄りの見え方を補正して視線の中央に寄せる */
    transform: translateY(0.08em);
}

/* テーブル外の共有メニュー（position:fixed で1つだけ表示） */
body.shanai-material .jobs-docs-menu {
    position: fixed;
    z-index: 1080;
    min-width: 11.5rem;
    max-height: none;
    overflow: visible;
    padding: 0.5rem 0.45rem 0.55rem;
    margin: 0;
    border: 1px solid rgba(131, 146, 171, 0.35);
    border-radius: 0.75rem;
    background-color: #fff;
    box-shadow:
        0 0.75rem 1.75rem rgba(52, 71, 103, 0.16),
        0 0.25rem 0.5rem rgba(52, 71, 103, 0.08);
}

body.shanai-material .jobs-docs-menu[hidden] {
    display: none !important;
}

body.shanai-material .jobs-docs-menu .jobs-docs-menu__item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    width: 100%;
    margin: 0.1rem 0;
    padding: 0.7rem 0.85rem;
    border: 0;
    border-radius: 0.55rem;
    background: transparent;
    color: #344767;
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

body.shanai-material .jobs-docs-menu .jobs-docs-menu__item:hover,
body.shanai-material .jobs-docs-menu .jobs-docs-menu__item:focus {
    background-color: rgba(var(--shanai-accent-rgb), 0.08);
    color: #1f2937;
    box-shadow: inset 0 0 0 1px rgba(var(--shanai-accent-rgb), 0.06);
}

body.shanai-material .jobs-docs-menu .jobs-docs-menu__item:active {
    background-color: rgba(var(--shanai-accent-rgb), 0.14);
    color: #111827;
}

body.shanai-material .jobs-docs-menu .jobs-docs-menu__icon {
    flex: 0 0 auto;
    display: block;
    font-size: 1.15rem;
    line-height: 1;
    width: 1.15rem;
    height: 1.15rem;
    color: #7b809a;
}

body.shanai-material .jobs-docs-menu .jobs-docs-menu__item:hover .jobs-docs-menu__icon,
body.shanai-material .jobs-docs-menu .jobs-docs-menu__item:focus .jobs-docs-menu__icon {
    color: #344767;
}

body.shanai-material .jobs-members-table .form-control-sm {
    min-height: 2rem;
    font-size: 0.8125rem;
}

body.shanai-material .jobs-members-table td {
    vertical-align: middle;
}

body.shanai-material .job-members-list__items {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

body.shanai-material .job-members-list__item {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.35rem 0.55rem;
    border: 1px solid rgba(131, 146, 171, 0.35);
    border-radius: 0.5rem;
    background: rgba(248, 249, 252, 0.95);
}

body.shanai-material .job-members-list__name {
    line-height: 1.2;
}

body.shanai-material .job-members-list__item .job-member-remove {
    line-height: 1;
    min-width: auto;
}

body.shanai-material .job-member-picker-results {
    min-height: 8rem;
    max-height: min(50vh, 22rem);
    overflow: auto;
    border: 1px solid rgba(131, 146, 171, 0.2);
    border-radius: 0.5rem;
}

body.shanai-material .job-member-picker-table thead th {
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #8392ab;
}

body.shanai-material .job-member-picker-row:hover {
    background: rgba(94, 114, 228, 0.06);
}

body.shanai-material .job-member-picker-empty__icon .material-symbols-rounded {
    font-size: 2rem;
    opacity: 0.45;
}

/* Jobs edit: two-column main form */
body.shanai-material .jobs-edit-main-grid {
    align-items: flex-start;
}

/* 担当者名セレクトと「担当者を追加」を上下中央揃え（高さは標準 .btn に統一） */
body.shanai-material .jobs-employee-row {
    align-items: center;
}

body.shanai-material .jobs-employee-row__field .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .jobs-employee-row__action {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
}

body.shanai-material .jobs-employee-row__action .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

@media (max-width: 575.98px) {
    body.shanai-material .jobs-employee-row__action {
        width: 100%;
    }

    body.shanai-material .jobs-employee-row__action .btn {
        width: 100%;
    }
}

@media (min-width: 992px) {
    body.shanai-material .jobs-edit-main-grid__right {
        border-left: 1px solid rgba(131, 146, 171, 0.2);
        padding-left: 1.5rem;
    }
}

body.shanai-material .jobs-edit-dates-heading {
    letter-spacing: 0.06em;
}

body.shanai-material .jobs-edit-dates > [class*="col"] {
    min-width: 0;
}

body.shanai-material .jobs-edit-dates > [class*="col"] > .mb-3:last-child {
    margin-bottom: 0 !important;
}

body.shanai-material .jobs-edit-dates .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .jobs-date-field-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

body.shanai-material .jobs-date-field-row__field {
    flex: 1 1 auto;
    min-width: 0;
}

body.shanai-material .jobs-date-field-row__field .shanai-outlined-field {
    margin-bottom: 0;
}

body.shanai-material .jobs-date-today-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.375rem;
    min-width: 2.375rem;
    height: 2.375rem;
    padding: 0;
}

/* Jobs: customer picker modal */
body.shanai-material .job-customer-picker-results {
    min-height: 12rem;
    border: 1px solid rgba(131, 146, 171, 0.2);
    border-radius: 0.75rem;
    background: #f8fafc;
    overflow: hidden;
}

body.shanai-material .job-customer-picker-placeholder {
    padding: 2rem 1rem;
}

body.shanai-material .job-customer-picker-table-wrap {
    max-height: min(40vh, 22rem);
    overflow: auto;
    background: #fff;
}

body.shanai-material .job-customer-picker-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f8fafc;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #8392ab;
    border-bottom: 1px solid rgba(131, 146, 171, 0.2);
    white-space: nowrap;
}

body.shanai-material .job-customer-picker-row:hover {
    background: rgba(26, 35, 50, 0.04);
}

body.shanai-material .job-picker-check {
    padding-left: 0;
    min-height: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body.shanai-material .job-picker-check .form-check-input {
    float: none;
    margin: 0;
    position: relative;
    width: 1.1rem;
    height: 1.1rem;
    cursor: pointer;
}

body.shanai-material .job-picker-check .form-check-input:disabled {
    opacity: 0.55;
    cursor: default;
}

body.shanai-material .job-customer-picker-empty__icon .material-symbols-rounded {
    font-size: 2.25rem;
    color: #8392ab;
}

/* Jobs search dialog */
body.shanai-material .shanai-search-toolbar {
    min-width: 0;
    flex: 1 1 auto;
}

body.shanai-material .shanai-search-active {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    max-width: min(36rem, 100%);
    min-height: 2.1rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    background: rgba(26, 35, 50, 0.06);
    color: #344767;
    font-size: 0.78rem;
    line-height: 1.3;
}

body.shanai-material .shanai-search-active__icon {
    font-size: 1rem;
    color: #67748e;
    flex-shrink: 0;
}

body.shanai-material .shanai-search-active__text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.shanai-material .shanai-search-dialog .modal-content {
    border: 0;
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 1.25rem 2.5rem rgba(26, 35, 50, 0.18);
}

body.shanai-material .shanai-search-dialog__header {
    align-items: flex-start;
    border-bottom: 1px solid rgba(131, 146, 171, 0.18);
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    padding: 1.15rem 1.35rem;
}

body.shanai-material .shanai-search-dialog__title-block {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    min-width: 0;
}

body.shanai-material .shanai-search-dialog__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 0.75rem;
    background: #1a2332;
    color: #fff;
    flex-shrink: 0;
}

body.shanai-material .shanai-search-dialog__badge .material-symbols-rounded {
    font-size: 1.25rem;
}

body.shanai-material .shanai-search-dialog__lead {
    margin-top: 0.2rem;
    font-size: 0.78rem;
    color: #8392ab;
    line-height: 1.4;
}

body.shanai-material .shanai-search-dialog__body {
    padding: 1.15rem 1.35rem 0.5rem;
    background: #fff;
}

body.shanai-material .shanai-search-section + .shanai-search-section {
    margin-top: 1.25rem;
    padding-top: 1.15rem;
    border-top: 1px solid rgba(131, 146, 171, 0.16);
}

body.shanai-material .shanai-search-section__title {
    margin: 0 0 0.85rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #8392ab;
}

body.shanai-material .shanai-search-section__head {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-bottom: 0.85rem;
}

body.shanai-material .shanai-search-section__hint {
    font-size: 0.78rem;
    color: #8392ab;
    line-height: 1.45;
}

body.shanai-material .shanai-search-section__hint strong {
    color: #344767;
    font-weight: 700;
}

body.shanai-material .shanai-search-mode-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 0.75rem;
    font-size: 0.72rem;
    color: #8392ab;
}

body.shanai-material .shanai-search-mode-legend em {
    display: inline-block;
    margin-right: 0.3rem;
    padding: 0.08rem 0.4rem;
    border-radius: 0.35rem;
    background: rgba(26, 35, 50, 0.06);
    color: #344767;
    font-style: normal;
    font-weight: 700;
    font-size: 0.68rem;
}

body.shanai-material .shanai-search-fields {
    display: grid;
    gap: 0.9rem;
}

body.shanai-material .shanai-search-fields--range {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

body.shanai-material .jobs-search-date-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

body.shanai-material .jobs-search-date-row {
    display: grid;
    grid-template-columns: minmax(6.5rem, 9.5rem) minmax(12rem, 1fr) minmax(12rem, 1.2fr);
    gap: 0.55rem 0.75rem;
    align-items: center;
    padding: 0.7rem 0.85rem;
    border: 1px solid rgba(131, 146, 171, 0.2);
    border-radius: 0.75rem;
    background: #f8fafc;
    transition: border-color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

body.shanai-material .jobs-search-date-row.is-mode-empty {
    background: #fff8f0;
    border-color: rgba(251, 140, 0, 0.28);
}

body.shanai-material .jobs-search-date-row.is-mode-range {
    background: #fff;
    border-color: rgba(26, 35, 50, 0.22);
    box-shadow: 0 0.35rem 0.9rem rgba(26, 35, 50, 0.05);
}

body.shanai-material .jobs-search-date-name {
    font-size: 0.88rem;
    font-weight: 700;
    color: #67748e;
    line-height: 1.3;
}

body.shanai-material .jobs-search-date-row.is-mode-empty .jobs-search-date-name,
body.shanai-material .jobs-search-date-row.is-mode-range .jobs-search-date-name {
    color: #344767;
}

body.shanai-material .jobs-search-mode {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    padding: 0.18rem;
    border-radius: 0.6rem;
    background: rgba(131, 146, 171, 0.12);
    width: fit-content;
    max-width: 100%;
}

body.shanai-material .jobs-search-mode__opt {
    margin: 0;
    cursor: pointer;
}

body.shanai-material .jobs-search-mode__opt input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

body.shanai-material .jobs-search-mode__opt span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 1.85rem;
    padding: 0.2rem 0.55rem;
    border-radius: 0.45rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: #67748e;
    white-space: nowrap;
    transition: background-color 0.12s ease, color 0.12s ease, box-shadow 0.12s ease;
}

body.shanai-material .jobs-search-mode__opt input:checked + span {
    background: #1a2332;
    color: #fff;
    box-shadow: 0 0.2rem 0.45rem rgba(26, 35, 50, 0.18);
}

body.shanai-material .jobs-search-mode__opt input:focus-visible + span {
    outline: 2px solid rgba(26, 35, 50, 0.35);
    outline-offset: 1px;
}

body.shanai-material .jobs-search-date-range {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 0.4rem;
    align-items: center;
    min-width: 0;
}

body.shanai-material .jobs-search-date-row.is-mode-any .jobs-search-date-range,
body.shanai-material .jobs-search-date-row.is-mode-empty .jobs-search-date-range {
    opacity: 0.45;
}

body.shanai-material .jobs-search-date-range .form-control {
    min-height: 2.1rem;
    font-size: 0.84rem;
    border-radius: 0.55rem;
    border-color: rgba(131, 146, 171, 0.35);
    color: #344767;
    background-color: #fff;
}

body.shanai-material .jobs-search-date-range .form-control:disabled {
    opacity: 0.7;
    background-color: #eef1f6;
    cursor: not-allowed;
}

body.shanai-material .jobs-search-date-sep {
    color: #8392ab;
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1;
}

body.shanai-material .shanai-search-dialog__footer {
    border-top: 1px solid rgba(131, 146, 171, 0.18);
    background: #fbfcfe;
    padding: 0.9rem 1.35rem 1.05rem;
    gap: 0.5rem;
}

body.shanai-material .job-customer-picker-footer {
    justify-content: space-between;
    flex-wrap: wrap;
}

@media (max-width: 991.98px) {
    body.shanai-material .jobs-search-date-row {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }

    body.shanai-material .jobs-search-date-range {
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    }
}

/* 共通: 一覧ヘッダー並び替え */
body.shanai-material .shanai-sort-th {
    font-size: 0.7rem;
    font-weight: 700;
    color: #8392ab;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    vertical-align: middle;
}

body.shanai-material .shanai-sort-link {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: inherit;
    text-decoration: none !important;
    cursor: pointer;
    user-select: none;
}

body.shanai-material .shanai-sort-link:hover,
body.shanai-material .shanai-sort-link:focus {
    color: #344767;
    text-decoration: none !important;
}

body.shanai-material .shanai-sort-link--center {
    justify-content: center;
    width: 100%;
}

body.shanai-material .shanai-sort-label {
    line-height: 1.2;
}

body.shanai-material .shanai-sort-indicator {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.12rem;
    flex-shrink: 0;
    min-width: 0.7rem;
}

body.shanai-material .shanai-sort-caret {
    display: block;
    width: 0;
    height: 0;
    border-left: 0.28rem solid transparent;
    border-right: 0.28rem solid transparent;
    opacity: 0.28;
}

body.shanai-material .shanai-sort-caret--up {
    border-bottom: 0.32rem solid #8392ab;
}

body.shanai-material .shanai-sort-caret--down {
    border-top: 0.32rem solid #8392ab;
}

body.shanai-material .shanai-sort-link:hover .shanai-sort-caret {
    opacity: 0.55;
}

body.shanai-material th.is-sorted,
body.shanai-material .shanai-sort-link.is-sorted {
    color: #1a2332;
}

body.shanai-material th.is-sorted .shanai-sort-label {
    color: #1a2332;
    font-weight: 800;
}

body.shanai-material .shanai-sort-caret.is-active {
    opacity: 1;
}

body.shanai-material .shanai-sort-caret--up.is-active {
    border-bottom-color: #1a2332;
}

body.shanai-material .shanai-sort-caret--down.is-active {
    border-top-color: #1a2332;
}

body.shanai-material th.is-sorted .shanai-sort-caret:not(.is-active) {
    opacity: 0.18;
}

body.shanai-material .employee-schedules-table .employees-list-check .form-check-input {
    pointer-events: none;
}

body.shanai-material .employee-schedules-list-table .employees-list-check .form-check-input {
    pointer-events: none;
}

body.shanai-material .employee-schedule-job-link {
    display: inline-block;
    color: inherit;
    text-decoration: none;
    transition: color 0.15s ease;
}

body.shanai-material .employee-schedule-job-link:hover,
body.shanai-material .employee-schedule-job-link:focus {
    color: var(--shanai-accent-dark);
    text-decoration: none;
}

body.shanai-material .employee-schedules-table .employee-schedules-col-name {
    width: 18rem;
    min-width: 12rem;
}

body.shanai-material .employee-schedules-table .employee-schedules-col-gantt {
    min-width: 16rem;
}

body.shanai-material .employee-schedules-table tbody .employee-schedules-col-gantt {
    padding-left: 0;
    padding-right: 0;
}

body.shanai-material .employee-schedules-table thead .employee-schedules-col-gantt {
    padding-left: 0.4rem;
    padding-right: 0.4rem;
}

body.shanai-material .employee-schedules-table .employee-schedules-col-complete {
    width: 4rem;
}

body.shanai-material .employee-schedule-gantt-head-track {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 1rem;
    padding: 0;
    font-size: 0.625rem;
    font-weight: 600;
    line-height: 1;
    color: rgba(0, 0, 0, 0.45);
}

body.shanai-material .employee-schedule-gantt-head-date {
    flex: 0 0 auto;
}

body.shanai-material .employee-schedules-table-wrap {
    position: relative;
}

body.shanai-material .employee-schedule-gantt-today-line {
    position: absolute;
    width: 2px;
    background-color: #ffeb3b;
    pointer-events: none;
    z-index: 5;
    transform: translateX(-50%);
}

body.shanai-material .employee-schedule-gantt {
    position: relative;
    --employee-schedule-gantt-track: 1.75rem;
    --employee-schedule-gantt-bg: #fff;
    height: var(--employee-schedule-gantt-track);
    min-width: 12rem;
    background-color: var(--employee-schedule-gantt-bg);
    background-image:
        repeating-linear-gradient(
            to right,
            rgba(0, 0, 0, 0.04) 0,
            rgba(0, 0, 0, 0.04) 1px,
            transparent 1px,
            transparent calc(100% / 12)
        );
    border-radius: 0;
    overflow: hidden;
}

body.shanai-material .employee-schedule-gantt--has-detail {
    height: calc(var(--employee-schedule-gantt-track) * (1 + var(--employee-schedule-detail-count, 1)));
}

body.shanai-material .employee-schedule-gantt__bar {
    position: absolute;
    box-sizing: border-box;
    min-width: 2.5rem;
    border-radius: 999px;
}

body.shanai-material .employee-schedule-gantt__bar--job {
    top: 0.2rem;
    bottom: 0.2rem;
    background-color: var(--shanai-accent, #262626);
    border: 1px solid transparent;
}

body.shanai-material .employee-schedule-gantt__bar--job[title] {
    cursor: help;
}

body.shanai-material .employee-schedule-gantt--has-detail .employee-schedule-gantt__bar--job {
    top: 0.2rem;
    bottom: auto;
    height: calc(var(--employee-schedule-gantt-track) - 0.4rem);
}

body.shanai-material .employee-schedule-gantt__bar--job.is-complete,
body.shanai-material .employee-schedule-gantt__bar--detail.is-complete {
    opacity: 0.5;
}

body.shanai-material .employee-schedule-gantt__bar--detail {
    height: calc(var(--employee-schedule-gantt-track) - 0.4rem);
    background-color: var(--employee-schedule-detail-color, #64B5F6);
}

body.shanai-material .employee-schedule-gantt__bar--detail-interactive {
    cursor: pointer;
    transition: filter 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

body.shanai-material .employee-schedule-gantt__bar--detail-interactive:hover,
body.shanai-material .employee-schedule-gantt__bar--detail-interactive:focus-visible {
    filter: brightness(1.1);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--employee-schedule-detail-color, #64B5F6) 45%, transparent);
}

body.shanai-material .employee-schedule-gantt.is-complete .employee-schedule-gantt__bar--detail-interactive:hover,
body.shanai-material .employee-schedule-gantt.is-complete .employee-schedule-gantt__bar--detail-interactive:focus-visible {
    opacity: 0.72;
}

body.shanai-material .employee-schedule-gantt__bar--labeled-center {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.35rem;
    overflow: hidden;
}

body.shanai-material .employee-schedule-gantt__date-in-bar {
    position: static;
    z-index: 1;
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.shanai-material .employee-schedule-gantt__bar.extends-before {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

body.shanai-material .employee-schedule-gantt__bar.extends-after {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

body.shanai-material .employee-schedule-gantt__date {
    position: absolute;
    z-index: 1;
    color: #fff;
    font-size: 0.625rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    pointer-events: none;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
}

body.shanai-material .employee-schedule-gantt__date--job {
    top: 50%;
}

body.shanai-material .employee-schedule-gantt--has-detail .employee-schedule-gantt__date--job {
    top: calc(var(--employee-schedule-gantt-track) / 2);
}

body.shanai-material .employee-schedule-gantt.is-complete .employee-schedule-gantt__date--job {
    opacity: 1;
}

body.shanai-material .employee-schedule-gantt__date--start.employee-schedule-gantt__date--job {
    transform: translate(0.35rem, -50%);
}

body.shanai-material .employee-schedule-gantt__date--end.employee-schedule-gantt__date--job {
    transform: translate(calc(-100% - 0.35rem), -50%);
}

body.shanai-material .employee-schedule-gantt__date--center.employee-schedule-gantt__date--job {
    transform: translate(-50%, -50%);
}

body.shanai-material .employee-schedule-gantt__date--detail {
    top: calc(var(--employee-schedule-gantt-track) * 1.5);
}

body.shanai-material .employee-schedule-gantt__date--job.is-complete,
body.shanai-material .employee-schedule-gantt__date--detail.is-complete {
    opacity: 0.5;
}

body.shanai-material .employee-schedule-gantt.is-complete .employee-schedule-gantt__date--detail {
    opacity: 1;
}

body.shanai-material .employee-schedule-gantt__date--start.employee-schedule-gantt__date--detail {
    transform: translate(0.35rem, -50%);
}

body.shanai-material .employee-schedule-gantt__date--end.employee-schedule-gantt__date--detail {
    transform: translate(calc(-100% - 0.35rem), -50%);
}

body.shanai-material .employee-schedule-gantt__date--center.employee-schedule-gantt__date--detail {
    transform: translate(-50%, -50%);
}

body.shanai-material .employee-schedule-gantt__date--detail-interactive {
    pointer-events: auto;
    cursor: pointer;
    transition: opacity 0.15s ease, text-shadow 0.15s ease;
}

body.shanai-material .employee-schedule-gantt__date--detail-interactive:hover,
body.shanai-material .employee-schedule-gantt__date--detail-interactive:focus-visible {
    opacity: 1;
    text-shadow: 0 0 6px rgba(0, 0, 0, 0.35);
}

body.shanai-material .employee-schedule-gantt.is-complete .employee-schedule-gantt__date--detail-interactive:hover,
body.shanai-material .employee-schedule-gantt.is-complete .employee-schedule-gantt__date--detail-interactive:focus-visible {
    opacity: 0.85;
}

body.shanai-material .schedule-views-table .schedule-views-col-name {
    width: 14rem;
    min-width: 10rem;
}

body.shanai-material .schedule-views-table .schedule-views-col-member {
    width: 8rem;
    min-width: 6rem;
}