/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */
a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}
/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.btn-advance {
    color: #fff;
    background-color: #145ffd;
    border-color: #145ffd;
}

    .btn-advance:hover {
        color: #fff;
        background-color: #6194FF;
        border-color: #6194FF;
    }

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

@media (max-width:310px) {
    .nav-item {
        font-size: 6px;
    }
}
/* 更新情報テーブル専用 */
.update-info-table.dataTable th,
.update-info-table.dataTable td {
    white-space: nowrap;
    text-align: left;
}
/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

sortlist {
    max-height: 300px !important;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}
/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    /*margin-bottom: 60px;*/
    margin: 0 auto 40px auto;
    /*width: 1920px;*/
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically center the text there */
}
/*newDevice*/
div.dataTables_scrollHeadInner {
    width: 100% !important;
}

#Type {
    width: 20% !important;
}

#SendDate {
    width: 40% !important;
}

#Title {
    width: 40% !important;
}

#btnDeviceDelete {
    background-color: red !important;
    color: white
}
/*デバイス一覧*/
#device_list td:nth-child(3),
#device_list th#MedicalFacilitiesName {
    text-align: left !important; /* 左寄せ */
    white-space: normal !important; /* nowrap解除 */
    word-break: break-word; /* 長文を折り返す */
}

#device_list td:nth-child(4),
#device_list th#PatientId {
    text-align: left !important; /* 左寄せ */
}
/*お薬手帳一覧*/
#medication_record_list td:nth-child(1),
#medication_record_list th#caution {
    text-align: center !important; /* 左寄せ */
}

#medication_record_list td:nth-child(3),
#medication_record_list th#parientName {
    text-align: left !important; /* 左寄せ */
}

#medication_record_list td:nth-child(4),
#medication_record_list th#medicalFacilitiesName {
    text-align: left !important; /* 左寄せ */
    white-space: normal !important; /* nowrap解除 */
    word-break: break-word; /* 長文を折り返す */
}

#medication_record_list td:nth-child(5),
#medication_record_list th#parientName {
    text-align: left !important; /* 左寄せ */
}
/*アカウント管理*/
#user_list td:nth-child(3),
#user_list th#medicineName {
    text-align: left !important; /* 左寄せ */
    white-space: normal !important; /* nowrap解除 */
    word-break: break-word; /* 長文を折り返す */
}

#user_list td:nth-child(4),
#user_list th#medicineName {
    text-align: left !important; /* 左寄せ */
}

.table td {
    /*改行してに表示*/
    word-wrap: break-word;
    /*改行しない*/
    /*white-space: nowrap;*/
    /*はみ出す部分表示しない*/
    /*overflow: hidden;*/
}

#btnConsentWrapper {
    margin: 0px;
}

#btnConsent {
    padding: 7px 25px;
    font-size: 1.5rem;
}

div.modal-footer:has(button#btnConsent) {
    border-top: none;
}

img.system_icon {
    width: 258px;
    height: 57px;
}

.modal-footer > :not(:last-child) {
    margin-right: .75rem;
}

.modal-footer > :not(:first-child) {
    margin-left: .75rem;
}

.search-form {
    background-color: #e4ecfe;
    border: #e4ecfe;
    min-height: 115px;
}

.overview-table {
    border-right: 1px solid #000000;
}

    .overview-table > thead > tr {
        background-color: #f4f5f7;
    }

        .overview-table > thead > tr > th {
            border-top: 1px solid #000000;
            border-left: 1px solid #000000;
            border-bottom: 1px solid #000000;
        }

div#medication_record_calendar_wrapper thead > tr > th:last-child {
    border-right: 1px solid #000000;
}

div.dt-scroll-body:not(:has(table.table-bottom-borderless)) {
    border-bottom: 1px solid #000000 !important;
}

div.dt-container div.dt-scroll-body:has(table.table-bottom-borderless) {
    border-bottom: none;
}

