/*
 * Traxigo colours for the Frappe desk and website (login page).
 * Installed by scripts/frappe/install_theme.sh as the `traxigo_theme` app's
 * app_include_css + web_include_css. Frappe's own palette is driven by CSS
 * variables, so most of this is re-pointing those; the rest covers the few
 * places Frappe hard-codes a blue.
 */
:root,
[data-theme="light"] {
  --traxigo: #1677FF;
  --traxigo-dark: #08529A;
  --traxigo-accent: #16A34A;
  --traxigo-tint: #E8F1FF;

  --primary: var(--traxigo);
  --primary-color: var(--traxigo);
  --btn-primary: var(--traxigo);
  --blue-500: var(--traxigo);
  --blue-600: var(--traxigo-dark);
  --blue-400: #4D95FF;
  --blue-300: #8DB9FF;
  --blue-200: #C2DAFF;
  --blue-100: var(--traxigo-tint);
  --blue-50: #F3F8FF;
  --blue-avatar-bg: var(--traxigo-tint);
  --blue-avatar-color: var(--traxigo-dark);
  --sidebar-select-color: var(--traxigo-tint);
  --checkbox-color: var(--traxigo);
  --checkbox-focus-shadow: 0 0 0 2px var(--blue-200);
  --link-color: var(--traxigo-dark);
  --text-on-blue: var(--traxigo-dark);
  --bg-blue: var(--traxigo-tint);
  --control-bg-on-gray: #fff;
}

[data-theme="dark"] {
  --primary: var(--traxigo);
  --primary-color: var(--traxigo);
  --btn-primary: var(--traxigo);
  --blue-500: var(--traxigo);
  --blue-600: #4D95FF;
  --link-color: #8DB9FF;
}

/* Buttons */
.btn-primary,
.btn.btn-primary,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active,
.page-form .btn-primary,
.form-footer .btn-primary {
  background-color: var(--traxigo) !important;
  border-color: var(--traxigo) !important;
  color: #fff !important;
}
.btn-primary:hover { background-color: var(--traxigo-dark) !important; border-color: var(--traxigo-dark) !important; }
.btn-primary-light, .btn.btn-primary-light { background-color: var(--traxigo-tint) !important; color: var(--traxigo-dark) !important; }

/* Navbar: white with a Traxigo line, logo scaled */
.navbar { border-bottom: 2px solid var(--traxigo) !important; }
.navbar .navbar-brand img, .navbar .app-logo { max-height: 34px; width: auto; }

/* Sidebar / list selection, links, tabs, indicators */
.desk-sidebar .desk-sidebar-item.selected,
.standard-sidebar-item.selected,
.sidebar-item.selected,
.layout-side-section .sidebar-item.selected {
  background-color: var(--traxigo-tint) !important;
  color: var(--traxigo-dark) !important;
}
a, .link, .list-row .level-left a.ellipsis:hover { color: var(--traxigo-dark); }
.form-tabs-list .nav-link.active, .nav-tabs .nav-link.active { border-bottom-color: var(--traxigo) !important; color: var(--traxigo-dark) !important; }
.indicator-pill.blue, .indicator.blue, .indicator-pill.blue::before { background-color: var(--traxigo-tint); color: var(--traxigo-dark); }
.widget.onboarding-widget-box, .widget .widget-head .widget-title { color: inherit; }
.progress-bar, .progress .progress-bar { background-color: var(--traxigo) !important; }
input[type="checkbox"]:checked { background-color: var(--traxigo) !important; border-color: var(--traxigo) !important; }
.form-control:focus, .frappe-control input:focus { border-color: var(--traxigo) !important; box-shadow: 0 0 0 2px var(--blue-200) !important; }

/* Login page (website) */
.for-login .page-card, .login-content .page-card { border-top: 4px solid var(--traxigo); }
.for-login .btn-login, .for-login .btn-primary, .page-card .btn-primary { background-color: var(--traxigo) !important; border-color: var(--traxigo) !important; }
.for-login .page-card-head img, .login-content img.app-logo { max-height: 56px; }
.btn-login-option { border-color: var(--traxigo) !important; color: var(--traxigo-dark) !important; }