*{box-sizing:border-box}body{margin:0;background:#edf5f6;color:#163a43;font:14px Arial}header{height:74px;background:#fff;display:flex;align-items:center;gap:12px;padding:10px 5%;box-shadow:0 2px 12px #0001}header img{width:52px;height:52px;border-radius:50%;object-fit:cover}header b{font-size:20px;color:#075a70}header a{margin-left:auto}main{max-width:1180px;margin:25px auto;padding:0 15px}.login{display:grid;grid-template-columns:1.4fr .8fr;min-height:600px;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 15px 45px #0002}.photo,.hero{background:linear-gradient(#075a7044,#06384999),url('/anniversary.png') center/cover}.login form{padding:45px;align-self:center}.card{background:#fff;padding:22px;border-radius:16px;margin:20px 0;box-shadow:0 8px 25px #0001}.hero{padding:50px 30px;color:#fff;border-radius:18px}label{display:block;margin:15px 0}input,select{padding:12px;border:1px solid #ccdfe2;border-radius:9px;width:100%;margin-top:5px}button,.csv{background:#08778c;color:#fff;border:0;border-radius:9px;padding:10px 14px;text-decoration:none;cursor:pointer}.row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px}.scroll{overflow:auto}table{width:100%;border-collapse:collapse;margin-top:12px}th,td{padding:10px;border-bottom:1px solid #e1ecee;text-align:left;white-space:nowrap}td form{display:inline}.err{background:#ffe1dc;padding:12px}@media(max-width:700px){.login{display:block}.photo{height:220px}.row{grid-template-columns:1fr}.login form{padding:25px}}

.issued-form{display:flex!important;gap:5px;min-width:220px}
.issued-form input{margin:0;padding:8px;min-width:135px}
.issued-form button{padding:8px 10px}
/* JTLCI compact voucher table */
.card{overflow:hidden}
.table,.scroll{overflow-x:auto}
table{table-layout:fixed;width:100%;min-width:0;font-size:12px}
th,td{padding:9px 6px;white-space:normal;overflow-wrap:anywhere;vertical-align:middle}
th:nth-child(1),td:nth-child(1){width:12%}
th:nth-child(2),td:nth-child(2){width:19%}
th:nth-child(3),td:nth-child(3){width:8%}
th:nth-child(4),td:nth-child(4){width:6%}
th:nth-child(5),td:nth-child(5){width:6%}
th:nth-child(6),td:nth-child(6){width:11%}
th:nth-child(7),td:nth-child(7){width:11%}
th:nth-child(8),td:nth-child(8){width:11%}
th:nth-child(9),td:nth-child(9){width:8%}
th:nth-child(10),td:nth-child(10){width:8%}
.issued-form{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:4px;min-width:0}
.issued-form input{min-width:0;width:100%;padding:7px 5px}
.issued-form button,td form button{padding:7px 6px;font-size:11px;margin:2px 0}
@media(max-width:900px){
 .scroll{overflow:visible}
 table,tbody,tr,td{display:block;width:100%!important}
 table{min-width:0}
 tr:first-child{display:none}
 tr:not(:first-child){margin:12px 0;padding:12px;border:1px solid #dce9eb;border-radius:12px;background:#fff}
 td{display:grid;grid-template-columns:125px minmax(0,1fr);gap:8px;border:0;padding:6px}
 td:before{font-weight:700;color:#526b72}
 td:nth-child(1):before{content:'Code'}td:nth-child(2):before{content:'Issued To'}
 td:nth-child(3):before{content:'Group'}td:nth-child(4):before{content:'Speed'}
 td:nth-child(5):before{content:'Status'}td:nth-child(6):before{content:'MAC Lock'}
 td:nth-child(7):before{content:'First Connected'}td:nth-child(8):before{content:'Last Connected'}
 td:nth-child(9):before{content:'Visitor Remaining'}td:nth-child(10):before{content:'Action'}
}

.delete-button{background:#b42318!important}
/* JTLCI professional raised buttons */
button,.csv,header a{
 display:inline-flex;align-items:center;justify-content:center;
 min-height:36px;padding:9px 15px;border:1px solid #056276!important;
 border-radius:10px!important;color:#fff!important;text-decoration:none!important;
 background:linear-gradient(180deg,#1595aa 0%,#08788d 52%,#056679 100%)!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(0,45,55,.25),0 4px 8px rgba(5,91,108,.24)!important;
 font-weight:700!important;text-shadow:0 1px 1px rgba(0,0,0,.28);
 transition:transform .12s ease,box-shadow .12s ease,filter .12s ease;
 cursor:pointer
}
button:hover,.csv:hover,header a:hover{filter:brightness(1.08);transform:translateY(-1px)}
button:active,.csv:active,header a:active{
 transform:translateY(2px);
 box-shadow:inset 0 3px 6px rgba(0,40,50,.35),inset 0 1px 0 rgba(255,255,255,.1),0 1px 2px rgba(0,0,0,.18)!important
}
.delete-button{
 border-color:#8f160f!important;
 background:linear-gradient(180deg,#e5483d 0%,#c5281d 55%,#a71911 100%)!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 0 rgba(80,0,0,.28),0 4px 8px rgba(150,25,18,.25)!important
}
td form button{min-height:32px;padding:7px 10px!important;border-radius:9px!important}
.issued-form button{min-width:54px}
header a{margin-left:auto;min-height:32px;padding:7px 14px}

/* JTLCI button spacing and compact generator */
.row{align-items:end!important;column-gap:14px!important}
.row>button{width:150px!important;min-width:150px!important;max-width:150px!important;height:44px!important;min-height:44px!important;padding:8px 14px!important;justify-self:start}
td:last-child form{display:block!important;margin:0 0 8px!important}
td:last-child form:last-child{margin-bottom:0!important}
td:last-child button{width:100%!important;min-width:72px!important}
@media(max-width:700px){.row>button{width:100%!important;max-width:none!important}.row{row-gap:12px!important}}
/* visible voucher category sections */
.group-heading td{display:table-cell!important;width:auto!important;padding:11px 14px!important;background:linear-gradient(90deg,#075a70,#1594a8)!important;color:#fff!important;font-size:14px!important;font-weight:800!important;letter-spacing:.02em!important;border:0!important;text-align:left!important}
.group-heading{border-top:14px solid transparent!important}
@media(max-width:900px){.group-heading{display:block!important;margin:18px 0 8px!important;padding:0!important;border:0!important}.group-heading td{display:block!important;border-radius:10px!important}.group-heading td:before{display:none!important}}
/* final inline action layout */
.group-heading{display:none!important}
th:nth-child(10),td:nth-child(10){width:220px!important;min-width:220px!important}
td:last-child{display:table-cell!important;white-space:nowrap!important;text-align:left!important;vertical-align:middle!important}
td:last-child form{display:inline-block!important;margin:0 5px 0 0!important;width:auto!important}
td:last-child form:last-child{margin-right:0!important}
td:last-child button{display:inline-flex!important;width:auto!important;min-width:62px!important;height:34px!important;min-height:34px!important;padding:6px 9px!important;white-space:nowrap!important}
@media(max-width:900px){td:last-child{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important;white-space:normal!important}td:last-child:before{grid-column:1/-1}td:last-child form{display:block!important;margin:0!important}td:last-child button{width:100%!important}}
/* visible voucher category sections */
.group-heading td{display:table-cell!important;width:auto!important;padding:11px 14px!important;background:linear-gradient(90deg,#075a70,#1594a8)!important;color:#fff!important;font-size:14px!important;font-weight:800!important;letter-spacing:.02em!important;border:0!important;text-align:left!important}
.group-heading{border-top:14px solid transparent!important}
@media(max-width:900px){.group-heading{display:block!important;margin:18px 0 8px!important;padding:0!important;border:0!important}.group-heading td{display:block!important;border-radius:10px!important}.group-heading td:before{display:none!important}}
/* JTLCI 12-column desktop table repair */
@media (min-width:901px){
 main{max-width:1580px!important}
 .card{overflow:hidden!important}
 .scroll{width:100%!important;overflow-x:auto!important}
 table{width:100%!important;min-width:1320px!important;table-layout:fixed!important;font-size:11px!important}
 th,td{height:auto!important;min-height:0!important;padding:9px 6px!important;vertical-align:middle!important;white-space:normal!important;overflow-wrap:normal!important;word-break:normal!important;line-height:1.25!important}
 th:nth-child(1),td:nth-child(1){width:115px!important}
 th:nth-child(2),td:nth-child(2){width:180px!important}
 th:nth-child(3),td:nth-child(3){width:100px!important}
 th:nth-child(4),td:nth-child(4){width:85px!important}
 th:nth-child(5),td:nth-child(5){width:60px!important}
 th:nth-child(6),td:nth-child(6){width:65px!important}
 th:nth-child(7),td:nth-child(7){width:120px!important}
 th:nth-child(8),td:nth-child(8),th:nth-child(9),td:nth-child(9){width:110px!important}
 th:nth-child(10),td:nth-child(10){width:90px!important;min-width:90px!important}
 th:nth-child(11),td:nth-child(11){width:105px!important;min-width:105px!important}
 th:nth-child(12),td:nth-child(12){width:225px!important;min-width:225px!important}
 td:last-child{display:table-cell!important;white-space:nowrap!important}
 td:last-child form{display:inline-block!important;width:auto!important;margin:0 5px 0 0!important}
 td:last-child button{width:auto!important;min-width:62px!important;height:34px!important;padding:6px 9px!important;white-space:nowrap!important}
}
/* Print and Export CSV alignment only */
.card>button[onclick="print()"]{
 display:inline-flex!important;
 width:84px!important;
 min-width:84px!important;
 height:38px!important;
 min-height:38px!important;
 margin:0 10px 12px 0!important;
 vertical-align:middle!important;
}
.card>button[onclick="print()"]+.csv{
 display:inline-flex!important;
 align-items:center!important;
 justify-content:center!important;
 width:112px!important;
 min-width:112px!important;
 height:38px!important;
 min-height:38px!important;
 margin:0 0 12px 0!important;
 vertical-align:middle!important;
}