.overview-table > tbody > tr > td {
    border-left: 1px solid #000000;
    border-bottom: 1px solid #000000;
}

.test-view {
    border-top: 1px solid #000000;
    border-left: 1px solid #000000;
    border-right: 1px solid #000000;
    border-bottom: 1px solid #000000;
}
/*
    Datatablesにおいて検索結果データが数値や日付と見なされたとき、ヘッダのソート記号が左に表示されてしまうので右に揃える
*/
table.dataTable th.dt-type-numeric div.dt-column-header,
table.dataTable th.dt-type-date div.dt-column-header {
    flex-direction: row;
}

table#medication_record_list > tbody > tr > td:has(img) {
    padding: .25rem 0rem .25rem 0rem
}

img.caution {
    object-fit: contain;
    width: 45px;
}

div > main > div.container-fluid:has(#patient_list) {
    width: 70%;
}
/*
    リンクをボタンのような見た目にする
*/
.link-like-btn {
    color: #fff;
    background-color: #145ffd;
    border-color: #145ffd;
    border: 1px solid;
    border-radius: 0.25rem;
    font-weight: 400;
    text-decoration: none;
    font-size: 1rem;
    line-height: 1.5;
    padding: 0.43rem 0.83rem;
    display: inline-block;
    margin-right: 9px;
}

    .link-like-btn:hover {
        color: #fff;
        background-color: #6194FF;
        border-color: #6194FF;
        text-decoration: none;
    }

    .link-like-btn.link-secondary {
        background-color: #6c757d;
        border-color: #6c757d;
    }

        .link-like-btn.link-secondary:hover {
            background-color: #5a6268;
            border-color: #5a6268;
        }

.btn-advance-distinct {
    color: #fff;
    background-color: #0a8a45;
    border-color: #0a8a45;
}

    .btn-advance-distinct:hover {
        color: #fff;
        background-color: #0AB945;
        border-color: #0AB945;
    }

span.medicine-suffix {
    padding-left: 0.4rem;
}

body:has(.ingested_list) {
    margin-bottom: 15px;
}

.ingested-amount-result {
    margin-left: 30%
}

.padding-set-end {
    padding-right: 15px;
}

input[name="deleteMailList"] {
    inline-size: 18px;
    block-size: 18px;
}

.word-break-all {
    word-break: keep-all;
    overflow-wrap: anywhere;
}

#consentDlg div.modal-body {
    width: 85%;
    height: 100%;
    overflow-y: auto;
    border: solid #CCCCCC thin;
    margin: 0 auto;
}

.indent-second {
    padding-left: 2rem;
}

input[type=checkbox] {
    accent-color: #145ffd;
}

div.update-info-list {
    height: auto;
    width: auto;
}

div.dt-scroll-body:not(:has(table.table-bottom-borderless)) {
    max-height: 50vh !important;
}

div.dt-container div.dt-scroll-body:has(table.table-bottom-borderless) {
    max-height: 65vh !important;
}
/* PCレイアウトのとき */
@media (min-width: 1200px) {
    #loginForm {
        height: 60vh;
    }

    div.modal-body label {
        text-align: right;
    }

    input[type=checkbox] {
        margin-top: 3px;
    }

    #mailListAdd div.modal-body {
        padding-left: 3rem;
    }

    .mail-list-label {
        justify-content: flex-end;
    }

        .mail-list-label label {
            padding-left: 1rem;
        }

    #deleteMail10 + label {
        padding-left: 0.5rem;
    }
}
/* PCより画面幅が小さいとき*/
@media (max-width: 1199px) {
    #loginForm {
        margin-top: 15vh;
    }

    .navbar .system_icon {
        width: 200px;
        object-fit: contain;
    }

    div.modal-body label {
        text-align: left;
    }
    /* 通知先追加 */
    #mailListAdd {
        padding-left: 0px !important;
    }

        #mailListAdd div.modal-body {
            width: 95%;
            height: 75vh;
            overflow-y: auto;
            margin: 0 auto;
        }

    input[type=checkbox] {
        margin-top: 2px;
    }

    .mail-list-label {
        justify-content: flex-start;
    }

        .mail-list-label label {
            padding-left: 0.5rem;
        }
}
/*
    横幅がスマホ以上PC未満のデバイスで横向きに持ったとき
*/
@media (orientation: landscape) and (max-height: 834px) {
    .mail-list-label {
        justify-content: flex-end;
    }

        .mail-list-label label {
            padding-left: 1rem;
        }

    #deleteMail10 + label {
        padding-left: 0.5rem;
    }
}

