/**
 * Varausportaaleille tarkoitettu yleinen responsiivusuus-CSS, esim.
 * - fullcalendarin otsikoiden tavutus 
 * - täsmähaun mobiilisuodatin
 *
 * 19.06.2019 JP: Eriytetty PTTK-portaaleiden ja Joensuun CSS:sistä toteutukset tähän
 * 12.12.2019 JP: Avatun datepickerin z-indeksi => 1200 kännykkäkoossa (yli mobiili-stickynavin)
 * 30.03.2020 JP: Lisätty agenda2Days-overflow hidden
 * 27.10.2020 VR: Lisätty Fullcalendarin yläpuolella olevien nappien respokorjaukset.
 * 12.05.2023 VR: Tilakortin border-collapse bugin korjaus (.tila-info-subitem table)
 * 26.09.2024 JP: fc6:n grid-näkymään overflow=>hidden resource-headereihin
 * 02.10.2024 JP: Lisätty joitain _v2.css:n asioita tänne, esim. required-labelit, rakennuskortti 
 *                ja three-column-responsive
 */
 

#ui-datepicker-div
{
	z-index: 5 !important;
}

@media (max-width: 767px) 
{
	#ui-datepicker-div
	{
		z-index: 1200 !important;
	}
}

.fc-agenda2Days-view  th.fc-resource-cell,
.fc-agenda7Days-view  th.fc-resource-cell,
.fc-agendaDay-view  th.fc-resource-cell,
.fc-agendaWeek-view  th.fc-resource-cell,
.fc-agendaWeek-view  th.fc-day-header,
th.fc-col-header-cell.fc-resource > .fc-scrollgrid-sync-inner
{
	overflow: hidden;
}

.mobi-expander, .mobi-supressor, .mobi-expander-tgl
{
	display: none;
	margin-right: 5px;
}
.toggle-group .btn
{
	font-size: 17px;	
}

/* Täsmähaun mobiilikäsittely (toggle) */
@media (max-width: 991px)
{
	span.multiselect-item,
	.mobi-expanded .mobi-expander 
	{
		display: none;
	}	
	.mobi-expander, .mobi-expanded .mobi-supressor, .mobi-expander-tgl
	{
		display: inline-block;
	}
	
	.multiselect-item.multiselect-item-selected,
	.mobi-expanded span.multiselect-item	
	{
		display: inline-block;
	}
	
	.fc-bg .fc-axis.ui-widget-content > span
	{
		display: none;
	}

	
}

@media (max-width:767px)
{
	/* Pysty-gridin otsikkojen tavutus/rivitys */
	a.asio-calendar-link-vertical,
	.frontpage-small-picture-item .frontpage-item-title
	{
		-webkit-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;	
	}
	
	select.navigation-select, .sort-form select
	{
		font-size: 16px;
		padding: 2px 12px;
	}	
}

@media (max-width:480px)
{
	.fc-agendaWeek-view  th.fc-day-header
	{
		padding-left: 4px;
		padding-right: 15px;
		text-align: center;
	}
}

/* pitkät tiedostonimet/linkit: wräppää aina */
.form-input-type-file_links a
{
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;	
}


.enroll-submission .btn
{
	margin-bottom: 8px;
}

/* sizetgl alkaa - säätöjä fullwidth-togglen placementtiin isoilla näytöillä */
.window-size-tgl-top-placer
{
	position: relative;
	float: right;
}
.window-size-tgl-top-placer .window-size-tgl-container
{
	position: absolute;
	right: 0px;
}
@media (min-width:960px) and (max-width:1199px)
{

	.window-size-tgl-top-placer .window-size-tgl-container
	{
		top: 0px;
	}
}
@media (min-width:1200px)
{
	.window-size-tgl-top-placer .window-size-tgl-container
	{
		bottom: 20px;
	}
}
/* estetään togglen näkyminen tuplana (sekä kalenterissa että portaalin toiminnolla) */
.calendar-container .portal-toggler .window-size-tgl-container
{
	display: none;
}
/* sizetgl loppuu */

/* FULLCALENDARIN PÄÄLLÄ OLEVIEN NAPPIEN RESPOKORJAUKSET  */   
@media (max-width:640px)
{ 
    .fc-toolbar .fc-left, .fc-toolbar .fc-right {
        width: 50%;
        float: left;
    }
    
    .fc .fc-toolbar > .fc-right .fc-button-group {
        display: block !important;
        float: right;
    }
	
	
	/* kk-kalenterin labelia vielä pienemmäksi */
	span.fc-title
	{
		font-size: 80%;
	}
}

