/*
 * LDT Technology theme
 * Colours are taken from the LDT logo:
 *   navy  #27617E  (wordmark, left half of the mark)
 *   teal  #0097B2  (right half of the mark)
 * Primary buttons use navy (white text stays readable), teal is the accent
 * for links, focus rings, checkboxes and active items.
 * Font: Inter, which matches the logo wordmark and is already Frappe's default.
 */

:root,
[data-theme="light"] {
	--ldt-navy: #27617e;
	--ldt-navy-dark: #1d4a61;
	--ldt-navy-tint: #e9f0f4;
	--ldt-teal: #0097b2;
	--ldt-teal-dark: #007f96;
	--ldt-teal-tint: #e5f5f8;

	--primary: var(--ldt-navy);
	--primary-color: var(--ldt-navy);
	--brand-color: var(--ldt-navy);
	--primary-light: var(--ldt-teal-tint);
	--btn-primary: var(--ldt-navy);
	--border-primary: var(--ldt-navy);
	--progress-bar-bg: var(--ldt-teal);
	--checkbox-color: var(--ldt-navy);
	--sidebar-select-color: var(--ldt-navy-tint);
	--focus-default: 0px 0px 0px 2px rgba(0, 151, 178, 0.35);
	--checkbox-focus-shadow: 0px 0px 0px 2px rgba(0, 151, 178, 0.35);
	--plyr-color-main: var(--ldt-teal);
}

[data-theme="dark"] {
	--ldt-navy: #3d86aa;
	--ldt-navy-dark: #2f6f8f;
	--ldt-navy-tint: rgba(61, 134, 170, 0.22);
	--ldt-teal: #22b8d3;
	--ldt-teal-dark: #0097b2;
	--ldt-teal-tint: rgba(34, 184, 211, 0.16);

	--primary: var(--ldt-teal);
	--primary-color: var(--ldt-teal);
	--brand-color: var(--ldt-teal);
	--primary-light: var(--ldt-teal-tint);
	--btn-primary: var(--ldt-navy);
	--border-primary: var(--ldt-teal);
	--progress-bar-bg: var(--ldt-teal);
	--checkbox-color: var(--ldt-teal);
	--sidebar-select-color: var(--ldt-navy-tint);
	--focus-default: 0px 0px 0px 3px rgba(34, 184, 211, 0.4);
	--checkbox-focus-shadow: 0px 0px 0px 3px rgba(34, 184, 211, 0.4);
}

/* Primary buttons: brand navy with white text in both themes */
.btn.btn-primary,
.btn-primary {
	background-color: var(--ldt-navy) !important;
	border-color: var(--ldt-navy) !important;
	color: #fff !important;
	--icon-stroke: #fff;
}
.btn.btn-primary:hover,
.btn-primary:hover,
.btn.btn-primary:focus {
	background-color: var(--ldt-navy-dark) !important;
	border-color: var(--ldt-navy-dark) !important;
	color: #fff !important;
}
.btn.btn-primary:active,
.btn-primary:active {
	background-color: var(--ldt-navy-dark) !important;
	color: #fff !important;
}
.btn.btn-primary-light,
.btn-primary-light {
	background-color: var(--ldt-teal-tint);
	color: var(--ldt-navy);
}

/* Links and accents */
a.text-primary,
.text-primary,
.frappe-control .link-btn .btn-open,
.form-link-title,
.list-row .level-left a:hover {
	color: var(--ldt-teal) !important;
}

/* Checkboxes, radios and switches */
input[type="checkbox"]:checked,
input[type="radio"]:checked {
	background-color: var(--ldt-navy);
	border-color: var(--ldt-navy);
}
[data-theme="dark"] input[type="checkbox"]:checked,
[data-theme="dark"] input[type="radio"]:checked {
	background-color: var(--ldt-teal);
	border-color: var(--ldt-teal);
}
.form-check-input:checked,
.custom-switch .custom-control-input:checked ~ .custom-control-label::before {
	background-color: var(--ldt-navy);
	border-color: var(--ldt-navy);
}

/* Input focus ring in teal */
.form-control:focus,
.frappe-control input:focus,
.frappe-control select:focus,
.frappe-control textarea:focus,
.awesomebar input:focus {
	box-shadow: var(--focus-default) !important;
}

/* Sidebar: active item gets a teal marker */
.sidebar-item-container .item-anchor.active,
.standard-sidebar-item.selected,
.desk-sidebar .standard-sidebar-item.selected {
	background-color: var(--sidebar-select-color);
	box-shadow: inset 3px 0 0 var(--ldt-teal);
}

/* Form tabs: active tab underline in teal */
.form-tabs .nav-link.active {
	color: var(--heading-color);
	border-bottom-color: var(--ldt-teal) !important;
}

/* Progress bars and indicators */
.progress-bar {
	background-color: var(--ldt-teal);
}

/* Login page */
.for-login .page-card-head .app-logo,
.page-card-head img.app-logo {
	max-height: 48px;
}
.page-card-head h4 {
	color: var(--ldt-navy);
}
body[data-path="login"] .btn-login,
body[data-path="login"] .btn-primary,
.for-login .btn-primary,
.for-forgot .btn-primary,
.for-signup .btn-primary {
	background-color: var(--ldt-navy) !important;
	border-color: var(--ldt-navy) !important;
	color: #fff !important;
}
body[data-path="login"] a,
.for-login a {
	color: var(--ldt-teal);
}

/* Website navbar: thin brand bar under the header */
.navbar.navbar-expand-lg {
	border-bottom: 3px solid var(--ldt-teal);
}

/* Header bar: #849DAA (requested), dark navy text for contrast */
:root,
[data-theme="light"],
[data-theme="dark"] {
	--navbar-bg: #849daa;
}
.navbar,
header .navbar,
.navbar.navbar-expand,
.navbar.navbar-expand-lg {
	background: #849daa !important;
	border-bottom-color: #849daa;
}
.navbar .navbar-brand,
.navbar .nav-link,
.navbar .navbar-breadcrumbs a,
.navbar .navbar-breadcrumbs li,
.navbar .es-breadcrumbs__label {
	color: #13303f !important;
	--icon-stroke: #13303f;
}

/* v16 desk: the visible top bar is the sticky page header, so colour it too */
.page-head,
.page-head .page-head-content,
.layout-main-section-wrapper > .page-head,
body[data-route] .page-head {
	background: #849daa !important;
	border-bottom-color: #849daa !important;
}
.page-head .page-title .title-text,
.page-head .title-area,
.page-head .sub-heading,
.page-head .indicator-pill {
	color: #13303f !important;
}
