/* =============================================
   GOMIB Admin/Master Panel Styles & Components
   ============================================= */

/* ---- Master & Loja Badges ---- */
.master-badge { background: linear-gradient(135deg,#7C5A0A,#B8860B); color:#F5E6B8; padding:3px 10px; border-radius:20px; font-size:.68rem; font-weight:700; letter-spacing:.06em; font-family:'Cinzel',serif; }
.master-badge-title { font-family:'Cinzel',serif; font-size:.75rem; background:linear-gradient(135deg,#1E1B4B,#4338CA); color:#F5E6B8; padding:5px 14px; border-radius:20px; letter-spacing:.08em; align-self:center; }

/* ---- KPI Grid ---- */
.kpi-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:16px; margin-bottom:24px; }
.kpi-card { background:#FFFFFF; border-radius:14px; padding:20px 18px; box-shadow:0 4px 16px rgba(15,14,42,0.08); border:1px solid #E2E8F0; display:flex; flex-direction:column; align-items:center; gap:8px; transition:transform .2s, box-shadow .2s; }
.kpi-card:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(15,14,42,0.12); }
.kpi-icon { font-size:1.6rem; width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; }
.kpi-blue { background:#EEF2FF; color:#1E40AF; }
.kpi-gold { background:#FFFBEB; color:#B45309; }
.kpi-green { background:#ECFDF5; color:#15803D; }
.kpi-red { background:#FEF2F2; color:#B91C1C; }
.kpi-purple { background:#F5F3FF; color:#6D28D9; }
.kpi-val { font-family:'Cinzel',serif; font-size:1.65rem; font-weight:700; color:#0F1E4B; }
.kpi-label { font-size:.74rem; color:#64748B; text-align:center; font-weight:600; text-transform:uppercase; letter-spacing:0.04em; }

/* ---- Section Cards ---- */
.section-card {
  background: #FFFFFF;
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(15, 30, 75, 0.06);
  border: 1px solid #E2E8F0;
  margin-bottom: 24px;
}
.section-sub-title { font-family:'Cinzel',serif; font-size:.95rem; color:#0F1E4B; margin-bottom:14px; letter-spacing:.04em; font-weight:700; }
.section-intro { font-size:.88rem; color:#64748B; margin-bottom:20px; line-height:1.6; }

/* ---- Filters & Search ---- */
.top-filters { display:flex; gap:8px; flex-wrap:wrap; align-items:center; flex:1; }
.filter-select, .filter-input { padding:8px 12px; border:1.5px solid #CBD5E1; border-radius:8px; font-family: 'Rubik', sans-serif; font-size:.82rem; outline:none; color:#1E293B; background:#FFFFFF; transition:border-color .2s; }
.filter-select:focus, .filter-input:focus { border-color:#C9A44C; box-shadow:0 0 0 3px rgba(201,164,76,0.15); }

/* ---- Data Tables ---- */
.table-wrap {
  overflow-x: auto;
  width: 100%;
  border-radius: 10px;
  border: 1px solid #E2E8F0;
  background: #FFFFFF;
}
.data-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-size: 0.86rem;
}
.data-table thead {
  background: #0F1E4B;
}
.data-table th {
  padding: 12px 14px;
  font-weight: 600;
  font-size: 0.78rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #E4C878;
  border-bottom: 2px solid #C9A44C;
  white-space: nowrap;
}
.data-table td {
  padding: 12px 14px;
  border-bottom: 1px solid #F1F5F9;
  color: #1E293B;
  vertical-align: middle;
}
.data-table tbody tr:hover {
  background: #F8FAFC;
}
.td-empty { text-align:center; padding:32px 16px; color:#94A3B8; font-size:.88rem; font-style:italic; }

/* ---- Tags & Status Badges ---- */
.tag-active { color:#059669; font-weight:600; }
.tag-inactive { color:#DC2626; }
.tag-suspenso { color:#D97706; }
.tag-master { background:linear-gradient(135deg,#7C5A0A,#B8860B); color:#F5E6B8; padding:2px 8px; border-radius:12px; font-size:.7rem; font-weight:700; }
.tag-admin { background:#EEF2FF; color:#4338CA; padding:2px 8px; border-radius:12px; font-size:.7rem; font-weight:600; }
.badge-pendente { background:#FEF3C7; color:#92400E; padding:2px 8px; border-radius:10px; font-size:.72rem; font-weight:700; }
.badge-pago { background:#D1FAE5; color:#065F46; padding:2px 8px; border-radius:10px; font-size:.72rem; font-weight:700; }
.badge-vencido { background:#FEE2E2; color:#991B1B; padding:2px 8px; border-radius:10px; font-size:.72rem; font-weight:700; }

/* ---- Nav Badges ---- */
.nav-count { margin-left:auto; background:rgba(184,134,11,0.25); color:#F5E6B8; font-size:.72rem; font-weight:700; padding:2px 8px; border-radius:10px; }
.nav-badge { margin-left:auto; background:rgba(99,102,241,0.2); color:#C7D2FE; font-size:.72rem; padding:2px 8px; border-radius:10px; }

/* ---- Buttons ---- */
.btn-sm {
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 0.76rem;
  font-weight: 600;
  cursor: pointer;
  border: none;
  font-family: 'Rubik', sans-serif;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  text-decoration: none;
}
.btn-edit { background:#EEF2FF; color:#3730A3; border:1px solid #C7D2FE; }
.btn-edit:hover { background:#3730A3; color:#FFFFFF; }
.btn-del { background:#FEF2F2; color:#B91C1C; border:1px solid #FECACA; }
.btn-del:hover { background:#B91C1C; color:#FFFFFF; }
.btn-pass { background:#F0FDF4; color:#15803D; border:1px solid #BBF7D0; }
.btn-pass:hover { background:#15803D; color:#FFFFFF; }
.btn-view { background:#F1F5F9; color:#0F1E4B; border:1px solid #CBD5E1; }
.btn-view:hover { background:#0F1E4B; color:#FFFFFF; }
.btn-carteira { background:#FFFBEB; color:#92400E; border:1px solid #FDE68A; }
.btn-carteira:hover { background:#B45309; color:#FFFFFF; }

.btn-primary {
  padding: 10px 20px;
  background: linear-gradient(135deg, #0F1E4B 0%, #1E293B 100%);
  color: #E4C878;
  border: 1px solid rgba(201,164,76,0.4);
  border-radius: 8px;
  font-family: 'Rubik', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.btn-primary:hover {
  background: #0F1E4B;
  color: #FFFFFF;
  border-color: #C9A44C;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(15,30,75,0.2);
}

.btn-secondary, .btn-cancel {
  padding: 10px 18px;
  background: transparent;
  border: 1.5px solid #CBD5E1;
  border-radius: 8px;
  color: #475569;
  font-family: 'Rubik', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.btn-secondary:hover, .btn-cancel:hover {
  border-color: #0F1E4B;
  color: #0F1E4B;
  background: #F8FAFC;
}

/* ---- Modals Overlay & Box (Fixed Floating) ---- */
.modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(15, 14, 42, 0.75) !important;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999 !important;
  backdrop-filter: blur(5px);
  padding: 20px;
}
.modal-box {
  background: #FFFFFF !important;
  border-radius: 16px !important;
  padding: 28px 32px !important;
  width: 100% !important;
  max-width: 620px;
  box-shadow: 0 16px 50px rgba(0, 0, 0, 0.3) !important;
  max-height: 90vh !important;
  overflow-y: auto !important;
  position: relative;
  animation: modalPop 0.22s ease-out;
}
.modal-lg { max-width: 760px; }
.modal-xl { max-width: 900px; }

@keyframes modalPop {
  from { opacity: 0; transform: scale(0.96) translateY(12px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

.modal-box h3 {
  font-family: 'Cinzel', serif;
  font-size: 1.15rem;
  color: #0F1E4B;
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid #E2E8F0;
  font-weight: 700;
}
.modal-actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid #E2E8F0;
}

/* ---- Forms ---- */
.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
.form-row-3 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin-bottom: 14px;
}
.form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 14px;
}
.form-field label {
  font-size: 0.75rem;
  font-weight: 700;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.form-field input, .form-field select, .form-field textarea {
  padding: 10px 14px;
  border: 1.5px solid #CBD5E1;
  border-radius: 8px;
  font-family: 'Rubik', sans-serif;
  font-size: 0.88rem;
  color: #0F1E4B;
  background: #FFFFFF;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  box-sizing: border-box;
}
.form-field input:focus, .form-field select:focus, .form-field textarea:focus {
  border-color: #C9A44C;
  box-shadow: 0 0 0 3px rgba(201, 164, 76, 0.18);
}
.form-field textarea {
  resize: vertical;
  min-height: 80px;
}

/* ---- Page Sections ---- */
.page-section {
  display: none;
  padding: 24px 28px;
  width: 100%;
  box-sizing: border-box;
  animation: sectionFadeIn 0.22s ease-out;
}
.page-section.active {
  display: block !important;
}

@keyframes sectionFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ---- Responsive Adjustments ---- */
@media(max-width: 900px) {
  .form-row, .form-row-3 { grid-template-columns: 1fr; }
  .page-section { padding: 16px 14px; }
  .modal-box { padding: 20px 16px !important; width: 95% !important; }
}


/* ========================================================
   SISTEMA AMÓS — CAIXAS DE ASSINATURA DIGITAL & PENDÊNCIAS
   ======================================================== */

.sig-box-container {
  display: flex !important;
  justify-content: space-around !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
  margin-top: 32px !important;
  padding-top: 20px !important;
}

.sig-box {
  flex: 1 !important;
  min-width: 250px !important;
  max-width: 380px !important;
  padding: 16px 20px !important;
  border-radius: 10px !important;
  text-align: center !important;
  transition: all 0.25s ease !important;
  box-sizing: border-box !important;
}

.sig-box.signed {
  background: #F0FDF4 !important;
  border: 1.5px solid #86EFAC !important;
  box-shadow: 0 4px 12px rgba(22, 101, 52, 0.06) !important;
}

.sig-box.pending {
  background: #FFFBEB !important;
  border: 1.5px dashed #F59E0B !important;
  box-shadow: 0 4px 12px rgba(180, 83, 9, 0.05) !important;
}

.sig-title-name {
  font-family: 'Cinzel', serif !important;
  font-size: 0.98rem !important;
  font-weight: 700 !important;
  color: #0F1E4B !important;
  margin-bottom: 2px !important;
}

.sig-role-label {
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  color: #64748B !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin-bottom: 8px !important;
}

.sig-status-signed {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: #DCFCE7 !important;
  color: #166534 !important;
  padding: 4px 10px !important;
  border-radius: 14px !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
}

.sig-status-pending {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: #FEF3C7 !important;
  color: #92400E !important;
  padding: 4px 10px !important;
  border-radius: 14px !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
}

.sig-hash-code {
  font-family: monospace !important;
  font-size: 0.7rem !important;
  color: #0F172A !important;
  background: rgba(0,0,0,0.05) !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  word-break: break-all !important;
  margin-top: 6px !important;
  display: inline-block !important;
}

.sig-btn-direct {
  margin-top: 10px !important;
  width: 100% !important;
  justify-content: center !important;
}