/* Exepron API Reference Theme - Customization for Exepron API Documentation */

/* Hide built-in navigation since we're using custom sidebar */
rapi-doc::part(section-navbar) {
    display: none !important;
}

/* Main API Reference container styling */
#api-reference-container {
    width: 100%;
    height: calc(100vh - 80px);
    overflow: auto;
}

rapi-doc {
    width: 100%;
    height: 100%;
}

/* Customize API Reference color scheme to match Exepron branding */
rapi-doc {
    --primary-color: #3c8dbc;
    --bg-color: #fafafa;
    --text-color: #333333;

    /* Navigation colors (though hidden, affects some elements) */
    --nav-bg-color: #7386D5;
    --nav-text-color: #ffffff;
    --nav-hover-bg-color: #6d7fcc;

    /* Accent colors */
    --accent-color: #3c8dbc;
    --border-color: #dddddd;

    /* Font settings */
    --font-regular: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-mono: 'Monaco', 'Courier New', monospace;
}

/* API Groups list styling */
#api-groups-list {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 15px;
    margin-top: 15px;
}

#api-groups-list li.sub-menu {
    margin-bottom: 5px;
}

#api-groups-list a {
    padding: 10px 20px;
    font-size: 0.95em;
    display: block;
    color: #ffffff;
    text-decoration: none;
    transition: all 0.3s;
    border-left: 3px solid transparent;
}

#api-groups-list a:hover {
    background: #6d7fcc;
    border-left-color: #3c8dbc;
}

#api-groups-list a.active {
    background: #ffffff;
    color: #7386D5;
    font-weight: 600;
    border-left-color: #3c8dbc;
}

#api-groups-list a i {
    margin-right: 10px;
    width: 20px;
    text-align: center;
}

/* Collapsed sidebar adjustments */
#sidebar.active #api-groups-list a {
    text-align: center;
    padding: 15px 5px;
    font-size: 0;
}

#sidebar.active #api-groups-list a i {
    margin-right: 0;
    display: block;
    font-size: 1.5em;
    margin-bottom: 5px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    #rapidoc-container {
        height: calc(100vh - 60px);
    }

    #api-groups-list a {
        padding: 15px 10px;
        font-size: 0.85em;
    }
}

/* Method badges styling to match Exepron colors */
rapi-doc::part(method-fg-get) {
    background-color: #61affe;
}

rapi-doc::part(method-fg-post) {
    background-color: #49cc90;
}

rapi-doc::part(method-fg-put) {
    background-color: #fca130;
}

rapi-doc::part(method-fg-delete) {
    background-color: #f93e3e;
}

rapi-doc::part(method-fg-patch) {
    background-color: #50e3c2;
}

/* Override RapiDoc's default styling for better integration */
rapi-doc::part(section-operations-in-tag) {
    padding: 20px;
}

rapi-doc::part(section-tag) {
    border-bottom: 1px solid #dddddd;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

/* Ensure proper scrolling */
#content {
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Authentication section styling */
rapi-doc::part(section-auth) {
    background-color: #f8f9fa;
    border-left: 4px solid #3c8dbc;
    padding: 15px;
    margin: 10px 0;
}

/* Server section (if shown) */
rapi-doc::part(section-servers) {
    display: none;
}

/* Try it out section */
rapi-doc::part(btn-try) {
    background-color: #3c8dbc;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
}

rapi-doc::part(btn-try):hover {
    background-color: #2f7aa8;
}

/* Response section */
rapi-doc::part(section-response) {
    background-color: #f8f9fa;
    border: 1px solid #e1e4e8;
    border-radius: 4px;
    padding: 15px;
    margin-top: 15px;
}

/* Code snippets */
rapi-doc::part(code-block) {
    background-color: #2d2d2d;
    color: #f8f8f2;
    border-radius: 4px;
    padding: 12px;
    font-family: 'Monaco', 'Courier New', monospace;
    font-size: 13px;
    line-height: 1.5;
}

/* Schema table */
rapi-doc::part(schema-table) {
    border: 1px solid #e1e4e8;
    border-radius: 4px;
    overflow: hidden;
}

rapi-doc::part(schema-table-header) {
    background-color: #f6f8fa;
    font-weight: 600;
}

/* Input fields in Try It section */
rapi-doc::part(textbox) {
    border: 1px solid #d1d5da;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 14px;
}

rapi-doc::part(textbox):focus {
    border-color: #3c8dbc;
    outline: none;
    box-shadow: 0 0 0 3px rgba(60, 141, 188, 0.1);
}

/* Dropdown styling */
rapi-doc::part(dropdown) {
    border: 1px solid #d1d5da;
    border-radius: 4px;
    padding: 8px 12px;
    background-color: white;
}

/* Tag/section headers */
rapi-doc::part(tag-title) {
    color: #3c8dbc;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 10px;
}

/* Operation title */
rapi-doc::part(operation-summary) {
    font-size: 18px;
    font-weight: 500;
    color: #333333;
}

/* Description text */
rapi-doc::part(description) {
    color: #666666;
    line-height: 1.6;
}

/* Tabs styling */
rapi-doc::part(tab) {
    border-bottom: 2px solid transparent;
    padding: 8px 16px;
    cursor: pointer;
    color: #666666;
}

rapi-doc::part(tab):hover {
    color: #3c8dbc;
}

rapi-doc::part(tab-active) {
    border-bottom-color: #3c8dbc;
    color: #3c8dbc;
    font-weight: 500;
}

/* Security requirements badge */
rapi-doc::part(security-scheme-badge) {
    background-color: #fff3cd;
    border: 1px solid #ffc107;
    color: #856404;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
}

/* Loading spinner customization */
rapi-doc::part(loading) {
    color: #3c8dbc;
}

/* Scrollbar styling for RapiDoc content */
rapi-doc::-webkit-scrollbar {
    width: 10px;
}

rapi-doc::-webkit-scrollbar-track {
    background: #f1f1f1;
}

rapi-doc::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 5px;
}

rapi-doc::-webkit-scrollbar-thumb:hover {
    background: #555;
}
