/* ============================================================================================
   EduLS — CHUẨN HÓA CHIỀU CAO FORM CONTROLS (Unified Control Heights)
   Nạp SAU style.css / ui-overlay.css để thắng các khai báo rải rác cũ.

   Hai cỡ duy nhất:
     --ctl-h     38px  Cỡ chuẩn   : <input>, <select>, nút CTA, bộ chọn ngày
     --ctl-h-sm  32px  Cỡ thu nhỏ : thanh lọc nhanh (.filter-bar) và nút phụ (.btn-sm)
   Màn hình cảm ứng (pointer: coarse) tăng đồng loạt lên 44 / 36px để dễ chạm — mọi control vẫn
   CÙNG chiều cao với nhau trong một hàng. (--ctl-h-std là cỡ chuẩn; --ctl-h là cỡ của hàng đang đứng.)

   Quy tắc "cùng một hàng thì cùng một chiều cao": chiều cao lấy từ biến --ctl-h của CONTAINER.
     .filter-bar / .ctl-compact  → cả hàng là 32px (ô lọc + nút trong hàng đều 32px)
     còn lại                     → cả hàng là 38px
   Nhờ vậy ô lọc và nút đứng cạnh nhau luôn thẳng mép, không bao giờ so le.
   ============================================================================================ */
:root {
  --ctl-h-std: 38px;
  --ctl-h-sm: 32px;
  --ctl-h: var(--ctl-h-std);
}
@media (pointer: coarse) {
  :root { --ctl-h-std: 44px; --ctl-h-sm: 36px; }
}
.filter-bar,
.ctl-compact { --ctl-h: var(--ctl-h-sm); align-items: center; }
/* Thanh header: bộ lọc nhanh + nút CTA cùng 1 hàng → cả hàng dùng cỡ chuẩn, kể cả .filter-bar đặt trong header */
.page-header-bar,
.page-header-bar .filter-bar { --ctl-h: var(--ctl-h-std); }

/* ---------- Ô nhập · ô chọn ---------- */
input.form-input, select.form-input, input.form-select, select.form-select,
.form-group select,
.form-group input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
.filter-bar select,
.filter-bar input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
.ctl-compact select,
.ctl-compact input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
.login-box input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.setting-control select,
.setting-control input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]),
.page-header-bar .ph-right select,
.page-header-bar .ph-right input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]):not([type="color"]):not([type="hidden"]) {
  box-sizing: border-box;
  height: var(--ctl-h);
  min-height: var(--ctl-h);
  padding-top: 0;
  padding-bottom: 0;
}

/* ---------- Nút ---------- */
/* min-height (không phải height) cho nút: đúng cỡ khi 1 dòng chữ, chỉ cao thêm khi nhãn phải xuống dòng — không cắt chữ. */
.btn:not(.btn-sm):not(.btn-dots-action),
.ui-btn-cta, .ui-btn-ghost,
.btn-danger-solid, .btn-outline-primary, .btn-outline-info, .btn-outline-danger, .btn-danger-ghost,
.profile-print-btn,
.btn-clear-month, .btn-qr-compact, .grade-dropdown-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  box-sizing: border-box; min-height: var(--ctl-h);
  padding-top: 0; padding-bottom: 0; line-height: 1.2;
}
.btn-sm, .btn.btn-sm {
  display: inline-flex; align-items: center; justify-content: center; gap: 5px;
  box-sizing: border-box; min-height: var(--ctl-h-sm);
  padding-top: 0; padding-bottom: 0; line-height: 1.2;
}
/* Nút trong hàng lọc: theo cỡ của hàng (32px) kể cả khi không có .btn-sm */
.filter-bar .btn, .ctl-compact .btn { height: var(--ctl-h-sm); min-height: var(--ctl-h-sm); align-self: center; white-space: nowrap; }
/* …nhưng trong thanh header (cỡ chuẩn) thì theo --ctl-h-std */
.page-header-bar .filter-bar .btn { height: var(--ctl-h-std); min-height: var(--ctl-h-std); }
/* Trong thanh header mọi nút đều cỡ chuẩn (kể cả .btn-sm để đứng thẳng hàng với ô lọc 38px) */
.page-header-bar .btn, .page-header-bar .btn-sm, .page-header-bar .ui-btn-cta, .page-header-bar .ui-btn-ghost { min-height: var(--ctl-h-std); }

.login-box button:not([type="button"]) { box-sizing: border-box; min-height: var(--ctl-h); padding-top: 0; padding-bottom: 0; display: inline-flex; align-items: center; justify-content: center; }

/* ---------- Trang landing / đăng nhập của tenant (CSS nội tuyến riêng trong index.html / login.html) ---------- */
.btn-login, .btn-lookup, .btn-enter-class, .btn-view-class, .btn-joinroom, .btn-submit {
  box-sizing: border-box; height: auto; min-height: var(--ctl-h);
  padding-top: 0; padding-bottom: 0;
  align-items: center; justify-content: center; white-space: nowrap;
}
.btn-login, .btn-lookup, .btn-enter-class, .btn-view-class, .btn-joinroom { display: inline-flex; }

/* ---------- Mobile: ô lọc không còn bị kéo lên 46px riêng lẻ (lệch với nút bên cạnh) ---------- */
@media (max-width: 640px) {
  .filter-bar select, .filter-bar input, .btn-sm { min-height: var(--ctl-h-sm); }
  .filter-bar select, .filter-bar input:not([type="checkbox"]):not([type="radio"]) { height: var(--ctl-h-sm); }
}
