﻿.bg-img-map {
    background: inherit;
}

.bg-img-title {
    background: inherit;
}
/* DataTable 空表格訊息置中 */
.dataTables_empty,
table.dataTable td.dataTables_empty {
    text-align: center !important;
}

table.dataTable tbody td[colspan] {
    text-align: center !important;
}

/* 調整datepicker 視窗 */
#ui-datepicker-div {
    z-index: 1000 !important;
}

/* datepicker-month */
.month-only > .ui-datepicker-calendar {
    display: none;
}


#HL_Portal_Top {
    color: rgb(205, 205, 205);
}

    #HL_Portal_Top:hover {
        color: rgb(255, 255, 255);
    }

i[class^="fontawe"] {
    padding: 0 10px;
    width: 37px;
    font-size: 20px;
    color: #ff7373;
}

.btn.fas {
    line-height: inherit;
    font-weight: normal;
    padding: 6px 8px;
    font-weight: 600;
}

    .btn.fas::before {
        padding-right: 3px;
    }

.table .btn {
    margin: 3px 0;
}

@media (min-width: 992px) {
    .bg-img-map {
        /*background: url(../images/ORAM_bk.png) fixed no-repeat;*/
        background-position: center 180px;
        min-height: 768px;
        /*position:static;*/
        /*border-bottom: 1px solid #e9e9e9;*/
        /*background-color: rgba(0,0,0,0.5);*/
        /*transition: background 6s;*/
        /*opacity: 0.5;*/
    }

    .bg-img-title {
        background: url(../images/index_05.jpg) fixed no-repeat;
        background-position: center 50px;
        background-size: 82% 120px;
    }
}

@media (max-width: 767px) {
    .marg_bottom {
        margin-bottom: 5px;
    }
}

.textsite {
    text-align: right;
}

@media (max-width:991px) {
    .marbot {
        margin-bottom: 5px;
    }

    .textsite {
        text-align: left;
    }
}

@media (max-width: 480px) {
}
/*#HyperLink1 {
        width: 76%;
        white-space: nowrap;
        text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
        overflow: hidden;
    }*/

