/**
 *  This file is part of Wigii (R) software.
 *  Wigii is developed to inspire humanity. To Humankind we offer Gracefulness, Righteousness and Goodness.
 *  
 *  Wigii is free software: you can redistribute it and/or modify it 
 *  under the terms of the GNU General Public License as published by
 *  the Free Software Foundation, either version 3 of the License, 
 *  or (at your option) any later version.
 *  
 *  Wigii is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; 
 *  without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  
 *  See the GNU General Public License for more details.
 *
 *  A copy of the GNU General Public License is available in the Readme folder of the source code.  
 *  If not, see <http://www.gnu.org/licenses/>.
 *
 *  @copyright  Copyright (c) 2016-2017  Wigii.org
 *  @author     <http://www.wigii.org/system/libs>      Wigii.org 
 *  @link       <http://www.wigii-system.net>           Source Code
 *  @license    <http://www.gnu.org/licenses/>          GNU General Public License
 */
 
 /*!
  * Wigii Natural Code Development (NCD) standard library CSS
  * Created by Camille Weber (camille@wigii.org), 15.11.2017
  */

/**************************************
* Wigii NCD ObjectDocBrowser styling
**************************************/
div.ncd.method a.selfLink {
	text-decoration:none;
	color:black;
}
div.docBrowser {
	overflow-y:auto;
}
div.docBrowserToolbar ul {
	padding:0;
	margin:0;
	margin-top:5px;
	margin-bottom:5px;
	margin-right:5px;
	list-style: none;
	cursor:pointer;	
}
div.docBrowserToolbar ul li {
	padding-left:5px;
	padding-top:5px;
	border: 1px solid #3333ff;
	border-radius: 5px;
	padding-bottom:3px;
	margin-bottom:2px;
	margin-left:2px;
	text-align:center;
}
div.docBrowserToolbar ul li:hover, div.docBrowserToolbar ul li.selected {
	background-color: #3333ff;
}
div#nullEmitter {
	display:none;
}
div.docBrowser div.method {
	margin:10px 30px;
}
div.docBrowser a.methodName {	
}
div.docBrowser span.classKeyword {
	padding-right: 8px;
}
div.docBrowser span.functionKeyword {
	padding-right: 8px;
}
div.docBrowser span.keyword {
	color:blue;
}
div.docBrowser span.methodExpand {
	cursor:pointer;
	padding-right:8px;	
}
div.docBrowser div.methodSrc, div.docBrowser div.classSrc {
	display:none;
}
div.docBrowser div.methodSrc textarea, div.docBrowser div.classSrc textarea {
	white-space:pre;
}
div.docBrowser span.methodSrcExpand, div.docBrowser span.classSrcExpand {
	cursor:pointer;
	padding-left:8px;	
}
div.docBrowser span.typeAssignement {
	padding-left: 8px;
	padding-right: 8px;
}
div.docBrowser span.scalarValue {
}
/**************************************
* Wigii NCD AutocompletionSense styling
**************************************/	 
div.autocompletionsense {
	overflow-y:auto;
	background-color:white;
	top:2px;
	border: 1px solid #3333ff;
	border-radius: 5px;
	padding-bottom:3px;
}
div.autocompletionsense ul {
	padding:0;
	margin:0;
	margin-top:5px;
	margin-bottom:5px;
	list-style: none;
	cursor:pointer;	
}
div.autocompletionsense ul li {
	padding-left:5px;
}
div.autocompletionsense ul li.highlighted {
	background-color: #3333ff;
	border-radius: 2px;
	padding-left:5px;
}
/**************************************
* Wigii NCD ContextualMenu styling
**************************************/
div.contextualMenu ul {
	list-style: none;
	cursor:pointer;
	background-color:#ccccff;
	border: 1px solid #3333ff;
	border-radius: 5px;
	padding:0;
	margin:0;
	margin-left:2px;	
}
div.contextualMenu ul li {	
	display:table-row;
}
div.contextualMenu ul li:hover {
	background-color: #3333ff;
	border-radius: 2px;
}
div.contextualMenu span.label {
	text-align:left;
	white-space:nowrap;
	display:table-cell;
	padding:3px;
}
div.contextualMenu span.rightMenu, div.contextualMenu span.noMenu {
	text-align:right;
	font-size: 0.6em;
	padding-left:5px;
	padding-right:2px;
	color:#000099;
	display:table-cell;
}

