/* ── Surgical AI Lab — Annotation Editor Branding ─────────── */

/* ── Standalone mode: restyle for when accessed directly ─── */

/* Replace logo with our brand */
.cvat-logo-icon svg { display: none !important; }
.cvat-logo-icon {
    font-size: 15px !important;
    font-weight: 800 !important;
    letter-spacing: 0.3px !important;
    background: linear-gradient(135deg, #2563eb, #4f46e5) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    white-space: nowrap !important;
}
.cvat-logo-icon::after {
    content: "Surgical AI Lab" !important;
}

/* Hide GitHub link */
.cvat-open-repository-button { display: none !important; }

/* Restyle top nav bar */
.cvat-header {
    background: linear-gradient(180deg, #eef2ff 0%, #e2e8f0 100%) !important;
    border-bottom: 2px solid #4f46e5 !important;
}

/* Accent for nav links */
.cvat-header-button.ant-btn-link:hover,
.cvat-header-button.ant-btn-link:focus {
    color: #4f46e5 !important;
}

/* Hide nav items that expose the engine */
.cvat-header-cloudstorages-button { display: none !important; }
.cvat-header-models-button { display: none !important; }

/* ── Login page: auto-login overlay ─────────────────────── */

.cvat-login-form-wrapper,
.cvat-login-page .ant-card {
    opacity: 0.3 !important;
    pointer-events: none !important;
}

#root > div:first-child > main h2 { font-size: 0 !important; }
#root > div:first-child > main h2::after {
    content: "Surgical AI Lab" !important;
    font-size: 28px !important;
    background: linear-gradient(135deg, #2563eb, #4f46e5) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    font-weight: 800 !important;
}

.cvat-login-form-create-account-text { display: none !important; }

.surgical-auto-login-overlay {
    position: fixed; inset: 0; z-index: 99999;
    display: flex; align-items: center; justify-content: center;
    background: white; flex-direction: column; gap: 12px;
}
.surgical-auto-login-overlay span {
    font-size: 14px; color: #64748b; font-family: system-ui;
}
.surgical-auto-login-spinner {
    width: 32px; height: 32px;
    border: 3px solid #e2e8f0; border-top-color: #4f46e5;
    border-radius: 50%; animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Annotation controls bar: strip engine identity ─────── */

/* Hide Menu button (exposes engine internals) */
.cvat-annotation-header-menu-button { display: none !important; }

/* Hide filename display (our top bar already shows it) */
.cvat-player-filename-wrapper { display: none !important; }

/* Hide Fullscreen button (our top bar has expand/collapse) */
.cvat-annotation-header-fullscreen-button { display: none !important; }

/* Hide workspace selector ("Standard" dropdown) */
.cvat-workspace-selector { display: none !important; }

/* Restyle the controls bar to match our design */
.cvat-annotation-header {
    background: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 0 8px !important;
    min-height: 40px !important;
    height: 40px !important;
}

/* Restyle Save/Undo/Redo buttons */
.cvat-annotation-header-button {
    color: #475569 !important;
    font-size: 12px !important;
}
.cvat-annotation-header-button:hover {
    color: #4f46e5 !important;
}

/* Restyle player controls (frame nav) */
.cvat-player-buttons button {
    color: #475569 !important;
}
.cvat-player-buttons button:hover {
    color: #4f46e5 !important;
}

/* Frame counter input */
.cvat-player-frame-selector input {
    border-color: #e2e8f0 !important;
    font-size: 12px !important;
}

/* Info and Filters buttons */
.cvat-annotation-header-info-button,
.cvat-annotation-header-filters-button {
    color: #475569 !important;
    font-size: 12px !important;
}
.cvat-annotation-header-info-button:hover,
.cvat-annotation-header-filters-button:hover {
    color: #4f46e5 !important;
}

/* ── Embedded mode: hide top nav, keep controls bar ─────── */

body.cvat-embedded .cvat-header { display: none !important; }
body.cvat-embedded .ant-layout {
    margin-top: 0 !important;
    padding-top: 0 !important;
}