:root { --primary: #635bff; --bg: #f5f7fc; --dark: #162139; --muted: #7c879b; }
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, 'Segoe UI', Arial, sans-serif; background: var(--bg); color: var(--dark); }
a { color: var(--primary); text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
.auth-wrap { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; }
.auth-art { padding: clamp(35px, 6vw, 90px); background: radial-gradient(circle at 90% 20%, #4c467b, transparent 48%), linear-gradient(135deg, #141c34, #2e3262); color: white; display: flex; flex-direction: column; justify-content: center; }
.brand { font-size: 27px; font-weight: 800; letter-spacing: -1px; color: inherit; }
.auth-art h1 { font-size: clamp(36px, 4vw, 58px); margin: 65px 0 12px; }
.auth-art p { color: #b9c3dc; line-height: 1.8; max-width: 430px; }
.art-bubbles { font-size: 80px; color: #a6a3ff; padding: 50px 0; }
.auth-card { margin: auto; width: min(440px, 90%); padding: 35px; background: #fff; border: 1px solid #e6eaf2; border-radius: 20px; box-shadow: 0 18px 65px #151c3210; }
.auth-card h2 { font-size: 30px; margin: 14px 0; }
.auth-card p, .panel p { font-size: 13px; color: var(--muted); line-height: 1.7; }
.pill { font-size: 11px; letter-spacing: 1px; color: #6c64dc; font-weight: 800; }
.auth-card form, .setting-form { display: flex; flex-direction: column; gap: 15px; margin: 20px 0; }
.auth-card label, .setting-form label { font-size: 13px; font-weight: 650; display: flex; flex-direction: column; gap: 8px; }
.auth-card input, .setting-form input { padding: 13px; border-radius: 10px; border: 1px solid #dce2ef; width: 100%; }
.auth-card button, .setting-form button { border: 0; padding: 14px; color: white; border-radius: 11px; background: var(--primary); font-weight: 750; }
.auth-card > a { font-size: 13px; }
.password-wrap { display: flex; align-items: center; justify-content: center; min-height: 100vh; }
.alert { padding: 14px; border-radius: 10px; background: #fff0f0; color: #aa3844; margin: 15px 0; font-size: 13px; }
.success { background: #e4f8f0; color: #107856; padding: 15px; border-radius: 10px; margin-bottom: 20px; }
.logout .muted-button { background: #fff0f2; color: #ae344e; width: 100%; }
.workspace { display: flex; min-height: 100vh; }
.workspace-nav { position: sticky; top: 0; height: 100vh; width: 250px; flex-shrink: 0; background: #162139; display: flex; flex-direction: column; padding: 27px 18px; gap: 12px; color: white; }
.workspace-nav a:not(.brand) { color: #c4cedf; padding: 12px; border-radius: 10px; font-size: 13px; }
.workspace-nav a:hover { background: #2b3751; }
.nav-label { font-size: 11px; color: #8491aa; margin-top: 36px; letter-spacing: 1px; }
.workspace-nav .logout { margin-top: auto; }
.workspace-body { flex: 1; min-width: 0; }
.workspace-head { height: 75px; background: white; border-bottom: 1px solid #e5eaf2; padding: 20px 30px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.workspace-head span { font-size: 13px; color: var(--muted); }
.workspace-body main { padding: 30px; max-width: 1450px; margin: auto; }
.welcome { padding: 38px; border-radius: 20px; background: linear-gradient(125deg, #1c2945, #41418b); color: white; }
.welcome h1 { font-size: clamp(24px, 3vw, 34px); }
.welcome p { color: #c8d0e6; line-height: 1.7; max-width: 670px; }
.tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin: 25px 0; }
.tiles article { padding: 24px; border: 1px solid #e2e7f1; background: white; border-radius: 16px; display: flex; flex-direction: column; gap: 13px; font-size: 23px; }
.tiles strong { font-size: 17px; }
.tiles small { font-size: 12px; color: var(--muted); }
.panel { margin: 22px 0; padding: 25px; border-radius: 16px; border: 1px solid #e3e8f1; background: white; }
.panel h2 { font-size: 19px; margin: 0 0 7px; }
.setting-form { max-width: 520px; }
.invoice { display: flex; justify-content: space-between; gap: 15px; padding: 14px 0; border-bottom: 1px solid #eef0f6; font-size: 13px; }
@media (max-width: 820px) { .auth-wrap { grid-template-columns: 1fr; } .auth-art { display: none; } .auth-card { margin: 70px auto; } .workspace { flex-direction: column; } .workspace-nav { position: static; width: auto; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; } .workspace-nav .nav-label { display: none; } .workspace-nav .logout { margin: 0 0 0 auto; } .workspace-body main { padding: 18px; } .tiles { grid-template-columns: 1fr; } .workspace-head { padding: 15px; } }

/* BlogAI v9: faturas e Pix Asaas na área empresarial */
.loja-asaas-charge { border:1px solid #e5eaf3; border-radius:12px; padding:18px; display:grid; gap:8px; margin:12px 0; background:#fbfcff; overflow-wrap:anywhere; }
.loja-asaas-charge strong, .loja-asaas-charge small, .loja-asaas-charge a { display:block; }
.loja-asaas-charge small { color:#6e7d96; }
.loja-asaas-charge a { color:#5953d6; font-weight:650; }
.loja-asaas-charge summary { cursor:pointer; font-weight:600; padding:10px 0; }
.loja-asaas-charge textarea { width:100%; resize:vertical; padding:12px; border:1px solid #dce3ef; border-radius:9px; }
.loja-asaas-charge img { max-width:100%; height:auto; display:block; margin:10px 0; }

/* BLOGAI V11 - Navegação reutilizável da loja */
.brand-glyph { display: inline-grid; place-items:center; width:36px; height:36px; border-radius:11px; background:#635bff; color:white; margin-right:5px; }
.workspace-nav .brand span:not(.brand-glyph) { color:#aaa7ff; }
.workspace-nav a.active { background:#393665; color:white; font-weight:700; }
.workspace-head-title { display:flex; flex-direction:column; gap:3px; min-width:0; }
.workspace-head-title small { color:#635bff; letter-spacing:1.3px; font-size:10px; font-weight:800; }
.workspace-head-title strong { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.loja-menu-toggle { display:none; width:40px; height:40px; flex-shrink:0; border:1px solid #dce2ef; border-radius:10px; background:#fff; color:#1c2945; font-size:20px; }
.loja-sidebar-overlay { display:none; }
.loja-integration-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin-top:20px; }
.loja-integration-links a { padding:18px; display:flex; flex-direction:column; gap:9px; border:1px solid #e5eaf3; border-radius:12px; color:#27324c; font-weight:700; }
.loja-integration-links a:hover { border-color:#8580ed; background:#f8f7ff; }
.loja-integration-links span { color:#6e7c94; font-weight:400; font-size:12px; }
@media (max-width: 820px) {
    .workspace { flex-direction:row; }
    .workspace-nav { position:fixed; top:0; left:0; z-index:120; width:min(290px,84vw); height:100dvh; flex-direction:column; flex-wrap:nowrap; align-items:stretch; transform:translateX(-105%); transition:transform .24s ease; overflow-y:auto; }
    .workspace-nav .nav-label { display:block; }
    .workspace-nav .logout { margin-top:auto; margin-left:0; }
    .workspace-nav.is-open { transform:translateX(0); }
    .loja-sidebar-overlay.is-open { display:block; position:fixed; inset:0; z-index:110; background:rgba(12,22,40,.58); }
    .loja-menu-toggle { display:grid; place-items:center; }
    .workspace-head-user { display:none; }
    .workspace-body { width:100%; }
    .loja-integration-links { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) { .workspace-nav { transition:none; } }
/* BLOGAI V12 - Aparência isolada por empresa e sidebar recolhível */
body { --loja-header-bg:#FFFFFF; --loja-sidebar-bg:#162139; --loja-header-text:#172033; --loja-sidebar-text:#D5E0F1; --loja-page-bg:#F5F7FC; background:var(--loja-page-bg); }
.workspace-nav { background:var(--loja-sidebar-bg); color:var(--loja-sidebar-text); transition:width .22s ease,transform .22s ease; }
.workspace-nav a:not(.brand), .workspace-nav .nav-label, .workspace-nav .brand { color:var(--loja-sidebar-text); }
.workspace-head { background:var(--loja-header-bg); color:var(--loja-header-text); }
.workspace-head-title small, .workspace-head span, .workspace-head .workspace-head-profile { color:var(--loja-header-text); }
.loja-menu-toggle { display:grid; place-items:center; background:transparent; color:var(--loja-header-text); border-color:currentColor; }
.workspace-head-profile { display:flex; align-items:center; gap:11px; max-width:46%; min-width:0; }
.loja-avatar { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; border-radius:14px; overflow:hidden; background:#E8E7FF; font-size:22px; }
.loja-avatar img { width:100%; height:100%; object-fit:cover; }
.loja-profile-name { display:flex; flex-direction:column; min-width:0; gap:4px; }
.loja-profile-name strong, .loja-profile-name small { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.loja-profile-name small { opacity:.75; font-size:11px; }
.loja-nav-icon { display:inline-flex; justify-content:center; align-items:center; width:24px; height:25px; flex-shrink:0; font-size:20px; }
.workspace-nav a:not(.brand) { display:flex; align-items:center; gap:12px; }
.workspace-nav .brand { display:flex; align-items:center; white-space:nowrap; }
.workspace-nav .logout button { width:100%; display:flex; align-items:center; gap:12px; padding:12px; background:transparent; border:0; color:var(--loja-sidebar-text); text-align:left; border-radius:10px; }
.loja-nav-spacer { flex:1; }
.loja-sidebar-collapsed .workspace-nav { width:78px; padding-left:13px; padding-right:13px; }
.loja-sidebar-collapsed .workspace-nav .loja-nav-label, .loja-sidebar-collapsed .workspace-nav .nav-label { display:none; }
.loja-sidebar-collapsed .workspace-nav .brand, .loja-sidebar-collapsed .workspace-nav a:not(.brand), .loja-sidebar-collapsed .workspace-nav .logout button { justify-content:center; }
.loja-sidebar-collapsed .workspace-nav .brand-glyph { margin:0; }
.loja-sidebar-collapsed .workspace-nav .logout { margin-top:auto; }
.loja-profile-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.loja-field { display:flex; flex-direction:column; gap:8px; font-size:13px; font-weight:650; }
.loja-field input, .loja-field select, .loja-field textarea { display:block; width:100%; min-width:0; padding:12px; border:1px solid #DCE2EF; border-radius:10px; background:white; color:#1F2B40; font:inherit; }
.loja-field input[type=color] { padding:4px; height:49px; cursor:pointer; }
.loja-profile-logo { display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin:16px 0; }
.loja-profile-logo img { width:110px; height:110px; object-fit:contain; background:#F8FAFF; border:1px solid #E2E6F1; border-radius:16px; }
.loja-button { display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border:0; border-radius:10px; background:#635BFF; color:white; font-weight:700; cursor:pointer; margin-top:16px; }
.loja-button.danger { background:#FFF0F0; color:#A62739; }
.loja-settings-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:22px; }
.loja-settings-card { display:flex; flex-direction:column; gap:11px; padding:23px; background:white; color:#172033; border:1px solid #E4E9F3; border-radius:17px; }
.loja-settings-card .symbol { font-size:30px; }
.loja-settings-card strong { font-size:16px; }
.loja-settings-card p { margin:0; }
.loja-invoice-search { display:flex; align-items:end; gap:12px; flex-wrap:wrap; margin:20px 0; }
.loja-pagination { display:flex; align-items:center; justify-content:center; gap:10px; margin:18px 0; font-size:13px; }
.loja-pagination a { padding:9px 13px; border:1px solid #CDD4E4; border-radius:9px; }
.loja-agent-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
.loja-agent-card { border:1px solid #E2E8F1; background:white; padding:21px; border-radius:17px; }
.loja-agent-card h3 { margin:12px 0 6px; }
.loja-agent-icon { display:grid; place-items:center; width:48px; height:48px; border-radius:15px; background:#EEEDFF; font-size:25px; }
.loja-agent-resources { display:grid; gap:12px; margin-top:20px; }
.loja-agent-resource { display:grid; grid-template-columns:100px 1fr 1fr 1.3fr; gap:9px; align-items:end; padding:12px; border:1px solid #E8EDF5; border-radius:12px; }
@media (max-width: 980px) { .loja-settings-grid,.loja-agent-list { grid-template-columns:repeat(2,minmax(0,1fr)); } .loja-agent-resource { grid-template-columns:1fr 1fr; } }
@media (max-width:820px) { .workspace-nav { width:min(290px,84vw) !important; } .loja-sidebar-collapsed .workspace-nav .loja-nav-label { display:inline; } .loja-sidebar-collapsed .workspace-nav .nav-label { display:block; } .workspace-head-profile { max-width:44px; } .loja-profile-name { display:none; } .workspace-head { gap:12px; } .loja-settings-grid,.loja-agent-list { grid-template-columns:1fr; } }
@media (max-width:600px) { .loja-profile-grid,.loja-agent-resource { grid-template-columns:1fr; } .workspace-body main { padding:15px; } }

.workspace-nav a.active { color:var(--loja-sidebar-text) !important; }