*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}


.wl-container h1, .wl-container h2 { text-align:center; color:#2c3e50; }

.wl-container {
    max-width: 600px;
    margin: 40px auto;
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.wl-input-group { margin-bottom: 15px; }

.wl-input-group label { display:block; margin-bottom:5px; font-weight:bold; }

.wl-field-row { display:flex; gap:10px; }

.wl-field-row input, .wl-field-row select { flex:1; padding:10px; border-radius:6px; border:1px solid #ccc; font-size:16px; }

.wl-input-group input, .wl-input-group select{
	flex:1; padding:10px; border-radius:6px; border:1px solid #ccc; font-size:16px; 
	width:100%
}
.wl-button {
    width:100%; padding:12px; background:#3498db;
    color:#fff; border:none; font-size:18px;
    border-radius:8px; cursor:pointer; transition:0.3s; margin-top:10px;
}

.wl-button:hover { background:#2980b9; }

.wl-result {
    margin-top:30px; padding:20px;
    background:#eaf2f8; border-left:4px solid #3498db;
    border-radius:8px; display:none;
}

.wl-result h2 { margin-top:0; }

.wl-table {
    width:100%; border-collapse:collapse; margin-top:15px;
}

.wl-table th, .wl-table td { border:1px solid #ccc; padding:10px; text-align:left; }

.wl-table th { background-color:#3498db; color:#fff; }
.notet{
	font-weight: bold;
    text-align: center;
    padding: 11px 0px;
}
/* Responsive */
@media (max-width:768px) { .wl-field-row { flex-direction:column; } 
.wl-container {
    max-width: 95%;
    width: 95%;
    margin: 20px auto;
}




}