/* =========================================
   修正審核簽名區塊 (Audit Signature) 排版
   不會影響 RWD，僅針對簽名區塊強制對齊
   ========================================= */

/* 1. 強制垂直排列，確保手機/電腦版都由上往下整齊排列 */
#pnl_sign .consent-form {
    display: flex;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    width: 100%;
    gap: 15px; /* 調整間距 */
}

    /* 2. 內層容器寬度 100%，避免縮成一團 */
    #pnl_sign .consent-form > div {
        width: 100%;
        display: block; /* 讓內部元素自然換行 */
        border-bottom: 1px dashed #eee;
        padding-bottom: 15px;
        margin-bottom: 5px;
    }

        #pnl_sign .consent-form > div:last-child {
            border-bottom: none;
            margin-bottom: 0;
        }

/* 3. 圖片 RWD 設定：限制最大寬度，防止手機版破版 */
#pnl_sign img {
    display: block;
    margin: 10px 0;
    /* RWD 關鍵：最大不超過容器，但保持原圖比例 */
    max-width: 20% !important;
    width: auto !important;
    height: auto !important;
    max-height: 150px; /* 限制高度，避免簽名圖太高 */
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
    background: #fff;
}

/* 4. 按鈕與文字排版 */
#pnl_sign input[type="submit"] {
    margin-top: 10px;
}

#pnl_sign .signature-container p {
    margin: 5px 0;
    color: #666;
    font-size: 0.9em;
    line-height: 1.4;
}
/* ==========================================================================
   情境 1: 已立案 (case-established)
   適用於：只要進入 InitCaseView (代表有案號)，申請人就不能再改簽名
   效果：隱藏申請人簽名畫布、清除鈕、拍照鈕，只保留 img_user
   ========================================================================== */
.case-established #sign-user, /* 畫布 Canvas */
.case-established #clear-user, /* 清除按鈕 */
.case-established #CUser, /* 拍照按鈕 */
.case-established .signature-fileupload, /* 上傳控制項 */
.case-established #preview-CUser { /* 預覽暫存區 */
    display: none !important;
}

/* ==========================================================================
   情境 2: 唯讀/審核模式 (view-only-uploads)
   適用於：審核人、已結案
   效果：隱藏所有附件的上傳框、提示字，只留預覽連結
   ========================================================================== */
.view-only-uploads .upload-box, /* 拖曳上傳區 */
.view-only-uploads .camera-btn, /* 拍照鈕 */
.view-only-uploads .clear-upload, /* 清除檔案鈕 */
.view-only-uploads input[type="file"] { /* 檔案輸入框 */
    display: none !important;
}

/* 隱藏錯誤提示與說明文字 */
.view-only-uploads .error-message,
.view-only-uploads .upload-group p {
    display: none !important;
}

/* 排版修飾 */
.view-only-uploads .upload-group {
    border: none;
    margin-bottom: 5px;
    padding: 0;
}

.view-only-uploads .file-thumb p {
    display: block !important;
    margin: 5px 0 0 0;
}

/* ==========================================================================
   情境 3: 完全隱藏簽名操作 (hide-sign-ops)
   適用於：已結案 (A) 或 承辦人已審完
   效果：連電子簽章按鈕都隱藏
   ========================================================================== */
.hide-sign-ops .consent-form input[type="submit"], /* 電子簽章按鈕 */
.hide-sign-ops .consent-form .clear-btn,
.hide-sign-ops .consent-form .signature-canvas { /* 清除簽名按鈕 */
    display: none !important;
}
/* === 左上角使用者權限狀態標籤 === */
.user-status-badge {
    position: fixed; /* 固定在視窗左上角，捲動時也會存在 */
    top: 0;
    left: 0;
    background-color: var(--title-blue); /* 使用 tstyle.css 定義的藍色 */
    color: #fff;
    padding: 8px 16px;
    border-bottom-right-radius: 10px; /* 右下角圓角，增添設計感 */
    font-size: 0.95rem;
    font-weight: 600;
    z-index: 9999; /* 確保在最上層 */
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2);
    letter-spacing: 0.5px;
}

/* 列印時隱藏此標籤 */
@media print {
    .user-status-badge {
        display: none !important;
    }
}