/* UltraPlataformas · Server Management Modern UI
   Visual refresh for server list, action buttons and every modal opened from servers/manage.php. */

.servers-modern-page{
  --srv-primary:#007aff;
  --srv-primary-dark:#005bd8;
  --srv-ink:#1d1d1f;
  --srv-muted:#7b818c;
  --srv-soft:#f5f7fa;
  --srv-soft-blue:#eef6ff;
  --srv-line:rgba(15,23,42,.09);
  --srv-line-strong:rgba(15,23,42,.14);
  --srv-card:rgba(255,255,255,.88);
  --srv-shadow:0 18px 50px rgba(31,38,135,.08);
  --srv-shadow-modal:0 28px 80px rgba(15,23,42,.18);
  color:var(--srv-ink);
}

/* Header / toolbar */
.servers-modern-page .page-header{
  margin-bottom:20px;
  padding-bottom:18px;
  border-bottom:1px solid var(--srv-line);
}

.servers-modern-page .page-title{
  margin:0;
  color:var(--srv-ink);
  font-size:clamp(26px,2.2vw,34px);
  font-weight:800;
  letter-spacing:-.035em;
}

.servers-modern-page .page-title img{margin-right:2px!important}

.servers-modern-page .btn-toolbar .btn-group{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-right:0!important;
}

.servers-modern-page .btn-toolbar .btn-group>.btn,
.servers-modern-page .btn-toolbar .btn-group>a.btn{
  margin:0!important;
  border-radius:12px!important;
}

.servers-modern-page .btn-primary{
  border-color:var(--srv-primary)!important;
  background:linear-gradient(135deg,var(--srv-primary),var(--srv-primary-dark))!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(0,122,255,.18);
}

.servers-modern-page .btn-primary:hover{
  border-color:var(--srv-primary-dark)!important;
  box-shadow:0 10px 24px rgba(0,122,255,.23);
}

.servers-modern-page .btn-outline-secondary{
  border-color:#d7dce3!important;
  background:#fff!important;
  color:#59616d!important;
}

.servers-modern-page .btn-outline-secondary:hover{
  border-color:#c5ccd5!important;
  background:#f4f6f8!important;
  color:#2e3540!important;
}

.servers-modern-page .btn-outline-danger{
  border-color:rgba(239,68,68,.32)!important;
  background:#fff!important;
  color:#dc3545!important;
}

.servers-modern-page .btn-outline-danger:hover{background:#fff3f3!important}

/* Stats */
.servers-modern-page .stat-card{
  min-height:104px;
  padding:18px 20px;
  border:1px solid var(--srv-line);
  border-radius:18px;
  background:var(--srv-card);
  box-shadow:0 7px 24px rgba(31,38,135,.045);
}

.servers-modern-page .stat-card .label{
  color:#858b95;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
}

.servers-modern-page .stat-card .value{
  margin-top:6px;
  color:var(--srv-ink);
  font-size:26px;
  font-weight:800;
  letter-spacing:-.035em;
}

.servers-modern-page .stat-card .icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#f4f7fb;
  font-size:21px;
  opacity:1;
}

/* Server table card */
.servers-modern-page main>.card,
.servers-modern-page .card.shadow{
  overflow:hidden;
  border:1px solid var(--srv-line)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.90)!important;
  box-shadow:var(--srv-shadow)!important;
}

.servers-modern-page main>.card>.card-header,
.servers-modern-page .card.shadow>.card-header{
  min-height:58px;
  padding:14px 18px!important;
  border-bottom:1px solid var(--srv-line)!important;
  background:rgba(255,255,255,.92)!important;
}

.servers-modern-page main>.card>.card-header h5,
.servers-modern-page .card.shadow>.card-header h5{
  color:#355d92!important;
  font-size:15px;
  font-weight:800!important;
  letter-spacing:-.01em;
}

.servers-modern-page .card.shadow>.card-header h5>i{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:var(--srv-soft-blue);
  color:var(--srv-primary);
}

.servers-modern-page .card.shadow>.card-header .badge{
  min-width:28px;
  padding:6px 9px;
  background:#edf5ff!important;
  color:#1269c7!important;
  font-weight:800;
}

.servers-modern-page .card.shadow>.card-body{padding:0 14px 14px!important}

