/* global styles */

:root {
    /*
    Text
    */
    --app-color-text-muted: #64748b;
}

.app-centeredPageLayout {
    max-width: 1000px;
    margin: auto;
    padding: 4px;
}

.app-dialog h1,
.app-centeredPageLayout h1 {
    color: var(--basicFontColor);
}

.app-dialog h2,
.app-centeredPageLayout h2 {
    color: var(--basicFontColor);
}

.app-dialog h3,
.app-centeredPageLayout h3 {
    color: var(--basicFontColor);
}

.app-dialog .p-dialog .p-dialog-header .p-dialog-title {
    color: var(--basicFontColor);
}

a.link_button_highlighted.orange {
    background-color: var(--backgroundColor7);
}

button.app_button_transparent,
a.app_button_transparent {
    background-color: transparent;
    border-color: transparent;
}

.app-btn__icon path {
    fill: currentColor !important;
}

.app-btn__icon {
    color: currentColor !important;
}

.app-btn__icon::before {
    color: currentColor !important;
}


.app-details-navigation {
    display: flex;
    justify-content: space-between;
}

.app-term-selector__buttons {
    display: inline-flex;
    justify-content: space-between;
    width: 100%;
    padding-top: 20px;
}

/* Styles von request Detail component */

.request-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.request-buttons--single {
	justify-content: center;
}

.notice-seperator {
    border-top: 1px solid var(--basicButtonBorderColor);
    margin-top: 15px;
    margin-bottom: 15px;
}

.app-request-overview__header {
    display: flex;
    justify-content: space-between;
}

.request-overview__notice-icon {
    display: flex;
    align-items: flex-start;
    gap: 0.25rem;
    padding-left: 0;
}

.request-overview__notice-icon::before {
    content: '';
    display: inline-block;
    flex-shrink: 0;
    width: var(--imageSizeStandard);
    height: var(--imageSizeStandard);
    background-image: url(/HISinOne/images/icons/comment.svg);
    background-repeat: no-repeat;
    background-position: center;
    left: 0;
    vertical-align: middle;
    filter: brightness(0%);
}

.request-overview__application-term {
    color: var(--app-color-text-muted);
}

@media only screen and (max-width: 700px) {
    .request-buttons {
        flex-direction: column;
        align-items: unset;
        justify-content: center;
    }

    .request-buttons button {
        text-align: center;
        display: block;
        width: 100%;
    }
}

/* Styling für application-overview-card.component  */

.action-required-header {
    color: var(--backgroundColor7);
    font-weight: bold;
}

.request-subjects {
    list-style: '';
    padding-left: 0;
}

.request-subjects__item {
    display: flex;
    align-items: flex-start;
    font-weight: 600;
    gap: 0.25rem;
    padding-left: 0;
}

.request-subjects__item::before {
    content: "";
    display: inline-block;
    flex-shrink: 0;
    width: var(--imageSizeStandard);
    height: var(--imageSizeStandard);
    background: url(/HISinOne/images/icons/graduation_cap.svg) no-repeat;
    background-size: contain;
    filter: brightness(0);
    vertical-align: middle;
}


/* Styling für application-overview.component 
muss in experimental.css ausgelagert werden */

.app-requests-collection {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: stretch;
    margin-top: 4px;
    gap: 12px;
    width: 100%;
}

.empty-view {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
}

.empty-view>* {
    flex: none;
    text-align: center;
}

.empty-view-image {
    max-width: 200px;
}

@media only screen and (min-width: 700px) {
    .app-requests-collection {
        flex-direction: row;
    }

    .app-requests-collection>* {
        /* 50% - gap / 2*/
        width: calc(50% - (15px/2));
    }

    .app-requests-collection.single-request>* {
        width: 100%;
    }
}

.application-overview__new-request {
    margin-top: 16px;
}

.progress-bar__bar-container {
    background-color: var(--backgroundColor3);
    border-radius: 4px;
    height: 0.5rem;
    width: 100%;
}

.progress-bar__bar {
    border-radius: 4px;
    width: var(--currentProgress);
    height: 0.5rem;
    background-color: var(--backgroundColor44);
    margin-top: 0.25rem;
}

