/* ─────────────────────────────────────────────────────────────────
   SMSReflex API — Swagger UI custom theme
   ─────────────────────────────────────────────────────────────────
   - Theme : light par defaut, dark via data-theme-resolved="dark"
     pose par swagger-sidebar.js (cycle auto/light/dark stocke localStorage)
   - Logo SMSReflex (light/dark) au-dessus de la sidebar
   - Topbar reduite : hamburger, auth, theme, dropdown langue
   - Sidebar sticky a gauche listant tags + endpoints
   - Tag headings (.opblock-tag) caches (sidebar les remplace)
   - Responsive desktop / tablet (sidebar collapsable) / mobile (notice)
   ───────────────────────────────────────────────────────────────── */

:root {
    --smsr-primary: #1e90ff;
    --smsr-bg: #ffffff;
    --smsr-text: #1a1f29;
    --smsr-muted: #5a6470;
    --smsr-sidebar-bg: #fafbfc;
    --smsr-sidebar-border: #e6e8eb;
    --smsr-sidebar-width: 280px;
    --smsr-topbar-height: 64px;
    --smsr-panel-bg: #ffffff;
    --smsr-panel-border: #e6e8eb;
    --smsr-input-bg: #ffffff;
    --smsr-input-border: #d4d8de;
    --smsr-btn-secondary-bg: #eef0f3;
    --smsr-btn-secondary-bg-hover: #e2e5ea;
    --smsr-code-bg: #f7f7f7;
    --smsr-opblock-bg: #ffffff;
}

/* ─── Logo column ────────────────────────────────────────────── */
#smsr-logo {
    position: fixed;
    top: 0;
    left: 0;
    width: var(--smsr-sidebar-width);
    height: var(--smsr-topbar-height);
    background-color: var(--smsr-bg);
    border-right: 1px solid var(--smsr-sidebar-border);
    border-bottom: 1px solid var(--smsr-sidebar-border);
    display: flex;
    align-items: center;
    padding: 0 20px;
    box-sizing: border-box;
    z-index: 60;
}
#smsr-logo a { display: flex; align-items: center; text-decoration: none; }
#smsr-logo img { max-height: 38px; max-width: 100%; object-fit: contain; }
#smsr-logo .logo-dark { display: none; }

/* ─── Topbar Swagger ─────────────────────────────────────────── */
.swagger-ui .topbar {
    background-color: var(--smsr-bg);
    border-bottom: 1px solid var(--smsr-sidebar-border);
    height: var(--smsr-topbar-height);
    padding: 12px 24px;
    position: fixed;
    top: 0;
    left: var(--smsr-sidebar-width);
    right: 0;
    z-index: 50;
    box-sizing: border-box;
}
.swagger-ui .topbar .topbar-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    max-width: none;
    height: 100%;
    gap: 10px;
}
.swagger-ui .topbar .topbar-wrapper > a.link { display: none !important; }

#smsr-hamburger {
    display: none;
    background: none;
    border: 1px solid var(--smsr-sidebar-border);
    color: var(--smsr-text);
    cursor: pointer;
    font-size: 18px;
    border-radius: 4px;
    padding: 6px 10px;
}

#smsr-auth-btn {
    background-color: var(--smsr-primary);
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 8px 18px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s;
}
#smsr-auth-btn:hover { background-color: #1574d3; }
#smsr-auth-btn.is-authed { background-color: #2ea043; }
#smsr-auth-btn.is-authed:hover { background-color: #258739; }

#smsr-theme-btn {
    background-color: var(--smsr-bg);
    color: var(--smsr-text);
    border: 1px solid var(--smsr-sidebar-border);
    border-radius: 4px;
    width: 38px;
    height: 36px;
    font-size: 16px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.15s, border-color 0.15s;
}
#smsr-theme-btn:hover { border-color: var(--smsr-primary); }

