/* FalconERP Desk Theme — FalconPro blue gradient palette */

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

:root {
	--donow-cyan: #5b8def;
	--donow-cyan-dark: #2b5ce8;
	--donow-coral: #a5c4ff;
	--donow-dark: #1a3a8f;
	--donow-dark-elevated: #152d6e;
	--donow-surface: #f4f7fb;
	--donow-radius: 10px;
	--donow-radius-lg: 16px;
	--donow-shadow: 0 4px 24px rgba(26, 58, 143, 0.08);
	--donow-shadow-lg: 0 12px 40px rgba(26, 58, 143, 0.12);

	--primary: #2b5ce8;
	--primary-color: #2b5ce8;
	--btn-primary: #2b5ce8;
	--navbar-bg: #1a3a8f;
	--sidebar-select-color: #5b8def;
	--bg-blue: #2b5ce8;
	--border-color: #dbeafe;
	--heading-color: #1a3a8f;
	--bg-color: var(--donow-surface);
	--fg-color: #ffffff;
	--text-color: #1e293b;
	--text-muted: #64748b;
	--control-bg: #f1f5f9;
	--border-radius-md: var(--donow-radius);
	--border-radius-lg: var(--donow-radius-lg);

	--input-height: 36px;
	--btn-height: 36px;
}

[data-theme="dark"] {
	--navbar-bg: #0f1e35;
	--primary: #5b8def;
	--primary-color: #5b8def;
	--btn-primary: #2b5ce8;
	--sidebar-select-color: #5b8def;
	--heading-color: #f1f5f9;
	--bg-color: #0f1e35;
	--fg-color: #1a2744;
	--border-color: #2d3f66;
	--control-bg: #152d6e;
	--text-color: #e2e8f0;
	--text-muted: #94a3b8;
	--donow-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
	--donow-shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.45);
}

/* ── Theme toggle button ── */
.donow-theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid var(--border-color);
	border-radius: var(--donow-radius);
	background: var(--control-bg);
	color: var(--text-color);
	cursor: pointer;
	transition: background 0.2s, border-color 0.2s, color 0.2s, box-shadow 0.2s;
	padding: 0;
}

.donow-theme-toggle:hover {
	border-color: var(--donow-cyan);
	color: var(--donow-cyan);
	box-shadow: 0 0 0 3px rgba(64, 196, 255, 0.12);
}

.donow-theme-toggle--login {
	position: fixed;
	top: 16px;
	right: 16px;
	z-index: 1000;
	background: rgba(255, 255, 255, 0.12);
	border-color: rgba(255, 255, 255, 0.2);
	color: #e2e8f0;
	backdrop-filter: blur(8px);
}

.donow-theme-toggle--login:hover {
	background: rgba(255, 255, 255, 0.18);
	border-color: var(--donow-cyan);
	color: var(--donow-cyan);
}

[data-theme="light"] .donow-theme-toggle--login {
	background: rgba(255, 255, 255, 0.85);
	border-color: var(--border-color);
	color: #475569;
	box-shadow: var(--donow-shadow);
}

[data-theme="light"] .donow-theme-toggle--login:hover {
	color: var(--donow-cyan-dark);
	border-color: var(--donow-cyan);
}

.donow-theme-nav-item {
	display: flex;
	align-items: center;
	margin-right: 4px;
}

.donow-theme-toggle--navbar {
	width: 32px;
	height: 32px;
	background: rgba(255, 255, 255, 0.08);
	border-color: rgba(64, 196, 255, 0.2);
	color: #e2e8f0;
}

.donow-theme-toggle--navbar:hover {
	background: rgba(64, 196, 255, 0.12);
	color: var(--donow-cyan);
}

.donow-theme-icon {
	display: block;
}

/* ── LTR / English enforcement ── */
html,
body {
	direction: ltr !important;
}

html[dir="rtl"],
body[dir="rtl"] {
	direction: ltr !important;
}

.language-picker,
.show-language-picker {
	display: none !important;
}

/* ── Typography ── */
html,
body,
input,
button,
select,
textarea {
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	-webkit-font-smoothing: antialiased;
}

