@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:ital,wght@0,300..800;1,300..800&display=swap');

:root {
    /* Legacy */
    --rkkp-green: rgb(192, 215, 49);
    --rkkp-green-dark: rgb(169, 189, 43);
    --rkkp-green-darkest: rgb(146, 163, 36);
    --rkkp-green-light: rgb(242, 247, 214);
    --rkkp-gray: rgb(88, 89, 91);
    --gray-light: rgb(248, 248, 248);
    --text-color: rgb(0, 0, 0);

    --card-subtitle-color: rgb(133, 133, 133);
    --green-element-line-margin: 11pt;

    /* SundK */

	/* Primary Colors */
	--colorSundK-primary-blue : #162e59;
	--colorSundK-primary-lightblue : #D8E5FF;
	/* Secondary Colors */
	--colorSundK-secondary-dark-purple : #231b63;
	--colorSundK-secondary-light-purple : #e6e0ff;
	--colorSundK-secondary-yellow : #ffde50;
	/* Tertiary Colors */
	--colorSundK-tertiary-mint : #46ded1;
	--colorSundK-tertiary-light-mint : #ecffed;
	--colorSundK-tertiary-petroleum : #243547;
	--colorSundK-tertiary-light-yellow : #ffffe0;
	--colorSundK-tertiary-orange: #ff8b25;
	--colorSundK-tertiary-brown: #684800;
	--colorSundK-tertiary-light-red: #ffd7e0;
	--colorSundK-tertiary-pink: #d0396b;
	--colorSundK-tertiary-green: #30cb72;
	--colorSundK-tertiary-light-green: #dfffea;
	--colorSundK-tertiary-dark-green: #243634;

	/* Other colors */
	--colorSundK-primary-blue-hover: #233f74;
	--colorSundK-white-text: #fff;
	--colorSundK-black-text: #000;

	/* Borders */
	--colorSundK-border-1: 1px;
	--colorSundK-border-style: solid;
	--colorSundK-border-trans: rgba(0, 0, 0, 0.2);
	--colorSundK-border: #243547;

	/* Elements */
	--objectBody-bg: var(--colorSundK-tertiary-light-yellow);
	--search-border: var(--colorSundK-tertiary-petroleum);
	--search-bg: var(--colorSundK-tertiary-light-mint);
	--sundk-badge-color: var(--colorSundK-white-text)    
}

/* Font overrides */

body {
	font-family: "Host Grotesk", serif;
	font-optical-sizing: auto;
	font-weight: 300;
	font-style: normal;
}

.content h1 span {
    border-bottom: 5px solid var(--colorSundK-primary-blue);
    display: inline-block;
    padding-bottom: 2px;
    font-size: 3rem;
    
}  

/* Regular Elements */


.header-wrapper {
    background-color: rgba(var(--bs-tertiary-bg-rgb), 1) !important;
    border-bottom: var(--colorSundK-border-1) var(--colorSundK-border-style) var(--colorSundK-border-trans) !important;
}


.logo-container {
    padding: 10px 10px;
}

body {
    word-wrap: break-word;
}

.scrolled-down {
    transform: translateY(-100%);
    transition: all 0.3s ease-in-out;
}

.scrolled-up {
    transform: translateY(0);
    transition: all 0.3s ease-in-out;
}

/*

Navigation Sticky

*/

.sticky-sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 5rem;
    /* Adjust top space based on your header/nav height */
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 1000;
    height: calc(100vh - 6rem);
    /* Adjust based on top and any additional bottom space */
    padding-left: 0.25rem;
    margin-left: -0.25rem;
}

@media (max-width: 992px) {
    .sticky-sidebar {
        position: static;
        height: auto;
        overflow-y: visible;
    }
}


/*

Table classes

*/

.header {
    text-align: center;
}

.data {
    text-align: center;
}

.table {
    border:0;
    margin-top: 2.5rem;
}

.table-group-divider {
    border-bottom-color: var(--colorSundK-primary-blue);
    border-bottom-width: 1px !important;
    border-top-width: 1px !important;
    border-top-color: var(--colorSundK-primary-blue);
}

