:root {
    --primary-bg-color: #f6f8fb;
    --primary-bg-grey: #eeeeee;
    --primary-bg-lt: #f6f8fb;
    --primary-text-color: #111827;
    --title-text-color: #1565C0;
    --muted-text-color: #434343;
    --card-bg-color: #ffffff;
    --card-text-color: #111827;
    --common-border: #e5e7eb;
    --critical: #ef5351;
    --high: #ffa726;
    --medium: #ffd600;
    --low: #2bb6f6;
    --info: #1565C0;
    --action: #8c63cc;
    --unscored: #9e9e9e;
    --common-shadow: 0 1px 2px rgba(0,0,0,0.04);
    --common-shadow-hover: 0 6px 18px rgba(0,0,0,0.08);
    --common-radius: 12px;
}

body {
    background: var(--primary-bg-color);
    color: var(--primary-text-color);
    font-family: "proxima-nova", sans-serif;
    text-align: center;
    font-size: 100%;
    font-weight: 100;
}

pre {
    border: 1px solid var(--common-border);
    border-radius: var(--common-radius);
    max-height: 200px;
    overflow: scroll;
    padding-top: 15px;
    padding-bottom: 15px;
}

h1 {
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-bottom: 0.25rem;
}

h2 {
    font-size: 1.75rem;
    font-weight: 600;
    letter-spacing: -0.02em;
    margin-bottom: 0.25rem;
}

h3 {
    font-size: 1.5rem;
    font-weight: 500;
    letter-spacing: -0.02em;
    margin-bottom: 0.25rem;
}

h4 {
    font-size: 1.25rem;
    font-weight: 400;
    letter-spacing: -0.02em;
    margin-bottom: 0.25rem;
}

/*
 * ****************************************************** GENERICS
*/

.label {
    font-size: 0.75rem;
    color: var(--muted-text-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.value {
    font-size: 1.4rem;
    font-weight: 700;
    margin-top: 0.25rem;
}

/*
 * ****************************************************** WRAPPER LAYOUT
*/

.wrapper{
    background-color: #fff;
    border: 1px solid #f0f3f7;
    -webkit-transition: -webkit-transform .25s cubic-bezier(.215,.61,.355,1),-webkit-box-shadow .25s cubic-bezier(.215,.61,.355,1);
    transition: -webkit-transform .25s cubic-bezier(.215,.61,.355,1),-webkit-box-shadow .25s cubic-bezier(.215,.61,.355,1);
    transition: transform .25s cubic-bezier(.215,.61,.355,1),box-shadow .25s cubic-bezier(.215,.61,.355,1);
    transition: transform .25s cubic-bezier(.215,.61,.355,1),box-shadow .25s cubic-bezier(.215,.61,.355,1),-webkit-transform .25s cubic-bezier(.215,.61,.355,1),-webkit-box-shadow .25s cubic-bezier(.215,.61,.355,1);
    padding:  30px;
    filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2));
    max-width: 90%;
    margin-top:  5%;
    margin-bottom: 5%;
    margin-left: auto;
    margin-right: auto;
    padding-top:  2%;
    border-radius:  0.25em;
    background-image: url("../img/ux/swatch_ur.png");
    background-position: top right;
    background-repeat: no-repeat;
}

/*
 * ******************************************************* HEADER LAYOUT
*/

.header {
    margin: 15px;
    margin-bottom: 40px;
}

.header .feature-img {
    height: 200px;
}

.header .top-left {}
.header .top-center {}
.header .top-center .pfp {margin:15px;}
.header .top-center .title {font-size : 2.5em;}
.header .top-center .subtitle {font-size : 1.5em;}

.header .top-right {
    display: inline-table;
    width: 100%;
    vertical-align: middle;
}

.header .top-right p {
    float: right;
    text-align: right;
    width: 90%;
}

/*
 * ****************************************************** CONTENT LAYOUT
*/

.content {
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 10px;
}
.content .middle-left {}
.content .middle-center {}
.content .middle-right {}

/*
 * ****************************************************** FOOTER LAYOUT
*/

