/* Smooth transitions */
body, .swagger-ui * {
    transition: background-color 0.3s, color 0.3s;
}

/* ------------------------- */
/* Light Mode (default)      */
/* ------------------------- */
body:not(.dark-mode) .swagger-ui .opblock .opblock-section-header {
    background: hsla(0, 0%, 100%, .8);
    align-items: center;
}

/* Light mode headings */
body:not(.dark-mode) .swagger-ui section h3,
body:not(.dark-mode) .swagger-ui .opblock .opblock-section-header h4,
body:not(.dark-mode) .swagger-ui .responses-inner h4,
body:not(.dark-mode) .swagger-ui .responses-inner h5 {
    color: initial; /* Default light color */
    font-family: sans-serif;
}

/* ------------------------- */
/* Dark Mode                 */
/* ------------------------- */
body.dark-mode {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
}

/* Topbar, info */
body.dark-mode .swagger-ui .topbar { background-color: #333; }
body.dark-mode .swagger-ui .info { color: #ffffff; }
body.dark-mode .swagger-ui .info h1,
body.dark-mode .swagger-ui .info h2 { color: #ffffff; }

/* Links */
body.dark-mode .swagger-ui a { color: #4ea1f3 !important; }
body.dark-mode .swagger-ui a:hover { color: #76c0ff !important; }

/* Opblock headers and summaries */
body.dark-mode .swagger-ui .opblock-tag { color: #ffffff; }
body.dark-mode .swagger-ui .opblock .opblock-summary { background-color: #3c3c3c; color: #ffffff; }
body.dark-mode .swagger-ui .opblock .opblock-summary-description { color: #f0f0f0; }
body.dark-mode .swagger-ui .opblock .opblock-section-header {
    background: hsl(0deg 0% 23.53%) !important;
    align-items: center !important;
}

/* Opblock body text */
body.dark-mode .swagger-ui .opblock .opblock-body pre,
body.dark-mode .swagger-ui table td,
body.dark-mode .swagger-ui table th,
body.dark-mode .swagger-ui .opblock .opblock-body p,
body.dark-mode .swagger-ui .opblock .opblock-body code,
body.dark-mode .markdown p,
body.dark-mode .markdown code { color: #e0e0e0; }

/* Buttons and selects */
body.dark-mode .swagger-ui button,
body.dark-mode .swagger-ui select,
body.dark-mode .swagger-ui .execute-wrapper button {
    background-color: rgb(137 137 137 / 33%) !important;
    color: #ffffff !important;
    border: 1px solid #62a03f66 !important;
}
body.dark-mode .swagger-ui button:hover,
body.dark-mode .swagger-ui select:hover,
body.dark-mode .swagger-ui .execute-wrapper button:hover {
    background-color: #555 !important;
}

/* JSON Schema titles */
body.dark-mode .swagger-ui .json-schema-2020-12__title { color: #dd3e3e !important; }

/* JSON Schema accordion */
body.dark-mode .swagger-ui .json-schema-2020-12-expand-deep-button,
body.dark-mode .swagger-ui .json-schema-2020-12-accordion {
    background-color: rgb(137 137 137 / 0%) !important;
    border: 1px solid #62a03f00 !important;
}
body.dark-mode .swagger-ui .json-schema-2020-12 { background-color: rgb(239 120 232 / 12%); }

/* Tabs */
body.dark-mode .swagger-ui .tab li button.tablinks {
    background-color: rgb(137 137 137 / 0%) !important;
    border: 1px solid #62a03f00 !important;
}

/* Textarea */
body.dark-mode .swagger-ui textarea {
    background: #3c3c3c;
    border: none;
    border-radius: 4px;
    color: #fff;
}

/* Errors */
body.dark-mode .swagger-ui .errors-wrapper { color: #f07092; }

/* Parameter styling */
body.dark-mode .swagger-ui .parameter__name {
    color: #62a03f;
    font-family: sans-serif;
    font-size: 16px;
    margin-right: .75em;
}
body.dark-mode .swagger-ui .parameter__type {
    color: #3a8d0c;
    font-family: monospace;
    font-size: 12px;
    font-weight: 600;
    padding: 5px 0;
}

/* Headings inside Swagger sections */
body.dark-mode .swagger-ui section h3,
body.dark-mode .swagger-ui .opblock .opblock-section-header h4,
body.dark-mode .swagger-ui .responses-inner h4,
body.dark-mode .swagger-ui .responses-inner h5 {
    color: #62a03f;
    font-family: sans-serif;
}

/* Descriptions and external docs */
body.dark-mode .swagger-ui .opblock-description-wrapper,
body.dark-mode .swagger-ui .opblock-external-docs-wrapper,
body.dark-mode .swagger-ui .opblock-title_normal {
    color: #feebeba6;
}

/* Toggle button */
#mode-toggle-btn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 8px 12px;
    border: none;
    border-radius: 5px;
    background-color: #4ea1f3;
    color: white;
    font-weight: bold;
    cursor: pointer;
    z-index: 10000;
}