/* LayoutShell.css — shared TeamDoc layout kernel (Contract CSS).
   Pack skins (Layout5/6/7.css) own tokens + chrome. This owns Authenticated
   host-fit helpers, pedigree standards-mode fills, Oz bleach guards, tip popups. */

/* Pedigree sex fills — proc emits background-color without '#' (quirks-only). */
html.layout3 .femalePedigree,
html.layout3 .femalePedigreeBack,
html.layout5 .femalePedigree,
html.layout5 .femalePedigreeBack,
html.layout6 .femalePedigree,
html.layout6 .femalePedigreeBack,
html.layout7 .femalePedigree,
html.layout7 .femalePedigreeBack,
.layout3-body .femalePedigree,
.layout3-body .femalePedigreeBack,
.layout5-body .femalePedigree,
.layout5-body .femalePedigreeBack,
.layout6-body .femalePedigree,
.layout6-body .femalePedigreeBack,
.layout7-body .femalePedigree,
.layout7-body .femalePedigreeBack {
	background-color: #ffcccc !important;
}
html.layout3 .malePedigree,
html.layout3 .malePedigreeBack,
html.layout5 .malePedigree,
html.layout5 .malePedigreeBack,
html.layout6 .malePedigree,
html.layout6 .malePedigreeBack,
html.layout7 .malePedigree,
html.layout7 .malePedigreeBack,
.layout3-body .malePedigree,
.layout3-body .malePedigreeBack,
.layout5-body .malePedigree,
.layout5-body .malePedigreeBack,
.layout6-body .malePedigree,
.layout6-body .malePedigreeBack,
.layout7-body .malePedigree,
.layout7-body .malePedigreeBack {
	background-color: #ccccff !important;
}

/* Tip popups only when liberated to body — do not bleach pedigree nodes */
body > .balloonstyle:not(#balloonLogin) {
	z-index: 10050 !important;
	position: absolute !important;
}
html.layout3 #balloonLogin,
html.layout5 #balloonLogin,
html.layout6 #balloonLogin,
html.layout7 #balloonLogin {
	z-index: 10050 !important;
	position: absolute !important;
}

/* Land of Oz — undo forced dark-ink on Oz chrome */
html.layout5-app .layout5-main-inner .oz-video-toggle,
html.layout5-app .layout5-main-inner .oz-video-toggle *,
html.layout5-app .layout5-main-inner .oz-table-cell,
html.layout5-app .layout5-main-inner .oz-table-cell *,
html.layout5-app .layout5-main-inner .oz-explore-btn,
html.layout5-app .layout5-main-inner .oz-explore-btn *,
html.layout5-app .layout5-main-inner .oz-column-explore,
html.layout5-app .layout5-main-inner .oz-column-explore *,
html.layout5-app .layout5-main-inner .oz-ops-card,
html.layout5-app .layout5-main-inner .oz-ops-card *,
html.layout6-app .layout6-main-inner .oz-video-toggle,
html.layout6-app .layout6-main-inner .oz-video-toggle *,
html.layout6-app .layout6-main-inner .oz-table-cell,
html.layout6-app .layout6-main-inner .oz-table-cell *,
html.layout6-app .layout6-main-inner .oz-explore-btn,
html.layout6-app .layout6-main-inner .oz-explore-btn *,
html.layout6-app .layout6-main-inner .oz-column-explore,
html.layout6-app .layout6-main-inner .oz-column-explore *,
html.layout6-app .layout6-main-inner .oz-ops-card,
html.layout6-app .layout6-main-inner .oz-ops-card *,
html.layout7-app .layout7-main-inner .oz-video-toggle,
html.layout7-app .layout7-main-inner .oz-video-toggle *,
html.layout7-app .layout7-main-inner .oz-table-cell,
html.layout7-app .layout7-main-inner .oz-table-cell *,
html.layout7-app .layout7-main-inner .oz-explore-btn,
html.layout7-app .layout7-main-inner .oz-explore-btn *,
html.layout7-app .layout7-main-inner .oz-column-explore,
html.layout7-app .layout7-main-inner .oz-column-explore *,
html.layout7-app .layout7-main-inner .oz-ops-card,
html.layout7-app .layout7-main-inner .oz-ops-card * {
	color: #ffffff !important;
}