.footer {
    min-height: 100px;
    background-image: url("../img/branding/powered_by_nimble.png");
    background-size:   225px;
    background-repeat: no-repeat;
    background-position: right bottom;
}
.footer .bottom-left {}
.footer .bottom-center {}
.footer .bottom-right {}

/*
 * ****************************************************** POST LAYOUT
*/

.post {}

h1.post-title {
    font-size: 1.5rem;
    text-align: left;
    color: var(--title-text-color);
    padding-top: 15px;
    padding-bottom: 5px;
    padding-left: 20px;
}

h3.post-date {
    font-size: 1rem;
    text-align: left;
    color: var(--muted-text-color);
    padding-top: 5px;
    padding-bottom: 15px;
    padding-left: 20px;
}

.post .date {}
.post .body {}


/*
 * **************************************************************** BUTTONS
*/


* {box-sizing: border-box;}

*:focus,
*:active {
    outline: none !important;
    -webkit-tap-highlight-color: transparent;
}

.button-wrapper {
    display: inline-flex;
    list-style: none;
}

.button-wrapper.top {
    margin-top: 100px;
}

.button-wrapper.bottom {
    margin-top: 25px;
}

.button-wrapper img.icon-img {
    width: 20px;
}

.button-wrapper .icon {
    position: relative;
    background: #ffffff;
    border-radius: 50%;
    padding: 15px;
    margin: 10px;
    border: 1px solid #a8dade;
    width: 60px;
    height: 60px;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.button-wrapper .tooltip {
    position: absolute;
    top: 0;
    font-size: 14px;
    background: #ffffff;
    color: #303030;
    padding: 5px 8px;
    border-radius: 5px;
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.1);
    opacity: 0;
    pointer-events: none;
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    text-align: center;
    border: 2px solid #fff;
    width: 150px;
    background: #fff;
}

