/* Loomah Membros — Frontend */

.lm-container { max-width: 800px; margin: 0 auto; padding: 20px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }

/* Seções */
.lm-section { margin-bottom: 30px; padding-bottom: 24px; border-bottom: 1px solid #eee; }
.lm-section h3 { margin-top: 0; margin-bottom: 20px; font-size: 18px; color: #333; }

/* Layout */
.lm-row { display: flex; gap: 16px; margin-bottom: 12px; }
.lm-group { flex: 1; }
.lm-group.lm-full { flex: 0 0 100%; }
.lm-group.lm-small { flex: 0 0 150px; }
.lm-group.lm-grow { flex: 2; }

.lm-group label { display: block; font-weight: 600; margin-bottom: 5px; font-size: 14px; color: #333; }
.lm-group input,
.lm-group select,
.lm-group textarea { width: 100%; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 15px; box-sizing: border-box; }
.lm-group textarea { resize: vertical; }
.lm-group small { display: block; font-size: 12px; color: #777; margin-top: 4px; }

.lm-req { color: #d63638; }

/* Checkboxes */
.lm-checks {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 8px;
    margin-top: 8px;
}
.lm-check {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    font-weight: normal;
    cursor: pointer;
    font-size: 14px;
    line-height: 1.4;
}
.lm-check input[type="checkbox"] {
    width: 15px;
    height: 15px;
    min-width: 15px;
    margin: 2px 0 0;
    cursor: pointer;
    flex-shrink: 0;
}

/* Botão submit */
.lm-submit { margin-top: 20px; }
.lm-btn-submit { background: #2271b1; color: #fff; border: none; padding: 12px 28px; border-radius: 4px; font-size: 16px; cursor: pointer; transition: background .2s; }
.lm-btn-submit:hover { background: #135e96; }
.lm-btn-submit:disabled { opacity: .6; cursor: not-allowed; }

/* Aviso de e-mail duplicado */
.lm-aviso-email { background: #fff3cd; border: 1px solid #ffc107; border-radius: 4px; padding: 12px 16px; margin-top: 8px; font-size: 14px; }
.lm-aviso-email button { margin: 0 4px; padding: 4px 12px; border-radius: 3px; cursor: pointer; border: 1px solid #ccc; font-size: 13px; }
.lm-aviso-email .lm-btn-sim { background: #4caf50; color: #fff; border-color: #4caf50; }

/* Mensagem de sucesso */
.lm-sucesso { text-align: center; padding: 40px 20px; }
.lm-sucesso h3 { color: #4caf50; font-size: 22px; margin: 16px 0 8px; }
.lm-sucesso p { color: #555; font-size: 15px; }

/* SVG animado de sucesso */
.lm-check { width: 72px; height: 72px; display: block; margin: 0 auto; stroke: #4caf50; stroke-width: 2; stroke-miterlimit: 10; fill: none; }
.lm-check-circle { stroke-dasharray: 166; stroke-dashoffset: 166; animation: lm-stroke .6s cubic-bezier(.65,0,.45,1) forwards; }
.lm-check-mark { stroke-dasharray: 48; stroke-dashoffset: 48; animation: lm-stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards; }
@keyframes lm-stroke { 100% { stroke-dashoffset: 0; } }

/* Busca */
.lm-busca .lm-row { align-items: flex-end; }
.lm-resultados { margin-top: 20px; }
.lm-resultado-item { background: #f8f9fa; border-radius: 4px; padding: 16px; margin-bottom: 12px; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.lm-resultado-item p { margin: 4px 0; font-size: 14px; }
.lm-codigo-destaque { font-family: monospace; font-size: 16px; font-weight: 700; background: #e8f4fd; color: #1e5799; padding: 2px 8px; border-radius: 3px; }
.lm-carregando { color: #777; font-style: italic; }
.lm-erro { color: #dc3545; background: #f8d7da; padding: 10px 14px; border-radius: 4px; }

/* Formulário de busca inline */
.lm-form-busca .lm-row { flex-wrap: wrap; }
.lm-form-busca .lm-btn-submit { width: 100%; }

@media (max-width: 640px) {
    .lm-row { flex-direction: column; gap: 0; }
    .lm-group.lm-small,
    .lm-group.lm-grow { flex: 1; }
}

/* Rodapé Loomah/Veronikas */
.lm-rodape {
    margin-top: 24px;
    padding-top: 12px;
    border-top: 1px solid #eee;
    text-align: center;
    font-size: 11px;
    color: #aaa;
    display: flex;
    justify-content: center;
    gap: 8px;
}
.lm-rodape a { color: #aaa; text-decoration: none; }
.lm-rodape a:hover { color: #666; }
.lm-rodape strong { color: #888; }

/* Habilidades fix */
.lm-habilidades-grupo { display: flex; flex-direction: column; gap: 14px; margin-top: 8px; }
.lm-hab-categoria { border-left: 3px solid #e0e0e0; padding-left: 12px; }
.lm-hab-categoria .lm-checks { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.lm-hab-categoria .lm-check { flex: 0 0 auto; white-space: nowrap; }

/* Formulário de cadastro */
.lm-cadastro { max-width: 760px; }
.lm-secao { margin-bottom: 32px; }
.lm-secao-titulo {
    font-size: 16px; font-weight: 700; color: #1d2327;
    border-bottom: 2px solid var(--lm-primaria, #2271b1);
    padding-bottom: 6px; margin-bottom: 16px;
}
.lm-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}
.lm-form-grid.lm-grid-3 { grid-template-columns: 1fr 1fr 1fr; }
.lm-group { display: flex; flex-direction: column; gap: 5px; }
.lm-group.lm-full { grid-column: 1 / -1; }
.lm-col-2 { grid-column: span 2; }
.lm-group label { font-size: 13px; font-weight: 600; color: #333; }
.lm-group input,
.lm-group select,
.lm-group textarea {
    padding: 9px 11px;
    border: 1px solid #ccc;
    border-radius: var(--lm-radius, 4px);
    font-size: 14px;
    width: 100%;
    box-sizing: border-box;
    font-family: var(--lm-fonte, inherit);
}
.lm-group input:focus,
.lm-group select:focus,
.lm-group textarea:focus {
    border-color: var(--lm-primaria, #2271b1);
    outline: none;
    box-shadow: 0 0 0 2px rgba(34,113,177,.15);
}
.lm-req { color: #d63638; }
.lm-hint { font-size: 12px; color: #888; margin-top: 4px; }
.lm-erros {
    background: #fef0f0; border: 1px solid #dc3232;
    border-radius: 4px; padding: 12px 16px; margin-bottom: 20px;
}
.lm-erros ul { margin: 6px 0 0 16px; padding: 0; }
.lm-erros li { font-size: 13px; color: #58151c; }
.lm-submit { margin-top: 24px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.lm-btn-submit {
    background: var(--lm-primaria, #2271b1);
    color: #fff; border: none;
    padding: 12px 28px;
    border-radius: var(--lm-radius, 4px);
    font-size: 15px; font-weight: 600;
    cursor: pointer; transition: background .2s;
}
.lm-btn-submit:hover { background: var(--lm-secundaria, #135e96); }

/* Habilidades no frontend */
.lm-hab-titulo {
    display: block;
    font-size: 12px; text-transform: uppercase;
    letter-spacing: .4px; color: #666;
    font-weight: 700; margin-bottom: 6px;
}

@media (max-width: 600px) {
    .lm-form-grid,
    .lm-form-grid.lm-grid-3 { grid-template-columns: 1fr; }
    .lm-col-2, .lm-full { grid-column: 1 / -1; }
}