:root {
  box-sizing: border-box;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

/* set any base values here as required */
body.indv-legacy-theme {
  /* Indv Global CSS variables */
  --default-font-size: 14px;
  --default-subset-font-size: 14px;
  --default-font-color: var(--ia-color-type-main);
  --default-title-color: var(--ia-color-type-main);
  --default-page-title-direction: column-reverse;
  --default-sub-menu-margin: 4px 0 0 0;
}

/* Global CSS Variable changes for modern theme */
body.indv-modern-theme {
  --default-subset-font-size: 12px;
  --default-font-color: var(--gbi-blue-midnight);
  --default-title-color: var(--gbi-blue-heritage);
  --default-page-title-direction: column;
  --default-sub-menu-margin: 0 0 16px 0;
}

body {
  margin: 0;
  padding: 0;
  font-family: var(--font-family);
  font-size: var(--default-font-size);
  /* component library overrides */
  --ia-dxp-title-t0-margin: 0;
  --ia-dxp-title-t1-margin: 0;
  --ia-dxp-title-t1-color: var(--default-title-color);
  --ia-dxp-title-t2-margin: 0;
  --ia-dxp-title-t2-color: var(--default-title-color);
  --ia-dxp-title-t3-margin: 0;
  --ia-dxp-title-t3-font-size: 22px;
  --ia-dxp-title-t3-color: var(--default-font-color);
  --ia-dxp-title-t4-margin: 0;
  --ia-dxp-title-t4-color: var(--default-font-color);
  --ia-dxp-title-t5-margin: 0;
  --ia-dxp-title-t5-color: var(--default-font-color);
  --ia-dxp-paragraph-color: var(--default-font-color);
  --ia-dxp-input-radio-font-size: 14px;
  --ia-dxp-link-color: var(--primary-color);
  --ia-dxp-link-hover-color: var(--ia-color-blue-7);
  --ia-dxp-card-max-width: min(100%, 1200px);
  --ia-dxp-card-container-no-header-padding: 32px 16px;
  --ia-dxp-form-row-spacing: 0;
}

a {
  color: var(--primary-color);
}

label:not(:is([data-iafg] *)) {
  display: inline-block;
  margin-bottom: var(--spacing-s);
  font-weight: 600;
}

form, .form-contents {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xl);
}

section {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xxl-3);
}

section.info-card {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xl);
}

.flex-align-items-center {
  align-items: center;
}

fieldset {
  all: unset;
  display: block;
  width: 100%;
  box-sizing: border-box;
}

div[role="group"] {
  padding: var(--spacing-s);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-s);
}

c-indv-layout-form-column {
  width: 100%;
  max-width: 85%;
  min-width: 65%;
}

.action-buttons {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  gap: var(--spacing-s);
}

iafg-card[data-iafg-no-radius] {
  --ia-dxp-card-border-radius: 0;
}

/* Prevent a div wrapping slot elements from causing styling problems */
.remove-slotted-div {
  display: contents;
}

/* Table stiyling classes */

.no-border {
  border-width: 0;
}

.flex-three {
  flex: 3;
}

.flex-one {
  flex: 1;
}

.col-small {
  --ia-dxp-form-column-span: 2;
}
.col-medium {
  --ia-dxp-form-column-span: 4;
}
.col-large {
  --ia-dxp-form-column-span: 6;
}
.col-xlarge {
  --ia-dxp-form-column-span: 8;
}
.col-xxlarge {
  --ia-dxp-form-column-span: 10;
}
.col-full {
  --ia-dxp-form-column-span: 12;
}

/* tablet and below */
@media (max-width: 768px) {

  .col-small {
    --ia-dxp-form-column-span: 4;
  }
  .col-medium {
    --ia-dxp-form-column-span: 6;
  }
  .col-large {
    --ia-dxp-form-column-span: 8;
  }
  .col-xlarge {
    --ia-dxp-form-column-span: 10;
  }
  .col-xxlarge {
    --ia-dxp-form-column-span: 12;
  }
}

/* mobile and below */
@media (max-width: 480px) {
  .col-small {
    --ia-dxp-form-column-span: 6;
  }
  .col-medium {
    --ia-dxp-form-column-span: 8;
  }
  .col-large {
    --ia-dxp-form-column-span: 10;
  }
  .col-xlarge {
    --ia-dxp-form-column-span: 12;
  }
  .col-xxlarge {
    --ia-dxp-form-column-span: 12;
  }
}
