/* Nút hành động dùng chung: nút thường trắng–xám, hành động chính xanh dương.
   Giữ tên class nghiệp vụ để các module tiếp tục bật/tắt quyền và trạng thái.
   Màu trạng thái/toast vẫn dùng --act-*; màu nút lấy từ --button-* / --btn-primary. */

.btn-base,
.btn-add, .btn-edit, .btn-delete, .btn-save, .btn-print,
.btn-cancel, .btn-default, .btn-search, .btn-call, .btn-ok,
.ft-btn, .ws-btn,
.nk-btn, .xk-btn, .kk-btn, .dc-btn, .dt-btn, .bl-btn, .tl-btn, .th-btn, .nv-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: var(--ft-btn-h, 30px);
  padding: 0 14px;
  border: 1px solid var(--button-border);
  border-radius: var(--radius-sm, 2px);
  font-size: var(--fs-sm, 12px);
  font-weight: var(--fw-semibold, 600);
  font-family: var(--font-ui);
  cursor: pointer;
  white-space: nowrap;
  transition: background-color .15s, border-color .15s;
}

.btn-sm { height: 26px; padding: 0 10px; font-size: 11px; }
.btn-icon { width: var(--ft-btn-h, 30px); padding: 0; }
.btn-icon.btn-sm { width: 26px; }

/* !important trong layer thắng màu !important không có layer ở CSS module,
   kể cả module nạp sau / dùng selector ID. Không ép display, size hay quyền.
   Chỉ nhận diện nút hành động, không phủ lên tab, chọn trạng thái, điều hướng,
   nút đóng/phóng to cửa sổ, switch hay toolbar của thư viện soạn thảo. */
@layer clinic-buttons {
  :is(
    .btn, .button, .btn-base, .btn-add, .btn-edit, .btn-delete, .btn-save,
    .btn-print, .btn-cancel, .btn-default, .btn-search, .btn-call, .btn-ok,
    .ft-btn, .ws-btn, .nk-btn, .xk-btn, .kk-btn, .dc-btn, .dt-btn,
    .bl-btn, .tl-btn, .th-btn, .nv-btn, .pqx-btn, .report-btn, .mat-btn,
    .kb-search-btn, .tbtn, .qbtn, .iconbtn, .dmh-primary, .dmh-ghost,
    button.save, button.primary,
    .rp-main-btn, .rp-arrow-btn, .his-toast-b-primary,
    .his-toast-b-secondary, .his-toast-b-danger,
    :is(button, a, input):is(
      [class$="-btn"], [class*="-btn "], [class*="-btn-"],
      [class^="btn-"], [class*=" btn-"], [class$="-icon-action"],
      [class$="-save"], [class$="-primary"], [class$="-search"], [class$="-reload"]
    )
  ):not(
    .btn-link, .close, [role="tab"], [aria-pressed], [aria-selected],
    [class*="toggle"], [class*="switch"], [class*="close"], [class*="collapse"],
    [class*="tab-btn"], [class*="nav-btn"], [class*="win-btn"]
  ) {
    --action-bg: var(--button-bg);
    --action-hover: var(--button-hover);
    --action-active: var(--button-active);
    --action-text: var(--button-text);
    --action-border: var(--button-border);
    background: var(--action-bg) !important;
    color: var(--action-text) !important;
    border: 1px solid var(--action-border) !important;
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    transform: none !important;

    /* Primary/save là vai trò chủ đạo hiện có; success/ok là xác nhận.
       Add cũng là thao tác chính: Thêm và Lưu xuất hiện cùng lúc trên một thanh nút,
       nên cùng dùng màu chính. Edit/print/delete/cancel không tự trở thành nút chính. */
    &:is(
      .btn-primary, .btn-save, .btn-ok, .btn-add, .primary, .save, .success, .ok, .add,
      [class$="-primary"], [class*="-primary "],
      [class$="-save"], [class*="-save "],
      [class$="-add"], [class*="-add "]
    ):not(.danger, .delete, .cancel, .btn-delete, .btn-cancel, .btn-danger, #btnKeDV),
    &#globalConfirmOk {
      --action-bg: var(--btn-primary);
      --action-hover: var(--btn-primary-hover);
      --action-active: var(--btn-primary-hover);
      --action-text: var(--btn-on);
      --action-border: var(--btn-primary);
    }

    /* Ngoại lệ dialog xác nhận: Đồng ý xanh, Hủy đỏ. */
    &#globalConfirmCancel {
      --action-bg: var(--btn-danger);
      --action-hover: var(--btn-danger-hover);
      --action-active: var(--btn-danger-hover);
      --action-text: var(--btn-on);
      --action-border: var(--btn-danger);
    }

    /* Xóa khám nổi bật bằng chữ/icon đỏ, không thêm nền màu đặc. */
    &#btnXoaLuotKham {
      --action-text: var(--btn-danger);
      --action-border: color-mix(in srgb, var(--btn-danger) 40%, var(--button-bg));
    }

    &:hover:not(:disabled, .disabled, [aria-disabled="true"], .buttondeactive) {
      background: var(--action-hover) !important;
    }

    &:active:not(:disabled, .disabled, [aria-disabled="true"], .buttondeactive) {
      background: var(--action-active) !important;
    }

    &:focus-visible {
      outline: 2px solid var(--btn-primary) !important;
      outline-offset: 2px !important;
    }

    &:is(:disabled, .disabled, [aria-disabled="true"], .buttondeactive) {
      opacity: .5 !important;
      cursor: not-allowed !important;
    }

    & :is(i, span) { color: inherit !important; }
  }

  /* Kính lúp trong .loc-search là phần nằm bên trong viền input, không phải nút hành động độc lập. */
  .loc-filter .loc-input.loc-search > button {
    --action-bg: transparent;
    --action-hover: var(--brand-soft);
    --action-active: var(--brand-soft);
    --action-text: var(--muted);
    background: transparent !important;
    color: var(--muted) !important;
    border: 0 !important;
  }
  .loc-filter .loc-input.loc-search > button:hover { background: var(--brand-soft) !important; color: var(--brand) !important; }
}

/* Thu/mở nhóm: chevron đơn, không khung; không áp cho phóng to cửa sổ hoặc dropdown. */
.btn-fold{display:inline-flex;align-items:center;justify-content:center;width:var(--h-input-sm);height:var(--h-input-sm);padding:0;cursor:pointer;color:var(--muted)}
@layer clinic-buttons {
  :is(.btn-fold, [data-group-expand-all], [data-group-collapse-all], [data-history-groups],
      .clsv2-iconbtn[data-left="expand"], .clsv2-iconbtn[data-left="collapse"],
      #dmcMoRongTat, #dmcThuGonTat, .wd-fgroup-all, #wdChatDeptAll,
      .kb-expand-btn, .nk-note-toggle, .xk-note-toggle, .mat-collapse-btn) {
    border:0!important;background:transparent!important;box-shadow:none!important;
    &:hover{background:var(--surface-hover)!important}
    &:focus-visible{outline:2px solid var(--focus-bd)!important;outline-offset:1px}
  }
  .btn-fold.btn-fold{width:var(--h-input-sm)!important;min-width:var(--h-input-sm)!important;height:var(--h-input-sm)!important;padding:0!important}
}