@import '../styles/_dimensions';
@import '../styles/_colors';

$logo_bleed_size:58px;

.vui-footer-row{
  display:flex;
  justify-content:flex-start;
  > *{
    flex:0 1 25%;
    justify-content: space-between;
	}

	& + &, & + .vui-footer-row-collapsible{
		padding-top: 36px;
	}
	
	@include media-break-down(md){
		&{
			flex-wrap:wrap;
		}
	}
}

.vui-footer-row-collapsible{
	& + &, & + .vui-footer-row{
		padding-top: 36px;
	}

	&-toggle{
		margin: 0;
		padding: 0;
		background: transparent;
		border: 0;
		font-family: inherit;
		font-size: inherit;
		cursor: pointer;
		fill: base-color(dark-blue);
		svg{
      transition:0.25s ease-in-out transform;
			.icon-color-primary-fill {
				fill: base-color(dark-blue);
			}
		}
	}

	&-content{
		overflow: hidden;
		transition:0.25s ease-in-out height;
		height: 0;
	}

	&[data-collapsed="false"]{
    button svg{
      transform:rotateZ(90deg);
    }
	}
}