/* ============================================
   CONSOLIDATED STYLESHEET
   Organizing styles into common and components
   ============================================ */

/* CLUB DASHBOARD STYLES */
:root {
  --navy:#0d1b2a; --navy-mid:#1a2f45; --navy-light:#243b55;
  --gold:#e8a020; --gold-light:#f5c35a; --gold-pale:#fdf3dc;
  --white:#fff; --g100:#f4f5f7; --g200:#e8eaed; --g400:#9aa3ae; --g600:#5a6473;
  --red:#c0392b; --red-lt:#fde8e6; --green:#1e8449; --green-lt:#d5f0dd;
  --blue:#1a5fa8; --blue-lt:#dceeff;
  --amber:#d97706; --amber-lt:#fef3cd;
  --font-d:'Bebas Neue',sans-serif;
  --font-b:'DM Sans',sans-serif;
  --r:10px; --rl:16px;
}


body{
	display:flex;
	min-height: 90vh;
	background-image: url(/img/back_field.png);
	background-attachment: fixed;
	background-size: cover;
}


.homeflag img{
	max-width:90vw;
	width:100%;
}


.page-left-btn{
   display:none;
}
.modal-body{
	min-width:600px;
}

.noxl{
	display:none;
}

.apt.info{
	background:transparent;
	border: 1px solid var(--color-surface1);
	margin-bottom:var(--pad);
	align-items: flex-start;
}