@media (min-width: 576px) {
    #pcMenu {
        display: flex;
    }

    #spMenu {
        display: none;
    }
}
/*
    スマートフォン対応
*/
@media (max-width: 575px) {
    /* ログイン画面 */
    #loginForm {
        margin-top: 10rem;
    }

    #frmLogin {
        padding-left: 0px;
        padding-right: 0px;
    }

        #frmLogin div:has(input) {
            padding-left: 0px;
        }
    /* 利用規約画面 */
    #btnConsent {
        padding: 5px 20px;
    }
    /* モーダル共通 */
    .modal-lg, .modal-xl {
        max-width: 360px;
        margin: 1.75rem auto;
    }

    .modal-dialog-centered {
        min-height: calc(100% - 3.5rem);
    }

    .modal-dialog-scrollable {
        max-height: calc(100% - 3.5rem);
    }

    .modal-dialog-centered::before {
        height: unset;
    }
    /* メインメニューフレーム画面 */
    body {
        margin: 0 auto 10px auto;
    }

    a.navbar-brand {
        text-align: start;
    }

    .navbar .system_icon {
       /* width: fit-content;*/
        width: 130px;
        /* height: 36px;*/
        height: fit-content;
        object-fit: contain;
    }

    #pcMenu {
        display: none;
    }

    #spMenu {
        display: flex;
    }

    #spUserMenu {
        position: absolute;
        left: -18rem;
    }

        #spUserMenu > a.dropdown-item {
            width: 22rem;
        }

    #navbarDropdownSp > span {
        font-size: 2rem;
        padding: 0px;
    }
    /* 通知先追加 */
    .mail-list-label label {
        padding-left: 0.5rem;
    }
    /* ヘッダーの文字サイズを縮小 */
    .responsive-header {
        font-size: 20px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* ラベル部分を左端に寄せる */
    .responsive-labels .d-flex {
        justify-content: flex-start !important;
    }
    /* ラベルと値の間隔を少しだけ確保 */
    .responsive-labels span.me-2 {
        margin-right: 0.4rem;
    }
    /* 各行を縦並び */
    #register .modal-body .row.mb-3 {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
        /* ラベルを上に表示、左寄せ */
        #register .modal-body .row.mb-3 label {
            width: 100% !important;
            text-align: left !important;
            margin-bottom: 0.25rem;
            padding: 0 !important;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        /* 親.col-7 の幅を固定感覚で維持 */
        #register .modal-body .row.mb-3 .col-7 {
            width: 100% !important;
            max-width: 400px !important;
            padding: 0.25rem !important;
            box-sizing: border-box;
        }
        #register .modal-body .row.mb-3 .col-5 {
            width: 100% !important;
            max-width: 400px !important;
            padding: 0.25rem !important;
            box-sizing: border-box;
        }
        /* input/select を親に合わせる */
        #register .modal-body .row.mb-3 input.form-control,
        #register .modal-body .row.mb-3 select.form-control {
            width: 100% !important;
            max-width: 100% !important;
            box-sizing: border-box;
            display: block !important; /* inline-block や inline の影響を排除 */
            min-width: 0 !important; /* Bootstrap が設定する min-width を解除 */
            padding-left: 0.5rem !important;
            padding-right: 0.5rem !important;
        }
            /* option の幅も親に収める */
            #register .modal-body .row.mb-3 select.form-control option {
                white-space: nowrap; /* 改行せず */
                overflow: hidden;
                text-overflow: ellipsis;
            }

    .row > .col-2 > h1 {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 1.5rem; /* 必要に応じて調整 */
    }
}
.row > .col-10> h1 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size:2.5rem; /* 必要に応じて調整 */
}
/*
    スマホを横向きに持ったとき
*/
@media (orientation: landscape) and (max-height: 428px) {
    body {
        margin: 0 auto 10px auto;
    }

    .navbar .system_icon {
        width: fit-content;
        height: 36px;
        object-fit: contain;
    }

    div.update-info-list {
        height: auto;
        width: auto;
    }

    div.dt-scroll-body:not(:has(table.table-bottom-borderless)) {
        max-height: 55vh !important;
    }

    div.dt-container div.dt-scroll-body:has(table.table-bottom-borderless) {
        max-height: 50vh !important;
    }

    div.modal-body label {
        text-align: left;
    }
    /* 通知先追加 */
    #mailListAdd div.modal-body {
        height: 55vh;
    }

    .mail-list-label {
        justify-content: flex-start;
    }

        .mail-list-label label {
            padding-left: 0.5rem;
        }
}
#medication_record_calendar {
 
    border-bottom: 1px solid #000000;
}

}
/*患者お薬手帳スマホ対応*/
/*
        患者向けお薬手帳画面のハイライト
    */