.progress-bar__label {
    display: flex;
    justify-content: space-between;
}

.progress-bar__step {
    color: var(--app-color-text-muted);
}

.progress-bar {
    margin-top: 1rem;
}

.app-card {
    background-color: white;
    border-radius: var(--borderRadius1);
    word-break: break-word;
    height: 100%;
    padding: 1.5rem 24px 1.5rem 24px;
    border: 1px solid var(--backgroundColor26);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.app-card--skeleton {
    min-height: 296px;
}

.app-card-action {
    margin-top: 8px;
}

.app-card-action a {
    display: flex;
    width: 100%;
    justify-content: center;
}

.app-card.action-required {
    border: 2px solid var(--backgroundColor7);
    box-shadow: 0 4px 12px rgba(198, 78, 19, 0.3);
}

.appShowMoreButton {
    margin-top: 0.5rem;
}

.appShowMoreButton button {
    width: 100%;
    display:flex;
    gap: 4px;
    justify-content: center;
}

.appShowMoreButton svg {
    height: 16px;
    width: 16px;
}

.app-messages__info {
    margin-bottom: 36px;
}

.app-messages-list {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.app-messages-list__item-wrapper {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.app-messages-list__item {
    display: flex;
    flex-direction: column;
    padding: 0.75rem 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: var(--borderRadius2);
}

.app-messages-list__item-button {
    align-self: flex-end;
}

.app-message__title {
    font-weight: 600;
    margin-bottom: 0.25rem;
}

.app-message__text {
    margin-bottom: 0.75rem;
}


.app-card-detail-header {
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
}

.app-card-header-icon {
    margin-right: 8px;
}

.app-card-header-icon::before {
    color: var(--basicFontColor);
}

.app-view-details-button {
    display: flex;
    justify-content: center;
}


.app-tag {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.5rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: var(--borderRadius2);
}

.app-details-tag-container {
    margin-top: 8px;
    display: flex;
    gap: 0.5rem;
}

.app-application-number {
    font-weight: normal;
}

.app_information-overlay {
    display: flex;
    gap: 4px;
}

@media only screen and (max-width: 700px) {
    .app_information-overlay {
        flex-wrap: wrap;
        align-items: center;
    }
}

.app_information-overlay .app-btn__icon {
    flex-shrink: 0;
    flex-grow: 0;
    flex-basis: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.app_information-overlay span:first-child {
    flex: 1;
}

.app-documents-information {
    margin-top: 1.25rem;
}

.app-details__request-subject-header {
    display: flex;
    gap: 4px;
}

.app-details__request-subject-header .app-btn__icon {
    display: inline-flex;
}

.app-details__request-subjects-accordeon .p-accordionheader .pi-chevron-down,
.app-details__request-subjects-accordeon .p-accordionheader .pi-chevron-right {
    order: 1;
}

.app-details__request-subjects-accordeon .p-accordionheader:has(.pi-chevron-down),
.app-details__request-subjects-accordeon .p-accordionheader:has(.pi-chevron-right) {
    justify-content: space-between;
    gap: var(--p-accordion-header-padding);
}

.app-definitionListGrid.definitionListGrid dt:first-child,
.app-definitionListGrid.definitionListGrid dd:nth-child(2){
    border-top: 1px solid transparent;
}

.app-definitionListGrid.definitionListGrid dt:nth-last-child(2),
.app-definitionListGrid.definitionListGrid dd:last-child {
    border-bottom: 1px solid transparent;
}

.app-details__request-subjects-accordeon .p-accordioncontent-content {
    padding-top: 4px;
}

.app-definitionListGrid.definitionListGrid dd {
    font-weight: bold;
}

.app-definitionListGrid.definitionListGrid dt {
    font-weight: normal;
}

.app-explain-actions {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.app-dialog__header {
    color: var(--basicFontColor);
}

.app-submission-processing__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 2rem 1rem;
}

.app-submission-processing__title {
    margin: 0 0 0.75rem;
}

.app-submission-processing__message {
    max-width: 20rem;
    margin: 0 auto;
}

.app-submission-success__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.app-submission-success__message-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.5rem 0;
}

.app-submission-success__submessage {
    color: var(--app-color-text-muted);
    margin: 0;
}