@media (min-width: 768px) {
    .padlabel {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (min-width: 991px) {
    .pdlb {
        padding-left: 0;
        padding-right: 0;
    }
}


.chosen-container-multi .chosen-choices {
    padding: 1px 8px;
    font-size: 16px;
    font-family: "微軟正黑體","Microsoft JhengHei","Helvetica Neue",Helvetica,Arial,sans-serif;
}

.chosen-container-single .chosen-single input[type=text] {
    max-width: 90%;
    max-width: calc(100% - 20px);
}

.top-func {
    display: inline-block;
    vertical-align: middle;
    height: 100%;
    padding-left: 25px;
    position: relative;
    padding: 0 0 0 10px;
    margin-right: 10px;
    float: left;
    align-self: center;
}

    .top-func::before {
        content: "";
        height: 30px;
        border-right: 1px solid #e9e9e9;
        display: inline-block;
        transform: scaleX(0.5);
        position: absolute;
        top: 16px;
        left: 0px;
    }

    .top-func::after {
        content: "";
        height: 100%;
        display: inline-block;
        width: 0px;
        vertical-align: middle;
    }

    .top-func > div {
        /*display: inline-block;*/
        /*vertical-align: middle;
        line-height: 115px;*/
    }

.man-sign-group {
    line-height: .8em;
    min-width: 150px;
    /*max-width: 500px;*/
    margin: 0 2px;
    display: inline-block;
}

    .man-sign-group > div {
        display: inline-block;
    }

        .man-sign-group > div > .input-group {
            width: 150px;
        }

            .man-sign-group > div > .input-group .input-group-btn .btn {
                background: #28b1ce;
                border-color: #2ea4bc;
            }

                .man-sign-group > div > .input-group .input-group-btn .btn:hover {
                    background: #2ea4bc;
                }

            .man-sign-group > div > .input-group .input-group-addon {
                background-color: #fff;
                padding: 0;
            }

                .man-sign-group > div > .input-group .input-group-addon span {
                    width: 120px;
                    display: inline-block;
                    font-size: .95em;
                }

    .man-sign-group .form-inline .input-group select {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }


.top-func .info-group {
    margin: 0 2px;
    /*height: 50px;*/
    /*position: absolute;*/
    display: inline-block;
    vertical-align: middle;
}

    .top-func .info-group .cur-proj {
        max-width: 650px;
        overflow: hidden;
        max-height: 50px;
        white-space: nowrap;
        text-overflow: ellipsis;
        color: #fff38a;
    }

    .top-func .info-group .user-info {
        max-width: 650px;
        overflow: hidden;
        max-height: 50px;
        white-space: nowrap;
        text-overflow: ellipsis;
        color: #fff38a;
    }

/*.top-func .lbtn-group {
        max-width: 400px;
        margin: 0 2px;
    }*/

.top-func .light-group {
    display: inline-block;
    vertical-align: top;
    color: #fff;
    line-height: 1.1em;
    max-width: 170px;
}

    .top-func .light-group > div {
        display: inline-block;
        margin-right: 3px;
    }

@media(min-width:1700px) {
    .top-func .info-group .cur-proj, .top-func .info-group .user-info {
        max-width: 470px;
    }

    .man-sign-group, .top-func .info-group, .top-func .light-group {
        vertical-align: middle;
    }

    .top-func::before {
        top: 15px;
        height: 35px;
    }

    .top-func > br {
        display: none;
    }
}

@media (max-width: 1599px) {
    .top-func .info-group .cur-proj {
        max-width: 500px;
    }

    .top-func .info-group .user-info {
        max-width: 500px;
    }
}

@media (max-width: 1499px) {
    .top-func .info-group .cur-proj {
        max-width: 450px;
    }

    .top-func .info-group .user-info {
        max-width: 450px;
    }
}

@media (max-width: 1399px) {
    .top-func .info-group .cur-proj {
        max-width: 350px;
    }

    .top-func .info-group .user-info {
        max-width: 350px;
    }
}

@media (max-width: 1299px) {
    .top-func .info-group .cur-proj {
        max-width: 320px;
    }

    .top-func .info-group .user-info {
        max-width: 320px;
    }
}

@media (max-width: 1199px) {
    /*.top-func {
        left: 120px;
    }*/

    .top-func .info-group .cur-proj {
        max-width: 320px;
    }

    .top-func .info-group .user-info {
        max-width: 320px;
    }
}

@media (max-width: 991px) {
    /*.top-func .lbtn-group .btn {
        padding: 1px 5px;
        font-size: 14px;
        line-height: 1.5;
        border-radius: 3px;
    }*/

    .top-func .info-group .cur-proj {
        max-width: 320px;
    }

    .top-func .info-group .user-info {
        max-width: 320px;
    }

    .man-sign-group > div > .input-group .input-group-addon span {
        width: 120px;
        font-size: .95em;
    }

    .man-sign-group > div > .input-group .input-group-btn .btn {
        padding: 6px 6px;
    }

    .man-sign-group .form-inline .input-group {
        max-width: 280px;
    }
}

@media (max-width: 767px) {
    .top-func {
        display: flex;
        flex-direction: column;
        float: none;
    }

        .top-func::before {
            content: none;
        }

        .top-func::after {
            position: absolute;
        }

        .top-func .info-group {
            /*max-width: calc(100% - 90px);*/
            margin: auto 0;
        }

            .top-func .info-group .cur-proj {
                max-width: 100%;
                margin-right: 3px;
            }

            .top-func .info-group .user-info {
                max-width: 100%;
                margin-right: 3px;
            }

        .top-func .light-group {
            max-width: none;
        }
}

.right-tool-group {
    height: 60px;
    display: flex;
    justify-content: flex-end;
}

    .right-tool-group li {
        height: 100%;
    }

    .right-tool-group > a {
        height: 100%;
        align-self: stretch;
        text-align: center;
        padding: 2px 5px;
        display: flex;
        flex-direction: column;
    }

        .right-tool-group > a > .text {
            margin: 6px auto;
            display: inline-block;
        }

        .right-tool-group > a::before {
            display: inline-block;
            font-size: 3rem;
            text-align: center;
            padding: 0 20px;
        }

        .right-tool-group > a:hover, .right-tool-group > a:hover::before, .right-tool-group > a:active, .right-tool-group > a:active::before, .right-tool-group > a:focus, .right-tool-group > a:focus::before {
            text-decoration: none;
        }

        .right-tool-group > a .badge {
            display: inline-block;
            background: #e9e9e9;
            color: #707070;
            align-self: center;
        }


@media(min-width:1700px) {
    .right-tool-group {
        height: 60px;
    }

        .right-tool-group > a::before {
            font-size: 1.8rem;
        }
}

@media(min-width:768px) {
    .right-tool-group-wrapper {
        display: grid;
        overflow-x: auto;
    }

        .right-tool-group-wrapper::-webkit-scrollbar-track {
            background-color: #CCC;
        }

        .right-tool-group-wrapper::-webkit-scrollbar {
            height: 8px;
        }

        .right-tool-group-wrapper::-webkit-scrollbar-thumb {
            border-radius: 10px;
            -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
            background-color: #888;
        }

    .right-tool-group > a {
        min-width: 75px;
    }
}

@media(max-width:767px) {
    .man-sign-group {
        margin: 0 -10px;
        padding: 0px 10px;
    }

        .man-sign-group .form-inline .input-group {
            margin-right: 5px;
            max-width: none;
        }

            .man-sign-group .form-inline .input-group select {
                padding: 2px;
                height: 28px;
            }

            .man-sign-group .form-inline .input-group .input-group-btn .btn {
                padding: 2px 5px;
                height: 28px;
            }

    .right-tool-group {
        height: 80px;
        flex-flow: wrap;
    }

        .right-tool-group > a {
            font-size: .9em;
            padding: 5px 5px;
            width: 60px;
            flex-grow: 1;
        }

            .right-tool-group > a::before {
                padding: 0;
                font-size: 2rem;
            }

            .right-tool-group > a > .text {
                margin: auto;
                width: 100px;
            }

        .right-tool-group .btn-toassign > .text,
        .right-tool-group .btn-tohandle > .text {
            width: 50px;
        }

    #navbar-mobile-bottom {
        box-shadow: rgba(0,0, 0, 0.5) 0 0px 6px 2px;
    }
}


/*代理人登出*/
#LBtn_AgentOut {
    background-color: #3a9c98;
    color: #fff;
}

    #LBtn_AgentOut:hover {
        background-color: #23847f;
        color: #fff;
    }

    #LBtn_AgentOut .text::before {
        font-family: "Font Awesome 7 Free";
        content: "\e073";
        font-weight: 900;
    }
