@tailwind base;
@tailwind components;
@tailwind utilities;

:root{
    --navbar-height: 56px;
    --sidenav-width: 0px;
    --sidenav-slim-width: 58px;
    --ld-orange: #FFB81C;
    --ld-blue: #232234;
    --ld-light-blue: #D3D3D5;
    --black: #000000;
    --white: #ffffff;
    --site-text: #D3D3D5;
    --hover-color: rgba(0, 118, 171, 0.7);
    --done-color: #81c784;
    --primary: #FFB81C;
    --link-color: #D3D3D5;
}

.navbar{ position: sticky; top: 0; z-index: 1100; }
.sidenav{ top: var(--navbar-height); height: calc(100% - var(--navbar-height)); z-index: 1020; }
.navbar .dropdown-menu{ z-index: 1200; }

#slim-content{
    min-height: calc(100vh - var(--navbar-height));
}

/* Einrückung je nach Slim-Status */
.sidenav[data-mdb-hidden="false"][data-mdb-mode="side"][data-mdb-slim-collapsed="false"] ~ #slim-content{
    margin-left: var(--sidenav-width) !important;
}
.sidenav[data-mdb-hidden="false"][data-mdb-mode="side"][data-mdb-slim-collapsed="true"] ~ #slim-content{
    margin-left: var(--sidenav-slim-width) !important;
}

/* Mobile: überlappend */
@media (max-width: 991.98px){
    .sidenav ~ #slim-content{ margin-left: 0 !important; }
}


.table-actions {
    width:1px;
    white-space: nowrap;
}

.btn.btn-sm {
    padding: 0.3125rem 1rem;
    font-size: 0.75rem;
    line-height: 1.5;
}

th {
    background-color: var(--ld-light-blue) !important;
    color: var(--ld-blue) !important;
    font-weight:bold !important;
}

th a {
    font-weight:bold !important;
    text-decoration: none !important;
}

/* Platz für Pfeile rechts im TH */
th.sorting,
th.sorting_asc,
th.sorting_desc,
th.sorting_asc_disabled,
th.sorting_desc_disabled {
    position: relative;
    padding-right: 1.75rem; /* Platz für die Pfeile */
    cursor: pointer;
    white-space: nowrap;     /* optional */
    color: #495057;          /* Textfarbe wie vorher */
}

/* neutrale Pfeile (hell) */
th.sorting::before,
th.sorting::after,
th.sorting_asc::before,
th.sorting_asc::after,
th.sorting_desc::before,
th.sorting_desc::after {
    content: "";
    position: absolute;
    right: .5rem;
    border-left: .32rem solid transparent;
    border-right: .32rem solid transparent;
    opacity: .35;
}

/* ▲ oben */
th.sorting::before,
th.sorting_asc::before,
th.sorting_desc::before {
    top: 40%;
    border-bottom: .44rem solid #6c757d; /* neutral grau */
    transform: translateY(-50%);
}

/* ▼ unten */
th.sorting::after,
th.sorting_asc::after,
th.sorting_desc::after {
    top: 60%;
    border-top: .44rem solid #6c757d;    /* neutral grau */
    transform: translateY(-50%);
}

/* aktive Zustände dunkler hervorheben */
th.sorting_asc::before {
    border-bottom-color: #212529; /* ▲ aktiv */
    opacity: .9;
}
th.sorting_desc::after {
    border-top-color: #212529;    /* ▼ aktiv */
    opacity: .9;
}

/* optional: deaktivierte Sortierung blasser */
th.sorting_asc_disabled::before,
th.sorting_desc_disabled::after {
    opacity: .15;
}

/* Basis: Form inline halten */
.table-actions form {
    display: inline-flex;
    margin: 0;
    padding: 0;
}

/* In der Button-Group: Buttons sollen sich nicht überdehnen */
.table-actions .btn-group > .btn,
.table-actions .btn-group > form > .btn {
    flex: 0 0 auto;
    width: auto;
    line-height: 1.5; /* Text schön mittig */
    padding: .25rem .5rem; /* gleiche Höhe wie andere btn-sm */
}

/* Rundungen reparieren */
.table-actions .btn-group > .btn:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.table-actions .btn-group > form > .btn {
    border-radius: 0; /* mittlere Buttons ohne Ecken */
}

.table-actions .btn-group > form:last-child > .btn {
    border-top-right-radius: .25rem;   /* rechtes Ende wieder rund */
    border-bottom-right-radius: .25rem;
}

.container-fluid p:last-of-type {
    margin-bottom:0px !important;
    padding-bottom:0px !important;
}

.form-check-input {
    border: 0.125rem solid var(--mdb-form-control-border-color) !important;
}

.card.text-white h1, .card.text-white h2, .card.text-white h3, .card.text-white h4, .card.text-white h5 {
    color:#ffffff !important;
}

.green {
    background-color:#14a44d;
}
.vjs-default-skin .vjs-big-play-button {
    top:70% !important;
}
.video-js, video {
    border-radius: 1.4rem;
    background-color:#fff;
}

.rounded {
    border-radius: 1.4rem !important;
}

.text-white p, p.text-white {
    color:#fff !important;
}

.text-orange p, h2.text-orange, p.text-orange {
    color: #fab52c;
}


.text-orange p, h2.text-orange, p.text-orange {
    color: #fab52c;
}

input[type=range] {
    -webkit-appearance: none;
    margin: 20px 0;
    width: 100%;
}
input[type=range]:focus {
    outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 4px;
    cursor: pointer;
    animate: 0.2s;
    background: #aecaec;
    border-radius: 25px;
}
input[type=range]::-webkit-slider-thumb {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 4px 0 rgba(0,0,0, 1);
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -8px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
    background: #aecaec;
}
.range-wrap{
    width: 100%;
    position: relative;
}
.range-value{
    position: absolute;
    top: -70%;
}
.range-value span{
    width: 50px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background: #aecaec;
    color: #003057;
    font-size: 1.75rem;
    font-weight: 700;
    display: block;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    border-radius: 6px;
}
.range-value span:before{
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 10px solid #aecaec;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    margin-top: -1px;
}
.nrs-hidden {
    color: #ebf2fa;
}
.text-red {
    color: #dc4c64;
}

[data-toggle="collapse"].collapsed .if-not-collapsed {
    display: none;
}
[data-toggle="collapse"]:not(.collapsed) .if-collapsed {
    display: none;
}

.form-check-label {
    font-size:1rem !important;
}

.invalid-feedback {
    position:relative !important;
    font-size:0.9rem !important;
}

.input-error ul li:last-of-type {
    margin-bottom:0px !important;
}

.form-control.is-invalid {
    padding-right:0 !important;
}

/* Standard: alle Links außer Buttons haben Unterstreichung */
a:not(.btn) {
    text-decoration: underline;
    color: inherit; /* optional: erbt die Textfarbe */
}

/* Hover: Unterstreichung bleibt sichtbar */
a:not(.btn):hover {
    text-decoration: underline;
    color: inherit; /* oder eine Akzentfarbe */
}

/* Buttons sollen keine Unterstreichung bekommen */
a.btn {
    text-decoration: none;
}

nav a {
    text-decoration: none !important;
}

.card.text-white h5 {
    color:#ffffff !important;
}

.sidenav {
    background-color: var(--ld-blue) !important;
}

.navbar {
    background-color: var(--ld-blue) !important;
}