﻿
@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,400i,500,600,700,900');

body {
    padding-bottom: 20px;
    padding-top: 98px;
    font-family: "Poppins",Arial,Helvetica Neue,Helvetica,sans-serif;
}

.bg-blue-api {
    background: url(header-bg.png) no-repeat center top !important;
    background-position: center top;
    background-color: #bef1e2 !important;
}


.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

.body-content p, ul {
    line-height: 1.7;
}

.body-content .ulStatus li, .body-content .ulVerbos li {
    margin-bottom: 20px;
}

.body-content .ulStatus li > strong {
    background-color: #efefef;
    border: solid 1px #CCC;
    padding: 6px;
    font-size: 14px;
    font-weight: bold;
    clear: both;
    float: none;
    display: inline-block;
    margin-right: 5px;
}

.body-content .ulVerbos li > strong {
    background-color: #efefef;
    border: solid 1px #b22222;
    color: #b22222;
    padding: 6px;
    font-size: 16px;
    font-weight: bold;
    clear: both;
    float: none;
    display: table;
    display: inline-block;
    margin-right: 5px;
}

.body-content ul {
    list-style-type: none;
    padding-left: 0;
    margin-left: 0;
}

.body-content ul li {
    list-style-type: none;
    padding-left: 0;
    margin-left: 0;
    margin-bottom: 12px;
}

.navbar-dark .navbar-nav .nav-link {
    color: #FFF;
    font-weight: 400;
    margin-right: 12px;
    margin-left: 12px;
    padding-left: 0;
    padding-right: 0;
    border-bottom: 2px solid transparent;
}

.navbar-dark .navbar-nav .nav-link:hover {
    border-bottom: solid 2px #FFF;
}

.navbar-dark.bg-blue {
    background-color: #55bb9f;
    padding-top: 21px;
    padding-bottom: 15px;
}

.navbar-right {
    float: right !important;
}

.navbar-dark .navbar-brand {
    margin-right: 45px;
}

.container {
    max-width: 1170px;
}

.container.rounded {
    border-radius: 8px;
    padding-top: 30px;
    padding-bottom: 20px;
    box-shadow: 0 6px 10px #999;
}

.container.rounded .row {
    margin-left: 0;
    margin-right: 0;
    padding-left: 10px;
    padding-right: 10px;
}

pre {
    padding: 20px;
    background-color: #EFEFEF;
    border-radius: 5px;
}

.jumbotron {
    background-color: transparent !important;
    padding-left: 0;
    padding-right: 0;
}

h2.text-white {
    text-shadow: 0 1px 1px #000;
}

.mb-4x {
    margin-bottom: 32px;  
}

/* IndexMedApi não possui fonte SCSS: esta é a folha legada oficial do MVC. */
:root {
    --api-blue: #0879cf;
    --api-blue-deep: #075a9e;
    --api-blue-soft: #eaf5ff;
    --api-ink: #172438;
    --api-muted: #64748b;
    --api-line: #e5edf5;
    --api-surface: #ffffff;
    --api-canvas: #f7fbff;
}