/*登出*/
#LBtn_SignOut {
    background-color: #273350;
    color: #fff;
}

    #LBtn_SignOut:hover {
        background-color: #273350;
        color: #d8d8d8;
    }

    #LBtn_SignOut .text {
        margin: 1px auto;
    }

    #LBtn_SignOut .text::before {
        font-family: "Font Awesome 7 Free";
        content: "\f2f5";
        font-weight: 900;
        color: #3a9c98;
    }

    #LBtn_SignOut:hover::before {
        color: #fff38a;
    }

/* 首頁卡片共用樣式 */
.card-wrap .card {
    margin: 0;
    box-shadow: none;
    padding: 10px 0 0;
    overflow: hidden;
}

/* 首頁卡片背景色（與舊版 Index.aspx 同步） */
.card-wrap.card-1 .card {
    background-color: #4da5cc;
}

.card-wrap.card-2 .card {
    background-color: #d45d5d;
}

.card-wrap.card-3 .card {
    background-color: #483e85;
}

.card-wrap.card-4 .card {
    background-color: #6a9856;
}

.card-wrap.card-6 .card {
    background-color: #cc994d;
}

.card-wrap.card-7 .card {
    background-color: #8B6914;
}

/* 卡片連結文字白色 */
.card-wrap .card a {
    color: #fff;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    flex-direction: row;
    padding: 0;
    justify-content: center;
}

/* 卡片 icon（::before） */
.card-wrap .card > a::before {
    content: '';
    display: inline-block;
    width: auto;
    max-width: 44px;
    min-width: 25px;
    height: 44px;
    background-size: contain;
    background-repeat: no-repeat;
    flex-basis: 12%;
    margin: 0 5% 0 5px;
    background-position: right center;
}

.card-wrap.card-1 .card > a::before {
    background-image: url('../images/ic-rain.png');
}

.card-wrap.card-2 .card > a::before {
    background-image: url('../images/ic-earthquake.png');
}

.card-wrap.card-3 .card > a::before {
    background-image: url('../images/ic-tree.png');
}

.card-wrap.card-4 .card > a::before {
    background-image: url('../images/ic-temperature.png');
}

.card-wrap.card-6 .card > a::before {
    background-image: url('../images/ic-flood.png');
}

.card-wrap.card-7 .card > a::before {
    background-image: url('../images/ic-flood.png');
}

/* picLink 背景框（避免用 .card 覆蓋 Splide 佈局） */
.picLink-card {
    background-color: var(--bs-body-bg);
    border: var(--bs-border-width) solid var(--bs-border-color-translucent);
    border-radius: var(--bs-border-radius);
}

.card-wrap tbody > tr > td {
    font-size: 1.15em;
    padding: 6px !important;
}

.card-wrap .card-block thead th {
    background-color: #9b9b9b;
    color: #fff;
}

@media (max-width: 767px) {
    .right-tool-group {
        position: static;
        margin: 0 -10px;
    }

    /* 手機版所有 a（含 dropdown 內的）— 與舊版 .right-tool-group a 一致 */
    .right-tool-group a {
        height: 100%;
        align-self: stretch;
        text-align: center;
        padding: 10px 5px;
        display: flex;
        flex-direction: column;
    }

        .right-tool-group a .text {
            margin: auto;
        }

    /* 小螢幕待辦事項 dropdown：橫排展開（與舊版一致） */
    #drop_todo:hover ~ .dropdown-menu,
    #drop_todo ~ .dropdown-menu:hover,
    #drop_todo_mobile:hover ~ .dropdown-menu,
    #drop_todo_mobile ~ .dropdown-menu:hover {
        display: flex;
        left: 0;
        right: 0;
        flex-direction: row;
        flex-wrap: wrap;
        margin: 0 8px;
        padding: 8px 0 0 8px;
        top: 122px;
        border-radius: 0 0 10px 10px;
    }

    #drop_todo ~ .dropdown-menu > a:not([style*="display: none"]),
    #drop_todo_mobile ~ .dropdown-menu > a:not([style*="display: none"]) {
        margin-right: 8px;
        margin-bottom: 8px;
        padding: 3px 0;
    }

    #drop_todo ~ .dropdown-menu > a,
    #drop_todo_mobile ~ .dropdown-menu > a {
        flex: 0 0 calc(33.33% - 8px);
    }

    #drop_todo ~ .dropdown-menu > a .text::before,
    #drop_todo_mobile ~ .dropdown-menu > a .text::before {
        display: block;
        padding: 0;
    }

    #drop_todo ~ .dropdown-menu > a::after,
    #drop_todo_mobile ~ .dropdown-menu > a::after {
        content: none;
    }

    .right-tool-group a > .text {
        width: 100%;
    }
}








