/* tabbar end */
:root {
	--ion-font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	/*
	--ion-color-primary: #01c2c3;
	--ion-color-primary-rgb: 1,194,195;
	--ion-color-primary-contrast: #ffffff;
	--ion-color-primary-contrast-rgb: 255,255,255;
	--ion-color-primary-shade: #01abac;
	--ion-color-primary-tint: #1ac8c9;*/

	--ion-color-sky: #99CCFF;
	--ion-color-sky-rgb: 153,204,255;
	--ion-color-sky-contrast: #000000;
	--ion-color-sky-contrast-rgb: 0,0,0;
	--ion-color-sky-shade: #87b4e0;
	--ion-color-sky-tint: #a3d1ff;

  	--ion-color-lavender: #97B3FD;
	--ion-color-lavender-rgb: 151,179,253;
	--ion-color-lavender-contrast: #000000;
	--ion-color-lavender-contrast-rgb: 0,0,0;
	--ion-color-lavender-shade: #859edf;
	--ion-color-lavender-tint: #a1bbfd;

	--ion-color-bg: #f8fafc;
	--ion-color-bg-rgb: 248,250,252;
	--ion-color-bg-contrast: #000000;
	--ion-color-bg-contrast-rgb: 0,0,0;
	--ion-color-bg-shade: #dadcde;
	--ion-color-bg-tint: #f9fbfc;

	--ion-color-action: #01c2c3;
	--ion-color-action-rgb: 1,194,195;
	--ion-color-action-contrast: #ffffff;
	--ion-color-action-contrast-rgb: 255,255,255;
	--ion-color-action-shade: #01abac;
	--ion-color-action-tint: #1ac8c9;

	--ion-color-section: #DCF8FB;
	--ion-color-section-rgb: 221,241,234;
	--ion-color-section-contrast: #000000;
	--ion-color-section-contrast-rgb: 0,0,0;
	--ion-color-section-shade: #c2d4ce;
	--ion-color-section-tint: #e0f2ec;

	--ion-color-btn: #01c2c3;
	--ion-color-btn-rgb: 1,194,195;
	--ion-color-btn-contrast: #ffffff;
	--ion-color-btn-contrast-rgb: 255,255,255;
	--ion-color-btn-shade: #01abac;
	--ion-color-btn-tint: #1ac8c9;


}
.ion-color-sky {
	--ion-color-base: var(--ion-color-sky);
	--ion-color-base-rgb: var(--ion-color-sky-rgb);
	--ion-color-contrast: var(--ion-color-sky-contrast);
	--ion-color-contrast-rgb: var(--ion-color-sky-contrast-rgb);
	--ion-color-shade: var(--ion-color-sky-shade);
	--ion-color-tint: var(--ion-color-sky-tint);
}
.ion-color-lavender {
	--ion-color-base: var(--ion-color-lavender);
	--ion-color-base-rgb: var(--ion-color-lavender-rgb);
	--ion-color-contrast: var(--ion-color-lavender-contrast);
	--ion-color-contrast-rgb: var(--ion-color-lavender-contrast-rgb);
	--ion-color-shade: var(--ion-color-lavender-shade);
	--ion-color-tint: var(--ion-color-lavender-tint);
}
.ion-color-bg {
	--ion-color-base: var(--ion-color-bg);
	--ion-color-base-rgb: var(--ion-color-bg-rgb);
	--ion-color-contrast: var(--ion-color-bg-contrast);
	--ion-color-contrast-rgb: var(--ion-color-bg-contrast-rgb);
	--ion-color-shade: var(--ion-color-bg-shade);
	--ion-color-tint: var(--ion-color-bg-tint);
}
.ion-color-action {
	--ion-color-base: var(--ion-color-action);
	--ion-color-base-rgb: var(--ion-color-action-rgb);
	--ion-color-contrast: var(--ion-color-action-contrast);
	--ion-color-contrast-rgb: var(--ion-color-action-contrast-rgb);
	--ion-color-shade: var(--ion-color-action-shade);
	--ion-color-tint: var(--ion-color-action-tint);
}
.ion-color-section {
	--ion-color-base: var(--ion-color-section);
	--ion-color-base-rgb: var(--ion-color-section-rgb);
	--ion-color-contrast: var(--ion-color-section-contrast);
	--ion-color-contrast-rgb: var(--ion-color-section-contrast-rgb);
	--ion-color-shade: var(--ion-color-section-shade);
	--ion-color-tint: var(--ion-color-section-tint);
}
.ion-color-btn {
	--ion-color-base: var(--ion-color-btn);
	--ion-color-base-rgb: var(--ion-color-btn-rgb);
	--ion-color-contrast: var(--ion-color-btn-contrast);
	--ion-color-contrast-rgb: var(--ion-color-btn-contrast-rgb);
	--ion-color-shade: var(--ion-color-btn-shade);
	--ion-color-tint: var(--ion-color-btn-tint);
}
ion-segment-button::part(indicator-background) {
	background: #01c2c3;
}

/* Material Design styles */
ion-segment-button.md::part(native) {
	color: #000;
}

.segment-button-checked.md::part(native) {
	color: #01c2c3;
}

ion-segment-button.md::part(indicator-background) {
	height: 4px;
}

/* iOS styles */
ion-segment-button.ios::part(native) {
	color: #01c2c3;
}

.segment-button-checked.ios::part(native) {
	color: #fff;
}

ion-segment-button.ios::part(indicator-background) {
	border-radius: 20px;
}

.text-monospace {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !important;
}