/* Selector langue natif Swagger UI : COMPLETEMENT cache (on injecte nos
   propres drapeaux #smsr-lang-en / #smsr-lang-fr) */
.swagger-ui .topbar .download-url-wrapper { display: none !important; }

/* Dark mode toggle integre a Swagger UI v5 : cache (on a deja notre
   propre bouton theme) */
.swagger-ui .dark-mode-toggle,
.dark-mode-toggle { display: none !important; }

/* Flag buttons (FR/EN) */
.smsr-lang-btn {
    background: var(--smsr-bg);
    border: 1px solid var(--smsr-sidebar-border);
    border-radius: 4px;
    width: 38px;
    height: 36px;
    padding: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s, opacity 0.15s;
    opacity: 0.55;
}
.smsr-lang-btn:hover { opacity: 1; border-color: var(--smsr-primary); }
.smsr-lang-btn.active { opacity: 1; border-color: var(--smsr-primary); box-shadow: 0 0 0 2px rgba(30, 144, 255, 0.2); }
.smsr-lang-btn img { width: 24px; height: 18px; object-fit: cover; display: block; }

/* ─── Layout ─────────────────────────────────────────────────── */
/* Strategie : on offset le conteneur racine `#swagger-ui` du width
   de la sidebar. Tous les enfants prennent naturellement la pleine
   largeur restante (operation-tag-content compris). */
body {
    margin: 0;
    padding-top: var(--smsr-topbar-height);
    background-color: var(--smsr-bg);
}
#swagger-ui {
    padding-left: var(--smsr-sidebar-width);
    padding-right: 0;
    box-sizing: border-box;
}
.swagger-ui .wrapper,
.swagger-ui .information-container.wrapper,
.swagger-ui section.models.is-open,
.swagger-ui .opblock-tag-section,
.swagger-ui .operation-tag-content {
    max-width: none !important;
    width: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box;
}
.swagger-ui .operation-tag-content > span,
.swagger-ui .operation-tag-content { display: block; width: 100%; }
/* Cacher Authorize natif + zone scheme (auth flow custom) */
.swagger-ui .auth-wrapper,
.swagger-ui .scheme-container { display: none !important; }

/* Cacher tag headings — la sidebar les remplace */
.swagger-ui .opblock-tag,
.swagger-ui .opblock-tag-section > h3,
.swagger-ui .opblock-tag-section > h4 { display: none !important; }
.swagger-ui .opblock-tag-section.is-open,
.swagger-ui .opblock-tag-section { margin-bottom: 8px; padding-top: 0; padding-bottom: 0; }
.swagger-ui .info { margin: 24px 0; }

/* ─── Sidebar ────────────────────────────────────────────────── */
#smsr-sidebar {
    position: fixed;
    top: var(--smsr-topbar-height);
    left: 0;
    bottom: 0;
    width: var(--smsr-sidebar-width);
    background-color: var(--smsr-sidebar-bg);
    border-right: 1px solid var(--smsr-sidebar-border);
    overflow-y: auto;
    padding: 20px 16px;
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 13px;
    z-index: 10;
    transition: transform 0.25s ease;
}
#smsr-sidebar h3 {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--smsr-muted);
    margin: 16px 0 6px;
    padding-bottom: 4px;
    border-bottom: 1px solid var(--smsr-sidebar-border);
    cursor: pointer;
    user-select: none;
}
#smsr-sidebar h3:first-child { margin-top: 0; }
#smsr-sidebar h3::before { content: "▾ "; color: #aaa; font-size: 10px; }
#smsr-sidebar h3.collapsed::before { content: "▸ "; }
#smsr-sidebar h3.collapsed + ul { display: none; }
#smsr-sidebar ul { list-style: none; padding: 0; margin: 0 0 4px; }
#smsr-sidebar li { margin: 2px 0; }
#smsr-sidebar a {
    display: flex;
    align-items: baseline;
    text-decoration: none;
    color: var(--smsr-text);
    padding: 4px 8px;
    border-radius: 3px;
    line-height: 1.4;
    word-break: break-word;
    transition: background-color 0.1s;
}
#smsr-sidebar a:hover { background-color: rgba(30, 144, 255, 0.08); color: var(--smsr-primary); }
#smsr-sidebar a.active { background-color: rgba(30, 144, 255, 0.14); color: var(--smsr-primary); font-weight: 600; }
#smsr-sidebar .method {
    display: inline-block;
    font-size: 9px;
    font-weight: 700;
    padding: 2px 5px;
    border-radius: 3px;
    margin-right: 6px;
    color: #fff;
    min-width: 38px;
    text-align: center;
    flex-shrink: 0;
    text-transform: uppercase;
}
#smsr-sidebar .method.get    { background-color: #61affe; }
#smsr-sidebar .method.post   { background-color: #49cc90; }
#smsr-sidebar .method.put    { background-color: #fca130; }
#smsr-sidebar .method.delete { background-color: #f93e3e; }
#smsr-sidebar .method.patch  { background-color: #50e3c2; }
#smsr-sidebar .method.head,
#smsr-sidebar .method.options { background-color: #9012fe; }