.form-control-rbl, .form-control-cbl {
    list-style: none;
    padding: 7px 0;
    display: inline-block;
}

    .form-control-rbl li, .form-control-cbl li {
        display: inline-block;
        vertical-align: top;
    }

/* 單選/複選框邊框改為黑色（Bootstrap 5 預設 rgba(0,0,0,.25) 太淡） */
.form-check-input {
    border-color: #000;
}

/* readonly 輸入框顯示灰底，與 disabled 一致以區別可編輯欄位 */
input[readonly].form-control {
    background-color: var(--bs-secondary-bg);
}

    .form-control-rbl input[type="radio"], .form-control-cbl input[type="checkbox"] {
        vertical-align: top;
        cursor: pointer;
    }

        .form-control-rbl input[type="radio"] + label,
        .form-control-cbl input[type="checkbox"] + label {
            margin-right: 5px;
            vertical-align: top;
            cursor: pointer;
        }

        .form-control-rbl input[type="radio"]:checked + label,
        .form-control-cbl input[type="checkbox"]:checked + label {
            color: #3461bf;
        }


.col-group > [class^='col-'] {
    padding-left: 0px;
    padding-right: 0px;
}


select option[disabled='disabled'] {
    color: #2e8682;
    background-color: #DCF6F2;
}


#Btn_CollaQuery {
    font-family: "Font Awesome 7 Free";
    /*margin:0 15px 15px;*/
}
    #Btn_CollaQuery::before {
        content: "\f102";
        font-weight: 900;
    }

    #Btn_CollaQuery::after {
        line-height: 1em;
        content: "收合功能";
        font-family: 微軟正黑體, "Microsoft JhengHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    }

    #Btn_CollaQuery.collapsed::before {
        content: "\f103";
        font-weight: 900;
    }

    #Btn_CollaQuery.collapsed::after {
        content: "展開功能";
        font-family: 微軟正黑體, "Microsoft JhengHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
    }

.colla-query {
    /*padding: 0 15px 15px;*/
    margin-top: 5px;
    /*max-width:150px;*/
    margin-bottom: 15px;
}

    .colla-query .btn {
        min-width: 115px;
        padding: 6px 8px;
    }

#CollaQuery .panel {
    margin: 1px 0 0 0;
    background: #f6f6f6;
    border-color: #87a3b1;
    box-shadow:none;
}


/* 閃爍動畫 — 用 CSS animation 取代 JS setTimeout，由 GPU 處理 */
@keyframes todo-flicker {
    0%, 49% { background-color: #dc2f22; color: #fff; }
    50%, 100% { background-color: #ffea00; color: #777; }
}

@keyframes todo-flicker-badge {
    0%, 49% { background-color: #fff; color: #777; }
    50%, 100% { background-color: #777; color: #fff; }
}

/* 所有閃爍按鈕預設隱藏，由 JS 控制顯示；顯示時自動閃爍 */
.btn-group-flicker {
    display: none;
    animation: todo-flicker 1.6s step-end infinite;
}

.btn-group-flicker .badge {
    animation: todo-flicker-badge 1.6s step-end infinite;
}

/* 待分派 */
.btn-toassign {
    background-color: #4DA5CC;
    color: #fff;
}
.btn-toassign:hover {
    background-color: #449ABF;
    color: #fff;
}
.btn-toassign .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f0e8";
    font-weight: 900;
}

/* 待處理 */
.btn-tohandle {
    background-color: #dc2f22;
    color: #fff;
}
.btn-tohandle:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-tohandle .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f251";
    font-weight: 900;
}

/* 疏散撤離 */
.btn-sw1701 {
    background-color: #dc2f22;
    color: #fff;
}
.btn-sw1701:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-sw1701 .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f70c";
    font-weight: 900;
}

/* 區級開設 */
.btn-AreaOpen {
    background-color: #dc2f22;
    color: #fff;
}
.btn-AreaOpen:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-AreaOpen .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f65e";
    font-weight: 900;
}

/* 服務到期 */
.btn-ItemWarn {
    background-color: #dc2f22;
    color: #fff;
}
.btn-ItemWarn:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-ItemWarn .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f108";
    font-weight: 900;
}

/* 工作會報 */
.btn-tomeeting {
    background-color: #dc2f22;
    color: #fff;
}
.btn-tomeeting:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-tomeeting .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f0b1";
    font-weight: 900;
}

/* 帳號註冊 */
.btn-register {
    background-color: #dc2f22;
    color: #fff;
}
.btn-register:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-register .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f788";
    font-weight: 900;
}