@media (max-width:460px)
{
    .fc-toolbar .fc-left, .fc-toolbar .fc-right {
        width: 100% !important;
        float: left !important;
    }
    
    .fc .fc-toolbar > .fc-right .fc-button-group {
        float: left;
    }
}

@media (max-width:417px)
{
	.fc-agendaWeek-view th.fc-day-header {
	    font-size: 10px;
	}
	
}

@media (max-width:345px)
{
	.fc-agendaWeek-view th.fc-day-header {
	    font-size: 9px;
	}
	
}
/* LOPPUU FULLCALENDARIN PÄÄLLÄ OLEVIEN NAPPIEN RESPOKORJAUKSET  */  





/* Tilakorttien XS-vertikaalistäkkäys, jos kortti on tooltipissä */
.tooltip-content .tila-info-item-flexing
{
	display: block !important;
	width: 100%  !important;
}
.tooltip-content .asio-bg-thumbnail.tila-info-item-flexer
{
	min-height: 180px;
}	
.tooltip-content .tila-info-item-flexer
{
	display: block !important;
	width: 100%  !important;
}
.tooltip-content .html-after-tilainfo-container
{
	float: none;
	position: static;
	display: block;
	width: 100%  !important;
}
.tooltip-content .html-after-tilainfo
{
	position: static;
	display: block;
}
.tooltip-content .tila-info-subitem .longvalue.room-notes
{
	padding-bottom: 5px;
}
.tooltip-content .tila-info-subitem > table
{
	margin-bottom: 5px;
}
.tooltip-content table tbody tr th.longlabel.bg-primary
{
	border-top: 0px none;
}


@media (min-width: 1250px)
{
	.modal-lg 
	{
		width: 1100px;
	}
}

.tila-info-subitem table
{
    border-collapse: initial !important;
} 


@media (min-width: 1000px) {
    .three-column-responsive {
      -webkit-column-count: 3;
      -moz-column-count: 3;
      column-count: 3;
      -webkit-column-gap: 3em;
      -moz-column-gap: 3em;
      column-gap: 3em;
    }
  }

@media (min-width: 600px) and (max-width: 1000px) {
  .three-column-responsive {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 3em;
    -moz-column-gap: 3em;
    column-gap: 3em;
  }
}

@media (max-width: 600px) {
  .three-column-responsive {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    -webkit-column-gap: 3em;
    -moz-column-gap: 3em;
    column-gap: 3em;
  }
}

.form-field-required .form-field-label:after, 
.form-field-required > label:after
{
	color: red;
	font-weight: bold;
	content: '*';
}

.form-field-error .form-field-input .form-control
{
        border-color: #cc0000;
        background-color: #ffdddd;
}
.form-field-error label
{
        color: #ff0000;
}
.fc-bg-event .fc-event-title
{
	display: none;
}



@media (max-width:480px)
{
	.rakennuskortti, .rakennuskortti > *
	{
		display: block !important;
		width: 100%  !important;
	}
	{
	}
	.rakennuskortti .tila-info-item,
	.rakennuskortti .tila-info-item > .tila-info-subitem
	{
		display: block !important;
		width: 100% !important;
		min-height: 0px !important;
	}
	.rakennuskortti .tila-info-subitem.asio-bg-thumbnail
	{
		min-height: 180px !important;
	}	
	.rakennuskortti .tila-info-item-flexer
	{
		display: block !important;
		width: 100%  !important;
	}
	.rakennuskortti .html-after-tilainfo-container
	{
		float: none;
		position: static;
		display: block;
		width: 100%  !important;
	}
	.rakennuskortti .html-after-tilainfo
	{
		position: static;
		display: block;
	}
	.rakennuskortti .tila-info-subitem .longvalue.room-notes
	{
		padding-bottom: 5px;
	}
	.rakennuskortti .tila-info-subitem > table
	{
		margin-bottom: 5px;
	}
	.rakennuskortti table tbody tr th.longlabel.bg-primary
	{
		border-top: 0px none;
	}
}

.mark-info
{
	padding: 3px 3px 3px 20px;
	font-size: 90%;
}