:root {
	--ui-divider-color: #d1d1d1;
	--ui-primary-color: #05519c;
	--ui-border-radius: 10px;
  }
  
  body {
	  margin: auto;
	  display: flex;
	  flex-direction: column;
	  justify-content: center;
	  font-family: sans-serif;
  }
  
  h3, p {
	  margin: 0;
  }
  
  p {
	  font-size: 18px;
  }
  .bold {
	  font-weight: 800;
  }
  
  #filing-entity {
	  display: flex;
	  flex-direction: column;
	  width: 500px;
	  padding: 10px;
  }
  
  #rss-feed {
	  display: flex;
	  flex-direction: column;
	  text-align: center;
	  align-items: left;
  }
  
  hr {
	  border-top: 1px solid black;
	  width: 25%;
  }
  
  #header {
	  display: flex;
	  flex-direction: row;
	  justify-content: space-between;
	  padding: 10px 40px 10px 40px;
	  border-bottom: 3px solid black;
	  background-color: var(--ui-primary-color);
	  color: white;
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
  }
  
  .filing-header {
	  border-bottom: 1px solid black;
	  padding: 10px 40px 10px 40px;
	  margin-bottom: 0px;
	  margin-top: 0px;
	  text-align: left;
	  position: fixed;
	  width: 100%;
	  top: 90px;
	  background-color: white;
  }
  
  #logo {
	  width: 200px;
	  object-fit: scale-down;
  }
  #rss-feed {
	  margin-top: 140px;
  }
  #data-display {
	  display: flex;
	  flex-direction: row;
	  width: 100%;
  }
  
  #date-selector {
	  width: 300px;
	  height: 100%;
	  display: flex;
	  flex-direction: column;
	  text-align: left;
	  padding-left: 40px;
	  padding-right: 40px;
	  border-right: 1px solid var(--ui-divider-color);
	  height: calc(100vh - 149.8px);
	  position: fixed;
	  margin-top: 0px;
  }
  
  .date_link {
	  padding: 10px;
	  border: 1px solid #eeeeee;
	  background-color: white;
  }
  
  #filings-display {
	  text-align: left;
	  width: 100%;
	  padding-left: 50px;
	  padding-right: 50px;
	  margin-left: 380px;
	  margin-top: 0px;
  }
  
  #filings-container {
	  display: flex;
	  flex-direction: column;
	  align-content: flex-start;
	  text-align: left;
	  margin: auto;
	  padding-top: 20px;
  }
  
  .filing {
	  width: 95%;
	  padding: 15px;
	  margin: 10px;
	  border: 1px solid #dddddd;
	  border-radius: var(--ui-border-radius);
	  display: flex;
	  flex-direction: column;
	  text-align: left;
	  box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.04);
  
  }
  .filing-main-info {
	  display: flex;
	  flex-direction: row;
  }
  .filing-secondary-info {
	  display: flex;
	  flex-direction: row;
	  padding-left: 10px;
  }
  .filing-secondary-info>*{
	  padding-left: 10px;
  }
  .filing-title {
	  width: 50%;
  }
  .filing-date {
	  width:30%;
  }
  .filing-size {
	  width: 20%;
	  text-align: right;
  }
  .filing-title, .filing-date, .filing-size {
	  padding: 10px;
  }
  .filing-selection {
	  display: flex;
	  flex-direction: row;
	  align-items: center;
  }
  .filing-selection>input[type=checkbox] {
	  width: 20px;
	  height: 20px;
  }
  
  .filing>p {
	  margin-top:5px;
	  margin-top: 5px;
  }
  .filing>a {
	  margin-top:5px;
	  margin-top: 5px;
  }
  
  .instructions {
	  color: black;
	  border: 1px solid var(--ui-divider-color);
  }
  .instructions>* {
	  color: #bbbbbb;
  }
  
  .warning {
	  text-align: left;
	  color: red;
	  padding: 15px;
	  border: 1px solid red;
	  border-radius: var(--ui-border-radius);
	  margin-top: 15px;
  }
  
  #datepicker {
	  padding: 15px;
	  border-radius: var(--ui-border-radius);
	  border: 1px solid black;
	  background-color: #fff5c7;
  }
  #appDescription {
	  text-align: left;
	  padding-top: 15px;
	  color: grey;
  }
  #appDescription>p {
	  text-align: left;
  }
  #filingDivider {
	  width: 100%;
	  border-top: 1px solid grey;
  }
  .askAI {
	  width:20px;
	  right: -85%;
	  bottom: 10px;
	  padding: 10px;
  }
  #reportGenerator {
	  position: fixed;
	  bottom: 0;
	  left: 0;
	  width: 300px;
	  padding-top: 20px;
	  padding-bottom: 20px;
	  padding-left: 40px;
	  padding-right: 40px;
	  display: flex;
	  flex-direction: column;
	  border-top: 1px solid var(--ui-divider-color);
  }
  #reportGenerator>input, #loginAuthForm>input[type='submit'] {
	  margin-top: 20px;
	  padding: 15px;
	  background-color: var(--ui-primary-color);
	  color: white;
	  border-radius: var(--ui-border-radius);
	  font-size: 19px;
	  font-weight: 800;
	  box-shadow: none;
	  border: none;
  }
  #reportWindow {
	  position: fixed;
	  bottom:0;
	  width: calc(100vw - 380px);
	  background-color: white;
	  top: 140px;
	  border-left: 1px solid var(--ui-divider-color);
	  box-shadow: -30px 0px 10px rgba(0, 0, 0, 0.04);
	  padding: 50px;
	  margin-left: 380px;
	  text-align: center;
	  overflow: scroll;
  }
  #aiLoading {
	  width: 100%;
	  height: 100%;
	  text-align: center;
	  display: flex;
	  flex-direction: column;
	  justify-content: center;
	  align-items: center;
  }
  #aiLoading>img {
	  margin: 0;
	  -webkit-animation-name: spin;
	  -webkit-animation-duration: 4000ms;
	  -webkit-animation-iteration-count: infinite;
	  -webkit-animation-timing-function: linear;
	  -moz-animation-name: spin;
	  -moz-animation-duration: 4000ms;
	  -moz-animation-iteration-count: infinite;
	  -moz-animation-timing-function: linear;
	  -ms-animation-name: spin;
	  -ms-animation-duration: 4000ms;
	  -ms-animation-iteration-count: infinite;
	  -ms-animation-timing-function: linear;
	  
	  animation-name: spin;
	  animation-duration: 4000ms;
	  animation-iteration-count: infinite;
	  animation-timing-function: linear;
  }
  @-moz-keyframes spin {
	  from { -moz-transform: rotate(0deg); }
	  to { -moz-transform: rotate(360deg); }
  }
  @-webkit-keyframes spin {
	  from { -webkit-transform: rotate(0deg); }
	  to { -webkit-transform: rotate(360deg); }
  }
  @keyframes spin {
	  from {transform:rotate(0deg);}
	  to {transform:rotate(360deg);}
  }
  .aiSummary {
	  text-align: left;	
	  width: 600px;
	  margin: auto;
  }
  #reportWindowSummary {
	  display: flex;
	  flex-direction: column;
	  margin: auto;
	  width: 100%;
	  text-align: left;
	  justify-content: center;
	  gap: 20px;
  }
  #reportActions {
	  position: fixed;
	  width: 25px;
	  display: flex;
	  flex-direction: column;
	  align-items: center;
  }
  #closeReportWindow {
	  width: 100%;
  }
  #sendingActions {
	  border: 1px solid var(--ui-divider-color);
	  border-radius: var(--ui-border-radius);
	  width: 100%;
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  padding: 5px;
  }
  #copyToClipboard>img, #emailReport>img {
	  width: 90%;
	  padding-top: 5px;
	  padding-bottom: 5px;
  }
  #closeReportWindow>img {
	  width: 100%;
	  padding-bottom: 10px;
  }
  ol {
	  padding-left: 20px;
  }
  li {
	  padding-bottom: 5px;
  }
  /* LOGIN PAGE */
  #login {
	  width: 100%;
	  display: flex;
	  flex-direction: column;
	  margin: auto;
	  flex-grow: 1;
	  justify-content: center;
	  align-items: center;
	  gap: 50px;
  }
  #loginAuthForm {
	  display: flex;
	  flex-direction: column;
	  text-align: center;
	  align-items: center;
	  margin-top: 20px;
  }
  #loginAuthForm>input[type='text'], #loginAuthForm>input[type='password'] {
	  height: 20px;
	  padding: 15px;
	  margin: 10px;
	  border: 1px solid var(--ui-primary-color);
	  border-radius: var(--ui-border-radius);
  }
  #loginAuthForm>input[type='submit'], 
  #loginAuthForm>input[type='text'], 
  #loginAuthForm>input[type='password'] {
	  width: 200px;
  }
  #logout {
	  position: fixed;
	  top: 105px;
	  right: 20px;
	  cursor: pointer;
  }
  #firebaseui-auth-container>div {
	  border: none !important;
	  box-shadow: none !important;
  }
  .infoTitle {
	  font-weight: 600;
  }
  #filingDetails {
	  display: flex;
	  flex-direction: column;
	  gap: 20px;
	  padding-bottom: 100px;
  }
  #reportActionsDistribute {
	width: 100%;
	display: flex;
	flex-direction: row;
	gap: 40px;
	position: fixed;
	bottom: 0px;
	justify-content: start;
	background-color: white;
	z-index: 1000;
	border-top: 1px solid black;
	padding-top: 20px;
	padding-left: 50px;
	padding-bottom: 20px;
	transform: translate(-50px);
  }
  .reportActionDistributeElement {
	display: flex;
	flex-direction: column;
	width: fit-content;
	justify-content: start;
	text-align: left;
	gap: 15px;
  }
  #emailForm {
	width: fit-content;
  }
  #emailForm>input[type="text"] {
	width: 400px;
  }
  #copyToClip {
	width: 100%;
  }
  #copyToClip>img{
	width: 30px;
  }

  @media only screen and (max-width:1135px) {
	#reportActionsDistribute {
		flex-direction: column !important;
	}
  }