*{box-sizing:border-box}body{margin:0;background:#f2f6fb;color:#102033;font:15px Arial}header{padding:20px 4%;display:flex;justify-content:space-between;background:#0b1d2d;color:white}header b{color:#54d9ee;font-size:20px}nav{display:flex;gap:18px;align-items:center;flex-wrap:wrap}nav a{color:#fff;text-decoration:none}nav form{margin:0}main{max-width:1200px;margin:35px auto;padding:0 18px}.grid,.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}section{background:#fff;padding:25px;border:1px solid #d5deea;border-radius:15px;margin-bottom:20px}form{display:grid;gap:12px}.resend{margin-top:12px}label{display:grid;gap:6px}input,select,button{min-height:45px;padding:10px;border:1px solid #c8d3e0;border-radius:8px;font:inherit}input[type=checkbox]{min-height:auto}button{background:#0969e8;color:white;border:0;font-weight:bold}button:disabled{background:#a8b4c3;cursor:not-allowed}.danger{background:#b42318}.row{grid-template-columns:2fr repeat(6,1fr);align-items:center;padding:12px 0;border-top:1px solid #e4eaf1}.err,.ok{padding:13px;margin-bottom:15px;border-radius:8px}.err{background:#ffe5e5;color:#9c0000}.ok{background:#e2f7e7;color:#075a1d}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:11px;border-bottom:1px solid #e5eaf0}.loading-overlay{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(4,16,28,.72);backdrop-filter:blur(3px)}.loading-overlay.show{display:flex}.loading-card{width:min(420px,100%);padding:30px;text-align:center;background:#fff;border-radius:18px;box-shadow:0 25px 80px rgba(0,0,0,.35)}.loading-card h2{margin:16px 0 7px}.loading-card p{margin:0;color:#58697b;line-height:1.5}.spinner{width:54px;height:54px;margin:auto;border:6px solid #dbe8f5;border-top-color:#0969e8;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:700px){.grid,.two,.row{grid-template-columns:1fr}header{gap:15px;flex-direction:column}}

.voucher-list{display:grid;gap:16px}.voucher-card{border:1px solid #d7dde7;border-radius:14px;padding:16px;background:#fff}.voucher-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.voucher-code{font:800 1.2rem ui-monospace,monospace;color:#164e8b;margin-top:4px}.device-list{display:grid;gap:8px;margin-top:14px}.device-slot{display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;background:#f7f9fc}.device-slot small{display:block;color:#667085;margin-top:3px}.device-slot form{margin-left:auto}.device-slot.available{color:#8290a3;border:1px dashed #cbd5e1;background:#fff}.status{width:10px;height:10px;border-radius:50%;flex:0 0 10px}.status.online{background:#16a34a;box-shadow:0 0 0 3px #dcfce7}.status.offline{background:#94a3b8}.small{padding:7px 10px;font-size:.82rem}.reset-all{margin-top:10px;text-align:right}@media(max-width:650px){.voucher-head{display:block}.voucher-head>div+div{margin-top:6px}.device-slot{align-items:flex-start;flex-wrap:wrap}.device-slot form{width:100%;margin-left:20px}}

/* GNVHS-VOUCHER-CARD-LAYOUT-START */
.voucher-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
  margin-top:16px!important;
}
.voucher-card{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  margin:0!important;
  padding:18px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #d7e1ee!important;
  border-radius:14px!important;
  box-shadow:0 4px 14px rgba(16,32,51,.06)!important;
}
.voucher-head{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:8px 16px!important;
  align-items:start!important;
  padding-bottom:13px!important;
  border-bottom:1px solid #e6edf5!important;
}
.voucher-head>div:last-child{
  color:#526273!important;
  font-size:.9rem!important;
  line-height:1.45!important;
  text-align:right!important;
}
.voucher-code{
  margin-top:5px!important;
  color:#0969e8!important;
  font:800 1.08rem ui-monospace,SFMono-Regular,Consolas,monospace!important;
  overflow-wrap:anywhere!important;
}
.device-list{
  display:grid!important;
  gap:8px!important;
  margin-top:13px!important;
}
.device-slot{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
  padding:10px 12px!important;
  background:#f6f9fc!important;
  border:1px solid #e4ebf3!important;
  border-radius:9px!important;
}
.device-slot>div{min-width:0!important;overflow-wrap:anywhere!important}
.device-slot small{display:block!important;margin-top:3px!important;color:#697789!important;line-height:1.4!important}
.device-slot form{margin:0 0 0 auto!important;flex:0 0 auto!important}
.device-slot.available{color:#78889a!important;background:#fafcff!important;border-style:dashed!important}
.status{width:10px!important;height:10px!important;border-radius:50%!important;flex:0 0 10px!important;background:#94a3b8!important}
.status.online{background:#16a34a!important;box-shadow:0 0 0 3px #dcfce7!important}
.status.offline{background:#94a3b8!important}
.small{min-height:34px!important;padding:7px 10px!important;font-size:.8rem!important}
.reset-all{display:block!important;margin-top:10px!important;text-align:right!important}
.reset-all button{width:auto!important}
@media(max-width:900px){.voucher-list{grid-template-columns:1fr!important}}
@media(max-width:600px){
  main{padding:0 10px!important}
  section{padding:17px!important}
  .voucher-card{padding:14px!important}
  .voucher-head{grid-template-columns:1fr!important}
  .voucher-head>div:last-child{text-align:left!important}
  .device-slot{align-items:flex-start!important;flex-wrap:wrap!important}
  .device-slot form{width:100%!important;margin-left:20px!important}
}
/* GNVHS-VOUCHER-CARD-LAYOUT-END */

.voucher-edit{margin-top:12px;border-top:1px solid #e4ebf3;padding-top:12px}.voucher-edit summary{cursor:pointer;color:#0969e8;font-weight:700}.voucher-edit form{margin-top:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.voucher-edit form button{grid-column:1/-1}@media(max-width:600px){.voucher-edit form{grid-template-columns:1fr}}
