.submit
{
-moz-border-radius:1px;
-webkit-border-radius:1px;
border-radius:10px;
background: #4c4e5a;
	 background: -webkit-linear-gradient(top, #800000 0%,#2c2d33 100%);
	 background: -moz-linear-gradient(top, #800000 0%,#2c2d33 100%);
	 background: -o-linear-gradient(top, #800000 0%,#2c2d33 100%);
	 background: -ms-linear-gradient(top, #800000 0%,#2c2d33 100%);
	 background: linear-gradient(top, #800000 0%,#2c2d33 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#badff3', EndColorStr='#7acbed')";
border:1px solid #7db0cc !important;
cursor: pointer;
padding:11px 16px;
font:bold 11px/14px Verdana, Tahomma, Geneva;
text-shadow:rgba(1,0,0,0.2) 0 1px 0px;
color:#fff;
-moz-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
-webkit-box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
box-shadow:inset rgba(255,255,255,0.6) 0 1px 1px, rgba(0,0,0,0.1) 0 1px 1px;
margin-left:12px;
padding:7px 21px;
}
 
.submit:hover,
.submit:focus,
.submit:active{
background:#a1d8f0;
background:-moz-linear-gradient(top, #7acbed, #badff3);
background:-webkit-gradient(linear, left top, left bottom, from(#7acbed), to(#badff3));
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#7acbed', EndColorStr='#badff3')";
}
.submit:active
{
text-shadow:rgba(0,0,0,0.3) 0 -1px 0px;
}

.css-tombol {
	color: #FFFFFF;
	font-size: 16px;
	border-radius: 5px;
	border: solid 1px #3866a3;
	text-shadow: 1px 1px 0px #528ECC;
	box-shadow: inset 1px 1px 0px 0px #BBDAF7;
	text-decoration: none;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	font-family: Arial;
	background: linear-gradient(180deg, #63B8EE 10%, #468CCF 100%);
	display: inline-flex;
	align-items: center;
	padding: 0;
}
.css-tombol:hover {
	background: linear-gradient(180deg, #468CCF 10%, #63B8EE 100%);
}
.css-tombol-text {
	position: relative;
	padding: 3px 3px;
        font-size: 12px;
        font-weight: bold;
}
.css-tombol-icon {
	position: relative;
	border-right: 1px solid #ffffff29;
	box-shadow: inset rgb(0 0 0 / 14%) -1px 0 0;
	padding: 3px 3px;
}

.btnSimp {
  background-color: DodgerBlue;
  border: none;
  color: white;
  padding:  6px 6px;
  margin-top: 20px;
  font-size: 12px;
  cursor: pointer;
  text-decoration: none;

}

/* Darker background on mouse-over */
.btnSimp:hover {
  background-color: RoyalBlue;
}

.btnPdf {
  background-color: CC0000;
  border: none;
  color: white;
  padding: 12px 16px;
  font-size: 12px;
  cursor: pointer;
  text-decoration: none;
}

/* Darker background on mouse-over */
.btnPdf:hover {
  background-color: FF0000;
}

.radiodiagnostik-list {
    list-style: none;
    padding-left: 0;
}

.radiodiagnostik-item {
    margin-bottom: 10px;
}

.edit-button {
/*    margin-left: 10px;*/
    background-color: #337ab7; /* Warna tombol */
    color: #ffffff; /* Warna teks pada tombol */
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    text-decoration: none;
}

.edit-button:hover {
    background-color: #286090; /* Warna tombol saat dihover */
}

.edit-icon {
    color: #ffffff; /* Atur warna ikon sesuai preferensi Anda */
    font-size: 16px; /* Atur ukuran font sesuai preferensi Anda */
    margin-right: 4px; /* Sesuaikan margin jika perlu */
}

.view-button {
/*    margin-left: 10px;*/
    background-color: #337ab7; /* Warna tombol */
    color: #ffffff; /* Warna teks pada tombol */
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    text-decoration: none;
}

.view-button:hover {
    background-color: #286090; /* Warna tombol saat dihover */
}

.view-icon {
    color: #ffffff; /* Atur warna ikon sesuai preferensi Anda */
    font-size: 16px; /* Atur ukuran font sesuai preferensi Anda */
    margin-right: 4px; /* Sesuaikan margin jika perlu */
}


.delete-button {
/*    margin-left: 10px;*/
    background-color: #d9534f; /* Warna tombol merah */
    color: #ffffff; /* Warna teks pada tombol */
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    text-decoration: none;
    position: relative; /* Diperlukan untuk menampilkan ikon dengan ::before */
}


.delete-button:hover {
    background-color: #c9302c; /* Warna tombol merah saat dihover */
}

.delete-icon {
    color: #ffffff; /* Atur warna ikon sesuai preferensi Anda */
    font-size: 16px; /* Atur ukuran font sesuai preferensi Anda */
    margin-right: 4px; /* Sesuaikan margin jika perlu */
}

.data-row {
        display: flex;
        justify-content: space-between;
        align-items: left;
        padding-top: 10px;
        border-top: 1px solid #ccc;
    }

/* Gaya tombol "Refresh" dengan ikon Font Awesome */
.refresh-button {
    position: relative;
    display: inline-block;
    padding: 4px 8px;
    background-color: #FF6347;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.refresh-button::before {
    content: "\f021"; /* Kode ikon Font Awesome, sesuaikan dengan ikon yang diinginkan */
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    left: 10px; /* Sesuaikan jarak antara ikon dan teks */
    top: 50%;
    transform: translateY(-50%);
}

.refresh-button:hover {
    background-color: #FF4500;
}


.refresh-icon {
    color: #ffffff; /* Atur warna ikon sesuai preferensi Anda */
    font-size: 18px; /* Atur ukuran font sesuai preferensi Anda */
    text-align: center;
}

.warning-button {
  
    position: relative;
    display: inline-block;
    padding: 4px 8px;
    background-color: #ffcc00;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    text-decoration: none;
    transition: background-color 0.3s ease;
}

.warning-button:hover {
  background-color: #ffc107;
}

.icon {
  margin-right: 5px;
}

.select-button {
    background-color: #337ab7; /* Warna tombol */
    color: #ffffff; /* Warna teks pada tombol */
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    text-decoration: none;
}

.select-button:hover {
    background-color: #286090; /* Warna tombol saat dihover */
}

.select-icon {
    color: #ffffff; /* Atur warna ikon sesuai preferensi Anda */
    font-size: 16px; /* Atur ukuran font sesuai preferensi Anda */
    margin-right: 4px; /* Sesuaikan margin jika perlu */
}

.orange-button {
    background-color: orange; /* Warna tombol oranye */
    color: #ffffff; /* Warna teks pada tombol (hitam) */
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    text-decoration: none;
}

.orange-button:hover {
    background-color: #ffa500; /* Warna tombol saat dihover, oranye lebih gelap */
}

.orange-icon {
    color: orange; /* Atur warna ikon sesuai preferensi Anda (oranye) */
    font-size: 16px; /* Atur ukuran font sesuai preferensi Anda */
    margin-right: 4px; /* Sesuaikan margin jika perlu */
}

.undo-icon {
    display: inline-block;
    width: 12px; /* Adjust the width and height as needed */
    height: 12px;
    background-image: url('../images/undo-button.png'); /* Replace with the path to your undo icon image */
    background-size: cover;
    margin-right: 5px; /* Adjust as needed to separate icon from text */
}

.redo-icon {
    display: inline-block;
    width: 12px; /* Adjust the width and height as needed */
    height: 12px;
    background-image: url('../images/redo-button.png'); /* Replace with the path to your undo icon image */
    background-size: cover;
    margin-right: 5px; /* Adjust as needed to separate icon from text */
}