/*
ihg blue
rgba(31, 68, 86, 1)
#1F4456

ihg red 
rgba(199, 55, 15, 1)
#C7370F
*/



 .ihg-spinner {
   display: inline-block;
   width: 16px;
   height: 16px;
   border: 2px solid #fff;
   border-top: 2px solid #000;
   border-radius: 50%;
   animation: spin 0.8s linear infinite;
   margin-right: 6px;
 }
 @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
  

/* Container wrapping both sections */
.ihg-army {
  position: relative;
  min-height: 85vh; 
}

/* Section 1 - always visible initially */
.ihg-army__section--list {
  position: static;
  width: 100%;
  opacity: 1;
  pointer-events: auto;
  transition: opacity 0.4s ease;
  display: block;
  height: auto;
}

/* Section 2 - hidden initially for slideDown */
.ihg-army__section--next {
  display: none;
  width: 100%;
  /* no opacity or pointer-events forced here */
}

.ihg-army__section--next h2{
     font-size: 1.4rem;
    line-height: 1.1em;
    font-weight: 500;
    margin: 0 0 2vh 0;       
}


/* Optional margin between sections */
.ihg-army__section {
  margin-bottom: 2rem;
}


                /* INTRO */
                
.Intro{
    background-color: rgba(31, 68, 86, .05);
    padding: 1vw;
    border-top: 1px solid #1F4456;
    border-bottom: 1px solid #1F4456;    
}            

.Intro p{
    font-size: 1.1rem;
    line-height: 1.1em;
    font-weight: 300;
    margin: 0 0 2vh 0;
}

.Intro h3{
     font-size: 1.2rem;
    line-height: 1.1em;
    font-weight: 500;
    margin: 0 0 1vh 0;   
}

html, body {
  height: 100%;
}

.ihg-army__section--list {
  height: 100%; /* or min-height: 100vh if you want full viewport height */
}

/* Hide with class */
.ihg-army__section.is-hidden {
  display: none !important;
}

/* Fade out Section 1 */
.ihg-army__section--list.fade-out {
  opacity: 0;
  pointer-events: none;
}

/* Optional: layout and style of rows and columns below */

.ihg-row {
  display: flex;
  align-items: stretch; /* stretch children vertically */
  border-bottom: 1px solid #1F4456;
}
.ihg-col {
  display: flex;
  flex-direction: column;
  justify-content: center; /* vertical center */
  text-align: left;
}

.ihg-col--img,
.ihg-qtyrow,
.ihg-select {
  flex-shrink: 0;
}

.ihg-col.select {
  text-align: right;
  align-items: flex-end;
}

/* Image Column */
.ihg-col--img {
  width: 15%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: right;
  flex-basis: 15%;
  overflow: hidden;
}

.ihg-img-wrap {
  width: 100%;
  aspect-ratio: 1 / 1;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.ihg-img,
.ihg-img img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;
  display: block;
}

                                /* Name Column */
.ihg-col--main {
  width: 55%;
  flex-grow: 1;
  padding: 1vw 0 0 1vw;
}

.ihg-name {
  font-weight: 600;
  font-size: 1.1rem;
  margin-bottom: 1vh;
}

.ihg-desc p {
  font-weight: 300;
  font-size: 1rem;
  margin: 0 0 0.2em 0;
}

label.ihg-attr, select.ihg-attr__select, .ihg-attr__select option {
   font-weight: 300;
  font-size: 1rem;
  line-height: 1.2em;
    padding-right: .4em;    
  margin: 0 0 0.2em 0;   
}

                            /* Qty label and input */
.ihg-qtyrow {
  width: 15%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.ihg-qtylbl {
  font-size: 1rem;
  line-height: 1.5em;
  color: black;
  margin-right: 0.5em;
}
.ihg-qty {
  width: 3rem;
  text-align: right;
  font-size: 1rem;
  line-height: 1.5em;
}

/* Select Column */
.ihg-col.ihg-select {
  width: 15%;
  font-size: 1rem;
  line-height: 1.5em;
  text-transform: uppercase;
  display: flex;
  flex-direction: column;     
  justify-content: center;    
  align-items: flex-end;      
  padding-right: 1vw;
  text-align: right;
}


label.ihg-pick {
  font-size: 1rem;
  line-height: 1.5em;
  text-transform: uppercase;
  cursor: pointer;
}

input.ihg-pick__check {
  margin-left: 0.5em;
}

                                /* Statement and Continue */
                                
.ihg-stmt-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 2vh 1vw 2vw 2vw;
  background-color: #ffffe6;
}

.ihg-stmt-label span{
   font-weight: 600;
  font-size: 1.2rem;
  line-height: 1.2em;
  margin-bottom: 1vh;   
}

.ihg-stmt-check {
  margin-left: 5vw; 
}                                
                                
                                
.ihg-statement {
  padding: 2vw;
  background-color: #ffffcc;
}

.ihg-actions {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding: 2vh 0;
}

.button.ihg-continue, .button.ihg-optional-continue {
  color: white;
  background-color: #1F4456;
  border-radius: 5px;
  padding: 2vh 4vw;
  cursor: pointer;
}

.button.ihg-continue[disabled] {
  opacity: 0.2;
  cursor: not-allowed;
}