/* CSS Style Sheet for accordion */
/* NOTE this is a duplicate of view Accordion */

.accordian-block-title
{
  margin-bottom: 1rem;
}

div.ui-accordion .ui-accordion-content 
{
  display: grid;
  grid-template-columns: 1fr;
  height: auto !important;
  padding: 15px;
}

.ui-widget
{
  font-family: var(--font-roboto-condensed);
}

.ui-widget-content
{
  border: 1px solid transparent;
  color: var(--gt-black);
}

.ui-accordion
{
  margin: 0 0 3rem;
}

.ui-accordion .ui-accordion-header
{
  padding: .75em .5em;
  font-weight: 600;
  font-size: 1.3rem;
}

.ui-icon-triangle-1-e
{
  background-position: 2px;
  padding-right: 25px;
}

.ui-icon-triangle-1-s
{
  background-position: 7px 0;
  padding-right: 25px;
}

.ui-state-default
{
  border: none;
  background: var(--gt-warm-grey-light);
  font-family: var(--font-roboto-condensed);
  transition: all .2s ease-in-out;
}

.ui-state-default:hover
{
  background: var(--gt-gold);
  color: var(--gt-black);
}

.ui-state-active
{
  border: none;
  background: var(--gt-gold);
  color: var(--gt-black);
}

.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited
{
  border-bottom: none;
  color: var(--gt-black);
}

.gt-accordion.gt-accordion:last-of-type
{
  margin-bottom: 20px;
}

.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button
{
  border-bottom: none;
  color: var(--gt-black);
  font-size: 1rem;
  font-weight: bold;
}

.ui-icon
{
  background-size: contain;
  height: .7rem;
  width: .7rem;
}

.ui-icon,
.ui-widget-content .ui-icon
{
  background-image: url('../images/gt-gold-chevron.svg');
  float: right;
  padding: 0 20px 0 0;
}

.ui-widget-header .ui-icon
{
  background-image: url('../images/gt-gold-chevron.svg');
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon
{
  background-image: url('../images/gt-black-chevron.svg');
}

.ui-state-active .ui-icon,
.ui-button:active .ui-icon
{
  background-image: url('../images/gt-black-chevron.svg');
  transform: rotate(90deg);
}

.ui-state-highlight .ui-icon,
.ui-button .ui-state-highlight.ui-icon
{
  background-image: url('../images/gt-gold-chevron.svg');
}

.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon
{
  background-image: url('../images/gt-gold-chevron.svg');
}

.ui-button .ui-icon
{
  background-image: url('../images/gt-gold-chevron.svg');
}

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl
{
  border-top-left-radius: 0;
}

.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr
{
  border-top-right-radius: 0;
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl
{
  border-bottom-left-radius: 0;
}

.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br
{
  border-bottom-right-radius: 0;
}

.ui-accordion h3.ui-accordion-header:first-child
{
  border-radius: 10px 10px 0 0;
  background-color: #003057;
  color: #ffffff;
  padding: 15px 0 15px 30px;
  font-family: var(--font-roboto-condensed) !important;
}

.ui-accordion h3.ui-accordion-header
{
  border-radius: 0;
  background-color: #003057;
  color: #ffffff;
  font-family: var(--font-roboto-condensed) !important;
  padding: 15px 0 15px 30px;
}


.ui-accordion h3
{
  font-family: var(--font-roboto-condensed) !important;
}

.ui-accordion-content-active
{
  border: #002B4B 2px solid !important;
}

.ui-icon,
.ui-widget-content .ui-icon,
.ui-widget-content .ui-accordion-header-active .ui-icon
{
  background-image: url('../images/gt-white-arrow.svg');
  float: right !important;
  padding: 10px 40px 0 0 !important;
  margin-top: 3px;
}

.ui-widget-header .ui-icon
{
  background-image: url('../images/gt-white-arrow.svg');
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon
{
  background-image: url('../images/gt-white-arrow.svg');
}

.ui-state-active .ui-icon,
.ui-button:active .ui-icon
{
  background-image: url('../images/gt-white-arrow.svg');
  transform: rotate(180deg);
  position: relative;
  margin: 0 20px 0 0;
}

.ui-state-highlight .ui-icon,
.ui-button .ui-state-highlight.ui-icon
{
  background-image: url('../images/gt-white-arrow.svg');
}

.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon
{
  background-image: url('../images/gt-white-arrow.svg');
}

.ui-button .ui-icon
{
  background-image: url('../images/gt-white-arrow.svg');
}