/**
 * Seven DB - Technical Editor Styles
 * Enterprise Standard v4.0
 */

:root {
    --primary: #004218;
    --primary-light: #4ADE80;
    --bg-main: #0B0C0E;
    --surface: #15171A;
    --surface-hover: #1C1F23;
    --divider: #24282D;
    --text-primary: #FFFFFF;
    --text-secondary: #8E9196;
    --text-muted: #5C5F66;
    --radius-xl: 28px;
    --radius-lg: 20px;
    --radius-md: 14px;
}

/* Custom Scroll */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--divider); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: var(--text-muted); }

/* Sidebar & Nav */
.active-item {
    background: var(--primary) !important;
    color: white !important;
    box-shadow: 0 8px 24px rgba(0, 66, 24, 0.4);
}

.active-item p, .active-item span { color: white !important; }

/* Editor Tree Engine */
.field-row {
    position: relative;
    transition: all 180ms cubic-bezier(0.4, 0, 0.2, 1);
}

.field-row:hover {
    background: var(--surface-hover);
    transform: translateX(4px);
}

.indent-line {
    border-left: 2px solid var(--divider);
    margin-left: 14px;
    padding-left: 12px;
}

.field-actions {
    opacity: 0;
    pointer-events: none;
    transition: opacity 150ms;
}

.field-row:hover .field-actions {
    opacity: 1;
    pointer-events: auto;
}

/* Form Controls */
.sds-input {
    background: var(--darkbg);
    border: 1px solid var(--divider);
    border-radius: 12px;
    padding: 10px 16px;
    color: white;
    font-size: 13px;
    font-weight: 600;
    width: 100%;
    outline: none;
    transition: all 180ms;
}

.sds-input:focus {
    border-color: var(--primary);
    background: #000;
}

/* Tabs */
.view-tab {
    color: var(--text-secondary);
    transition: all 180ms;
}

.view-tab.active {
    background: var(--primary);
    color: white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Animations */
.animate-fade { animation: fadeIn 300ms ease-out; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.animate-scale { animation: scaleIn 250ms cubic-bezier(0.34, 1.56, 0.64, 1); }
@keyframes scaleIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } }

/* Type Badges */
.type-badge {
    padding: 2px 6px;
    border-radius: 6px;
    font-size: 9px;
    font-weight: 900;
    text-transform: lowercase;
    letter-spacing: 0.05em;
    background: rgba(255,255,255,0.05);
    color: var(--text-muted);
}

/* Value Displays */
.value-display {
    word-break: break-all;
    line-height: 1.6;
}

.value-display--string { color: #4ADE80; }
.value-display--number { color: #3B82F6; font-weight: 800; }
.value-display--boolean { color: #F59E0B; font-weight: 900; }
.value-display--timestamp { color: #FB7185; }

/* Modal */
#modalOverlay.active { display: flex; animation: fadeIn 200ms forwards; }