.analytics-dashboard{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:8px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.analytics-dashboard.loading,.analytics-dashboard.error{display:flex;align-items:center;justify-content:center;min-height:400px;color:#666;font-size:16px}.analytics-dashboard.loading .loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.analytics-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e0e0e0;background:linear-gradient(135deg,#f5f7fa,#c3cfe2)}.header-content h2{margin:0 0 5px;font-size:24px;font-weight:600;color:#2c3e50}.header-content .email-subject{margin:0;font-size:14px;color:#666}.header-controls{display:flex;gap:15px;align-items:center}.header-controls .auto-refresh{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;color:#2c3e50}.header-controls .auto-refresh input{cursor:pointer;width:18px;height:18px}.header-controls .refresh-interval{padding:6px 12px;border:1px solid #ddd;border-radius:4px;background:#fff;font-size:14px;cursor:pointer}.header-controls .close-btn{background:none;border:none;font-size:24px;cursor:pointer;color:#2c3e50;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background-color .2s}.header-controls .close-btn:hover{background-color:#0000001a}.analytics-tabs{display:flex;gap:0;border-bottom:2px solid #e0e0e0;background:#f9f9f9;padding:0;overflow-x:auto}.analytics-tabs .tab{flex:0 0 auto;padding:16px 20px;border:none;background:none;cursor:pointer;font-size:14px;font-weight:500;color:#666;border-bottom:3px solid transparent;transition:all .2s;white-space:nowrap}.analytics-tabs .tab:hover{color:#3498db}.analytics-tabs .tab.active{color:#3498db;border-bottom-color:#3498db;background:#fff}.analytics-content{flex:1;overflow-y:auto;padding:20px}.tab-content{display:flex;flex-direction:column;gap:20px}.tab-content.overview .metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px;margin-bottom:20px}.metric-card{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px;border-radius:8px;text-align:center;box-shadow:0 2px 8px #0000001a}.metric-card:nth-child(2){background:linear-gradient(135deg,#f093fb,#f5576c)}.metric-card:nth-child(3){background:linear-gradient(135deg,#4facfe,#00f2fe)}.metric-card:nth-child(4){background:linear-gradient(135deg,#43e97b,#38f9d7)}.metric-label{font-size:12px;font-weight:600;opacity:.9;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.metric-value{font-size:28px;font-weight:700;margin-bottom:5px}.metric-subtitle{font-size:13px;opacity:.85}.read-time-section{background:#f9f9f9;padding:15px;border-radius:8px;border-left:4px solid #3498db}.read-time-section h4{margin:0 0 10px;font-size:14px;color:#2c3e50}.read-time-stats{display:flex;gap:15px}.read-time-stats .stat{display:flex;flex-direction:column;gap:5px}.read-time-stats .stat .label{font-size:12px;color:#666}.read-time-stats .stat .value{font-size:16px;font-weight:600;color:#3498db}.top-links-section{background:#f9f9f9;padding:15px;border-radius:8px;border-left:4px solid #e74c3c}.top-links-section h4{margin:0 0 10px;font-size:14px;color:#2c3e50}.links-list{display:flex;flex-direction:column;gap:10px}.link-item{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#fff;border-radius:4px;border:1px solid #e0e0e0}.link-info{flex:1}.link-text{font-size:14px;font-weight:500;color:#2c3e50;margin-bottom:3px}.link-url{font-size:12px;color:#999;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.link-clicks{font-size:14px;font-weight:600;color:#e74c3c;margin-left:15px;min-width:60px;text-align:right}.real-time-section{background:#f9f9f9;padding:15px;border-radius:8px;border-left:4px solid #2ecc71}.real-time-section h4{margin:0 0 10px;font-size:14px;color:#2c3e50}.recent-interactions{display:flex;flex-direction:column;gap:10px;max-height:300px;overflow-y:auto}.interaction-item{display:flex;align-items:center;gap:10px;padding:10px;background:#fff;border-radius:4px;border:1px solid #e0e0e0;font-size:13px}.interaction-type{font-size:16px;width:24px;text-align:center}.interaction-email{flex:1;font-weight:500;color:#2c3e50}.interaction-device{font-size:12px;color:#999;background:#f0f0f0;padding:3px 8px;border-radius:3px}.interaction-time{font-size:12px;color:#999;white-space:nowrap}.no-data{text-align:center;color:#999;padding:20px;font-size:14px}.opens-header,.clicks-header,.delivery-header{display:flex;gap:20px;padding:10px 0;border-bottom:1px solid #e0e0e0}.opens-header p,.clicks-header p,.delivery-header p{margin:0;font-size:14px;font-weight:500;color:#2c3e50}.opens-list,.clicks-list,.delivery-list{display:flex;flex-direction:column;gap:10px}.open-item,.click-item,.delivery-item{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#f9f9f9;border-radius:6px;border-left:3px solid #3498db;transition:all .2s}.open-item:hover,.click-item:hover{background:#f0f0f0;box-shadow:0 2px 4px #0000000d}.delivery-item.status-delivered{border-left-color:#2ecc71}.delivery-item.status-bounced{border-left-color:#e74c3c}.delivery-item.status-spam{border-left-color:#f39c12}.delivery-item.status-rejected{border-left-color:#c0392b}.open-info,.click-info,.delivery-info{flex:1}.open-email,.click-url,.delivery-email{font-size:14px;font-weight:500;color:#2c3e50;margin-bottom:5px}.open-meta,.click-meta{display:flex;gap:12px;font-size:12px;color:#999}.open-device,.open-browser,.open-location,.click-device,.click-time{background:#fff;padding:3px 8px;border-radius:3px;display:inline-block}.open-time,.click-time,.delivery-time{font-size:12px;color:#999;white-space:nowrap}.click-url{word-break:break-all;max-width:400px}.click-email{font-size:13px;color:#666;margin:5px 0}.delivery-status{margin:5px 0}.badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.badge-delivered{background:#d4edda;color:#155724}.badge-bounced{background:#f8d7da;color:#721c24}.badge-spam{background:#fff3cd;color:#856404}.badge-rejected{background:#f5c6cb;color:#721c24}.delivery-reason{font-size:12px;color:#e74c3c;margin-top:5px}.device-breakdown{background:#f9f9f9;padding:20px;border-radius:8px}.device-breakdown h4{margin:0 0 15px;font-size:14px;color:#2c3e50}.device-stats{display:flex;flex-direction:column;gap:15px}.device-stat{display:flex;align-items:center;gap:15px}.device-name{width:80px;font-size:14px;font-weight:500;color:#2c3e50}.device-bar{flex:1;height:24px;background:#e0e0e0;border-radius:4px;overflow:hidden}.device-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .3s ease}.device-stat:nth-child(2) .device-fill{background:linear-gradient(90deg,#f093fb,#f5576c)}.device-stat:nth-child(3) .device-fill{background:linear-gradient(90deg,#4facfe,#00f2fe)}.device-count{width:80px;text-align:right;font-size:14px;font-weight:600;color:#2c3e50}.geography-list{display:flex;flex-direction:column;gap:12px}.geography-item{display:flex;align-items:center;gap:15px;padding:10px 0}.country-name{width:120px;font-size:14px;font-weight:500;color:#2c3e50}.country-bar{flex:1;height:20px;background:#e0e0e0;border-radius:3px;overflow:hidden}.country-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .3s ease}.country-count{width:60px;text-align:right;font-size:14px;font-weight:600;color:#2c3e50}.pagination{display:flex;justify-content:center;align-items:center;gap:15px;margin-top:20px;padding-top:20px;border-top:1px solid #e0e0e0}.pagination button{padding:8px 16px;border:1px solid #ddd;background:#fff;color:#3498db;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.pagination button:hover:not(:disabled){background:#3498db;color:#fff;border-color:#3498db}.pagination button:disabled{opacity:.5;cursor:not-allowed}.pagination span{font-size:14px;color:#666;font-weight:500}.analytics-content::-webkit-scrollbar{width:8px}.analytics-content::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.analytics-content::-webkit-scrollbar-thumb{background:#ddd;border-radius:4px}.analytics-content::-webkit-scrollbar-thumb:hover{background:#999}@media(max-width:768px){.analytics-header{flex-direction:column;align-items:flex-start;gap:15px}.header-controls{width:100%;flex-wrap:wrap}.analytics-tabs{flex-wrap:wrap}.analytics-tabs .tab{flex:0 0 auto;padding:12px 15px;font-size:12px}.metric-card{padding:15px}.metric-value{font-size:20px}.open-item,.click-item,.delivery-item{flex-direction:column;align-items:flex-start}.open-time,.click-time,.delivery-time{margin-top:10px}.device-stat,.geography-item{flex-direction:column;align-items:flex-start}.device-name,.country-name{width:100%}.device-count,.country-count{width:100%;text-align:left;margin-top:5px}}.report-builder-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.report-builder{background:#fff;border-radius:8px;box-shadow:0 4px 16px #00000026;width:100%;max-width:600px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.report-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e0e0e0;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.report-header h3{margin:0;font-size:20px;font-weight:600}.report-header .close-btn{background:none;border:none;color:#fff;font-size:24px;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background-color .2s}.report-header .close-btn:hover{background-color:#fff3}.report-content{flex:1;overflow-y:auto;padding:20px}.error-message,.success-message{padding:12px 15px;border-radius:6px;margin-bottom:15px;font-size:14px;font-weight:500}.error-message{background:#fee;color:#c33;border:1px solid #fcc;border-left:4px solid #c33}.success-message{background:#efe;color:#3c3;border:1px solid #cfc;border-left:4px solid #3c3}.form-section{margin-bottom:25px}.form-section h4{margin:0 0 15px;font-size:14px;font-weight:600;color:#2c3e50;text-transform:uppercase;letter-spacing:.5px}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:8px;font-size:13px;font-weight:500;color:#2c3e50}.form-control{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;background:#fff;transition:all .2s}.form-control:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-control:disabled{background:#f5f5f5;color:#999;cursor:not-allowed}.form-group-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:15px}.form-subgroup{display:flex;flex-direction:column}.form-subgroup label{margin-bottom:8px}.format-options{display:flex;gap:15px}.radio-option{display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px;color:#2c3e50}.radio-option input[type=radio]{cursor:pointer;width:18px;height:18px;accent-color:#667eea}.checkbox-group{display:flex;flex-direction:column;gap:12px}.checkbox-option{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;color:#2c3e50;padding:10px;border-radius:4px;transition:background-color .2s}.checkbox-option:hover{background-color:#f5f5f5}.checkbox-option input[type=checkbox]{cursor:pointer;width:18px;height:18px;accent-color:#667eea}.report-actions{display:flex;gap:10px;margin-top:20px;padding-top:15px;border-top:1px solid #e0e0e0}.btn{flex:1;padding:10px 16px;border:none;border-radius:4px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;text-transform:uppercase;letter-spacing:.5px}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover:not(:disabled){box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.btn-secondary:hover:not(:disabled){box-shadow:0 4px 12px #f5576c66;transform:translateY(-2px)}.btn-secondary:disabled{opacity:.6;cursor:not-allowed}.btn-cancel{background:#f5f5f5;color:#666;border:1px solid #ddd}.btn-cancel:hover{background:#e0e0e0}.report-footer{padding:15px 20px;background:#f9f9f9;border-top:1px solid #e0e0e0}.footer-tips{font-size:12px;color:#666}.footer-tips p{margin:0 0 8px;font-weight:600}.footer-tips ul{margin:0;padding-left:20px;list-style:disc}.footer-tips li{margin:4px 0;line-height:1.4}.report-content::-webkit-scrollbar{width:8px}.report-content::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.report-content::-webkit-scrollbar-thumb{background:#ddd;border-radius:4px}.report-content::-webkit-scrollbar-thumb:hover{background:#999}@media(max-width:600px){.report-builder-overlay{padding:10px}.report-builder{max-width:100%}.report-header{padding:16px}.report-header h3{font-size:18px}.report-content{padding:16px}.form-group-row{grid-template-columns:1fr}.format-options{flex-direction:column;gap:10px}.report-actions{flex-direction:column}.btn,.report-footer{padding:12px 16px}.footer-tips{font-size:11px}}@media(max-width:480px){.report-header{padding:12px}.report-header h3{font-size:16px}.report-content{padding:12px}.form-section h4,.form-group label{font-size:12px}.form-control,.checkbox-option,.radio-option{font-size:13px}.btn{font-size:12px;padding:10px 12px}}
