/* Shared ARS button palette from /home/data/ars-ferienhaus/button.html. */
.btn,
.btn-sm:not(.btn) {
  --button-bg: #303030;
  --button-color: #ffffff;
  --button-hover: #3d3d3d;
  min-height: 42px;
  height: auto;
  padding: 0 17px;
  border: 0;
  border-radius: 8px;
  background: var(--button-bg);
  color: var(--button-color);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  transition: background-color .14s ease, color .14s ease, transform .08s ease;
}

.btn:is(.primary, .btn-primary),
.btn-sm:is(.primary, .btn-primary) {
  --button-bg: #2f6fb8;
  --button-color: #ffffff;
  --button-hover: #3b7fc9;
  background: var(--button-bg);
  color: var(--button-color);
}

.btn:is(.secondary, .btn-secondary),
.btn-sm:is(.secondary, .btn-secondary) {
  --button-bg: #515151;
  --button-color: #eeeeee;
  --button-hover: #626262;
  background: var(--button-bg);
  color: var(--button-color);
}

.btn:is(.success, .btn-success),
.btn-sm:is(.success, .btn-success) {
  --button-bg: #527e5d;
  --button-color: #ffffff;
  --button-hover: #608e6b;
  background: var(--button-bg);
  color: var(--button-color);
}

.btn:is(.danger, .btn-danger),
.btn-sm:is(.danger, .btn-danger) {
  --button-bg: #a94f58;
  --button-color: #ffffff;
  --button-hover: #bb5b65;
  background: var(--button-bg);
  color: var(--button-color);
}

.btn:is(.warning, .btn-warning),
.btn-sm:is(.warning, .btn-warning) {
  --button-bg: #694a17;
  --button-color: #ffd58b;
  --button-hover: #78541a;
  background: var(--button-bg);
  color: var(--button-color);
}

.btn:is(.info, .btn-info),
.btn-sm:is(.info, .btn-info) {
  --button-bg: #164e63;
  --button-color: #b8edff;
  --button-hover: #1c667f;
  background: var(--button-bg);
  color: var(--button-color);
}

.btn:is(.violet, .btn-violet),
.btn-sm:is(.violet, .btn-violet) {
  --button-bg: #35254d;
  --button-color: #d9bcff;
  --button-hover: #4b326f;
  background: var(--button-bg);
  color: var(--button-color);
}

/* The frontend has a stronger primary rule for its application area. */
.ars-app .btn:is(.primary, .btn-primary) {
  background: var(--button-bg);
  color: var(--button-color);
  border-color: transparent;
}

.btn:not(.outline, .modal-close):hover:not(:disabled, .is-disabled),
.btn-sm:not(.outline, .modal-close):hover:not(:disabled, .is-disabled) {
  background: var(--button-hover);
  color: var(--button-color);
  border-color: transparent;
  filter: none;
}

/* An X always signals closing a panel or dialog. Keep it visibly Danger. */
.btn:is(.danger, .btn-danger):is(.modal-close, .app-modal-close):hover:not(:disabled),
.btn-sm:is(.danger, .btn-danger):is(.modal-close, .app-modal-close):hover:not(:disabled) {
  background: #bb5b65;
  color: #ffffff;
  border-color: transparent;
}

.gallery-fullscreen-close,
.lightbox-close,
.drawer-close,
.thumb-settings-close,
.nav-open .mobile-menu-btn,
.menu-open .menu-toggle,
body.desktop-burger-nav.nav-open .mobile-menu-btn,
body.desktop-burger-nav .drawer-close {
  background: #a94f58;
  color: #ffffff;
  border-color: transparent;
}

.gallery-fullscreen-close:hover,
.lightbox-close:hover,
.drawer-close:hover,
.thumb-settings-close:hover,
.nav-open .mobile-menu-btn:hover,
.menu-open .menu-toggle:hover,
body.desktop-burger-nav.nav-open .mobile-menu-btn:hover,
body.desktop-burger-nav .drawer-close:hover {
  background: #bb5b65;
  color: #ffffff;
  border-color: transparent;
}

.btn:active:not(:disabled, .is-disabled),
.btn-sm:active:not(:disabled, .is-disabled) {
  transform: translateY(1px);
}

.btn:focus-visible,
.btn-sm:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 3px;
}

.btn:disabled,
.btn.is-disabled,
.btn-sm:disabled,
.btn-sm.is-disabled {
  opacity: .5;
  cursor: not-allowed;
}

.btn :is(svg, .icon),
.btn-sm :is(svg, .icon) {
  width: 17px;
  height: 17px;
  flex: 0 0 17px;
}

.btn:is(.icon, .btn-icon, .icon-button),
.btn-sm:is(.icon, .btn-icon, .icon-button) {
  width: 42px;
  min-width: 42px;
  max-width: 42px;
  padding: 0;
}

@media (prefers-reduced-motion: reduce) {
  .btn,
  .btn-sm { transition: none; }
}