.pisol_grid {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  grid-gap: 20px;
  padding: 10px;
}

.pisol-main-wrap-area {
  display: flex;
}

.pisol-form-container {
  width: 70%;
}

.pisol-msg-container {
  width: 30%;
}

.pisol-msg-container .postbox {
  margin-top: 10px;
  margin-bottom: 10px;
}

.pisol-heading {
  font-size: 14px;
  padding: 8px 12px;
  margin: 0;
  line-height: 1.4;
}

.pisol-cover {
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 10px);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #fff;
}

.pisol-cover div {
  background: rgba(255, 255, 255, 0.6);
  padding: 10px;
  color: #000;
}

.pisol-offer {
  background: green !important;
  color: #fff;
}

.pisol-offer .pisol-heading {
  color: #fff;
}

.pisol_grid small {
  color: #bbb;
}

.pisol_grid textarea {
  width: 100%;
}

.pi-icon {
  text-decoration: none;
  vertical-align: middle;
}

.pi-clear-value {
  position: absolute;
  right: 15px;
  top: 0px;
}

.pi-slot-clear {
  position: absolute;
  right: 20px;
  top: 50%;
  margin-top: -10px;
  cursor: pointer;
  font-size: 12px;
}

.slot_time_picker {
  width: 100% !important;
}

.ui-corner-all {
  padding-left: 0px !important;
  padding-right: 0px !important;
  font-size: 12px !important;
}

.slot_time_picker {
  font-size: 12px !important;
}

.select2-selection__choice {
  background: var(--dark) !important;
  opacity:0.75;
  color: #fff;
  border: 0px !important;
}

.select2-selection__choice__remove {
  color: #fff !important;
}

.pi-edd-current-time-box {
  position: fixed;
  right: 0px;
  bottom: 0;
  width: 150px;
  padding: 5px;
  background: rgba(100, 100, 100, 0.5);
  color: #fff;
}

.tab-icon{
	width: 18px;
    height: 18px;
    vertical-align: middle;
    margin-right: 8px;
    display: inline-block;
}

#pi_general_time_slot_delivery_container input[type="number"],
#pi_general_time_slot_pickup_container input[type="number"]  {
  font-size:10px;
  padding-left:0px;
  padding-right:0px;
}

/* side menu */
#pisol-side-menu{
	background: linear-gradient(135deg, #1a4562, #2f6c8c, #1a4562);
	color:#fff;
	padding:10px;
	border-radius:10px;
	display:flex;
	flex-direction: column;
	color:#fff;
	gap:15px;
}

.pi-sticky{
	position: sticky;
	top: 60px;
}


#pisol-side-menu a{
	color:#fff !important;
	padding:0px 10px;
	transition:all 0.3s ease;
	letter-spacing: 1.2px;
  font-weight:600;
}

#pisol-side-menu a .dashicons{
  font-size:18px !important;
}

 #pisol-side-menu a:hover,  #pisol-side-menu a.active{
	text-decoration: none;
	color: #ccc !important;
	font-weight:bold;
}

 #pisol-side-menu a.bg-primary, #pisol-side-menu a.bg-secondary, #pisol-side-menu a.bg-warning{
	background: transparent !important;
	border:0 !important
}


#pi-special-button{
	background: #fff;
	color: var(--primary);
	padding: 7px 15px;
	border-radius: 20px;
	text-decoration: none;
	font-weight: bold;
	display: inline-block;
	transition: background 0.3s ease;
	margin-right:20px;

	&:hover {
    	background: #ccc;
	}
}

.pisol-form-element-row small{
	color:#1a4562;
	margin-top:10px;
	display:block;
  font-style: italic;
}

.pi-info-links{
  display: inline-block;
  margin:10px 10px 0 0;
}

.field-type-setting_category small, .field-type-switch_category small{
  margin-top:10px;
  display:block;
}

.field-type-setting_category .pi-info-links, .field-type-switch_category .pi-info-links{
  color:#fff !important;
}

.pi-info-links:before{
  content: "\1F517";
  margin-right:5px;
}

.bootstrap-wrapper .pi-shadow{
	box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
	position:relative;
	background: linear-gradient(135deg, #1a4562 0%, #2c6a89 50%, #163f59 100%);
	z-index:1;
}

.bootstrap-wrapper .pi-shadow li, .bootstrap-wrapper .pi-shadow h6, .bootstrap-wrapper .pi-shadow h4{
	color:#fff !important;
}

.bootstrap-wrapper .pi-shadow hr{
	border-color:#1a4562 !important;
}

h4.pi-bottom-banner{
	font-size: 18px;
	margin-bottom:15px;
	text-align: center;
}

.opacity-0 {
  opacity: 0 !important;
}

.opacity-25 {
  opacity: 0.25 !important;
}

.opacity-50 {
  opacity: 0.5 !important;
}

.opacity-75 {
  opacity: 0.75 !important;
}

.opacity-100 {
  opacity: 1 !important;
}

.bootstrap-wrapper .force-white-text label{
  color:#fff !important;
}

.pi-step-close{
	padding:0 !important;
	background:transparent !important;
	border:0px !important;
	cursor:pointer;

	& span{
		color:var(--primary) !important;
	}
}

#pi_general_time_slot_delivery_container:empty:before{
	content:"Set general delivery time slots for all days of the week.";
	display:flex;
	width:100%;
	min-height:300px;
	align-items:center;
	justify-content:center;
	font-size:1rem;
	text-align:center;
}

#pi_general_time_slot_pickup_container:empty:before{
	content:"Set general pickup time slots for all days of the week.";
  display:flex;
	width:100%;
	min-height:300px;
	align-items:center;
	justify-content:center;
	font-size:1rem;
	text-align:center;
}