/* ============================================================
   Image upload field UX enhancements for FastAdmin add/edit forms
   (officeview)
   ------------------------------------------------------------
   Gallery look (matches product mock):
   - Square cream tiles, rounded corners
   - Dark circular trash badge (top-right)
   - Dashed orange "+" add tile (upload button restyled)
   - Click thumbnail → Layer.photos modal (not a new browser tab)

   Scope:
   - Fields with a real .faupload button get the gallery layout.
   - Read-only preview pages without upload buttons keep their markup;
     global click-to-preview still applies where links open images.
   - .avatar-uploader keeps its own side-by-side layout.
   ============================================================ */

/* ------------------------------------------------------------
   0. Dialog form alignment: right-align labels + give values more room
   ------------------------------------------------------------ */

.is-dialog form.form-horizontal .control-label {
    text-align: right;
    padding-right: 18px;
}
.is-dialog form.form-horizontal.ov-dialog-compact .control-label {
    text-align: left;
    padding-right: 0;
}

/* ------------------------------------------------------------
   1. Hide raw image-URL text input
   ------------------------------------------------------------ */

/* 1a) input-group wrapped image fields → most module add/edit pages
       (lawyer / lawfirm / company / category / ad.space / user.verification) */
.input-group:has(.faupload) > input.form-control {
    display: none !important;
}

/* 1b) URL input is a direct child of the field column */
.col-sm-8:has(.faupload) > input.form-control,
.col-sm-4:has(.faupload) > input.form-control,
.col-sm-10:has(.faupload) > input.form-control {
    display: none !important;
}

/* 1c) system config image/file fields wrap the input in .form-inline */
.form-inline:has(.faupload) > input.form-control {
    display: none !important;
}

/* ------------------------------------------------------------
   2. Image upload field → WeChat-style square gallery
      (cream tiles + dashed orange "+" + dark trash badge)
   ------------------------------------------------------------ */

/* Only columns/fields that themselves contain faupload (avoid dual-col rows) */
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)),
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)),
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)),
.cf-field:has(.faupload) {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px;
    background: transparent;
    border: none;
    padding-top: 0;
    padding-bottom: 4px;
}

/* cf-field 自带顶部 label（企业编辑等）：标签独占一行，图片在下方 */
.cf-field:has(.faupload) > label {
    flex: 0 0 100%;
    width: 100%;
    margin-bottom: 0;
}

/* Preview <ul> dissolves so each <li> joins the parent flex row */
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .faupload-preview,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .faupload-preview,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .faupload-preview,
.cf-field:has(.faupload) > .faupload-preview,
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .plupload-preview,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .plupload-preview,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .plupload-preview,
.cf-field:has(.faupload) > .plupload-preview {
    display: contents;
    padding: 0;
    margin: 0;
}

/* Upload/choose group becomes the trailing "+" tile (after images) */
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .input-group,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .input-group,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .input-group,
.cf-field:has(.faupload) > .input-group {
    order: 2;
    position: relative;
    display: inline-flex;
    width: 88px;
    height: 88px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    overflow: visible;
    vertical-align: top;
}

/* Single-image fields: hide "+" once a preview exists */
.form-group .col-sm-8:has(.faupload[data-multiple="false"]):has(.faupload-preview li):not(:has(.avatar-uploader)) > .input-group,
.form-group .col-sm-4:has(.faupload[data-multiple="false"]):has(.faupload-preview li):not(:has(.avatar-uploader)) > .input-group,
.form-group .col-sm-10:has(.faupload[data-multiple="false"]):has(.faupload-preview li):not(:has(.avatar-uploader)) > .input-group,
.cf-field:has(.faupload[data-multiple="false"]):has(.faupload-preview li) > .input-group {
    display: none !important;
}

.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon,
.cf-field:has(.faupload) > .input-group > .input-group-addon {
    display: block;
    width: 88px;
    height: 88px;
    padding: 0;
    border: 1px dashed #f0a04b;
    border-radius: 10px;
    background: #fdf6ec;
    overflow: hidden;
}

.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon > span,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon > span,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon > span,
.cf-field:has(.faupload) > .input-group > .input-group-addon > span {
    display: block;
    width: 100%;
    height: 100%;
}

