*{box-sizing:border-box}body{margin:0;background:#f4f6fa;color:#202938;font:15px system-ui,Arial}header{background:#17233b;color:white;padding:16px max(20px,calc((100% - 1180px)/2));display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}.brand{font-size:21px;font-weight:800;color:white;text-decoration:none}nav{display:flex;align-items:center;gap:18px;flex-wrap:wrap}nav a,.link{color:white;text-decoration:none;background:none;border:0;padding:0;font:inherit;cursor:pointer}nav form{margin:0}main{max-width:1180px;margin:28px auto;padding:0 18px;min-height:75vh}h1{font-size:28px;margin:0 0 22px}h2{font-size:19px;margin-top:28px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px}.card,.panel,.login{background:white;border:1px solid #e3e8f0;border-radius:13px;padding:18px;box-shadow:0 3px 12px #17233b0a}.card small{display:block;color:#68758a}.card strong{display:block;font-size:28px;margin-top:8px}.heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.button,button{background:#2457d6;color:white;border:0;border-radius:8px;padding:10px 14px;text-decoration:none;cursor:pointer;font-weight:650}.danger{background:#b42318}.filters{display:flex;gap:10px;margin:18px 0;flex-wrap:wrap}.filters input{flex:1;min-width:220px}.filters input,.filters select,input,textarea{padding:10px;border:1px solid #cbd4e1;border-radius:7px;font:inherit;width:100%}.filters select{width:auto}.tablewrap{overflow-x:auto;background:white;border-radius:12px;border:1px solid #e3e8f0}table{border-collapse:collapse;width:100%;min-width:720px}td,th{text-align:left;padding:12px;border-bottom:1px solid #edf0f4}th{background:#f8f9fc;color:#536176}.actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.actions form{margin:0}.actions button{padding:7px 9px;font-size:12px}.actions a{font-size:13px}.formgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.formgrid label,.login label{display:flex;flex-direction:column;gap:6px;font-weight:600}.formgrid .wide{grid-column:1/-1}.formgrid .check{flex-direction:row;align-items:center}.check input{width:auto}.formgrid textarea{min-height:85px}.login{max-width:420px;margin:50px auto}.login form{display:grid;gap:16px}.error{color:#b42318}.notice{padding:14px;background:#fff6df;border:1px solid #f2d28c;border-radius:9px}.panel{margin:20px 0}footer{text-align:center;color:#7b8798;padding:25px}@media(max-width:650px){.formgrid{grid-template-columns:1fr}.formgrid .wide{grid-column:auto}main{margin:20px auto}.heading{align-items:flex-start;flex-direction:column}header{align-items:flex-start}nav{gap:12px}}
/* Ações da listagem de clientes */
.actions a {
    display: inline-block;
    padding: 7px 9px;
    border-radius: 7px;
    color: white;
    text-decoration: none;
    font-size: 12px;
    font-weight: 650;
}

.actions .action-edit {
    background: #667085;
}

.actions .action-whatsapp {
    background: #16a34a;
}

.actions input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: #16a34a;
    cursor: default;
}

.actions input[type="checkbox"]:disabled {
    opacity: 1;
}

/* Indicadores de status na tabela de clientes */
.tablewrap td input[type="checkbox"] {
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: #16a34a;
    vertical-align: middle;
}

.tablewrap td input[type="checkbox"]:disabled {
    opacity: 1;
}

/* Campos dos servidores em uma única linha */
.server-quantities {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 15px;
    width: 100%;
}

.server-quantities input {
    width: 100%;
}

/* Cores definitivas dos botões */
.tablewrap .actions a.action-edit {
    background: #667085 !important;
    color: #fff !important;
    text-decoration: none !important;
    display: inline-block;
    padding: 7px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 650;
}

.tablewrap .actions a.action-whatsapp {
    background: #16a34a !important;
    color: #fff !important;
    text-decoration: none !important;
    display: inline-block;
    padding: 7px 9px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 650;
}

/* Quantidade centralizada */
.tablewrap th.devices-column,
.tablewrap td.devices-column {
    text-align: center;
    white-space: nowrap;
}

@media(max-width:650px) {
    .server-quantities {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }
}

/* Resumo dos servidores no card de clientes ativos */
.server-summary {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: 10px;
    font-size: 13px;
    color: #667085;
}

.server-summary b {
    color: #172b4d;
}

/* Mantém o valor cadastrado em uma única linha */
.card.value-card {
    min-width: 0;
}

.card .value-amount {
    display: block;
    white-space: nowrap;
    font-size: clamp(20px, 2vw, 30px);
    letter-spacing: -0.5px;
}

/* Mantém todos os botões de ação na mesma linha */
.tablewrap td.actions {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    white-space: nowrap;
}

.tablewrap td.actions form {
    display: inline-flex;
    margin: 0;
    padding: 0;
    flex: 0 0 auto;
}

.tablewrap td.actions a,
.tablewrap td.actions button {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* Identificação visual dos clientes vencidos */
.tablewrap tbody tr.cliente-vencido td {
    background-color: #fff0f0 !important;
}

/* Melhor espaçamento interno do card de valor cadastrado */
.card.value-card {
    padding-left: 20px;
    padding-right: 20px;
    overflow: hidden;
}

.card .value-amount {
    font-size: clamp(19px, 1.65vw, 26px);
    letter-spacing: -0.7px;
    text-align: left;
}