/* Aether — Light theme, high contrast */
:root {
    --accent: #6366f1;
}

body {
    font-feature-settings: "ss01", "ss02", "cv01";
    color: #18181b; /* zinc-900 — strong black text */
}

/* Elegant focus states */
input:focus, button:focus, select:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* Sophisticated result containers */
.result-card {
    background: #ffffff;
    border: 1px solid #e4e4e7; /* zinc-200 */
    transition: all 0.2s cubic-bezier(0.23, 1.0, 0.32, 1);
}

.result-card:hover {
    border-color: #d4d4d8; /* zinc-300 */
}

/* Status pills — high contrast on light */
.status-pill {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 2px 12px;
    border-radius: 9999px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.status-success {
    background: #dcfce7; /* green-100 */
    color: #166534;     /* green-800 */
    border: 1px solid #86efac;
}

.status-error {
    background: #fee2e2; /* red-100 */
    color: #991b1b;      /* red-800 */
    border: 1px solid #fca5a5;
}

.status-warning {
    background: #fef3c7; /* amber-100 */
    color: #92400e;      /* amber-800 */
    border: 1px solid #fcd34d;
}

.status-neutral {
    background: #f4f4f5; /* zinc-100 */
    color: #27272a;      /* zinc-800 */
    border: 1px solid #d4d4d8; /* zinc-300 */
}

/* Beautiful metric boxes */
.metric {
    background: #f8fafc; /* slate-50 */
    border: 1px solid #e2e8f0; /* slate-200 */
    transition: transform 0.1s ease, border-color 0.2s ease;
}

.metric:hover {
    border-color: #c7d2fe; /* indigo-200 */
    transform: translateY(-1px);
}

/* Copy buttons */
.copy-btn {
    opacity: 0.7;
    transition: all 0.15s ease;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 11px;
    color: #3f3f46;
}

.copy-btn:hover {
    opacity: 1;
    background: #f4f4f5;
}

.copy-btn.copied {
    color: #166534;
    opacity: 1;
}

/* DNS record tables */
.dns-table {
    font-feature-settings: "tnum";
}

.dns-table th {
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #71717a; /* zinc-500 */
    text-transform: uppercase;
    padding-bottom: 8px;
    border-bottom: 1px solid #e4e4e7;
}

.dns-table td {
    padding: 10px 12px;
    border-bottom: 1px solid #f4f4f5;
    vertical-align: top;
    font-size: 13px;
}

.dns-table tr:hover td {
    background: #fafafa;
}

/* Loading state */
.loading-shimmer {
    background: linear-gradient(90deg, #f4f4f5 25%, #e4e4e7 50%, #f4f4f5 75%);
    background-size: 200% 100%;
    animation: shimmer 1.2s infinite linear;
}

@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* History pills */
.history-pill {
    font-size: 12px;
    background: #f4f4f5;
    border: 1px solid #e4e4e7;
    color: #27272a;
    padding: 4px 14px;
    border-radius: 9999px;
    cursor: pointer;
    transition: all 0.1s ease;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.history-pill:hover {
    border-color: #a5b4fc;
    background: #f1f5f9;
}

/* Tool section headers */
.tool-header {
    font-size: 13px;
    letter-spacing: 2px;
    font-weight: 600;
    color: #71717a; /* zinc-500 */
}

/* Input fields — premium light feel */
.premium-input {
    background: #ffffff;
    border: 1px solid #d1d5db; /* zinc-300 — clearly visible */
    color: #111827; /* zinc-900 */
    transition: all 0.2s cubic-bezier(0.23, 1.0, 0.32, 1);
    font-size: 15px;
}

.premium-input::placeholder {
    color: #6b7280; /* zinc-500 — readable */
    opacity: 1;
}

.premium-input:focus {
    border-color: #6366f1;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.12);
}

/* Toast notifications */
.toast {
    background: #ffffff;
    border: 1px solid #e4e4e7;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1);
}

/* Subtle dividers */
.section-divider {
    height: 1px;
    background: linear-gradient(to right, transparent, #e4e4e7, transparent);
}

/* WHOIS / DNS raw output */
.raw-output {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 12px;
    line-height: 1.6;
    background: #f8fafc;
    border: 1px solid #e4e4e7;
    color: #27272a;
    white-space: pre-wrap;
    word-break: break-word;
}

/* Responsive tweaks */
@media (max-width: 768px) {
    .metric {
        padding: 1rem !important;
    }
}