/**************************************
* Wigii NCD Desktop styling
**************************************/
div.desktop img.logo {
	margin:15px;
}
div.desktop div.userMenuContainer {
	padding:8px;
	padding-top:15px;	
}
div.desktop div.userMenuContainer > span.userMenuButton {
	cursor:pointer;
	font-size:30px;	
}
div.desktop div.headerBar {
	padding-top: 25px;
}
div.desktop div.footerBar {
	padding-top:12px;
	padding-left:5px;
	border-top: solid black 1px;
	color:#3333ff;
}
div.desktop div.footerBar span.ncd {
	font-size:15px;
}
/**************************************
* Wigii NCD SelfLearningTaskList styling
**************************************/
div.taskList p.task {
	padding-bottom:20px;
}
div.taskList p.task span.taskLabel {
	font-weight:bold;
}
div.taskList p.task span.taskCompleted {
	padding:5px;
	margin-right:5px;
	margin-left:5px;
	color:green;
	cursor:pointer;
	border: 1px solid;
	border-radius:40%;
}
div.taskList p.task span.taskAborted {
	padding:5px;
	margin-right:5px;	
	color:red;
	cursor:pointer;
	border: 1px solid;
	border-radius:40%;
}
div.taskList p.task span.taskRun {
	padding:5px;
	margin-right:5px;
	cursor:pointer;
	border: 1px solid;
	border-radius:40%;
}
div.taskList p.task.completed {
	color: green;
	text-decoration: line-through;
}
div.taskList p.task.aborted {
	color: red;
	text-decoration: line-through;
}
/**************************************
* Wigii NCD AgileStoryBoard styling
**************************************/
button.ncd.storyBoardCreateButton {
	font-size:large;
	background-color:green;
	color:white;
	border:none;
	padding:5px;
	margin-right:20px;
	margin-left:5px;
}
div.storyBoardFilters {
	min-height:40px;
}
span.storyBoardFilterLabel {
	padding-left:5px;
	padding-right:10px;
}
button.ncd.storyBoardFilter {
	font-size:medium;
}
button#storyBoardFilter_all {
	margin-left:5px;
}
button.storyBoardFilter.activeFilter {
	background-color:#aac9ff;
}
/* LWR 12.03.2026: flip button positioned absolute so it doesn't affect board height calculation */
span.ncd.flipBoardButton {
	position: absolute;
	z-index: 10;
	left: 5px;
	top: 2px;
	padding: 3px 6px;
	background-color: white;
	border-radius: 5px;
	cursor: pointer;
}
div.h.storyBoard, div.v.storyBoard {
	box-sizing: border-box;
}
div.storyBoardColumn {
	border: solid 1px black;
	overflow: hidden;
	box-sizing: border-box;
	/* LWR 12.03.2026: flexbox so header takes natural height and content fills the rest */
	display: flex;
	flex-direction: column;
}
div.storyBoardColumnHeader {
	text-align:center;
	padding-top:10px;
	border-bottom: solid 1px black;
	background-color:#0cd2ff;
	font-weight:bold;
	flex-shrink: 0;
}
div.storyBoardColumnContent {
	overflow-y:auto;
	overflow-x:visible;
	padding-bottom:3px;
	flex: 1;
}
div.storyBoardColumnContent.dragOn {
	border: solid 1px blue;
}
div.story.ui-draggable.ui-draggable-dragging {
	max-width:200px;
}
div.storyBoardColumnContent div.story {
	cursor:pointer;
	background-color:var(--bgMain,white);
	color:var(--textColorMain,black);
	border: solid 2px #3333ff;
	border-radius: 5px;
	margin:2px;
	padding-left:2px;
	padding-right:2px;	
	max-height:200px;
	overflow-y:hidden;	
}
div.storyBoardColumnContent div.story.P1 {
	border: solid 3px #FFE300;
}
div.storyBoardColumnContent div.story.P3 {
	border-color:#b0c4de
}
div.storyBoardColumnContent div.story.Orange {
	background-color:#ff8c1ab5;
}
div.storyBoardColumnContent div.story.Red {
	background-color:#ff4d4dbf;
}
div.storyBoardColumnContent div.story span {	
	display:block;	
}
div.storyBoardColumnContent div.story span.storyEditButton {		
	display:inline;	
	float:left;
	padding:4px 4px 6px 4px;
}
div.storyBoardColumnContent div.story span.storyDeleteButton {		
	display:inline;
	color:red;
	padding:4px 4px 6px 4px;
	float:left;
}
div.storyBoardColumnContent div.story span.storyMoveUpButton, div.storyBoardColumnContent div.story span.storyMoveDownButton {
	display:inline;
	color:#3333ff;
	padding:2px 4px 8px 4px;
	float:left;
}
 div.storyBoardColumnContent div.story span.storyMoveBottomButton {		
	display:inline;
	color:#3333ff;
	padding:5px 4px 5px 4px;
	float:left;
}
div.storyBoardColumnContent div.story span.storyMoveTopButton {
	display:inline;
	color:#3333ff;
	padding:2px 4px 8px 4px;
	float:left;
}
div.storyBoardColumnContent div.story span.storyAssignee {		
	font-size:12px;
	font-weight:bold;
	color:#3333ff;
	clear:both;
}
div.storyBoardColumnContent div.story span.storyDueDate {		
	font-size:x-small;
	padding:2px 4px 8px 4px;
	float:right;
}
div.storyBoardColumnContent div.story span.storyLabel {		
	font-size:12px;
	font-weight:bold;
	padding-top:4px;
	padding-bottom:4px;
}
div.storyBoardColumnContent div.story span.storyDescription {
	font-size:12px;
}
/* LWR 12.03.2026: stale indicator icons for kanban cards */
/* !important needed to override PWA modules.css span.storyAssignee color inheritance */
div.storyBoardColumnContent div.story .storyAssignee i.storyStale,
div.storyBoardColumnContent div.story .storyAssignee sup.staleDays {
	color: #ff8c1a !important;
	cursor: help;
}
div.storyBoardColumnContent div.story .storyAssignee sup.staleDays {
	font-size: 0.55rem;
	font-weight: bold;
}
div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-14,
div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-14 { color: #e53935 !important; }
div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-21,
div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-21 { color: #b71c1c !important; }
div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-30,
div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-30 { color: #b71c1c !important; }
div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-60,
div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-60 { color: #7f0000 !important; }
div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-90,
div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-90 { color: #4a0000 !important; }
/* Dark theme: colors go lighter as staleness increases */
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee i.storyStale,
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee sup.staleDays { color: #ffb347 !important; }
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-14,
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-14 { color: #ff6b6b !important; }
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-21,
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-21 { color: #ff8a8a !important; }
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-30,
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-30 { color: #ff9a9a !important; }
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-60,
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-60 { color: #ffb0b0 !important; }
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee i.storyStale.stale-90,
html[style*="--userTheme: dark"] div.storyBoardColumnContent div.story .storyAssignee sup.staleDays.stale-90 { color: #ffc8c8 !important; }
div.storyBoardForm {
	margin:5px;
	margin-right:10px;
}
/* ===== w-kanban — le tableau kanban (wncd.KanbanBoard), colonnes et cartes ======================
 * Racine      : div.w-kanban[data-layout="columns"|"rows"] (+ .w-kanban--dragging pendant un glisser)
 * Parties     : .w-kanban__toolbar (.flipBoardButton, .w-kanban__reset) · .w-kanban__board
 *               .w-kanban__column[data-state="normal"|"collapsed"|"expanded"][data-done]
 *               .w-kanban__header (.w-kanban__toggle, .w-kanban__title, .w-kanban__count, .w-kanban__expand)
 *               .w-kanban__cards · .w-kanban__card[data-priority][data-due="late"|"soon"][data-selected]
 *               .w-kanban__card-top (.w-kanban__id, .w-kanban__due) · .w-kanban__card-assignee (.storyStale, .staleDays)
 *               .w-kanban__card-label · .w-kanban__card-desc · .w-kanban__card-actions (.w-kanban__grip, .w-kanban__action)
 * Émetteur    : addons/NCD/wigii-ncd-stdlib.js — wncd.KanbanBoard (renderStoryBoard, renderStory)
 * Interfaces  : classique + PWA desktop + PWA mobile — un seul fichier, aucune surcharge dans pwa/*.css
 * Variantes   : orientation par data-layout, état de colonne par data-state, dernière colonne par data-done
 * États (JS)  : data-selected (carte ouverte), .w-kanban__card--dragging, .w-kanban__placeholder (jQuery UI sortable),
 *               .w-kanban__column--dragover (dépôt sur une colonne repliée)
 * Hooks JS    : #story_<id>, #<ctxKey>_<i>, span.flipBoardButton (bouton Rotation de la barre PWA) — ne pas renommer
 * Tokens      : --w-kanban-* posés sur la racine, chacun avec repli sur variables.css
 * Remplace    : le style AgileStoryBoard ci-dessus (stdlib 229-409) et pwa/modules.css 806-893, à la fin du cycle DW-6
 * Strate      : S3b du design system (kanban), anticipée — chantier work-common/WigiiOrg/kanban-redesign
 * ================================================================================================ */
.w-kanban-wrapper { display:flex; flex-direction:column; min-height:0; }
.w-kanban-wrapper > .w-kanban-zone { flex:1 1 auto; min-height:0; }
.w-kanban {
	--w-kanban-col-min: 210px;
	--w-kanban-col-max: 360px;
	--w-kanban-col-collapsed: 44px;
	--w-kanban-card-w: 220px;
	--w-kanban-card-h: 160px;
	--w-kanban-row-head-w: 56px;
	--w-kanban-gap: 10px;
	--w-kanban-radius: 8px;
	--w-kanban-fs: 13px;
	--w-kanban-bg: transparent;
	--w-kanban-col-bg: var(--fieldGroupRight, #f1f3f7);
	--w-kanban-col-border: var(--borderColor, #c7cae9);
	--w-kanban-header-bg: var(--bgEmphase2, #d6d9ff);
	--w-kanban-header-color: var(--labelColor, #32377f);
	--w-kanban-card-bg: var(--bgEmphase, #fefeff);
	--w-kanban-card-color: var(--textColorMain, #000);
	--w-kanban-card-border: var(--borderColor, #c7cae9);
	--w-kanban-card-shadow: 0 1px 2px rgba(30,34,60,.10);
	--w-kanban-card-shadow-hover: 0 4px 14px rgba(30,34,60,.16);
	--w-kanban-accent: var(--wigiiMain, #4A58C7);
	--w-kanban-muted: var(--disabledColor, #787891);
	--w-kanban-selected: var(--bgHover, #fff3c4);
	--w-kanban-late: #d64550;
	--w-kanban-late-soft: #fbe4e6;
	--w-kanban-soon: #e39a1c;
	--w-kanban-soon-soft: #fbf0d9;
	--w-kanban-p1: #e6a800;
	--w-kanban-p3: #b0c4de;
	--w-kanban-stale: #ff8c1a;
	--w-kanban-stale-14: #e53935;
	--w-kanban-stale-21: #b71c1c;
	--w-kanban-stale-30: #b71c1c;
	--w-kanban-stale-60: #7f0000;
	--w-kanban-stale-90: #4a0000;
	--w-kanban-danger: #d64550;
	display:flex;
	flex-direction:column;
	min-height:0;
	box-sizing:border-box;
	font-size:var(--w-kanban-fs);
	color:var(--w-kanban-card-color);
	background:var(--w-kanban-bg);
	position:relative;
}
html[style*="--userTheme: dark"] .w-kanban {
	--w-kanban-accent: var(--linkColor, #8a98fe);
	--w-kanban-card-shadow: 0 1px 2px rgba(0,0,0,.4);
	--w-kanban-card-shadow-hover: 0 4px 14px rgba(0,0,0,.5);
	--w-kanban-late: #f06a74;
	--w-kanban-late-soft: #3d1d21;
	--w-kanban-soon: #f0b04a;
	--w-kanban-soon-soft: #3a2c12;
	--w-kanban-selected: var(--bgHover, #4a4a63);
	--w-kanban-stale: #ffb347;
	--w-kanban-stale-14: #ff6b6b;
	--w-kanban-stale-21: #ff8a8a;
	--w-kanban-stale-30: #ff9a9a;
	--w-kanban-stale-60: #ffb0b0;
	--w-kanban-stale-90: #ffc8c8;
}
/* --- toolbar (standalone mode only; in Wigii the rotation lives in the module toolbar) --- */
.w-kanban__toolbar {
	flex:0 0 auto;
	display:flex;
	align-items:center;
	gap:6px;
	padding:2px 4px 6px 4px;
}
.w-kanban__hidden { display:none; }
/* rotation button in the classic module toolbar, same look as the switch view buttons */
#searchBar .toolbarBox .w-kanban__toolbtn {
	float:left;
	padding:6px 8px;
	margin:1px 0 0 0;
	font-size:13px;
	cursor:pointer;
	line-height:normal;
}
#searchBar .toolbarBox .w-kanban__toolbtn i { font-size:14px; }
/* reset columns: floating chip at the bottom right of the board, only when a column is collapsed or expanded */
.w-kanban > .w-kanban__reset {
	position:absolute;
	right:14px;
	bottom:10px;
	z-index:5;
	width:auto;
	height:26px;
	padding:0 10px 0 8px;
	gap:6px;
	font-size:12px;
	color:var(--w-kanban-header-color);
	background:var(--w-kanban-header-bg);
	border:1px solid var(--w-kanban-col-border);
	box-shadow:var(--w-kanban-card-shadow-hover);
	opacity:.92;
}
.w-kanban > .w-kanban__reset:hover { opacity:1; color:var(--w-kanban-accent); }
.w-kanban__btn {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:26px;
	height:26px;
	border-radius:6px;
	color:var(--w-kanban-muted);
	cursor:pointer;
	flex:0 0 auto;
	user-select:none;
	-webkit-user-select:none;
}
.w-kanban__btn:hover, .w-kanban__btn:focus-visible { background:var(--w-kanban-header-bg); color:var(--w-kanban-accent); outline:none; }
/* --- board and columns (vertical view) --- */
.w-kanban__board {
	flex:1 1 auto;
	min-height:0;
	display:flex;
	flex-direction:row;
	align-items:stretch;
	gap:var(--w-kanban-gap);
	overflow-x:auto;
	overflow-y:hidden;
	padding:0 4px 6px 4px;
	scroll-padding:var(--w-kanban-gap);
}
.w-kanban__column {
	flex:1 1 var(--w-kanban-col-min);
	min-width:var(--w-kanban-col-min);
	max-width:var(--w-kanban-col-max);
	display:flex;
	flex-direction:column;
	min-height:0;
	background:var(--w-kanban-col-bg);
	border:1px solid var(--w-kanban-col-border);
	border-radius:var(--w-kanban-radius);
	transition:min-width .15s ease, max-width .15s ease;
}
.w-kanban__column[data-state="collapsed"] {
	flex:0 0 var(--w-kanban-col-collapsed);
	min-width:var(--w-kanban-col-collapsed);
	max-width:var(--w-kanban-col-collapsed);
}
.w-kanban__column[data-state="expanded"] {
	flex:3 1 auto;
	min-width:calc(2 * var(--w-kanban-col-min));
	max-width:none;
}
/* expanded column: cards on a two-column grid. The dragged card leaves the grid (absolute), the placeholder takes its cell,
   nothing else moves. float:left is ignored by the grid but its computed value keeps jQuery UI sortable in "floating" mode. */
.w-kanban[data-layout="columns"] .w-kanban__column[data-state="expanded"] > .w-kanban__cards {
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	grid-auto-rows:max-content; /* rows keep the card height, they never shrink to fit the column */
	gap:6px 8px;
	align-content:start;
}
.w-kanban[data-layout="columns"] .w-kanban__column[data-state="expanded"] > .w-kanban__cards > .w-kanban__card,
.w-kanban[data-layout="columns"] .w-kanban__column[data-state="expanded"] > .w-kanban__cards > .w-kanban__placeholder {
	float:left;
	width:auto;
	margin:0;
	min-width:0;
}
.w-kanban__header {
	flex:0 0 auto;
	display:flex;
	align-items:center;
	gap:4px;
	padding:6px 6px 6px 4px;
	background:var(--w-kanban-header-bg);
	color:var(--w-kanban-header-color);
	border-radius:var(--w-kanban-radius) var(--w-kanban-radius) 0 0;
	border-bottom:1px solid var(--w-kanban-col-border);
	min-height:38px;
}
.w-kanban__column--dragover { outline:2px dashed var(--w-kanban-accent); outline-offset:-3px; }
.w-kanban__title {
	flex:1 1 auto;
	margin:0;
	font-size:var(--w-kanban-fs);
	font-weight:600;
	line-height:1.25;
	cursor:pointer;
	overflow:hidden;
	text-overflow:ellipsis;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
}
.w-kanban__count {
	flex:0 0 auto;
	min-width:22px;
	height:20px;
	padding:0 6px;
	border-radius:10px;
	background:var(--w-kanban-card-bg);
	color:var(--w-kanban-header-color);
	font-size:11px;
	font-weight:600;
	line-height:20px;
	text-align:center;
	font-variant-numeric:tabular-nums;
}
.w-kanban__toggle i { transition:transform .15s ease; }
.w-kanban__column[data-state="collapsed"] .w-kanban__toggle i { transform:rotate(-90deg); }
.w-kanban__column[data-state="expanded"] .w-kanban__expand { color:var(--w-kanban-accent); }
/* collapsed column: vertical header only */
.w-kanban__column[data-state="collapsed"] > .w-kanban__cards { display:none; }
.w-kanban__column[data-state="collapsed"] > .w-kanban__header {
	flex:1 1 auto;
	flex-direction:column;
	justify-content:flex-start;
	padding:6px 0;
	border-bottom:none;
	border-radius:var(--w-kanban-radius);
	cursor:pointer;
}
.w-kanban__column[data-state="collapsed"] > .w-kanban__header .w-kanban__title {
	writing-mode:vertical-rl;
	transform:rotate(180deg);
	flex:0 1 auto;
	max-height:60%;
	display:block;
	-webkit-line-clamp:unset;
	white-space:nowrap;
	margin:6px 0;
}
.w-kanban__column[data-state="collapsed"] > .w-kanban__header .w-kanban__expand { display:none; }
/* cards zone */
.w-kanban__cards {
	flex:1 1 auto;
	min-height:60px;
	overflow-y:auto;
	overflow-x:hidden;
	padding:6px;
	display:flex;
	flex-direction:column;
	gap:6px;
	border-radius:0 0 var(--w-kanban-radius) var(--w-kanban-radius);
}
/* --- card --- */
.w-kanban__card {
	position:relative;
	flex:0 0 auto;
	background:var(--w-kanban-card-bg);
	color:var(--w-kanban-card-color);
	border:1px solid var(--w-kanban-card-border);
	border-left:4px solid var(--w-kanban-card-border);
	border-radius:6px;
	box-shadow:var(--w-kanban-card-shadow);
	padding:6px 8px 6px 8px;
	cursor:pointer;
	max-height:220px;
	overflow:hidden;
	box-sizing:border-box;
	transition:box-shadow .12s ease;
}
.w-kanban__card:hover { box-shadow:var(--w-kanban-card-shadow-hover); }
.w-kanban__card[data-selected] { outline:2px solid var(--w-kanban-accent); outline-offset:-1px; background:var(--w-kanban-selected); }
/* priority: flag next to the id, whole border in the priority colour (the due date may still take the left border) */
.w-kanban__card[data-priority="P1"] { border-color:var(--w-kanban-p1); box-shadow:var(--w-kanban-card-shadow), 0 0 0 1px var(--w-kanban-p1); }
.w-kanban__card[data-priority="P3"] { border-left-color:var(--w-kanban-p3); }
.w-kanban__prio { margin-right:auto; padding-left:6px; font-size:11px; }
.w-kanban__card[data-priority="P1"] .w-kanban__prio { color:var(--w-kanban-p1); }
.w-kanban__card[data-priority="P3"] .w-kanban__prio { color:var(--w-kanban-p3); }
.w-kanban__card[data-due="soon"] { border-left-color:var(--w-kanban-soon); }
.w-kanban__card[data-due="late"] { border-left-color:var(--w-kanban-late); }
.w-kanban__card--dragging { opacity:.85; box-shadow:var(--w-kanban-card-shadow-hover); transform:rotate(1deg); z-index:20; }
.w-kanban__placeholder {
	flex:0 0 auto;
	min-height:48px;
	border:2px dashed var(--w-kanban-accent);
	border-radius:6px;
	background:transparent;
	opacity:.6;
	box-sizing:border-box;
}
.w-kanban__card-top {
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:6px;
	font-size:11px;
	color:var(--w-kanban-muted);
	margin-bottom:2px;
}
.w-kanban__id {
	font-family:ui-monospace, Menlo, Consolas, monospace;
	font-size:10.5px;
	letter-spacing:.02em;
	opacity:.8;
	user-select:all;
}
.w-kanban__due { white-space:nowrap; font-variant-numeric:tabular-nums; padding:0 5px; border-radius:9px; }
.w-kanban__card[data-due="soon"] .w-kanban__due { color:var(--w-kanban-soon); background:var(--w-kanban-soon-soft); font-weight:600; }
.w-kanban__card[data-due="late"] .w-kanban__due { color:var(--w-kanban-late); background:var(--w-kanban-late-soft); font-weight:600; }
.w-kanban__card-assignee {
	font-size:12px;
	font-weight:600;
	color:var(--w-kanban-accent);
	display:flex;
	align-items:center;
	gap:3px;
	line-height:1.3;
}
.w-kanban__card-assignee i.storyStale { color:var(--w-kanban-stale); cursor:help; }
.w-kanban__card-assignee sup.staleDays { color:var(--w-kanban-stale); font-size:.6rem; font-weight:700; cursor:help; margin-right:2px; }
.w-kanban__card-assignee i.storyStale.stale-14, .w-kanban__card-assignee sup.staleDays.stale-14 { color:var(--w-kanban-stale-14); }
.w-kanban__card-assignee i.storyStale.stale-21, .w-kanban__card-assignee sup.staleDays.stale-21 { color:var(--w-kanban-stale-21); }
.w-kanban__card-assignee i.storyStale.stale-30, .w-kanban__card-assignee sup.staleDays.stale-30 { color:var(--w-kanban-stale-30); }
.w-kanban__card-assignee i.storyStale.stale-60, .w-kanban__card-assignee sup.staleDays.stale-60 { color:var(--w-kanban-stale-60); }
.w-kanban__card-assignee i.storyStale.stale-90, .w-kanban__card-assignee sup.staleDays.stale-90 { color:var(--w-kanban-stale-90); }
.w-kanban__card-label { font-weight:600; font-size:var(--w-kanban-fs); line-height:1.3; padding:3px 0 2px 0; }
.w-kanban__card-desc {
	font-size:12px;
	line-height:1.35;
	color:var(--w-kanban-card-color);
	opacity:.85;
	display:-webkit-box;
	-webkit-line-clamp:3;
	-webkit-box-orient:vertical;
	overflow:hidden;
}
.w-kanban__card-desc p { margin:0 0 2px 0; }
.w-kanban__card-desc ul, .w-kanban__card-desc ol { margin:0; padding-left:14px; }
/* actions: discreet strip at the bottom of the card, revealed on hover on pointer devices */
.w-kanban__card-actions {
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:space-between; /* icons spread evenly on the row */
	gap:2px;
	margin-top:5px;
	padding-top:4px;
	border-top:1px solid var(--w-kanban-card-border);
	color:var(--w-kanban-muted);
}
/* second row of actions, folded behind the "more" button */
.w-kanban__actions-more { display:none; flex-basis:100%; align-items:center; justify-content:space-between; gap:2px; padding-top:3px; margin-top:2px; border-top:1px dashed var(--w-kanban-card-border); }
.w-kanban__card--more .w-kanban__actions-more { display:flex; }
.w-kanban__card--more .w-kanban__more { color:var(--w-kanban-accent); background:var(--w-kanban-header-bg); }
/* jQuery UI marks every sortable item .ui-sortable-handle with touch-action:none, which would block finger scrolling:
   the card scrolls normally, only the grip captures the finger */
.w-kanban__card.ui-sortable-handle { touch-action:auto; }
.w-kanban__grip { cursor:grab; flex:1 1 0; display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:20px; color:var(--w-kanban-muted); opacity:.6; touch-action:none; }
.w-kanban__card--dragging .w-kanban__grip { cursor:grabbing; }
.w-kanban__action {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	flex:1 1 0;      /* each button takes an equal slice of the row: the whole slice is clickable, not only the icon */
	min-width:22px;
	height:20px;
	border-radius:4px;
	font-size:12px;
	cursor:pointer;
}
.w-kanban__action:hover { background:var(--w-kanban-header-bg); color:var(--w-kanban-accent); }
.w-kanban__action--danger:hover { color:var(--w-kanban-danger); }
@media (hover: hover) and (pointer: fine) {
	.w-kanban__card-actions { max-height:0; margin-top:0; padding-top:0; border-top-color:transparent; overflow:hidden; transition:max-height .15s ease, margin .15s ease, padding .15s ease; }
	.w-kanban__card:hover .w-kanban__card-actions, .w-kanban__card:focus-within .w-kanban__card-actions { max-height:28px; margin-top:5px; padding-top:4px; border-top-color:var(--w-kanban-card-border); }
	.w-kanban__card--more:hover .w-kanban__card-actions, .w-kanban__card--more:focus-within .w-kanban__card-actions { max-height:60px; }
	.w-kanban[data-layout="rows"] .w-kanban__card .w-kanban__card-actions { margin:0; padding:0 8px; border-top-color:transparent; }
	.w-kanban[data-layout="rows"] .w-kanban__card:hover .w-kanban__card-actions, .w-kanban[data-layout="rows"] .w-kanban__card:focus-within .w-kanban__card-actions { margin:0; padding:4px 8px; border-top-color:var(--w-kanban-card-border); }
	.w-kanban__card { max-height:240px; }
}
/* --- coarse pointer (finger): bigger targets, actions always visible --- */
@media (pointer: coarse) {
	.w-kanban__btn { width:34px; height:32px; }
	.w-kanban__header { min-height:44px; }
	.w-kanban__action { min-width:32px; height:30px; font-size:14px; border-radius:6px; background:var(--w-kanban-col-bg); }
	.w-kanban__grip { min-width:32px; height:30px; font-size:16px; opacity:.8; }
	.w-kanban__card-actions { gap:4px; justify-content:space-between; margin-top:6px; padding-top:5px; }
	.w-kanban__actions-more { justify-content:space-between; padding-top:4px; margin-top:3px; }
	/* with a finger the card is dragged: the arrow buttons are useless, only grip, edit and more (delete) remain */
	.w-kanban__action.storyPreviousStatusButton, .w-kanban__action.storyNextStatusButton,
	.w-kanban__action.storyMoveTopButton, .w-kanban__action.storyMoveUpButton,
	.w-kanban__action.storyMoveDownButton, .w-kanban__action.storyMoveBottomButton, .w-kanban__more { display:none; }
	.w-kanban[data-layout="rows"] .w-kanban__card { padding-bottom:44px; }
	.w-kanban[data-layout="rows"] .w-kanban__card-actions { padding:5px 8px; }
	.w-kanban[data-layout="rows"] .w-kanban__card-desc { -webkit-line-clamp:2; }
}
/* --- horizontal view: statuses as rows, cards side by side --- */
.w-kanban[data-layout="rows"] > .w-kanban__board {
	flex-direction:column;
	overflow-x:hidden;
	overflow-y:auto;
	align-items:stretch;
}
.w-kanban[data-layout="rows"] .w-kanban__column {
	flex:0 0 auto;
	flex-direction:row;
	min-width:0;
	max-width:none;
	min-height:0;
	transition:none;
}
.w-kanban[data-layout="rows"] .w-kanban__header {
	flex:0 0 var(--w-kanban-row-head-w);
	width:var(--w-kanban-row-head-w);
	flex-direction:column;
	justify-content:flex-start;
	padding:6px 0;
	border-bottom:none;
	border-right:1px solid var(--w-kanban-col-border);
	border-radius:var(--w-kanban-radius) 0 0 var(--w-kanban-radius);
	min-height:120px;
	/* the vertical title must not drive the row height: the cards do (size containment) */
	contain:size;
	overflow:hidden;
}
.w-kanban[data-layout="rows"] .w-kanban__title {
	writing-mode:vertical-rl;
	transform:rotate(180deg);
	flex:1 1 auto;
	min-height:0;
	max-height:none;
	/* two vertical lines, clamped */
	display:-webkit-box;
	-webkit-box-orient:vertical;
	-webkit-line-clamp:2;
	white-space:normal;
	font-size:12px;
	line-height:1.3;
	margin:4px 0;
	overflow:hidden;
}
.w-kanban[data-layout="rows"] .w-kanban__cards {
	flex:1 1 auto;
	display:block;
	white-space:nowrap;
	/* always-present horizontal scrollbar so every row has the same height (cards have a fixed height) */
	overflow-x:scroll;
	overflow-y:hidden;
	min-height:0;
	padding:6px;
	border-radius:0 var(--w-kanban-radius) var(--w-kanban-radius) 0;
}
.w-kanban[data-layout="rows"] .w-kanban__card, .w-kanban[data-layout="rows"] .w-kanban__placeholder {
	display:inline-block;
	vertical-align:top;
	white-space:normal;
	width:var(--w-kanban-card-w);
	margin-right:6px;
	margin-bottom:0;
}
/* fixed card height in the horizontal view: rows never change size, actions overlay the bottom of the card */
.w-kanban[data-layout="rows"] .w-kanban__card {
	height:var(--w-kanban-card-h);
	max-height:none;
	padding-bottom:30px;
}
.w-kanban[data-layout="rows"] .w-kanban__placeholder { height:var(--w-kanban-card-h); min-height:0; }
.w-kanban[data-layout="rows"] .w-kanban__card-actions {
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	margin:0;
	padding:4px 8px;
	background:var(--w-kanban-card-bg);
	border-top:1px solid var(--w-kanban-card-border);
	border-radius:0 0 6px 6px;
}
.w-kanban[data-layout="rows"] .w-kanban__card-desc { -webkit-line-clamp:3; }
/* collapsed row: one thin horizontal line with title and count */
.w-kanban[data-layout="rows"] .w-kanban__column[data-state="collapsed"] {
	flex:0 0 auto;
	min-height:0;
}
.w-kanban[data-layout="rows"] .w-kanban__column[data-state="collapsed"] > .w-kanban__cards { display:none; }
.w-kanban[data-layout="rows"] .w-kanban__column[data-state="collapsed"] > .w-kanban__header {
	flex:1 1 auto;
	width:auto;
	flex-direction:row;
	min-height:36px;
	padding:4px 6px 4px 4px;
	border-right:none;
	border-radius:var(--w-kanban-radius);
}
.w-kanban[data-layout="rows"] .w-kanban__column[data-state="collapsed"] > .w-kanban__header .w-kanban__title {
	writing-mode:horizontal-tb;
	transform:none;
	flex:1 1 auto;
	max-height:none;
	margin:0;
}
/* expanded row: cards wrap on several lines and the row takes the remaining height */
.w-kanban[data-layout="rows"] .w-kanban__column[data-state="expanded"] {
	flex:1 1 auto;
	min-height:200px;
}
.w-kanban[data-layout="rows"] .w-kanban__column[data-state="expanded"] > .w-kanban__cards {
	white-space:normal;
	overflow-x:hidden;
	overflow-y:auto;
}
.w-kanban[data-layout="rows"] .w-kanban__column[data-state="expanded"] > .w-kanban__header .w-kanban__title { max-height:none; }
/* --- narrow containers (PWA mobile): compact spacing, full-width cards in rows --- */
.w-kanban-wrapper, .w-kanban-zone { container-type:inline-size; }
@container (max-width: 600px) {
	.w-kanban { --w-kanban-gap:6px; --w-kanban-col-min:85cqw; --w-kanban-col-max:85cqw; --w-kanban-card-w:210px; }
	.w-kanban__board { scroll-snap-type:x proximity; }
	.w-kanban__column { scroll-snap-align:start; }
	.w-kanban__card-actions { max-height:none; }
	/* horizontal view on a narrow container: the row header is a horizontal bar above the cards strip */
	.w-kanban[data-layout="rows"] .w-kanban__column { flex-direction:column; }
	.w-kanban[data-layout="rows"] .w-kanban__header {
		flex:0 0 auto;
		width:auto;
		flex-direction:row;
		min-height:36px;
		padding:4px 6px 4px 4px;
		border-right:none;
		border-bottom:1px solid var(--w-kanban-col-border);
		border-radius:var(--w-kanban-radius) var(--w-kanban-radius) 0 0;
		contain:none;
	}
	.w-kanban[data-layout="rows"] .w-kanban__title {
		writing-mode:horizontal-tb;
		transform:none;
		font-size:var(--w-kanban-fs);
		margin:0;
		white-space:normal;
		display:-webkit-box;
		-webkit-line-clamp:2;
		-webkit-box-orient:vertical;
	}
	.w-kanban[data-layout="rows"] .w-kanban__cards { border-radius:0 0 var(--w-kanban-radius) var(--w-kanban-radius); }
	.w-kanban[data-layout="rows"] .w-kanban__column[data-state="collapsed"] > .w-kanban__header { border-bottom:none; border-radius:var(--w-kanban-radius); }
	/* expanded row on a narrow container: full-width cards */
	.w-kanban[data-layout="rows"] .w-kanban__column[data-state="expanded"] > .w-kanban__cards > .w-kanban__card { width:100%; margin-right:0; }
	/* the board follows the page scroll on a narrow container: the reset chip floats above the bottom bar */
	.w-kanban > .w-kanban__reset { position:fixed; right:12px; bottom:84px; }
}
/**************************************
* Wigii NCD StoryWhiteboard styling
**************************************/
button.ncd.storyWhiteboardCreateButton {
	font-size:large;
	background-color:green;
	color:white;
	border:none;
	padding:5px;
	margin-right:20px;
	margin-left:5px;
}
span.storyBoardMoveOutAllButton {		
	position:relative;
	font-size:20px;
	top:10px;
	left:5px;
	color:#3333ff;
	border: solid 1px #3333ff;
	border-radius: 5px;
	padding:5px 4px 5px 4px;
	cursor:pointer;
	display:none;
}
span.storyBoardSaveButton {		
	position:relative;
	font-size:20px;
	top:10px;
	left:10px;
	color:black;
	border: solid 1px #3333ff;
	border-radius: 5px;
	padding:5px 4px 5px 4px;
	cursor:pointer;
}
div.storyWhiteboardColumn {
	border: solid 1px black;		
	border-right-style: dashed;
	overflow-x:visible;
	overflow-y:auto;
	padding-bottom:3px;
}
div.storyWhiteboard input.storySearch {
	width:96%;
	border: solid 2px blue;
	border-radius: 3px;
	margin: 2px;
	margin-bottom:5px;	
}
div.storyWhiteboardBoard {
	border: solid 1px black;	
	border-left-style: dashed;	
	overflow-x:auto;
	overflow-y:auto;
}
div.storyWhiteboard div.dragOn {
	border: solid 1px blue;
}
div.story.ui-draggable.ui-draggable-dragging {
	max-width:150px;
}
div.storyWhiteboard div.story {
	cursor:pointer;
	background-color:white;
	border: solid 2px #3333ff;
	border-radius: 5px;
	margin:2px;
	padding-left:2px;
	padding-right:2px;	
	max-height:100px;
	max-width:150px;
	overflow-y:hidden;	
}
div.storyWhiteboard div.story span {	
	display:block;	
}
div.storyWhiteboard div.story span.storyMoveOutButton {		
	display:inline;
	color:#3333ff;
	padding:5px 4px 5px 4px;
	float:left;
}
div.storyWhiteboard div.story span.storyEditButton {		
	display:inline;	
	float:left;
	padding:4px 4px 6px 4px;
}
div.storyWhiteboard div.story span.storyDeleteButton {		
	display:inline;
	color:red;
	padding:4px 4px 6px 4px;
	float:left;
}
div.storyWhiteboard div.story span.storyDate {		
	font-size:x-small;
	padding:2px 4px 8px 4px;
	float:right;
}
div.storyWhiteboard div.story span.storyContent {		
	font-size:small;
	font-weight:normal;
	padding-top:4px;
	padding-bottom:4px;
}
div.storyWhiteboard div.story span.storyContent h1,
div.storyWhiteboard div.story span.storyContent h2,
div.storyWhiteboard div.story span.storyContent h3 {		
	font-size:small;
	font-weight:bold;
}
div.storyWhiteboard div.story span.storyContent p {		
	font-size:small;
	font-weight:normal;
}
div.storyWhiteboardForm {
	margin:5px;
	margin-right:10px;
}
/********************************
* Wigii NCD UIRecorder styling
*********************************/
div.uiRecorderPlayList {
	margin-top:5px;
}
div.uiRecorderPlayList ul {
	list-style: none;
	margin:0;
	padding:0;
}
div.uiRecorderPlayList li {
	padding-top:4px;
	padding-bottom:4px;
	padding-left:2px;
	padding-right:2px;
}
div.uiRecorderPlayList li.highlighted {
	background-color:#3333ff
}
div.uiRecorderPlayList li > span {
	padding-left:2px;
	padding-right:2px;
}
div.uiRecorderPlayList li > span.uiRecordDomId {
	margin:2px;
	border-style:solid;
	border-width:2px;
	border-radius:5px;
	border-color:#3333ff;
}
div.uiRecorderPlayList li > span.uiRecordInputValue {
	font-weight:bold;
}
button#uiRecorderPlayButton.uiRecorderPlaying {
	background-color:#3333ff
}
button#uiRecorderStartButton.uiRecorderRecording {
	background-color:#3333ff
}