/* change BE appearence */

/**
*  1. restores TYPO3 11 layout
*  2. keep overflowing for container elements ...
*  3. ... but make them scrollable
*/

/* 1) respect colspan from backend layout */
.t3-page-columns {
    width: 100%;
}

/* 2) container elements may overflow */
.element-preview-content .t3-page-columns {
    width: auto;
}

/* 3) make container scrollable - content may not be edit-/reachable without 1) */
.element-preview-content .t3-grid-container {
    overflow-x: visible;
}


/* FIXME remove/change these rules in multilanguage systems! */

/* hide flag in CE header - Do not do this in multilanguage systems! */
.t3-page-ce-header-left>.t3js-flag {
    display: none;
}

.content_preview {
    border-top: 0 none transparent !important;
}

/* or mute */
/*
.t3-page-ce-header-left > .t3js-flag { opacity: 0.25; }
.t3-page-ce:hover .t3-page-ce-header-left > .t3js-flag {
opacity: 1;
}
*/

:root {
    --bs-primary-rgb: 255, 70, 34;
    --bs-primary: rgb(var(--bs-primary-rgb));
}

.element-preview-content .btn-link {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: transparent;
    --bs-btn-font-weight: 700;
}

.btn-primary {
    --bs-btn-bg: var(--bs-primary);
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
}

.btn-outline-primary {
    --bs-btn-color: var(--bs-primary);
    --bs-btn-bg: transparent;
    --bs-btn-border-color: var(--bs-primary);
    --bs-btn-hover-bg: var(--bs-primary);
    --bs-btn-hover-border-color: var(--bs-primary);
    --bs-btn-active-bg: var(--bs-primary);
    --bs-btn-active-border-color: var(--bs-primary);
}

.theme-green {
    --badge-color: white;
    --badge-bg: #097B3D;
}

.theme-yellow {
    --badge-color: #1B064D;
    --badge-bg: #FFA300;
}

.theme-dark-purple {
    --badge-color: #FFFAE0;
    --badge-bg: #1B064D;
}

.theme-off-white {
    --badge-color: #1B064D;
    --badge-bg: #FFFAE0;
}