/* Unlock Authenticated widths beside pack chrome */
html.layout3-app #Table0,
html.layout5-app #Table0,
html.layout6-app #Table0,
html.layout7-app #Table0 {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	text-align: left !important;
	box-sizing: border-box;
}
html.layout3-app #cAuthenticatedNow,
html.layout5-app #cAuthenticatedNow,
html.layout6-app #cAuthenticatedNow,
html.layout7-app #cAuthenticatedNow,
html.layout3-app #cAuthDiv0,
html.layout5-app #cAuthDiv0,
html.layout6-app #cAuthDiv0,
html.layout7-app #cAuthDiv0 {
	width: 100% !important;
	max-width: none !important;
	box-sizing: border-box;
}

/* Auth mobile: hide secondary tabs; scale #Table0 (~900px design) — chrome stays scale 1 */
html.layout3-app.layout3-auth-mobile #cAuthenticatedTab9,
html.layout3-app.layout3-auth-mobile #cAuthenticatedTab7,
html.layout3-app.layout3-auth-mobile #cAuthenticatedTab8,
html.layout3-app.layout3-auth-mobile #cAuthenticatedTab1,
html.layout3-app.layout3-auth-mobile #cAuthenticatedTab6,
html.layout5-app.layout5-auth-mobile #cAuthenticatedTab9,
html.layout5-app.layout5-auth-mobile #cAuthenticatedTab7,
html.layout5-app.layout5-auth-mobile #cAuthenticatedTab8,
html.layout5-app.layout5-auth-mobile #cAuthenticatedTab1,
html.layout5-app.layout5-auth-mobile #cAuthenticatedTab6,
html.layout6-app.layout6-auth-mobile #cAuthenticatedTab9,
html.layout6-app.layout6-auth-mobile #cAuthenticatedTab7,
html.layout6-app.layout6-auth-mobile #cAuthenticatedTab8,
html.layout6-app.layout6-auth-mobile #cAuthenticatedTab1,
html.layout6-app.layout6-auth-mobile #cAuthenticatedTab6,
html.layout7-app.layout7-auth-mobile #cAuthenticatedTab9,
html.layout7-app.layout7-auth-mobile #cAuthenticatedTab7,
html.layout7-app.layout7-auth-mobile #cAuthenticatedTab8,
html.layout7-app.layout7-auth-mobile #cAuthenticatedTab1,
html.layout7-app.layout7-auth-mobile #cAuthenticatedTab6 {
	display: none !important;
}

html.layout3-app.layout3-auth-mobile #Table0,
html.layout5-app.layout5-auth-mobile #Table0,
html.layout6-app.layout6-auth-mobile #Table0,
html.layout7-app.layout7-auth-mobile #Table0 {
	width: 900px !important;
	max-width: none !important;
	zoom: 0.45;
	transform-origin: top left;
	-webkit-text-size-adjust: 100%;
	box-sizing: border-box;
	table-layout: auto;
}
html.layout3-app.layout3-auth-mobile #cAuthenticatedNow,
html.layout5-app.layout5-auth-mobile #cAuthenticatedNow,
html.layout6-app.layout6-auth-mobile #cAuthenticatedNow,
html.layout7-app.layout7-auth-mobile #cAuthenticatedNow {
	width: 100% !important;
	max-width: none !important;
	zoom: 1;
}

html.layout5-app.layout5-auth-mobile #cAuthenticatedNow img,
html.layout5-app.layout5-auth-mobile #Table0 img,
html.layout6-app.layout6-auth-mobile #cAuthenticatedNow img,
html.layout6-app.layout6-auth-mobile #Table0 img,
html.layout7-app.layout7-auth-mobile #cAuthenticatedNow img,
html.layout7-app.layout7-auth-mobile #Table0 img {
	max-width: none !important;
	max-height: none !important;
}

html.layout5-app.layout5-auth-mobile #c_Header_QUADRANT1 td.auth-search-cell,
html.layout6-app.layout6-auth-mobile #c_Header_QUADRANT1 td.auth-search-cell,
html.layout7-app.layout7-auth-mobile #c_Header_QUADRANT1 td.auth-search-cell,
html.layout5-app.layout5-auth-mobile #c_Header_QUADRANT1 td:has(#cClientHistorySearch),
html.layout6-app.layout6-auth-mobile #c_Header_QUADRANT1 td:has(#cClientHistorySearch),
html.layout7-app.layout7-auth-mobile #c_Header_QUADRANT1 td:has(#cClientHistorySearch) {
	white-space: normal !important;
	text-align: right !important;
	vertical-align: top !important;
	overflow: hidden !important;
	max-width: 220px;
}
html.layout5-app.layout5-auth-mobile #cClientHistorySearch,
html.layout6-app.layout6-auth-mobile #cClientHistorySearch,
html.layout7-app.layout7-auth-mobile #cClientHistorySearch {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	height: 36px !important;
	box-sizing: border-box !important;
	margin: 2px 0 0 0 !important;
	float: none !important;
}

