/* pyvoh */
/* (c) Wim Vanaenrode */

/* reset css */
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit}input,textarea,select{*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

/* core styling */
body, html 
{
	margin: 0;
	padding: 0;
	height: 100%;
	overflow: hidden;
	background-color: var(--gen-bgc);
}

/* logo */
#pi_logo
{
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	width: 100vw;
}
.pc_logo 
{
	max-width: 50%;
	max-height: 50%;
	height: auto;
}

/* panels */
#pi_container 
{
	width: 100%;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
}
.pc_panel 
{
	flex: 1;
	display: flex;
	flex-direction: column;
	transition: all 0.3s ease;
}

.pc_panel_title {
    padding: 10px 15px 10px 0px;
    font-size: 18px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 24px;
    font-family: var(--panel-X-title-font);
    overflow: hidden; /* Prevent content overflow */
}

.pc_panel_title_right_icons {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.pc_panel_title_right_icons > *:hover {
    cursor: pointer;
}

.pc_panel_title_right_icons > * {
    margin-right: 20px;
}

.pc_panel_title_right_icons > *:last-child {
    margin-right: 0;
}

.pc_panel_title_text {
    flex: 1;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0 15px;
    min-width: 0; /* Important: Ensures proper shrinking */
}


.pc_panel_content 
{
		flex-grow: 1;
		overflow-y: auto;
		padding: 15px;
		font-size: 16px;
		box-sizing: border-box;
		scrollbar-width: none;
  	-ms-overflow-style: none;
}
.pc_panel_content::-webkit-scrollbar 
{
  display: none;
}
#pi_panel_A 
{ 
	background-color: var(--panel-A-bgc); 
}
#pi_panel_A .pc_panel_title 
{ 
	background-color: var(--panel-A-title-bgc);
	color: var(--panel-A-title-txc);
}
#pi_panel_B 
{ 
	background-color: var(--panel-B-bgc);;
}
#pi_panel_B .pc_panel_title 
{ 
	background-color: var(--panel-B-title-bgc);
	color: var(--panel-B-title-txc);
}
#pi_panel_C 
{ 
	background-color: var(--panel-C-bgc);
}
#pi_panel_C .pc_panel_title 
{ 
	background-color: var(--panel-C-title-bgc);
	color: var(--panel-C-title-txc);
}


/* cards */
.pc_card
{
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
	margin-bottom: 15px;
	width: 100%;
	transition: box-shadow 0.3s ease-in-out;
	display: flex;
	flex-direction: column;
	font-family: Arial, sans-serif;
	font-size: 18px;
}
.pc_card_top
{
	display: flex;
  align-items: stretch;
  width: 100%;
  overflow: hidden;
}
.pc_card_ellipsis 
{
  flex: 0 0 20px; /* Fixed width for ellipsis column */
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding-right: 10px;
  padding-top: 5px;
  font-size: 20px;
}
.pc_card_ellipsis > *:hover
{
	cursor: pointer;
}
.pc_card_data 
{
  display: flex;
  flex: 1;
  flex-direction: column;
  width: 100%;
  min-width: 0; /* Prevent flex item from growing beyond parent's boundaries */
  overflow: hidden; /* Clip overflow content */
  box-sizing: border-box;
}
.pc_card_data_C
{
    width: 100%;
    padding: 10px 15px;
    white-space: pre;
}
.pc_card_data_I
{
  display: flex;
  flex-direction: column;
  width: 100%;
  padding: 10px 15px;
}
.pc_card_data_I_label
{
		font-size: 15px;
    width: 100%;
}
.pc_card_data_I_value
{
    width: 100%;
    margin-bottom: 10px;
}
.pc_card_data_I_list
{
	list-style-type: none;
  padding: 0;
}
.pc_card_data_I_listHeader
{
	font-weight: bold;
}
.pc_card_data_I_listItem
{
	display: flex;
	align-items: center;
	margin: 5px 0;
}
.pc_card_data_I_listItem .pc_card_data_I_listIcon 
{
	margin-right: 10px;
}
.pc_card_data_I_listDone .pc_card_data_I_listIcon 
{
	color: var(--card-IL-item-checked); /* Color for completed tasks */
}
.pc_card_data_I_listNotDone .pc_card_data_I_listIcon 
{
	color: var(--card-IL-item-unchecked); /* Color for not completed tasks */
}
.pc_card_data_Q
{
    width: 100%; /* Takes up all horizontal space of the parent */
    min-height: 50px; /* Minimum height (1 line of text) */
    max-height: 100px; /* Maximum height (adjust for ~5 lines of text) */
    overflow: hidden; /* Hide scrollbars */
    overflow-y: auto; /* Enable vertical scrolling without showing scrollbar */
    resize: none; /* Disable manual resizing */
    padding: 10px 15px; /* Add padding for better appearance */
    font-family: inherit; /* Inherit font-family from parent */
    font-size: inherit; /* Inherit font-size from parent */
    background: inherit; /* Inherit background color from parent */
    color: inherit; /* Inherit text color from parent */
    line-height: 1.4; /* Adjust line height to match design */
    box-sizing: border-box; /* Include padding in width and height calculations */
    border: none; /* No border */
    border-radius: 0; /* Ensure no rounded corners */
    scrollbar-width: none; /* For Firefox: Hide scrollbar while enabling scrolling */
}
.pc_card_data_Q:focus 
{
    border: none; /* Ensure no border on focus */
    outline: none; /* Remove any default focus outline */
}
.pc_card_data_Q::-webkit-scrollbar 
{
    display: none; /* Hide scrollbar while enabling scrolling */
}
.pc_card_data_R
{
  width: 100%;
  padding: 10px 15px;
  box-sizing: border-box;
}
.pc_card_data_S
{
    width: 100%; /* Takes up all horizontal space of the parent */
		height: 40px;

    padding: 10px 15px; /* Add padding for better appearance */
    font-family: inherit; /* Inherit font-family from parent */
    font-size: inherit; /* Inherit font-size from parent */
    background: inherit; /* Inherit background color from parent */
    color: inherit; /* Inherit text color from parent */
    box-sizing: border-box; /* Include padding in width and height calculations */
    border: none; /* No border */
    border-radius: 0; /* Ensure no rounded corners */
}
.pc_card_data_S:focus 
{
    border: none; /* Ensure no border on focus */
    outline: none; /* Remove any default focus outline */
}
.pc_card_data_T
{
    width: 100%;
    padding: 10px 15px;
}
.pc_card_data_Z1
{
    width: 100%;
    padding: 10px 15px;
    overflow: hidden;
    white-space: normal; /* Allow text wrapping */
  word-wrap: break-word; /* Ensure long words break to the next line */
  box-sizing: border-box;
}
.pc_card_data_Z2
{
	width: 100%;
    padding: 0px 15px 15px 15px;
    font-size: 12px;
    overflow: hidden;
    white-space: normal; /* Allow text wrapping */
  word-wrap: break-word; /* Ensure long words break to the next line */
  box-sizing: border-box;
}
.pq_card_Z
{
	cursor: pointer;
}
.pc_card_icon 
{
  padding: 10px 15px;
  border-top: 1px solid var(--gen-card-divider);
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.pc_card_icon_left 
{
  display: flex;
  justify-content: flex-start;
  flex-grow: 1;
  gap: 15px;
}
.pc_card_icon_right 
{
  margin-right: 0;
  margin-left: auto;
}
.pc_card_icon_left > *:hover, .pc_card_icon_right > *:hover
{
	cursor: pointer;
}

/* media */
@media (orientation: portrait) 
{
	#pi_container 
	{
		flex-direction: column;
	}
	.pc_panel 
	{
		flex: 0 0 100%;
		height: 100%;
	}
	#pi_panel_A, #pi_panel_B, #pi_panel_C 
	{
		display: none;
	}
}
@media (orientation: landscape) 
{
	#pi_container 
	{
		flex-direction: row;
	}
	.pc_panel 
	{
		flex: 1;
		height: 100%;
	}
	#pi_panel_A, #pi_panel_B, #pi_panel_C 
	{
		display: flex;
		width: calc(33.33%);
	}
}
/* pyvoh */
/* (c) Wim Vanaenrode */


/* default theme */
:root 
{
	/* GC card */
	--card-GC-data-bgc: #A9B0E0;
	--card-GC-data-txc: #080F46;

	/* GG card */
	--card-GG-data-bgc: #E6E7F9;
	--card-GG-data-txc: #080F46;
	--card-GG-icon-bgc: #E6E7F9;
	--card-GG-icon-txc: #080F46;

	/* GQ card */
	--card-GQ-data-bgc: #E6E7F9;
	--card-GQ-data-txc: #080F46;
	--card-GQ-icon-bgc: #E6E7F9;
	--card-GQ-icon-txc: #080F46;

	/* GP card */
	--card-GP-data-bgc: #E6E7F9;
	--card-GP-data-txc: #080F46;

	/* GR card */
	--card-GR-data-bgc: #CBD0F0;
	--card-GR-data-txc: #080F46;

	/* GS card */
	--card-GS-data-bgc: #E6E7F9;
	--card-GS-data-txc: #080F46;

	/* GT card */
	--card-GT-data-bgc: #080F46;
	--card-GT-data-txc: #CCCCCC;

		/* IB card */
	--card-IB-data-bgc: #BCD3F2;
	--card-IB-data-txc: #080F46;
	--card-IB-icon-bgc: #BCD3F2;
	--card-IB-icon-txc: #080F46;
	--card-IB-icon-col: #080F46;

	/* IL card */
	--card-IL-data-bgc: #F3D9DC;
	--card-IL-data-txc: #080F46;
	--card-IL-icon-bgc: #F3D9DC;
	--card-IL-icon-txc: #080F46;
	--card-IL-icon-col: #080F46;
	--card-IL-item-unchecked: #080F46;
	--card-IL-item-checked: #14591D;

		/* IS card */
	--card-IS-data-bgc: #C0C5C1;
	--card-IS-data-txc: #080F46;
	--card-IS-icon-bgc: #C0C5C1;
	--card-IS-icon-txc: #080F46;
	--card-IS-icon-col: #080F46;

		/* IT card */
	--card-IT-data-bgc: #F5E2C8;
	--card-IT-data-txc: #080F46;
	--card-IT-icon-bgc: #F5E2C8;
	--card-IT-icon-txc: #080F46;
	--card-IT-icon-col: #080F46;
	--card-IT-od-data-bgc: #BD1E1E;
	--card-IT-od-data-txc: #FFFFFF;
	--card-IT-od-icon-bgc: #BD1E1E;
	--card-IT-od-icon-txc: #FFFFFF;
	--card-IT-od-icon-col: #FFFFFF;
	
	/* generic */
  --gen-bgc: #080F46;
  --gen-card-divider: #080F46; 

  /* panels */
  --panel-A-bgc: #080F46;
  --panel-A-title-bgc: #333333;
  --panel-A-title-txc: #CCCCCC;
  --panel-B-bgc: #080F46;
  --panel-B-title-bgc: #333333;
  --panel-B-title-txc: #CCCCCC;
  --panel-C-bgc: #080F46;
  --panel-C-title-bgc: #333333;
  --panel-C-title-txc: #CCCCCC;
  --panel-X-title-font: 'Arial', sans-serif;
}

.pyvoh_theme_light
{
	/* GC card F0F4EF */
	--card-GC-data-bgc: #F0F4EF;
	--card-GC-data-txc: #080F46;

	/* GG card */
	--card-GG-data-bgc: #F0F4EF;
	--card-GG-data-txc: #080F46;
	--card-GG-icon-bgc: #F0F4EF;
	--card-GG-icon-txc: #080F46;

	/* GQ card */
	--card-GQ-data-bgc: #F0F4EF;
	--card-GQ-data-txc: #080F46;
	--card-GQ-icon-bgc: #F0F4EF;
	--card-GQ-icon-txc: #080F46;

	/* GP card */
	--card-GP-data-bgc: #F0F4EF;
	--card-GP-data-txc: #080F46;

	/* GR card */
	--card-GR-data-bgc: #F0F4EF;
	--card-GR-data-txc: #080F46;

	/* GS card */
	--card-GS-data-bgc: #F0F4EF;
	--card-GS-data-txc: #080F46;

	/* GT card */
	--card-GT-data-bgc: #F0F4EF;
	--card-GT-data-txc: #080F46;

	/* IB card */
	--card-IB-data-bgc: #F0F4EF; /* 240-244-239 --- blended 10% is 217-221-222|D9DDDE --- blended 20% is 194-198-205|C2C6CD*/
	--card-IB-data-txc: #080F46;
	--card-IB-icon-bgc: #F0F4EF;
	--card-IB-icon-txc: #080F46; /* 008-015-70 */
	--card-IB-icon-col: #080F46;

	/* IL card */
	--card-IL-data-bgc: #F0F4EF; /* 240-244-239 --- blended 10% is 240-229-219|F0E5DB --- blended 20% is 239-214-199 */
	--card-IL-data-txc: #080F46;
	--card-IL-icon-bgc: #F0F4EF;
	--card-IL-icon-txc: #EB5E28; /* 235-094-040 */
	--card-IL-icon-col: #EB5E28;
	--card-IL-item-unchecked: #EB5E28;
	--card-IL-item-checked: #0C7C59;

	/* IS card */
	--card-IS-data-bgc: #F0F4EF; /* 240-244-239 --- blended 10% is 221-225-220|DDE1DC --- blended 20% is 202-205-201 */
	--card-IS-data-txc: #080F46;
	--card-IS-icon-bgc: #F0F4EF;
	--card-IS-icon-txc: #333333; /* 051-051-051 */
	--card-IS-icon-col: #333333;

	/* IT card */
	--card-IT-data-bgc: #F0F4EF; /* 240-244-239 --- blended 10% is 217-232-224|D9E8E0 --- blended 20% is 194-220-209 */
	--card-IT-data-txc: #080F46; 
	--card-IT-icon-bgc: #F0F4EF;
	--card-IT-icon-txc: #0C7C59; /* 012-124-89 */
	--card-IT-icon-col: #0C7C59;

	/* generic */
  --gen-bgc: #080F46;
  --gen-card-divider: #080F46; 

  /* panels */
  --panel-A-bgc: #080F46;
  --panel-A-title-bgc: #333333;
  --panel-A-title-txc: #CCCCCC;
  --panel-B-bgc: #080F46;
  --panel-B-title-bgc: #333333;
  --panel-B-title-txc: #CCCCCC;
  --panel-C-bgc: #080F46;
  --panel-C-title-bgc: #333333;
  --panel-C-title-txc: #CCCCCC;
  --panel-X-title-font: 'Arial', sans-serif;
}

.pyvoh_theme_org
{
	/* GC card */
	--card-GC-data-bgc: #A9B0E0;
	--card-GC-data-txc: #080F46;

	/* GG card */
	--card-GG-data-bgc: #E6E7F9;
	--card-GG-data-txc: #080F46;
	--card-GG-icon-bgc: #E6E7F9;
	--card-GG-icon-txc: #080F46;

	/* GQ card */
	--card-GQ-data-bgc: #E6E7F9;
	--card-GQ-data-txc: #080F46;
	--card-GQ-icon-bgc: #E6E7F9;
	--card-GQ-icon-txc: #080F46;

	/* GP card */
	--card-GP-data-bgc: #E6E7F9;
	--card-GP-data-txc: #080F46;

	/* GR card */
	--card-GR-data-bgc: #CBD0F0;
	--card-GR-data-txc: #080F46;

	/* GS card */
	--card-GS-data-bgc: #E6E7F9;
	--card-GS-data-txc: #080F46;

	/* GT card */
	--card-GT-data-bgc: #080F46;
	--card-GT-data-txc: #CCCCCC;

		/* IB card */
	--card-IB-data-bgc: #FFE548;
	--card-IB-data-txc: #080F46;
	--card-IB-icon-bgc: #FFE548;
	--card-IB-icon-txc: #080F46;
	--card-IB-icon-col: #080F46;

	/* IL card */
	--card-IL-data-bgc: #EB5E28;
	--card-IL-data-txc: #080F46;
	--card-IL-icon-bgc: #EB5E28;
	--card-IL-icon-txc: #080F46;
	--card-IL-icon-col: #080F46;
	--card-IL-item-unchecked: #080F46;
	--card-IL-item-checked: #FFE548;

		/* IS card */
	--card-IS-data-bgc: #C6C5B9;
	--card-IS-data-txc: #080F46;
	--card-IS-icon-bgc: #C6C5B9;
	--card-IS-icon-txc: #080F46;
	--card-IS-icon-col: #080F46;

		/* IT card */
	--card-IT-data-bgc: #0C7C59;
	--card-IT-data-txc: #FFFFFF;
	--card-IT-icon-bgc: #0C7C59;
	--card-IT-icon-txc: #FFFFFF;
	--card-IT-icon-col: #FFFFFF;
	
	/* generic */
  --gen-bgc: #080F46;
  --gen-card-divider: #080F46; 

  /* panels */
  --panel-A-bgc: #080F46;
  --panel-A-title-bgc: #333333;
  --panel-A-title-txc: #CCCCCC;
  --panel-B-bgc: #080F46;
  --panel-B-title-bgc: #333333;
  --panel-B-title-txc: #CCCCCC;
  --panel-C-bgc: #080F46;
  --panel-C-title-bgc: #333333;
  --panel-C-title-txc: #CCCCCC;
  --panel-X-title-font: 'Arial', sans-serif;
}


