/* css/partials/components.css
   Botões, cards, modals, formulários, tabelas, timeline e outros componentes
*/

/* FORM UTILITIES & CHECKBOXES */
.form-group-checkbox {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
    flex-wrap: wrap;
}
.form-group-checkbox input {
    width: auto;
    margin-bottom: 0;
}
.form-group-checkbox label {
    margin-bottom: 0;
    cursor: pointer;
    font-weight: 400;
}
.radio-group {
    display: flex;
    gap: 20px;
    padding-top: 5px;
    padding-bottom: 5px;
    flex-wrap: wrap;
}
.radio-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
}
.radio-label input {
    width: auto;
    margin: 0;
}

/* Flex wrapper for horizontal checkbox layout */
.flex-checkbox-group {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    align-items: flex-start;
}
.flex-checkbox-group .form-group-checkbox {
    flex: 0 1 auto;
    margin-bottom: 0;
}

/* BOTÕES PRINCIPAIS (COM TEXTO) */
.button {
    padding: 10px 20px;
    border: none;
    border-radius: var(--raio-borda);
    cursor: pointer;
    font-weight: 500;
    font-size: 0.9rem;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}
.button.small { padding: 6px 12px; font-size: 0.8rem; }
.button.tiny { padding: 4px 8px; font-size: 0.75rem; gap: 4px; }
.button.primary, .button { background-color: var(--cor-primaria); color: white; }
.button.primary:hover, .button:hover { background-color: #1e293b; color: white; }
.button.secondary { background-color: #6c757d; color: white; }
.button.secondary:hover { background-color: #5a6268; }
.button.danger, .button.alert { background-color: var(--cor-alerta); color: white; }
.button.danger:hover, .button.alert:hover { background-color: #c82333; }
.button.success { background-color: var(--cor-sucesso); color: white; }
.button.success:hover { background-color: #218838; }

/* BOTÕES DE AÇÃO (CIRCULARES) */
button.action-btn {
    width: 30px; height: 30px; border-radius: 50%; border: none; cursor: pointer; transition: background-color 0.2s ease, transform 0.2s ease, color 0.2s ease; font-size: 0; position: relative; background-color: #e9ecef; color: var(--cor-texto-leve); padding: 0;
}
button.action-btn:hover { transform: translateY(-2px); color: white; }
button.action-btn i, button.action-btn::before { font-size: 12px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
button.action-btn.edit-client-btn:hover, button.action-btn.edit-team-btn:hover, button.action-btn.edit-hunt-team-btn:hover { background-color: var(--cor-primaria); }
button.action-btn.delete-client-btn:hover, button.action-btn.delete-quest-team-btn:hover, button.action-btn.delete-hunt-team-btn:hover, button.action-btn.alert:hover { background-color: var(--cor-alerta); }
button.action-btn.edit-client-btn::before, button.action-btn.delete-client-btn::before { font-family: "Font Awesome 5 Free"; font-weight: 900; }
button.action-btn.edit-client-btn::before { content: "\f044"; }
button.action-btn.delete-client-btn::before { content: "\f2ed"; }

.drop-card .button.small, .timeline-item .button.small { width: 30px; height: 30px; border-radius: 50%; padding: 0; font-size: 0; position: relative; background-color: transparent; border: 1.5px solid #d1d5db; color: var(--cor-texto-leve); transition: all 0.2s ease-in-out; }
.drop-card .button.small:hover, .timeline-item .button.small:hover { color: #fff; transform: translateY(-2px); }
.drop-card .button.small.edit-status-btn:hover, .drop-card .button.small.pay-log-btn:hover { background-color: var(--cor-primaria); border-color: var(--cor-primaria); }
.drop-card .button.small.edit-drop-btn:hover, .timeline-item .button.small.edit-drop-btn:hover, .drop-card .button.small.edit-log-btn:hover, .timeline-item .button.small.edit-log-btn:hover { background-color: var(--cor-secundaria); border-color: var(--cor-secundaria); }
.timeline-item .button.small.divide-item-btn:hover { background-color: var(--cor-sucesso); border-color: var(--cor-sucesso); }

.drop-card .button.small i, .timeline-item .button.small i { font-size: 12px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

/* CLIENT GRID & CARDS */
.client-grid-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 24px; }
.client-card-themed { background-color: #ffffff; border: 1px solid #ffffff; border-radius: 5px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); display: flex; flex-direction: column; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.client-card-themed:hover { transform: translateY(-5px); box-shadow: 0 6px 12px rgba(0,0,0,0.15); }
.card-themed-header { padding: 16px; border-bottom: 2px solid #1e293b27; }
.char-identity { display: flex; align-items: center; gap: 15px; }
.vocation-icon { font-size: 2rem; color: var(--cor-secundaria); width: 40px; text-align: center; }
.char-name-level .char-name { margin: 0; font-size: 1.2rem; font-weight: 600; color: var(--cor-secundaria); display: flex; align-items: center; }
.fixed-char-badge { color: var(--cor-aviso); font-size: 0.9rem; margin-left: 8px; }
.char-name-level .char-level { font-size: 0.9rem; color: var(--cor-texto-leve); }
.card-themed-body { padding: 16px; flex-grow: 1; }
.quest-status-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; text-align: center; }
.quest-status-item { padding: 12px 8px; border-radius: var(--raio-borda); display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: 0.8rem; font-weight: 500; }
.quest-status-item i { font-size: 1.5rem; }
.quest-status-item.status-done { background-color: #EAF6EC; color: var(--cor-sucesso); }
.quest-status-item.status-todo { background-color: #FFF8E1; color: #B08000; }
.quest-status-item.status-no-access { background-color: #F1F3F5; color: var(--cor-texto-leve); }
.card-themed-footer { padding: 12px 16px; background-color: #ffffff; border-top: 1px solid #EAE0C8; display: flex; justify-content: space-between; align-items: center; font-size: 0.9rem; }
.card-themed-footer .payment-info { color: #1e293b; }
.card-themed-footer .actions { display: flex; gap: 8px; }

/* STATUS BADGES */
.status, .status-badge { padding: 4px 12px; border-radius: 15px; font-size: 0.8rem; font-weight: 500; color: #fff; display: inline-block; }
.status-feito, .status-pago { background-color: var(--cor-sucesso); }
.status-pendente { background-color: var(--cor-alerta); }
.status-a-fazer { background-color: var(--cor-aviso); color: #333; }
.status-nao-contem, .status-sem-acesso { background-color: var(--cor-neutra); }
.status-andamento { background-color: var(--cor-info); }

/* MODAL (GERAL) */
.modal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(30,41,59,0.8); display: flex; justify-content: center; align-items: center; z-index: 2000; opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0s 0.3s; }
.modal-overlay.active { opacity: 1; visibility: visible; transition: opacity 0.3s ease; }
.modal-content { background-color: var(--cor-surface); border-radius: var(--raio-borda); box-shadow: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04); width: 90%; max-width: 600px; transform: scale(0.95); transition: transform 0.3s ease; display: flex; flex-direction: column; max-height: 90vh; }
.modal-content.large { max-width: 800px; }
.modal-overlay.active .modal-content { transform: scale(1); }
.modal-header, .modal-footer, .modal-body { padding: 24px 30px; }
.modal-header { border-bottom: 1px solid var(--cor-borda); flex-shrink: 0; display: flex; justify-content: space-between; align-items: center; }
.modal-footer, .modal-actions { border-top: 1px solid var(--cor-borda); padding: 16px 30px; flex-shrink: 0; background-color: #f9fafb; display: flex; justify-content: flex-end; align-items: center; gap: 12px; }
.modal-body { overflow-y: auto; }
.modal-header h2 { margin: 0; border: none; padding: 0; font-size: 1.5rem; }
.close-modal-btn { background: none; border: none; font-size: 1.8rem; cursor: pointer; color: var(--cor-texto-leve); line-height: 1; }
label { display: block; margin-bottom: 8px; font-weight: 500; font-size: 0.9rem; }
input[type="text"], input[type="number"], input[type="search"], input[type="date"], input[type="password"], select, textarea { width: 100%; padding: 12px; border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); box-sizing: border-box; margin-bottom: 16px; transition: border-color 0.3s ease; font-family: inherit; font-size: 1rem; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--cor-primaria); }

/* FILTROS E PESQUISA */
.filter-controls { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.search-wrapper { position: relative; }
.search-wrapper .search-icon { position: absolute; top: 50%; left: 12px; transform: translateY(-50%); width: 20px; height: 20px; fill: var(--cor-texto-leve); pointer-events: none; }
#client-search-input { width: 250px; padding: 10px 15px 10px 40px; border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); font-size: 0.9rem; transition: all 0.3s ease; background-color: var(--cor-surface); box-sizing: border-box; margin-bottom: 0; }
#client-search-input:focus { outline: none; border-color: var(--cor-primaria); box-shadow: 0 0 0 3px rgba(243,125,29,0.15); }

/* DROPS & TEAM LOG */
.count-badge { background-color: var(--cor-primaria); color: white; font-size: 0.75rem; padding: 2px 8px; border-radius: 10px; font-weight: 600; }
.drop-cards-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.drop-card { background-color: var(--cor-surface); border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); box-shadow: var(--sombra-suave); padding: 20px; display: flex; flex-direction: column; position: relative; border-left: 4px solid var(--cor-borda); transition: border-left-color 0.3s ease, background-color 0.3s ease; }
.drop-card h3 { margin: 0 0 12px 0; font-size: 1.2rem; color: var(--cor-secundaria); border: none; padding: 0; display: block; padding-right: 0; }
.drop-card p { margin: 4px 0; font-size: 0.9rem; color: var(--cor-texto); line-height: 1.5; }
.drop-card p strong { font-weight: 600; color: var(--cor-texto); }
.drop-card .card-actions { position: static; flex-shrink: 0; display: flex; gap: 8px; }

/* TIMELINE */
.history-timeline { position: relative; padding-left: 30px; border-left: 2px solid var(--cor-borda); }
.timeline-item { position: relative; margin-bottom: 24px; }
.timeline-item:last-child { margin-bottom: 0; }
.timeline-dot { position: absolute; left: -40px; top: 12px; width: 16px; height: 16px; background-color: var(--cor-sucesso); border-radius: 50%; border: 3px solid var(--cor-fundo); }
.timeline-content { position: relative; background-color: var(--cor-surface); border-radius: var(--raio-borda); padding: 16px 20px; border: 1px solid var(--cor-borda); border-left: 4px solid var(--cor-borda); transition: border-left-color 0.3s ease, background-color 0.3s ease; }
.timeline-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 8px; gap: 16px; }
.timeline-header h4 { margin: 0; font-size: 1.1rem; font-weight: 600; color: var(--cor-secundaria); flex-grow: 1; padding-top: 4px; }
.header-right-content { display: flex; align-items: center; gap: 16px; flex-shrink: 0; }
.timeline-header .price { font-size: 1rem; font-weight: 600; color: var(--cor-sucesso); white-space: nowrap; }
.timeline-body { font-size: 0.9rem; color: var(--cor-texto); line-height: 1.6; font-weight: 400; }
.timeline-body strong { font-weight: 600; color: var(--cor-texto); }
.timeline-body em { color: var(--cor-aviso); font-style: normal; font-size: 0.85rem; font-weight: 500; }
.timeline-actions { display: flex; gap: 8px; }

/* ALERTAS */
.alert { padding: 15px 20px; border-radius: var(--raio-borda); margin-bottom: 24px; border: 1px solid transparent; position: relative; font-size: 0.95rem; }
.alert p { margin: 0; }
.alert.success { background-color: #d4edda; border-color: #c3e6cb; color: #155724; }
.alert.error { background-color: #f8d7da; border-color: #f5c6cb; color: #721c24; }
.alert .close-alert { position: absolute; top: 5px; right: 10px; font-size: 1.5rem; font-weight: bold; color: inherit; cursor: pointer; opacity: 0.7; }
.alert .close-alert:hover { opacity: 1; }

/* TABELAS */
.dashboard-table { width: 100%; border-collapse: collapse; }
.dashboard-table th, .dashboard-table td { padding: 12px; text-align: left; vertical-align: middle; }
.dashboard-table thead tr { border-bottom: 2px solid var(--cor-borda); }
.dashboard-table tbody tr { border-bottom: 1px solid var(--cor-borda); }
.dashboard-table tbody tr:last-child { border-bottom: none; }
.dashboard-table .item-name { font-weight: 500; }
.dashboard-table .price-paid { color: var(--cor-sucesso); font-weight: 600; }
.dashboard-table .no-results { padding: 20px; text-align: center; }
.dashboard-table .text-danger { color: var(--cor-alerta); font-weight: 600; }

/* IMPORT / EXPORT */
.import-export-card { background-color: var(--cor-surface); border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); box-shadow: var(--sombra-suave); margin-bottom: 24px; }
.import-export-card .card-header { display: flex; align-items: center; gap: 12px; padding: 16px 24px; border-bottom: 1px solid var(--cor-borda); background-color: #f9fafb; }
.import-export-card .card-header i { font-size: 1.2rem; color: var(--cor-texto-leve); }
.import-export-card .card-header h2, .import-export-card .card-header h3 { margin: 0; font-size: 1.25rem; font-weight: 500; color: var(--cor-secundaria); }
.import-export-card .card-body { padding: 24px; }
.action-group { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--cor-borda); }
.action-group:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: none; }
.action-group h3, .action-group h4 { margin-top: 0; margin-bottom: 8px; font-size: 1.1rem; font-weight: 600; }
.action-group p.description { font-size: 0.9rem; color: var(--cor-texto-leve); margin-top: 0; margin-bottom: 16px; max-width: 600px; line-height: 1.5; }
.action-group form { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.import-export-card.full-sync { border-color: var(--cor-aviso); }
.import-export-card.full-sync .card-header { background-color: #fff8e1; }
.import-export-card.full-sync .card-header h2, .import-export-card.full-sync .card-header i { color: #b08000; }
.individual-sections-container { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }

/* RATEIO COLORS */
.drop-card.rateio-60-40, .timeline-content.rateio-60-40 { border-left-color: var(--cor-60-40); }
.drop-card.rateio-especial, .timeline-content.rateio-especial { border-left-color: var(--cor-especial); }
.drop-card.rateio-especial-2, .timeline-content.rateio-especial-2 { border-left-color: var(--cor-aviso); }
.drop-card.rateio-time, .timeline-content.rateio-time { border-left-color: var(--cor-sucesso); }
.drop-card.rateio-cliente, .timeline-content.rateio-cliente { border-left-color: var(--cor-info); }
.drop-card.com-serviceiro, .timeline-content.com-serviceiro { border-left-color: var(--cor-aviso); background-color: #fffbf0; }
.drop-card.serviceiro-80-20, .timeline-content.serviceiro-80-20 { border-left-color: var(--cor-especial); }

/* DIVISION MODAL */
#division-modal #division-total-value { font-size: 1rem; color: var(--cor-texto-leve); margin-top: -10px; margin-bottom: 20px; }
#division-modal .division-list { background-color: var(--cor-fundo); border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); padding: 10px; font-family: 'Courier New', Courier, monospace; font-size: 0.9rem; line-height: 1.6; }
.division-line { display: flex; justify-content: space-between; align-items: center; padding: 8px; border-bottom: 1px solid var(--cor-borda); }
.division-line:last-child { border-bottom: none; }
.division-line .transfer-text { flex-grow: 1; }

/* CARD LEGEND */
.card-legend { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 24px; padding: 10px 15px; background-color: var(--cor-surface); border-radius: var(--raio-borda); border: 1px solid var(--cor-borda); font-size: 0.85rem; }
.legend-item { display: flex; align-items: center; gap: 8px; color: var(--cor-texto-leve); }
.legend-color-box { width: 15px; height: 15px; border-radius: 4px; border: 1px solid rgba(0,0,0,0.1); }

/* TEAMS LAYOUT */
.teams-and-fila-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 24px; }
.waiting-list-card { background-color: var(--cor-surface); border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); min-height: 300px; display: flex; flex-direction: column; }
.waiting-list-header { padding: 12px 16px; border-bottom: 1px solid var(--cor-borda); }
.waiting-list-header h4 { margin: 0; font-size: 1.1rem; font-weight: 600; color: var(--cor-secundaria); }
.waiting-list-container { padding: 8px; flex-grow: 1; overflow-y: auto; }
.waiting-list-container .empty-list-message { padding: 8px; color: var(--cor-texto-leve); }
.waiting-list { list-style: none; padding: 0; margin: 0; }
.waiting-list-item { display: flex; justify-content: space-between; align-items: center; padding: 12px 8px; border-bottom: 1px solid var(--cor-borda); transition: background-color 0.2s ease; }
.waiting-list-item:last-child { border-bottom: none; }
.waiting-list-item:hover { background-color: #f9fafb; }
.waiting-list-item .char-name { font-weight: 500; color: var(--cor-texto); }
.waiting-list-item .char-info { font-size: 0.85rem; color: var(--cor-texto-leve); text-align: right; }

/* CALCULATOR / CONVERTER */
.calculator-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; margin-top: 24px; }
#tc-converter-container .calculator-card .card-header { padding: 12px 16px; }
#tc-converter-container .calculator-card .card-header h4, #tc-converter-container .calculator-card .card-header h3 { font-size: 1rem; font-weight: 600; }
#tc-converter-container .calculator-card .card-body { padding: 16px; display: flex; flex-direction: column; gap: 12px; flex-grow: 1; }
#tc-converter-container .calculator-card .form-group { margin-bottom: 0; }
#tc-converter-container .calculator-card .form-group label { font-size: 0.85rem; margin-bottom: 6px; color: var(--cor-texto-leve); }
#tc-converter-container .calculator-card .form-group input { font-size: 1.1rem; padding: 10px 12px; margin-bottom: 0; }
.input-field { background-color: #FFF8E1; border-color: #FFECB3; }
.output-field { background-color: #E8F5E9; border-color: #C8E6C9; font-weight: bold; color: #2E7D32; }
.global-settings-card { grid-column: 1 / -1; border-left: 4px solid var(--cor-primaria); }
.save-indicator { margin-left: 10px; color: var(--cor-sucesso); opacity: 0; transition: opacity 0.5s ease; }
.save-indicator.visible { opacity: 1; }

/* AJUSTES GLOBAIS DE ALINHAMENTO */
.dashboard-table .actions-cell { display: flex; align-items: flex-start; gap: 8px; }
.action-buttons-wrapper { display: none; }
.dashboard-table .actions-cell .action-btn { background-color: #f0f2f5; border: 1px solid #d1d5db; color: var(--cor-texto-leve); }
.dashboard-table .actions-cell .action-btn:hover { color: #fff; border-color: transparent; box-shadow: var(--sombra-suave); }
.action-btn.save-role-btn:hover { background-color: var(--cor-primaria); }
.dashboard-table .actions-cell .button.small { width: 32px; height: 32px; border-radius: 50%; padding: 0; font-size: 0; flex-shrink: 0; position: relative; background-color: #f0f2f5; border: 1px solid #d1d5db; color: var(--cor-texto-leve); transition: all 0.2s ease; }
.dashboard-table .actions-cell .button.small:hover { color: #fff; border-color: transparent; transform: translateY(-2px); box-shadow: var(--sombra-suave); }
.dashboard-table .actions-cell .button.small i { font-size: 13px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.dashboard-table .actions-cell .button.small.view-details-btn:hover { background-color: var(--cor-info); }
.dashboard-table .actions-cell .button.small.alert:hover { background-color: var(--cor-alerta); }

/* FILTERS (HISTÓRICO) */
.filters-container { padding: 16px 24px; margin-bottom: 24px; background-color: #f8f9fa; border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); }
.filter-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 24px; }
.filter-form .form-group { margin-bottom: 0; }
.filter-form .form-group label { font-size: 0.85rem; font-weight: 600; color: var(--cor-texto-leve); margin-bottom: 8px; }
.filter-form input, .filter-form select { padding: 8px 12px; font-size: 0.9rem; margin-bottom: 0; }
.filter-group-row { display: flex; align-items: center; gap: 8px; }

/* HEADER FLEX CORRECTIONS */
.card-header-flex { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 12px; }
.card-header-flex .item-drop { margin: 0; padding-right: 0; flex-grow: 1; }

/* ANALYSIS & PERFORMANCE */
.analysis-card { background-color: var(--cor-surface); padding: 24px; border: 1px solid var(--cor-borda) !important; box-shadow: none !important; }
#analysis-form { padding: 0; background: transparent; border: none; margin: 0; }
.filter-top-row { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 16px; margin-bottom: 24px; }
.period-controls { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.date-filter-group { display: flex; gap: 10px; }
.date-filter-group select, .date-filter-group input { margin-bottom: 0; min-width: 150px; }
#analysis-form .filter-actions { display: flex; gap: 10px; flex-shrink: 0; }
.advanced-filter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 24px; }
.filter-column h4 { margin-top: 0; margin-bottom: 12px; font-size: 0.9rem; font-weight: 600; color: var(--cor-secundaria); }
.checkbox-group { max-height: 180px; overflow-y: auto; border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); padding: 12px; background-color: var(--cor-surface); }
.checkbox-group label { display: block; padding: 6px; font-weight: normal; font-size: 0.9rem; cursor: pointer; border-radius: 4px; transition: background-color 0.2s ease; }
.checkbox-group label:hover { background-color: #f4f5f7; }
.checkbox-group input[type="checkbox"] { margin-right: 8px; vertical-align: middle; }
.checkbox-group .select-all-label { font-weight: 600; color: var(--cor-secundaria); padding-bottom: 8px; margin-bottom: 5px; border-bottom: 1px solid var(--cor-borda); }
.filter-instructions { margin-top: 20px; text-align: center; font-size: 0.9rem; color: var(--cor-texto-leve); }
.analysis-summary { padding-top: 24px; margin-top: 24px; border-top: 1px solid var(--cor-borda); }
.analysis-summary h4 { margin: 0; font-size: 1.2rem; font-weight: 500; }

.filter-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; width: 100%; }
.filter-controls .search-wrapper { flex-shrink: 0; }
.quest-filters { display: flex; flex-wrap: wrap; gap: 16px; flex-grow: 1; }
.quest-filter-select { min-width: 200px; flex: 1; margin-bottom: 0 !important; }

.card-info .card-sub-value { font-size: 0.85rem; color: var(--cor-texto-leve); margin-top: 4px; font-weight: 500; line-height: 1.3; }

/* PERFORMANCE TABLE */
.performance-table th, .performance-table td { text-align: right; vertical-align: middle; padding: 8px 12px; }
.performance-table th:first-child, .performance-table .metric-player-name { text-align: left; }
.performance-table th small { font-weight: normal; color: var(--cor-texto-leve); }
.performance-table .metric-label { font-size: 0.85rem; color: var(--cor-texto-leve); padding-right: 20px; }
.performance-table .metric-balance { font-weight: bold; font-size: 1.1rem; }
.player-row-main td { border-top: 2px solid #555; }
.player-row-last td { border-bottom: 1px solid #ccc; }
.text-success { color: var(--cor-sucesso); font-size: 0.8em; font-weight: bold; }
.text-danger { color: var(--cor-alerta); font-size: 0.8em; font-weight: bold; }
.analysis-summary-container { margin-top: 24px; padding: 24px; }
.analysis-summary-container h4 { margin-top: 0; margin-bottom: 16px; font-size: 1.2rem; }
.analysis-summary-container ul { list-style: none; padding-left: 0; }
.analysis-summary-container li { padding: 8px 0; display: flex; align-items: center; gap: 12px; }
.analysis-summary-container li i { width: 20px; text-align: center; }

.solo-details-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 12px 24px; margin-top: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--cor-borda); }
.solo-details-grid div { font-size: 0.95rem; }
.solo-details-grid strong { color: var(--cor-texto-leve); margin-right: 8px; }
.solo-details-blocks { margin-top: 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.solo-details-blocks h4 { margin-top: 0; margin-bottom: 12px; font-size: 1rem; font-weight: 600; color: var(--cor-secundaria); }
.log-block { background-color: var(--cor-fundo); border: 1px solid var(--cor-borda); border-radius: var(--raio-borda); padding: 12px; font-family: 'Courier New', Courier, monospace; font-size: 0.85rem; white-space: pre-wrap; word-break: break-word; max-height: 250px; overflow-y: auto; }

/* COMPONENTS DO DASHBOARD (migrated) */
.dashboard-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 24px;
    margin-bottom: 24px;
}
.card {
    background-color: var(--cor-surface);
    border-radius: var(--raio-borda);
    box-shadow: var(--sombra-suave);
    padding: 24px;
    display: flex;
    align-items: center;
    border: 1px solid var(--cor-borda);
}
.card-icon {
    width: 50px; height: 50px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    margin-right: 20px; flex-shrink: 0;
}
.card-icon i { color: #fff; font-size: 1.5rem; }
.card-icon.clients { background-color: var(--cor-info); }
.card-icon.teams { background-color: var(--cor-sucesso); }
.card-info .card-title {
    font-size: 0.9rem;
    color: var(--cor-texto-leve);
    margin: 0;
    text-transform: uppercase;
}
.card-info .card-value {
    font-size: 2.25rem;
    font-weight: 600;
    color: var(--cor-texto);
    margin: 0;
}
.card-style-container {
    background-color: var(--cor-surface);
    border-radius: var(--raio-borda);
    box-shadow: var(--sombra-suave);
    padding: 24px;
    border: 1px solid var(--cor-borda);
}

