* { margin: 0; padding: 0; box-sizing: border-box; }

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5;
    background: #f5f5f5;
    color: #333;
}

.login-container {
    max-width: 320px;
    margin: 100px auto;
    padding: 30px;
    background: #fff;
    border: 1px solid #ddd;
}
.login-container h1 { font-size: 20px; margin-bottom: 20px; text-align: center; }

.container { max-width: 1600px; margin: 0 auto; padding: 20px; }

header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    border-bottom: 2px solid #333;
    margin-bottom: 20px;
}
header h1 { font-size: 22px; }
header nav a {
    margin-left: 15px;
    color: #333;
    text-decoration: none;
    padding: 5px 10px;
}
header nav a:hover { text-decoration: underline; }
header nav a.active { background: #333; color: #fff; }

.form-group { margin-bottom: 15px; }
.form-group label { display: block; margin-bottom: 5px; font-weight: 500; }
.form-group input { width: 100%; padding: 8px; border: 1px solid #ccc; font-size: 14px; }

.form-inline { background: #fff; border: 1px solid #ddd; padding: 20px; margin-bottom: 20px; }
.form-row { display: inline-block; margin-right: 15px; margin-bottom: 10px; }
.form-row label { display: block; font-size: 12px; margin-bottom: 3px; color: #666; }
.form-row input[type="text"],
.form-row input[type="number"] { padding: 6px 8px; border: 1px solid #ccc; font-size: 13px; }
.form-row input[type="number"] { width: 100px; }

button { padding: 8px 16px; background: #333; color: #fff; border: none; font-size: 13px; cursor: pointer; }
button:hover { background: #555; }

.btn-small { display: inline-block; padding: 3px 8px; font-size: 12px; text-decoration: none; border: 1px solid #ccc; background: #f5f5f5; color: #333; cursor: pointer; }
.btn-small:hover { background: #e5e5e5; }
.btn-small.btn-ok { background: #d4edda; border-color: #28a745; color: #155724; }
.btn-small.btn-no { background: #f8d7da; border-color: #dc3545; color: #721c24; }
.btn-small.btn-danger { background: #f8d7da; border-color: #dc3545; color: #721c24; }

.error { background: #fee; border: 1px solid #c00; color: #c00; padding: 10px; margin-bottom: 15px; }
.success { background: #d4edda; border: 1px solid #28a745; color: #155724; padding: 10px; margin-bottom: 15px; }

.stats-bar { display: flex; gap: 15px; margin-bottom: 20px; flex-wrap: wrap; }
.stat { background: #fff; border: 1px solid #ddd; padding: 15px 20px; text-align: center; min-width: 120px; }
.stat-value { display: block; font-size: 22px; font-weight: bold; }
.stat-label { font-size: 11px; color: #666; }

.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 1000px) { .two-col { grid-template-columns: 1fr; } }

.filters { margin-bottom: 15px; padding: 8px 10px; background: #fff; border: 1px solid #ddd; }
.filters span { margin-right: 10px; font-weight: 500; }
.filters a { margin-right: 5px; padding: 4px 10px; background: #eee; color: #333; text-decoration: none; font-size: 13px; }
.filters a:hover, .filters a.active { background: #333; color: #fff; }

table { width: 100%; border-collapse: collapse; background: #fff; margin-bottom: 20px; }
table th, table td { padding: 8px 10px; text-align: left; border: 1px solid #ddd; font-size: 13px; }
table th { background: #333; color: #fff; font-weight: 500; }
table tr:nth-child(even) { background: #fafafa; }
table tr:hover { background: #f0f0f0; }
table a { color: #06c; }
table .num { text-align: right; }
table .mono { font-family: Consolas, Monaco, monospace; font-size: 12px; }
table .empty { text-align: center; color: #999; font-style: italic; }

.badge { display: inline-block; padding: 2px 8px; font-size: 11px; border-radius: 3px; }
.badge-pending { background: #fff3cd; color: #856404; }
.badge-forwarded { background: #d4edda; color: #155724; }
.badge-held_limit { background: #f8d7da; color: #721c24; }
.badge-processed { background: #d1ecf1; color: #0c5460; }
.badge-ok { background: #d4edda; color: #155724; }
.badge-no { background: #f8d7da; color: #721c24; }

.breadcrumb { margin-bottom: 15px; font-size: 13px; }
.breadcrumb a { color: #06c; }

.detail-header { background: #fff; border: 1px solid #ddd; padding: 20px; margin-bottom: 20px; }
.detail-header h2 { margin-bottom: 15px; }
.detail-info p { margin-bottom: 5px; }
.detail-info .mono { font-family: Consolas, Monaco, monospace; font-size: 12px; background: #f5f5f5; padding: 2px 6px; }

h2, h3 { margin: 20px 0 12px; }

.email-body { background: #fff; border: 1px solid #ddd; padding: 15px; font-size: 13px; white-space: pre-wrap; word-wrap: break-word; max-height: 500px; overflow-y: auto; }

.pagination { margin: 15px 0; }
.pagination a { display: inline-block; padding: 5px 10px; margin-right: 3px; background: #eee; text-decoration: none; color: #333; }
.pagination a.active { background: #333; color: #fff; }