/* =====================================================================
   Site do Negócio — estilos da tela `site_negocio.php` e das parciais de
   `template/site_negocio/` (reutilizadas pelo wizard de onboarding).
   ===================================================================== */

.preset-card { cursor: pointer; border: 2px solid var(--bs-border-color); border-radius: .75rem; overflow: hidden; transition: all .15s; }
.preset-card:hover { transform: translateY(-2px); box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.08); }
.preset-card.selecionado { border-color: var(--bs-primary); box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), .2); }
.preset-amostra { height: 86px; display: flex; align-items: center; justify-content: center; }
.preset-amostra .titulo-demo { font-weight: 700; font-size: 1rem; }
.seg-btn { cursor: pointer; border: 2px solid var(--bs-border-color); border-radius: .75rem; transition: all .15s; }
.seg-btn:hover, .seg-btn.ativo { border-color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .05); }
.foto-mini { width: 92px; height: 92px; object-fit: cover; border-radius: .5rem; }
.foto-wrap { position: relative; display: inline-block; }
.foto-wrap .btn-remover { position: absolute; top: -6px; right: -6px; }
#previewFrame { width: 100%; height: 640px; border: 1px solid var(--bs-border-color); border-radius: .75rem; background: #fff; }
.cor-input { width: 44px; height: 38px; padding: 2px; }
.chat-ia { max-height: 260px; overflow-y: auto; }
.chat-ia .msg { border-radius: .75rem; padding: .5rem .9rem; margin-bottom: .5rem; max-width: 90%; }
.chat-ia .msg.eu { background: rgba(var(--bs-primary-rgb), .1); margin-left: auto; }
.chat-ia .msg.ia { background: var(--bs-gray-100); }
[data-bs-theme="dark"] .chat-ia .msg.ia { background: var(--bs-gray-200); }

/* Gerador de logo com IA */
.logo-estilo-card { cursor: pointer; border: 2px solid var(--bs-border-color); border-radius: .6rem; overflow: hidden; transition: all .15s; background: #fff; }
.logo-estilo-card:hover { border-color: var(--bs-primary); transform: translateY(-1px); }
.logo-estilo-card.selecionado { border-color: var(--bs-primary); box-shadow: 0 0 0 3px rgba(var(--bs-primary-rgb), .2); }
.logo-estilo-img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.logo-estilo-auto { display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #6366f1, #a855f7 55%, #ec4899); }
.logo-estilo-rotulo { text-align: center; font-size: .72rem; font-weight: 600; padding: .3rem 0; background: var(--bs-body-bg); border-top: 1px solid var(--bs-border-color); }
/* display via classe (não usar d-flex aqui: o !important do Bootstrap impede o .hide() do jQuery) */
.logo-preview-caixa { min-height: 420px; border: 1px dashed var(--bs-border-color); border-radius: .75rem; background: var(--bs-body-bg); display: flex; flex-direction: column; align-items: center; justify-content: center; }
#logoIaPreviewCaixa { min-height: 340px; border: 1px solid var(--bs-border-color); border-radius: .75rem; background-color: #fff; padding: 12px; display: flex; align-items: center; justify-content: center; }
#logoIaImg { max-width: 100%; max-height: 380px; }
.logo-preview-xadrez { background-image: linear-gradient(45deg, #dcdcdc 25%, transparent 25%), linear-gradient(-45deg, #dcdcdc 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #dcdcdc 75%), linear-gradient(-45deg, transparent 75%, #dcdcdc 75%); background-size: 18px 18px; background-position: 0 0, 0 9px, 9px -9px, -9px 0; }
.logo-hist-mini { width: 54px; height: 54px; object-fit: contain; background: #fff; border: 1px solid var(--bs-border-color); border-radius: .5rem; cursor: pointer; padding: 2px; flex: 0 0 auto; }
.logo-hist-mini:hover { border-color: var(--bs-primary); }
#logoIaToggle .btn.active { background-color: var(--bs-gray-300); font-weight: 600; }