/*style input tipe khusus*/
input[tipe='khusus']{
	border: none;
	background-color: transparent;
}
/*pop-up in barang/lihat-stok*/
/* Pembungkus semua elemen popup (background) */
.latar_pop {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 999; /* Sit on top */
  padding-top: 50px; /* Location of the box */
  padding-bottom: 50px;
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Kontainer konten popup */
.kontainer_konten_pop {
  background-color: #fefefe;
/*		  background-color: transparent;*/
  margin: auto;
  padding: 0 0 0 0;
  border: 1px solid #888;
  width: var(--lebar-app);
}

/* The Close Button */
.tutup_pop {
  background-color: whitesmoke;
  width: 25px;
  height: 25px;
  text-align: center;
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
  position: relative;
  right: 20px;
  top: 10px;
}

.tutup_pop:hover,
.tutup_pop:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.pop_window{background-color: rgba(196, 247, 225, 1.0);}
/*end popup*/

/*popup tipe 2*/
/*body:has(div.pop-up-window.aktif){ a }*/
div.pop-up-window{
	position: fixed;
	top: 0;
	background-color: rgba(0, 0, 0, .5);
	width: var(--lebar-app);
	height: 100vh;
	margin: auto;
	z-index: 999;
	display: none;
}
div.pop-up-window.aktif{ display: flex; }
div.pop-up-window div.isi-pop{
	position: relative;
	margin: auto;
	background-color: whitesmoke;
	width: calc(var(--lebar-app) - 25%);
	display: flex;
	flex-direction: column;
	padding: 15px 20px 10px;
	/*min-height: calc(100vh - 25%);*/
	max-height: 90%;
}
div.pop-up-window div.tutup{
	position: absolute;
	top: -10px; right: -10px;
	border: 2px solid white;
	background-color: red;
	color: white;
	font-size: 20;
	width: 30px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}
div.pop-up-window div.judul{
	border-bottom: 1px solid rgba(0, 0, 0, .2);
	padding-bottom: 10px;
	margin-bottom: 7px;
}
div.pop-up-window div.isi{
	overflow: auto;
}
/*end popup tipe 2*/

/*index*/
.subjudul{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
.card1{ display: flex; gap: 10px; }
.card1 > div:first-child{ width:10%; }
.card1 > div:last-child{ width:80%; line-height:18px; }
.float-kanan{ float:right; }

.subkepala{
	display:flex;
	flex-direction:row;
	overflow-x: scroll;
	gap: 25px;
}
.subkepala > div{
/*				display: inline-block;*/
	background-color: lightgreen;
	padding: 7px 5px;
	border-radius: 5px;
/*				margin-right: 20px;*/
}

.tombol-cari{
	border: 1px solid black;
	border-radius: 5px;
/*	height: 30px;*/
}
.tombol-cari input {
	border: none;
}
.tombol-cari span{
	background-color: gray;
}

/*barang-stok-opname*/
.sectionHead{
	display: flex;
	flex-direction: column;
	gap: 15px;
}
.sectionHead > :first-child{
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.sectionHead > h3{ align-self: flex-start; }
.sectionHead > .ket-stok-opname{
	display: flex;
	flex-direction: column;
	min-height: 50px;
	border: 1px solid rgba(0, 0, 0, .2);
	padding: 15px 10px;
	text-align: center;
}
.sectionHead > .ket-stok-opname.ada { text-align:left; }
.sectionHead > button { align-self:flex-end; }
.sectionHead > a { align-self:flex-end; }

/*barang-stok-opname-mulai*/
.status-cek-stok-opname{
	display: flex;
	border-bottom: 1px solid blue;
	gap: 15px;
}
.sub-status-cek-stok-opname{
	display: flex;
	flex-direction: column;
	text-align: center;
	text-decoration-line: none;
	gap: 5px;
	padding: 5px 0;
}
.sub-status-cek-stok-opname:focus{ border-bottom: 3px solid blueviolet; }
.kolom-cari{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	border: 1px solid rgba(0, 0, 0, .2);
	box-shadow: 1px 1px 1px gray inset;
	background-color: white;
	padding: 3px 1px;
}
.kolom-cari input{ 
	width: 80%;
	background-color: white;
	border: none;
}
table.rapi-tabel-2 th:nth-child(2), table.rapi-tabel-2 td:nth-child(2) {
	text-align: left;
}
table.rapi-tabel-2 .item-obat{
	display:flex;
	justify-content: space-between;
	align-items: center;
	text-decoration-line: none;
}

/*barang-stok-opname-laporan*/
.sectionHead.laporan > .ket-stok-opname.ada{
	flex-direction: row;
	align-items: center;
}
.kontainer-konten-2-kolom > .kontainer-konten{
	display: flex;
	flex-direction: row;
	padding: 8px 0;
	border-bottom: 1px dotted blue;
}
.kontainer-konten-2-kolom > .kontainer-konten :first-child,
.kontainer-konten-2-kolom > .kontainer-konten :last-child {
	flex: 1;
}

/*kasir*/

/*barang-lihat-stok*/
.kontainer-stok-produk{ text-decoration-line: none }

.kontainer-konten-2-kolom.detail-produk > .kontainer-konten{
	border-bottom: none;
}
.kontainer-konten-2-kolom.detail-produk > .kontainer-konten :first-child,
.kontainer-konten-2-kolom.detail-produk > .kontainer-konten :last-child {
	flex: 1;
}

.kontainer-konten-2-kolom.detail-produk > .kontainer-konten :last-child {
	text-align: right;
}


/*setting-list-apotek-saya*/
.sectionHead.list-apotek{ text-align: left; }
.detail-apotek{ 
	border-top: 1px solid rgba(0, 0, 0, .2);
	border-bottom: 1px solid rgba(0, 0, 0, .2);
	padding: 10px 0;
}
.notifikasi-tunggu-aktivasi{
	background-color: lightblue;
	align-items: center;
	padding: 10px 5px;
/*			display: flex;*/
	text-align: left;
}
.notifikasi-tunggu-aktivasi > :first-child{
	width: 15%;
}
.notifikasi-tunggu-aktivasi.card1 > div:first-child{ width:10%; }
.notifikasi-tunggu-aktivasi.card1 > div:nth-child(2){ width:60%; }
.notifikasi-tunggu-aktivasi.card1 > div:last-child{ width:30%; /*line-height:18px;*/ }

.notifikasi-tunggu-aktivasi span{
	display: inline-block;
	text-align: center;
	line-height: 15px;
	color: white;
	background-color: blue;
	height: 15px;
	width: 15px;
	border-radius: 50%;
}

/*kasir-penjualan*/
.riw-penjualan a, .buat-resep a { text-decoration-line: none; }
.riw-penjualan .inner-sect{
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	padding: 10px 0;
}
.riw-penjualan .inner-sect > .kolom-inner-sect{
	flex: 1;
}
.riw-penjualan .inner-sect{
	border-bottom: 1px solid rgba(0, 0, 0, .5);
}
.riw-penjualan .inner-sect > div:last-child{
	text-align: center;
	max-width: 35px;
}

/*kasir-buat-resep*/
.buat-resep .inner-sect{
	border-bottom: 1px solid rgba(0, 0, 0, .5);
}
.buat-resep .inner-sect > div:last-child{
	text-align: center;
	max-width: 50px;
}
.sectionFull.total-harga .kontainer-konten > :last-child{
	text-align: right;
}

/*laporan-resep*/
.kontainer-detail-resep .kontainer-ornamen{
	display: flex; flex-wrap: wrap; gap: 10px;
}
.kontainer-detail-resep .resep-ornamen{
	width: 45%;
}

/*notifikasi*/
#jendelaNotif{
	position: absolute;
	right: 5px;
/*		left: 0;*/
	top: 70px;
	width: 270px;
	box-shadow: 8px 8px 8px rgba(0, 0, 0, 50%);
}
.kotakJudulNotif{
	background-color: rgb(173, 216, 230, 1);
	padding: 5px 3px;
	border: 1px solid black;
	border-bottom: 2px solid black;
	display: flex;
	flex-direction: row;
	gap: 10px;
}
.kotakJudulNotif h6{
	cursor: pointer;
}
.kotakJudulNotif h6.tampil{
	border: 2px solid black;
	border-bottom: none;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	padding: 3px 5px 0;
	margin: -10px 0 0;
	background-color: rgb(131, 194, 215, 1);
	color: rgb(20, 20, 20);
}
.konten-notif, .konten-notif-2{
	cursor: pointer;
	background-color: rgb(233, 233, 233, .7);
	color: black;
	border: 1px solid black;
	border-top: none;
	display: block;
	padding: 10px 3px 20px;
	height: 50vh;
	overflow-y: scroll;
}
.konten-notif > a, .konten-notif-2 > a{
	margin-bottom: 8px;
}
.konten-notif p, .konten-notif-2 p{
	color: black;
}
.konten-notif:has(>span), .konten-notif-2:has(>span){
	display: flex;
	justify-content: center;
	align-items: center;
}
.konten-notif-2 { display: none; }
.note-to-know{
	background-color: white;
	padding: 4px 5px;
	text-align: left;
}	
.note-to-know >p+p { margin-top:8px; }


/*setting*/
.section_menu{ padding: 0 15px; }
.section_menu a{ text-decoration-line: none; }
.section_menu a div{
	height: 40px;
	line-height: 40px;
}

/*barang-lihat-stok (update harga)*/
section.upd-harga{
	margin: 0;
	padding: 15px 30px;
	border-radius: 0;
	line-height: 25px;
}
section form > div{
	text-align: left;
}
section.upd-harga .inner-sect > div{
	text-align: right;
	margin-right: 10px;
}
section.upd-harga .inner-sect > div :where(input[type='number'], input[type='text'], select){
	width: 40%;
}
section.upd-harga > :first-child{
	padding-bottom: 5px;
	margin-bottom: 5px;
	border-bottom: 1px solid rgba(0, 0, 0, .3);
}
section.upd-harga form > :last-child{
	padding-top: 5px;
	margin-top: 5px;
	border-top: 1px solid rgba(0, 0, 0, .3);
}

/*styling orderplan block*/
div.orderplan-block a.orderplan{
	display: block;
	font-size: 10px;
}
div.orderplan-block a.orderplan div.kontainer-gambar{
	display: inline-block;
	width: 10px;
}
div.orderplan-block > span.stts.tblHijauM:before{content: 'sudah';}
div.orderplan-block > span.stts.tblMerahM:before{content: 'belum';}
/*end-styling orderplan block*/

/*styling searching block, delete and edit block*/
	.kontainer-list-obat{ position: relative; display:none; }
	.kontainer-list-obat > div {
		width: 100%;
		height: 300px;
		position: absolute;
		background-color: white;
		border: 1px solid black;
	}
	.list-obat{
		max-height: 210px;
		overflow-y: scroll;
		display: flex;
		flex-direction: column;
		border-top: 1px dashed grey;
		margin-top: 15px;
		background-color: lightblue;
	}
	.list-obat > div {
		border-bottom: 1px dashed grey;
	}
	.hapus_item, .edit_item{ 
		display: block;
		top: 5px;
		right: 5px;
		height: 17px;
		width: 17px;
		line-height: 17px;
		text-align: center;
		border: 1px solid white;
		color: white;
		cursor: pointer;
	}
	.hapus_item{ background-color: red; }
	.edit_item{ background-color: blue; }
/*end-styling searching block, delete and edit block*/