/* 通報接收 */
.btn-toannounce {
    background-color: #dc2f22;
    color: #fff;
}
.btn-toannounce:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-toannounce .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f7c0";
    font-weight: 900;
}

/* 通報表 wuc 列表：水平置中 + 垂直置中（與舊版一致） */
div[id$="-container"] table.table td,
div[id$="-container"] table.table th {
    text-align: center !important;
    vertical-align: middle !important;
    white-space: nowrap;
}

/* 通報表 */
.btn-toquickrpt {
    background-color: #dc2f22;
    color: #fff;
}
.btn-toquickrpt:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-toquickrpt .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f0ae";
    font-weight: 900;
}

/* 列管事項 */
.btn-toinstruction {
    background-color: #dc2f22;
    color: #fff;
}
.btn-toinstruction:hover {
    background-color: #c42d22;
    color: #fff;
}
.btn-toinstruction .text::before {
    font-family: "Font Awesome 7 Free";
    content: "\f783";
    font-weight: 900;
}


@media (min-width: 992px) {
    .modal-100percent {
        width: 100%;
    }

    .modal-90percent {
        width: 90%;
    }

    .modal-80percent {
        width: 80%;
    }
}


/* ===== 跑馬燈（jQuery.Marquee 套件） ===== */
#marquee-top {
    width: 100%;
    background: #AFBEC5;
    height: 30px;
    position: relative;
    padding-left: 25px;
    overflow: hidden;
    display: none;           /* 預設隱藏，JS 有資料時 show */
    line-height: 30px;
}

    /* 喇叭圖示 */
    #marquee-top::before {
        font-family: "Font Awesome 7 Free";
        content: "\f0a1";
        font-weight: 900;
        color: #fff;
        position: absolute;
        left: 0;
        top: 0;
        background: #FD715C;
        padding: 5px;
        z-index: 1;
        width: 30px;
        display: block;
        line-height: 20px;
    }

    #marquee-top li {
        color: #fff;
        font-size: 1.3em;
        padding-left: 30px;
        display: inline-block;
    }

        #marquee-top li::before {
            content: "．";
        }

    #marquee-top:not(:empty) + .breadcrumb-wrapper {
        margin-top: 0;
    }


/*必填欄位*/
label.required::after {
    content: "*";
    color: #f00;
}

/* form-base */
.form-base fieldset {
    margin-left: -15px;
    margin-right: -15px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 30px;
    background-color: #fff;
    border-top: 2px solid #acacac;
    position: relative;
    margin-bottom: -18px;
}

    .form-base fieldset legend {
        display: block;
        width: auto;
        padding: 0;
        margin-bottom: 22px;
        font-size: 1.5em;
        line-height: inherit;
        border: 0;
        border-bottom: 0;
        padding-left: 5px;
        padding-right: 5px;
        font-weight: bold;
    }

    .form-base fieldset > fieldset legend {
        font-size: 1.3em;
    }

        .form-base fieldset > fieldset legend::before {
            content: '\f002';
            font-family: 'fontawesome';
        }




.form-base h3.form-title {
    margin: 0px 0 20px;
    font-size: 1.5em;
}



/* form-cus */

.form-mgt fieldset:nth-of-type(2n+1), .form-mgt fieldset.a-color {
    background-color: #fff3e0;
    border-top: 2px solid #ff6a00;
    background-color: #fffeea;
    border-top: 2px solid #e1db59;
}

.form-mgt fieldset.o-color {
    background-color: #fff;
    border-top: 2px solid #acacac;
}

.form-cus1 fieldset:nth-of-type(2n+1), .form-cus1 fieldset.a-color {
    background-color: #e9e9f3;
    border-top: 2px solid #4e4f97;
}

.form-cus2 fieldset:nth-of-type(2n+1), .form-cus2 fieldset.a-color {
    background-color: #e1f2ea;
    border-top: 2px solid #13a763;
}

.form-cus-check fieldset:nth-of-type(2n+1), .form-cus-check fieldset.a-color {
    background-color: #faf0eb;
    border-top: 2px solid #dd4704;
}

.form-cus-check fieldset > fieldset:nth-of-type(2n+1) {
    background-color: #e7f8fa;
    border-top: 2px solid #68c8d1;
}


/*========================================
  案件列表 — 卡片式佈局（disa-list）
  ========================================*/