/* Remove the purple legacy table identity. */
.servers-modern-page .table-responsive{border-radius:14px;overflow:auto}

.servers-modern-page .table{
  margin:0;
  color:#343942;
  background:#fff;
}

.servers-modern-page .table thead th{
  position:relative;
  padding:13px 14px;
  border:0!important;
  border-bottom:1px solid #dbe4ef!important;
  background:#f3f7fc!important;
  color:#4b617b!important;
  font-size:11px;
  font-weight:800;
  letter-spacing:.045em;
  text-transform:uppercase;
  white-space:nowrap;
}

.servers-modern-page .table thead th:first-child{
  border-top-left-radius:12px;
  border-bottom-left-radius:0;
}

.servers-modern-page .table thead th:last-child{
  border-top-right-radius:12px;
  border-bottom-right-radius:0;
}

.servers-modern-page .table tbody tr{
  border-bottom:1px solid rgba(15,23,42,.055);
  transition:background .16s ease;
}

.servers-modern-page .table tbody tr:last-child{border-bottom:0}
.servers-modern-page .table tbody tr:hover{background:#f8fbff}

.servers-modern-page .table td{
  padding:16px 14px;
  border:0;
  vertical-align:middle;
}

.servers-modern-page .table td:first-child .ph-hard-drives{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:#eef6ff;
  color:#1474d4!important;
  font-size:18px!important;
}

.servers-modern-page .status-badge,
.servers-modern-page .table td>.badge{
  border-radius:999px!important;
  padding:6px 10px!important;
  font-size:11px;
  font-weight:800;
  letter-spacing:.01em;
}

/* Action buttons: one coherent system, no purple. */
.servers-modern-page .action-btn{
  width:32px;
  height:32px;
  padding:0;
  border:1px solid #dce3eb;
  border-radius:9px;
  background:#fff;
  color:#566170;
  box-shadow:0 1px 2px rgba(15,23,42,.025);
  transition:transform .15s ease,border-color .15s ease,background .15s ease,box-shadow .15s ease;
}

.servers-modern-page .action-btn:hover{
  transform:translateY(-1px);
  border-color:#b9cee5;
  background:#f6faff;
  box-shadow:0 5px 12px rgba(31,38,135,.07);
  filter:none;
}

.servers-modern-page .action-btn i{font-size:16px}
.servers-modern-page .action-btn-success{color:#168454}
.servers-modern-page .action-btn-secondary{color:#687381}
.servers-modern-page .action-btn-purple{color:#1474d4;border-color:#cfe0f3;background:#f7fbff}
.servers-modern-page .action-btn-info{color:#1689a9}
.servers-modern-page .action-btn-primary{color:#1474d4}
.servers-modern-page .action-btn-warning{color:#d78b00}
.servers-modern-page .action-btn-danger{color:#dc3545;border-color:#f1c9cd;background:#fffafa}
.servers-modern-page .action-btn-danger:hover{border-color:#eaa7ae;background:#fff2f3}
.servers-modern-page .action-btn:disabled{opacity:.36;transform:none;box-shadow:none}

/* =====================================================================
   Modern modal system — applies to static and dynamically-created modals
   ===================================================================== */
.servers-modern-page .modal-backdrop.show{opacity:.35}

.servers-modern-page .modal-dialog{margin-top:4vh;margin-bottom:4vh}

.servers-modern-page .modal-content{
  overflow:hidden;
  border:1px solid rgba(15,23,42,.08)!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:var(--srv-shadow-modal)!important;
}

.servers-modern-page .modal-header,
.servers-modern-page .modal-header.bg-primary,
.servers-modern-page .modal-header.text-white{
  min-height:72px;
  padding:16px 20px!important;
  border-bottom:1px solid var(--srv-line)!important;
  background:linear-gradient(180deg,#fff,#fbfcfe)!important;
  color:var(--srv-ink)!important;
}

.servers-modern-page .modal-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0;
  color:var(--srv-ink)!important;
  font-size:16px;
  font-weight:800;
  letter-spacing:-.015em;
}

.servers-modern-page .modal-title>i{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  margin:0!important;
  border-radius:11px;
  background:#eaf4ff;
  color:var(--srv-primary)!important;
  font-size:18px;
}

.servers-modern-page .modal-header .btn-close,
.servers-modern-page .modal-header .btn-close-white{
  width:34px;
  height:34px;
  margin:0!important;
  padding:0!important;
  border:1px solid #e2e6eb;
  border-radius:10px;
  background-color:#f7f8fa;
  filter:none!important;
  opacity:.68;
  background-size:10px;
  background-position:center;
}

.servers-modern-page .modal-header .btn-close:hover{opacity:1;background-color:#eef1f4}

.servers-modern-page .modal-body{
  padding:22px!important;
  color:#363c45;
  background:#fff;
}

.servers-modern-page .modal-footer,
.servers-modern-page .modal-footer.bg-light{
  display:flex;
  gap:8px;
  padding:14px 20px!important;
  border-top:1px solid var(--srv-line)!important;
  background:#fafbfc!important;
}

.servers-modern-page .modal-footer .btn{
  min-height:40px;
  margin:0!important;
  padding:8px 14px;
  border-radius:11px!important;
  font-size:12px;
  font-weight:750;
}

.servers-modern-page .modal-footer .btn-group{display:flex;flex-wrap:wrap;gap:7px}
.servers-modern-page .modal-footer .btn-group>.btn{border-radius:10px!important}

/* Modal fields / nested cards */
.servers-modern-page .modal .form-label{
  margin-bottom:7px;
  color:#505966;
  font-size:12px;
  font-weight:750;
}

.servers-modern-page .modal .form-control,
.servers-modern-page .modal .form-select,
.servers-modern-page .modal .input-group-text{
  min-height:43px;
  border-color:#dfe4ea;
  background:#fafbfc;
  color:#23272f;
  border-radius:11px;
  font-size:13px;
}

.servers-modern-page .modal .form-control:focus,
.servers-modern-page .modal .form-select:focus{
  border-color:rgba(0,122,255,.45);
  background:#fff;
  box-shadow:0 0 0 4px rgba(0,122,255,.08);
}

.servers-modern-page .modal .input-group>.form-control:not(:last-child),
.servers-modern-page .modal .input-group>.form-select:not(:last-child),
.servers-modern-page .modal .input-group>.input-group-text:not(:last-child){
  border-top-right-radius:0;
  border-bottom-right-radius:0;
}

.servers-modern-page .modal .card{
  border:1px solid var(--srv-line)!important;
  border-radius:15px!important;
  background:#fafbfc!important;
  box-shadow:none!important;
}

.servers-modern-page .modal .card:hover{box-shadow:none!important;transform:none}

.servers-modern-page .modal .card-header,
.servers-modern-page .modal .card-header.bg-light{
  padding:12px 15px!important;
  border-bottom:1px solid var(--srv-line)!important;
  background:#f7f9fb!important;
  color:#3f4752!important;
  font-weight:800;
}

.servers-modern-page .modal .card-body{padding:15px!important}

.servers-modern-page .modal .alert{
  padding:13px 15px;
  border:1px solid transparent!important;
  border-radius:13px!important;
  box-shadow:none;
  font-size:12px;
}

.servers-modern-page .modal .alert-info{border-color:#cfe5fb!important;background:#f1f8ff!important;color:#335d83!important}
.servers-modern-page .modal .alert-success{border-color:#ccebdc!important;background:#f2fbf6!important;color:#286848!important}
.servers-modern-page .modal .alert-warning{border-color:#f1ddb0!important;background:#fffaf0!important;color:#785b22!important}
.servers-modern-page .modal .alert-danger{border-color:#f0c9cf!important;background:#fff5f6!important;color:#8f3843!important}

.servers-modern-page .modal hr{margin:18px 0;border-color:var(--srv-line);opacity:1}

.servers-modern-page .modal h6:not(.modal-title){
  color:#39424e;
  font-size:13px;
  font-weight:800;
}

.servers-modern-page .modal .table-responsive{
  overflow:auto;
  border:1px solid var(--srv-line);
  border-radius:13px;
}

.servers-modern-page .modal .table thead th{
  background:#f5f8fc!important;
  color:#53667d!important;
}

.servers-modern-page .modal .table td{padding:10px 12px;font-size:12px}

/* Library rows */
.servers-modern-page .modal .library-row,
.servers-modern-page .modal .shared-user-row{
  margin-bottom:8px;
  border:1px solid #e5e9ee!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:0 2px 7px rgba(15,23,42,.025);
}

.servers-modern-page .modal .library-row:hover,
.servers-modern-page .modal .shared-user-row:hover{
  border-color:#cbdced!important;
  background:#fbfdff!important;
}

.servers-modern-page .modal .library-icon-small,
.servers-modern-page .modal .user-avatar-small{
  border-radius:10px!important;
  background:#eef6ff!important;
}

.servers-modern-page .modal .library-type-badge,
.servers-modern-page .modal .user-id-badge,
.servers-modern-page .modal .libraries-count{
  border-radius:999px!important;
  background:#f0f3f6!important;
  color:#647181!important;
}

/* Password/import modal cleanup */
.servers-modern-page #passwordConfigModal .form-check,
.servers-modern-page #packFormModal .form-check{
  padding:11px 12px;
  border:1px solid #e4e8ed;
  border-radius:12px;
  background:#fff;
}

.servers-modern-page #passwordConfigModal .form-check-input,
.servers-modern-page #packFormModal .form-check-input{
  margin-top:.18em;
  border-color:#cbd2da;
}

.servers-modern-page #passwordConfigModal .form-check-input:checked,
.servers-modern-page #packFormModal .form-check-input:checked{
  border-color:var(--srv-primary);
  background-color:var(--srv-primary);
}

.servers-modern-page .individual-passwords-container,
.servers-modern-page .individual-expirations-container,
.servers-modern-page #packLibrariesList{
  border:1px solid #e2e7ed!important;
  border-radius:13px!important;
  background:#f8fafc!important;
}

/* Migration */
.servers-modern-page #migrate-source-info{
  padding:13px 14px!important;
  border:1px solid #e2e7ed;
  border-radius:12px!important;
  background:#f7f9fb!important;
}

.servers-modern-page .progress{
  overflow:hidden;
  height:8px!important;
  border-radius:999px;
  background:#e9eef4;
}

.servers-modern-page .progress-bar{background:linear-gradient(90deg,#007aff,#3b9cff)!important}

/* Reusable confirmation modal */
.servers-modern-page #serverConfirmModal .modal-dialog{max-width:470px}
.servers-modern-page #serverConfirmModal .modal-body{padding:26px!important;text-align:center}
.servers-modern-page .server-confirm-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin:0 auto 15px;
  border-radius:18px;
  background:#eef6ff;
  color:#1474d4;
  font-size:26px;
}
.servers-modern-page .server-confirm-icon.warning{background:#fff7e7;color:#c98300}
.servers-modern-page .server-confirm-icon.danger{background:#fff0f1;color:#dc3545}
.servers-modern-page #serverConfirmTitle{margin:0 0 8px;font-size:18px;font-weight:800;color:#222933}
.servers-modern-page #serverConfirmMessage{margin:0;color:#6f7782;font-size:13px;line-height:1.55;white-space:pre-line}

/* Dark contrast: these components also have fixed light colors in style.css.
   Scope every override to this page so light mode keeps its original palette. */
body.dark-theme.servers-modern-page .modal .user-name,
body.dark-theme.servers-modern-page .modal .library-name,
body.dark-theme.servers-modern-page #serverConfirmTitle {
  color:#f4f6f8!important;
}
body.dark-theme.servers-modern-page .modal .user-email,
body.dark-theme.servers-modern-page .modal .library-path-text,
body.dark-theme.servers-modern-page .modal .text-muted,
body.dark-theme.servers-modern-page #serverConfirmMessage {
  color:#c0c9d5!important;
}
body.dark-theme.servers-modern-page .modal .user-id-badge,
body.dark-theme.servers-modern-page .modal .libraries-count,
body.dark-theme.servers-modern-page .modal .library-type-badge {
  background:#252b33!important;
  border-color:#647184!important;
  color:#d7e3f2!important;
}
body.dark-theme.servers-modern-page .modal .user-avatar-small,
body.dark-theme.servers-modern-page .modal .library-icon-small {
  background:#293846!important;
}
body.dark-theme.servers-modern-page .modal .user-libraries-collapse,
body.dark-theme.servers-modern-page .modal .library-item {
  background:#2b3037!important;
  color:#f4f6f8!important;
  border-color:#55606d!important;
}
body.dark-theme.servers-modern-page .modal .shared-user-row:hover,
body.dark-theme.servers-modern-page .modal .library-row:hover {
  background:#3a424d!important;
  border-color:#7b8ca1!important;
}
body.dark-theme.servers-modern-page .modal .form-control::placeholder {
  color:#b9c4d2!important;
  opacity:1;
}

body.dark-theme.servers-modern-page .action-btn {color:#d5dfeb!important}
body.dark-theme.servers-modern-page .action-btn-success,
body.dark-theme.servers-modern-page .text-success {color:#6de0a0!important}
body.dark-theme.servers-modern-page .action-btn-secondary {color:#c0c9d5!important}
body.dark-theme.servers-modern-page .action-btn-primary,
body.dark-theme.servers-modern-page .action-btn-purple,
body.dark-theme.servers-modern-page .text-primary,
body.dark-theme.servers-modern-page .card.shadow>.card-header h5>i {color:#8bc4ff!important}
body.dark-theme.servers-modern-page .action-btn-info,
body.dark-theme.servers-modern-page .text-info {color:#70dfef!important}
body.dark-theme.servers-modern-page .action-btn-warning,
body.dark-theme.servers-modern-page .text-warning {color:#ffda7a!important}
body.dark-theme.servers-modern-page .action-btn-danger,
body.dark-theme.servers-modern-page .btn-outline-danger {color:#ff9da9!important}
body.dark-theme.servers-modern-page .btn-outline-primary {color:#8bc4ff!important;border-color:#8bc4ff!important}
body.dark-theme.servers-modern-page .btn-outline-info {color:#70dfef!important;border-color:#70dfef!important}
body.dark-theme.servers-modern-page .btn-outline-success {color:#6de0a0!important;border-color:#6de0a0!important}
body.dark-theme.servers-modern-page .badge.bg-success {background:#185b3f!important;color:#d3ffe8!important}
body.dark-theme.servers-modern-page .badge.bg-primary {background:#294f80!important;color:#e0efff!important}
body.dark-theme.servers-modern-page .badge.bg-info {background:#184d5a!important;color:#c5f6fc!important}
body.dark-theme.servers-modern-page .badge.bg-warning {background:#ffda7a!important;color:#302400!important}
body.dark-theme.servers-modern-page .btn-outline-primary:hover,
body.dark-theme.servers-modern-page .btn-outline-info:hover,
body.dark-theme.servers-modern-page .btn-outline-success:hover,
body.dark-theme.servers-modern-page .btn-outline-danger:hover {
  background:#414852!important;
}
body.dark-theme.servers-modern-page .action-btn:focus-visible,
body.dark-theme.servers-modern-page .btn:focus-visible {
  outline:2px solid #b6d9ff;
  outline-offset:3px;
}
body.dark-theme.servers-modern-page .page-title img {
  background:#f4f6f8;
  padding:4px 6px;
  border-radius:6px;
}

@media(max-width:900px){
  .servers-modern-page .page-header{align-items:flex-start;flex-direction:column}
  .servers-modern-page .btn-toolbar,.servers-modern-page .btn-toolbar .btn-group{width:100%}
  .servers-modern-page .btn-toolbar .btn-group>.btn{flex:1 1 170px}
}

@media(max-width:720px){
  .servers-modern-page .container-fluid{padding:18px 12px 40px}
  .servers-modern-page .page-title{font-size:25px}
  .servers-modern-page .stat-card{min-height:90px;padding:15px}
  .servers-modern-page .card.shadow>.card-body{padding:0 8px 8px!important}
  .servers-modern-page .table td,.servers-modern-page .table thead th{padding-left:10px;padding-right:10px}
  .servers-modern-page .modal-dialog{margin:10px}
  .servers-modern-page .modal-content{border-radius:17px!important}
  .servers-modern-page .modal-header{min-height:64px;padding:13px 14px!important}
  .servers-modern-page .modal-body{padding:15px!important}
  .servers-modern-page .modal-footer{padding:12px 14px!important}
  .servers-modern-page .modal-footer .btn{flex:1 1 auto}
}