.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon > span:has(.fachoose),
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon > span:has(.fachoose),
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .input-group-addon > span:has(.fachoose),
.cf-field:has(.faupload) > .input-group > .input-group-addon > span:has(.fachoose) {
    display: none !important;
}

/* Hide "Choose" in gallery mode; "+" triggers local upload */
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) .fachoose,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) .fachoose,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) .fachoose,
.cf-field:has(.faupload) .fachoose {
    display: none !important;
}

/* Keep validator msg outside the 88px tile */
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .msg-box,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .msg-box,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .input-group > .msg-box,
.cf-field:has(.faupload) > .input-group > .msg-box {
    position: absolute;
    left: 0;
    top: 100%;
    margin-top: 4px;
    white-space: nowrap;
    z-index: 3;
}

/* Style Upload button as centered orange "+" */
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload,
.cf-field:has(.faupload) .btn.faupload {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0 !important;
    border-radius: 10px;
    background: transparent !important;
    box-shadow: none !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-shadow: none;
}

.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload > i,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload > i,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload > i,
.cf-field:has(.faupload) .btn.faupload > i {
    display: none !important;
}

.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload::before,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload::before,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload::before,
.cf-field:has(.faupload) .btn.faupload::before {
    content: "+";
    color: #f08a24;
    font-size: 36px;
    font-weight: 500;
    line-height: 1;
    font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload:hover,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload:hover,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload:hover,
.cf-field:has(.faupload) .btn.faupload:hover,
.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload:focus,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload:focus,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) .btn.faupload:focus,
.cf-field:has(.faupload) .btn.faupload:focus {
    background: rgba(240, 138, 36, 0.08) !important;
}

.form-group .col-sm-8:has(.faupload):not(:has(.avatar-uploader)) > .help-block,
.form-group .col-sm-4:has(.faupload):not(:has(.avatar-uploader)) > .help-block,
.form-group .col-sm-10:has(.faupload):not(:has(.avatar-uploader)) > .help-block,
.cf-field:has(.faupload) > .help-block {
    order: 3;
    flex: 1 0 100%;
    margin-top: 4px;
}

/* ------------------------------------------------------------
   3. Preview tiles (square / cream / rounded)
   ------------------------------------------------------------ */

.plupload-preview li,
.faupload-preview li {
    position: relative;
    float: none;
    width: 88px !important;
    height: 88px !important;
    margin: 0;
    padding: 0 !important;
}

/* Avatar uploader keeps its own frame size */
.avatar-uploader .faupload-preview li,
.avatar-preview-list li {
    width: auto !important;
    height: auto !important;
}

.plupload-preview a.thumbnail,
.faupload-preview a.thumbnail {
    display: block;
    width: 100%;
    height: 100% !important;
    margin: 0;
    padding: 0;
    border: 1px solid #f0d9c0;
    border-radius: 10px;
    background: #fdf6ec;
    overflow: hidden;
    cursor: zoom-in;
}

.plupload-preview a.thumbnail:hover,
.plupload-preview a.thumbnail:focus,
.plupload-preview a.thumbnail.active,
.faupload-preview a.thumbnail:hover,
.faupload-preview a.thumbnail:focus,
.faupload-preview a.thumbnail.active {
    border-color: #f0a04b;
    box-shadow: none;
}

.plupload-preview a.thumbnail img,
.faupload-preview a.thumbnail img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    border-radius: 0;
    display: block;
}

/* Video thumbs: show first frame + play badge (not broken img) */
.plupload-preview a.thumbnail.faupload-preview-video,
.faupload-preview a.thumbnail.faupload-preview-video {
    position: relative;
    cursor: pointer;
    background: #111;
}

.plupload-preview a.thumbnail video,
.faupload-preview a.thumbnail video {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    display: block;
    pointer-events: none;
    background: #111;
}

.plupload-preview a.thumbnail .faupload-video-badge,
.faupload-preview a.thumbnail .faupload-video-badge {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 28px;
    height: 28px;
    margin: -14px 0 0 -14px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    pointer-events: none;
    z-index: 1;
}

.plupload-preview a.thumbnail .faupload-video-badge i,
.faupload-preview a.thumbnail .faupload-video-badge i {
    margin-left: 2px;
}