table#medication_record_calendar > tbody > tr:has(span.highlight-now),
table#medication_record_calendar > tbody > tr > td:has(span.highlight-now),
table#medication_record_calendar > tbody > tr:has(span.highlight-now) > td.dtfc-fixed-start {
    background-color: #9BDAFF;
}

#medication_record_calendar tbody tr.highlight-now td {
    background-color: #9BDAFF; /* 薄い黄色で行全体をハイライト */
}
/* 日付・時間帯列を狭く */
table.dataTable td.text-center:first-child,
table.dataTable td.text-center:nth-child(2) {
    width: 80px; /* 調整可能 */
}
/* 薬名列は均等に */
table.dataTable th,
table.dataTable td {
    white-space: nowrap;
    text-align: center;
}
/* 横スクロール */
div.dataTables_wrapper {
    overflow-x: auto;
}
/* 日付・時間帯列は最大幅指定 
    #medication_record_calendar th:first-child,
    #medication_record_calendar td:first-child {
        max-width:20px;
        min-width:20px;
      
    }
    #medication_record_calendar th:nth-child(2),
    #medication_record_calendar td:nth-child(2) {
        max-width: 20px;
        min-width: 20px;
        white-space: nowrap;
    }
    /薬名列は自動で均等に 
    #medication_record_calendar th:nth-child(n+3),
    #medication_record_calendar td:nth-child(n+3) {
       max-width: 40px;
       min-width: 100px;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
    }*/
/* ========== スマホ対応 ========== */
@media (max-width: 767px) {
    .dataTables_wrapper {
        overflow-x: auto;
    }

    #medicine-table {
        width: 75%;
        margin-left: 40px;
        font-size: 15px;
    }

    #medication_record_calendar {
        min-width: 100%; /* テーブル幅確保 */
        font-size: 15px;
    }

        #medication_record_calendar th:first-child,
        #medication_record_calendar td:first-child {
            max-width: 100px;
            min-width: 80px;
            white-space: nowrap;
        }

        #medication_record_calendar th:nth-child(2),
        #medication_record_calendar td:nth-child(2) {
            max-width: 100px;
            min-width: 80px;
            white-space: nowrap;
        }

        /* 薬名列は自動で均等に */
        #medication_record_calendar th:nth-child(n+3),
        #medication_record_calendar td:nth-child(n+3) {
            max-width: 200px;
            min-width: 100px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
}
/* ========== タブレット対応 ========== */
@media (min-width: 768px) and (max-width: 911px) {
    #medication_record_calendar th, #medication_record_calendar td {
        font-size: 15px;
        padding: 8px;
    }

    #medicine-table {
        width: 80%;
        margin-left: 80px;
        font-size: 15px;
    }

    .modal-dialog.modal-xl {
        max-width: 85%;
    }
}