.button-wrapper .tooltip::before {
    position: absolute;
    content: "";
    height: 8px;
    width: 8px;
    background: #ffffff;
    bottom: -3px;
    left: 50%;
    transform: translate(-50%) rotate(45deg);
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.button-wrapper .icon:hover {border: 2px solid #fff;}

.button-wrapper .icon:hover .tooltip {
    top: -45px;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.button-wrapper .icon:hover span,
.button-wrapper .icon:hover .tooltip {
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.1);
}

.button-wrapper .contact:hover {
    background: #f1fbf0;
    color: #303030;
}


.button-wrapper .contact:hover .tooltip::before {
    background: #f1fbf0;
    color: #303030;
}

.button-wrapper .contact:hover .tooltip {
    background: #f1fbf0;
    color: #303030;
    border: 2px solid #f1fbf0;
}

/*
 * ****************************************************** CONTENT CONTAINERS
*/

.container.main {
    padding: 1.5rem 1rem;
}

.report-row {}
.report-col-12 {}
.report-col-9 {}
.report-col-3 {}
.text-container {}
.lead {}

.sidebar {}
.sidebar-body {}
.sidebar-table {
    width: 95%;
    margin-top: 35px;
    margin-bottom: 15px;
}

/*
 * ****************************************************** CARDS
*/

.card-row {}
.card-col-3 {}

.card {
    color: var(--card-text-color);
    background: var(--card-bg-color);
    border: 1px solid var(--common-border);
    border-radius: var(--common-radius);
    box-shadow: var(--common-shadow);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    padding: 5px;
    width: 95%;
    margin-bottom: 5px;
    margin-top: 5px;
}

/*
.card:hover {
    transform: translateY(-2px);
    box-shadow: var(--common-shadow-hover);
}
*/

.card-header {
    font-weight: 600;
    font-size: 0.9rem;
    color: var(--card-text-color);
    background: transparent;
    border-bottom: 1px solid var(--common-border);
}

.card-body {}

/*
 * ****************************************************** CVE
*/

.cve-row {
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 15px;
    text-align: left;
}

h2.cve-title {
    color: var(--title-text-color);
    padding-top: 15px;
    padding-bottom: 15px;
}

h4.cve-vuln {
    padding-top: 5px;
    padding-bottom: 5px;

}

.cve-description {
    padding-top: 5px;
    padding-bottom: 5px;

}

.cve-action {
    border: 1px solid var(--action);
    border-radius: var(--common-radius);
    padding: 15px;
    background-image: url("../img/icons/action.png");
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: 15px center;
    padding-left: 90px;
}

.cve-date {
    background-image: url("../img/icons/calendar.png");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: 0 -2px;
    margin-top: 15px;
    margin-bottom: 15px;
    padding-left: 25px;
}

.cve-status {
    background: var(--primary-bg-lt);
    padding: 7px;
    border-radius: var(--common-radius);
}

table.cve-vendor-table {
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
}

table.cve-vendor-table td.cve-vendor-label {
    font-size: 85%;
    font-weight: bold;
    border-bottom: 1px solid var(--common-border);
}

table.cve-vendor-table td.cve-vendor-name {
    padding-bottom: 25px;
}

table.cve-vendor-table td.cve-product-label {
    font-size: 85%;
    font-weight: bold;
    border-bottom: 1px solid var(--common-border);
}

table.cve-vendor-table td.cve-product-name {
    padding-bottom: 25px;
}


table.cve-epss-table {
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
}

table.cve-epss-table td.cve-epss-label {
    font-size: 85%;
    font-weight: bold;
    border-bottom: 1px solid var(--common-border);
}

table.cve-epss-table td.cve-epss-value {
    padding-bottom: 25px;
}

table.cve-epss-table td.cve-percentile-label {
    font-size: 85%;
    font-weight: bold;
    border-bottom: 1px solid var(--common-border);
}

table.cve-epss-table td.cve-percentile-name {
    padding-bottom: 25px;
}

.cvss_metrics {
    padding-top: 15px;
    padding-bottom: 15px;
}
.cvss_metrics .v31 {}
.cvss_metrics .v30 {}
.cvss_metrics .v40 {}
.cvss_metrics .v2 {}

/*
 * ****************************************************** KPI & STATISTICS
*/

.kpi-row {
    padding: 0px;
}

.kpi-row .card-col-3 {
    padding: 0px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.kpi-row .card {
    text-align: center;
}

.kpi-row .cve-today {
    background-image: url("../img/icons/info.png");
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: 15px center;
    padding-left: 65px;
}

.kpi-row .cve-l7d {
    background-image: url("../img/icons/info-l7d.png");
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 25px center;
    padding-left: 65px;
}

.kpi-row .cwe-today {
    background-image: url("../img/icons/info-high.png");
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: 15px center;
    padding-left: 65px;
}

.kpi-row .cwe-l7d {
    background-image: url("../img/icons/info-high-l7d.png");
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 25px center;
    padding-left: 65px;
}

.kpi-row .cve-critical {
    background-image: url("../img/icons/critical.png");
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: 15px center;
    padding-left: 65px;
}

.kpi-row .cve-critical-l7d {
    background-image: url("../img/icons/critical-l7d.png");
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 25px center;
    padding-left: 65px;
}

.kpi-row .cve-high {
    background-image: url("../img/icons/high.png");
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: 15px center;
    padding-left: 65px;
}

.kpi-row .cve-high-l7d {
    background-image: url("../img/icons/high-l7d.png");
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 25px center;
    padding-left: 65px;
}

.kpi-row .cve-medium {
    background-image: url("../img/icons/medium.png");
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: 15px center;
    padding-left: 65px;
}

.kpi-row .cve-medium-l7d {
    background-image: url("../img/icons/medium-l7d.png");
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 25px center;
    padding-left: 65px;
}

.kpi-row .cve-low {
    background-image: url("../img/icons/low.png");
    background-size: 50px;
    background-repeat: no-repeat;
    background-position: 15px center;
    padding-left: 65px;
}

.kpi-row .cve-low-l7d {
    background-image: url("../img/icons/low-l7d.png");
    background-size: 30px;
    background-repeat: no-repeat;
    background-position: 25px center;
    padding-left: 65px;
}

/*
 * ****************************************************** SEVERITY BADGES
 * One badge per available score source (EPSS + each CVSS version present).
 * Colors reuse the severity vars already defined in :root above.
*/

.isj-badge-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.isj-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: 0.02em;
    white-space: nowrap;
}

.isj-badge-source {
    font-weight: 600;
    opacity: 0.85;
    text-transform: uppercase;
    font-size: 0.65rem;
}

.isj-badge-score {
    font-weight: 400;
    opacity: 0.85;
}

.isj-badge-critical { background-color: var(--critical); }
.isj-badge-high     { background-color: var(--high); }
.isj-badge-medium   { background-color: var(--medium); color: #111827; }
.isj-badge-low      { background-color: var(--low); }
.isj-badge-none     { background-color: var(--unscored); }
.isj-badge-unscored { background-color: var(--unscored); }
.isj-badge-undetermined { background-color: var(--unscored); }

/*
 * ****************************************************** CWE SECTION
*/

.isj-section-separator {
    border: none;
    border-top: 2px solid var(--common-border);
    margin-top: 40px;
    margin-bottom: 30px;
}

.isj-section-header {
    text-align: left;
    padding: 15px 15px 25px 15px;
}

.isj-section-title {
    color: var(--title-text-color);
    font-weight: 700;
    font-size: 56px;
}

.isj-section-subtitle {
    color: var(--muted-text-color);
    font-size: 0.95rem;
    margin-top: 5px;
}

.cwe-row {
    text-align: left;
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 15px;
    border-bottom: 1px solid var(--common-border);
}

h2.cwe-title {
    color: var(--title-text-color);
    padding-top: 15px;
    padding-bottom: 5px;
}

h4.cwe-vuln {
    padding-top: 5px;
    padding-bottom: 5px;
}

.cwe-status {
    background: var(--primary-bg-lt);
    display: inline-block;
    padding: 5px 10px;
    border-radius: var(--common-radius);
    margin-bottom: 10px;
}

.cwe-description,
.cwe-diagram-wrapper,
.cwe-alt-terms,
.cwe-platforms,
.cwe-consequences,
.cwe-mitigations {
    margin-top: 20px;
    margin-bottom: 20px;
}

.cwe-diagram-wrapper {
    text-align: center;
}

.cwe-diagram {
    max-width: 100%;
    height: auto;
    border: 1px solid var(--common-border);
    border-radius: var(--common-radius);
    background: #ffffff;
}

.cwe-alt-term-name {
    font-weight: 700;
    color: var(--title-text-color);
}

table.cwe-alt-terms-table td {
    border-bottom: 1px solid var(--common-border);
}

table.cwe-alt-terms-table tbody tr:last-child td {
    border-bottom: none;
}

.cwe-likelihood {
    margin-bottom: 15px;
}

.cwe-abstraction {
    margin-bottom: 15px;
}

.cwe-related {
    margin-top: 15px;
}

table.cwe-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
    font-size: 0.9rem;
}

table.cwe-table th {
    text-align: left;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--muted-text-color);
    border-bottom: 2px solid var(--common-border);
    padding: 8px 10px;
}

table.cwe-table td {
    text-align: left;
    vertical-align: top;
    padding: 8px 10px;
    border-bottom: 1px solid var(--common-border);
}

table.cwe-table tbody tr:hover {
    background: var(--primary-bg-lt);
}

table.cwe-related-table td a {
    color: var(--title-text-color);
    font-weight: 600;
    text-decoration: none;
}

table.cwe-related-table td a:hover {
    text-decoration: underline;
}

/*
 * ****************************************************** BADGE LABEL-ABOVE PATTERN
*/

.isj-badge-label {
    font-size: 0.75rem;
    color: var(--muted-text-color);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 5px;
}

/*
 * ****************************************************** TOP SUMMARY BADGE MATRIX
*/

table.isj-badge-matrix {
    width: 100%;
    border-collapse: collapse;
    background: var(--card-bg-color);
    border: 1px solid var(--common-border);
    border-radius: var(--common-radius);
    overflow: hidden;
}

table.isj-badge-matrix th,
table.isj-badge-matrix td {
    padding: 12px 10px;
    text-align: center;
    border-bottom: 1px solid var(--common-border);
}

table.isj-badge-matrix thead th {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--muted-text-color);
    background: var(--primary-bg-lt);
}