/* Layer video player */
.ov-faupload-video-layer .layui-layer-content {
    overflow: hidden !important;
    padding: 0 !important;
    background: #000 !important;
}

.ov-faupload-video-wrap {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #000;
}

.ov-faupload-video-wrap video {
    width: 100%;
    height: 100%;
    max-height: 80vh;
    object-fit: contain;
    background: #000;
    outline: none;
}

/* ------------------------------------------------------------
   4. Delete badge — dark circle, top-right
   ------------------------------------------------------------ */

/* Default backend.css sets `.faupload-preview a { display: block; }`,
   which turns the trash link into a full-width red block under every
   thumbnail. Restore it to a small corner badge. */
.plupload-preview a.btn-trash,
.faupload-preview a.btn-trash {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 5px;
    right: 5px;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0 !important;
    border-radius: 50%;
    background: #555 !important;
    color: #fff !important;
    font-size: 11px;
    line-height: 1;
    z-index: 2;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
    opacity: 0.92;
}

.plupload-preview a.btn-trash:hover,
.faupload-preview a.btn-trash:hover {
    background: #333 !important;
    color: #fff !important;
    opacity: 1;
}

/* Read-only detail image grids share cream tile language via page CSS;
   click-to-preview is handled globally in backend.js */

/* ------------------------------------------------------------
   5. Lawyer add/edit dialog form layout
   ------------------------------------------------------------ */

html:has(body.is-dialog .lawyer-edit-form) {
    height: 100%;
}

body.is-dialog:has(.lawyer-edit-form) {
    height: 100%;
    overflow: hidden;
    margin: 0;
    background: #f5f7fa;
}

body.is-dialog:has(.lawyer-edit-form) #main,
body.is-dialog:has(.lawyer-edit-form) #main > .tab-content,
body.is-dialog:has(.lawyer-edit-form) #content,
body.is-dialog:has(.lawyer-edit-form) #content > .row,
body.is-dialog:has(.lawyer-edit-form) #content > .row > [class*="col-"],
body.is-dialog:has(.lawyer-edit-form) .content {
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
}

body.is-dialog:has(.lawyer-edit-form) .content {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    background: #f5f7fa;
}

.lawyer-edit-form {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    overflow: auto;
    padding: 14px 18px 18px;
    margin: 0;
    box-sizing: border-box;
    color: rgba(0, 0, 0, 0.88);
}

/* 分区卡片 */
.lawyer-edit-form .lawyer-form-section {
    margin: 0 0 12px;
    padding: 14px 16px 4px;
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.lawyer-edit-form .lawyer-form-section--last {
    margin-bottom: 4px;
}

.lawyer-edit-form .lawyer-form-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f0f2f5;
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.lawyer-edit-form .lawyer-form-section-title > .fa {
    color: #18bc9c;
    font-size: 14px;
    width: 16px;
    text-align: center;
}

.lawyer-edit-form .lawyer-form-section-hint {
    margin: -4px 0 12px;
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.4;
}

.lawyer-edit-form .lawyer-version-banner {
    margin: 0 0 12px;
    padding: 10px 14px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
    border-radius: 8px;
}

.lawyer-edit-form .form-group {
    margin-bottom: 12px;
}

.lawyer-edit-form .control-label {
    padding-top: 8px;
    padding-right: 12px;
    color: #64748b;
    font-weight: 500;
    text-align: right;
}

.lawyer-edit-form .form-control {
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    box-shadow: none;
    transition: border-color .2s, box-shadow .2s;
}

.lawyer-edit-form .form-control:focus {
    border-color: #18bc9c;
    box-shadow: 0 0 0 2px rgba(24, 188, 156, 0.12);
}

.lawyer-edit-form textarea.form-control {
    resize: vertical;
    min-height: 78px;
}

.lawyer-edit-form .bootstrap-select > .dropdown-toggle {
    border-radius: 8px;
    border-color: #d9d9d9;
}

.lawyer-edit-form .help-block {
    display: block;
    margin: 4px 0 0;
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.4;
}

/* 双列行：左右列等高占位（排除上传列，避免盖掉 gallery 的横向 flex） */
.lawyer-edit-form .form-group > .col-sm-4:not(:has(.faupload)) {
    display: flex;
    flex-direction: column;
}

.lawyer-edit-form .form-group > .col-sm-4:not(:has(.faupload)) > .form-control,
.lawyer-edit-form .form-group > .col-sm-4:not(:has(.faupload)) > .input-group,
.lawyer-edit-form .form-group > .col-sm-4:not(:has(.faupload)) > .bootstrap-select {
    flex: 0 0 auto;
}

/* 联系方式 + 二维码：标签与上传格顶对齐 */
.lawyer-edit-form .lawyer-row-upload > .control-label {
    padding-top: 10px;
}

.lawyer-edit-form .version-tip {
    margin: 0;
    line-height: 1.5;
    font-size: 13px;
}

.lawyer-edit-form .firm-custom-input {
    margin-top: 8px;
}

/* 擅长领域：与前端一致的点击多选芯片 */
.lawyer-edit-form .lawyer-specialty-picker {
    width: 100%;
}

.lawyer-edit-form .lawyer-specialty-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 10px;
}