@media(max-width: 980px) {
   /* Mobile-specific styles */
   body {
      font-size: 14px;
   }
   
   .noxl{
	display:flex;
	}
  
   :root{
	   --icos: 2rem;
	   --gap:10px;
	   --pad:10px;
   }
   .modal-body{
	   min-width:80%;
   }
   .segment{
	   flex-wrap: wrap;
   }
   .page-left-btn{
      width:64px;height:64px;
      display: flex;
      align-items: center;
      justify-content: center;
	  position:fixed;
   }
.page-content {
	padding-left:var(--pad);
}
   .page-header,.page-content {
     
      margin-left:64px;
      height: auto;
   }
   .page-header{
	   	min-height:64px;
			
   }
   .cardl, .view-cardl {
		display: grid;
		gap: 1.5rem;
		max-width: 1600px;
		margin: 0 auto;
		grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
		width: 100%;
	  }
	  div.col2{
		  flex-direction: column;gap:var(--pad);
	  }
   .page-content {
      margin-left:0;
   }
   .modhead .segment{
	   margin-bottom:0;
   }
   .modhead{
    
   }
   .apt .footer{
	   border-top:1px solid var(--color-surface1);
	   margin-top:var(--pad);
   }
     .apt .footer .btn{
	background-color:	var(--color-surface3);  width:100%;
	 }
	      .apt .footer .btn .text{
			  text-align: center
		  }
		 .apt .footer .btn i{ margin-left: auto; }
   .toolbar.dashbk{ padding: var(--pad);
    white-space: nowrap;
    flex-wrap: nowrap;
    flex-direction: row;
    display: flex;
    justify-content: space-between; }
   .dashb .kpi .text{ font-size:10px; }
   .dashbk{
	   grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
  display: grid;
   }
   .toolbar .kpi{ min-width:0;}
   .acc .kpi{ gap: 0.5rem}
   .modhead .segment .btn span{ display:none; }
   .modhead .segment{ margin-left:auto; }
   .modhead h1{ flex-grow:1; font-size:18px;margin:0;}
   .page-left{
      visibility: hidden;
        transition:transform .3s ease-out;
      transform: translateX(-.5rem);
      opacity:0;
   }
   .modhead .acc{ margin:0;    margin-right: auto; margin-right: 0; }
   .page-left > .toolbar{
	   height:64px;display:flex;align-items: center;
   }
   .page-left-btn img{
	   width:3rem;height:3rem;box-shadow:0px 1px 4px rgba(0,0,0,0.1); border-radius:50%;
	   background-color:var(--color-surface2);
   }
   .dropdown-menu li a{
	   padding:var(--pad)
   }
   .page-header{
	  background-color: var(--color-surface2);
    position: fixed;
    top: 0;
    right: 0;
    z-index: 100;
    margin-left: 0;
    left: 0;
    box-shadow: 0 0 5px rgba(0,0,0,0.1);
	padding-left:64px;
   }
   .page-left{
	   height: calc( 100vh - 64px);
   }
   .page-left:after{
	   content:"";
	   height: 100vh;
		top:0;position:absolute;
		left: var(--menuw);
		width:calc( 100vw - var(--menuw) );
	   backdrop-filter: blur(5px);
   }
   .page-container{
	   margin-top:64px;
   }
   .cardl2, .view-cardl2{
	   grid-template-columns: repeat(1, 1fr);
   }
   .nav.nav-tabs{
	   display:flex;
	   flex-direction: column;
	   gap:calc( var(--pad) * 0.5 );
   }
   .nav.nav-tabs li{
	  
   }
   .nav-tabs{
	   border:0;
   }
   .select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single{
	   min-width: auto;
   }
   .ftitle{
	   text-transform: uppercase;
  padding-bottom: calc(var(--pad) * 0.5 );
  font-size: 11px;
   }
   .tab-content .fields{ margin-bottom: var(--pad)}
   .thumb.imgfield{
	   flex-direction: column;
   }
    .nav.nav-tabs button,.nav.nav-tabs .a{
		 border-radius:var(--rad);
	   background-color:var(--color-surface2);
	   border:0;
		width:100%;
	}
	.nav.nav-tabs button.active{
		border:1px solid var(--color-surface2);
		background: var(--color-surface3);
	}
   .page-left-btn{
      display:flex;
    
      top:0;left:0;
      z-index: 1000;
    
   }
   .noxs{
	   display:none;
   }
   body.devmenu .page-left{
      visibility: visible;
      transform: translateX(0);
      opacity:1;
   }
   .page-left .logo{ display:none;}
   
   
   .modules-grid-rich{
	   padding:0;
   }
   
   .apt > .head h2{
	   
   }
   .dashb{
	   padding-right:0;
   }
   /**general reductions?**/
   .thumb > .text{
	   font-size:14px;
   }
   .apt > .head h2{
	   font-size:14px;
   }
   .acc a{
	   font-size:13px;
   }
   .btn{
	   font-size:13px;
	   font-weight:600;
   }
   .dash_evento .apt.box .title{
	   font-size:14px;
   }
   
   .modhead .thumb.kpi{
	   padding:0;
	   flex-direction: row;
	   font-size:10px;
   }
   .modhead .kpi i{
	   font-size:12px;
   }
    .modhead .kpi .text{
		  font-size:10px;
		  
	}
   .modhead .thumb .text {
	   display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
max-width: calc( 100vw - var(--pad) * 8 - var( --icos ) * 5 )
   }
   .modhead .thumb .acc{
	   margin-left:auto;
   }
   .modhead .thumb  .dropdown > .btn{
	   background-color:var(--color-surface3);
   }
   
   /** HEAD EVENT **/
   
   .modhead .thumb{
	   flex-direction: row;
	   align-items: center;
	   width:100%;
   }
   .modhead .thumb > .text{
	 
	   white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display:block;
   }
   
   .presu .disp .kpi .val{
	   font-size:16px;
   }
   .col2 > *{
	   width:100%;
   }
   
   
   /***tasks*/
   .lay_task > .fields{
	   width:100%!important;/*  ...**/
   }
   
   .segment.dest{
	   font-size:14px;
   }
   .apt.box h3{
	   font-size:13px;
   }
   
   .apt.hero .toolbar{
	   display:grid;
	   flex-direction: column;
	   
	    grid-template-columns: repeat(2, 1fr);
   }
   .apt.hero{
	   flex-direction: column;
	   padding-top: 3rem;
   }
   .hero .kpi.big .val{
	   font-size:32px;
   }
   .hero .toolbar .kpi .val{
	   font-size:16px;
   }
   .hero .kpi.big{
	   padding-top:var(--pad);
   }
   .kpi.big .text{
	   font-size:14px;
   }
   
   .list > .thumb{
	   flex-direction: column;
	   align-items: flex-start;
   }
   .list > .thumb > .icon{
	   position: absolute;
   }
   .list > .thumb > .text{
	   margin-left: calc( var(--icos) + var(--pad) )
   }
   .thumb.dest{
	   margin-bottom:var(--pad);
   }
   .text .big,.big2{
	   font-size:16px;
   }
   .col2 > .c3{
	   width:100%;
   }
   
   .col2 > .c1{
	   width:100%;
   }
   .list-filter-bar { display:flex;flex-direction:column;}
   .segment.w .btn{
	   text-align: left;
  justify-content: flex-start;
   }
   .segment .count{ margin-left:auto;}
   #tasks-view-switch{
	   display:none;
   }
   .page-toolbar > .segment{
	   flex-direction:column;
   }
   .drop-zone .toolbar{
	   position:static;
   }
   
}