/* ── Navbar ── */
.navbar {
	background: var(--navbar-bg) !important;
	border-bottom: 1px solid rgba(64, 196, 255, 0.12) !important;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
	height: 52px;
}

.navbar .navbar-nav .nav-link,
.navbar .navbar-brand,
.navbar .search-bar .awesomplete input {
	color: #e2e8f0 !important;
}

.navbar .navbar-brand .app-logo,
.navbar-brand img {
	height: 32px;
	width: auto;
	max-width: 160px;
	object-fit: contain;
	border-radius: 8px;
}

.navbar-brand .app-logo + .app-letter {
	display: none !important;
}

.navbar .search-bar .awesomplete input {
	background: rgba(255, 255, 255, 0.08) !important;
	border: 1px solid rgba(64, 196, 255, 0.2) !important;
	border-radius: var(--donow-radius) !important;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.navbar .search-bar .awesomplete input:focus {
	border-color: var(--donow-cyan) !important;
	box-shadow: 0 0 0 3px rgba(64, 196, 255, 0.15) !important;
}

/* ── Sidebar ── */
.desk-sidebar .sidebar-item.selected,
.standard-sidebar-item.selected,
.sidebar-item-container.selected > .standard-sidebar-item {
	background: linear-gradient(90deg, rgba(64, 196, 255, 0.14), transparent) !important;
	border-left: 3px solid var(--donow-cyan) !important;
	border-radius: 0 var(--donow-radius) var(--donow-radius) 0;
}

.desk-sidebar .standard-sidebar-item:hover,
.sidebar-item-container .standard-sidebar-item:hover {
	background: rgba(64, 196, 255, 0.06) !important;
	border-radius: var(--donow-radius);
	transition: background 0.15s ease;
}

.desk-sidebar .sidebar-item-icon,
.standard-sidebar-item .sidebar-item-icon {
	--icon-stroke: var(--donow-cyan-dark);
}

/* ── Buttons ── */
.btn-primary,
.btn-primary-dark {
	background: linear-gradient(135deg, var(--donow-cyan-dark), var(--donow-dark)) !important;
	border: none !important;
	border-radius: var(--donow-radius) !important;
	font-weight: 500 !important;
	box-shadow: 0 2px 8px rgba(43, 92, 232, 0.3);
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.btn-primary:hover,
.btn-primary-dark:hover {
	transform: translateY(-1px);
	box-shadow: 0 4px 16px rgba(43, 92, 232, 0.4) !important;
	background: linear-gradient(135deg, var(--donow-dark), var(--donow-cyan-dark)) !important;
}

.btn-secondary,
.btn-default {
	border-radius: var(--donow-radius) !important;
	transition: background 0.15s ease;
}

/* ── Cards & widgets ── */
.widget,
.frappe-card,
.form-section.card-section,
.layout-main-section .form-layout {
	border-radius: var(--donow-radius-lg) !important;
	box-shadow: var(--donow-shadow);
	border: 1px solid var(--border-color) !important;
}

.widget-head {
	padding: 12px 16px !important;
}

.widget-body:not(:empty) {
	padding: 12px 16px !important;
}

.form-section.card-section,
.form-dashboard-section {
	padding: 12px 16px !important;
}

.frappe-card .card-body,
.modal-body {
	padding: 16px !important;
}

body:not([data-path="login"]) .page-card {
	border-radius: var(--donow-radius-lg) !important;
	box-shadow: var(--donow-shadow);
	border: 1px solid var(--border-color) !important;
	padding: 16px 20px !important;
}

.widget:hover {
	box-shadow: var(--donow-shadow-lg);
	transition: box-shadow 0.2s ease;
}

.widget-head .widget-title {
	font-weight: 600;
	color: var(--heading-color);
}

/* ── Chips / pills ── */
.indicator-pill,
.indicator-pill-right {
	padding: 4px 10px !important;
	height: auto !important;
	min-height: 22px;
	line-height: 1.35;
}

/* ── Dividers ── */
.divider,
.dropdown-divider,
.dropdown-menu .divider,
.dropdown-menu .dropdown-divider,
.nav-divider {
	height: 0 !important;
	min-height: 0 !important;
	margin: 6px 0 !important;
	padding: 0 !important;
	border: none !important;
	border-top: 1px solid var(--border-color) !important;
	background: transparent !important;
	opacity: 1;
}

hr {
	height: 0 !important;
	margin: 8px 0 !important;
	padding: 0 !important;
	border: none !important;
	border-top: 1px solid var(--border-color) !important;
	background: transparent !important;
	opacity: 1;
}

/* ── Form controls (desk only — login uses Frappe defaults) ── */
body:not([data-path="login"]) .form-control:not(textarea),
body:not([data-path="login"]) .input-with-feedback {
	border-radius: var(--donow-radius) !important;
	border-color: var(--border-color) !important;
	height: var(--input-height);
	min-height: var(--input-height);
	box-sizing: border-box;
	transition: border-color 0.2s, box-shadow 0.2s;
}

body:not([data-path="login"]) .frappe-control .form-control:not(textarea),
body:not([data-path="login"]) .frappe-control .input-with-feedback,
body:not([data-path="login"]) .frappe-control select.form-control {
	height: var(--input-height);
	min-height: var(--input-height);
}

body:not([data-path="login"]) .awesomplete > input,
.navbar .search-bar .awesomplete input {
	height: var(--input-height);
	min-height: var(--input-height);
}

/* Vertically center desk input adornments */
body:not([data-path="login"]) .frappe-control .control-input .link-btn,
body:not([data-path="login"]) .frappe-control .control-input .action-btn,
body:not([data-path="login"]) .frappe-control[data-fieldtype="Password"] .control-input-wrapper .toggle-password,
body:not([data-path="login"]) .frappe-control .phone-btn,
body:not([data-path="login"]) .form-grid .grid-row .link-btn,
body:not([data-path="login"]) .frappe-datatable .link-btn {
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
}

body:not([data-path="login"]) .frappe-control button.action-btn {
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
}

body:not([data-path="login"]) .form-control:focus,
body:not([data-path="login"]) .input-with-feedback:focus {
	border-color: var(--donow-cyan) !important;
	box-shadow: 0 0 0 3px rgba(91, 141, 239, 0.12) !important;
}

/* ── Links ── */
a:not(.btn):hover {
	color: var(--donow-cyan-dark);
}

/* ── Splash screen (post-login / app load) ── */
.splash {
	background: var(--donow-dark);
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}

.splash img {
	max-width: 72px !important;
	max-height: 72px !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain;
	border-radius: 12px;
}

/* ── Login page — full viewport, no scroll, no white gaps ── */
html:has(body[data-path="login"]) {
	height: 100%;
	overflow: hidden;
}

body[data-path="login"] {
	overflow: hidden !important;
	height: 100vh !important;
	min-height: 100vh !important;
	margin: 0 !important;
	padding: 0 !important;
	background: radial-gradient(ellipse at 20% 50%, rgba(91, 141, 239, 0.12) 0%, transparent 60%),
		radial-gradient(ellipse at 80% 20%, rgba(43, 92, 232, 0.08) 0%, transparent 50%),
		var(--donow-surface) !important;
}

[data-theme="dark"] body[data-path="login"] {
	background: radial-gradient(ellipse at 20% 50%, rgba(91, 141, 239, 0.1) 0%, transparent 60%),
		radial-gradient(ellipse at 80% 20%, rgba(26, 58, 143, 0.15) 0%, transparent 50%),
		var(--bg-color) !important;
}

body[data-path="login"] .navbar,
body[data-path="login"] .web-footer,
body[data-path="login"] .page-breadcrumbs,
body[data-path="login"] .page-header-wrapper,
body[data-path="login"] .page-footer {
	display: none !important;
}

body[data-path="login"] #page-login,
body[data-path="login"] #page-login > .page-content-wrapper {
	width: 100% !important;
	max-width: 100% !important;
	min-height: 100vh !important;
	height: 100vh !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

body[data-path="login"] .page-content-wrapper {
	min-height: 100vh !important;
	height: 100vh !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

body[data-path="login"] main.container {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 16px !important;
	min-height: 0 !important;
	height: auto !important;
	flex: 1;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

body[data-path="login"] .page_content {
	min-height: 0 !important;
	width: 100% !important;
	max-width: 420px !important;
	margin: 0 auto !important;
	padding: 0 !important;
}

/* Layout only — never override display; Frappe toggles section visibility */
body[data-path="login"] section[class^="for-"] {
	min-height: 0 !important;
	height: auto !important;
	width: 100% !important;
	max-width: 420px !important;
	margin: 0 auto !important;
	padding: 0 !important;
	background: #ffffff !important;
	border-radius: var(--donow-radius-lg) !important;
	box-shadow: var(--donow-shadow-lg) !important;
	overflow: hidden !important;
	position: relative;
	text-align: center;
}

[data-theme="dark"] body[data-path="login"] section[class^="for-"] {
	background: var(--fg-color) !important;
	border: 1px solid var(--border-color);
}

body[data-path="login"] section[class^="for-"]::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, var(--donow-cyan), var(--donow-coral));
	z-index: 1;
}

body[data-path="login"] section[class^="for-"] .sign-up-message {
	margin-left: auto;
	margin-right: auto;
	padding: 0 24px 20px;
}

body[data-path="login"] .page-card-head {
	padding: 28px 24px 12px !important;
	margin: 0 !important;
	max-width: none !important;
	background: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	position: relative;
}

body[data-path="login"] .page-card-head::before {
	display: none;
}

body[data-path="login"] .for-login .page-card,
body[data-path="login"] .for-forgot .page-card,
body[data-path="login"] .for-signup .page-card,
body[data-path="login"] .for-login-with-email-link .page-card,
body[data-path="login"] .for-email-login .page-card {
	padding: 0 24px 24px !important;
	background: transparent !important;
	width: 100% !important;
	max-width: none !important;
	border-radius: 0 !important;
	border: none !important;
	box-shadow: none !important;
	position: relative;
	overflow: visible;
	margin-top: 0 !important;
}

body[data-path="login"] .for-login .page-card::before,
body[data-path="login"] .for-forgot .page-card::before,
body[data-path="login"] .for-signup .page-card::before,
body[data-path="login"] .for-login-with-email-link .page-card::before,
body[data-path="login"] .for-email-login .page-card::before {
	display: none;
}

body[data-path="login"] .page-card-head .app-logo {
	height: 52px;
	width: auto;
	max-width: 52px;
	object-fit: contain;
	margin: 0 auto 16px;
	display: block;
}

body[data-path="login"] .page-card-head h4 {
	font-weight: 600;
	color: #334155;
	font-size: 1.125rem;
	letter-spacing: -0.01em;
	margin: 0;
	line-height: 1.4;
}

[data-theme="dark"] body[data-path="login"] .page-card-head h4 {
	color: #f1f5f9;
}

body[data-path="login"] .donow-login-subtitle {
	color: #64748b !important;
	font-size: 0.875rem;
	margin: 4px 0 0;
	font-weight: 400;
}

[data-theme="dark"] body[data-path="login"] .donow-login-subtitle {
	color: #94a3b8 !important;
}

body[data-path="login"] .page-card-body input[type="text"],
body[data-path="login"] .page-card-body input[type="email"],
body[data-path="login"] .page-card-body input[type="password"] {
	border-radius: var(--donow-radius) !important;
	border: 1px solid var(--border-color) !important;
	background: var(--control-bg) !important;
	transition: border-color 0.2s, box-shadow 0.2s;
}

body[data-path="login"] .page-card-body .field-icon {
	--icon-stroke: var(--text-muted);
}

body[data-path="login"] .page-card-body .toggle-password {
	color: var(--text-muted);
}

body[data-path="login"] .page-card-body input:focus {
	border-color: var(--donow-cyan) !important;
	box-shadow: 0 0 0 3px rgba(91, 141, 239, 0.12) !important;
}

[data-theme="dark"] body[data-path="login"] .page-card-body input:focus {
	background: var(--control-bg) !important;
}

[data-theme="dark"] body[data-path="login"] .page-card-body input[type="text"],
[data-theme="dark"] body[data-path="login"] .page-card-body input[type="email"],
[data-theme="dark"] body[data-path="login"] .page-card-body input[type="password"] {
	color: var(--text-color);
	background: var(--control-bg) !important;
	border-color: var(--border-color) !important;
}

[data-theme="dark"] body[data-path="login"] .sign-up-message,
[data-theme="dark"] body[data-path="login"] .forgot-password-message,
[data-theme="dark"] body[data-path="login"] .sign-up-message a,
[data-theme="dark"] body[data-path="login"] .forgot-password-message a {
	color: #94a3b8 !important;
}

[data-theme="dark"] body[data-path="login"] .sign-up-message a,
[data-theme="dark"] body[data-path="login"] .forgot-password-message a {
	color: var(--donow-cyan) !important;
}

body[data-path="login"] .page-card-actions .btn-login,
body[data-path="login"] .page-card-actions .btn-primary {
	width: 100%;
	padding: 12px !important;
	font-size: 0.95rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.01em;
}

body[data-path="login"] .page-card-actions {
	margin-top: 16px !important;
}

body[data-path="login"] .login-divider {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 12px 0 !important;
	padding: 0 !important;
	line-height: 1;
	font-size: 0.8125rem;
	color: var(--text-muted) !important;
}

body[data-path="login"] .login-divider::before,
body[data-path="login"] .login-divider::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--border-color);
}