@media (min-width: 912px) and (max-width: 1199px) {
    #medication_record_calendar th,
    #medication_record_calendar td {
        font-size: 15px;
        padding: 6px;
    }

    #medicine-table {
        width: 60%;
        margin-left: 190px;
        font-size: 15px;
    }
}

@media (min-width: 1200px) and (max-width: 1280px) {
    #medication_record_calendar th,
    #medication_record_calendar td {
        font-size: 15px;
        padding: 8px;
    }

    #medicine-table {
        width: 60%;
        margin-left: 250px;
        font-size: 13px;
    }
}
/* ========== PC対応 ========== */
@media (min-width: 1281px) and (max-width: 1439px) {
    #medication_record_calendar th,
    #medication_record_calendar td {
        font-size: 22px;
        padding: 8px;
    }

    #medicine-table {
        width: 59%;
        margin-left: 260px;
        font-size: 20px;
    }

    #medication_record_calendar th:first-child,
    #medication_record_calendar td:first-child {
        max-width: 20px;
        min-width: 20px;
    }

    #medication_record_calendar th:nth-child(2),
    #medication_record_calendar td:nth-child(2) {
        max-width: 20px;
        min-width: 20px;
        white-space: nowrap;
    }
    /* 薬名列は自動で均等に */
    #medication_record_calendar th:nth-child(n+3),
    #medication_record_calendar td:nth-child(n+3) {
        max-width: 40px;
        min-width: 100px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

@media (min-width: 1440px) and (max-width: 1900px) {
    #medication_record_calendar th,
    #medication_record_calendar td {
        font-size: 20px;
        padding: 8px;
    }

    #medicine-table {
        width: 70%;
        margin-left: 230px;
        font-size: 20px;
    }
}

@media (min-width: 1901px) {
    #medication_record_calendar th,
    #medication_record_calendar td {
        font-size: 20px;
        padding: 8px;
    }

    #medicine-table {
        width: 60%;
        margin-left: 380px;
        font-size: 20px;
    }

    #medication_record_calendar th:first-child,
    #medication_record_calendar td:first-child {
        max-width: 20px;
        min-width: 20px;
    }

    #medication_record_calendar th:nth-child(2),
    #medication_record_calendar td:nth-child(2) {
        max-width: 20px;
        min-width: 20px;
        white-space: nowrap;
    }
    /* 薬名列は自動で均等に */
    #medication_record_calendar th:nth-child(n+3),
    #medication_record_calendar td:nth-child(n+3) {
        max-width: 40px;
        min-width: 100px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

td.text-wrap {
    white-space: normal !important;

}
th.text-wrap {
    white-space: nowrap !important;
}

@media (min-width:340px) and (max-width:768px){
    #ingested_list th,
    #ingested_list td{
        min-width:10px;
        max-width:30px
    }
}

.patientName {
    margin-left: 560px;
    font-size:20px;
}

.hidden{
    display:none;
}


/* ✅ iOS Safari 限定：長い薬名を省略表示（貫通防止） */
@supports (-webkit-touch-callout: none) {
    table.dataTable th a {
        display: inline-block;
        width: 150px; /* ← max-widthではなくwidthを指定 */
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        vertical-align: middle;
    }
    /* Safari のスクロール領域修正もここに含めてOK */
    .dataTables_scrollBody {
        -webkit-overflow-scrolling: touch;
        overflow-x: scroll !important;
    }
}