/* Brand Colors */
:root {
  --brand-primary: #0b213d;
  --brand-secondary: #71babd;
  --brand-accent: #508687;
  --font-family-base: 'Barlow', sans-serif;
}

/* Typography - Barlow Font */
html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

body {
  font-family: var(--font-family-base);
  margin-bottom: 60px;
  color: var(--brand-primary);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-family-base);
  font-weight: 600;
  color: var(--brand-primary);
}

/* Ensure Barlow font is used throughout the app */
input, button, select, optgroup, textarea {
  font-family: var(--font-family-base);
}

/* Kendo UI Font Overrides - Ensure Barlow is used */
.k-widget,
.k-grid,
.k-grid-header,
.k-grid-content,
.k-grid-footer,
.k-grid th,
.k-grid td,
.k-grid-pager,
.k-pager,
.k-pager-info,
.k-dropdown,
.k-dropdownlist,
.k-input,
.k-button,
.k-toolbar,
.k-menu,
.k-panelbar,
.k-tabstrip,
.k-window,
.k-dialog,
.k-notification,
.k-tooltip,
.k-popup,
.k-list,
.k-listview,
.k-treeview,
.k-scheduler,
.k-chart,
.k-spreadsheet,
.k-editor,
.k-upload,
.k-datepicker,
.k-datetimepicker,
.k-timepicker,
.k-numerictextbox,
.k-textbox,
.k-textarea,
.k-autocomplete,
.k-combobox,
.k-multiselect,
.k-colorpicker,
.k-slider,
.k-switch,
.k-progressbar,
.k-card,
.k-badge,
.k-chip,
.k-avatar,
.k-breadcrumb,
.k-appbar,
.k-drawer,
.k-stepper,
.k-filter,
.k-form,
.k-table,
[class^="k-"],
[class*=" k-"] {
  font-family: var(--font-family-base);
}

html {
  position: relative;
  min-height: 100%;
}

/* Brand Primary Color Overrides */
.bg-primary {
  background-color: var(--brand-primary) !important;
}

.text-primary {
  color: var(--brand-primary) !important;
}

.btn-primary {
  background-color: var(--brand-primary);
  border-color: var(--brand-primary);
}

.btn-primary:hover, .btn-primary:focus {
  background-color: var(--brand-accent);
  border-color: var(--brand-accent);
}

.btn-primary:active {
  background-color: var(--brand-secondary);
  border-color: var(--brand-secondary);
}

/* Secondary/Accent Colors */
.btn-secondary {
  background-color: var(--brand-secondary);
  border-color: var(--brand-secondary);
  color: var(--brand-primary);
}

.btn-secondary:hover, .btn-secondary:focus {
  background-color: var(--brand-accent);
  border-color: var(--brand-accent);
  color: #fff;
}

/* Links */
a {
  color: var(--brand-accent);
}

a:hover {
  color: var(--brand-primary);
}

/* Navbar */
.navbar-brand {
  font-weight: 600;
}

.navbar-dark .navbar-nav .nav-link {
  color: rgba(255, 255, 255, 0.85);
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: var(--brand-secondary);
}

/* Focus States */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem var(--brand-secondary);
}

.form-control:focus {
  border-color: var(--brand-secondary);
}

/* Form Floating Labels */
.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* Card Styling */
.card-header.bg-primary {
  background-color: var(--brand-primary) !important;
}

/* Footer */
.footer {
  background-color: #f8f9fa;
}

.footer a {
  color: var(--brand-accent);
}