/* Shared application controls. Keep document/print geometry in its own styles. */
@media screen {
  body.zentera-ui {
    --ui-font: "Noto Sans KR", "Malgun Gothic", sans-serif;
    --ui-control-height: 40px;
    --ui-control-radius: 8px;
    --ui-border: #cbd5e1;
    --ui-surface: var(--card, #fff);
    --ui-text: var(--text, #111827);
    --ui-muted: var(--muted, #64748b);
    --ui-accent: #2563eb;
    --ui-search-bg: #f1f5f9;
    --ui-search-hover-bg: #e2e8f0;
    font-family: var(--ui-font);
    font-size: 14px;
    line-height: 1.5;
  }
  html.dark body.zentera-ui, body.zentera-ui.dark {
    --ui-border: #556174;
    --ui-surface: var(--card, #2a3143);
    --ui-text: var(--text, #ebf0ff);
    --ui-muted: var(--muted, #a4b1cc);
    --ui-accent: #a59aff;
    --ui-search-bg: #364155;
    --ui-search-hover-bg: #445168;
  }
  .zentera-ui :is(button, input, select, textarea) { font-family: var(--ui-font); }
  .zentera-ui :is(.ui-reference-title, .admin-topbar-title h1, .user-form-title, .user-form-intro h2) {
    font-size: 24px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
  }
  .zentera-ui :is(.card-title, .modal-title, .user-form-section-title) {
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
  }
  .zentera-ui :is(.form-group > label, .ui-field-label, .checklist-field > label) {
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5;
  }
  .zentera-ui :is(.form-text, .text-muted, .ui-reference-subtitle, .password-feedback) {
    font-size: 13px;
    line-height: 1.5;
  }
  .zentera-ui :is(input:not([type]), input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], input[type=search], input[type=url], input[type=date], input[type=month], input[type=time], input[type=datetime-local], input[type=file], select, textarea) {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    min-height: var(--ui-control-height) !important;
    height: var(--ui-control-height) !important;
    padding: 8px 12px !important;
    border: 1px solid var(--ui-border) !important;
    border-radius: var(--ui-control-radius) !important;
    background-color: var(--ui-surface) !important;
    color: var(--ui-text) !important;
    font-size: 14px !important;
    font-weight: 400;
    line-height: 1.5 !important;
  }
  .zentera-ui select { padding-right: 30px !important; }
  .zentera-ui :is(.keyword-field, .staff-keyword) { position: relative; min-width: 0; }
  .zentera-ui :is(.keyword-field, .staff-keyword) > input.form-control {
    width: 100%;
    padding-left: 40px !important;
  }
  .zentera-ui :is(.keyword-field, .staff-keyword) > i.fa-search {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    line-height: 1;
    text-align: center;
    font-size: 13px;
    color: var(--ui-muted);
    pointer-events: none;
  }
  body.zentera-ui .select2-container--default .select2-selection--single {
    height: var(--ui-control-height) !important;
    border: 1px solid var(--ui-border) !important;
    border-radius: var(--ui-control-radius) !important;
    background: var(--ui-surface) !important;
  }
  body.zentera-ui .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding-left: 12px !important;
    color: var(--ui-text) !important;
    font-size: 14px !important;
    line-height: calc(var(--ui-control-height) - 2px) !important;
  }
  body.zentera-ui .select2-container--default .select2-selection--single .select2-selection__arrow { height: calc(var(--ui-control-height) - 2px) !important; }
  .zentera-ui textarea:not([hidden]) {
    height: auto !important;
    min-height: 96px !important;
    resize: vertical;
  }
  .zentera-ui select[multiple], .zentera-ui select[size]:not([size="1"]) { height: auto !important; min-height: 96px !important; }
  .zentera-ui :is(input, textarea)::placeholder { color: var(--ui-muted) !important; opacity: .8 !important; }
  .zentera-ui :is(input, select, textarea):focus-visible {
    border-color: var(--ui-accent) !important;
    outline: 2px solid var(--ui-accent) !important;
    outline-offset: 2px;
    box-shadow: none !important;
  }
  .zentera-ui :is(input, select, textarea):is(:disabled, [readonly]) {
    background-color: var(--panel, #f1f5f9) !important;
    color: var(--ui-muted) !important;
    cursor: default;
  }
  .zentera-ui :is(input, select, textarea):is(.is-invalid, [aria-invalid="true"]) { border-color: #dc3545 !important; }
  .zentera-ui :is(input, select, textarea).is-valid { border-color: #16a34a !important; }
  .zentera-ui :is(input[type=checkbox], input[type=radio]) { accent-color: var(--ui-accent); }
  .zentera-ui :is(.btn, .ui-primary-action, .checklist-btn, .hazard-form-submit, .hazard-form-cancel, .hazard-view-btn, .ui-button) {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: var(--ui-control-height) !important;
    height: auto !important;
    min-width: 80px;
    max-width: 100%;
    padding: 8px 16px !important;
    border-radius: var(--ui-control-radius) !important;
    font-family: var(--ui-font);
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    text-align: center;
    text-decoration: none;
    white-space: normal;
    cursor: pointer;
  }
  .zentera-ui :is(.btn-primary, .ui-primary-action, .hazard-form-submit) {
    background: #2563eb !important;
    border: 1px solid #2563eb !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  .zentera-ui :is(.btn-primary, .ui-primary-action, .hazard-form-submit):hover { background: #1d4ed8 !important; }
  body.zentera-ui .ui-search-btn {
    background: var(--ui-search-bg) !important;
    border: 1px solid var(--ui-border) !important;
    color: var(--ui-text) !important;
    box-shadow: none !important;
  }
  body.zentera-ui .ui-search-btn:is(:hover, :active) {
    background: var(--ui-search-hover-bg) !important;
    border-color: var(--ui-muted) !important;
    color: var(--ui-text) !important;
  }
  .zentera-ui :is(.btn-outline-secondary, .hazard-form-cancel) {
    background: var(--ui-surface) !important;
    color: var(--ui-text) !important;
    border: 1px solid var(--ui-border) !important;
  }
  .zentera-ui :is(.btn, .ui-primary-action, .ui-button):focus-visible {
    outline: 2px solid var(--ui-accent);
    outline-offset: 3px;
  }
  .zentera-ui :is(.btn, .ui-primary-action, .ui-button):is(:disabled, .disabled, .btn-disabled) { opacity: .55; cursor: not-allowed; }
  .zentera-ui :is(.btn-sm, .btn-group-sm > .btn, td .btn) {
    min-height: 32px !important;
    min-width: 56px;
    padding: 5px 10px !important;
    font-size: 13px !important;
  }
  .zentera-ui .input-group > :is(.input-group-append, .input-group-prepend) > .btn { height: 100% !important; }
  .zentera-ui :is(.ui-form-actions, .user-form-actions, .form-actions-bottom, .checklist-actions, .hazard-form-actions) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding-top: 16px;
    margin-top: 24px;
    border-top: 1px solid var(--ui-border);
  }
  .zentera-ui :is(.ui-form-actions, .checklist-actions, .hazard-form-actions) > :is(button[type=submit], .ui-actions-primary) { margin-left: auto; }
  .zentera-ui :is(.user-form-actions-right, .form-actions-bottom-right, .form-actions-bottom-left, .modal-footer) {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
  }
  .zentera-ui :is(.user-form-actions-right, .form-actions-bottom-right) { margin-left: auto; }
  .zentera-ui .modal-footer { justify-content: flex-end; }
  .zentera-ui .modal-footer > * { margin: 0; }
  .zentera-ui :is(.ui-filter-row, .ui-search-row) { gap: 12px; }
  .zentera-ui .theme-label { white-space: nowrap; }
  @media (max-width: 620px) {
    body.zentera-ui { --ui-control-height: 44px; }
    body.zentera-ui .select2-container--default .select2-selection--single .select2-selection__rendered { font-size: 16px !important; }
    .zentera-ui :is(input:not([type]), input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], input[type=search], input[type=url], input[type=date], input[type=month], input[type=time], input[type=datetime-local], select, textarea) { font-size: 16px !important; }
    .zentera-ui :is(.ui-reference-title, .admin-topbar-title h1, .user-form-title, .user-form-intro h2) { font-size: 22px !important; }
    .zentera-ui :is(.ui-form-actions, .user-form-actions, .form-actions-bottom, .checklist-actions, .hazard-form-actions) > * { min-width: 0; }
    .zentera-ui :is(.user-form-actions, .form-actions-bottom) .btn { width: auto !important; }
    .zentera-ui :is(.btn-sm, .btn-group-sm > .btn, td .btn) { min-height: 40px !important; }
  }
}