.l {
    text-align: left;
}

.r {
    text-align: right;

}

.c {
    text-align: center;
}

/*

Content Classes

*/

h6,
.h6,
h5,
.h5,
h4,
.h4,
h3,
.h3,
h2,
.h2,
h1,
.h1 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}



h1::before {
    display: block;
    content: " ";
    margin-top: -100px;
    height: 100px;
    visibility: hidden;
    pointer-events: none;
}

.content-header {
    text-align: center;
}

section {
    margin-top: 2rem;
    margin-bottom: 3rem;
}

.section-m0 {
    margin-top: 2rem;
    margin-bottom: 0;
}

.data-card {
    margin-bottom: 1rem;
}

.footer-wrapper {
    background-color: var(--colorSundK-primary-blue);
    border-top: 1px solid black;
    color: white;
}

.footer-wrapper a,
.footer-wrapper a:active,
.footer-wrapper a:hover,
.footer-wrapper a:focus {
    color: white;
    text-decoration: none;
}

/*

Bootstrap Overrides

Buttons

*/


.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--colorSundK-primary-blue);
    --bs-btn-border-color: var(--colorSundK-primary-blue);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--colorSundK-primary-blue-hover);
    --bs-btn-hover-border-color: var(--colorSundK-primary-blue-hover);
    --bs-btn-focus-shadow-rgb: 49, 132, 253;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--colorSundK-primary-blue);
    --bs-btn-active-border-color: var(--colorSundK-primary-blue);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #var(--rkkp-green);
    --bs-btn-disabled-border-color: #var(--rkkp-green-dark);
}

.btn-primary:hover {
    color: #fff;
}

.btn-check:checked+.btn,
:not(.btn-check)+.btn:active,
.btn:first-child:active,
.btn.active,
.btn.show {
    color: #fff;
}

.content-container {
    transition: visibility 0s, opacity 0.5s linear;
    /* Adjust timing as needed */
    height: auto;
    /* Let content define the height */
    opacity: 0;
    visibility: hidden;
}

.content-container.show {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s, 0s;
    /* Apply immediately when adding the class */
}

.media {
    background: transparent;
    border-bottom: 1px solid var(--colorSundK-primary-blue);
    padding: 0.5rem 1rem !important;
    border: 3px solid white;
}

.media-sticky {
    position: -webkit-sticky;
    /* For Safari */
    position: sticky;
    top: 67px;
    /* Distance from the top of the viewport */
    z-index: 1000;
    background-color: white;
    border: 3px dashed var(--colorSundK-primary-blue);
    padding: 0.5rem 1rem !important;
    -webkit-box-shadow: 0px 3px 13px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 3px 13px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 3px 13px 0px rgba(0, 0, 0, 0.3);
}

.media-object.show {
    display: block;
}

.media-object.hidden {
    display: none;
}

.media-file-image {
    height: 50vh !important;
    overflow: auto;
}

.media-file-image .image {
    max-height: 45vh !important;
}

.media-file-table {
    height: 50vh !important;
    overflow: auto;
    border-bottom: 1px solid var(--rkkp-gray);
}

.media-file-all-print {
    border-bottom: 1px solid var(--rkkp-gray);
}


.media-info {
    text-align: center;
    font-size: 0.875em;
}

.title {
    font-weight: 600;
}

.description {
    font-style: italic;
}

.media-info.hidden {
    display: none !important;
}

.attachment-file .image{
    max-height: 60vh !important;
}


/*

Bootstrap Overrides

List-group (Navigation)

*/

.list-group-item {
    position: relative;
    display: block;
    padding: 6px 0px 6px 26px;
    color: var(--text-color);
    text-decoration: none;
    background-color: transparent;
    border: var(--bs-list-group-border-width) solid transparent;
}

.list-group-item.headline {
    font-size: calc(1.275rem + 0.3vw);
}

