* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Modern Styles */
:root {
    --primary: #FFD700;
    --primary-hover: #E6C200;
    --bg: #f8f9fa;
    --sidebar-bg: #1a1a1a;
    --text-dark: #1a1a1a;
    --text-muted: #666;
    --white: #ffffff;
    --radius: 12px;
    --shadow: 0 4px 20px rgba(0,0,0,0.08);
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background-color: var(--bg);
    color: var(--text-dark);
}

.login-box {
    background-color: var(--white);
    padding: 2.5rem;
    border-radius: var(--radius);
    box-shadow: 0 10px 40px rgba(0,0,0,0.1);
    border: none;
    width: 420px;
}

.form-section, .upload-section, .equipment-actions, .accounting-section, .occurrence-form {
    background-color: var(--white);
    padding: 2rem;
    border-radius: var(--radius);
    border: none;
    box-shadow: var(--shadow);
    margin-bottom: 2rem;
}

.form-row input, .form-row select, textarea, .form-group input, .form-group select, .form-group textarea {
    border: 1.5px solid #eee;
    background-color: #fcfcfc;
    border-radius: 8px;
    padding: 0.8rem 1rem;
    transition: all 0.2s;
}

.form-row input:focus, .form-row select:focus, textarea:focus, .form-group input:focus, .form-group select:focus, .form-group textarea:focus {
    border-color: var(--primary);
    background-color: var(--white);
    box-shadow: 0 0 0 4px rgba(255, 215, 0, 0.1);
}

.submit-btn, .action-btn {
    border-radius: 8px;
    padding: 0.8rem 1.8rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    box-shadow: 0 4px 12px rgba(255, 215, 0, 0.2);
    cursor: pointer;
    transition: all 0.3s;
}

.submit-btn:hover, .action-btn:hover {
    background-color: var(--primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(255, 215, 0, 0.3);
}

/* Checklist Styling Fix */
.checklist-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
    padding: 1rem;
}

.checklist-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #f9f9f9;
    border-radius: 8px;
    cursor: pointer;
    user-select: none;
    transition: background 0.2s;
}

.checklist-item:hover {
    background: #f0f0f0;
}

.checklist-item input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

/* Login Styles */
.login-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-color: white;
}

.login-box {
    background-color: white;
    padding: 2rem;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border: 2px solid #FFD700;
    width: 400px;
    max-width: 90%;
}

.logo-section {
    text-align: center;
    margin-bottom: 2rem;
}

.logo-section h1 {
    color: black;
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
}

.logo-section p {
    color: #666;
    font-size: 1.1rem;
}

.logo-image {
    width: 120px;
    height: 120px;
    margin-bottom: 1rem;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #FFD700;
}

.logo-header {
    width: 60px;
    height: 60px;
    margin-right: 1rem;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #FFD700;
}

.logo {
    display: flex;
    align-items: center;
}

.input-group {
    margin-bottom: 1rem;
}

.input-group label {
    display: block;
    color: black;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.input-group input {
    width: 100%;
    padding: 0.75rem;
    border: 2px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
}

.input-group input:focus {
    outline: none;
    border-color: #FFD700;
}

.login-btn {
    width: 100%;
    padding: 0.75rem;
    background-color: #FFD700;
    color: black;
    border: none;
    border-radius: 4px;
    font-size: 1.1rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
}

.login-btn:hover {
    background-color: #E6C200;
}

/* Dashboard Layout */
.dashboard-container {
    display: flex;
    /* Sidebar + conteúdo lado a lado (PC) */
    flex-direction: row;
    height: 100vh;
    overflow: hidden;
}

.dashboard-layout {
    display: flex;
    flex: 1;
    overflow: hidden;
}

/* Sidebar Styles */
.sidebar {
    width: 260px;
    background-color: #1a1a1a;
    color: white;
    display: flex;
    flex-direction: column;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 1000;
    box-shadow: 4px 0 10px rgba(0,0,0,0.1);
}

.sidebar.collapsed {
    width: 0;
    overflow: hidden;
    transform: translateX(-100%);
}

.sidebar-header {
    padding: 1.5rem;
    background-color: #111;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-bottom: 1px solid #333;
}

.sidebar-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 5px;
}


.logo-container {
    display: flex;
    align-items: center;
    gap: 10px;
}

.logo-container h3 {
    margin: 0;
    font-size: 1.2rem;
    letter-spacing: 1px;
}

.sidebar-menu {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 0;
}

.sidebar-menu .tab-btn,
.sidebar-menu .menu-link {
    width: 100%;
    text-align: left;
    padding: 0.9rem 1.5rem;
    background-color: transparent;
    border: none;
    color: #aaa;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
}

.sidebar-menu .tab-btn:hover,
.sidebar-menu .menu-link:hover {
    background-color: #2a2a2a;
    color: #FFD700;
}

.sidebar-menu .logout-menu {
    margin-top: auto;
    border-top: 1px solid #333 !important;
    padding-top: 0.9rem;
    display: flex;
    align-items: center;
    gap: 10px;
}

.sidebar-menu .logout-menu:hover {
    background-color: #3d0000;
    color: #ff4d4d;
}

/* User Info Styling */
.user-info {
    display: flex;
    align-items: center;
    gap: 10px;
}

#currentUser {
    background: #f0f0f0;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
    color: #444;
}

/* Sidebar Overlay */
.sidebar-overlay {
position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.5);
    z-index: 900;
    display: none;
    backdrop-filter: none;
    pointer-events: none;
}

.sidebar-overlay.show {
    display: block;

    pointer-events: auto;
}

/* Main Wrapper */
.main-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: #f8f9fa;
}

.header {
    background-color: white;
    border-bottom: 1px solid #e0e0e0;
    padding: 0.8rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    position: sticky;
    top: 0;
    z-index: 1200;
}

.header-left {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}

.toggle-btn {
    background: #f0f0f0;
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    font-size: 1.2rem;
    cursor: pointer;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
    position: relative;
    z-index: 1300;
}

.toggle-btn:hover {
    background: #e0e0e0;
}

.header h2 {
    font-size: 1.3rem;
    color: #1a1a1a;
    font-weight: 600;
    margin: 0;
}

/* Main Content */
.main-content {
    flex: 1;
    padding: 2rem;
    overflow-y: auto;
    scroll-behavior: smooth;
}

@media (max-width: 900px) {
    .sidebar{
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 260px;
        max-width: 85vw;
        transform: translateX(-110%);
        transition: transform .25s ease;
    }
    .sidebar.open{ transform: translateX(0); }
    .sidebar.collapsed{ transform: translateX(-110%); }
    .main-content {
        padding: 1.2rem;
    }
}

/* Evita scroll do body quando menu mobile aberto */
body.no-scroll { overflow: hidden; }

