/* Petrivara brand for ops.petrivara.com (Desk, login, portal). Tokens and component language come from the Petrivara
   website (index-6.html) and brand spec: Orange #F36B21 / deep #C24F10, Charcoal #20272B, Archivo, cut corners. */
@font-face {
	font-family: "Archivo";
	src: url("/assets/petrivara_ops/fonts/archivo-var.woff2") format("woff2-variations"), url("/assets/petrivara_ops/fonts/archivo-var.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
}

:root {
	--pv-orange: #F36B21;
	--pv-orange-deep: #C24F10;
	--pv-orange-soft: rgba(243, 107, 33, .12);
	--pv-ink: #20272B;
	--pv-slate: #1B2226;
	--pv-steel: #566166;
	--pv-mist: #F1F3F4;
	--pv-line: #DCE1E3;
	--pv-paper: #ffffff;
	--pv-cut: 12px;

	/* Frappe v16 variables */
	--font-stack: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif !important;
	--primary: var(--pv-orange);
	--primary-color: var(--pv-orange-deep);
	--brand-color: var(--pv-orange);
	--btn-primary: var(--pv-orange);
	--heading-color: var(--pv-ink);
	--text-color: var(--pv-ink);
	--sidebar-select-color: var(--pv-orange-soft);
}
/* Dark theme (user menu > Toggle Theme): keep the brand accents, let Frappe's dark text and surfaces through. */
[data-theme="dark"] {
	--heading-color: #f3f4f5;
	--text-color: #e6e9eb;
	--sidebar-select-color: rgba(243, 107, 33, .22);
}

html body, button, input, select, textarea, .btn { font-family: var(--font-stack); }
body { color: var(--text-color); }
h1, h2, h3, .page-title .title-text, .ellipsis.title-text { font-weight: 720; letter-spacing: -0.01em; }

/* Buttons: orange with charcoal text, charcoal on hover, angled corner (website .btn-primary) */
.btn.btn-primary, .btn-primary, .btn.btn-login {
	background: var(--pv-orange) !important;
	border-color: var(--pv-orange) !important;
	color: var(--pv-ink) !important;
	font-weight: 650;
	clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 0 100%);
}
.btn.btn-primary:hover, .btn-primary:hover, .btn.btn-primary:focus-visible, .btn.btn-login:hover {
	background: var(--pv-ink) !important;
	border-color: var(--pv-ink) !important;
	color: #fff !important;
}
.btn:focus-visible, .form-control:focus { box-shadow: 0 0 0 3px rgba(243, 107, 33, .45) !important; }

/* Links and active states in the brand's deep orange (readable on white) */
a:not(.btn):not(.dropdown-item):not(.item-anchor):hover { color: var(--pv-orange-deep); }
.standard-sidebar-item.selected, .desk-sidebar .standard-sidebar-item.selected { background: var(--pv-orange-soft) !important; }
.standard-sidebar-item.selected .sidebar-item-label, .standard-sidebar-item.selected .sidebar-item-icon use { color: var(--pv-orange-deep) !important; }
.indicator-pill.orange, .indicator.orange::before { --indicator-color: var(--pv-orange); }

/* Navbar: white with a thin orange rule, like the site's solid nav */
.navbar { border-bottom: 2px solid var(--pv-orange) !important; }
.navbar .navbar-brand img, .navbar-home img { max-height: 26px; }

/* Desktop (the app grid at /desk): charcoal surface, Archivo captions, orange active state. The Petrivara Ops tile
   is our own SVG (public/icons/desktop_icons); the built-in ERPNext/Frappe tiles are blue images, so they are shifted
   to the brand orange with a hue filter. Third-party app logos (Frappe CRM, Framework) keep their own colours. */
.desktop-wrapper { min-height: 100vh; background: var(--pv-mist); }
[data-theme="dark"] .desktop-wrapper { background: var(--pv-ink); }
.desktop-wrapper .desktop-navbar { background: var(--pv-paper); border-bottom: 2px solid var(--pv-orange) !important; }
[data-theme="dark"] .desktop-wrapper .desktop-navbar { background: var(--pv-slate); }
.desktop-wrapper #brand-logo { height: 28px; width: auto; }
[data-theme="dark"] .desktop-wrapper #brand-logo,
[data-theme="dark"] .navbar .navbar-brand img { content: url("/assets/petrivara_ops/images/petrivara-logo-reversed.svg"); }
/* Website pages (login, workspaces): Frappe's navbar-light and footer stay white in dark; body[frappe-session-status] is
   only on website pages, so the desk header is untouched. */
[data-theme="dark"] body[frappe-session-status] .navbar, [data-theme="dark"] .web-footer { background: #1c1c1c !important; }
[data-theme="dark"] body[frappe-session-status] .navbar .nav-link { color: #ededed !important; }
[data-theme="dark"] body[frappe-session-status] .navbar .navbar-toggler { filter: invert(1); }
[data-theme="dark"] .web-footer, [data-theme="dark"] .web-footer a { color: #b3b3b3; }
.desktop-wrapper .icon-title { font-family: var(--font-stack); font-weight: 650; letter-spacing: -0.005em; color: var(--pv-ink); }
[data-theme="dark"] .desktop-wrapper .icon-title { color: #f3f4f5; }
.desktop-wrapper .desktop-icon:hover .icon-title { color: var(--pv-orange-deep); }
[data-theme="dark"] .desktop-wrapper .desktop-icon:hover .icon-title { color: var(--pv-orange); }
/* Every tile in the Petrivara lockup (Desktop Settings icon_style = Subtle, set by patch v0_6): slate tile with a thin
   orange ring; the built-in blue glyphs are hue-shifted to orange. Third-party app logos keep their own tile. */
.desktop-wrapper .desktop-icon:not([data-id="Framework"]) > .icon-container {
	background: #2B3337 !important;
	box-shadow: inset 0 0 0 1.5px rgba(243, 107, 33, .55);
}
/* Our own icons are already orange, so the hue shift skips anything served from this app (matched by src, not by the
   tile id: Desktop Icon labels change, asset paths do not). */
.desktop-wrapper .desktop-icon:not([data-id="Framework"]) .icon-container img.app-icon:not([src*="/assets/petrivara_ops/"]) {
	filter: hue-rotate(175deg) saturate(.95) brightness(1.08);
}
.desktop-wrapper .folder-icon { --folder-icon-background-color: #2B3337; }
.desktop-wrapper .folder-icon .desktop-icon .icon-container { background: transparent !important; box-shadow: none; }
.desktop-wrapper .icon-container:has(.icon) { background-color: var(--pv-line); }
[data-theme="dark"] .desktop-wrapper .icon-container:has(.icon) { background-color: #2B3337; }
.desktop-wrapper .active-page { background: var(--pv-orange) !important; }
.desktop-wrapper .desktop-navbar-modal-search:hover { outline: 1px solid var(--pv-orange); }
.desktop-wrapper .desktop-edit { background-color: var(--pv-orange); opacity: .35; }
.desktop-wrapper .desktop-edit:hover { opacity: 1; }

/* Login page */
.page-card, .for-login .page-card { border-radius: 0 !important; clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%); border-top: 5px solid var(--pv-orange) !important; }
.page-card-head img.app-logo { max-height: 44px !important; width: auto !important; }
[data-theme="dark"] .page-card-head img.app-logo { content: url("/assets/petrivara_ops/images/petrivara-logo-reversed.svg"); }   /* login is dark by default (web_theme.py) */
.page-card-head h4 { font-weight: 720; }
