.page-header {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    gap:16px;
}

.breadcrumb-back {
    display: flex;
    align-items: center;
    gap: 4px;
    text-decoration: none;
}

.breadcrumb-back-icon {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.breadcrumb-back-icon img {
    width: 16px;
    height: 16px;
}

.breadcrumb-back-text {
    color: var(--Text-Primario, #03606B);
    font-family: Inter;
    font-size: 16px;
    font-weight: 600;
    line-height: 150%;
}

.page-header-breadcrumb {
    display: flex;
    height: 24px;
    padding-bottom: 16px;
    align-items: flex-start;
    align-self: stretch;
    font-size: 14px;
    color: #666;
}

.page-header-breadcrumb a {
    text-decoration: none;
    color: inherit;
}

.page-header-breadcrumb .current {
    font-weight: 500;
    color: #000;
}

.page-header-breadcrumb .separator {
    margin: 0 6px;
}

.page-header-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
}

.page-header-title {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    color: black;
    font-family: "Titillium Web";
    font-size: 32px;
    font-weight: 700;
    line-height: 120%;
}

.page-header-subtitle {
    color: #6E6E6E;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

@media (max-width: 991px) {
    .page-header {
        padding: 24px;
    }

}

/* OPEN */
.ticket-status-badge.status-open {
    border-color: var(--Primario, #01A2B7);
    background: var(--background-white, #FFF);
    color: var(--Primario, #01A2B7);
}

/* IN PROGRESS */
.ticket-status-badge.status-inprogress {
    border-color: var(--Sematic-Warning, #CC7A00);
    background: var(--Sematic-Warning-Light, #FFF3CD);
    color: var(--Sematic-Warning, #CC7A00);
}

/* WAITING FOR FEEDBACK */
.ticket-status-badge.status-waitingforfeedback {
    border-color: var(--Sematic-Info, #0D6EFD);
    background: var(--Sematic-Info-Light, #CFE2FF);
    color: var(--Sematic-Info, #0D6EFD);
}

/* RESOLVED */
.ticket-status-badge.status-resolved {
    border-color: var(--Sematic-Success, #008055);
    background: var(--Sematic-Success-Light, #D1E7DD);
    color: var(--Sematic-Success, #008055);
}

/* CLOSED */
.ticket-status-badge.status-closed {
    border-color: #A65D5D;
    background: #F7E6E6;
    color: #A65D5D;
}

/* UNKNOWN / NONE */
.ticket-status-badge.status-unknown {
    display: none !important;
}


/*right action*/
.page-header-top-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
}

.page-header-actions {
    display: flex;
    gap: 12px;
    align-self: center;
}

@media (max-width: 768px) {
    .page-header-top-row {
        flex-direction: column;
    }

    .page-header-actions {
        margin-top: 12px;
        align-self: start;
    }
}