.disa-list {
    padding: 15px 0;
}

    .disa-list .disa-wrapper {
        margin-bottom: 24px;
    }

        /* 標題列 */
        .disa-list .disa-wrapper > .disa-title {
            background-color: #273350;
            color: #fff;
            border-top-left-radius: 10px;
            border-top-right-radius: 10px;
            padding: 10px 24px;
        }

            .disa-list .disa-wrapper > .disa-title div {
                display: inline-block;
            }

            .disa-list .disa-wrapper > .disa-title span {
                display: inline-block;
                vertical-align: middle;
            }

            .disa-list .disa-wrapper > .disa-title .serial-no {
                border-right: 1px solid #fff;
                padding: 10px 24px 10px 0;
                margin: -10px 12px -10px 0;
                display: inline-block;
            }

            .disa-list .disa-wrapper > .disa-title .disa-no {
                min-width: 80px;
                display: inline-block;
            }

            /* 狀態標籤（預設灰色） */
            .disa-list .disa-wrapper > .disa-title .disa-status {
                background-color: #666;
                color: #fff;
                display: inline-block;
                position: relative;
                padding: 10px 16px;
                margin: -10px 6px -10px 12px;
            }

                .disa-list .disa-wrapper > .disa-title .disa-status > .text {
                    vertical-align: middle;
                }

                /* 狀態圖示基底 */
                .disa-list .disa-wrapper > .disa-title .disa-status::before {
                    content: none;
                    display: inline-block;
                    height: 19px;
                    width: 19px;
                    background-repeat: no-repeat;
                    background-position: center center;
                    margin-right: 5px;
                    vertical-align: middle;
                    top: -1px;
                    position: relative;
                }

        /* 案件待回覆（橘色） */
        .disa-list .disa-wrapper[data-style_status="01"] > .disa-title .disa-status,
        .disa-list .disa-wrapper[data-style_status="00"] > .disa-title .disa-status {
            background-color: #EF953C;
        }

            .disa-list .disa-wrapper[data-style_status="01"] > .disa-title .disa-status::before,
            .disa-list .disa-wrapper[data-style_status="00"] > .disa-title .disa-status::before {
                content: '';
                background-image: url('../images/ic-warning-white.png');
            }

        /* 案件已回覆（綠色） */
        .disa-list .disa-wrapper[data-style_status="03"] > .disa-title .disa-status,
        .disa-list .disa-wrapper[data-style_status="04"] > .disa-title .disa-status,
        .disa-list .disa-wrapper[data-style_status="05"] > .disa-title .disa-status {
            background-color: #6A9856;
        }

            .disa-list .disa-wrapper[data-style_status="03"] > .disa-title .disa-status::before,
            .disa-list .disa-wrapper[data-style_status="04"] > .disa-title .disa-status::before,
            .disa-list .disa-wrapper[data-style_status="05"] > .disa-title .disa-status::before {
                content: '';
                background-image: url('../images/ic-check-white.png');
            }

        /* 案件已併案（藍色） */
        .disa-list .disa-wrapper[data-style_status="11"] > .disa-title .disa-status {
            background-color: #4DA5CC;
        }

            .disa-list .disa-wrapper[data-style_status="11"] > .disa-title .disa-status::before {
                content: '';
                background-image: url('../images/ic-combine.png');
            }

        /* 30分鐘無異動（紅色），預設隱藏 */
        .disa-list .disa-wrapper > .disa-title .disa-status.non {
            background-color: #D45D5D;
            margin-left: -12px;
            display: none;
        }

            .disa-list .disa-wrapper > .disa-title .disa-status.non::before {
                content: '';
                background-image: url('../images/ic-warning-white.png');
            }

        /* non-real-time 時顯示 */
        .disa-list .disa-wrapper.non-real-time > .disa-title .disa-status.non {
            display: inline-block;
        }

            /* 案件來源 / 上傳時間 */
            .disa-list .disa-wrapper > .disa-title .disa-title-sub {
                float: right;
            }

            .disa-list .disa-wrapper > .disa-title .disa-from,
            .disa-list .disa-wrapper > .disa-title .disa-updt {
                color: #D0DBF1;
            }

            .disa-list .disa-wrapper > .disa-title .disa-from {
                padding-right: 6px;
            }

            .disa-list .disa-wrapper > .disa-title .disa-updt {
                min-width: 130px;
            }

@media(max-width:1399px) {
    .disa-list .disa-wrapper > .disa-title .disa-title-sub {
        display: block;
        background: #dedede;
        margin: 10px -24px -10px;
        padding: 3px 24px;
        color: #273350;
        float: none;
    }

    .disa-list .disa-wrapper > .disa-title .disa-from,
    .disa-list .disa-wrapper > .disa-title .disa-updt {
        color: #273350;
    }
}

@media(max-width:480px) {
    .disa-list .disa-wrapper > .disa-title {
        padding: 10px 15px;
    }

        .disa-list .disa-wrapper > .disa-title .disa-title-sub {
            margin: 10px -15px -10px;
            padding: 3px 12px;
        }
}