.list-group-item a,
.list-group-item a:active,
.list-group-item a:hover,
.list-group-item a:focus {
    color: var(--text-color);
    text-decoration: none;
}

.list-group-item a.active {
    color: var(--text-color);
    font-weight: 600;
}

.list-group-item.headline a.active {
    color: var(--text-color);
    font-weight: var(--bs-body-font-weight);
}

/*

Bootstrap Overrides

Cards

*/

.card-header {
    font-weight: 600;
}

.card-subtitle {
    margin-top: calc(-0.5 * var(--bs-card-title-spacer-y));
    margin-bottom: var(--bs-card-title-spacer-y);
    color: var(--card-subtitle-color);
    font-weight: var(--bs-body-font-weight);
    font-size: var(--bs-body-font-size);
    font-weight: var(--bs-body-font-weight);
    line-height: var(--bs-body-line-height);
}

.btn .show-btn {
    display: inline
}

.btn:not(.collapsed) .show-btn {
    display: none
}

.btn.collapsed .hide-btn {
    display: none
}

/*

Print Rules and PDF generation

*/

@media print {
    /* page-break-after works, as well */
    .pagebreak {
        page-break-before: always;
    }
    body {
        font-size: 11px;
        margin: 0 !important;
        padding: 0 !important;
        page-break-before: : avoid;
        page-break-after: avoid;
    }
    p {
        padding: 0 !important;
        margin: 0 0 8pt 0 !important;
    }
    h1,
    h2,
    h3,
    h4,
    h5 {
        page-break-after: avoid;
        padding: 0 !important;
    }
    h1 {
        font-size: 18px;
        margin: 12pt 0 12pt 0 !important;
    }
    h2 {
        font-size: 16px;
        margin: 8pt 0 8pt 0 !important;
    }
    h3 {
        font-size: 14px;
        margin: 8pt 0 8pt 0 !important;
    }
    h4 {
        font-size: 12px;
        text-decoration: italic;
        margin: 8pt 0 8pt 0 !important;
    }
    section {
        padding: 0 !important;
        margin: 0 !important;
    }
    hr {
        color: var(--colorSundK-primary-blue);
    }
    .data-card {
        page-break-inside: avoid;
    }
    .media {
        padding: 0 !important;
        border-bottom: 0 !important;
    }
    .media-object {
        page-break-inside: avoid;
        padding: 0 !important;
        margin-bottom: 5pt !important;
        border-bottom: 2px solid var(--colorSundK-primary-blue);
    }
    .media-file-image {
        height: 100% !important;
    }
    .media-file-table {
        border-bottom: 0;
    }
    .media-info {
        text-align: left !important;
        min-height: auto !important;
    }
    .title {
        border-top-width: 2px !important;
        border-top-style: solid !important;
        border-top-color: var(--colorSundK-primary-blue) !important;
        border-radius: 0px !important;
        font-size: 14px;
        padding-top: var(--green-element-line-margin) !important;
    }
    .description {
        font-style: normal !important;
    }
    .content {
        padding: 0 !important;
    }

    .header-wrapper {
        border-bottom: 0px;
    }

    .nav-col {
        height: 0px;
    }

    .card {
        border-right: 0px;
        border-left: 0px;
        border-top: 0px;
        border-bottom: 2px solid var(--colorSundK-primary-blue);
        border-radius: 0px;
        padding: 0 !important;
        padding-bottom: var(--green-element-line-margin) !important;
    }

    .card-header {
        border: 0px;
        padding-left: 0 !important;
        padding-right: 0 !important;
        background: transparent;
        page-break-after: avoid;
    }
    .card-body {
        padding: 0 !important;
        page-break-inside: avoid;
    }
    table {
        page-break-after: always;
        margin: 0 !important;
    }

    @page: first {
        margin-top: 2.54cm;
        margin-bottom: 2.54cm;
        margin-left: 1.91cm;
        margin-right: 1.91cm;
    }

    @page {
        margin-top: 2.54cm;
        margin-bottom: 2.54cm;
        margin-left: 1.91cm;
        margin-right: 1.91cm;
    }
}