@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Montserrat,Inter,Arial,sans-serif;background:#f7f9fa;color:#222}.app{display:flex;min-height:100vh;background:#f7f9fa}.sidebar-modern{width:240px;background:#fff;border-radius:24px;margin:24px 16px 24px 24px;box-shadow:0 4px 24px #5ad6ba14,0 1.5px 6px #00000008;display:flex;flex-direction:column;align-items:center;padding:32px 0 16px;position:relative}.sidebar-logo-wrap{margin-bottom:32px}.sidebar-logo-modern{width:48px;height:48px;border-radius:12px;box-shadow:0 2px 8px #5ad6ba1f}.sidebar-nav-modern{flex:1;width:100%;display:flex;flex-direction:column;gap:8px}.sidebar-nav-item{background:none;border:none;outline:none;color:#888;font-size:1.1rem;font-weight:500;display:flex;align-items:center;gap:14px;padding:14px 32px;border-radius:12px;cursor:pointer;transition:background .15s,color .15s}.sidebar-nav-item.active,.sidebar-nav-item:hover{background:#e6faf6;color:#5ad6ba;font-weight:600}.sidebar-bottom-modern{display:flex;align-items:center;gap:18px;margin-top:32px}.sidebar-avatar{font-size:2rem;color:#5ad6ba;background:#e6faf6;border-radius:50%;padding:6px}.sidebar-settings{font-size:1.4rem;color:#bbb;cursor:pointer;transition:color .2s}.sidebar-settings:hover{color:#5ad6ba}.sidebar-logout-btn{background:none;border:none;color:#bbb;font-size:1.4rem;cursor:pointer;margin-left:8px;transition:color .2s;padding:0 4px}.sidebar-logout-btn:hover{color:#e74c3c}.main-content{flex:1;padding:40px 40px 40px 0;display:flex;flex-direction:column;gap:32px}.card{background:#fff;border-radius:18px;box-shadow:0 2px 12px #5ad6ba12;padding:28px 32px;margin-bottom:24px}button,input{font-family:inherit}.home-page{height:100%;display:flex;align-items:center;justify-content:center;padding:40px}.home-content{text-align:center;max-width:800px}.home-content h1{font-size:48px;color:#212529;margin-bottom:16px;font-weight:700}.home-content>p{font-size:20px;color:#6c757d;margin-bottom:48px;line-height:1.6}.feature-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;margin-top:40px}.feature-card{background-color:#fff;padding:32px 24px;border-radius:12px;border:1px solid #e9ecef;box-shadow:0 2px 8px #0000001a;transition:transform .2s ease,box-shadow .2s ease}.feature-card:hover{transform:translateY(-4px);box-shadow:0 4px 16px #00000026}.feature-card h3{font-size:20px;color:#212529;margin-bottom:12px;font-weight:600}.feature-card p{color:#6c757d;line-height:1.5}.chat-page{display:flex;height:100vh;min-height:0;background-color:#f7f9fa}.conversations-sidebar{width:320px;border-right:1px solid #c8d2dc;background-color:#fff;display:flex;flex-direction:column;height:100vh;min-height:0;overflow-y:auto}.chat-main{flex:1;background-color:#fff;display:flex;flex-direction:column;height:100vh;min-height:0;overflow-y:auto}.chat-placeholder{flex:1;display:flex;align-items:center;justify-content:center;background-color:#f8f9fa}.placeholder-content{text-align:center;color:#6c757d}.placeholder-content h2{font-size:24px;margin-bottom:8px;color:#495057}.placeholder-content p{font-size:16px}.conversations-list{display:flex;flex-direction:column;height:100%}.conversations-header{padding:20px 20px 0;display:flex;justify-content:space-between;align-items:center}.conversations-header h3{font-size:18px;color:#212529;font-weight:600}.conversation-count{background-color:#e9ecef;color:#6c757d;padding:4px 8px;border-radius:12px;font-size:12px;font-weight:500}.conversations-content{flex:1;overflow-y:auto}.conversation-item{padding:16px 20px;border-bottom:1px solid #f1f3f4;cursor:pointer;transition:background-color .2s ease;display:flex;justify-content:space-between;align-items:center}.conversation-item:hover{background-color:#f8f9fa}.conversation-item.selected{background-color:#e3fde9;border-right:3px solid #19d27c}.conversation-info{flex:1;min-width:0}.phone-number{font-weight:600;color:#212529;margin-bottom:4px;font-size:14px}.last-message{color:#6c757d;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.unread-badge{background-color:#dc3545;color:#fff;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;flex-shrink:0}.loading-state,.error-state,.empty-state{padding:40px 20px;text-align:center;color:#6c757d}.retry-button{background-color:#007bff;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;margin-top:12px}.retry-button:hover{background-color:#0056b3}.chat-window{width:100%;display:flex;flex-direction:column;height:100%}.chat-header{padding:20px;border-bottom:1px solid #e9ecef;background-color:#f8f9fa;display:flex;justify-content:space-between;align-items:center}.chat-header h3{font-size:18px;color:#212529;font-weight:600}.message-count{background-color:#e9ecef;color:#6c757d;padding:4px 8px;border-radius:12px;font-size:12px;font-weight:500}.chat-messages{flex:1;overflow-y:auto;padding:20px;background-color:#f8f9fa}.message{margin-bottom:16px;max-width:70%}.message.human{margin-left:auto}.message.ai{margin-right:auto}.message-content{background-color:#fff;padding:12px 16px;border-radius:18px;box-shadow:0 1px 2px #0000001a;word-wrap:break-word;line-height:1.4}.message.human .message-content{background-color:#007bff;color:#fff}.message.ai .message-content{background-color:#fff;color:#212529}.message-meta{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:11px;color:#6c757d}.message.human .message-meta{justify-content:flex-end}.message-type{text-transform:uppercase;font-weight:500}.unread-indicator{color:#dc3545;font-weight:700}.conversations-search{padding:12px 20px 8px;background:#fff;border-bottom:1px solid #f1f3f4}.conversations-search input{width:100%;padding:8px 12px;border:1px solid #e9ecef;border-radius:8px;font-size:14px;background:#f8f9fa;color:#212529;outline:none;transition:border .2s}.conversations-search input:focus{border:1.5px solid #19d27c;background:#fff}.chat-input-bar{display:flex;align-items:center;padding:16px 20px;border-top:1px solid #e9ecef;background:#fff;gap:12px}.chat-input-bar input{flex:1;padding:10px 14px;border:1px solid #e9ecef;border-radius:18px;font-size:15px;background:#f8f9fa;color:#212529;outline:none;transition:border .2s}.chat-input-bar input:disabled{background:#f1f3f4;color:#adb5bd}.chat-input-bar input:focus{border:1.5px solid #19d27c;background:#fff}.chat-input-bar button{background:#19d27c;color:#fff;border:none;border-radius:18px;padding:10px 22px;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s}.chat-input-bar button:disabled{background:#e9ecef;color:#adb5bd;cursor:not-allowed}.mark-read-btn{background:#f8f9fa;color:#19d27c;border:1px solid #19d27c;border-radius:8px;padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer;transition:background .2s,color .2s}.mark-read-btn:disabled{background:#f1f3f4;color:#adb5bd;border-color:#e9ecef;cursor:not-allowed}.metrics-page{height:100%;display:flex;flex-direction:column;background-color:#f8f9fa}.metrics-header{background-color:#fff;padding:24px;border-bottom:1px solid #e9ecef;box-shadow:0 2px 4px #0000001a}.metrics-header h1{font-size:28px;color:#212529;margin-bottom:20px;font-weight:700}.metrics-controls{display:flex;flex-direction:column;gap:20px}.metrics-controls-row{display:flex;gap:32px;align-items:flex-end;flex-wrap:wrap}.date-controls{display:flex;gap:16px;align-items:flex-end}.date-input-group{display:flex;flex-direction:column;gap:4px}.date-input-group label{font-size:14px;color:#495057;font-weight:500}.date-input{padding:8px 12px;border:1px solid #e9ecef;border-radius:6px;font-size:14px;background:#fff;color:#212529;outline:none;transition:border .2s}.date-input:focus{border:1.5px solid #19d27c}.visualization-controls{display:flex;flex-direction:column;gap:8px}.visualization-controls label{font-size:14px;color:#495057;font-weight:500}.visualization-buttons{display:flex;gap:8px}.viz-button{padding:8px 16px;border:1px solid #e9ecef;background:#fff;color:#6c757d;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s}.viz-button:hover{background:#f8f9fa;border-color:#19d27c;color:#19d27c}.viz-button.active{background:#19d27c;border-color:#19d27c;color:#fff}.origin-controls{display:flex;flex-direction:column;gap:8px}.origin-controls label{font-size:14px;color:#495057;font-weight:500}.origin-buttons{display:flex;gap:8px;flex-wrap:wrap}.origin-button{padding:8px 16px;border:1px solid #e9ecef;background:#fff;color:#6c757d;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s}.origin-button:hover{background:#f8f9fa;border-color:#19d27c;color:#19d27c}.origin-button.active{background:#19d27c;border-color:#19d27c;color:#fff}.entry-message-control{display:flex;flex-direction:column;gap:6px;flex:1;min-width:300px}.entry-message-control label{font-size:14px;font-weight:500;color:#495057}.entry-message-input{padding:8px 12px;border:1px solid #dee2e6;border-radius:6px;font-size:14px;font-family:inherit;transition:border-color .2s ease;min-width:250px}.entry-message-input:focus{outline:none;border-color:#19d27c;box-shadow:0 0 0 3px #19d27c1a}.quick-filters{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-top:12px;width:100%}.quick-filter-label{font-size:12px;color:#6c757d;font-weight:500;margin-right:4px}.quick-filter-btn{padding:8px 12px;border:1px solid #dee2e6;background:#fff;color:#495057;border-radius:6px;font-size:12px;cursor:pointer;transition:all .2s ease;white-space:normal;text-align:left;max-width:300px;min-height:40px;line-height:1.3}.quick-filter-btn:hover{background:#f8f9fa;border-color:#19d27c;color:#19d27c}.quick-filter-btn.clear{color:#dc3545;border-color:#dc3545}.quick-filter-btn.clear:hover{background:#f8d7da;color:#dc3545}.quick-filter-dropdown{position:relative;display:inline-block}.quick-filter-dropdown-btn{padding:8px 16px;border:1px solid #dee2e6;background:#fff;color:#495057;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px;min-width:180px;justify-content:space-between}.quick-filter-dropdown-btn:hover{background:#f8f9fa;border-color:#19d27c;color:#19d27c}.dropdown-arrow{font-size:12px;transition:transform .2s ease}.dropdown-arrow.open{transform:rotate(180deg)}.quick-filter-dropdown-menu{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid #dee2e6;border-radius:6px;box-shadow:0 4px 12px #00000026;z-index:1000;margin-top:4px;overflow:hidden;min-width:400px;max-width:600px}.quick-filter-dropdown-item{width:100%;padding:12px 16px;border:none;background:#fff;color:#495057;font-size:13px;cursor:pointer;transition:background-color .2s ease;text-align:left;border-bottom:1px solid #f1f3f4;white-space:normal;line-height:1.4;word-wrap:break-word}.quick-filter-dropdown-item:last-child{border-bottom:none}.quick-filter-dropdown-item:hover{background:#f8f9fa;color:#19d27c}.quick-filter-dropdown-item.clear{color:#dc3545;font-weight:500}.quick-filter-dropdown-item.clear:hover{background:#f8d7da;color:#dc3545}.cohort-info{margin-bottom:16px;padding:12px 16px;background-color:#f8f9fa;border-radius:8px;border-left:4px solid #19d27c}.cohort-info p{margin:0;color:#495057;font-size:14px}.metrics-content{flex:1;padding:24px;overflow-y:auto}.loading{text-align:center;padding:40px;color:#6c757d;font-size:16px}.error{text-align:center;padding:40px;color:#dc3545;font-size:16px;background:#f8d7da;border:1px solid #f5c6cb;border-radius:8px;margin:20px 0}.no-data{text-align:center;padding:40px;color:#6c757d;font-size:16px}.metrics-table-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;border:1px solid #e9ecef;overflow:hidden}.metrics-table{width:100%;border-collapse:collapse;font-size:14px}.metrics-table thead{background-color:#f8f9fa;border-bottom:2px solid #e9ecef}.metrics-table th{padding:16px 12px;text-align:left;font-weight:600;color:#495057;font-size:13px;text-transform:uppercase;letter-spacing:.5px;border:1px solid #e9ecef}.metrics-table tbody tr{border-bottom:1px solid #f1f3f4;transition:background-color .2s}.metrics-table tbody tr:hover{background-color:#f8f9fa}.metrics-table tbody tr:last-child{border-bottom:none}.metrics-table td{padding:12px;color:#212529;border:1px solid #e9ecef}.date-cell{font-weight:600;color:#495057;min-width:100px}.metric-cell{text-align:center;font-weight:500;min-width:60px}.cohort-placeholder{text-align:center;padding:60px 20px;color:#6c757d;font-size:16px;background:#fff;border-radius:12px;border:2px dashed #e9ecef}.payments-page{height:100%;display:flex;flex-direction:column;background-color:#f8f9fa}.payments-header{background-color:#fff;padding:24px;border-bottom:1px solid #e9ecef;box-shadow:0 2px 4px #0000001a}.payments-header h1{font-size:28px;color:#212529;margin-bottom:20px;font-weight:700}.payments-controls{display:flex;gap:32px;align-items:flex-end;flex-wrap:wrap}.payments-content{flex:1;padding:24px;overflow-y:auto}.payments-table-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;border:1px solid #e9ecef;overflow:hidden}.payments-table{width:100%;border-collapse:collapse;font-size:14px}.payments-table thead{background-color:#f8f9fa;border-bottom:2px solid #e9ecef}.payments-table th{padding:16px 12px;text-align:center;font-weight:600;color:#495057;font-size:13px;text-transform:uppercase;letter-spacing:.5px;border:1px solid #e9ecef}.payments-table tbody tr{border-bottom:1px solid #f1f3f4;transition:background-color .2s}.payments-table tbody tr:hover{background-color:#f8f9fa}.payments-table tbody tr:last-child{border-bottom:none}.payments-table td{padding:12px;color:#212529;text-align:center;border:1px solid #e9ecef}.currency-cell{text-align:center;font-weight:500;font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;min-width:100px}.total-cell{font-weight:600;color:#19d27c;background-color:#f8fff9}.total-revenue-summary{background:#fff;border-radius:12px;padding:20px;margin-bottom:20px;box-shadow:0 2px 8px #0000001a;border:1px solid #e9ecef;display:flex;justify-content:space-between;align-items:center}.total-revenue-label{font-size:18px;font-weight:600;color:#495057}.total-revenue-amount{font-size:24px;font-weight:700;color:#19d27c;font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace}.dashboard-home{display:flex;flex-direction:column;gap:36px}.dashboard-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:28px}.dashboard-stat-card{background:#fff;border-radius:18px;box-shadow:0 2px 12px #5ad6ba12;padding:28px 24px 22px;display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0}.dashboard-stat-icon{font-size:2.1rem;color:#5ad6ba;margin-bottom:6px}.dashboard-stat-label{font-size:1.05rem;color:#888;font-weight:500}.dashboard-stat-value{font-size:1.5rem;font-weight:700;color:#222}.dashboard-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:32px}.dashboard-chart-card{background:#fff;border-radius:18px;box-shadow:0 2px 12px #5ad6ba12;padding:28px 24px 22px;display:flex;flex-direction:column;gap:18px;min-width:0}.dashboard-chart-card h3{font-size:1.15rem;font-weight:600;color:#222;margin-bottom:8px}@media (max-width: 900px){.dashboard-charts{grid-template-columns:1fr}.dashboard-stats{grid-template-columns:1fr 1fr}}@media (max-width: 600px){.dashboard-stats{grid-template-columns:1fr}}.login-bg{min-height:100vh;background:linear-gradient(120deg,#e6faf6,#f7f9fa);display:flex;align-items:center;justify-content:center}.login-card{background:#fff;border-radius:24px;box-shadow:0 4px 32px #5ad6ba21,0 1.5px 6px #00000008;padding:48px 36px 36px;display:flex;flex-direction:column;align-items:center;min-width:340px;max-width:90vw}.login-logo{width:56px;height:56px;margin-bottom:18px;border-radius:14px;box-shadow:0 2px 8px #5ad6ba1f}.login-card h2{font-size:1.7rem;font-weight:700;color:#222;margin-bottom:28px;letter-spacing:-1px}.login-input-group{display:flex;align-items:center;background:#f7f9fa;border-radius:12px;margin-bottom:18px;padding:0 14px;width:100%;box-shadow:0 1px 3px #5ad6ba0a}.login-input-icon{color:#5ad6ba;font-size:1.1rem;margin-right:10px}.login-input-group input{border:none;background:transparent;outline:none;font-size:1.08rem;padding:14px 0;width:100%;color:#222}.login-btn{width:100%;background:#5ad6ba;color:#fff;border:none;border-radius:12px;padding:14px 0;font-size:1.1rem;font-weight:600;margin-top:8px;cursor:pointer;box-shadow:0 2px 8px #5ad6ba1a;transition:background .18s}.login-btn:hover,.login-btn:focus{background:#44c7a7}.login-error{color:#e74c3c;margin-top:16px;font-size:1rem;text-align:center}