/* 案件內容區 */
.disa-list .disa-wrapper > .disa-body {
    background-color: #f8f8f8;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 15px 24px;
    color: #273350;
}

    .disa-list .disa-wrapper > .disa-body .form-group {
        margin-bottom: 15px;
    }

    /* 欄位標題（淺藍背景） */
    .disa-list .disa-wrapper > .disa-body label.dt {
        background-color: #D0DBF1;
        color: #273350;
        padding: 3px 12px;
    }

    /* 受理時間卡片 */
    .disa-list .disa-wrapper > .disa-body .rep-dt-wrapper {
        display: flex;
        flex-direction: column;
        box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
        border-radius: 5px;
    }

        .disa-list .disa-wrapper > .disa-body .rep-dt-wrapper label {
            background: #6F7FA5;
            color: #fff;
            border-radius: 5px 5px 0 0;
            text-align: center;
            padding: 3px;
        }

        .disa-list .disa-wrapper > .disa-body .rep-dt-wrapper .rep-dt {
            background: #fff;
            border-radius: 0 0 5px 5px;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 10px 3px;
        }

            .disa-list .disa-wrapper > .disa-body .rep-dt-wrapper .rep-dt .rep-year {
                font-size: 1.125em;
            }

            .disa-list .disa-wrapper > .disa-body .rep-dt-wrapper .rep-dt .rep-date {
                font-size: 2.5em;
                font-weight: bold;
            }

            .disa-list .disa-wrapper > .disa-body .rep-dt-wrapper .rep-dt .rep-time {
                font-size: 1.25em;
            }

    /* 追蹤標記 */
    .disa-list .disa-wrapper > .disa-body .shine {
        padding: 6px 8px;
    }

        .disa-list .disa-wrapper > .disa-body .shine::before {
            content: '\f08d';
            font-family: 'Font Awesome 7 Free';
            font-weight: 900;
            padding-right: 3px;
        }

    /* 處理權責單位 */
    .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept {
        background-color: #fff;
        border-radius: 5px;
        padding: 5px 10px;
        margin-bottom: 5px;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }

        /* 主政圖示 */
        .IsMainPic {
            content: url('../images/jackpot.png');
            display: inline-block;
            padding: 0 6px 0 0;
        }

        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept .status {
            border-radius: 3px;
            background-color: #666;
            padding: 3px 5px;
            color: #fff;
            font-size: 0.875em;
            margin: 1px 0 1px 3px;
            display: inline-block;
        }

        /* 處理權責單位 — 依狀態變色 */
        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept[data-status="00"] .status {
            background-color: #EF953C;
        }

        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept[data-status="01"] .status {
            background-color: #273350;
        }

        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept[data-status="03"] .status {
            background-color: #888;
        }

        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept[data-status="04"] .status {
            background-color: #6A9856;
        }

        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept[data-status="05"] .status {
            background-color: #888;
        }

        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept[data-status="11"] .status {
            background-color: #4DA5CC;
        }

        .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept .status-wrapper {
            flex-grow: 1;
            text-align: right;
        }

            .disa-list .disa-wrapper > .disa-body .disp-dept-list .disp-dept .status-wrapper label {
                border-radius: 3px;
                background-color: #D45D5D;
                padding: 3px 5px;
                color: #fff;
                margin-left: 3px;
                font-size: 0.875em;
            }

    /* 操作按鈕區 */
    .disa-list .disa-wrapper > .disa-body .disa-btns > div + div > .btn {
        margin-top: 5px;
    }

    /* 處理情形展開箭頭 */
    .disa-list .disa-wrapper > .disa-body .reply-append::after {
        position: relative;
        content: "";
        width: 0.7em;
        height: 0.7em;
        border-style: solid;
        border-width: 1px 0 0 1px;
        border-color: initial;
        left: 0.7em;
        transform: rotate(-135deg) translateY(-50%);
        transform-origin: top;
        transition: all .3s ease-out;
        display: inline-block;
        top: 0.3em;
    }

    .disa-list .disa-wrapper > .disa-body .reply-append[aria-expanded="true"]::after {
        transform: rotate(45deg) translateX(25%) translateY(-25%);
    }

    .disa-list .disa-wrapper > .disa-body .reply-append[aria-expanded="true"] {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }

    /* 處理情形列表 */
    .disa-list .disa-wrapper > .disa-body .reply-list {
        padding: 0;
        margin-bottom: 5px;
        box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.16);
    }

        .disa-list .disa-wrapper > .disa-body .reply-list ul {
            margin: 0;
        }

            .disa-list .disa-wrapper > .disa-body .reply-list ul li {
                padding: 8px 3px;
                border-bottom: 1px dotted #6F7FA5;
                background-color: #F2F2F9;
            }

            .disa-list .disa-wrapper > .disa-body .reply-list ul li:last-child {
                border-bottom: 0;
                border-radius: 0 0 5px 5px;
            }

                .disa-list .disa-wrapper > .disa-body .reply-list ul li .reply-wrapper {
                    padding: 0 5px;
                }

            .disa-list .disa-wrapper > .disa-body .reply-list ul li .reply-process {
                max-height: 100px;
                overflow-y: auto;
            }

@media(max-width:1199px) {
    .disa-list .disa-wrapper > .disa-body {
        padding: 15px 12px;
    }
}

@media(max-width:767px) {
    .disa-list .disa-wrapper > .disa-body .disa-btns > div .btn {
        margin-top: 0 !important;
    }

    .disa-list .disa-wrapper > .disa-body .disa-btns > div + div:not(:first-child):not(:nth-child(2)) .btn {
        margin-top: 5px !important;
    }

    .disa-list .disa-wrapper > .disa-body .reply-list {
        margin-bottom: 15px;
    }
}

