button,
input,
select,
textarea {
  font: inherit;
}

a {
  color: inherit;
}

.btn-ghost,
.action-btn,
.tiny-btn,
.pay-btn,
.tab-btn,
.section-nav-btn,
.msec-btn,
.catalog-tab,
.settings-tab,
.branch-btn,
.drawer-item,
.theme-choice,
.accent-choice {
  border-radius: var(--r-sm);
  transition:
    background .18s ease,
    border-color .18s ease,
    color .18s ease,
    box-shadow .18s ease,
    transform .18s ease,
    opacity .18s ease;
}

.btn-ghost,
.action-btn,
.tiny-btn,
.pay-btn,
.branch-btn,
.drawer-item {
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text);
}

.btn-ghost:hover,
.action-btn:hover,
.tiny-btn:hover,
.pay-btn:hover,
.branch-btn:hover,
.drawer-item:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--glow);
}

.btn-accent,
.btn-save,
.primary-btn,
.action-btn.primary,
.login-btn,
.send-data {
  border: 0;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  color: #fff;
  box-shadow: 0 4px 14px var(--glow);
}

.btn-accent:hover,
.btn-save:hover,
.primary-btn:hover,
.action-btn.primary:hover,
.login-btn:hover,
.send-data:hover {
  opacity: .92;
  transform: translateY(-1px);
}

.btn-save.teal,
.btn-accent.teal {
  background: linear-gradient(135deg, var(--accent2), var(--accent));
  color: var(--bg);
  box-shadow: 0 4px 14px var(--glow2);
}

.btn-save.orange,
.btn-accent.orange {
  background: linear-gradient(135deg, var(--accent4), var(--accent));
  color: var(--bg);
}

.btn-save.red,
.btn-accent.red,
.danger-btn {
  background: linear-gradient(135deg, var(--accent3), #e05555);
  color: #fff;
}

.tiny-btn.danger:hover,
.danger-btn:hover {
  border-color: var(--accent3);
  color: var(--accent3);
  background: rgba(255,107,107,.08);
}

.fi,
.fs,
.fta,
.search-input,
.select-like,
.input-like,
.settings-field input,
.settings-field select,
input.form-control,
select.form-control,
textarea.form-control {
  background: var(--panel);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: var(--r-sm);
}

.fi:focus,
.fs:focus,
.fta:focus,
.search-input:focus,
.select-like:focus,
.input-like:focus,
.settings-field input:focus,
.settings-field select:focus,
input.form-control:focus,
select.form-control:focus,
textarea.form-control:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px var(--glow);
  outline: none;
}

.badge-pill.purple,
.sec-badge.purple,
.ph-icon.purple,
.ch-icon.purple,
.fch-icon.purple,
.card-icon.purple,
.card-header-icon.purple {
  background: var(--glow);
  color: var(--accent);
}

.badge-pill.teal,
.sec-badge.teal,
.ph-icon.teal,
.ch-icon.teal,
.fch-icon.teal,
.card-icon.teal,
.card-header-icon.teal {
  background: var(--glow2);
  color: var(--accent2);
}

.badge-pill.orange,
.sec-badge.orange,
.ph-icon.orange,
.ch-icon.orange,
.fch-icon.orange,
.card-icon.orange {
  background: rgba(255,169,77,.14);
  color: var(--accent4);
}

.badge-pill.red,
.sec-badge.red,
.ph-icon.red,
.ch-icon.red,
.fch-icon.red,
.card-icon.red,
.card-header-icon.red {
  background: rgba(255,107,107,.12);
  color: var(--accent3);
}