/* Desktop ↔ Mobile icon toggle (LayoutShell.toggleDeviceMode). Required on every LayoutN toolbar. */
#cLayoutShellDeviceToggle.layout-shell-device-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border: 1px solid transparent;
	background: transparent;
	padding: 0 10px;
	min-width: 40px;
	min-height: 36px;
	line-height: 0;
}
#cLayoutShellDeviceToggle.layout-shell-device-toggle:hover,
#cLayoutShellDeviceToggle.layout-shell-device-toggle:focus {
	outline: none;
}
#cLayoutShellDeviceToggle .layout-shell-device-icon {
	display: none;
	width: 20px;
	height: 20px;
}
#cLayoutShellDeviceToggle .layout-shell-device-icon svg {
	display: block;
	width: 20px;
	height: 20px;
}
/* Show the destination mode icon (action cue): mobile view → monitor; desktop view → phone */
#cLayoutShellDeviceToggle[data-mode="mobile"] .layout-shell-device-icon-desktop { display: block; }
#cLayoutShellDeviceToggle[data-mode="desktop"] .layout-shell-device-icon-mobile { display: block; }
.layout-shell-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}
html.layout3 #cLayoutShellDeviceToggle.layout-shell-device-toggle { color: #4a6578; }
html.layout3 #cLayoutShellDeviceToggle.layout-shell-device-toggle:hover { background: rgba(107, 138, 158, 0.12); color: #2a2f36; }
html.layout1 #cLayoutShellDeviceToggle.layout-shell-device-toggle { color: #2f4f6f; }
html.layout1 #cLayoutShellDeviceToggle.layout-shell-device-toggle:hover { background: rgba(70, 130, 180, 0.12); color: #1e3a56; }
html.layout2 #cLayoutShellDeviceToggle.layout-shell-device-toggle { color: #3d6b4f; }
html.layout2 #cLayoutShellDeviceToggle.layout-shell-device-toggle:hover { background: rgba(61, 107, 79, 0.12); color: #1f3d2a; }
html.layout4 #cLayoutShellDeviceToggle.layout-shell-device-toggle { color: #14534d; }
html.layout4 #cLayoutShellDeviceToggle.layout-shell-device-toggle:hover { background: rgba(30, 107, 99, 0.1); color: #1e6b63; }
html.layout5 #cLayoutShellDeviceToggle.layout-shell-device-toggle { color: #e8dcc8; }
html.layout5 #cLayoutShellDeviceToggle.layout-shell-device-toggle:hover { background: #243556; color: #f0c75e; }
html.layout6 #cLayoutShellDeviceToggle.layout-shell-device-toggle { color: #e4a44a; }
html.layout6 #cLayoutShellDeviceToggle.layout-shell-device-toggle:hover { background: #2a3340; color: #f0c75e; }
html.layout7 #cLayoutShellDeviceToggle.layout-shell-device-toggle { color: #2f5d3a; }
html.layout7 #cLayoutShellDeviceToggle.layout-shell-device-toggle:hover { background: #EEF4F0; color: #1a3d24; }

/* Persistent banner collapse — preference in localStorage (layoutShellHeaderCollapsed) */
html.layout-shell.layout-shell-header-collapsed #cHeaderDiv,
html.layout1.layout-shell-header-collapsed #cHeaderDiv,
html.layout2.layout-shell-header-collapsed #cHeaderDiv,
html.layout3.layout-shell-header-collapsed #cHeaderDiv,
html.layout4.layout-shell-header-collapsed #cHeaderDiv,
html.layout5.layout-shell-header-collapsed #cHeaderDiv,
html.layout6.layout-shell-header-collapsed #cHeaderDiv,
html.layout7.layout-shell-header-collapsed #cHeaderDiv {
	display: none !important;
}