.swagger-ui .opblock-tag,
.swagger-ui .opblock { scroll-margin-top: calc(var(--smsr-topbar-height) + 10px); }

/* ─── Auth modal ─────────────────────────────────────────────── */
#smsr-auth-modal {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(15, 20, 30, 0.55);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    backdrop-filter: blur(2px);
}
#smsr-auth-modal.visible { display: flex; }
#smsr-auth-modal .panel {
    background: var(--smsr-panel-bg);
    border-radius: 8px;
    width: 420px;
    max-width: 92vw;
    padding: 28px 32px 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.35);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    border: 1px solid var(--smsr-panel-border);
}
#smsr-auth-modal h2 { margin: 0 0 8px; font-size: 20px; color: var(--smsr-text); }
#smsr-auth-modal .hint { color: var(--smsr-muted); font-size: 13px; margin: 0 0 20px; line-height: 1.4; }
#smsr-auth-modal label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--smsr-text);
    margin: 0 0 6px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
#smsr-auth-modal input {
    width: 100%;
    padding: 10px 12px;
    background-color: var(--smsr-input-bg);
    color: var(--smsr-text);
    border: 1px solid var(--smsr-input-border);
    border-radius: 5px;
    font-size: 14px;
    margin-bottom: 16px;
    box-sizing: border-box;
    transition: border-color 0.15s, box-shadow 0.15s;
}
#smsr-auth-modal input:focus {
    border-color: var(--smsr-primary);
    box-shadow: 0 0 0 3px rgba(30, 144, 255, 0.15);
    outline: none;
}
#smsr-auth-modal .actions { display: flex; gap: 10px; margin-top: 6px; }
#smsr-auth-modal button {
    flex: 1;
    padding: 10px 14px;
    border: none;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s;
}
#smsr-auth-modal .btn-primary { background-color: var(--smsr-primary); color: #fff; }
#smsr-auth-modal .btn-primary:hover { background-color: #1574d3; }
#smsr-auth-modal .btn-secondary { background-color: var(--smsr-btn-secondary-bg); color: var(--smsr-text); }
#smsr-auth-modal .btn-secondary:hover { background-color: var(--smsr-btn-secondary-bg-hover); }
#smsr-auth-modal .alert {
    padding: 10px 12px;
    border-radius: 4px;
    font-size: 13px;
    margin-top: 14px;
    display: none;
}
#smsr-auth-modal .alert.visible { display: block; }
#smsr-auth-modal .alert-success { background: #e6f7eb; color: #1f7a35; border: 1px solid #b6e0c4; }
#smsr-auth-modal .alert-error   { background: #fdecea; color: #a32c1f; border: 1px solid #f3b7b1; }

/* ─── Mobile notice ──────────────────────────────────────────── */
#smsr-mobile-notice {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: var(--smsr-bg);
    z-index: 99999;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    text-align: center;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
