/* Ninja Neumorph - Original component behavior (Themesberg-like) */

/* Generic neumorphic surface */
.shadow-soft,
.card,
.modal-content,
.table,
.toast,
.alert,
.form-control,
.form-select,
select,
textarea {
  box-shadow: var(--nm-shadow-raised-sm);
}

/* Alerts */
.alert {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.85rem;
  background: var(--nm-surface);
  color: var(--nm-text);
  padding: 0.8rem 1rem;
}
.alert-primary { color: var(--nm-text); background: var(--nm-surface); }
.alert-secondary {
  color: var(--nm-text);
  background: color-mix(in srgb, var(--nm-accent) 10%, var(--nm-surface));
}
.alert-success {
  color: #1f2937;
  background: color-mix(in srgb, var(--nm-success) 10%, var(--nm-surface));
}
.alert-info {
  color: #1f2937;
  background: color-mix(in srgb, var(--nm-info) 10%, var(--nm-surface));
}
.alert-warning {
  color: #1f2937;
  background: color-mix(in srgb, var(--nm-warning) 10%, var(--nm-surface));
}
.alert-danger {
  color: #1f2937;
  background: color-mix(in srgb, var(--nm-danger) 10%, var(--nm-surface));
}

/* Badges */
.badge {
  font-weight: 500;
  font-size: 0.75rem;
  padding: 0.35rem 0.8rem;
  border-radius: 999px;
  border: 0;
  box-shadow: var(--nm-shadow-raised-sm);
}
.badge-primary { color: #fff; background: var(--nm-gradient-primary); }
.badge-secondary { color: var(--nm-text); background: var(--nm-surface-raised); }
.badge-success { color: #fff; background: var(--nm-gradient-success); }
.badge-info { color: #fff; background: var(--nm-gradient-info); }
.badge-warning { color: #fff; background: var(--nm-gradient-warning); }
.badge-danger { color: #fff; background: var(--nm-gradient-danger); }

/* Cards */
.card {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.55rem;
  background: var(--nm-surface);
  color: var(--nm-text);
}
.card-header,
.card-footer {
  background: transparent;
  border-color: var(--nm-border);
}

/* Forms */
.form-control,
.form-select,
select,
textarea {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.55rem;
  background: var(--nm-surface);
  color: var(--nm-text);
}
.form-control:focus,
.form-select:focus,
select:focus,
textarea:focus {
  border-color: var(--nm-border-strong);
  box-shadow: var(--nm-shadow-inset-sm);
  outline: 0;
}
.input-group > .form-control,
.input-group > .form-select {
  min-height: 2.5rem;
}

/* Navs / tabs */
.nav-tabs {
  border-bottom: 0;
  gap: 0.5rem;
}
.nav-tabs .nav-link {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.55rem;
  background: var(--nm-surface);
  color: var(--nm-text-secondary);
  box-shadow: var(--nm-shadow-raised-sm);
}
.nav-tabs .nav-link:hover,
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link.active {
  color: var(--nm-text);
  box-shadow: var(--nm-shadow-inset-sm);
  border-color: var(--nm-border-strong);
}

.nav-pills .nav-link {
  border-radius: 0.55rem;
  border: 0.0625rem solid var(--nm-border-strong);
  box-shadow: var(--nm-shadow-raised-sm);
  color: var(--nm-text-secondary);
}
.nav-pills .nav-link.active {
  color: var(--nm-text);
  background: var(--nm-surface);
  box-shadow: var(--nm-shadow-inset-sm);
}

/* Navbar */
.navbar {
  border-radius: 0;
}
.navbar .nav-link {
  color: var(--nm-text);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 500;
}
.navbar .dropdown-menu {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.55rem;
  background: var(--nm-surface);
  box-shadow: var(--nm-shadow-raised);
}
.navbar .dropdown-item {
  text-transform: uppercase;
  font-size: 0.85rem;
}

/* Pagination */
.pagination .page-link {
  border: 0;
  background: #e6e7ee;
  color: #31344b;
  box-shadow: 3px 3px 6px #b8b9be, -3px -3px 6px #ffffff;
  border-radius: 0.55rem;
  margin: 0 0.2rem;
}
.pagination .page-link:hover,
.pagination .page-item.active .page-link {
  box-shadow: inset 2px 2px 5px #b8b9be, inset -3px -3px 7px #ffffff;
  background: #e6e7ee;
  color: #525480;
}

/* Tables */
.table {
  color: var(--nm-text);
  background: var(--nm-surface);
  border-radius: 0.55rem;
  overflow: hidden;
}
.table th,
.table td {
  border-top: 0.0625rem solid var(--nm-border);
  border-color: var(--nm-border);
}
.table thead th {
  border-bottom: 0.125rem solid var(--nm-border-strong);
}
.table-hover tbody tr:hover {
  background: color-mix(in srgb, var(--nm-surface-raised) 70%, var(--nm-surface));
}

/* Accordion */
.accordion > .card {
  overflow: hidden;
}
.accordion .card-header {
  cursor: pointer;
}

/* Toggles, checks, radios */
.form-check-input,
input[type="checkbox"],
input[type="radio"] {
  width: 1.2rem;
  height: 1.2rem;
  border: 0;
  box-shadow: var(--nm-shadow-inset-sm);
  background: linear-gradient(145deg, var(--nm-surface-inset), var(--nm-surface));
}
.form-check-input:checked,
input[type="checkbox"]:checked,
input[type="radio"]:checked {
  background: var(--nm-gradient-primary);
}

/* Modals */
.modal-content {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.55rem;
  background: var(--nm-surface);
}
.modal-header,
.modal-footer {
  border-color: var(--nm-border);
}
.modal-backdrop.show {
  opacity: 0.5;
}

/* Spinner */
.spinner-border,
.spinner-grow {
  color: #7c3aed;
}

/* Toasts */
.toast {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.55rem;
  background: var(--nm-surface);
  color: var(--nm-text);
}
.toast-header {
  background: var(--nm-surface-raised);
  color: var(--nm-text);
  border-bottom: 0.0625rem solid var(--nm-border);
}

/* Tooltips / Popovers */
.tooltip .tooltip-inner,
.nm-tooltip {
  border-radius: 0.55rem;
  background: var(--nm-surface-raised);
  color: var(--nm-text);
  border: 0.0625rem solid var(--nm-border-strong);
  box-shadow: var(--nm-shadow-raised-sm);
}

.popover,
.nm-popover {
  border: 0.0625rem solid var(--nm-border-strong);
  border-radius: 0.55rem;
  background: var(--nm-surface);
  color: var(--nm-text);
  box-shadow: var(--nm-shadow-raised);
}
.popover-header {
  background: var(--nm-surface-raised);
  border-bottom: 0.0625rem solid var(--nm-border);
  color: var(--nm-text);
}