/* ═══════════════════════════════════════════════════════════════════════════
   PLANVIGO SCROLLBAR STYLES
   ─────────────────────────────────────────────────────────────────────────
   • Scoped zu Plugin-Containern — kein Einfluss auf das Theme
   • Webkit (::-webkit-scrollbar): Chrome, Edge, Safari — volle Kontrolle
   • Firefox (scrollbar-color / scrollbar-width: auto): behält System-Breite
   • Breite = 15px (webkit) → entspricht dem System-Default, kein Layout-Shift
   • Design: modernes Grau mit orangem Hover passend zu --pv-color-accent
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Shared Design-Tokens ─────────────────────────────────────────────── */
:root {
    --pv-sb-size:        15px;                              /* Breite/Höhe — wie System-Standard  */
    --pv-sb-track:       #f1f5f9;                           /* Hintergrund der Spur               */
    --pv-sb-thumb:       var(--pv-primary, #FF785F);         /* Thumb — Primärfarbe fest          */
    --pv-sb-radius:      8px;                               /* Abrundung des Thumbs               */
    --pv-sb-border:      4px;                               /* Innenabstand (macht Thumb runder)  */
}

/* ═══════════════════════════════════════════════════════════════════════════
   FRONTEND — #planvigo-page-wrapper
   ═══════════════════════════════════════════════════════════════════════════ */

/* Firefox: System-Breite beibehalten, nur Farbe anpassen */
#planvigo-page-wrapper,
#planvigo-page-wrapper * {
    scrollbar-width: auto;
    scrollbar-color: var(--pv-sb-thumb) var(--pv-sb-track);
}

/* Webkit: Spur */
#planvigo-page-wrapper ::-webkit-scrollbar {
    width:  var(--pv-sb-size);
    height: var(--pv-sb-size);
}

#planvigo-page-wrapper ::-webkit-scrollbar-track {
    background:    var(--pv-sb-track);
    border-radius: var(--pv-sb-radius);
}

/* Thumb — mit border-Trick für "schwebenden" Look */
#planvigo-page-wrapper ::-webkit-scrollbar-thumb {
    background-color: var(--pv-sb-thumb);
    border-radius:    var(--pv-sb-radius);
    border:           var(--pv-sb-border) solid var(--pv-sb-track);
    min-height:       40px;
}



/* Ecke wo x + y Scrollbar aufeinandertreffen */
#planvigo-page-wrapper ::-webkit-scrollbar-corner {
    background: var(--pv-sb-track);
}

/* ═══════════════════════════════════════════════════════════════════════════
   MODALS — auf document.body, außerhalb des page wrappers
   Spezifität via :is() mit ID → 1,0,x
   ═══════════════════════════════════════════════════════════════════════════ */