.isj-badge-matrix-corner {
    text-align: left;
    vertical-align: bottom;
}

.isj-badge-matrix-sev-head {
    text-align: center;
    border-left: 2px solid var(--common-border);
}

.isj-badge-matrix-subhead {
    font-size: 0.65rem !important;
    font-weight: 400;
    padding-top: 2px !important;
    padding-bottom: 8px !important;
}

.isj-badge-matrix-subhead:nth-child(odd) {
    border-left: 2px solid var(--common-border);
}

.isj-badge-matrix-source {
    text-align: left;
    font-weight: 600;
}

.isj-badge-matrix-today {
    font-weight: 700;
    border-left: 2px solid var(--common-border);
}

.isj-badge-matrix-l7d {
    color: var(--muted-text-color);
}

.isj-badge-matrix-empty {
    color: var(--common-border);
}

.isj-count-zero {
    font-weight: 400;
    color: var(--muted-text-color);
}

.isj-count-circle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid;
    font-weight: 700;
    background: var(--card-bg-color);
}

.isj-count-critical { border-color: var(--critical); color: var(--primary-text-color); }
.isj-count-high     { border-color: var(--high); color: var(--primary-text-color); }
.isj-count-medium   { border-color: var(--medium); color: var(--primary-text-color); }
.isj-count-low      { border-color: var(--low); color: var(--primary-text-color); }

