/* OS Corretor - Rocha Intelligence */
:root {
  --primary: #4f46e5; --primary-dark: #4338ca; --primary-light: #eef2ff;
  --gray-50: #f8fafc; --gray-100: #f1f5f9; --gray-200: #e2e8f0; --gray-300: #cbd5e1;
  --gray-400: #94a3b8; --gray-500: #64748b; --gray-600: #475569; --gray-700: #334155;
  --gray-800: #1e293b; --gray-900: #0f172a;
  --green: #059669; --red: #dc2626; --orange: #d97706; --blue: #2563eb; --purple: #7c3aed;
  --radius: 12px; --shadow: 0 4px 24px rgba(0,0,0,.06);
  --sidebar-w: 260px;
}

* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,system-ui,'Segoe UI',Roboto,sans-serif; background:var(--gray-50); color:var(--gray-800); line-height:1.5; }
a { color:var(--primary); text-decoration:none; }

/* BUTTONS */
.btn { display:inline-flex; align-items:center; gap:.4rem; padding:.55rem 1.1rem; border:none; border-radius:8px; font-size:.82rem; font-weight:600; cursor:pointer; transition:all .15s; }
.btn:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.1); }
.btn-primary { background:var(--primary); color:#fff; }
.btn-gradient { background:linear-gradient(135deg,var(--primary),var(--purple)); color:#fff; }
.btn-ghost { background:transparent; color:var(--gray-600); border:1px solid var(--gray-200); }
.btn-dark { background:var(--gray-800); color:#fff; }
.btn-green { background:var(--green); color:#fff; }
.btn-red { background:var(--red); color:#fff; }
.btn-sm { padding:.4rem .7rem; font-size:.75rem; }
.btn-lg { padding:.75rem 1.5rem; font-size:.9rem; }
.btn-full { width:100%; justify-content:center; }
.btn-icon { background:none; border:none; cursor:pointer; padding:.4rem; color:var(--gray-500); font-size:1rem; }

/* LOGIN */
.login-wrapper { min-height:100vh; display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,#0f172a 0%,#1e1b4b 50%,#312e81 100%); position:relative; overflow:hidden; }
.login-bg-effect { position:absolute; inset:0; background:radial-gradient(circle at 30% 50%,rgba(79,70,229,.15),transparent 50%),radial-gradient(circle at 70% 80%,rgba(124,58,237,.1),transparent 40%); }
.login-card { background:rgba(255,255,255,.97); border-radius:20px; padding:2.5rem; width:100%; max-width:400px; box-shadow:0 20px 60px rgba(0,0,0,.3); position:relative; z-index:1; }
.login-brand { text-align:center; margin-bottom:2rem; }
.brand-icon { width:56px; height:56px; border-radius:14px; background:linear-gradient(135deg,var(--primary),var(--purple)); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin:0 auto .75rem; }
.login-brand h1 { font-size:1.5rem; color:var(--gray-900); }
.brand-sub { font-size:.85rem; color:var(--gray-500); margin-top:.2rem; }
.input-group { position:relative; margin-bottom:1rem; }
.input-group i { position:absolute; left:1rem; top:50%; transform:translateY(-50%); color:var(--gray-400); font-size:.85rem; }
.input-group input { width:100%; padding:.8rem 1rem .8rem 2.5rem; border:1.5px solid var(--gray-200); border-radius:10px; font-size:.9rem; transition:border .2s; }
.input-group input:focus { outline:none; border-color:var(--primary); }
.msg-erro { color:var(--red); font-size:.8rem; text-align:center; margin-top:.75rem; min-height:1.2rem; }
.login-footer { text-align:center; margin-top:1.5rem; font-size:.75rem; color:var(--gray-400); }
.powered { display:block; margin-top:.5rem; }

/* APP LAYOUT */
.app-layout { display:flex; min-height:100vh; }

/* SIDEBAR */
.sidebar { width:var(--sidebar-w); background:var(--gray-900); color:#fff; display:flex; flex-direction:column; position:fixed; top:0; left:0; bottom:0; z-index:100; transition:transform .3s; }
.sidebar-brand { padding:1.25rem 1.5rem; display:flex; align-items:center; gap:.75rem; border-bottom:1px solid rgba(255,255,255,.08); }
.brand-mark { width:36px; height:36px; border-radius:10px; background:linear-gradient(135deg,var(--primary),var(--purple)); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1rem; }
.brand-name { font-weight:700; font-size:1.05rem; }
.sidebar-nav { flex:1; padding:1rem 0; overflow-y:auto; }
.nav-link { display:flex; align-items:center; gap:.75rem; padding:.7rem 1.5rem; color:var(--gray-400); font-size:.85rem; transition:all .15s; }
.nav-link:hover { color:#fff; background:rgba(255,255,255,.05); }
.nav-link.active { color:#fff; background:rgba(79,70,229,.3); border-right:3px solid var(--primary); }
.nav-link i { width:20px; text-align:center; }
.nav-divider { height:1px; background:rgba(255,255,255,.06); margin:.75rem 1.5rem; }
.sidebar-user { padding:1rem 1.5rem; border-top:1px solid rgba(255,255,255,.08); display:flex; align-items:center; gap:.75rem; }
.user-avatar { width:34px; height:34px; border-radius:50%; background:var(--primary); display:flex; align-items:center; justify-content:center; color:#fff; font-size:.75rem; }
.user-details { flex:1; }
.user-name { display:block; font-size:.8rem; font-weight:600; color:#fff; }
.user-role { display:block; font-size:.7rem; color:var(--gray-400); text-transform:uppercase; }
.sidebar-overlay { display:none; }

/* MAIN */
.main { flex:1; margin-left:var(--sidebar-w); display:flex; flex-direction:column; }
.topbar { display:flex; align-items:center; gap:1rem; padding:.75rem 1.5rem; background:#fff; border-bottom:1px solid var(--gray-200); position:sticky; top:0; z-index:50; }
.topbar-logo { height:32px; border-radius:6px; }
.topbar h2 { font-size:1.1rem; white-space:nowrap; }
.search-wrapper { position:relative; flex:1; max-width:400px; margin-left:auto; }
.search-wrapper i { position:absolute; left:.8rem; top:50%; transform:translateY(-50%); color:var(--gray-400); font-size:.8rem; }
.search-wrapper input { width:100%; padding:.5rem .8rem .5rem 2.2rem; border:1.5px solid var(--gray-200); border-radius:8px; font-size:.8rem; }
.search-wrapper input:focus { outline:none; border-color:var(--primary); }
.search-results { position:absolute; top:100%; left:0; right:0; background:#fff; border:1px solid var(--gray-200); border-radius:8px; box-shadow:var(--shadow); display:none; max-height:300px; overflow-y:auto; z-index:999; }
.search-results.active { display:block; }
.empresa-badge { font-size:.75rem; background:var(--primary-light); color:var(--primary); padding:.3rem .8rem; border-radius:20px; font-weight:600; white-space:nowrap; }
.content { flex:1; padding:1.5rem; }
.page { display:none; }
.page.active { display:block; }
.app-footer { text-align:center; padding:1rem; border-top:1px solid var(--gray-200); font-size:.75rem; color:var(--gray-400); }

/* CARDS & STATS */
.card { background:#fff; border-radius:var(--radius); padding:1.5rem; box-shadow:var(--shadow); }
.form-card { padding:1.5rem; }
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1rem; }
.stat-card { background:#fff; border-radius:var(--radius); padding:1.25rem; display:flex; align-items:center; gap:1rem; box-shadow:var(--shadow); }
.stat-icon { width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; }
.stat-icon.blue { background:#dbeafe; color:#2563eb; }
.stat-icon.green { background:#dcfce7; color:#16a34a; }
.stat-icon.purple { background:#ede9fe; color:#7c3aed; }
.stat-icon.orange { background:#fef3c7; color:#d97706; }
.stat-num { display:block; font-size:1.5rem; font-weight:700; color:var(--gray-800); }
.stat-label { font-size:.75rem; color:var(--gray-500); }
.grid-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1rem; }

/* FORMS */
.grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:.75rem; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; }
.grid-4 { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:.75rem; }
.field { display:flex; flex-direction:column; }
.field label { font-size:.72rem; font-weight:600; color:var(--gray-600); margin-bottom:.25rem; text-transform:uppercase; letter-spacing:.02em; }
.field input, .field select, .field textarea { padding:.55rem .75rem; border:1.5px solid var(--gray-200); border-radius:8px; font-size:.85rem; transition:border .2s; }
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color:var(--primary); }
.form-btns { display:flex; gap:.75rem; margin-top:1.25rem; }
.hint { font-size:.78rem; color:var(--gray-500); margin-bottom:.75rem; }
.page-actions { display:flex; gap:.75rem; margin-bottom:1rem; flex-wrap:wrap; }
.filters-bar { display:flex; gap:.5rem; margin-bottom:1rem; flex-wrap:wrap; align-items:center; }
.filter-input { padding:.45rem .7rem; border:1.5px solid var(--gray-200); border-radius:8px; font-size:.8rem; }
.filter-input:focus { outline:none; border-color:var(--primary); }
.span-3 { grid-column:span 3; }

/* LOGO UPLOAD */
.logo-upload-area { display:flex; align-items:center; gap:1rem; }
.logo-preview { width:120px; height:80px; border:2px dashed var(--gray-200); border-radius:8px; display:flex; align-items:center; justify-content:center; cursor:pointer; overflow:hidden; }
.logo-preview img { max-width:100%; max-height:100%; object-fit:contain; }
#logo-placeholder { text-align:center; color:var(--gray-400); font-size:.75rem; }
#logo-placeholder i { display:block; font-size:1.5rem; margin-bottom:.3rem; }

/* PROPOSTA CARDS */
.proposta-card { background:#fff; border-radius:var(--radius); padding:1.25rem; box-shadow:var(--shadow); border-left:4px solid var(--primary); margin-bottom:1rem; }
.proposta-top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:.75rem; }
.proposta-id { font-weight:700; color:var(--primary); font-size:.85rem; }
.proposta-badge { padding:.2rem .6rem; border-radius:12px; font-size:.7rem; font-weight:600; color:#fff; }
.b-pendente { background:#f59e0b; }
.b-em_analise { background:#3b82f6; }
.b-aprovada { background:#10b981; }
.b-contrato { background:#8b5cf6; }
.b-concluida { background:#059669; }
.b-recusada { background:#ef4444; }
.b-cancelada { background:#6b7280; }
.proposta-grid { display:grid; grid-template-columns:1fr 1fr; gap:.3rem; font-size:.8rem; color:var(--gray-600); margin-bottom:.75rem; }
.proposta-grid i { color:var(--gray-400); margin-right:.3rem; width:14px; }
.proposta-actions { display:flex; gap:.5rem; flex-wrap:wrap; }

/* IMOVEL CARDS */
.imovel-card { background:#fff; border-radius:var(--radius); padding:1.25rem; box-shadow:var(--shadow); position:relative; }
.imovel-card .imovel-status { position:absolute; top:.75rem; right:.75rem; padding:.2rem .5rem; border-radius:8px; font-size:.65rem; font-weight:600; text-transform:uppercase; }
.imovel-card .imovel-status.disponivel { background:#dcfce7; color:#16a34a; }
.imovel-card .imovel-status.reservado { background:#fef3c7; color:#d97706; }
.imovel-card .imovel-status.vendido { background:#fee2e2; color:#dc2626; }
.imovel-card .imovel-status.locado { background:#dbeafe; color:#2563eb; }
.imovel-card h4 { font-size:.9rem; margin-bottom:.5rem; color:var(--gray-800); padding-right:5rem; }
.imovel-card .imovel-info { font-size:.78rem; color:var(--gray-500); margin-bottom:.5rem; }
.imovel-card .imovel-details { display:flex; gap:.75rem; font-size:.75rem; color:var(--gray-600); margin-bottom:.75rem; flex-wrap:wrap; }
.imovel-card .imovel-details span i { margin-right:.2rem; color:var(--gray-400); }
.imovel-card .imovel-valor { font-size:1rem; font-weight:700; color:var(--primary); }
.imovel-card .imovel-actions { display:flex; gap:.5rem; margin-top:.75rem; }

/* CLIENTE CARDS */
.cliente-card { background:#fff; border-radius:var(--radius); padding:1.25rem; box-shadow:var(--shadow); }
.cliente-card h4 { font-size:.9rem; margin-bottom:.3rem; }
.cliente-card .cliente-info { font-size:.78rem; color:var(--gray-500); margin-bottom:.5rem; line-height:1.6; }
.cliente-card .cliente-actions { display:flex; gap:.5rem; }

/* CORRETOR CARDS */
.corretor-card { background:#fff; border-radius:var(--radius); padding:1.25rem; box-shadow:var(--shadow); }
.corretor-card h4 { font-size:.9rem; margin-bottom:.3rem; }
.corretor-card .corretor-info { font-size:.78rem; color:var(--gray-500); line-height:1.6; }

/* SPREADSHEET */
.spreadsheet-container { overflow:auto; max-height:500px; border:1px solid var(--gray-200); border-radius:8px; }
.spreadsheet-container table { border-collapse:collapse; width:100%; }
.spreadsheet-container th { background:var(--gray-100); padding:.4rem .6rem; font-size:.72rem; font-weight:600; color:var(--gray-600); border:1px solid var(--gray-200); text-align:center; position:sticky; top:0; z-index:1; min-width:100px; }
.spreadsheet-container td { padding:0; border:1px solid var(--gray-200); min-width:100px; height:30px; }
.spreadsheet-container td input { width:100%; height:100%; border:none; padding:.3rem .5rem; font-size:.8rem; background:transparent; }
.spreadsheet-container td input:focus { outline:2px solid var(--primary); outline-offset:-2px; background:#fff; }
.spreadsheet-container td.active { outline:2px solid var(--primary); outline-offset:-2px; }
.spreadsheet-container .row-num { background:var(--gray-100); text-align:center; font-size:.7rem; color:var(--gray-500); font-weight:600; width:40px; min-width:40px; padding:.3rem; }
.spreadsheet-toolbar { background:var(--gray-50); padding:.5rem; border-radius:8px; }

/* TIMELINE */
.timeline-list { position:relative; padding-left:1.5rem; }
.timeline-list::before { content:''; position:absolute; left:.5rem; top:0; bottom:0; width:2px; background:var(--gray-200); }
.tl-item { position:relative; margin-bottom:1.25rem; }
.tl-item::before { content:''; position:absolute; left:-1rem; top:.4rem; width:10px; height:10px; background:var(--primary); border-radius:50%; border:2px solid #fff; box-shadow:0 0 0 2px var(--primary); }
.tl-item .tl-date { font-size:.7rem; color:var(--gray-400); }
.tl-item .tl-desc { font-size:.85rem; color:var(--gray-700); margin-top:.15rem; }

/* PLANILHA MENU CARDS */
.planilha-menu-card { background:#fff; border-radius:var(--radius); padding:1.25rem; box-shadow:var(--shadow); cursor:pointer; transition:all .15s; }
.planilha-menu-card:hover { transform:translateY(-2px); box-shadow:0 8px 30px rgba(0,0,0,.1); }
.planilha-menu-card h4 { font-size:.9rem; margin-bottom:.3rem; }
.planilha-menu-card .meta { font-size:.72rem; color:var(--gray-400); }

/* TOAST */
.toast { position:fixed; bottom:2rem; right:2rem; padding:.75rem 1.25rem; border-radius:10px; font-size:.85rem; font-weight:500; color:#fff; z-index:9999; animation:slideIn .3s; }
.toast.ok { background:var(--green); }
.toast.err { background:var(--red); }
.toast.inf { background:var(--blue); }
@keyframes slideIn { from { transform:translateY(20px); opacity:0; } to { transform:translateY(0); opacity:1; } }

/* MOBILE */
.mobile-only { display:none; }
@media(max-width:768px) {
  .sidebar { transform:translateX(-100%); }
  .sidebar.open { transform:translateX(0); }
  .sidebar-overlay { display:block; position:fixed; inset:0; background:rgba(0,0,0,.4); z-index:90; opacity:0; pointer-events:none; transition:opacity .3s; }
  .sidebar-overlay.active { opacity:1; pointer-events:auto; }
  .main { margin-left:0; }
  .mobile-only { display:inline-flex; }
  .stats-grid { grid-template-columns:1fr 1fr; }
  .grid-3, .grid-4 { grid-template-columns:1fr; }
  .grid-2 { grid-template-columns:1fr; }
  .topbar h2 { font-size:.9rem; }
  .search-wrapper { display:none; }
}
@media(max-width:480px) {
  .stats-grid { grid-template-columns:1fr; }
  .grid-cards { grid-template-columns:1fr; }
}

/* MODAL */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; z-index:9000; padding:1rem; }
.modal-box { background:#fff; border-radius:16px; padding:2rem; max-width:900px; width:100%; max-height:90vh; overflow-y:auto; position:relative; }
.modal-wide { max-width:800px; }
.modal-x { position:absolute; top:1rem; right:1rem; background:none; border:none; font-size:1.5rem; cursor:pointer; color:var(--gray-500); }
.modal-actions { display:flex; gap:.75rem; margin-top:1.5rem; justify-content:center; }

/* PRINT */
@media print {
  body * { visibility:hidden; }
  #modal-relatorio, #modal-relatorio * { visibility:visible; }
  #modal-relatorio { position:absolute; left:0; top:0; width:100%; }
  .modal-overlay { position:absolute; background:#fff; }
  .modal-x, .modal-actions, .sidebar, .topbar, .app-footer { display:none !important; }
}

/* IMOVEL FOTOS */
.imovel-fotos-grid { display:flex; gap:.4rem; flex-wrap:wrap; margin-top:.5rem; }
.imovel-fotos-grid img { width:80px; height:60px; object-fit:cover; border-radius:6px; border:1px solid var(--gray-200); }
.imovel-foto-thumb { width:60px; height:45px; object-fit:cover; border-radius:4px; border:1px solid var(--gray-200); }

/* RELATORIO PRINT */
.relatorio-header { text-align:center; margin-bottom:1.5rem; }
.relatorio-header img { max-height:50px; margin-bottom:.5rem; }
.relatorio-header h2 { font-size:1.3rem; color:var(--gray-800); margin-bottom:.2rem; }
.relatorio-section { margin-bottom:1.25rem; }
.relatorio-section h3 { font-size:.9rem; color:var(--primary); border-bottom:2px solid var(--primary-light); padding-bottom:.3rem; margin-bottom:.75rem; }
.relatorio-grid { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; font-size:.85rem; }
.relatorio-grid .item { padding:.3rem 0; }
.relatorio-grid .item label { font-weight:600; color:var(--gray-600); font-size:.75rem; display:block; }
.relatorio-grid .item span { color:var(--gray-800); }
.relatorio-status { display:inline-block; padding:.3rem .8rem; border-radius:12px; font-weight:600; font-size:.8rem; color:#fff; margin:.5rem 0; }
.relatorio-fotos { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.5rem; }
.relatorio-fotos img { width:120px; height:90px; object-fit:cover; border-radius:8px; }

/* INPUT FILE STYLING */
.input-file { padding:.4rem; font-size:.8rem; }

/* MOBILE ENHANCEMENTS - iOS & Android */
@media(max-width:768px) {
  .content { padding:1rem .75rem; }
  .page-actions { flex-wrap:wrap; }
  .page-actions .btn { flex:1; min-width:120px; justify-content:center; }
  .filters-bar { flex-direction:column; }
  .filter-input { width:100%; }
  .proposta-card { padding:1rem; }
  .proposta-grid { grid-template-columns:1fr; }
  .proposta-actions { flex-wrap:wrap; }
  .proposta-actions .btn { flex:1; min-width:80px; justify-content:center; font-size:.72rem; padding:.5rem .4rem; }
  .imovel-card { padding:1rem; }
  .imovel-actions { flex-wrap:wrap; }
  .imovel-actions .btn { flex:1; justify-content:center; }
  .cliente-card { padding:1rem; }
  .cliente-actions { flex-wrap:wrap; }
  .modal-box { padding:1.25rem; margin:.5rem; max-height:95vh; }
  .relatorio-grid { grid-template-columns:1fr; }
  .relatorio-fotos img { width:80px; height:60px; }
  .stat-card { padding:.75rem; }
  .stat-num { font-size:1.2rem; }
  .topbar { padding:.5rem .75rem; }
  .btn { padding:.5rem .8rem; font-size:.78rem; }
  .btn-lg { padding:.65rem 1rem; }
  .form-card { padding:1rem; }
  .grid-4 { grid-template-columns:1fr 1fr; }
  .field label { font-size:.68rem; }
  .field input, .field select, .field textarea { font-size:.85rem; padding:.5rem .6rem; }
  /* Touch targets */
  .nav-link { padding:.85rem 1.5rem; }
  .btn-icon { padding:.6rem; font-size:1.1rem; }
  /* Timeline box */
  #timeline-box { margin-top:1rem; }
  /* Spreadsheet */
  .spreadsheet-container { max-height:350px; }
  .spreadsheet-container th, .spreadsheet-container td { min-width:80px; }
}

@media(max-width:380px) {
  .grid-4 { grid-template-columns:1fr; }
  .grid-3 { grid-template-columns:1fr; }
  .proposta-actions .btn span { display:none; }
  .imovel-actions .btn { font-size:.7rem; }
}

/* iOS safe area */
@supports(padding-bottom: env(safe-area-inset-bottom)) {
  .sidebar-user { padding-bottom:calc(1rem + env(safe-area-inset-bottom)); }
  .app-footer { padding-bottom:calc(1rem + env(safe-area-inset-bottom)); }
}

/* Touch highlight */
.btn { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
.nav-link { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