.lawyer-edit-form .lawyer-specialty-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 6px 12px;
    border: 1px solid #d9d9d9;
    border-radius: 16px;
    background: #fff;
    color: #475569;
    font-size: 13px;
    line-height: 1.2;
    cursor: pointer;
    transition: border-color .15s, background .15s, color .15s, box-shadow .15s;
    outline: none;
    user-select: none;
}

.lawyer-edit-form .lawyer-specialty-chip:hover {
    border-color: #18bc9c;
    color: #0f766e;
}

.lawyer-edit-form .lawyer-specialty-chip.is-active {
    border-color: #18bc9c;
    background: rgba(24, 188, 156, 0.12);
    color: #0f766e;
    font-weight: 600;
    box-shadow: 0 0 0 1px rgba(24, 188, 156, 0.18);
}

.lawyer-edit-form .lawyer-specialty-chip.is-custom.is-active {
    padding-right: 10px;
}

.lawyer-edit-form .lawyer-specialty-custom {
    max-width: 360px;
}

.lawyer-edit-form .lawyer-specialty-custom .form-control {
    border-radius: 8px 0 0 8px;
}

.lawyer-edit-form .lawyer-specialty-custom .btn {
    border-radius: 0 8px 8px 0;
}

.lawyer-edit-form .input-narrow {
    max-width: 180px;
}