ion-badge{
	--background:var(--ion-color-success);
	--color:var(--ion-color-bg);
	font-size: 0.7rem;
}
ion-searchbar input{
	font-size: 0.6rem !important;
}

.text-justify {
  text-align: justify !important;
}

.text-wrap {
  white-space: normal !important;
}

.text-nowrap {
  white-space: nowrap !important;
}

.text-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.text-center {
  text-align: center !important;
}

.center-block {
  margin-left: auto;
  margin-right: auto;
}
.text-blue{
	color: #007bff;
}
.text-orange{
	color: #fd7e14;
}
.img-thumbnail {
/*
  padding: 0.25rem;
*/
  padding: 0.15rem;
  background-color: #fff;
  border: 1px solid #dee2e6;
  border-radius: 0.25rem;
  max-width: 100%;
  height: auto;
}

.border {
  border: 1px solid #dee2e6 !important;
}

.border-top {
  border-top: 1px solid #dee2e6 !important;
}

.border-right {
  border-right: 1px solid #dee2e6 !important;
}

.border-bottom {
  border-bottom: 1px solid #dee2e6 !important;
}

.border-left {
  border-left: 1px solid #dee2e6 !important;
}
.hide {
	display: none;
}
#loader-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  background: #fff;
  opacity: 1;
  filter: Alpha(opacity=60);
  z-index: 9999
}

#loader {
	display: inline-block;
	position: relative;
	left: 50%;
	top: 50%;
	width: 150px;
	height: 150px;
	margin: -75px 0 0 -75px;
	
	border-radius: 50%;
	border: 3px solid transparent;
	border-top-color: yellow;

	-webkit-animation: spin 1.5s infinite;
	animation: spin 1.5s infinite;
}

#loader::before {
	content: "";
	position: absolute;
	top: 5px;
	left:5px;
	right: 5px;
	bottom: 5px;
	border-radius: 50%;
	border: 3px solid transparent;
	border-top-color: orange;
	-webkit-animation: spin 1.5s infinite;
	animation: spin 1.5s infinite;
}

#loader::after {
	content: "";
	position: absolute;
	top: 15px;
	left:15px;
	right: 15px;
	bottom: 15px;
	border-radius: 50%;
	border: 3px solid transparent;
	border-top-color: red;
	-webkit-animation: spin 1.5s infinite;
	animation: spin 1.5s infinite;
}
@-webkit-keyframes spin {
	0%   {-webkit-transform: rotate(0deg);}

	100% {-webkit-transform: rotate(360deg);}
}
@keyframes spin {
	0%   {transform: rotate(0deg);}

	100% {transform: rotate(360deg);}
}

ion-card ion-card-content ul,ion-card-content ol{
	padding-left: 1rem;
}
ion-card ion-card-content ul li{
	list-style-type: disc;
}
ion-card ion-card-content ol li{
	list-style-type: decimal;
}
ion-card ion-card-title, ion-card ion-card-subtitle {
	text-align: center;
}
.alert-sub-title{
	font-size: 0.8rem !important;
	line-height:1.2rem !important;
}
.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}
.text-center {
    text-align: center;
}
.text-justify {
    text-align: justify;
}
.text-nowrap {
    white-space: nowrap;
}
.text-lowercase {
    text-transform: lowercase;
}
.text-uppercase {
    text-transform: uppercase;
}
.text-capitalize {
    text-transform: capitalize;
}
.text-muted {
    color: #777;
}
.text-deleted {
    text-decoration:line-through;
}
.text-primary {
    color: #337ab7;
}
.f-10{
	font-size: 10px;
}
.f-11{
	font-size: 11px;
}
.f-12{
	font-size: 12px;
}
.f-13{
	font-size: 13px;
}
.f-14{
	font-size: 14px;
}
.f-18{
	font-size: 18px;
}
.f-20{
	font-size: 20px;
}
#survey-form ion-input,
#survey-form ion-select,
#survey-form ion-textarea,
#langDiv ion-select{
	/*--border-color:var(--ion-color-light);*/
	--border-width:0px;
	/*--highlight-height:0px;*/
}
#energy_from_other_item ion-input{
	--background:var(--ion-color-action-contrast);
}
/* 带行号的表格 */
.table-with-num {
	counter-reset: rowNum; /* 初始化计数器 */
}
.table-with-num tr {
	counter-increment: rowNum; /* 每行 +1 */
}
.table-with-num .row-no::before {
	content: counter(rowNum); /* 显示序号 */
}
#survey-form ion-radio::part(label) {
	white-space: normal !important;
	overflow-wrap: break-word;
}
/*
#survey-form ion-input,
#survey-form ion-textarea{
	--placeholder-font-weight:100;
}
#survey-form ion-input::part(input)::placeholder {
	font-size: 10px !important;
	white-space: normal !important;
	overflow-wrap: break-word !important;
}
*/
#survey-form ion-input input::placeholder,
#survey-form ion-textarea textarea::placeholder{
	font-size: 14px !important;
	white-space: normal !important;
	overflow-wrap: break-word !important;
}
#survey-form ion-select::part(placeholder) {
	font-size: 14px !important;
	white-space: normal !important;
	overflow-wrap: break-word !important;
}
#survey-form ion-input[label-placement="fixed"] .label-text {
	font-size: 14px !important;
  	white-space: normal; /* 文字自动换行，不省略 */
}

#survey-form ion-input.short-label[label-placement="fixed"] .label-text-wrapper {
	flex: 0 0 60px !important;
	width: 60px !important;
	min-width: 60px !important;
	max-width: none !important; 
}