#smsr-mobile-notice img { max-width: 220px; margin-bottom: 24px; }
#smsr-mobile-notice .logo-dark { display: none; }
#smsr-mobile-notice h2 { margin: 0 0 12px; font-size: 22px; color: var(--smsr-text); }
#smsr-mobile-notice p  { margin: 0 0 8px; color: var(--smsr-muted); font-size: 15px; line-height: 1.5; max-width: 340px; }

/* ─── Responsive ─────────────────────────────────────────────── */
@media (max-width: 1024px) {
    :root { --smsr-sidebar-width: 0px; }
    #smsr-logo {
        width: auto;
        min-width: 160px;
        border-right: none;
    }
    .swagger-ui .topbar { left: 160px; padding: 12px 16px; }
    #swagger-ui { padding-left: 0; }
    #smsr-sidebar {
        width: 280px;
        transform: translateX(-100%);
        box-shadow: 4px 0 20px rgba(0,0,0,0.15);
    }
    #smsr-sidebar.is-open { transform: translateX(0); }
    #smsr-hamburger { display: block; }
}
@media (max-width: 600px) {
    #smsr-mobile-notice { display: flex; }
    body > *:not(#smsr-mobile-notice) { display: none !important; }
}

/* ═══════════════════════════════════════════════════════════════
   DARK THEME — pose par swagger-sidebar.js via
   `<html data-theme-resolved="dark">`
   ═══════════════════════════════════════════════════════════════ */
html[data-theme-resolved="dark"] {
    --smsr-bg: #1a1f29;
    --smsr-text: #e6e8eb;
    --smsr-muted: #9aa3b1;
    --smsr-sidebar-bg: #1f2530;
    --smsr-sidebar-border: #2c3441;
    --smsr-panel-bg: #232a37;
    --smsr-panel-border: #2c3441;
    --smsr-input-bg: #1a1f29;
    --smsr-input-border: #3a4252;
    --smsr-btn-secondary-bg: #2c3441;
    --smsr-btn-secondary-bg-hover: #3a4252;
    --smsr-code-bg: #0f1419;
    --smsr-opblock-bg: #232a37;
}

/* Logo swap */
html[data-theme-resolved="dark"] #smsr-logo .logo-light,
html[data-theme-resolved="dark"] #smsr-mobile-notice .logo-light { display: none; }
html[data-theme-resolved="dark"] #smsr-logo .logo-dark,
html[data-theme-resolved="dark"] #smsr-mobile-notice .logo-dark { display: inline-block; }

/* Swagger UI core overrides en mode sombre */
html[data-theme-resolved="dark"] body { background-color: var(--smsr-bg); }
html[data-theme-resolved="dark"] .swagger-ui { color: var(--smsr-text); }
html[data-theme-resolved="dark"] .swagger-ui,
html[data-theme-resolved="dark"] .swagger-ui .info .title,
html[data-theme-resolved="dark"] .swagger-ui .info p,
html[data-theme-resolved="dark"] .swagger-ui .info li,
html[data-theme-resolved="dark"] .swagger-ui .info table,
html[data-theme-resolved="dark"] .swagger-ui .opblock .opblock-summary-path,
html[data-theme-resolved="dark"] .swagger-ui .opblock .opblock-summary-description,
html[data-theme-resolved="dark"] .swagger-ui .opblock-description-wrapper p,
html[data-theme-resolved="dark"] .swagger-ui .opblock-external-docs-wrapper p,
html[data-theme-resolved="dark"] .swagger-ui .opblock-title_normal p,
html[data-theme-resolved="dark"] .swagger-ui table thead tr td,
html[data-theme-resolved="dark"] .swagger-ui table thead tr th,
html[data-theme-resolved="dark"] .swagger-ui .parameter__name,
html[data-theme-resolved="dark"] .swagger-ui .parameter__type,
html[data-theme-resolved="dark"] .swagger-ui .parameter__in,
html[data-theme-resolved="dark"] .swagger-ui .parameter__deprecated,
html[data-theme-resolved="dark"] .swagger-ui .response-col_status,
html[data-theme-resolved="dark"] .swagger-ui .response-col_links,
html[data-theme-resolved="dark"] .swagger-ui .responses-inner h4,
html[data-theme-resolved="dark"] .swagger-ui .responses-inner h5,
html[data-theme-resolved="dark"] .swagger-ui .tab li,
html[data-theme-resolved="dark"] .swagger-ui .opblock-section-header h4,
html[data-theme-resolved="dark"] .swagger-ui .opblock-section-header label,
html[data-theme-resolved="dark"] .swagger-ui .model-title,
html[data-theme-resolved="dark"] .swagger-ui .model,
html[data-theme-resolved="dark"] .swagger-ui .model-toggle,
html[data-theme-resolved="dark"] .swagger-ui .models h4,
html[data-theme-resolved="dark"] .swagger-ui section.models h4 span {
    color: var(--smsr-text) !important;
}
html[data-theme-resolved="dark"] .swagger-ui .opblock {
    background: var(--smsr-opblock-bg);
    border-color: var(--smsr-sidebar-border);
    box-shadow: 0 0 3px rgba(0,0,0,0.3);
}
html[data-theme-resolved="dark"] .swagger-ui .opblock .opblock-section-header {
    background: rgba(255,255,255,0.04);
    box-shadow: 0 1px 0 var(--smsr-sidebar-border);
}
html[data-theme-resolved="dark"] .swagger-ui .opblock .opblock-summary {
    border-bottom-color: var(--smsr-sidebar-border);
}
html[data-theme-resolved="dark"] .swagger-ui section.models {
    background: var(--smsr-sidebar-bg);
    border-color: var(--smsr-sidebar-border);
}
html[data-theme-resolved="dark"] .swagger-ui section.models.is-open h4 {
    border-bottom-color: var(--smsr-sidebar-border);
}
html[data-theme-resolved="dark"] .swagger-ui table tbody tr td {
    border-color: var(--smsr-sidebar-border);
    color: var(--smsr-text);
}
html[data-theme-resolved="dark"] .swagger-ui .parameters-col_description p,
html[data-theme-resolved="dark"] .swagger-ui .response-col_description__inner div.markdown,
html[data-theme-resolved="dark"] .swagger-ui .response-col_description__inner div.renderedMarkdown {
    color: var(--smsr-text);
}
html[data-theme-resolved="dark"] .swagger-ui input[type=text],
html[data-theme-resolved="dark"] .swagger-ui textarea,
html[data-theme-resolved="dark"] .swagger-ui select {
    background: var(--smsr-input-bg);
    color: var(--smsr-text);
    border-color: var(--smsr-input-border);
}
html[data-theme-resolved="dark"] .swagger-ui textarea.curl,
html[data-theme-resolved="dark"] .swagger-ui .highlight-code > .microlight,
html[data-theme-resolved="dark"] .swagger-ui .opblock-body pre {
    background: var(--smsr-code-bg) !important;
    color: #d1d5db !important;
}
html[data-theme-resolved="dark"] .swagger-ui .renderedMarkdown code,
html[data-theme-resolved="dark"] .swagger-ui code {
    background: rgba(255,255,255,0.08);
    color: #f6c177;
}
html[data-theme-resolved="dark"] .swagger-ui .btn {
    background: var(--smsr-btn-secondary-bg);
    color: var(--smsr-text);
    border-color: var(--smsr-input-border);
}
html[data-theme-resolved="dark"] .swagger-ui .btn:hover { background: var(--smsr-btn-secondary-bg-hover); }
html[data-theme-resolved="dark"] .swagger-ui .btn.execute {
    background: var(--smsr-primary);
    border-color: var(--smsr-primary);
    color: #fff;
}
