*{margin:0;padding:0;box-sizing:border-box}:root{--color-primary: #007bff;--color-primary-hover: #0056b3;--color-secondary: #6c757d;--color-success: #28a745;--color-danger: #dc3545;--color-warning: #ff9800;--color-info: #17a2b8;--status-open-bg: #d1ecf1;--status-open-text: #0c5460;--status-pending-bg: #fff3cd;--status-pending-text: #856404;--status-resolved-bg: #d4edda;--status-resolved-text: #155724;--status-closed-bg: #f8d7da;--status-closed-text: #721c24;--status-new-bg: #d1ecf1;--status-new-text: #0c5460;--status-sent-bg: #d4edda;--status-sent-text: #155724;--bg-primary: #ffffff;--bg-secondary: #f8f9fa;--bg-tertiary: #e9ecef;--text-primary: #333;--text-secondary: #666;--text-tertiary: #999;--border-color: #dee2e6;--border-color-light: #e9ecef;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1);--shadow-md: 0 2px 8px rgba(0, 0, 0, .1);--shadow-lg: 0 4px 12px rgba(0, 0, 0, .15);--transition-fast: .2s;--transition-normal: .3s}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:var(--bg-secondary);color:var(--text-primary);line-height:1.6;transition:background-color var(--transition-normal) ease,color var(--transition-normal) ease}body.dark-theme{--bg-primary: #1f2937;--bg-secondary: #111827;--bg-tertiary: #0f172a;--text-primary: #f9fafb;--text-secondary: #9ca3af;--text-tertiary: #6b7280;--border-color: #374151;--border-color-light: #4b5563;background-color:var(--bg-secondary);color:var(--text-primary)}body.dark-theme .card{background-color:var(--bg-primary);color:var(--text-primary);border-color:var(--border-color)}body.dark-theme input,body.dark-theme textarea{background-color:var(--bg-primary);border-color:var(--border-color);color:var(--text-primary)}body.dark-theme input:focus,body.dark-theme textarea:focus{border-color:var(--color-primary)}body.dark-theme button{background-color:var(--color-primary)}body.dark-theme button:hover{background-color:var(--color-primary-hover)}.container{max-width:1200px;margin:0 auto;padding:var(--spacing-md)}.page-content{padding:var(--spacing-xl);background-color:var(--bg-secondary)}body.dark-theme .page-content{background-color:var(--bg-secondary)}.page-header{margin-bottom:var(--spacing-xl)}.page-header h1{margin:0 0 var(--spacing-xs) 0;font-size:28px;color:var(--text-primary)}.page-header .subtitle{color:var(--text-secondary);margin:0;font-size:14px}.card{background:var(--bg-primary);border-radius:var(--radius-lg);padding:var(--spacing-lg);margin:var(--spacing-md) 0;box-shadow:var(--shadow-md);border:1px solid var(--border-color)}.btn-primary{padding:10px 20px;background-color:var(--color-primary);color:#fff;border:none;border-radius:var(--radius-md);font-size:14px;font-weight:500;cursor:pointer;transition:background-color var(--transition-fast);white-space:nowrap}.btn-primary:hover:not(:disabled){background-color:var(--color-primary-hover)}.btn-primary:disabled{background-color:#ccc;cursor:not-allowed}.btn-secondary{padding:10px 20px;background-color:transparent;color:var(--color-primary);border:2px solid var(--color-primary);border-radius:var(--radius-md);font-size:14px;font-weight:500;cursor:pointer;transition:all var(--transition-fast);white-space:nowrap}.btn-secondary:hover:not(:disabled){background-color:var(--color-primary);color:#fff}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.status-badge{padding:4px 12px;border-radius:var(--radius-xl);font-size:12px;font-weight:600;text-transform:capitalize;display:inline-block}.status-badge.status-open,.status-badge.status-new{background-color:var(--status-open-bg);color:var(--status-open-text)}.status-badge.status-pending{background-color:var(--status-pending-bg);color:var(--status-pending-text)}.status-badge.status-resolved,.status-badge.status-sent{background-color:var(--status-resolved-bg);color:var(--status-resolved-text)}.status-badge.status-closed{background-color:var(--status-closed-bg);color:var(--status-closed-text)}.form-group{margin-bottom:var(--spacing-md)}.form-group label{display:block;margin-bottom:var(--spacing-xs);font-weight:500;color:var(--text-primary);font-size:14px}.form-control{width:100%;padding:12px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:14px;box-sizing:border-box;background-color:var(--bg-primary);color:var(--text-primary);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.form-control:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #007bff1a}.form-control[readonly]{background-color:var(--bg-secondary);cursor:not-allowed}.form-text{display:block;margin-top:6px;font-size:12px;color:var(--text-secondary)}.error-text{display:block;margin-top:4px;font-size:12px;color:var(--color-danger)}.loading{text-align:center;padding:var(--spacing-xl);color:var(--text-secondary)}.error,.error-alert,.error-message{padding:var(--spacing-md);background-color:#f8d7da;color:#721c24;border:1px solid #f5c6cb;border-radius:var(--radius-md);margin-bottom:var(--spacing-md);text-align:center}body.dark-theme .error,body.dark-theme .error-alert,body.dark-theme .error-message{background-color:#721c24;color:#f8d7da;border-color:#842029}.success-message{margin-top:var(--spacing-md);padding:12px;background-color:#d4edda;color:#155724;border-radius:var(--radius-md);font-size:14px}body.dark-theme .success-message{background-color:#155724;color:#d4edda}.empty-state{text-align:center;padding:60px var(--spacing-md);background:var(--bg-primary);border-radius:var(--radius-lg);border:1px solid var(--border-color)}.empty-icon{font-size:64px;margin-bottom:var(--spacing-md)}.empty-state h3{margin:0 0 10px;color:var(--text-primary);font-size:20px}.empty-state p{margin:0;color:var(--text-secondary);font-size:14px}.tickets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--spacing-md)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--spacing-md);margin-bottom:var(--spacing-xl)}@media (max-width: 768px){.stats-grid{grid-template-columns:repeat(2,1fr)}.tickets-grid{grid-template-columns:1fr}.page-content{padding:var(--spacing-md)}}.ticket-card{background-color:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--spacing-md);box-shadow:var(--shadow-sm);transition:box-shadow var(--transition-fast)}.ticket-card:hover{box-shadow:var(--shadow-lg)}body.dark-theme .ticket-card{background-color:var(--bg-primary);border-color:var(--border-color)}.ticket-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.ticket-time{font-size:12px;color:var(--text-secondary)}.ticket-subject{margin:0 0 15px;font-size:16px;font-weight:600;color:var(--text-primary)}.ticket-subject a{color:var(--color-primary);text-decoration:none}.ticket-subject a:hover{text-decoration:underline}.ticket-preview{font-size:14px;color:var(--text-secondary);margin:0 0 15px;line-height:1.5}.ticket-footer{display:flex;justify-content:space-between;align-items:center}.contact-info{display:flex;align-items:center;gap:10px}.contact-name{font-size:14px;color:var(--text-primary)}.avatar{width:32px;height:32px;border-radius:50%;background-color:var(--color-primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}.search-input{width:100%;padding:12px 16px;border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:14px;box-sizing:border-box;background-color:var(--bg-primary);color:var(--text-primary);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #007bff1a}.tabs{display:flex;gap:10px;margin-bottom:var(--spacing-md);border-bottom:2px solid var(--border-color)}.tab-button{padding:10px 20px;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;font-size:14px;color:var(--text-secondary);margin-bottom:-2px;transition:all var(--transition-fast)}.tab-button:hover{color:var(--color-primary)}.tab-button.active{color:var(--color-primary);border-bottom-color:var(--color-primary);font-weight:600}