body[data-path="login"] .btn-login-option {
	padding: 8px 12px !important;
	min-height: 36px;
}

body[data-path="login"] .sign-up-message,
body[data-path="login"] .forgot-password-message {
	margin-top: 16px;
}

body[data-path="login"] .sign-up-message a,
body[data-path="login"] .forgot-password-message a {
	color: var(--donow-cyan-dark) !important;
	font-weight: 500;
}

@media (max-height: 640px) {
	html:has(body[data-path="login"]) {
		overflow: auto;
	}

	body[data-path="login"] {
		overflow-y: auto !important;
		height: auto !important;
		min-height: 100vh !important;
	}

	body[data-path="login"] #page-login,
	body[data-path="login"] #page-login > .page-content-wrapper,
	body[data-path="login"] .page-content-wrapper {
		height: auto !important;
		min-height: 100vh !important;
	}
}

/* ── Apps launcher ── */
.apps-container {
	border-radius: var(--donow-radius-lg) !important;
	box-shadow: var(--donow-shadow-lg) !important;
	border: none !important;
}

.app-logo {
	border-radius: 14px !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.app-icon:hover .app-logo {
	box-shadow: 0 8px 24px rgba(64, 196, 255, 0.25);
}

/* ── List view & workspace ── */
.list-row-container .list-row:hover,
.list-row-head:hover {
	background: rgba(64, 196, 255, 0.04) !important;
}

.list-paging-area .btn-paging.btn-info {
	background: var(--donow-cyan-dark) !important;
	border-color: var(--donow-cyan-dark) !important;
}

/* ── Notifications badge ── */
.indicator-pill.red,
.notifications-icon .notifications-seen .icon use {
	--icon-stroke: var(--donow-coral);
}

/* ── Scrollbar ── */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: transparent;
}

::-webkit-scrollbar-thumb {
	background: rgba(100, 116, 139, 0.3);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: rgba(100, 116, 139, 0.5);
}

/* ── Page head ── */
.page-head {
	border-bottom: 1px solid var(--border-color);
}

.page-head .page-title .title-text {
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--heading-color);
}

/* ── Modal ── */
.modal-content {
	border-radius: var(--donow-radius-lg) !important;
	border: none !important;
	box-shadow: var(--donow-shadow-lg) !important;
}

.modal-header {
	border-bottom: 1px solid var(--border-color);
}

/* ── Dropdown ── */
.dropdown-menu {
	border-radius: var(--donow-radius) !important;
	box-shadow: var(--donow-shadow-lg) !important;
	border: 1px solid var(--border-color) !important;
}

.dropdown-item:hover,
.dropdown-item:focus {
	background: rgba(64, 196, 255, 0.08) !important;
}
