.ipmx-tech-docs {
--ipmx-accent: #007d8f;
--ipmx-accent-bright: #00b7c4;
--ipmx-ink: #1b1f25;
--ipmx-muted: #5b6470;
--ipmx-line: #e3e7eb;
--ipmx-surface: #fff;
--ipmx-ext-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
margin: 1.5rem 0; font-size: 1.5rem;
line-height: 1.55;
} .ipmx-tech-docs__legend {
margin: 0 0 1.5rem;
color: var(--ipmx-muted);
font-size: 0.8em;
font-style: italic;
}
.ipmx-tech-cat {
margin: 0 0 2.25rem;
}
.ipmx-tech-cat__title {
margin: 0 0 0.85rem;
padding-bottom: 0.4rem;
border-bottom: 2px solid var(--ipmx-accent);
font-size: 1.5em;
font-weight: 700;
color: var(--ipmx-ink);
}
.ipmx-tech-cat__list {
list-style: none;
margin: 0;
padding: 0;
display: grid;
gap: 0.75rem;
}
.ipmx-tech-doc {
margin: 0;
padding: 1rem 1.1rem;
background: var(--ipmx-surface);
border: 1px solid var(--ipmx-line);
border-left: 4px solid var(--ipmx-accent);
border-radius: 8px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}
.ipmx-tech-doc__head {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0.5rem 0.9rem;
}
.ipmx-tech-doc__title {
font-size: 1.15em;
font-weight: 700;
color: var(--ipmx-ink);
text-decoration: none;
} a.ipmx-tech-doc__title:hover,
a.ipmx-tech-doc__title:focus {
color: var(--ipmx-accent);
}
.ipmx-tech-doc__ext {
display: inline-block;
width: 0.7em;
height: 0.7em;
margin-left: 0.3em;
vertical-align: baseline;
opacity: 0;
transition: opacity 0.12s ease;
background-color: currentColor;
-webkit-mask: var(--ipmx-ext-mask) no-repeat center / contain;
mask: var(--ipmx-ext-mask) no-repeat center / contain;
}
a.ipmx-tech-doc__title:hover .ipmx-tech-doc__ext,
a.ipmx-tech-doc__title:focus .ipmx-tech-doc__ext {
opacity: 0.85;
}
.ipmx-tech-doc__current {
font-size: 0.72em;
font-weight: 700;
text-decoration: none;
color: #fff;
background: var(--ipmx-accent);
padding: 0.2rem 0.7rem;
border-radius: 999px;
}
.ipmx-tech-doc__current:hover,
.ipmx-tech-doc__current:focus {
background: var(--ipmx-accent-bright);
color: #fff;
}
.ipmx-tech-doc__desc {
margin: 0.55rem 0 0;
color: var(--ipmx-muted);
font-size: 1em;
line-height: 1.55;
}
.ipmx-tech-doc__versions {
list-style: none;
margin: 0.7rem 0 0;
padding: 0;
display: flex;
flex-wrap: wrap;
gap: 0.4rem;
}
.ipmx-tech-ver {
font-size: 0.8em;
}
.ipmx-tech-ver a {
text-decoration: none;
color: var(--ipmx-accent);
border: 1px solid var(--ipmx-line);
border-radius: 6px;
padding: 0.1rem 0.5rem;
background: #f7f9fa;
}
.ipmx-tech-ver a:hover,
.ipmx-tech-ver a:focus {
border-color: var(--ipmx-accent-bright);
color: var(--ipmx-accent-bright);
}
.ipmx-tech-ver.is-current a {
border-color: var(--ipmx-accent);
font-weight: 700;
}
.ipmx-tech-ver__date {
color: var(--ipmx-muted);
margin-left: 0.25rem;
} .ipmx-tech-modes {
list-style: none;
margin: 0.7rem 0 0;
padding: 0 0 0 1rem;
border-left: 2px solid var(--ipmx-accent-bright);
display: grid;
gap: 0.55rem;
}
.ipmx-tech-mode {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0.35rem 0.6rem;
}
.ipmx-tech-mode__tag {
font-size: 0.62em;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
color: var(--ipmx-accent);
background: rgba(0, 125, 143, 0.1);
padding: 0.08rem 0.45rem;
border-radius: 4px;
}
.ipmx-tech-mode__title {
font-size: 1em;
font-weight: 600;
color: var(--ipmx-ink);
text-decoration: none;
}
a.ipmx-tech-mode__title:hover,
a.ipmx-tech-mode__title:focus {
color: var(--ipmx-accent);
}
.ipmx-tech-mode .ipmx-tech-doc__versions {
margin: 0;
flex-basis: 100%;
} .ipmx-tech-downloads {
margin: 0.7rem 0 0;
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0.25rem 0.6rem;
}
.ipmx-tech-downloads__label {
font-size: 0.7em;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
color: var(--ipmx-muted);
}
.ipmx-tech-downloads__list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
gap: 0.35rem 0.9rem;
}
.ipmx-tech-dl {
font-size: 0.85em;
}
.ipmx-tech-dl__link {
text-decoration: none;
font-weight: 600;
color: var(--ipmx-accent);
}
.ipmx-tech-dl__link:hover,
.ipmx-tech-dl__link:focus {
color: var(--ipmx-accent-bright);
text-decoration: underline;
}
.ipmx-tech-dl__desc {
color: var(--ipmx-muted);
}
.ipmx-tech-mode .ipmx-tech-downloads {
margin: 0;
flex-basis: 100%;
}
@media (prefers-color-scheme: dark) {
.ipmx-tech-docs {
--ipmx-ink: #e6e8eb;
--ipmx-muted: #9aa3af;
--ipmx-line: #2c323b;
--ipmx-surface: #1e2329;
--ipmx-accent: #00b7c4;
}
.ipmx-tech-ver a {
background: #161a1f;
}
}