/*
 * ****************************************************** 2ND SUMMARY :: DOT LINK LISTS
*/

.isj-dot-link-list {
    list-style: none;
    padding-left: 0;
    margin-top: 8px;
    margin-bottom: 0;
    text-align: left;
}

.isj-dot-link-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
}

.isj-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}

.isj-dot-critical { background-color: var(--critical); }
.isj-dot-high     { background-color: var(--high); }
.isj-dot-medium   { background-color: var(--medium); }
.isj-dot-low      { background-color: var(--low); }
.isj-dot-unscored { background-color: var(--unscored); }

.isj-dot-link {
    color: var(--info);
    text-decoration: underline;
    font-size: 0.9rem;
}

.isj-dot-link:hover {
    color: var(--title-text-color);
}

.isj-badge-matrix-legend {
    text-align: right;
    font-size: 0.8rem;
    color: var(--muted-text-color);
    margin-top: 8px;
}

/*
 * ****************************************************** CVE CVSS TABLES (replaces <pre> dumps)
*/

.cve-cvss-block {
    margin-top: 15px;
    margin-bottom: 15px;
}

table.cve-cvss-table th {
    width: 35%;
}

table.cve-cvss-table-4col th,
table.cve-cvss-table-4col td {
    padding: 5px 8px;
    font-size: 0.85rem;
}

table.cve-cvss-table-4col th {
    width: auto;
    white-space: nowrap;
    font-size: 0.7rem;
    text-transform: uppercase;
    color: var(--muted-text-color);
    border-bottom: none;
}

table.cve-cvss-table-4col th:nth-child(3) {
    border-left: 2px solid var(--common-border);
}

table.cve-cvss-table-4col td:nth-child(4) {
    border-left: none;
}

.cve-cvss-vector {
    font-family: monospace;
    font-size: 0.8rem;
    word-break: break-all;
}

/*
 * ****************************************************** CVE SIDEBAR :: RELATED CWEs
*/

table.isj-xref-table {
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
}

td.isj-xref-label {
    font-size: 85%;
    font-weight: bold;
    border-bottom: 1px solid var(--common-border);
}

td.isj-xref-links {
    padding-top: 8px;
    padding-bottom: 25px;
}

a.isj-xref-link {
    display: inline-block;
    background: var(--info);
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    margin-right: 6px;
    margin-bottom: 6px;
    text-decoration: none;
}

a.isj-xref-link:hover {
    opacity: 0.85;
}

.isj-xref-nolink {
    display: inline-block;
    background: var(--unscored);
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    margin-right: 6px;
    margin-bottom: 6px;
}