/* ============================================================
   Shukla Medicals — Swagger UI theme (sky blue)
   Injected via UseSwaggerUI(options.InjectStylesheet(...)).
   To match your exact brand hex, change --shukla (and the two
   --sky-* used in the topbar gradient) below — everything keys off these.
   ============================================================ */
:root {
  --sky-50:  #F0F9FF;
  --sky-100: #E0F2FE;
  --sky-200: #BAE6FD;
  --sky-300: #7DD3FC;
  --sky-400: #38BDF8;
  --sky-500: #0EA5E9;   /* primary sky blue */
  --sky-600: #0284C7;
  --sky-700: #0369A1;
  --shukla:  #0EA5E9;   /* ← your brand sky blue; change this one value to re-skin */
  --ink:     #0B2A3B;
  --muted:   #5B7488;
  --line:    #D8EAF6;
}

/* ---- page canvas + font ---- */
body { background: var(--sky-50); }
.swagger-ui, .swagger-ui .info, .swagger-ui .opblock .opblock-section-header h4,
.swagger-ui .opblock-description-wrapper p, .swagger-ui .markdown p {
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI",
               Roboto, Helvetica, Arial, sans-serif;
}

/* ---- top bar (brand gradient, custom wordmark) ---- */
.swagger-ui .topbar {
  background: linear-gradient(135deg, var(--sky-500) 0%, var(--sky-700) 100%);
  box-shadow: 0 2px 14px rgba(2,132,199,.35);
  padding: 12px 0;
}
.swagger-ui .topbar .topbar-wrapper .link { position: relative; }
.swagger-ui .topbar .topbar-wrapper .link svg,
.swagger-ui .topbar .topbar-wrapper .link img { display: none; }
.swagger-ui .topbar .topbar-wrapper .link::before {
  content: ""; display: inline-block; width: 12px; height: 12px;
  border-radius: 50%; background: #fff; margin-right: 11px;
  box-shadow: 0 0 0 4px rgba(255,255,255,.25); vertical-align: middle;
}
.swagger-ui .topbar .topbar-wrapper .link::after {
  content: "Shukla Medicals  ·  API"; color: #fff;
  font-weight: 800; font-size: 20px; letter-spacing: .3px; vertical-align: middle;
}
/* explore bar */
.swagger-ui .topbar .download-url-wrapper input[type=text] {
  border: 2px solid rgba(255,255,255,.55); border-radius: 8px;
  background: rgba(255,255,255,.12); color: #fff;
}
.swagger-ui .topbar .download-url-wrapper input[type=text]::placeholder { color: rgba(255,255,255,.7); }
.swagger-ui .topbar .download-url-wrapper .download-url-button {
  background: #fff; color: var(--sky-700); font-weight: 700;
  border: none; border-radius: 8px;
}
.swagger-ui .topbar .download-url-wrapper .download-url-button:hover { background: var(--sky-100); }

/* ---- title / info ---- */
.swagger-ui .info { margin: 30px 0; }
.swagger-ui .info .title { color: var(--sky-700); font-weight: 800; }
.swagger-ui .info .title small { background: var(--sky-500); border-radius: 6px; }
.swagger-ui .info .title small pre { background: transparent; }
.swagger-ui .info a, .swagger-ui a { color: var(--sky-600); }
.swagger-ui .info a:hover, .swagger-ui a:hover { color: var(--sky-700); }

/* ---- Authorize / scheme card ---- */
.swagger-ui .scheme-container {
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 4px 18px rgba(2,132,199,.08); margin: 0 0 26px;
}
.swagger-ui .btn.authorize {
  color: #fff; background: var(--sky-500); border-color: var(--sky-500);
  border-radius: 8px; font-weight: 700; transition: background .15s ease;
}
.swagger-ui .btn.authorize:hover { background: var(--sky-600); border-color: var(--sky-600); }
.swagger-ui .btn.authorize svg { fill: #fff; }

/* ---- tag (section) headers ---- */
.swagger-ui .opblock-tag {
  color: var(--sky-700); font-weight: 700; border-bottom: 1px solid var(--sky-200);
  transition: background .15s ease;
}
.swagger-ui .opblock-tag:hover { background: var(--sky-50); }
.swagger-ui .opblock-tag small { color: var(--muted); }

/* ---- operation blocks: rounded, soft shadow ---- */
.swagger-ui .opblock { border-radius: 12px; box-shadow: 0 2px 10px rgba(11,42,59,.06);
  margin: 0 0 14px; border: 1px solid var(--line); overflow: hidden; }
.swagger-ui .opblock .opblock-summary { border: none; }
.swagger-ui .opblock .opblock-summary-method { border-radius: 8px; font-weight: 700; min-width: 86px; }

/* GET → blend into the sky palette (GET is blue by convention) */
.swagger-ui .opblock.opblock-get { background: var(--sky-50); border-color: var(--sky-200); }
.swagger-ui .opblock.opblock-get .opblock-summary-method { background: var(--sky-500); }
.swagger-ui .opblock.opblock-get .opblock-summary { border-color: var(--sky-200); }
/* keep POST/PUT/DELETE semantic colors, just soften the body tint */
.swagger-ui .opblock.opblock-post { background: #F2FBF6; }
.swagger-ui .opblock.opblock-put  { background: #FFF8EF; }
.swagger-ui .opblock.opblock-patch{ background: #F5F2FC; }
.swagger-ui .opblock.opblock-delete{ background: #FFF4F4; }

/* ---- buttons / execute ---- */
.swagger-ui .btn { border-radius: 8px; }
.swagger-ui .btn.execute {
  background: var(--sky-600); border-color: var(--sky-600); color: #fff; font-weight: 700;
}
.swagger-ui .btn.execute:hover { background: var(--sky-700); border-color: var(--sky-700); }

/* ---- inputs / selects focus ---- */
.swagger-ui select, .swagger-ui input[type=text], .swagger-ui textarea {
  border-radius: 8px; border: 1px solid var(--line);
}
.swagger-ui select:focus, .swagger-ui input[type=text]:focus, .swagger-ui textarea:focus {
  outline: none; border-color: var(--sky-400); box-shadow: 0 0 0 3px rgba(56,189,248,.25);
}

/* ---- tables ---- */
.swagger-ui table thead tr th, .swagger-ui table thead tr td {
  color: var(--sky-700); border-bottom: 2px solid var(--sky-200);
}

/* ---- models section ---- */
.swagger-ui section.models { border: 1px solid var(--line); border-radius: 12px; }
.swagger-ui section.models.is-open h4 { border-bottom: 1px solid var(--sky-200); }
.swagger-ui section.models h4 span, .swagger-ui section.models .models-control { color: var(--sky-700); }

/* ---- response status / blocks ---- */
.swagger-ui .responses-inner h4, .swagger-ui .responses-inner h5 { color: var(--ink); }

/* ---- scrollbar ---- */
*::-webkit-scrollbar { height: 10px; width: 10px; }
*::-webkit-scrollbar-thumb { background: var(--sky-300); border-radius: 8px; }
*::-webkit-scrollbar-thumb:hover { background: var(--sky-400); }
*::-webkit-scrollbar-track { background: var(--sky-50); }
