/* 
  Nomeando opacidade com contagem de 10%.
  ex: 10% = 1
      20% = 2
      30% = 3
      40% = 4
      50% = 5
      60% = 6
      70% = 7
      80% = 8
      90% = 9
      100% = 10
  --primary-color-blue-8: #233568cc;
*/

/* FONT-FAMILY - INTER (ALL) */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap');

:root {
  /* cores */
  --primary-color-blue: #233568;
  --primary-color-blue-8: #233568cc;
  --primary-color-blue-100:#233568c9;
  --primary-color-white: #ffffff;
  --primary-background: #f2f2f7;
  --primary-gray-50:#e6e6e6;
  --primary-gray-100:#E9EBF0;
  --primary-gray-150:#eceff1;
  --primary-gray-200:#b8bed6;
  --primary-gray-250:#E0E4EE;
  --primary-gray-300:#e6e6e6;
  --primary-gray-350:#ced4da;
  --primary-gray-400:#eceff1b5;
  --primary-gray-500:#68686E;
  --primary-gray-600:#ccc;
  --primary-gray-650:#999;
  --primary-gray-700:#1a1a1a;
  --primary-gray-800:#cccccc;
  --primary-gray-900:#000;
  --primary-pink-50:#F1C6C0;
  --primary-pink-100:#F1C4C0;
  --primary-salmon-200: #f2a691;
  --primary-salmon-300:#ffa086;
  --primary-green-50:#A8F0BE;
  --primary-green-100:#D0F285;
  --primary-green-300:#3e8e41;
  --primary-green-500:#0cb97b;
  --primary-black-200: #00000029;
  --primary-red-300:#ff626c;
  --primary-red-400:#fa5661;
  --primary-red-500:#dc3545;
  --primary-red-700:#FF2147;
  --primary-light-blue-300:#00b0ff;
  --primary-light-blue-500:#00446A;


  /* fontes */

  --font-montserrat: 'Montserrat', sans-serif;
  --font-ibm-plex: 'IBM Plex Sans Condensed', sans-serif;
  --font-inter: 'Inter', sans-serif;
  --font-poppins:'Poppins', "custom_heading_font", sans-serif;
  --font-source-sans-pro:'Source Sans Pro', sans-serif;

}

/* 
   ----------------- Padrões de estilo para layout centro de tela.
*/

.primary-container {
  background-color: var(--primary-background);
  height: 91.81vh;
  /*width: 100%;*/ 
  display: grid;
  justify-content: center;
  padding: 0 20px;
  overflow-y: scroll;
  /*margin-top: 70px;*/
  /*position: fixed;*/
}

/* PARA NAVEGADORES - Firefox */
@-moz-document url-prefix() {
  .primary-container {
    /* height: 100% !important; */
    /* background-color: red; */
  }
}

@media (max-width: 1100px) {
  .secondary-container {
    max-width: 970px !important;
    /* background-color: red; */
  }
}

@media (min-width: 1100px) {
  .secondary-container {
    width: 970px !important;
  }
}

/* @media (max-width: 1280px) {
  .secondary-container {
  }
} */

/* 
  Padrões de breadcrumb para layout em componentes.
*/
.breadcrumb-navigation {
  font-family: "Inter", sans-serif;
  align-items: center;
  font-weight: 600;
  font-size: 18px;
  margin: 50px 0;
  display: flex;
  gap: 5px;
}

.breadcrumb-navigation div {
  cursor: pointer;
  display: flex;
  gap: 5px;
}

.breadcrumb-navigation p {
  color: var(--primary-color-blue);
  margin: 0;
}

.pagination-controls {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 20px;
	justify-content: space-between;
	width: -webkit-fill-available;
  }
  .pagination-controls-container{
	display: flex;
	align-items: center;
	gap: 8px;
  
  }
  .pagination-controls h1 {
	cursor: pointer;
	color: #233568;
	font-family: Inter;
	font-size: 16px;
	font-weight: 400;
  }
  .pagination-controls button{
	display: flex;
	border: none;
	padding: 10px;
	justify-content: center;
	align-items: center;
	gap: 8px;
	color: #007CC1;
	font-family: Inter;
	font-size: 16px;
	font-weight: 400;
	text-decoration-line: underline;
	background: none;
  }
  .pagination-controls button:hover{
	background: none!important;;
  }
  .pagination-controls span{
	display: flex;
	padding: 10px;
	justify-content: center;
	align-items: center;
	color: #233568;
	font-family: Inter;
	font-size: 16px;
	font-weight: 400;
	cursor:pointer;
  }
  .pagination-controls span.active {
	display: flex;
	padding: 10px;
	justify-content: center;
	align-items: center;
	border-radius: 2px;
	background: #3D9ED4;
	color: #FFF;
	font-family: Inter;
	font-size: 16px;
	font-weight: 700;
  width: 10px;
  height: 10px;
  }

/* 
  Padrões de Card Principal para layout em componentes.
*/

.card-layout-agendamento {
  box-shadow: 0px 1px 3px 0px rgba(96, 108, 128, 0.05);
  font-family: "Inter", sans-serif;
  background-color: #F2A691;
  animation: fadeIn 2s;
  border-radius: 15px;
  margin: 40px 0 0 0;
  cursor: pointer;
  padding: 30px;
}


.card-layout {
	box-shadow: 0px 1px 3px 0px rgba(96, 108, 128, 0.05);
  font-family: "Inter", sans-serif;
  background-color: #fff;
  animation: fadeIn 2s;
  border-radius: 15px;
  margin: 40px 0 0 0;
  cursor: pointer;
  padding: 30px;
  position: relative;
  /*z-index: 99999 !important;*/
}

.card-layout-intern {
  box-shadow: 0px 1px 3px 0px rgba(96, 108, 128, 0.05);
  font-family: "Inter", sans-serif;
  background-color: #fff;
  animation: fadeIn 2s;
  border-radius: 15px;
  margin: 40px 0 0 0;
  cursor: pointer;
  padding: 30px;
  position: relative;
  /*z-index: 99999 !important;*/
}

.go-home-page {
  align-items: center;
  width: max-content;
  display: flex;
  gap: 10px;
}

.go-home-page p {
  color: var(--primary-color-blue-8);
  font-weight: 500;
  font-size: 18px;
  margin:0;
}

.card-description {
  align-items: center;
  margin-top:30px;
  display: grid;
}

.card-description div {
  margin: 10px 0 40px 0;
  display: flex;
  gap:10px;
}

.card-description div p {
  background-color:#F2F2F7;
  border-radius: 9px;
  padding: 15px;
  width: fit-content;
  margin: 0;
}

.card-description .card-description-background {
  background-color: #F2F2F7;
  border-radius: 9px;
  padding: 15px;
  width: fit-content;
  margin: 10px 0 40px 0;
}

.card-description-title {
  color: var(--primary-color-blue);
  font-weight: 700;
  font-size: 24px;
  margin:0;
}

.card-description-text {
  color: var(--primary-color-blue);
  font-size: 16px;
  margin:0;
}