/**
 * Tessera Accounts — Dashonic theme bridge
 * Overrides Azia (BootstrapDash) fonts/colors to match Tickets (Dashonic).
 * Load AFTER azia.css / bootstrap.
 */

@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap");

:root {
  --tessera-navy: #03314d;
  --tessera-navy-deep: #022a42;
  --tessera-body-bg: #f5f6f8;
  --tessera-surface: #ffffff;
  --tessera-ink: #1b2834;
  --tessera-muted: #5c6b7a;
  --tessera-accent: #5b73e8;
  --tessera-accent-soft: rgba(91, 115, 232, 0.12);
  --tessera-border: #e2e5e8;
  --tessera-font: "Roboto", sans-serif;
  --tessera-fs: 0.875rem; /* 14px — Dashonic body */
  --tessera-fs-sm: 0.8125rem; /* 13px */
  --tessera-fs-nav: 14.4px;
}

html,
body,
body.az-body,
body.sr-platform-body {
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: var(--tessera-ink) !important;
  background-color: var(--tessera-body-bg) !important;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.az-content-label,
.az-content-title,
.card-title,
.page-title,
.modal-title {
  font-family: var(--tessera-font) !important;
  color: var(--tessera-ink) !important;
  font-weight: 500 !important;
}

p, span, label, td, th, li, a, input, select, textarea, button,
.form-control, .btn, .nav-link, .dropdown-item, .table {
  font-family: var(--tessera-font) !important;
}

/* Remap Azia purple → Dashonic accent */
.btn-primary,
.bg-primary,
.badge-primary,
.az-sidebar .nav-link.active,
.nav-pills .nav-link.active,
.page-item.active .page-link,
a.text-primary {
  background-color: var(--tessera-accent) !important;
  border-color: var(--tessera-accent) !important;
  color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #4a63d6 !important;
  border-color: #4a63d6 !important;
}

.text-primary,
.az-icon-box .az-icon-box-icon,
a:not(.btn):not(.nav-link):not(.sr-module-link).text-primary {
  color: var(--tessera-accent) !important;
}

.btn-outline-primary {
  color: var(--tessera-accent) !important;
  border-color: var(--tessera-accent) !important;
  background: transparent !important;
}
.btn-outline-primary:hover {
  background: var(--tessera-accent) !important;
  color: #fff !important;
}

/* Layout chrome leftovers from Azia */
.az-header,
.az-navbar,
.az-sidebar {
  display: none !important;
}

.az-content {
  margin-left: 0 !important;
  padding-top: 0 !important;
  background: var(--tessera-body-bg) !important;
  min-height: calc(100vh - 140px);
}

.az-content-body,
.az-content-body-left {
  background: transparent !important;
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs) !important;
}

.az-content-label {
  font-size: var(--tessera-fs-sm) !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--tessera-muted) !important;
}

.az-content-title {
  font-size: 1.25rem !important;
}

/* Cards / panels → Dashonic-like surfaces */
.card,
.az-card,
.az-content-body .card {
  background: var(--tessera-surface) !important;
  border: 1px solid var(--tessera-border) !important;
  border-radius: 0.35rem !important;
  box-shadow: 0 1px 2px rgba(3, 49, 77, 0.04) !important;
  font-family: var(--tessera-font) !important;
}

.card-header,
.card-body,
.card-footer {
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs) !important;
}

.card-header {
  background: #fff !important;
  border-bottom: 1px solid var(--tessera-border) !important;
  color: var(--tessera-ink) !important;
}

/* Forms */
.form-control,
.custom-select,
.select2-container--default .select2-selection--single {
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs) !important;
  color: var(--tessera-ink) !important;
  border-color: var(--tessera-border) !important;
  border-radius: 0.25rem !important;
  min-height: 36px;
}

.form-control:focus {
  border-color: var(--tessera-accent) !important;
  box-shadow: 0 0 0 0.15rem var(--tessera-accent-soft) !important;
}

.btn {
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs) !important;
  font-weight: 500 !important;
  border-radius: 0.25rem !important;
}

/* Tables */
table.dataTable,
.table {
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs) !important;
  color: var(--tessera-ink) !important;
}

table.dataTable thead th,
.table thead th {
  font-weight: 500 !important;
  color: var(--tessera-muted) !important;
  border-bottom-color: var(--tessera-border) !important;
  background: #fafbfc !important;
}

table.dataTable tbody td,
.table td {
  border-color: var(--tessera-border) !important;
  vertical-align: middle;
}

/* Footer */
.az-footer,
.footer {
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs-sm) !important;
  color: var(--tessera-muted) !important;
  background: transparent !important;
  border-top: 1px solid var(--tessera-border) !important;
}

/* Links inside content */
.az-content a:not(.btn):not(.nav-link):not(.sr-module-link):not(.page-link) {
  color: var(--tessera-accent);
}

/* Kill Azia purple washes / gradients on content wrappers */
.az-content::before,
.az-body::before {
  display: none !important;
}

/* Ensure topbar module nav keeps Dashonic sizing (Accounts ops nav) */
#page-topbar,
#page-topbar * {
  font-family: var(--tessera-font) !important;
}

#page-topbar .topnav .navbar-nav .nav-link {
  font-size: var(--tessera-fs-nav) !important;
  font-weight: 400 !important;
}

/* Select2 dropdown readability */
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: var(--tessera-accent) !important;
}

.select2-dropdown {
  font-family: var(--tessera-font) !important;
  font-size: var(--tessera-fs) !important;
}

/* Modal */
.modal-content {
  font-family: var(--tessera-font) !important;
  border-radius: 0.35rem !important;
  border-color: var(--tessera-border) !important;
}

/* Pagination */
.page-link {
  color: var(--tessera-accent) !important;
  font-family: var(--tessera-font) !important;
}
.page-item.active .page-link {
  background-color: var(--tessera-accent) !important;
  border-color: var(--tessera-accent) !important;
  color: #fff !important;
}