htwkalender-pwa/frontend/public/primevue-sass-theme/themes/lara/lara-dark/yellow/theme.scss

$primaryColor: #ffed00 !default;
$primaryLightColor: rgba(255, 237, 0, 0.24) !default;
$primaryLighterColor: rgba(255, 237, 0, 0.16) !default;
$primaryLightestColor: rgba(255, 237, 0, 0.1) !default;
$primaryTextColor: #030712 !default;

$highlightBg: rgba($primaryColor, 0.16) !default;
$highlightTextColor: rgba(255, 255, 255, 0.87) !default;
$highlightFocusBg: rgba($primaryColor, 0.24) !default;

@import "../_variables";
@import "./_fonts";
@import "../../../../theme-base/_components";
@import "../_extensions";

:root {
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-weight: 100;
  }

  .fc {
    /* FullCalendar 4 */
    /* FullCalendar 5 */
    --fc-page-bg-color: transparent; /*#071426*/
  }

  .fc.fc-unthemed .fc-view-container th {
    background: map-get($colors, "htwk-grau"); /*#071426*/
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
    color: rgba(255, 255, 255, 0.87);
  }

  .fc.fc-unthemed .fc-view-container td.fc-widget-content {
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
    color: rgba(255, 255, 255, 0.87);
  }

  .fc.fc-unthemed .fc-view-container td.fc-head-container {
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
  }

  .fc.fc-unthemed .fc-view-container .fc-view {
    background: map-get($colors, "htwk-grau"); /*#071426*/
  }

  .fc.fc-unthemed .fc-view-container .fc-row {
    border-right: 1px solid map-get($colors, "htwk-grau"); /*#0b213f*/
  }

  .fc.fc-unthemed .fc-view-container .fc-event {
    background: map-get($colors, "primary");
    border: 1px solid map-get($colors, "htwk-yellow-24");
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
  }

  .fc-v-event {
    background: map-get($colors, "primary");
    border: 2px solid rgba(193, 180, 0, 0.94);
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    border-radius: 6px;
    margin: 1%;
  }

  .fc-v-event .fc-event-main {
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
  }

  .fc.fc-unthemed .fc-view-container .fc-divider {
    background: map-get($colors, "htwk-grau"); /*#071426*/
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
  }

  .fc.fc-unthemed .fc-toolbar .fc-button {
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    background: map-get($colors, "htwk-yellow"); /*#93c5fd*/
    border: 1px solid map-get($colors, "htwk-yellow"); /*#93c5fd*/
    font-size: 1rem;
    transition:
      background-color 0.2s,
      color 0.2s,
      border-color 0.2s,
      box-shadow 0.2s;
    border-radius: 6px;
    display: flex;
    align-items: center;
  }

  .fc.fc-unthemed .fc-toolbar .fc-button:enabled:hover {
    background: map-get($colors, "primary");
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    border-color: map-get($colors, "htwk-yellow-24");
  }

  .fc.fc-unthemed .fc-toolbar .fc-button:enabled:active {
    background: map-get($colors, "primary");
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    border-color: map-get($colors, "htwk-yellow-24");
  }

  .fc.fc-unthemed .fc-toolbar .fc-button:enabled:active:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.2rem rgba(map-get($colors, "htwk-yellow"), 0.5); /*rgba(147, 197, 253, 0.5)*/
  }

  .fc.fc-unthemed .fc-toolbar .fc-button .fc-icon-chevron-left {
    font-family: "PrimeIcons" !important;
    text-indent: 0;
    font-size: 1rem;
  }

  .fc.fc-unthemed .fc-toolbar .fc-button .fc-icon-chevron-left:before {
    content: "\e900";
  }

  .fc.fc-unthemed .fc-toolbar .fc-button .fc-icon-chevron-right {
    font-family: "PrimeIcons" !important;
    text-indent: 0;
    font-size: 1rem;
  }

  .fc.fc-unthemed .fc-toolbar .fc-button .fc-icon-chevron-right:before {
    content: "\e901";
  }

  .fc.fc-unthemed .fc-toolbar .fc-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.2rem rgba(map-get($colors, "htwk-yellow"), 0.5); /*rgba(147, 197, 253, 0.5)*/
  }

  .fc.fc-unthemed .fc-toolbar .fc-button.fc-dayGridMonth-button,
  .fc.fc-unthemed .fc-toolbar .fc-button.fc-timeGridWeek-button,
  .fc.fc-unthemed .fc-toolbar .fc-button.fc-timeGridDay-button {
    background: map-get($colors, "htwk-grau"); /*#071426*/
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
    color: rgba(255, 255, 255, 0.87);
    transition:
      background-color 0.2s,
      color 0.2s,
      border-color 0.2s,
      box-shadow 0.2s;
  }

  .fc.fc-unthemed .fc-toolbar .fc-button.fc-dayGridMonth-button:hover,
  .fc.fc-unthemed .fc-toolbar .fc-button.fc-timeGridWeek-button:hover,
  .fc.fc-unthemed .fc-toolbar .fc-button.fc-timeGridDay-button:hover {
    background: rgba(255, 255, 255, 0.03);
    border-color: map-get($colors, "htwk-grau-140"); /*#0b213f*/
    color: rgba(255, 255, 255, 0.87);
  }

  .fc.fc-unthemed
    .fc-toolbar
    .fc-button.fc-dayGridMonth-button.fc-button-active,
  .fc.fc-unthemed
    .fc-toolbar
    .fc-button.fc-timeGridWeek-button.fc-button-active,
  .fc.fc-unthemed
    .fc-toolbar
    .fc-button.fc-timeGridDay-button.fc-button-active {
    background: map-get($colors, "htwk-yellow"); /*#93c5fd*/
    border-color: map-get($colors, "htwk-yellow"); /*#93c5fd*/
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
  }

  .fc.fc-unthemed
    .fc-toolbar
    .fc-button.fc-dayGridMonth-button.fc-button-active:hover,
  .fc.fc-unthemed
    .fc-toolbar
    .fc-button.fc-timeGridWeek-button.fc-button-active:hover,
  .fc.fc-unthemed
    .fc-toolbar
    .fc-button.fc-timeGridDay-button.fc-button-active:hover {
    background: map-get($colors, "primary");
    border-color: map-get($colors, "htwk-yellow-24");
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
  }

  .fc.fc-unthemed .fc-toolbar .fc-button.fc-dayGridMonth-button:focus,
  .fc.fc-unthemed .fc-toolbar .fc-button.fc-timeGridWeek-button:focus,
  .fc.fc-unthemed .fc-toolbar .fc-button.fc-timeGridDay-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.2rem rgba(map-get($colors, "htwk-yellow"), 0.5); /*rgba(147, 197, 253, 0.5)*/
    z-index: 1;
  }

  .fc.fc-unthemed .fc-toolbar .fc-button-group .fc-button {
    border-radius: 0;
  }

  .fc.fc-unthemed .fc-toolbar .fc-button-group .fc-button:first-child {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
  }

  .fc.fc-unthemed .fc-toolbar .fc-button-group .fc-button:last-child {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
  }

  .fc.fc-theme-standard .fc-view-harness .fc-scrollgrid {
    border-color: map-get($colors, "htwk-grau-140"); /*#0b213f*/
  }

  .fc.fc-theme-standard .fc-view-harness th {
    background: map-get($colors, "htwk-grau"); /*#071426*/
    border-color: map-get($colors, "htwk-grau-140"); /*#0b213f*/
    color: rgba(255, 255, 255, 0.87);
  }

  .fc.fc-theme-standard .fc-view-harness td {
    color: rgba(255, 255, 255, 0.87);
    border-color: map-get($colors, "htwk-grau-140"); /*#0b213f*/
  }

  .fc.fc-theme-standard .fc-view-harness .fc-view {
    background: map-get($colors, "htwk-grau"); /*#071426*/
  }

  .fc.fc-theme-standard .fc-view-harness .fc-popover {
    background: none;
    border: 0 none;
  }

  .fc.fc-theme-standard .fc-view-harness .fc-popover .fc-popover-header {
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
    padding: 1.25rem;
    background: map-get($colors, "htwk-grau"); /*#071426*/
    color: rgba(255, 255, 255, 0.87);
  }

  .fc.fc-theme-standard
    .fc-view-harness
    .fc-popover
    .fc-popover-header
    .fc-popover-close {
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-family: "PrimeIcons" !important;
    font-size: 1rem;
    width: 2rem;
    height: 2rem;
    color: rgba(255, 255, 255, 0.6);
    border: 0 none;
    background: transparent;
    border-radius: 50%;
    transition:
      background-color 0.2s,
      color 0.2s,
      box-shadow 0.2s;
  }

  .fc.fc-theme-standard
    .fc-view-harness
    .fc-popover
    .fc-popover-header
    .fc-popover-close:before {
    content: "\e90b";
  }

  .fc.fc-theme-standard
    .fc-view-harness
    .fc-popover
    .fc-popover-header
    .fc-popover-close:hover {
    color: rgba(255, 255, 255, 0.87);
    border-color: transparent;
    background: rgba(255, 255, 255, 0.03);
  }

  .fc.fc-theme-standard
    .fc-view-harness
    .fc-popover
    .fc-popover-header
    .fc-popover-close:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.2rem rgba(map-get($colors, "htwk-yellow"), 0.5); /*rgba(147, 197, 253, 0.5)*/
  }

  .fc.fc-theme-standard .fc-view-harness .fc-popover .fc-popover-body {
    padding: 1.25rem;
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
    background: map-get($colors, "htwk-grau"); /*#071426*/
    color: rgba(255, 255, 255, 0.87);
    border-top: 0 none;
  }

  .fc.fc-theme-standard .fc-view-harness .fc-event.fc-daygrid-block-event {
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    background: map-get($colors, "primary");
    border-color: map-get($colors, "htwk-yellow-24");
  }

  .fc.fc-theme-standard
    .fc-view-harness
    .fc-event.fc-daygrid-block-event
    .fc-event-main {
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
  }

  .fc.fc-theme-standard
    .fc-view-harness
    .fc-event.fc-daygrid-dot-event
    .fc-daygrid-event-dot {
    background: map-get($colors, "primary");
    border-color: map-get($colors, "htwk-yellow-24");
  }

  .fc.fc-theme-standard .fc-view-harness .fc-event.fc-daygrid-dot-event:hover {
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.87);
  }

  .fc.fc-theme-standard .fc-view-harness .fc-cell-shaded {
    background: map-get($colors, "htwk-grau"); /*#071426*/
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button {
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    background: map-get($colors, "htwk-yellow"); /*#93c5fd*/
    border: 1px solid map-get($colors, "htwk-yellow"); /*#93c5fd*/
    font-size: 1rem;
    transition:
      background-color 0.2s,
      color 0.2s,
      border-color 0.2s,
      box-shadow 0.2s;
    border-radius: 6px;
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button:enabled:hover {
    background: map-get($colors, "htwk-yellow-24");
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    border-color: map-get($colors, "htwk-yellow-24");
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button:enabled:active {
    background: map-get($colors, "htwk-grau-60");
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    border-color: map-get($colors, "htwk-yellow-24");
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button:enabled:active:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.2rem rgba(map-get($colors, "htwk-yellow"), 0.5); /*rgba(147, 197, 253, 0.5)*/
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button:disabled {
    opacity: 0.4;
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
    background: map-get($colors, "htwk-yellow"); /*#93c5fd*/
    border: 1px solid map-get($colors, "htwk-yellow"); /*#93c5fd*/
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button .fc-icon-chevron-left {
    font-family: "PrimeIcons" !important;
    text-indent: 0;
    font-size: 1rem;
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button .fc-icon-chevron-left:before {
    content: "\e900";
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button .fc-icon-chevron-right {
    font-family: "PrimeIcons" !important;
    text-indent: 0;
    font-size: 1rem;
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button .fc-icon-chevron-right:before {
    content: "\e901";
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.2rem rgba(map-get($colors, "htwk-yellow"), 0.5); /*rgba(147, 197, 253, 0.5)*/
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button.fc-dayGridMonth-button,
  .fc.fc-theme-standard .fc-toolbar .fc-button.fc-timeGridWeek-button,
  .fc.fc-theme-standard .fc-toolbar .fc-button.fc-timeGridDay-button {
    background: map-get($colors, "htwk-grau"); /*#071426*/
    border: 1px solid map-get($colors, "htwk-grau-140"); /*#0b213f*/
    color: rgba(255, 255, 255, 0.87);
    transition:
      background-color 0.2s,
      color 0.2s,
      border-color 0.2s,
      box-shadow 0.2s;
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button.fc-dayGridMonth-button:hover,
  .fc.fc-theme-standard .fc-toolbar .fc-button.fc-timeGridWeek-button:hover,
  .fc.fc-theme-standard .fc-toolbar .fc-button.fc-timeGridDay-button:hover {
    background: rgba(255, 255, 255, 0.03);
    border-color: map-get($colors, "htwk-grau-140"); /*#0b213f*/
    color: rgba(255, 255, 255, 0.87);
  }

  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-dayGridMonth-button.fc-button-active,
  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-timeGridWeek-button.fc-button-active,
  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-timeGridDay-button.fc-button-active {
    background: map-get($colors, "htwk-yellow"); /*#93c5fd*/
    border-color: map-get($colors, "htwk-yellow"); /*#93c5fd*/
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
  }

  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-dayGridMonth-button.fc-button-active:hover,
  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-timeGridWeek-button.fc-button-active:hover,
  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-timeGridDay-button.fc-button-active:hover {
    background: map-get($colors, "primary");
    border-color: map-get($colors, "htwk-yellow-24");
    color: map-get($colors, "htwk-schwarz"); /*#1c2127*/
  }

  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-dayGridMonth-button:not(:disabled):focus,
  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-timeGridWeek-button:not(:disabled):focus,
  .fc.fc-theme-standard
    .fc-toolbar
    .fc-button.fc-timeGridDay-button:not(:disabled):focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 0.2rem rgba(map-get($colors, "htwk-yellow"), 0.5); /*rgba(147, 197, 253, 0.5)*/
    z-index: 1;
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button-group .fc-button {
    border-radius: 0;
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button-group .fc-button:first-child {
    border-top-left-radius: 6px;
    border-bottom-left-radius: 6px;
  }

  .fc.fc-theme-standard .fc-toolbar .fc-button-group .fc-button:last-child {
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
  }

  .fc.fc-theme-standard .fc-highlight {
    color: rgba(255, 255, 255, 0.87);
    background: rgba(
      map-get($colors, "htwk-yellow"),
      0.16
    ); /*rgba(147, 197, 253, 0.16)*/
  }
}

.fc-event-selected::after,
.fc-event:focus::after {
  background: var(--fc-event-selected-overlay-color);
  inset: -1px;
  content: "";
  position: absolute;
  z-index: 1;
  border-radius: 5px;
}