/* Common controls only. Keep page layout, semantics, JS bindings and print unchanged. */
@media screen {
  body.erp-app .btn {
    font-family: var(--erp-font-sans);
    font-size: var(--erp-fs-sm) !important;
    font-weight: 500;
    line-height: 1.5;
    min-height: var(--erp-control-h);
    padding: var(--erp-sp-1) var(--erp-sp-3);
    border-radius: var(--erp-radius) !important;
    box-shadow: none !important;
    text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
  }
  body.erp-app .btn-sm {
    min-height: calc(var(--erp-control-h) - var(--erp-sp-1));
    padding: var(--erp-sp-1) var(--erp-sp-2);
  }
  body.erp-app .btn-lg { font-size: var(--erp-fs-lg) !important; }
  body.erp-app .btn:not(:disabled):not(.disabled):hover { transform: none !important; }
  body.erp-app .btn-primary {
    background: var(--erp-brand-60);
    border-color: var(--erp-brand-60);
    color: var(--erp-white);
  }
  body.erp-app .btn-primary:not(:disabled):not(.disabled):hover {
    background: var(--erp-brand-70);
    border-color: var(--erp-brand-70);
  }
  body.erp-app .btn-outline-primary {
    color: var(--erp-brand-60);
    border-color: var(--erp-brand-60);
    background: var(--erp-surface);
  }
  body.erp-app .btn-outline-primary:not(:disabled):not(.disabled):hover {
    color: var(--erp-brand-70);
    background: var(--erp-brand-10);
  }
  body.erp-app .btn-outline-secondary,
  body.erp-app .btn-outline-dark {
    color: var(--erp-gray-70);
    border-color: var(--erp-gray-30);
    background: var(--erp-surface);
  }
  body.erp-app .btn-outline-secondary:not(:disabled):not(.disabled):hover,
  body.erp-app .btn-outline-dark:not(:disabled):not(.disabled):hover {
    background: var(--erp-gray-10);
    color: var(--erp-gray-100);
    border-color: var(--erp-gray-50);
  }
  body.erp-app .btn-outline-primary.active,
  body.erp-app .btn-outline-primary.active:hover,
  body.erp-app .btn-check:checked + .btn-outline-primary,
  body.erp-app .btn-check:checked + .btn-outline-primary:hover {
    color: var(--erp-white);
    background: var(--erp-brand-60);
    border-color: var(--erp-brand-60);
  }
  body.erp-app .btn-outline-secondary.active,
  body.erp-app .btn-outline-secondary.active:hover,
  body.erp-app .btn-check:checked + .btn-outline-secondary {
    color: var(--erp-white);
    background: var(--erp-gray-70);
    border-color: var(--erp-gray-70);
  }
  body.erp-app .btn-check:focus-visible + .btn,
  body.erp-app .btn:focus-visible,
  body.erp-app .dropdown-item:focus-visible,
  body.erp-app .nav-tabs .nav-link:focus-visible,
  body.erp-app .nav-pills .nav-link:focus-visible {
    outline: 2px solid var(--erp-brand-60);
    outline-offset: 2px;
  }
  body.erp-app .btn:disabled,
  body.erp-app .btn.disabled { opacity: .55; }
  /* Retain Bootstrap's joined button-group edges. */
  body.erp-app .btn-group > .btn:not(:first-child),
  body.erp-app .input-group > .btn:not(:first-child) {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
  }
  body.erp-app .btn-group > .btn:not(:last-child),
  body.erp-app .input-group > .btn:not(:last-child) {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  body.erp-app .dropdown-menu {
    font-family: var(--erp-font-sans);
    font-size: var(--erp-fs-sm);
    border-color: var(--erp-gray-20);
    border-radius: var(--erp-radius);
    padding: var(--erp-sp-1);
    box-shadow: var(--erp-shadow-2);
  }
  body.erp-app .dropdown-item {
    font-size: var(--erp-fs-sm);
    padding: var(--erp-sp-2) var(--erp-sp-3);
    border-radius: var(--erp-radius-sm);
  }
  body.erp-app .dropdown-item:not(.disabled):not(:disabled):not(.active):hover {
    background: var(--erp-gray-10);
  }
  body.erp-app .dropdown-item.active {
    background: var(--erp-brand-60);
    color: var(--erp-white);
  }
  body.erp-app .dropdown-divider { border-color: var(--erp-gray-20); }
  body.erp-app .nav-tabs .nav-link,
  body.erp-app .nav-pills .nav-link {
    font-family: var(--erp-font-sans);
    font-size: var(--erp-fs-sm);
    font-weight: 500;
    border-radius: var(--erp-radius) !important;
    box-shadow: none !important;
    transform: none !important;
    min-height: var(--erp-control-h);
  }
  body.erp-app .nav-tabs .nav-link:not(.active):hover,
  body.erp-app .nav-pills .nav-link:not(.active):hover {
    background: var(--erp-brand-10);
  }
  body.erp-app .nav-tabs .nav-link {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
  }
  body.erp-app .nav-pills .nav-link.active {
    color: var(--erp-white) !important;
    background: var(--erp-brand-60) !important;
  }
  body.erp-app .page-link {
    font-family: var(--erp-font-sans);
    font-size: var(--erp-fs-sm);
    box-shadow: none;
  }
  @media (prefers-reduced-motion: reduce) {
    body.erp-app .btn { transition: none; }
  }
}