body.api-site {
    min-height: 100vh;
    padding-top: 86px;
    padding-bottom: 0;
    color: var(--api-ink);
    background:
        radial-gradient(circle at 87% 7%, rgba(8, 121, 207, .10), transparent 25rem),
        linear-gradient(180deg, #fff 0, var(--api-canvas) 100%);
}

.api-navbar {
    min-height: 86px;
    border-bottom: 1px solid rgba(8, 121, 207, .10);
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 8px 28px rgba(19, 51, 85, .08);
}

.api-navbar__inner,
.api-page-shell {
    width: calc(100% - 48px);
    max-width: 1180px;
    margin-right: auto;
    margin-left: auto;
}
.api-navbar__inner {
    min-height: 86px;
    padding-right: 56px;
    padding-left: 56px;
}
.api-navbar__brand { margin-right: 44px; }
.api-navbar__brand img { display: block; width: auto; max-height: 46px; }
.api-navbar__links .navbar-nav { align-items: center; gap: 22px; }
.api-navbar__links .nav-link {
    padding: 10px 0;
    color: #42526a;
    font-size: 13px;
    font-weight: 500;
    transition: color .2s ease;
}
.api-navbar__links .nav-link:hover,
.api-navbar__links .nav-link:focus { color: var(--api-blue); }
.api-navbar .navbar-toggler { border-color: #d9e7f4; }
.api-navbar .navbar-toggler-icon { background-image: none; }
.api-navbar .navbar-toggler-icon:before { color: var(--api-blue); content: "☰"; font-size: 22px; line-height: 1; }

.api-page-shell { padding: 0; }
.api-page-shell a { color: var(--api-blue); }
.api-page-shell a:hover { color: var(--api-blue-deep); text-decoration: none; }

.api-home-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr);
    align-items: center;
    gap: 72px;
    min-height: 520px;
    padding: 78px 56px 56px;
}
.api-eyebrow {
    display: inline-flex;
    align-items: center;
    margin-bottom: 17px;
    color: var(--api-blue);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .10em;
    text-transform: uppercase;
}
.api-home-hero h1,
.api-internal-page__header h1 {
    max-width: 650px;
    margin: 0 0 20px;
    color: var(--api-ink);
    font-size: clamp(34px, 4vw, 52px);
    font-weight: 700;
    letter-spacing: -.045em;
    line-height: 1.08;
}
.api-home-hero__copy > p,
.api-internal-page__header p {
    max-width: 580px;
    margin: 0;
    color: var(--api-muted);
    font-size: 17px;
    line-height: 1.75;
}
.api-home-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.api-btn { border-radius: 8px; padding: 12px 18px; font-size: 13px; font-weight: 600; transition: transform .2s ease, box-shadow .2s ease; }
.api-btn:hover { transform: translateY(-2px); }
.api-btn--primary { color: #fff !important; background: var(--api-blue); box-shadow: 0 9px 18px rgba(8, 121, 207, .22); }
.api-btn--primary:hover { background: var(--api-blue-deep); }
.api-btn--secondary { border: 1px solid #d7e7f5; color: var(--api-blue) !important; background: #fff; }
.api-home-hero__highlights { display: flex; flex-wrap: wrap; gap: 9px 22px; margin: 25px 0 0; }
.api-home-hero__highlights li { margin: 0; color: #52647b; font-size: 12px; }
.api-home-hero__highlights span { margin-right: 6px; color: var(--api-blue); font-weight: 700; }

.api-home-hero__visual {
    position: relative;
    min-height: 330px;
    overflow: hidden;
    border: 1px solid #e6eef7;
    border-radius: 22px;
    background: linear-gradient(135deg, #eff8ff 0%, #e9f5ff 54%, #f8fbff 100%);
}
.api-home-hero__visual:before,
.api-home-hero__visual:after { position: absolute; content: ""; border-radius: 999px; pointer-events: none; }
.api-home-hero__visual:before { width: 320px; height: 320px; top: -180px; right: -90px; background: rgba(8, 121, 207, .11); }
.api-home-hero__visual:after { width: 210px; height: 210px; bottom: -130px; left: -80px; background: rgba(22, 176, 221, .14); }
.api-visual-url {
    position: absolute;
    z-index: 1;
    top: 43px;
    left: 44px;
    right: 44px;
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 54px;
    padding: 0 17px;
    border-radius: 9px;
    color: #b9ddff;
    background: #10253f;
    box-shadow: 0 14px 24px rgba(31, 60, 91, .16);
}
.api-visual-url span { width: 8px; height: 8px; border-radius: 50%; background: #58bdf5; }
.api-visual-url span:nth-child(2) { background: #8ed3ff; }
.api-visual-url span:nth-child(3) { background: #d5efff; }
.api-visual-url code { margin-left: 8px; color: #eaf6ff; font-size: 12px; }
.api-visual-card {
    position: absolute;
    z-index: 1;
    display: grid;
    grid-template-columns: 34px 1fr;
    column-gap: 10px;
    min-width: 185px;
    padding: 14px;
    border: 1px solid rgba(213, 232, 247, .9);
    border-radius: 12px;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 13px 26px rgba(38, 78, 112, .12);
}
.api-visual-card__icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; color: var(--api-blue); background: #e8f5ff; font-weight: 700; }
.api-visual-card strong { align-self: end; color: #1c324b; font-size: 12px; }
.api-visual-card small { align-self: start; color: #738399; font-size: 10px; }
.api-visual-card--auth { top: 130px; left: 32px; }
.api-visual-card--data { top: 180px; right: 26px; }
.api-visual-card--docs { bottom: 27px; left: 93px; }

.api-journey { padding: 62px 56px 78px; }
.api-section-heading { max-width: 600px; margin-bottom: 34px; }
.api-section-heading h2 { margin: 0 0 12px; color: var(--api-ink); font-size: 31px; font-weight: 700; letter-spacing: -.03em; }
.api-section-heading p { margin: 0; color: var(--api-muted); font-size: 15px; line-height: 1.7; }
.api-journey__grid { margin-right: -12px; margin-left: -12px; }
.api-journey-card { min-height: 225px; padding: 26px 28px !important; border-top: 1px solid var(--api-line); }
.api-journey-card__number { display: block; margin-bottom: 25px; color: var(--api-blue); font-size: 11px; font-weight: 700; letter-spacing: .08em; }
.api-journey-card h3 { margin: 0 0 10px; color: var(--api-ink); font-size: 18px; font-weight: 700; }
.api-journey-card p { min-height: 58px; margin: 0 0 16px; color: var(--api-muted); font-size: 13px; line-height: 1.7; }
.api-journey-card a { font-size: 12px; font-weight: 700; }
.api-journey-card a span { margin-left: 4px; }

.api-internal-page { padding: 64px 56px 78px; }
.api-internal-page__header { max-width: 750px; margin-bottom: 36px; }
.api-internal-page__header h1 { font-size: 42px; }
.api-content-card {
    padding: 42px 46px;
    border: 1px solid var(--api-line);
    border-radius: 16px;
    background: var(--api-surface);
    box-shadow: 0 16px 40px rgba(42, 76, 109, .07);
}
.api-content-card p,
.api-page-shell .container.rounded p { color: #43546a; line-height: 1.8; }
.api-content-card h2,
.api-page-shell .container.rounded h3 { margin: 42px 0 16px; color: var(--api-ink); font-size: 24px; font-weight: 700; letter-spacing: -.02em; }
.api-content-card h2 span { color: var(--api-muted); font-size: 16px; font-weight: 500; }
.api-content-card h2:first-of-type { margin-top: 34px; }
.api-intro { color: #263d59 !important; font-size: 16px; font-weight: 500; }
.api-transition-notice,
.api-warning-notice { margin: 28px 0; padding: 17px 19px; border-radius: 10px; }
.api-transition-notice { border: 1px solid #cce9fc; color: #245274 !important; background: #edf8ff; }
.api-warning-notice { border: 1px solid #ffe0a0; color: #77551e !important; background: #fff9e9; }
.api-step-list { padding-left: 23px !important; }
.api-step-list li { margin-bottom: 7px !important; padding-left: 3px !important; list-style: decimal !important; color: #43546a; }
.api-content-card pre,
.api-page-shell .container.rounded pre { overflow-x: auto; padding: 17px 19px; border: 1px solid #e5edf5; border-radius: 9px; color: #234361; background: #f6f9fc; }
.api-next-step { margin-top: 30px; font-weight: 500; }

body.api-site > .container.body-content > .row:first-child h1[style] { color: var(--api-ink) !important; }
body.api-site > .container.body-content > .row:first-child { margin-top: 50px; }
body.api-site .container.rounded { margin-bottom: 58px; padding: 42px 46px; border: 1px solid var(--api-line); border-radius: 16px; box-shadow: 0 16px 40px rgba(42, 76, 109, .07); }
body.api-site .container.rounded .row { padding: 0; }
.api-anchor { height: 1px; margin: 0; overflow: hidden; line-height: 1 !important; }
.api-page-shell .table { border: 1px solid var(--api-line); border-radius: 10px; overflow: hidden; }
.api-page-shell .table thead th { border: 0; color: #33516f; background: #edf7ff; font-size: 12px; }
.api-page-shell .table td { color: #53657a; font-size: 13px; }
.api-page-shell .ulVerbos li > strong,
.api-page-shell .ulStatus li > strong { border-color: #d9e8f5; color: var(--api-blue); background: #f4faff; }

.api-footer { margin-top: 12px; padding: 24px 0 35px; border-top: 1px solid var(--api-line); color: #8390a0; font-size: 11px; }
.api-footer p { margin: 0; }

@media (max-width: 767px) {
    body.api-site { padding-top: 72px; }
    .api-navbar, .api-navbar__inner { min-height: 72px; }
    .api-navbar__brand img { max-height: 36px; }
    .api-navbar__links { margin-top: 8px; padding: 9px 0 14px; border-top: 1px solid var(--api-line); }
    .api-navbar__links .navbar-nav { gap: 0; }
    .api-navbar__links .nav-link { padding: 9px 0; }
    .api-navbar__inner,
    .api-page-shell { width: calc(100% - 36px); }
    .api-navbar__inner { padding-right: 3px; padding-left: 3px; }
    .api-home-hero { grid-template-columns: 1fr; gap: 37px; min-height: auto; padding: 46px 3px 38px; }
    .api-home-hero h1 { font-size: 36px; }
    .api-home-hero__visual { min-height: 300px; }
    .api-visual-url { top: 28px; right: 24px; left: 24px; }
    .api-visual-card--auth { top: 112px; left: 18px; }
    .api-visual-card--data { top: 166px; right: 14px; }
    .api-visual-card--docs { bottom: 20px; left: 54px; }
    .api-journey, .api-internal-page { padding: 44px 3px 54px; }
    .api-section-heading h2 { font-size: 27px; }
    .api-journey-card { min-height: 0; padding: 22px 10px !important; }
    .api-journey-card p { min-height: auto; }
    .api-content-card, body.api-site .container.rounded { padding: 28px 22px; border-radius: 12px; }
    .api-internal-page__header h1 { font-size: 36px; }
    .api-content-card h2, .api-page-shell .container.rounded h3 { font-size: 22px; }
}
