/* =========================================================
   RD3 COMPONENTS — CONTENT
   Reusable content presentation components
   ========================================================= */


/* =========================================================
   LISTS
   ========================================================= */

ul,
ol {

    margin-top: 0;

    margin-bottom: 1rem;

    padding-left: 1.5rem;

}


li {

    margin-bottom: 7px;

}


/* Nested lists */

ul ul,
ol ol,
ul ol,
ol ul {

    margin-top: 6px;

    margin-bottom: 6px;

}


/* =========================================================
   UNORDERED LIST VARIANTS
   ========================================================= */

ul.list-disc {

    list-style-type: disc;

}


ul.list-circle {

    list-style-type: circle;

}


ul.list-square {

    list-style-type: square;

}


ul.list-none,
ol.list-none {

    list-style-type: none;

    padding-left: 0;

}


/* Primary bullets */

ul.list-primary {

    list-style: none;

    padding-left: 0;

}


ul.list-primary li {

    position: relative;

    padding-left: 1.35rem;

}


ul.list-primary li::before {

    content: "";

    position: absolute;

    left: 0;

    top: 0.55em;

    width: 0.45em;

    height: 0.45em;

    border-radius: 50%;

    background-color: #993333;

}


/* Checkmark list */

ul.list-check {

    list-style: none;

    padding-left: 0;

}


ul.list-check li {

    position: relative;

    padding-left: 1.6rem;

}


ul.list-check li::before {

    content: "✓";

    position: absolute;

    left: 0;

    top: 0;

    color: #993333;

    font-weight: 700;

}


/* Arrow list */

ul.list-arrow {

    list-style: none;

    padding-left: 0;

}


ul.list-arrow li {

    position: relative;

    padding-left: 1.5rem;

}


ul.list-arrow li::before {

    content: "→";

    position: absolute;

    left: 0;

    top: 0;

    color: #993333;

    font-weight: 600;

}


/* Dash list */

ul.list-dash {

    list-style: none;

    padding-left: 0;

}


ul.list-dash li {

    position: relative;

    padding-left: 1.35rem;

}


ul.list-dash li::before {

    content: "–";

    position: absolute;

    left: 0;

    top: 0;

    color: #64748b;

    font-weight: 600;

}


/* =========================================================
   ORDERED LIST VARIANTS
   ========================================================= */

ol.list-decimal {

    list-style-type: decimal;

}


ol.list-alpha {

    list-style-type: lower-alpha;

}


ol.list-alpha-upper {

    list-style-type: upper-alpha;

}


ol.list-roman {

    list-style-type: lower-roman;

}


ol.list-roman-upper {

    list-style-type: upper-roman;

}


/* Zero-padded numbers */

ol.list-zero {

    list-style: none;

    padding-left: 20px;

    counter-reset: rd3-zero;

}


ol.list-zero > li {

    position: relative;

    padding-left: 2.2rem;

    counter-increment: rd3-zero;

}


ol.list-zero > li::before {

    content: counter(rd3-zero, decimal-leading-zero) ".";

    position: absolute;

    left: 0;

    top: 0;

    color: #993333;

    font-weight: 700;

    font-size: 0.9em;

}


/* Primary-coloured numbers */

ol.list-primary {

    list-style: none;

    padding-left: 0;

    counter-reset: rd3-primary;

}


ol.list-primary > li {

    position: relative;

    padding-left: 2rem;

    counter-increment: rd3-primary;

}


ol.list-primary > li::before {

    content: counter(rd3-primary) ".";

    position: absolute;

    left: 0;

    top: 0;

    color: #993333;

    font-weight: 700;

}


/* =========================================================
   LIST UTILITIES
   ========================================================= */

ul.list-tight li,
ol.list-tight li {

    margin-bottom: 3px;

}


ul.list-loose li,
ol.list-loose li {

    margin-bottom: 12px;

}


ul.list-inline {

    list-style: none;

    padding-left: 0;

    margin-bottom: 1rem;

}


ul.list-inline li {

    display: inline-block;

    margin-right: 1rem;

    margin-bottom: 4px;

}


ul.list-inline li:last-child {

    margin-right: 0;

}


/* =========================================================
   CARDS
   ========================================================= */

.card {

    padding: 1.5rem;

    background-color: #ffffff;

    border: 1px solid #e2e8f0;

    border-radius: 6px;

    transition: 0.2s;

}


.card:hover {

    background-color: #f8fafc;

}


.card-bordered {

    border: 2px solid #993333;

}


.card-accent {

    background-color: #f8fafc;

    border: 1px solid #e2e8f0;

    border-left: 4px solid #993333;

    border-radius: 0 6px 6px 0;

}


.card-content{
    padding: 1.5rem;
    height: 100%;
    border: 2px solid #060606;
    border-radius: 8px;
}

.card-title {

    margin-top: 0;

    color: #993333;

    font-weight: 700;

}


.card-link {

    color: #993333;

    font-weight: 600;

}


/* =========================================================
   TABLES
   ========================================================= */

.table-wrapper {

    overflow-x: auto;

    margin: 18px 0;

}


.table {

    width: 100%;

    border-collapse: collapse;

    font-size: 14px;

}


.table th {

    background-color: #993333;

    color: #ffffff;

    text-align: left;

    padding: 10px;

    font-weight: 600;

}


.table td {

    border-bottom: 1px solid #f1f5f9;

    padding: 10px 0;

    vertical-align: top;

    color: #0f172a;

}


.table tbody tr:nth-child(even) td {

    background-color: transparent;

}


/* Key-value summary */

.table-summary {

    width: 100%;

    border-collapse: collapse;

    margin-bottom: 24px;

}


.table-summary td {

    padding: 10px 0;

    border-bottom: 1px solid #f1f5f9;

    font-size: 14px;

    vertical-align: top;

}


.table-summary td:first-child {

    width: 180px;

    color: #64748b;

    font-weight: 600;

}


.table-summary td:last-child {

    color: #0f172a;

}


/* =========================================================
   CODE
   ========================================================= */

code {

    background-color: #f1f5f9;

    border: 1px solid #e2e8f0;

    border-radius: 4px;

    padding: 2px 5px;

    font-family:
        "SFMono-Regular",
        Consolas,
        "Liberation Mono",
        Menlo,
        monospace;

    font-size: 12px;

    color: #0f172a;

}


pre {

    background-color: #0f172a;

    color: #e2e8f0;

    border-radius: 6px;

    padding: 18px;

    overflow-x: auto;

    margin: 15px 0 20px 0;

    font-family:
        "SFMono-Regular",
        Consolas,
        "Liberation Mono",
        Menlo,
        monospace;

    font-size: 12px;

    line-height: 1.6;

}


/* Support plan cards */
.support-plan-card {
	display: flex;
	flex-direction: column;
	height: 100%;
}

.support-plan-link {
	margin-top: auto;
}