@media(max-width:480px) {
    .disa-list .disa-wrapper > .disa-body {
        padding: 15px 15px;
    }
}

/* 分頁控制列 */
.disa-pager {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    padding: 4px 0;
}

    .disa-pager select {
        width: auto;
        display: inline-block;
    }

/* 人員資訊 Tooltip（CaseMan）— 白底、帶框線表格、左欄淺綠 */
.tooltip-caseman .tooltip-inner {
    background-color: #fff;
    color: #333;
    border: 1px solid #aaa;
    max-width: 280px;
    padding: 0;
    text-align: left;
    box-shadow: 1px 2px 6px rgba(0,0,0,.25);
}

    .tooltip-caseman .tooltip-inner > div:first-child {
        background-color: #000;
        color:#fff;
        padding: 4px 8px;
        font-weight: bold;
        border-bottom: 1px solid #aaa;
        text-align: center;
    }

    .tooltip-caseman .tooltip-inner table {
        width: 100%;
        border-collapse: collapse;
        font-size: .875em;
    }

        .tooltip-caseman .tooltip-inner table td {
            padding: 3px 8px;
            border: 1px solid #ccc;
        }

        .tooltip-caseman .tooltip-inner table td:first-child {
            background-color: #d4edda;
            white-space: nowrap;
            font-weight: 600;
            width: 50px;
        }

.tooltip-caseman .tooltip-arrow::before {
    border-top-color: #aaa;
}

.CaseMan {
    color: #0d6efd;
    cursor: pointer;
    text-decoration: underline;
}

/* ===== 案件明細（disa-dtl）===== */
.disa-dtl {
    max-width: 1000px;
    margin: 0 auto 10px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(0,0,0,.15);
    background: #fff;
}

    .disa-dtl > .prj-name {
        background-color: #273350;
        color: #fff;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
        padding: 8px 6px;
        text-align: center;
    }

    .disa-dtl .disa-wrapper {
        padding: 12px 12px;
        color: #273350;
    }

        .disa-dtl .disa-wrapper hr {
            border-color: #D0DBF1;
        }

        .disa-dtl .disa-wrapper .form-group {
            margin-bottom: 20px;
        }

        .disa-dtl .disa-wrapper .form-control {
            padding-top: 7px;
        }

    /* 欄位標題（淺藍底） */
    .disa-dtl .disa-wrapper label.dt {
        background-color: #D0DBF1;
        color: #273350;
        padding: 3px 12px;
    }

    /* 受理時間日期卡 */
    .disa-dtl .rep-dt-wrapper {
        display: flex;
        flex-direction: column;
        box-shadow: 0 0 6px rgba(0,0,0,.16);
        border-radius: 5px;
    }

        .disa-dtl .rep-dt-wrapper label {
            background: #6F7FA5;
            color: #fff;
            border-radius: 5px 5px 0 0;
            text-align: center;
            padding: 3px;
        }

        .disa-dtl .rep-dt-wrapper .rep-dt {
            background: #fff;
            border-radius: 0 0 5px 5px;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 10px 3px;
        }

            .disa-dtl .rep-dt-wrapper .rep-dt .rep-year {
                font-size: 1.125em;
            }

            .disa-dtl .rep-dt-wrapper .rep-dt .rep-date {
                font-size: 2.5em;
                font-weight: bold;
            }

            .disa-dtl .rep-dt-wrapper .rep-dt .rep-time {
                font-size: 1.25em;
            }

    /* 人員傷亡情形卡片 */
    .disa-dtl .disa-wrapper .inde-list .inde {
        background-color: #F8F8F8;
        border-radius: 10px;
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        color: #273350;
        padding: 15px 36px;
        margin: 0 10px 8px 0;
    }

        .disa-dtl .disa-wrapper .inde-list .inde > span:first-child {
            font-size: 1.125em;
        }

        .disa-dtl .disa-wrapper .inde-list .inde .num {
            font-size: 2em;
            padding-right: 3px;
        }

    /* 附件列表 */
    .atts-list {
        padding-left: 8px;
        line-height: 28px;
    }

        .atts-list a {
            border: 1px solid #D0DBF1;
            background-color: #fff;
            height: 28px;
            width: 28px;
            display: inline-block;
            text-align: center;
            vertical-align: middle;
            border-radius: 5px;
            box-shadow: 0 2px 4px rgba(0,0,0,.16);
            color: #6F7FA5;
            margin-right: 6px;
            text-decoration: none;
        }

            .atts-list a:not([href='']):before {
                font-family: "Font Awesome 7 Free";
                content: "\f0c6";
                font-weight: 900;
                line-height: 28px;
            }

            .atts-list a:hover {
                color: #56668d;
                box-shadow: none;
                text-decoration: none;
            }

    /* 底部按鈕列 */
    .disa-dtl > .dtl-footer {
        background-color: #e9ecef;
        padding: 10px 15px;
        text-align: right;
    }
