.sidebar-top {
  display: flex;
  align-items: flex-start;
}

.sidebar-close,
.sidebar-toggle,
.sidebar-backdrop {
  display: none;
}

.thread-toolbar .new-chat {
  margin-left: auto;
  flex: none;
  text-decoration: none;
}

.thread-line strong {
  min-width: 0;
  flex: 1;
}

.thread-line time {
  margin-left: auto;
}

.billing-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);gap:18px;margin-bottom:18px}.billing-form form{display:grid;gap:15px}.billing-form label{display:grid;gap:6px;font-size:13px;font-weight:700}.billing-form input,.billing-form select{width:100%;padding:11px 12px;border:1px solid #ccd7e4;border-radius:7px;background:#fff;font:inherit}.billing-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.billing-info{display:grid;gap:4px;padding:13px;background:#f1f6f8;border-radius:7px;color:#566775;font-size:12px}.billing-copy{color:var(--muted);line-height:1.5}.billing-status{display:flex;justify-content:space-between;padding:13px 0;border-top:1px solid var(--line)}.billing-status b{color:var(--green);font-size:12px}.billing-error{background:#fff0ef;border-color:#f1cac7;color:#a63731}.billing-events{margin-top:18px}
.billing-side{display:grid;align-content:start;gap:18px}.billing-status span{display:grid;gap:3px}.billing-status small{color:var(--muted);font-size:11px}.pix-preview{display:flex;align-items:center;gap:12px;padding:10px;border:1px solid var(--line);border-radius:7px}.pix-preview img{width:72px;height:72px;object-fit:contain}.pix-preview span{color:var(--muted);font-size:12px}.primary:disabled{background:#9daab7;cursor:not-allowed}
.operations-cards article small{display:block;color:var(--muted);font-size:11px;margin-top:5px}.operation-row{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:11px;padding:13px 0;border-top:1px solid var(--line)}.operation-row>div{display:grid;gap:3px;min-width:0}.operation-row small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.operation-row>b{font-size:12px;color:var(--green)}.state-dot{width:9px;height:9px;border-radius:50%;background:#9daab7}.state-dot.up{background:var(--green)}.state-dot.down{background:#c64e48}.state-dot.unknown{background:#d19a32}
.billing-summary{display:grid;grid-template-columns:1fr 1fr;margin:-4px 0 12px}.billing-summary>div{display:grid;gap:4px;padding:16px;border:1px solid var(--line);margin:-1px 0 0 -1px}.billing-summary b{font-size:21px;color:var(--green)}.billing-summary span,.operation-row time{color:var(--muted);font-size:11px}.activity-panel{margin-bottom:18px}
.compact-summary{max-width:520px}.section-label{margin:20px 0 8px;font-size:12px;text-transform:uppercase;color:var(--muted)}.resource-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 20px}.resource-row>div:first-child{display:flex;justify-content:space-between;gap:12px;font-size:12px}.resource-row span{color:var(--muted);white-space:nowrap}.resource-track{height:6px;margin-top:7px;border-radius:3px;background:#e5eaee;overflow:hidden}.resource-track i{display:block;height:100%;background:var(--green)}.server-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}.server-grid>div{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:9px;padding:11px;background:white}.server-grid small{color:var(--muted);overflow:hidden;text-overflow:ellipsis}.account-table{overflow-x:auto;border:1px solid var(--line)}.account-table-head,.account-table-row{display:grid;grid-template-columns:minmax(90px,.7fr) minmax(170px,1.4fr) minmax(75px,.5fr) 75px;gap:12px;align-items:center;min-width:560px;padding:10px 12px}.account-table-head{background:#f4f7f9;color:var(--muted);font-size:11px;text-transform:uppercase}.account-table-row{border-top:1px solid var(--line);font-size:12px}.account-table-row span{overflow:hidden;text-overflow:ellipsis}.account-table-row b{text-align:right}.status-ok{color:var(--green)}.status-danger{color:#c64e48}
.tag-list{display:flex;flex-wrap:wrap;gap:7px}.tag-list span{padding:7px 9px;border:1px solid var(--line);background:#f7f9fb;border-radius:6px;font-size:12px}.full-table .account-table-head,.full-table .account-table-row{grid-template-columns:minmax(90px,.7fr) minmax(170px,1.3fr) minmax(100px,.8fr) minmax(75px,.5fr) minmax(75px,.5fr) 75px;min-width:780px}.server-overview article{min-width:0}
.server-picker{display:grid;grid-template-columns:auto minmax(220px,360px) 1fr;align-items:center;gap:14px;margin-bottom:18px;padding:14px 18px}.server-picker label{font-size:12px;font-weight:750;color:var(--muted)}.server-picker select{width:100%;padding:11px 36px 11px 12px;border:1px solid #ccd7e4;border-radius:7px;background:#fff;font:inherit;font-weight:700;color:var(--text)}.server-picker>span{color:var(--muted);font-size:12px}.server-view{display:none}.server-view.active{display:block}.server-identity{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px;padding:16px 18px;border:1px solid var(--line);background:#fff}.server-identity>div{display:flex;align-items:center;gap:12px}.server-identity>div>div{display:grid;gap:3px}.server-identity small,.source-note{color:var(--muted);font-size:11px}.server-kind{padding:6px 9px;border-radius:5px;background:#eef4f8;color:#39546b;font-size:11px;font-weight:700}.panel-title>div{display:grid;gap:3px}.server-empty{text-align:center;padding:70px 24px}.server-empty strong{font-size:18px}.server-empty p{max-width:620px;margin:10px auto 0;color:var(--muted);line-height:1.6}
.nav-group{display:grid}.nav-group>a{position:relative}.nav-group>a::after{content:'›';position:absolute;right:14px}.nav-submenu{display:none;margin:2px 0 4px 14px;padding-left:8px;border-left:1px solid #35506d}.nav-group.open .nav-submenu{display:grid}.nav-submenu a{padding:7px 12px;font-size:12px}.compact-head{margin-bottom:18px}.server-cards{grid-template-columns:repeat(3,1fr);max-width:1050px}.compact-panel{max-width:1100px;margin-bottom:16px}.server-section-tabs{display:flex;gap:6px;margin:-2px 0 14px}.server-section-tabs a{padding:8px 11px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--blue);font-size:12px;font-weight:700;text-decoration:none}.compact-account-table .account-table-head,.compact-account-table .account-table-row{grid-template-columns:minmax(90px,.7fr) minmax(170px,1.4fr) minmax(75px,.5fr) 75px}
.server-tabs{display:flex;gap:2px;margin-bottom:18px;border-bottom:1px solid var(--line)}.server-tabs a{padding:11px 16px;color:var(--muted);font-size:13px;font-weight:700;text-decoration:none;border-bottom:3px solid transparent}.server-tabs a:hover,.server-tabs a.active{color:var(--blue);border-bottom-color:var(--blue)}.service-chips{display:flex;flex-wrap:wrap;gap:8px}.service-chips span{display:flex;align-items:center;gap:7px;padding:7px 9px;border:1px solid var(--line);border-radius:6px;font-size:12px}.service-chips i{width:7px;height:7px;border-radius:50%;background:#9daab7}.service-chips .up i{background:var(--green)}.service-chips .down i{background:#c64e48}.button-link{padding:8px 11px;border-radius:6px;background:var(--blue);color:#fff!important;font-size:12px!important;font-weight:700}.table-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0 12px}.table-tools input{width:min(360px,100%);padding:10px 12px;border:1px solid #ccd7e4;border-radius:7px;font:inherit}.table-tools>span{color:var(--muted);font-size:12px}.account-table-row[hidden]{display:none}
.whmcs-history{min-width:900px}.whmcs-history td{vertical-align:top}.whmcs-history time{white-space:nowrap}.recipient-cell{display:grid;gap:3px}.recipient-cell small,.muted{color:var(--muted);font-size:11px}.event-status{display:inline-block;padding:4px 7px;border-radius:5px;font-size:11px;font-weight:750;white-space:nowrap}.event-status.ok{background:#eaf8f3;color:#176c51}.event-status.waiting{background:#fff4dc;color:#946613}.event-status.error{background:#fff0ef;color:#a63731}.event-error{display:block;max-width:220px;margin-top:5px;color:#a63731;line-height:1.35}.message-preview{display:block;max-width:340px;color:#435268;line-height:1.4}

@media (max-width: 1100px) {
  aside {
    z-index: 40;
    display: flex;
    width: 250px;
    padding: 28px 20px;
    transform: translateX(-100%);
    transition: transform 0.2s ease;
    box-shadow: 12px 0 36px #0715254d;
  }

  body.sidebar-open aside {
    transform: translateX(0);
  }

  aside .brand-logo img {
    width: 174px;
  }

  aside .brand-logo > div,
  aside nav a {
    display: block;
    font-size: 14px;
  }

  aside nav a::before {
    content: none;
  }

  main,
  main.full {
    width: 100%;
    max-width: none;
    margin-left: 0;
    padding: 76px 24px 24px;
  }

  .sidebar-toggle {
    position: fixed;
    z-index: 32;
    top: 18px;
    left: 20px;
    display: grid;
    gap: 4px;
    place-content: center;
    width: 42px;
    height: 42px;
    border: 1px solid #d7e0e8;
    border-radius: 7px;
    background: #fff;
    box-shadow: 0 4px 14px #10243e14;
    cursor: pointer;
  }

  .sidebar-toggle span {
    display: block;
    width: 19px;
    height: 2px;
    border-radius: 2px;
    background: #28465e;
  }

  .sidebar-close {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    margin: -7px -7px 0 auto;
    border: 0;
    border-radius: 50%;
    background: #1b3654;
    color: #fff;
    font-size: 24px;
    cursor: pointer;
  }

  .sidebar-backdrop {
    position: fixed;
    z-index: 35;
    inset: 0;
    display: block;
    border: 0;
    background: #07152580;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
  }

  body.sidebar-open .sidebar-backdrop {
    opacity: 1;
    pointer-events: auto;
  }

  body.sidebar-open {
    overflow: hidden;
  }
}

@media (max-width: 620px) {
  main,
  main.full {
    padding: 72px 12px 12px;
  }

  .sidebar-toggle {
    top: 14px;
    left: 14px;
  }

  .billing-layout,.billing-fields,.resource-list,.server-grid,.server-picker,.server-cards{grid-template-columns:1fr}
  .server-tabs{overflow-x:auto}.server-tabs a{white-space:nowrap;padding:10px 12px}.table-tools{align-items:stretch;flex-direction:column}.table-tools input{width:100%}
}