.lawyer-edit-form .area-selects {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.lawyer-edit-form .area-selects .form-control {
    flex: 1 1 0;
    min-width: 120px;
    max-width: none;
    margin: 0;
}

.lawyer-edit-form .datetimepicker-group .btn-clear-datetime {
    position: relative;
    z-index: 1000;
}

.lawyer-edit-form .layer-footer {
    margin-top: 4px;
    padding-top: 0;
    border-top: none;
}

.lawyer-edit-form .layer-footer .btn-primary {
    min-width: 120px;
    padding: 8px 28px;
    font-weight: 600;
    border-radius: 6px;
}

.lawyer-edit-form .faupload-preview {
    margin: 0;
}

.lawyer-edit-form .faupload-preview a:first-child {
    height: 88px;
}

.lawyer-edit-form .faupload-preview a img {
    height: 88px;
    object-fit: cover;
}

@media (max-width: 767px) {
    .lawyer-edit-form .control-label {
        text-align: left;
        padding-right: 0;
        padding-top: 0;
        margin-bottom: 4px;
    }

    .lawyer-edit-form .lawyer-form-section {
        padding: 12px 12px 2px;
    }
}

/* ------------------------------------------------------------
   6. Lawfirm add/edit dialog form layout
   ------------------------------------------------------------ */

html:has(body.is-dialog .lawfirm-edit-form) {
    height: 100%;
}

body.is-dialog:has(.lawfirm-edit-form) {
    height: 100%;
    overflow: hidden;
    margin: 0;
    background: #f5f7fa;
}

body.is-dialog:has(.lawfirm-edit-form) #main,
body.is-dialog:has(.lawfirm-edit-form) #main > .tab-content,
body.is-dialog:has(.lawfirm-edit-form) #content,
body.is-dialog:has(.lawfirm-edit-form) #content > .row,
body.is-dialog:has(.lawfirm-edit-form) #content > .row > [class*="col-"],
body.is-dialog:has(.lawfirm-edit-form) .content {
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
}

body.is-dialog:has(.lawfirm-edit-form) .content {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    background: #f5f7fa;
}

.lawfirm-edit-form {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    overflow: auto;
    padding: 14px 18px 18px;
    margin: 0;
    box-sizing: border-box;
    color: rgba(0, 0, 0, 0.88);
}

.lawfirm-edit-form .lawfirm-form-section {
    margin: 0 0 12px;
    padding: 14px 16px 4px;
    background: #fff;
    border: 1px solid #eef0f3;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
}

.lawfirm-edit-form .lawfirm-form-section--last {
    margin-bottom: 4px;
}

.lawfirm-edit-form .lawfirm-form-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f0f2f5;
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.lawfirm-edit-form .lawfirm-form-section-title > .fa {
    color: #18bc9c;
    font-size: 14px;
    width: 16px;
    text-align: center;
}

.lawfirm-edit-form .lawfirm-form-section-hint {
    margin: -4px 0 12px;
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.4;
}

.lawfirm-edit-form .form-group {
    margin-bottom: 12px;
}

.lawfirm-edit-form .control-label {
    padding-top: 8px;
    padding-right: 12px;
    color: #64748b;
    font-weight: 500;
    text-align: right;
}

.lawfirm-edit-form .form-control {
    border: 1px solid #d9d9d9;
    border-radius: 8px;
    box-shadow: none;
    transition: border-color .2s, box-shadow .2s;
}

.lawfirm-edit-form .form-control:focus {
    border-color: #18bc9c;
    box-shadow: 0 0 0 2px rgba(24, 188, 156, 0.12);
}

.lawfirm-edit-form textarea.form-control {
    resize: vertical;
    min-height: 72px;
}

.lawfirm-edit-form .bootstrap-select > .dropdown-toggle {
    border-radius: 8px;
    border-color: #d9d9d9;
}

.lawfirm-edit-form .help-block {
    display: block;
    margin: 4px 0 0;
    color: #94a3b8;
    font-size: 12px;
    line-height: 1.4;
}

.lawfirm-edit-form .form-group > .col-sm-4:not(:has(.faupload)) {
    display: flex;
    flex-direction: column;
}

.lawfirm-edit-form .form-group > .col-sm-4:not(:has(.faupload)) > .form-control,
.lawfirm-edit-form .form-group > .col-sm-4:not(:has(.faupload)) > .input-group,
.lawfirm-edit-form .form-group > .col-sm-4:not(:has(.faupload)) > .bootstrap-select {
    flex: 0 0 auto;
}

.lawfirm-edit-form .lawfirm-row-upload > .control-label {
    padding-top: 10px;
}

.lawfirm-edit-form .input-narrow {
    max-width: 180px;
}

.lawfirm-edit-form .lawfirm-area-select {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.lawfirm-edit-form .lawfirm-area-select .form-control {
    flex: 1 1 0;
    min-width: 120px;
    max-width: none;
    margin: 0;
}

.lawfirm-edit-form .layer-footer {
    margin-top: 4px;
    padding-top: 0;
    border-top: none;
}

.lawfirm-edit-form .layer-footer .btn-primary {
    min-width: 120px;
    padding: 8px 28px;
    font-weight: 600;
    border-radius: 6px;
}

.lawfirm-edit-form .faupload-preview {
    margin: 0;
}

.lawfirm-edit-form .faupload-preview a:first-child {
    height: 88px;
}

.lawfirm-edit-form .faupload-preview a img {
    height: 88px;
    object-fit: cover;
}

/* 旗下律师嵌套表 */
.lawfirm-edit-form .form-group-firm-lawyers {
    margin-bottom: 8px;
}

.lawfirm-edit-form .firm-lawyer-empty {
    margin: 0;
    padding: 18px 12px;
    text-align: center;
    background: #fafbfc;
    border: 1px dashed #e2e8f0;
    border-radius: 8px;
    color: #94a3b8;
    font-size: 13px;
}

.lawfirm-edit-form .firm-lawyer-panel {
    border: 1px solid #e8ecf1;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.lawfirm-edit-form .firm-lawyer-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 14px;
    background: #f8fafc;
    border-bottom: 1px solid #eef0f3;
    font-size: 12px;
    line-height: 1.4;
}

.lawfirm-edit-form .firm-lawyer-panel-title {
    color: #334155;
    font-weight: 600;
}

.lawfirm-edit-form .firm-lawyer-panel-count {
    color: #94a3b8;
    background: #f1f5f9;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
}

.lawfirm-edit-form .firm-lawyer-wrap {
    margin-bottom: 0;
    max-height: 260px;
    overflow: auto;
}

.lawfirm-edit-form .firm-lawyer-table {
    margin-bottom: 0;
    font-size: 12px;
    background: #fff;
    table-layout: fixed;
    width: 100%;
    border: none;
}

.lawfirm-edit-form .firm-lawyer-table > thead > tr > th,
.lawfirm-edit-form .firm-lawyer-table > tbody > tr > td {
    border-left: none;
    border-right: none;
}

.lawfirm-edit-form .firm-lawyer-table th {
    background: #f8fafc;
    color: #64748b;
    font-weight: 600;
    padding: 9px 12px;
    white-space: nowrap;
    border-bottom: 1px solid #eef0f3;
    border-top: none;
}

.lawfirm-edit-form .firm-lawyer-table td {
    padding: 10px 12px;
    vertical-align: middle !important;
    line-height: 1.45;
    border-color: #f1f5f9;
    color: #334155;
}

.lawfirm-edit-form .firm-lawyer-table tbody tr:hover > td {
    background: #f8fffe;
}

.lawfirm-edit-form .firm-lawyer-table .col-id { width: 52px; }
.lawfirm-edit-form .firm-lawyer-table .col-name { width: 120px; }
.lawfirm-edit-form .firm-lawyer-table .col-mobile { width: 110px; }
.lawfirm-edit-form .firm-lawyer-table .col-license { width: 128px; }
.lawfirm-edit-form .firm-lawyer-table .col-specialty { width: auto; }
.lawfirm-edit-form .firm-lawyer-table .col-area { width: 140px; }
.lawfirm-edit-form .firm-lawyer-table .col-status { width: 88px; }
.lawfirm-edit-form .firm-lawyer-table .col-op { width: 68px; }

.lawfirm-edit-form .firm-lawyer-name {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lawfirm-edit-form .firm-lawyer-name-text {
    vertical-align: middle;
    font-weight: 500;
}

.lawfirm-edit-form .firm-lawyer-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 8px;
    vertical-align: middle;
    border: 1px solid #e2e8f0;
}

.lawfirm-edit-form .firm-lawyer-mobile { white-space: nowrap; }

.lawfirm-edit-form .firm-lawyer-license,
.lawfirm-edit-form .firm-lawyer-specialty,
.lawfirm-edit-form .firm-lawyer-area {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lawfirm-edit-form .firm-lawyer-area { color: #64748b; }

.lawfirm-edit-form .firm-lawyer-status {
    display: inline-block;
    font-weight: normal;
    font-size: 11px;
    padding: 3px 8px;
    border-radius: 4px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.lawfirm-edit-form .firm-lawyer-table .label-normal { background: #18bc9c; }
.lawfirm-edit-form .firm-lawyer-table .label-auditing { background: #f39c12; }
.lawfirm-edit-form .firm-lawyer-table .label-hidden,
.lawfirm-edit-form .firm-lawyer-table .label-expired { background: #95a5a6; }
.lawfirm-edit-form .firm-lawyer-table .label-rejected { background: #e74c3c; }
.lawfirm-edit-form .firm-lawyer-table .label-draft,
.lawfirm-edit-form .firm-lawyer-table .label-approved,
.lawfirm-edit-form .firm-lawyer-table .label-withdrawn { background: #3498db; }

.lawfirm-edit-form .btn-lawyer-edit {
    border-radius: 4px;
    padding: 2px 8px;
    font-weight: 500;
}

@media (max-width: 767px) {
    .lawfirm-edit-form .control-label {
        text-align: left;
        padding-right: 0;
        padding-top: 0;
        margin-bottom: 4px;
    }

    .lawfirm-edit-form .lawfirm-form-section {
        padding: 12px 12px 2px;
    }

    .lawfirm-edit-form .input-narrow {
        max-width: none;
    }
}