/* Cores para Contabilidade (Receita/Despesa/Lucro) */
.text-green{ color:#1f9d55; font-weight:800; }
.text-red{ color:#e3342f; font-weight:800; }
.pill{
  display:inline-flex;
  align-items:center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  margin-left: 8px;
}
.pill-green{ background: rgba(31,157,85,.12); color:#1f9d55; border:1px solid rgba(31,157,85,.25); }
.pill-red{ background: rgba(227,52,47,.12); color:#e3342f; border:1px solid rgba(227,52,47,.25); }

/* Lista de lançamentos */
.saved-item{ padding: 14px 12px; background:#fff; border-radius: 14px; box-shadow: 0 6px 20px rgba(0,0,0,.06); }
.saved-item + .saved-divider{ height: 10px; }
.saved-divider{ height: 12px; }
.saved-item-head{ display:flex; justify-content:space-between; gap:12px; align-items:flex-start; flex-wrap:wrap; }
.saved-item-title{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.saved-num{ color:#999; font-weight:800; }
.saved-item-actions{ display:flex; gap:8px; }
.action-btn-small{ border:none; background:#f0f0f0; padding:8px 10px; border-radius:10px; cursor:pointer; font-weight:800; }
.action-btn-small:active{ transform:scale(.98); }
.remove-btn{ background: rgba(227,52,47,.12); color:#e3342f; }

/* Corrige textos longos (ex: CNPJ/Email) no mobile */
.organization-info, .page-content, .list-item {
  word-break: break-word;
  overflow-wrap: anywhere;
}

@media (max-width: 768px) {
  .affiliation-header {
    flex-direction: column;
    gap: 12px;
    text-align: center;
  }
  .form-logo { max-width: 120px; height: auto; }
}

/* Modal (ver/editar) */
.modal-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 18px;
}
.modal-overlay.show{ display:flex; }
.modal{
  width: min(920px, 100%);
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 18px 60px rgba(0,0,0,.25);
  overflow: hidden;
}
.modal-header{
  display:flex;
  justify-content: space-between;
  align-items:center;
  padding: 14px 16px;
  border-bottom: 1px solid #eee;
}
.modal-title{ font-weight: 800; }
.modal-close{
  border: none;
  background: #f1f1f1;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  cursor: pointer;
}
.modal-body{ padding: 16px; max-height: 75vh; overflow:auto; }
.details-table{ width:100%; border-collapse:collapse; }
.details-table td{ padding:10px 12px; border-bottom:1px solid rgba(0,0,0,.08); vertical-align:top; }
.details-table td:first-child{ width:140px; color: var(--text-muted); font-weight:700; }

.modal-actions{ display:flex; gap:10px; justify-content:flex-end; padding: 14px 16px; border-top:1px solid #eee; }

/* Toast root */
.toast-root{
  position: fixed;
  right: 16px;
  bottom: 16px;
  display:flex;
  flex-direction: column;
  gap: 10px;
  z-index: 3000;
}
.toast{
  display:flex;
  gap: 10px;
  align-items:center;
  background:#111;
  color:#fff;
  padding: 12px 14px;
  border-radius: 12px;
  opacity: 0;
  transform: translateY(10px);
  transition: all .2s ease;
  max-width: 360px;
}
.toast.show{ opacity:1; transform: translateY(0); }
.toast-dot{ width:10px; height:10px; border-radius:99px; background:#FFD700; }
.toast-error .toast-dot{ background:#ff5b5b; }
.toast-info .toast-dot{ background:#63b3ff; }


.tab-content {
    display: none;
}

.tab-content.active {
    display: block;
}

.tab-content h3 {
    color: var(--text-dark);
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 2rem;
    border-bottom: 2px solid var(--primary);
    padding-bottom: 0.8rem;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Form Styles */
.form-section, .upload-section, .equipment-actions, .accounting-section, .occurrence-form {
    background-color: #f9f9f9;
    padding: 1.5rem;
    border-radius: 8px;
    border: 1px solid #FFD700;
    margin-bottom: 2rem;
}

.form-row {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
}

.form-row input, .form-row select, textarea {
    flex: 1;
    padding: 0.75rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
}

.form-row input:focus, .form-row select:focus, textarea:focus {
    outline: none;
    border-color: #FFD700;
}

.submit-btn, .action-btn {
    padding: 0.75rem 1.5rem;
    background-color: #FFD700;
    color: black;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
    margin-right: 0.5rem;
    transition: background-color 0.3s;
}

.submit-btn:hover, .action-btn:hover {
    background-color: #E6C200;
}

/* Lists */
.members-list, .documents-list, .equipment-list, .activity-log {
    background-color: white;
    border: 1px solid #FFD700;
    border-radius: 8px;
    padding: 1.5rem;
}

.list-item, .log-item {
    padding: 1rem;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.list-item:last-child, .log-item:last-child {
    border-bottom: none;
}

/* Alert Section */
.alert-section {
    background-color: #fff3cd;
    border: 1px solid #FFD700;
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 2rem;
}

/* Member List Styles */
.member-info {
    flex: 1;
}

.member-info strong {
    color: #333;
    font-size: 1.1rem;
}

.member-info small {
    color: #666;
    font-size: 0.9rem;
}

.member-actions {
    display: flex;
    gap: 0.5rem;
}

.action-btn-small {
    padding: 0.5rem 1rem;
    background-color: #FFD700;
    color: black;
    border: none;
    border-radius: 4px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background-color 0.3s;
}

.action-btn-small:hover {
    background-color: #E6C200;
}

.remove-btn {
    background-color: #dc3545 !important;
    color: white !important;
}

.remove-btn:hover {
    background-color: #c82333 !important;
}

/* Enhanced Occurrence Form Styles */
.form-group {
    margin-bottom: 1rem;
}

.form-group label {
    display: block;
    font-weight: bold;
    margin-bottom: 0.5rem;
    color: #333;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 0.75rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    outline: none;
    border-color: #FFD700;
    box-shadow: 0 0 0 2px rgba(255, 215, 0, 0.2);
}

.form-group input[type="checkbox"] {
    width: auto;
    margin-right: 0.5rem;
}

/* Occurrence Statistics */
.occurrence-statistics {
    background-color: white;
    border: 1px solid #FFD700;
    border-radius: 8px;
    padding: 1.5rem;
    margin: 2rem 0;
}

.occurrence-statistics h4 {
    color: black;
    margin-bottom: 1rem;
    border-bottom: 1px solid #FFD700;
    padding-bottom: 0.5rem;
}

.stats-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1rem;
}

.stat-item {
    text-align: center;
    padding: 1rem;
    background-color: #f9f9f9;
    border-radius: 8px;
    border: 1px solid #ddd;
}

.stat-number {
    display: block;
    font-size: 2rem;
    font-weight: bold;
    color: #333;
}

.stat-number.pending {
    color: #ffc107;
}

.stat-number.progress {
    color: #007bff;
}

.stat-number.resolved {
    color: #28a745;
}

.stat-label {
    font-size: 0.9rem;
    color: #666;
    text-transform: uppercase;
    font-weight: bold;
}

/* History Filters */
.history-filters {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1rem;
    background-color: #f9f9f9;
    border-radius: 8px;
    border: 1px solid #ddd;
}

.history-filters select {
    padding: 0.5rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: white;
}

/* Enhanced Occurrence Items */
.occurrence-item {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-bottom: 1rem;
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.occurrence-summary {
    padding: 1rem;
    background-color: #f9f9f9;
    cursor: pointer;
    transition: background-color 0.3s;
}

.occurrence-summary:hover {
    background-color: #f0f0f0;
}

.occurrence-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.5rem;
}

.occurrence-id {
    font-weight: bold;
    color: #666;
    font-size: 0.9rem;
}

.occurrence-title {
    font-weight: bold;
    color: #333;
    font-size: 1.1rem;
    flex: 1;
}

.urgent-badge {
    background-color: #dc3545;
    color: white;
    padding: 0.2rem 0.5rem;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: bold;
    text-transform: uppercase;
}

.confidential-badge {
    background-color: #6c757d;
    color: white;
    padding: 0.2rem 0.5rem;
    border-radius: 12px;
    font-size: 0.7rem;
    font-weight: bold;
    text-transform: uppercase;
}

.occurrence-meta {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.occurrence-category {
    background-color: #e9ecef;
    color: #495057;
    padding: 0.2rem 0.5rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: bold;
}

.occurrence-priority {
    padding: 0.2rem 0.5rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: bold;
    text-transform: uppercase;
}

.priority-baixa {
    background-color: #d4edda;
    color: #155724;
}

.priority-media {
    background-color: #fff3cd;
    color: #856404;
}

.priority-alta {
    background-color: #f8d7da;
    color: #721c24;
}

.priority-critica {
    background-color: #dc3545;
    color: white;
}

.occurrence-status {
    padding: 0.2rem 0.5rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: bold;
    text-transform: uppercase;
}

.occurrence-status.pendente {
    background-color: #fff3cd;
    color: #856404;
}

.occurrence-status.em-andamento {
    background-color: #d1ecf1;
    color: #0c5460;
}

.occurrence-status.resolvido {
    background-color: #d4edda;
    color: #155724;
}

.occurrence-details {
    padding: 1.5rem;
    background-color: white;
    border-top: 1px solid #ddd;
}

.detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1rem;
    margin-bottom: 1rem;
}

.detail-item {
    padding: 0.5rem;
    background-color: #f8f9fa;
    border-radius: 4px;
    border-left: 3px solid #FFD700;
}

.detail-section {
    margin-bottom: 1rem;
    padding: 1rem;
    background-color: #f8f9fa;
    border-radius: 4px;
}

.detail-section p {
    margin: 0.5rem 0 0 0;
    line-height: 1.4;
    color: #555;
}

.occurrence-actions {
    margin-top: 1rem;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.alert-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.alert-icon {
    font-size: 1.2rem;
}

/* Activity Log */
.log-item .timestamp {
    font-weight: bold;
    color: #666;
}

.log-item .user {
    color: #FFD700;
    font-weight: bold;
    background-color: black;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
}

/* Occurrence History */
.occurrence-history-section {
    background-color: white;
    border: 1px solid #FFD700;
    border-radius: 8px;
    padding: 1.5rem;
    margin-top: 2rem;
}

.occurrence-history-section h4 {
    color: black;
    margin-bottom: 1rem;
    border-bottom: 1px solid #FFD700;
    padding-bottom: 0.5rem;
}

.occurrence-item {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-bottom: 1rem;
    overflow: hidden;
}

.occurrence-summary {
    padding: 1rem;
    background-color: #f9f9f9;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background-color 0.3s;
}

.occurrence-summary:hover {
    background-color: #f0f0f0;
}

.occurrence-id {
    font-weight: bold;
    color: #666;
    font-size: 0.9rem;
}

.occurrence-desc {
    flex: 1;
    margin: 0 1rem;
    color: black;
}

.occurrence-status {
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: bold;
    text-transform: uppercase;
}

.occurrence-status.pendente {
    background-color: #fff3cd;
    color: #856404;
}

.occurrence-status.em {
    background-color: #d1ecf1;
    color: #0c5460;
}

.occurrence-status.resolvido {
    background-color: #d4edda;
    color: #155724;
}

.occurrence-details {
    padding: 1.5rem;
    background-color: white;
    border-top: 1px solid #ddd;
}

.occurrence-details p {
    margin-bottom: 0.8rem;
    line-height: 1.4;
}

.occurrence-actions {
    margin-top: 1rem;
    display: flex;
    gap: 0.5rem;
}

.action-btn-small {
    padding: 0.4rem 0.8rem;
    background-color: #FFD700;
    color: black;
    border: none;
    border-radius: 4px;
    font-size: 0.8rem;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
}

.action-btn-small:hover {
    background-color: #E6C200;
}

/* Message Center Styles */
.message-type-selector {
    display: flex;
    gap: 1rem;
    margin-bottom: 2rem;
    background-color: #f9f9f9;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid #FFD700;
}

.message-type-btn {
    padding: 0.75rem 1.5rem;
    background-color: white;
    color: black;
    border: 2px solid #ddd;
    border-radius: 6px;
    cursor: pointer;
    font-weight: bold;
    transition: all 0.3s;
}

.message-type-btn:hover {
    border-color: #FFD700;
}

.message-type-btn.active {
    background-color: #FFD700;
    border-color: #FFD700;
}

.chat-section {
    display: none;
}

.chat-section.active {
    display: block;
}

.chat-header, .private-chat-header {
    background-color: #f9f9f9;
    padding: 1rem;
    border-radius: 8px 8px 0 0;
    border: 1px solid #FFD700;
    border-bottom: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.chat-header h4, .private-chat-header h4 {
    margin: 0;
    color: #333;
}

.online-count {
    color: #28a745;
    font-size: 0.9rem;
    font-weight: bold;
}

.chat-container {
    background-color: white;
    border: 1px solid #FFD700;
    border-radius: 0 0 8px 8px;
    height: 500px;
    display: flex;
    flex-direction: column;
}

.messages-container {
    flex: 1;
    padding: 1rem;
    overflow-y: auto;
    border-bottom: 1px solid #eee;
    max-height: 400px;
}

.message-item {
    margin-bottom: 1rem;
    padding: 0.75rem;
    border-radius: 8px;
    position: relative;
}

.message-item.own {
    background-color: #FFD700;
    margin-left: 2rem;
    text-align: right;
}

.message-item.other {
    background-color: #f1f1f1;
    margin-right: 2rem;
}

.message-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
    font-size: 0.8rem;
}

.message-sender {
    font-weight: bold;
    color: #333;
}

.message-time {
    color: #666;
    font-size: 0.75rem;
}

.message-content {
    color: #333;
    line-height: 1.4;
    word-wrap: break-word;
}

.system-message {
    text-align: center;
    color: #666;
    font-style: italic;
    margin: 1rem 0;
    padding: 0.5rem;
    background-color: #f8f9fa;
    border-radius: 4px;
}

.message-input-container {
    display: flex;
    gap: 0.5rem;
    padding: 1rem;
    background-color: #f9f9f9;
}

.message-input-container input {
    flex: 1;
    padding: 0.75rem;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.send-btn {
    padding: 0.75rem 1.5rem;
    background-color: #FFD700;
    color: black;
    border: none;
    border-radius: 4px;
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.3s;
}

.send-btn:hover:not(:disabled) {
    background-color: #E6C200;
}

.send-btn:disabled {
    background-color: #ccc;
    cursor: not-allowed;
}

.typing-indicator {
    padding: 0.5rem 1rem;
    color: #666;
    font-style: italic;
    font-size: 0.9rem;
    min-height: 1.5rem;
    background-color: #f9f9f9;
}

.private-chat-header select {
    padding: 0.5rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: white;
}

.conversations-list {
    margin-top: 2rem;
    background-color: white;
    border: 1px solid #FFD700;
    border-radius: 8px;
    padding: 1rem;
}

.conversations-list h5 {
    margin: 0 0 1rem 0;
    color: #333;
    border-bottom: 1px solid #eee;
    padding-bottom: 0.5rem;
}

.conversation-item {
    padding: 0.75rem;
    border: 1px solid #eee;
    border-radius: 4px;
    margin-bottom: 0.5rem;
    cursor: pointer;
    transition: background-color 0.3s;
}

.conversation-item:hover {
    background-color: #f9f9f9;
}

.conversation-item.active {
    background-color: #FFD700;
    border-color: #FFD700;
}

.conversation-name {
    font-weight: bold;
    color: #333;
}

.conversation-preview {
    color: #666;
    font-size: 0.9rem;
    margin-top: 0.25rem;
}

.no-conversations {
    color: #666;
    font-style: italic;
    text-align: center;
    padding: 1rem;
}

.unread-badge {
    background-color: #dc3545;
    color: white;
    border-radius: 50%;
    padding: 0.2rem 0.5rem;
    font-size: 0.75rem;
    font-weight: bold;
    float: right;
}

/* Equipment Styles */
.equipment-info {
    flex: 1;
}

.equipment-info strong {
    color: #333;
    font-size: 1.1rem;
}

.status-available {
    color: #28a745;
    font-weight: bold;
    background-color: #d4edda;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    font-size: 0.9rem;
}

.status-borrowed {
    color: #dc3545;
    font-weight: bold;
    background-color: #f8d7da;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    font-size: 0.9rem;
}

.equipment-actions {
    display: flex;
    gap: 0.5rem;
}

.action-btn-small.remove-btn {
    background-color: #dc3545;
    color: white;
}

.action-btn-small.remove-btn:hover {
    background-color: #c82333;
}

/* Accounting Styles */
.accounting-history {
    background-color: white;
    border: 1px solid #FFD700;
    border-radius: 8px;
    padding: 1.5rem;
    margin-top: 2rem;
}

.accounting-history h4 {
    color: black;
    margin-bottom: 1rem;
    border-bottom: 1px solid #FFD700;
    padding-bottom: 0.5rem;
}

.accounting-summary {
    background-color: #f9f9f9;
    padding: 1rem;
    border-radius: 8px;
    margin-bottom: 1rem;
    border: 1px solid #ddd;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.summary-row.total {
    border-top: 2px solid #FFD700;
    padding-top: 0.5rem;
    margin-top: 0.5rem;
    font-weight: bold;
    font-size: 1.1rem;
}

.summary-label {
    color: #333;
    font-weight: bold;
}

.summary-value.positive {
    color: #28a745;
    font-weight: bold;
}

.summary-value.negative {
    color: #dc3545;
    font-weight: bold;
}

.accounting-entry {
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-bottom: 1rem;
    padding: 1rem;
    background-color: white;
}

.entry-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}

.entry-description {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.entry-type {
    padding: 0.2rem 0.5rem;
    border-radius: 12px;
    font-size: 0.8rem;
    font-weight: bold;
    text-transform: uppercase;
}

.entry-type.receita {
    background-color: #d4edda;
    color: #155724;
}

.entry-type.despesa {
    background-color: #f8d7da;
    color: #721c24;
}

.entry-value {
    font-size: 1.2rem;
    font-weight: bold;
}

.entry-value.receita {
    color: #28a745;
}

.entry-value.despesa {
    color: #dc3545;
}

.entry-details {
    color: #666;
    font-size: 0.9rem;
    border-top: 1px solid #eee;
    padding-top: 0.5rem;
}

/* Affiliation Form Styles */
.affiliation-header {
    display: flex;
    align-items: center;
    gap: 2rem;
    background-color: #f9f9f9;
    padding: 2rem;
    border-radius: 8px;
    border: 2px solid #FFD700;
    margin-bottom: 2rem;
}

.form-logo {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #FFD700;
}

.organization-info h2 {
    color: #333;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
    text-align: center;
}

.organization-info p {
    color: #666;
    margin-bottom: 0.3rem;
    text-align: center;
}

.affiliation-form {
    background-color: white;
    border: 2px solid #FFD700;
    border-radius: 8px;
    padding: 2rem;
    margin-bottom: 2rem;
}

.affiliation-form .form-section {
    background-color: #f9f9f9;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.affiliation-form .form-section h4 {
    color: #333;
    font-size: 1.2rem;
    margin-bottom: 1rem;
    border-bottom: 2px solid #FFD700;
    padding-bottom: 0.5rem;
}

.declaration-text {
    background-color: #fff3cd;
    border: 1px solid #FFD700;
    border-radius: 4px;
    padding: 1.5rem;
    margin-bottom: 2rem;
}

.declaration-text p {
    margin-bottom: 1rem;
    line-height: 1.6;
    text-align: justify;
    color: #333;
}

.signature-section, .approval-section {
    margin-top: 2rem;
    padding: 1.5rem;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: white;
}

.signature-line {
    border-bottom: 2px solid #333;
    width: 300px;
    height: 40px;
    margin-top: 1rem;
}

.approval-section h4 {
    text-align: center;
    color: #333;
    font-size: 1.1rem;
    margin-bottom: 2rem;
    letter-spacing: 2px;
}

.approval-section p {
    font-size: 0.9rem;
    color: #666;
    margin-bottom: 0.5rem;
    text-align: center;
}

.form-actions {
    display: flex;
    gap: 1rem;
    justify-content: center;
    margin-top: 2rem;
}

.affiliations-list {
    background-color: white;
    border: 1px solid #FFD700;
    border-radius: 8px;
    padding: 1.5rem;
}

.affiliations-list h4 {
    color: black;
    margin-bottom: 1rem;
    border-bottom: 1px solid #FFD700;
    padding-bottom: 0.5rem;
}

.affiliation-info {
    flex: 1;
}

.affiliation-info strong {
    color: #333;
    font-size: 1.1rem;
}

.affiliation-info small {
    color: #666;
    font-size: 0.9rem;
}

.affiliation-actions {
    display: flex;
    gap: 0.5rem;
    align-items: center;
}

.status-badge {
    padding: 0.3rem 0.8rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: bold;
    text-transform: uppercase;
}

.status-pendente {
    background-color: #fff3cd;
    color: #856404;
}

.status-aprovado {
    background-color: #d4edda;
    color: #155724;
}

.status-rejeitado {
    background-color: #f8d7da;
    color: #721c24;
}

/* Responsive Design */
@media (max-width: 768px) {
    .navigation-tabs {
        flex-direction: column;
    }

    .form-row {
        flex-direction: column;
    }

    .header {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }

    .main-content {
        padding: 1rem;
    }

    .entry-main {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .summary-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.2rem;
    }
}

/* ===== Mobile sidebar overlay + close button ===== */
.sidebar-overlay {
display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:900;
    pointer-events: none;
}
.sidebar-overlay.show {display:block;
    pointer-events: auto;
}
.sidebar-close{display:none;border:none;background:transparent;color:#fff;font-size:22px;line-height:1;cursor:pointer;margin-left:auto;padding:6px 10px;border-radius:8px;}
.sidebar-close:active{transform:scale(0.98);}
@media (max-width: 768px){
  .sidebar-header{display:flex;align-items:center;gap:10px;}
  .sidebar-header h3{margin-right:auto;}
  .sidebar-close{display:inline-flex;align-items:center;justify-content:center;}
  .sidebar{z-index:1000;}
}


/* ====== NAV (PÁGINAS SEPARADAS) ====== */
.sidebar-menu{
  display:flex;
  flex-direction:column;
}
.sidebar-menu .menu-link.active{
  background-color:#2a2a2a;
  color:#FFD700;
  border-left:3px solid #FFD700;
}
.page-title{
  font-size:1.15rem;
  margin:0;
}
.page-content{
  min-height: 100%;
}



/* =========================================================
   RESPONSIVO + LAYOUT FIX (não altera conteúdo)
   ========================================================= */

/* Estrutura principal: sidebar ao lado do conteúdo */
.dashboard-container{
    display:flex;
    flex-direction:row;
    height:100vh;
    overflow:hidden;
}

/* Sidebar menu precisa ser coluna para o "Sair" ficar no final */
.sidebar-menu{
    display:flex;
    flex-direction:column;
    gap:0;
}

/* Tamanho do logo na sidebar (evita estourar no mobile/PC) */
.logo-sidebar{
    width:48px;
    height:48px;
    border-radius:50%;
    object-fit:cover;
    border:2px solid var(--primary);
    flex:0 0 auto;
}

/* Main wrapper ocupa o resto */
.main-wrapper{
    min-width:0;
    flex:1;
}

/* Conteúdo não pode estourar horizontalmente */
.main-content, .page-content{
    min-width:0;
    width:100%;
}

/* Form rows quebram no mobile */
@media (max-width: 768px){
    .form-row{
        flex-direction:column;
    }
    .form-row input,
    .form-row select,
    .form-row textarea{
        width:100%;
    }

    /* Sidebar mobile */
    .sidebar{
        position:fixed;
        top:0;
        left:0;
        height:100vh;
        width:260px;
        max-width:86vw;
        transform:translateX(-110%);
        transition: transform .2s ease;
        z-index: 1000;
    }
    .sidebar.open{
        transform:translateX(0);
    }
    }

/* Evita scroll horizontal geral */
html, body{
    width:100%;
    overflow-x:hidden;
}

/* Tabelas e listas grandes: scroll interno ao invés de cortar */
.table-wrap, .members-list, .documents-list, .equipment-list, .activity-log{
    max-width:100%;
    overflow:auto;
}

/* Itens do menu: texto quebra e não some */
.sidebar-menu .menu-link{
    white-space:normal;
    word-break:break-word;
    line-height:1.25;
}

/* Checklist grid no mobile: 1 coluna */
@media (max-width: 480px){
    .checklist-container{
        grid-template-columns: 1fr;
    }
}


/* ===== Toasts (feedback bonito ao salvar) ===== */
.toast-root{position:fixed;right:14px;bottom:14px;z-index:9999;display:flex;flex-direction:column;gap:10px;pointer-events:none}
.toast{pointer-events:none;display:flex;align-items:flex-start;gap:10px;min-width:220px;max-width:360px;padding:12px 14px;border-radius:14px;background:rgba(20,20,20,.92);color:#fff;box-shadow:0 10px 30px rgba(0,0,0,.25);transform:translateY(10px);opacity:0;transition:all .22s ease}
.toast.show{transform:translateY(0);opacity:1}
.toast-dot{width:10px;height:10px;border-radius:99px;background:#f5c400;margin-top:4px;flex:0 0 auto}
.toast-info .toast-dot{background:#9aa0a6}
.toast-success .toast-dot{background:#22c55e}
.toast-error .toast-dot{background:#ef4444}
.toast-msg{font-size:14px;line-height:1.25}
.btn-loading{opacity:.85}
@media (max-width:480px){.toast-root{left:14px;right:14px}.toast{max-width:unset}}



/* === PATCH: MOBILE MENOR + ANIMAÇÕES + SEM QUEBRA DE TEXTO === */
html, body { -webkit-text-size-adjust: 100%; }

/* Evitar quebra estranha de palavras em botões/textos */
button, a, .btn, .menu-item, .sidebar a, .card, .form-container {
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: auto;
}

/* Animação leve (mantém visual antigo) */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
.main-content, .content, .container, .card, .form-container, table {
  animation: fadeUp .18s ease-out both;
}

/* Toast/alert mais bonito (se existir) */
.toast, .alert {
  border-radius: 12px !important;
}

/* Contabilidade: cores */
.value-receita, .receita, .income { color: #1f9d55 !important; font-weight: 700; }
.value-despesa, .despesa, .expense { color: #e02424 !important; font-weight: 700; }
.profit-positive { color: #1f9d55 !important; font-weight: 800; }
.profit-negative { color: #e02424 !important; font-weight: 800; }

/* Card da Brigada/CNPJ menor no mobile (retângulo compacto) */
@media (max-width: 768px) {
  .brigada-card, #brigadaCard, .header-card, .top-card {
    width: 100% !important;
    max-width: 100% !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
  }
  .brigada-card h1, .brigada-card h2, .brigada-card h3,
  #brigadaCard h1, #brigadaCard h2, #brigadaCard h3 {
    font-size: 16px !important;
    line-height: 1.2 !important;
    margin: 0 0 6px 0 !important;
  }
}

/* MOBILE: reduzir tudo ~ metade sem quebrar layout */
@media (max-width: 768px) {
  body { font-size: 13px !important; }
  h1 { font-size: 18px !important; }
  h2 { font-size: 16px !important; }
  h3 { font-size: 15px !important; }
  .card, .form-container, .container, .content, .main-content {
    padding: 10px !important;
    margin: 10px 0 !important;
    border-radius: 12px !important;
  }
  button, .btn, a.btn {
    padding: 6px 10px !important;
    font-size: 12.5px !important;
    border-radius: 10px !important;
  }
  input, select, textarea {
    font-size: 13px !important;
    padding: 6px 8px !important;
    border-radius: 10px !important;
  }
  .sidebar {
    width: 270px !important;
  }
  table { font-size: 12.5px !important; }
  th, td { padding: 8px !important; }
}



/* ===== AJUSTE GLOBAL DOS CARDS (principalmente Equipamentos) ===== */

.card{
  max-width:100%;
}

/* nomes grandes não quebravam corretamente */
.card-title, .equip-name, .equipment-name{
  font-weight:600;
  word-break:break-word !important;
  overflow-wrap:anywhere !important;
}

/* layout mobile mais compacto */
@media (max-width:768px){

  .card{
    padding:8px !important;
    margin-bottom:10px !important;
  }

  .card-title, .equip-name, .equipment-name{
    font-size:13px !important;
    line-height:1.2 !important;
  }

  .card p, .card span{
    font-size:12px !important;
  }

  /* botões menores */
  .card button, .card .btn{
    font-size:11px !important;
    padding:5px 8px !important;
  }

  /* container de equipamentos */
  .equipment-card{
    display:flex;
    flex-direction:column;
    gap:6px;
  }

  /* evitar cards gigantes */
  .equipment-card .card{
    min-height:auto !important;
  }

}



/* ===== EQUIPAMENTOS: CARDS MAIS PROFISSIONAIS (SEM MUDAR FUNÇÃO) ===== */
.equipment-list, #equipmentList, .equipments-list {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

.equipment-item, .equipment-card, .equip-card {
  border-radius: 14px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.06) !important;
  background: #fff;
  overflow: hidden;
}

.equipment-item .equipment-head,
.equipment-card .equipment-head,
.equip-card .equipment-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding: 10px 12px;
  background: linear-gradient(180deg, rgba(255, 208, 0, .22), rgba(255, 208, 0, .08));
}

.equipment-name, .equip-name, .equipment-title {
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  margin: 0 !important;
}

.equipment-meta, .equip-meta {
  padding: 10px 12px;
  display:flex;
  flex-wrap:wrap;
  gap:8px 10px;
  font-size: 12px;
}

.badge, .status-badge {
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 4px 8px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 12px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(0,0,0,.03);
}

.badge.ok { background: rgba(31, 157, 85, .12); border-color: rgba(31,157,85,.25); color:#1f9d55; }
.badge.warn { background: rgba(224, 36, 36, .12); border-color: rgba(224,36,36,.25); color:#e02424; }

.equipment-actions, .equip-actions {
  padding: 10px 12px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  border-top: 1px solid rgba(0,0,0,.06);
  background: rgba(0,0,0,.01);
}

.equipment-actions .btn, .equip-actions .btn, .equipment-actions button, .equip-actions button {
  transition: transform .08s ease, box-shadow .12s ease;
}
.equipment-actions .btn:active, .equip-actions .btn:active, .equipment-actions button:active, .equip-actions button:active {
  transform: scale(.98);
}

/* mobile-first refinements */
@media (max-width:768px){
  .equipment-item .equipment-head,
  .equipment-card .equipment-head,
  .equip-card .equipment-head { padding: 8px 10px; }
  .equipment-meta, .equip-meta { padding: 8px 10px; }
  .equipment-actions, .equip-actions { padding: 8px 10px; }
  .equipment-name, .equip-name, .equipment-title { font-size: 13px !important; }
}


/* ===== DASHBOARD: CARDS DE ESTATÍSTICAS ===== */
.stats-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.stat-card{
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  padding: 12px;
  background: #fff;
  animation: fadeUp .18s ease-out both;
}
.stat-label{ font-size: 12px; opacity:.75; margin-bottom: 4px; }
.stat-value{ font-size: 22px; font-weight: 900; letter-spacing: .2px; }

@media (max-width: 768px){
  .stats-grid{ grid-template-columns: 1fr; gap: 10px; }
  .stat-value{ font-size: 20px; }
}


/* ===== MOBILE FIRST EXTRA ===== */
@media (max-width:768px){
  .table-responsive, .table-container, .table-wrapper{
    overflow:auto !important;
    -webkit-overflow-scrolling: touch;
    border-radius: 12px;
  }
  .sidebar .logo, .sidebar img{ max-width: 140px; height: auto; }
}




/* === PATCH: MOBILE CORREÇÕES (bordas, textos, equipamentos) === */

/* Bordas amarelas mais visíveis no mobile */
@media (max-width:768px){
  .card, .form-container, .box, .panel, .section, .table-container{
    border-width: 2px !important;
    border-color: #f5c400 !important;
  }
}

/* Evitar texto "em pé" (quebra absurda) */
*{
  word-break: normal !important;
  overflow-wrap: break-word !important;
}

/* ===== Equipamentos: lista e nomes ===== */
.equipment-row, .equipment-item, .equipment-card, .equip-item{
  max-width:100%;
}
.equipment-name, .equip-name, .equipment-title{
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}

/* Se existir layout em colunas que deixa o nome estreito */
.equipment-row, .equipment-item{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.equipment-row .equipment-info, .equipment-item .equipment-info{
  flex: 1 1 auto;
  min-width: 0; /* importante para wrap correto */
}

/* ===== Ações (Editar/Excluir/Histórico) sem card/caixa ===== */
.actions-card, .action-card, .action-menu, .equip-actions-card, .dropdown-card{
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
}
.actions, .equipment-actions, .equip-actions, .row-actions{
  display:flex !important;
  flex-wrap:wrap;
  gap:8px !important;
  justify-content:flex-start;
}

/* no mobile, botões menores e em linha */
@media (max-width:768px){
  .actions button, .actions .btn,
  .equipment-actions button, .equipment-actions .btn,
  .equip-actions button, .equip-actions .btn,
  .row-actions button, .row-actions .btn{
    font-size: 11px !important;
    padding: 5px 8px !important;
    border-radius: 10px !important;
  }
}

/* ===== Card amarelo do topo (Registrar Retirada/Devolução/Adicionar) menor e mais à direita ===== */
@media (max-width:768px){
  .equip-top-card, .equipment-top-card, .actions-top, .equip-actions-top{
    padding: 8px 10px !important;
  }
  .equip-top-card .btn, .equipment-top-card .btn,
  .actions-top .btn, .equip-actions-top .btn{
    width: auto !important;
    min-width: 0 !important;
  }
  .equip-top-card, .equipment-top-card, .actions-top, .equip-actions-top{
    display:flex !important;
    justify-content:flex-end !important;
    gap:8px !important;
    flex-wrap:wrap !important;
  }
}

/* ===== Contabilidade: cores por classe e fallback por contexto ===== */
.value-receita, .receita, .income, .txt-receita, .label-receita + *{
  color:#1f9d55 !important; font-weight:800 !important;
}
.value-despesa, .despesa, .expense, .txt-despesa, .label-despesa + *{
  color:#e02424 !important; font-weight:800 !important;
}
.profit-positive{ color:#1f9d55 !important; font-weight:900 !important; }
.profit-negative{ color:#e02424 !important; font-weight:900 !important; }


/* === TABELAS ORGANIZADAS + FOTO THUMB + PROGRESSO CHECKLIST === */
.table{
  width:100%;
  border-collapse: collapse;
}
.table th, .table td{
  padding:10px;
  border-bottom:1px solid rgba(0,0,0,.08);
  vertical-align: middle;
}
.table th{
  text-align:left;
  font-weight:800;
  background: rgba(0,0,0,.02);
}
.table .num{
  width:44px;
  text-align:center;
  font-weight:900;
}
.thumb{
  width:44px; height:44px;
  border-radius:10px;
  object-fit:cover;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
}
.progress{
  height:10px;
  background: rgba(0,0,0,.08);
  border-radius:999px;
  overflow:hidden;
}
.progress > div{
  height:100%;
  background: linear-gradient(90deg, rgba(31,157,85,.95), rgba(245,196,0,.95));
  width:0%;
}
@media (max-width:768px){
  .table th, .table td{ padding:8px; font-size:12.5px; }
  .thumb{ width:40px; height:40px; border-radius:10px; }
}

/* === AJUSTES: CENTRALIZAR CONTEÚDO + BORDAS VISÍVEIS + EQUIPAMENTOS SEM CARD DE AÇÕES === */
*{ box-sizing: border-box; }

.main-content, .page-content{
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

@media (max-width: 768px){
  .main-content, .page-content{
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* borda amarela mais fina no bloco de status de equipamentos */
#equipmentsTable, .equipment-list .table{
  border: 1px solid rgba(245,196,0,.9);
  border-radius: 12px;
  overflow: hidden;
}

/* remover “card” em volta dos botões */
.actions{ background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; }

/* botões do topo em 2 linhas no mobile */
@media (max-width: 768px){
  .equipment-actions{
    display:flex;
    gap:10px;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}

/* Sidebar responsiva (fix do botão de menu) */
.sidebar-overlay {
position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 1000;
    pointer-events: none;
}
.sidebar-overlay.show {
  opacity: 1;
  pointer-events: auto;

    pointer-events: auto;
}

@media (max-width: 900px){
  .sidebar{
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    max-width: 86vw;
    transform: translateX(-110%);
  }
  .sidebar.open{
    transform: translateX(0);
  }
  /* garante que o conteúdo principal não fique por cima */
  .main-wrapper, .main-content, .dashboard-container{
    position: relative;
    z-index: 1000;
  }
}

/* Cards padrão para listas (sem tabela) */
.cards-grid{ display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:12px; margin-top:12px; }
@media (max-width: 980px){ .cards-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 600px){ .cards-grid{ grid-template-columns: 1fr; } }
.card-item{ border:1px solid rgba(0,0,0,.08); border-radius:14px; padding:12px; background:#fff; box-shadow:0 8px 24px rgba(0,0,0,.06); }
.card-item .meta{ opacity:.75; font-size:12px; margin-top:6px; }
.card-item .actions{ display:flex; gap:8px; margin-top:10px; flex-wrap:wrap; }

.saved-list{ margin-top:12px; }

/* Lista vertical numerada (padrão) */
.stack-list{ margin-top:12px; }
.stack-item{ border:1px solid rgba(0,0,0,.08); border-radius:14px; padding:12px; background:#fff; box-shadow:0 8px 24px rgba(0,0,0,.06); margin-bottom:10px; }
.stack-sep{ height:1px; width:100%; background: rgba(0,0,0,.10); margin:10px 0 0; }
.stack-num{ font-weight:900; margin-right:6px; }

/* Borda amarela visível no mobile */
.form-section, .members-list{ border:2px solid #f1c40f; }
@media (max-width: 600px){
  .form-section, .members-list{ margin-left:12px; margin-right:12px; }
}
.thumb{ width:54px; height:40px; object-fit:cover; border-radius:10px; background:#f3f3f3; }

/* ===== Fix definitivo: overlay do menu não bloqueia navegação no mobile ===== */
:root{ --sidebar-w: 260px; }

/* Sidebar com aparência igual PC (preto) */
.sidebar{ z-index: 1100; background:#0b0b0b !important; }

/* Overlay NUNCA deve cobrir a sidebar (senão o clique no link não funciona no mobile) */
.sidebar-overlay{
  position:fixed;
  top:0; bottom:0;
  left:0; right:0;
  background:rgba(0,0,0,.45);
  display:block;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
  z-index: 1000;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}

/* Quando aberto, o overlay começa APÓS a largura do menu */
.sidebar-overlay.show{
  opacity:1;
  pointer-events:auto;
  left: var(--sidebar-w);
}

@media (max-width: 520px){
  :root{ --sidebar-w: 85vw; }
}

/* ===== Check-list (novo) ===== */
.progress-wrap{ width:100%; height:12px; background:#eee; border-radius:999px; overflow:hidden; border:1px solid rgba(0,0,0,.08); }
.progress-bar{ height:100%; background:#f1c40f; transition: width .25s ease; }
.check2-item{ display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; align-items:center; padding:10px 0; }
.check2-left{ display:flex; gap:10px; align-items:flex-start; }
.check2-tag{ font-size:11px; padding:4px 8px; border-radius:999px; background:rgba(241,196,15,.18); border:1px solid rgba(241,196,15,.35); }
.check2-title{ font-weight:800; }
.check2-sub{ font-size:12px; opacity:.75; margin-top:3px; }
.check2-toggle{ display:flex; gap:10px; align-items:center; }
.switch{ width:46px; height:26px; border-radius:999px; background:#ddd; position:relative; cursor:pointer; transition:.2s; border:1px solid rgba(0,0,0,.08); }
.switch::after{ content:''; width:22px; height:22px; background:#fff; border-radius:50%; position:absolute; top:1px; left:1px; transition:.2s; box-shadow:0 4px 10px rgba(0,0,0,.18); }
.switch.on{ background:#2ecc71; }
.switch.on::after{ left:21px; }
.hr{ height:1px; width:100%; background:rgba(0,0,0,.10); margin:8px 0; }
.thumb-sm{ width:60px; height:44px; object-fit:cover; border-radius:10px; background:#f3f3f3; border:1px solid rgba(0,0,0,.08); }

.menu-close{
  display:none;
  border:0;
  width:42px;
  height:42px;
  border-radius:14px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:26px;
  line-height:42px;
  cursor:pointer;
}
@media (max-width: 900px){
  .menu-close{ display:inline-flex; align-items:center; justify-content:center; }
}

/* ===============================
   MOBILE: sidebar inicia fechada
   =============================== */
@media (max-width: 900px){
  .sidebar{
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    height: 100vh !important;
    transform: translateX(-110%) !important;
  }
  .sidebar.open{ transform: translateX(0) !important; }
  .sidebar-overlay{ display:none !important; }
  .sidebar-overlay.show{ display:block !important; }
}

/* Botão pequeno vermelho (excluir) */
.action-btn-small.danger{ background:#ffdddd !important; border:1px solid #ffb3b3 !important; }
.action-btn-small.danger:hover{ background:#ffc9c9 !important; }



/* === PATCH MENU (PC + MOBILE) === */
.toggle-btn{
  position: relative;
  z-index: 3000;
}
.sidebar-overlay{
  z-index: 2500;
}
.sidebar{
  z-index: 2600;
}
.sidebar-close{
  position: relative;
  z-index: 3100;
}


/* Melhor compatibilidade de toque no mobile */
.toggle-btn, .sidebar-close{ touch-action: manipulation; -webkit-tap-highlight-color: transparent; }



/* === FIX BORDA BRANCA MENU MOBILE === */
#appSidebar{
position: fixed;
left: 0;
top: 0;
width: 280px;
height: 100%;
background: #000;
z-index: 2000;
}

#sidebarOverlay{
position: fixed;
top: 0;
left: 280px;
width: calc(100% - 280px);
height: 100%;
background: rgba(0,0,0,0.5);
z-index: 1500;
display: none;
}

#sidebarOverlay.active{
display:block;
}

body{
overflow-x:hidden;
}


/* ===== FINAL FIX WHITE STRIP MOBILE ===== */
#appSidebar{
left:0 !important;
width:300px !important;
background:#000 !important;
border-right:none !important;
box-shadow:none !important;
}

#sidebarOverlay{
left:0 !important;
width:100% !important;
background:rgba(0,0,0,0.55) !important;
}

#appSidebar.open{
transform:translateX(0) !important;
}

body,html{
background:#000;
overflow-x:hidden;
}



/* ===== FIX: Overlay não pode bloquear cliques do menu (mobile) ===== */
:root{ --sidebarW: 300px; }

#appSidebar{
  width: var(--sidebarW) !important;
  z-index: 2000 !important;
  pointer-events: auto !important;
  background: #000 !important;
  border-right: none !important;
  box-shadow: none !important;
}

#sidebarOverlay{
  left: var(--sidebarW) !important;
  width: calc(100% - var(--sidebarW)) !important;
  z-index: 1500 !important;
  pointer-events: auto !important;
  background: rgba(0,0,0,0.55) !important;
}

/* Garante que a área "branca" seja escurecida quando o menu estiver aberto */
#sidebarOverlay.active{ display:block !important; }

/* Evita qualquer faixa branca por overflow */
html, body{ overflow-x:hidden; }

/* =========================================================
   BBCOP - CAMADA FINAL PROFISSIONAL RESPONSIVA
   Corrige mobile/desktop, tabelas, listas, formulários e menu
   ========================================================= */
:root{
  --bbcop-yellow:#FFD700;
  --bbcop-yellow-dark:#E6C200;
  --bbcop-bg:#f4f6f8;
  --bbcop-card:#ffffff;
  --bbcop-text:#17212b;
  --bbcop-muted:#667085;
  --bbcop-line:#e5e7eb;
  --bbcop-sidebar:#0f1115;
  --bbcop-radius:16px;
  --bbcop-shadow:0 10px 30px rgba(16,24,40,.08);
  --bbcop-sidebar-width:280px;
}

html,
body{
  width:100% !important;
  min-height:100% !important;
  margin:0 !important;
  background:var(--bbcop-bg) !important;
  color:var(--bbcop-text) !important;
  overflow-x:hidden !important;
  -webkit-text-size-adjust:100%;
}

body.no-scroll{ overflow:hidden !important; }

img,svg,video,canvas{ max-width:100%; height:auto; }

*{ box-sizing:border-box; }

/* Layout principal */
.dashboard-container{
  min-height:100vh !important;
  height:100vh !important;
  width:100% !important;
  display:flex !important;
  flex-direction:row !important;
  background:var(--bbcop-bg) !important;
  overflow:hidden !important;
}

.main-wrapper{
  flex:1 1 auto !important;
  min-width:0 !important;
  width:100% !important;
  display:flex !important;
  flex-direction:column !important;
  background:var(--bbcop-bg) !important;
  position:relative !important;
  z-index:1 !important;
}

.header{
  min-height:64px !important;
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:12px 20px !important;
  background:rgba(255,255,255,.96) !important;
  border-bottom:1px solid var(--bbcop-line) !important;
  box-shadow:0 2px 12px rgba(16,24,40,.04) !important;
  position:sticky !important;
  top:0 !important;
  z-index:500 !important;
}

.header-left{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  min-width:0 !important;
}

.page-title,
.header h2{
  margin:0 !important;
  font-size:clamp(17px,2.4vw,22px) !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  color:var(--bbcop-text) !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.user-info{ flex:0 0 auto !important; }
#currentUser{
  display:inline-flex !important;
  max-width:220px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  background:#eef2f6 !important;
  color:#344054 !important;
  border-radius:999px !important;
  padding:7px 12px !important;
  font-size:13px !important;
  font-weight:700 !important;
}

.toggle-btn{
  flex:0 0 42px !important;
  width:42px !important;
  height:42px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid var(--bbcop-line) !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#111827 !important;
  font-size:22px !important;
  line-height:1 !important;
  box-shadow:0 4px 12px rgba(16,24,40,.06) !important;
  cursor:pointer !important;
  z-index:3000 !important;
}

.main-content{
  flex:1 1 auto !important;
  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:24px !important;
  overflow:auto !important;
  background:var(--bbcop-bg) !important;
}

.page-content{
  width:min(100%,1220px) !important;
  max-width:1220px !important;
  min-width:0 !important;
  margin:0 auto !important;
  padding:0 !important;
}

.page-content > h3,
.tab-content h3{
  margin:0 0 18px !important;
  padding:0 0 12px !important;
  border-bottom:3px solid var(--bbcop-yellow) !important;
  font-size:clamp(20px,2.8vw,28px) !important;
  line-height:1.2 !important;
  font-weight:900 !important;
  color:var(--bbcop-text) !important;
  word-break:normal !important;
  overflow-wrap:anywhere !important;
}

/* Sidebar */
#appSidebar,
.sidebar{
  flex:0 0 var(--bbcop-sidebar-width) !important;
  width:var(--bbcop-sidebar-width) !important;
  height:100vh !important;
  background:var(--bbcop-sidebar) !important;
  color:#fff !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  border-right:1px solid rgba(255,255,255,.08) !important;
  box-shadow:8px 0 30px rgba(15,17,21,.18) !important;
  position:relative !important;
  z-index:1200 !important;
  transform:none !important;
}

#appSidebar.collapsed,
.sidebar.collapsed{
  width:0 !important;
  flex-basis:0 !important;
  transform:none !important;
  border-right:0 !important;
}

.sidebar-header{
  min-height:78px !important;
  padding:16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  background:#090b0f !important;
  border-bottom:1px solid rgba(255,255,255,.1) !important;
}

.logo-container{ min-width:0 !important; display:flex !important; align-items:center !important; gap:10px !important; }
.logo-sidebar{ width:48px !important; height:48px !important; object-fit:cover !important; border-radius:50% !important; border:2px solid var(--bbcop-yellow) !important; }
.logo-container h3{ margin:0 !important; font-size:18px !important; letter-spacing:.6px !important; color:#fff !important; }

.sidebar-close{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:38px !important;
  height:38px !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.06) !important;
  color:#fff !important;
  cursor:pointer !important;
}

.sidebar-menu{
  flex:1 1 auto !important;
  display:flex !important;
  flex-direction:column !important;
  gap:3px !important;
  padding:12px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

.sidebar-menu .menu-link,
.sidebar-menu .tab-btn{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  min-height:42px !important;
  padding:10px 12px !important;
  border-radius:12px !important;
  border:0 !important;
  border-left:3px solid transparent !important;
  background:transparent !important;
  color:#d0d5dd !important;
  text-decoration:none !important;
  font-size:14px !important;
  font-weight:700 !important;
  line-height:1.25 !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:anywhere !important;
}

.sidebar-menu .menu-link:hover,
.sidebar-menu .menu-link.active,
.sidebar-menu .tab-btn:hover,
.sidebar-menu .tab-btn.active{
  background:rgba(255,215,0,.12) !important;
  color:var(--bbcop-yellow) !important;
  border-left-color:var(--bbcop-yellow) !important;
}

.logout-menu{ margin-top:auto !important; }

#sidebarOverlay,
.sidebar-overlay{
  position:fixed !important;
  inset:0 !important;
  left:0 !important;
  width:100% !important;
  height:100% !important;
  display:none !important;
  opacity:0 !important;
  pointer-events:none !important;
  background:rgba(15,17,21,.58) !important;
  z-index:1000 !important;
}

#sidebarOverlay.show,
#sidebarOverlay.active,
.sidebar-overlay.show,
.sidebar-overlay.active{
  display:block !important;
  opacity:1 !important;
  pointer-events:auto !important;
}

/* Cards, seções e formulários */
.card,
.form-section,
.upload-section,
.equipment-actions,
.accounting-section,
.occurrence-form,
.members-list,
.documents-list,
.equipment-list,
.activity-log,
.affiliation-form,
.affiliations-list,
.occurrence-history-section,
.accounting-history,
.conversations-list,
.message-type-selector,
.alert-section,
.saved-item,
.stack-item,
.card-item{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 0 18px !important;
  padding:18px !important;
  background:var(--bbcop-card) !important;
  border:1px solid var(--bbcop-line) !important;
  border-top:3px solid var(--bbcop-yellow) !important;
  border-radius:var(--bbcop-radius) !important;
  box-shadow:var(--bbcop-shadow) !important;
  overflow:hidden !important;
}

.form-section h4,
.members-list h4,
.documents-list h4,
.equipment-list h4,
.affiliations-list h4,
.accounting-history h4{
  margin:0 0 14px !important;
  padding-bottom:10px !important;
  border-bottom:1px solid var(--bbcop-line) !important;
  font-size:18px !important;
  font-weight:900 !important;
}

.form-row{
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr)) !important;
  gap:14px !important;
  margin-bottom:14px !important;
}

.form-row input,
.form-row select,
.form-row textarea,
.form-group input,
.form-group select,
.form-group textarea,
.message-input-container input{
  width:100% !important;
  min-width:0 !important;
  height:auto !important;
  border:1px solid #d0d5dd !important;
  background:#fff !important;
  color:var(--bbcop-text) !important;
  border-radius:12px !important;
  padding:11px 12px !important;
  font-size:15px !important;
  line-height:1.35 !important;
  outline:none !important;
}

textarea{ min-height:96px !important; resize:vertical !important; }

.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus,
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{
  border-color:var(--bbcop-yellow) !important;
  box-shadow:0 0 0 4px rgba(255,215,0,.18) !important;
}

.submit-btn,
.action-btn,
.action-btn-small,
.send-btn,
.message-type-btn,
button.btn,
a.btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  min-height:40px !important;
  max-width:100% !important;
  border:0 !important;
  border-radius:12px !important;
  background:var(--bbcop-yellow) !important;
  color:#111827 !important;
  padding:9px 14px !important;
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  text-decoration:none !important;
  white-space:normal !important;
  cursor:pointer !important;
  box-shadow:none !important;
}

.submit-btn:hover,
.action-btn:hover,
.action-btn-small:hover,
.send-btn:hover,
.message-type-btn:hover{ background:var(--bbcop-yellow-dark) !important; transform:none !important; }

.remove-btn,
.action-btn-small.danger{ background:#fee2e2 !important; color:#b42318 !important; border:1px solid #fecaca !important; }

/* Listas */
.list-item,
.log-item,
.accounting-entry,
.occurrence-item,
.conversation-item{
  width:100% !important;
  min-width:0 !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:14px 0 !important;
  border-bottom:1px solid var(--bbcop-line) !important;
  background:transparent !important;
  overflow-wrap:anywhere !important;
}

.list-item:last-child,
.log-item:last-child{ border-bottom:0 !important; }

.member-info,
.equipment-info,
.affiliation-info,
.entry-description,
.occurrence-desc{
  min-width:0 !important;
  flex:1 1 auto !important;
  overflow-wrap:anywhere !important;
}

.member-actions,
.equipment-actions,
.affiliation-actions,
.occurrence-actions,
.saved-item-actions,
.actions,
.row-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  justify-content:flex-end !important;
  align-items:center !important;
  min-width:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

/* Tabelas: desktop bonito + mobile com rolagem interna */
.table-responsive,
.table-wrap,
.table-container,
.table-wrapper,
.members-list,
.documents-list,
.equipment-list,
.users-list{
  max-width:100% !important;
  overflow-x:auto !important;
  -webkit-overflow-scrolling:touch !important;
}

.table{
  width:100% !important;
  min-width:760px !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  background:#fff !important;
  border:1px solid var(--bbcop-line) !important;
  border-radius:14px !important;
  overflow:hidden !important;
}

.table th,
.table td{
  padding:12px 14px !important;
  border-bottom:1px solid var(--bbcop-line) !important;
  vertical-align:middle !important;
  text-align:left !important;
  font-size:14px !important;
  line-height:1.35 !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
}

.table th{
  background:#f9fafb !important;
  color:#344054 !important;
  font-weight:900 !important;
  white-space:nowrap !important;
}

.table tr:last-child td{ border-bottom:0 !important; }

.thumb,
.thumb-sm{
  flex:0 0 auto !important;
  width:54px !important;
  height:42px !important;
  object-fit:cover !important;
  border-radius:10px !important;
  border:1px solid var(--bbcop-line) !important;
  background:#f2f4f7 !important;
}

/* Dashboard */
.stats-grid{
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important;
  gap:14px !important;
  margin-top:16px !important;
}

.stat-card{
  min-width:0 !important;
  padding:18px !important;
  border-radius:var(--bbcop-radius) !important;
  border:1px solid var(--bbcop-line) !important;
  border-top:3px solid var(--bbcop-yellow) !important;
  background:#fff !important;
  box-shadow:var(--bbcop-shadow) !important;
}
.stat-label{ font-size:13px !important; color:var(--bbcop-muted) !important; font-weight:800 !important; text-transform:none !important; }
.stat-value{ margin-top:6px !important; font-size:clamp(24px,4vw,34px) !important; font-weight:950 !important; color:var(--bbcop-text) !important; overflow-wrap:anywhere !important; }

/* Chat/mensagens */
.message-type-selector,
.message-input-container,
.chat-header,
.private-chat-header{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  align-items:center !important;
}
.message-input-container input{ flex:1 1 220px !important; }
.chat-container{ width:100% !important; max-width:100% !important; height:min(520px,70vh) !important; overflow:hidden !important; }
.message-item.own{ margin-left:0 !important; }
.message-item.other{ margin-right:0 !important; }

/* Modal */
.modal-overlay{ z-index:5000 !important; padding:16px !important; }
.modal{ width:min(960px,100%) !important; max-height:92vh !important; border-radius:18px !important; }
.modal-body{ max-height:70vh !important; overflow:auto !important; }
.details-table{ min-width:0 !important; }
.details-table td{ overflow-wrap:anywhere !important; }

/* Mobile */
@media (max-width:900px){
  :root{ --bbcop-sidebar-width:min(86vw,300px); }

  .dashboard-container{ height:100vh !important; }

  #appSidebar,
  .sidebar{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    width:var(--bbcop-sidebar-width) !important;
    flex-basis:var(--bbcop-sidebar-width) !important;
    height:100dvh !important;
    transform:translateX(-110%) !important;
    transition:transform .24s ease !important;
    z-index:2000 !important;
    box-shadow:18px 0 50px rgba(0,0,0,.3) !important;
  }

  #appSidebar.open,
  .sidebar.open{
    transform:translateX(0) !important;
  }

  #appSidebar.collapsed,
  .sidebar.collapsed{
    width:var(--bbcop-sidebar-width) !important;
    flex-basis:var(--bbcop-sidebar-width) !important;
    transform:translateX(-110%) !important;
  }

  .main-wrapper{ width:100% !important; }
  .header{ padding:10px 12px !important; min-height:58px !important; }
  .page-title,.header h2{ max-width:calc(100vw - 150px) !important; font-size:17px !important; }
  #currentUser{ max-width:92px !important; padding:6px 9px !important; font-size:12px !important; }
  .main-content{ padding:14px !important; }
  .page-content > h3,.tab-content h3{ font-size:20px !important; margin-bottom:14px !important; }

  .card,
  .form-section,
  .upload-section,
  .equipment-actions,
  .accounting-section,
  .occurrence-form,
  .members-list,
  .documents-list,
  .equipment-list,
  .activity-log,
  .affiliation-form,
  .affiliations-list,
  .occurrence-history-section,
  .accounting-history,
  .conversations-list,
  .message-type-selector,
  .alert-section{
    padding:14px !important;
    margin-bottom:14px !important;
    border-radius:14px !important;
  }

  .form-row{ grid-template-columns:1fr !important; gap:10px !important; margin-bottom:10px !important; }
  .form-row input,.form-row select,.form-row textarea,.form-group input,.form-group select,.form-group textarea{ font-size:16px !important; padding:10px 11px !important; }

  .list-item,
  .log-item,
  .entry-main,
  .occurrence-summary,
  .saved-item-head,
  .summary-row,
  .affiliation-header{
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }

  .member-actions,
  .equipment-actions,
  .affiliation-actions,
  .occurrence-actions,
  .saved-item-actions,
  .actions,
  .row-actions{
    justify-content:flex-start !important;
  }

  .submit-btn,
  .action-btn,
  .action-btn-small,
  .send-btn,
  .message-type-btn,
  button.btn,
  a.btn{
    min-height:38px !important;
    padding:8px 11px !important;
    font-size:13px !important;
  }

  .table{ min-width:680px !important; }
  .table th,.table td{ padding:10px !important; font-size:13px !important; }
  .stats-grid{ grid-template-columns:1fr !important; gap:12px !important; }

  .toast-root{ left:12px !important; right:12px !important; bottom:12px !important; }
  .toast{ width:100% !important; max-width:none !important; }
}

@media (max-width:480px){
  .main-content{ padding:10px !important; }
  .header{ gap:8px !important; }
  .toggle-btn{ flex-basis:40px !important; width:40px !important; height:40px !important; }
  .page-title,.header h2{ max-width:calc(100vw - 132px) !important; }
  .form-section,.members-list,.documents-list,.equipment-list,.card{ padding:12px !important; }
  .table{ min-width:620px !important; }
}

@media print{
  .sidebar,.header,.toggle-btn,.sidebar-overlay{ display:none !important; }
  .dashboard-container,.main-wrapper,.main-content{ height:auto !important; overflow:visible !important; display:block !important; }
  .page-content{ max-width:none !important; }
}


/* ===== RDO + Checklist operacional ===== */
.check-section{margin:18px 0;padding:16px;border:1px solid rgba(0,0,0,.08);border-radius:14px;background:var(--card-bg,#fff)}
.check-section h4{margin:0 0 12px;font-size:15px;letter-spacing:.2px}
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.check-card{display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 12px;border:1px solid rgba(0,0,0,.09);border-radius:10px;cursor:pointer;background:rgba(255,255,255,.55)}
.check-card input[type="checkbox"]{width:18px;height:18px;flex:0 0 auto}
.check-card span{flex:1;overflow-wrap:anywhere}
.validity-input{max-width:145px;padding:6px!important;min-height:34px!important}
@media(max-width:720px){.check-grid{grid-template-columns:1fr}.check-section{padding:12px}.check-card{align-items:flex-start;flex-wrap:wrap}.validity-input{width:100%;max-width:none;margin-left:27px}}

/* ===== Correção definitiva: registros salvos e detalhes no mobile ===== */
.saved-item,
.list-item,
.log-item,
.members-list,
.documents-list,
.equipment-list,
.occurrence-history-section,
.accounting-history,
.affiliations-list,
.activity-log,
.card,
.form-section{
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

.saved-item * ,
.list-item * ,
.log-item * ,
.details-grid *{
  min-width:0;
  box-sizing:border-box;
}

.saved-item-title,
.saved-item .muted,
.list-item .muted,
.log-item,
.detail-value{
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}

.saved-item-head{
  width:100% !important;
  max-width:100% !important;
}
.saved-item-title{
  flex:1 1 220px !important;
  max-width:100% !important;
}
.saved-item-actions,
.row-actions,
.actions,
.member-actions,
.occurrence-actions,
.affiliation-actions{
  display:flex !important;
  flex-wrap:wrap !important;
  max-width:100% !important;
  gap:8px !important;
}
.saved-item-actions button,
.row-actions button,
.actions button,
.member-actions button,
.occurrence-actions button,
.affiliation-actions button{
  max-width:100% !important;
}

.details-grid{
  display:grid;
  grid-template-columns:1fr;
  width:100%;
  max-width:100%;
  border:1px solid var(--bbcop-line,#e5e7eb);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
}
.detail-row{
  display:grid;
  grid-template-columns:minmax(140px,34%) minmax(0,1fr);
  border-bottom:1px solid var(--bbcop-line,#e5e7eb);
}
.detail-row:last-child{border-bottom:0}
.detail-label,
.detail-value{
  padding:10px 12px;
  min-width:0;
}
.detail-label{
  font-weight:800;
  background:#f8fafc;
  color:#344054;
}
.detail-value{
  white-space:pre-wrap !important;
  color:var(--bbcop-text,#111827);
}

/* Nunca deixa conteúdo dinâmico salvo aumentar a largura da página */
.page-content,
.main-content,
.main-wrapper,
.members-list,
.list-item,
.saved-item,
.modal,
.modal-body{
  max-width:100% !important;
  min-width:0 !important;
}

@media(max-width:720px){
  .saved-item{
    padding:12px !important;
    border-radius:12px !important;
  }
  .saved-item-head{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:10px !important;
  }
  .saved-item-title{
    flex:0 1 auto !important;
    width:100% !important;
    font-size:14px !important;
    line-height:1.4 !important;
  }
  .saved-item-actions{
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:7px !important;
  }
  .saved-item-actions button{
    width:100% !important;
    min-width:0 !important;
    padding:9px 7px !important;
    font-size:12px !important;
  }
  .detail-row{
    grid-template-columns:1fr !important;
  }
  .detail-label{
    padding:9px 10px 4px !important;
    background:#f8fafc !important;
  }
  .detail-value{
    padding:6px 10px 11px !important;
    background:#fff !important;
  }
  .modal-overlay{
    padding:8px !important;
    align-items:flex-end !important;
  }
  .modal{
    width:100% !important;
    max-width:100% !important;
    max-height:94dvh !important;
    border-radius:16px 16px 0 0 !important;
  }
  .modal-body{
    width:100% !important;
    max-width:100% !important;
    max-height:76dvh !important;
    padding:12px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
  }
  .modal-actions{
    display:flex !important;
    flex-wrap:wrap !important;
    padding:10px 12px !important;
  }
  .modal-actions button{
    flex:1 1 120px !important;
  }

  /* Tabelas continuam acessíveis por rolagem, sem empurrar a página inteira */
  .table-responsive,
  .table-container,
  .table-wrapper{
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch !important;
    border-radius:12px !important;
  }
}

@media(max-width:420px){
  .saved-item-actions{
    grid-template-columns:1fr !important;
  }
}