/*
Todo:
evtl. nur  style für den header hier
alles in kalender kann in class ter_kal-gutenberg-block-script
<div class="ter_kal-gutenberg-block-script">[kalender]</div>
block oder block editor style, ...testen

*/
         .fc-event{
             cursor: pointer;
             --fc-list-event-dot-width:2em ;
        }
        .kategoriezeile, .ter_kal_kalender  {
                padding: 0.6em;
            }

        .ter_kal_kalender  {
                width: 100%;
                height:100%;

            }
         .fc-today-button {
             cursor: none;
             }
         .kategoriezeile  {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            background-color: #DCE1E5 ;
        }
        .kategoriezeile div,  .kat_btn {
            text-align: center;
            padding: 0px 0.3em 0px 0.3em;
            border-radius: 0.3em;
            margin-right: 0.3em;
            margin-top:  0.3em;
        }

        .kalender_dashicons {
            font-size: 3em;
           	width: 1em;
            height: 0.1em;
    		line-height: 0.5;
        }
        button.btn-close {
        -webkit-filter: brightness(0) invert(1);
        filter: brightness(0) invert(1);
        }
        .wp-block-column:not(:last-child) {
        margin-right: 1em;
        }
        #form_info , .infotext{
            color: #B9C3CC ;
            font-size: 0.8em;
            font-style: italic;
        }
        .labeltext{
            color: #A9B6C1 ;
            font-size: 0.9em;
            font-style: italic;
        }

        .benutzer_rechte {
            color: #476DBA;
            font-style: italic;
        }
        /* select[multiple] */
        #event_attendees  {
            height: auto;
            max-height: 150em;
            overflow-y: auto;
        }

        #einzel_id  {
            display: none;
        }


        .ter_kal_notes{
            background-color: #FFFFEB !important;
            border: 0.05em solid #A9B6C1;
            border-radius: 0.4em;
            box-shadow: 0.3em 0.3em 0.5em #BDBDBD;
            padding: 0.3em;
        }

        .modal-body {
		  background-color: #F6F7F8;
        }


		#kalender_modal {
        	background: rgba(0, 0, 0, 0.7);
        }

        .site-header, .site-footer, .entry-title, .site-content .widget-area {
          /*  display: none;   */
        }
        /*
        .site-content {
            width: 100% !important;
            padding: 0;
        }
        */
    .tk-full-browser-content {
        position: fixed;
        top: 0.7em;
        left: 0;
        width: 100%;
        height: 100%;
        /*padding: 0;*/
        background: rgba(255, 255, 255, 0.95); /* Add a semi-transparent white background if desired */
        z-index: 9999; /* Ensure it's above other elements on the page */
         overflow: auto; /* Allow scrolling if the content exceeds the viewport */
    }


/* Style for phones (small screens) */
@media (max-width: 767.98px) {

    #termin-kalender-calendar{
      font-size: 0.8em;
    }
            .kategoriezeile div, .kat_btn {
                font-size: 0.8em;
            }

            .kat_btn{
                //font-weight: 900;
                font-size: 0.8em;
                padding: 0px 0.3em 0px 0.3em;
            }

            .fc .fc-toolbar.fc-header-toolbar {
                display: block;
                text-align: center;
            }

            .fc-header-toolbar .fc-toolbar-chunk {
                display: block;
            }

}