/* Firefox */
:is(#playerAcceptanceModal, #trainerAcceptanceModal, #availabilityModal,
    #profileModal, #logoutFeedbackModal, [data-pv-modal]),
:is(#playerAcceptanceModal, #trainerAcceptanceModal, #availabilityModal,
    #profileModal, #logoutFeedbackModal, [data-pv-modal]) * {
    scrollbar-width: auto;
    scrollbar-color: var(--pv-sb-thumb) var(--pv-sb-track);
}

/* Webkit */
:is(#playerAcceptanceModal, #trainerAcceptanceModal, #availabilityModal,
    #profileModal, #logoutFeedbackModal, [data-pv-modal]) ::-webkit-scrollbar {
    width:  var(--pv-sb-size);
    height: var(--pv-sb-size);
}

:is(#playerAcceptanceModal, #trainerAcceptanceModal, #availabilityModal,
    #profileModal, #logoutFeedbackModal, [data-pv-modal]) ::-webkit-scrollbar-track {
    background:    var(--pv-sb-track);
    border-radius: var(--pv-sb-radius);
}

:is(#playerAcceptanceModal, #trainerAcceptanceModal, #availabilityModal,
    #profileModal, #logoutFeedbackModal, [data-pv-modal]) ::-webkit-scrollbar-thumb {
    background-color: var(--pv-sb-thumb);
    border-radius:    var(--pv-sb-radius);
    border:           var(--pv-sb-border) solid var(--pv-sb-track);
    min-height:       40px;
}

:is(#playerAcceptanceModal, #trainerAcceptanceModal, #availabilityModal,
    #profileModal, #logoutFeedbackModal, [data-pv-modal]) ::-webkit-scrollbar-corner {
    background: var(--pv-sb-track);
}

/* ═══════════════════════════════════════════════════════════════════════════
   ADMIN — .pv-container / .planvigo_container
   ═══════════════════════════════════════════════════════════════════════════ */

/* Firefox */
.pv-container,
.pv-container *,
.planvigo_container,
.planvigo_container * {
    scrollbar-width: auto;
    scrollbar-color: var(--pv-sb-thumb) var(--pv-sb-track);
}

/* Webkit */
.pv-container ::-webkit-scrollbar,
.planvigo_container ::-webkit-scrollbar {
    width:  var(--pv-sb-size);
    height: var(--pv-sb-size);
}

.pv-container ::-webkit-scrollbar-track,
.planvigo_container ::-webkit-scrollbar-track {
    background:    var(--pv-sb-track);
    border-radius: var(--pv-sb-radius);
}

.pv-container ::-webkit-scrollbar-thumb,
.planvigo_container ::-webkit-scrollbar-thumb {
    background-color: var(--pv-sb-thumb);
    border-radius:    var(--pv-sb-radius);
    border:           var(--pv-sb-border) solid var(--pv-sb-track);
    min-height:       40px;
}

.pv-container ::-webkit-scrollbar-corner,
.planvigo_container ::-webkit-scrollbar-corner {
    background: var(--pv-sb-track);
}

/* ═══════════════════════════════════════════════════════════════════════════
   HORIZONTALE Scrollbars — spezifische Höhen für kompakte Bereiche
   (Kalender, Tables, horizontale Listen)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Availability-Kalender im Player-Dashboard */
.pv-avail-body::-webkit-scrollbar,
.pv-avail-calendar::-webkit-scrollbar {
    width:  var(--pv-sb-size);
    height: var(--pv-sb-size);
}

.pv-avail-body::-webkit-scrollbar-track,
.pv-avail-calendar::-webkit-scrollbar-track {
    background:    var(--pv-sb-track);
    border-radius: var(--pv-sb-radius);
}

.pv-avail-body::-webkit-scrollbar-thumb,
.pv-avail-calendar::-webkit-scrollbar-thumb {
    background-color: var(--pv-sb-thumb);
    border-radius:    var(--pv-sb-radius);
    border:           var(--pv-sb-border) solid var(--pv-sb-track);
    min-width:        40px;
}

/* Tabellen-Wrapper */
.pv-table-scroll-wrapper::-webkit-scrollbar,
.table-responsive::-webkit-scrollbar {
    height: var(--pv-sb-size);
}

.pv-table-scroll-wrapper::-webkit-scrollbar-track,
.table-responsive::-webkit-scrollbar-track {
    background:    var(--pv-sb-track);
    border-radius: var(--pv-sb-radius);
}

.pv-table-scroll-wrapper::-webkit-scrollbar-thumb,
.table-responsive::-webkit-scrollbar-thumb {
    background-color: var(--pv-sb-thumb);
    border-radius:    var(--pv-sb-radius);
    border:           var(--pv-sb-border) solid var(--pv-sb-track);
    min-width:        40px;
}

/* Admin Availability Board */
.pv-availability-board::-webkit-scrollbar {
    width:  var(--pv-sb-size);
    height: var(--pv-sb-size);
}

.pv-availability-board::-webkit-scrollbar-track {
    background:    var(--pv-sb-track);
    border-radius: var(--pv-sb-radius);
}

.pv-availability-board::-webkit-scrollbar-thumb {
    background-color: var(--pv-sb-thumb);
    border-radius:    var(--pv-sb-radius);
    border:           var(--pv-sb-border) solid var(--pv-sb-track);
    min-width:        40px;
}



/* Firefox für einzelne Scroll-Elemente */
.pv-avail-body,
.pv-avail-calendar,
.pv-availability-board,
.pv-table-scroll-wrapper,
.table-responsive {
    scrollbar-width: auto;
    scrollbar-color: var(--pv-sb-thumb) var(--pv-sb-track);
}