/*
 * TANK ZONE — BUILD YOUR TANK PACK
 * External stylesheet required by the website Content Security Policy.
 */

/* Public Tank Pack builder */
.tank-pack-page{
  background:#f3f3ef;
  color:#111;
}
.tank-pack-hero{
  position:relative;
  overflow:hidden;
  padding:clamp(55px,8vw,110px) max(22px,7vw);
  background:
    radial-gradient(circle at 16% 54%,rgba(199,25,32,.3),transparent 34%),
    linear-gradient(105deg,#080808 0%,#0b0b0b 60%,#050505 100%);
  color:#fff;
}
.tank-pack-hero::after{
  content:"PACK";
  position:absolute;
  inset:auto 2vw -4vw auto;
  color:transparent;
  -webkit-text-stroke:1px rgba(255,255,255,.08);
  font:900 clamp(8rem,24vw,25rem)/.75 Arial,sans-serif;
  pointer-events:none;
}
.tank-pack-hero-inner{
  position:relative;
  z-index:1;
  width:min(1180px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);
  gap:55px;
  align-items:end;
}
.tank-pack-kicker{
  margin:0 0 16px;
  color:#df2027;
  font:850 .67rem/1.2 Arial,sans-serif;
  letter-spacing:.17em;
}
.tank-pack-hero h1{
  max-width:850px;
  margin:0;
  font-size:clamp(3.1rem,7vw,8rem);
  line-height:.82;
  letter-spacing:-.055em;
}
html[dir="rtl"] .tank-pack-hero h1{
  letter-spacing:-.035em;
}
.tank-pack-hero-copy>p:last-child{
  max-width:720px;
  margin:26px 0 0;
  color:#aaa;
  line-height:1.9;
}
.tank-pack-discount-card{
  padding:26px;
  border:1px solid #333;
  background:rgba(255,255,255,.035);
}
.tank-pack-discount-card span{
  display:block;
  color:#999;
  font-size:.65rem;
}
.tank-pack-discount-card strong{
  display:block;
  margin:8px 0;
  color:#fff;
  font:900 clamp(3rem,6vw,6rem)/1 Arial,sans-serif;
}
.tank-pack-discount-card p{
  margin:0;
  color:#d8d8d8;
  line-height:1.7;
}
.tank-pack-builder{
  width:min(1320px,calc(100% - 40px));
  margin:auto;
  padding:70px 0 100px;
}
.tank-pack-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) 350px;
  gap:34px;
  align-items:start;
}
.tank-pack-steps{
  display:grid;
  gap:24px;
}
.tank-pack-step{
  padding:28px;
  border:1px solid #d8d8d2;
  background:#fff;
}
.tank-pack-step-head{
  margin-bottom:24px;
  display:grid;
  grid-template-columns:54px 1fr;
  gap:16px;
  align-items:start;
}
.tank-pack-step-number{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  background:#111;
  color:#fff;
  font:850 .72rem/1 Arial,sans-serif;
}
.tank-pack-step-head h2{
  margin:0 0 6px;
  font-size:clamp(1.45rem,2.6vw,2.5rem);
}
.tank-pack-step-head p{
  margin:0;
  color:#777;
  line-height:1.7;
}
.tank-pack-product-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.tank-pack-product{
  min-width:0;
  padding:0;
  border:1px solid #deded8;
  background:#f8f8f5;
  transition:border-color .18s,box-shadow .18s,transform .18s;
}
.tank-pack-product.is-selected{
  border-color:#c71920;
  box-shadow:0 0 0 2px rgba(199,25,32,.16);
  transform:translateY(-2px);
}
.tank-pack-product-image{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  background:#eeeee9;
}
.tank-pack-product-image img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.tank-pack-product-check{
  position:absolute;
  inset:12px 12px auto auto;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  background:#111;
  color:#fff;
  opacity:0;
  transform:scale(.7);
  transition:opacity .18s,transform .18s;
}
html[dir="rtl"] .tank-pack-product-check{
  inset:12px auto auto 12px;
}
.tank-pack-product.is-selected .tank-pack-product-check{
  opacity:1;
  transform:scale(1);
  background:#c71920;
}
.tank-pack-product-copy{
  padding:15px;
}
.tank-pack-product-copy h3{
  min-height:2.7em;
  margin:0 0 9px;
  font-size:.82rem;
  line-height:1.45;
}
.tank-pack-product-copy>span{
  display:block;
  margin-bottom:12px;
  font-weight:850;
}
.tank-pack-product select{
  width:100%;
  min-height:42px;
  padding:8px 9px;
  border:1px solid #bbb;
  border-radius:0;
  background:#fff;
  color:#111;
  font:700 .68rem/1.35 inherit;
}
.tank-pack-summary{
  position:sticky;
  top:120px;
  padding:26px;
  border:1px solid #252525;
  background:#0a0a0a;
  color:#fff;
}
.tank-pack-summary>span{
  color:#d91e25;
  font:850 .62rem/1 Arial,sans-serif;
  letter-spacing:.15em;
}
.tank-pack-summary h2{
  margin:12px 0 24px;
  font-size:2rem;
}
.tank-pack-summary-selection{
  display:grid;
  gap:10px;
  margin-bottom:22px;
}
.tank-pack-summary-selection div{
  min-height:52px;
  padding:11px 13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border:1px solid #272727;
  color:#888;
  font-size:.7rem;
}
.tank-pack-summary-selection div.is-ready{
  color:#fff;
  border-color:#444;
}
.tank-pack-summary-selection strong{
  max-width:210px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.tank-pack-price-lines{
  display:grid;
  gap:12px;
  padding:20px 0;
  border-top:1px solid #2b2b2b;
  border-bottom:1px solid #2b2b2b;
}
.tank-pack-price-lines div{
  display:flex;
  justify-content:space-between;
  gap:15px;
  color:#aaa;
  font-size:.72rem;
}
.tank-pack-price-lines .tank-pack-saving{
  color:#e62b32;
}
.tank-pack-price-lines .tank-pack-final{
  align-items:end;
  color:#fff;
  font-size:.88rem;
  font-weight:800;
}
.tank-pack-price-lines .tank-pack-final strong{
  font:900 1.7rem/1 Arial,sans-serif;
}
.tank-pack-submit{
  width:100%;
  min-height:54px;
  margin-top:22px;
  padding:12px 15px;
  border:1px solid #c71920;
  border-radius:0;
  background:#c71920;
  color:#fff;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  font:850 .76rem/1.2 inherit;
  cursor:pointer;
}
.tank-pack-submit:hover{
  background:#e02229;
  border-color:#e02229;
}
.tank-pack-submit:disabled{
  border-color:#2b2b2b;
  background:#1a1a1a;
  color:#666;
  cursor:not-allowed;
}
.tank-pack-summary-note{
  margin:15px 0 0;
  color:#777;
  font-size:.61rem;
  line-height:1.7;
}
.tank-pack-unavailable{
  padding:70px 20px;
  text-align:center;
}
@media(max-width:1080px){
  .tank-pack-form{
    grid-template-columns:1fr;
  }
  .tank-pack-summary{
    position:static;
  }
}
@media(max-width:820px){
  .tank-pack-hero-inner{
    grid-template-columns:1fr;
  }
  .tank-pack-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:520px){
  .tank-pack-builder{
    width:min(100% - 22px,1320px);
    padding:38px 0 70px;
  }
  .tank-pack-step{
    padding:15px;
  }
  .tank-pack-step-head{
    grid-template-columns:42px 1fr;
  }
  .tank-pack-step-number{
    width:42px;
    height:42px;
  }
  .tank-pack-product-grid{
    gap:7px;
  }
  .tank-pack-product-copy{
    padding:10px;
  }
  .tank-pack-product-copy h3{
    font-size:.68rem;
  }
  .tank-pack-product select{
    font-size:.59rem;
    padding:6px;
  }
}

/* Homepage Tank Pack call-to-action */
.tank-pack-home-cta{
  padding:clamp(55px,8vw,105px) max(20px,7vw);
  background:
    radial-gradient(circle at 18% 50%,rgba(199,25,32,.3),transparent 35%),
    #080808;
  color:#fff;
}
.tank-pack-home-inner{
  width:min(1180px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:45px;
  align-items:end;
}
.tank-pack-home-cta small{
  color:#dc2027;
  font:850 .65rem/1 Arial,sans-serif;
  letter-spacing:.16em;
}
.tank-pack-home-cta h2{
  max-width:850px;
  margin:15px 0 18px;
  font-size:clamp(2.8rem,6vw,7rem);
  line-height:.86;
  letter-spacing:-.05em;
}
html[dir="rtl"] .tank-pack-home-cta h2{
  letter-spacing:-.03em;
}
.tank-pack-home-cta p{
  max-width:700px;
  margin:0;
  color:#aaa;
  line-height:1.85;
}
.tank-pack-home-action{
  min-width:215px;
  min-height:55px;
  padding:13px 17px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  background:#c71920;
  color:#fff;
  font-weight:850;
}
.tank-pack-home-action:hover{
  background:#e02229;
}
@media(max-width:760px){
  .tank-pack-home-inner{
    grid-template-columns:1fr;
  }
  .tank-pack-home-action{
    width:100%;
  }
}

/* Admin Tank Pack settings */
.tank-pack-admin-head{
          display:grid;
          grid-template-columns:1fr auto;
          gap:25px;
          align-items:start;
        }
        .tank-pack-admin-head p{
          max-width:750px;
          color:#777;
          line-height:1.75;
        }
        .tank-pack-admin-switch{
          padding:15px;
          border:1px solid #ddd;
          background:#fafafa;
        }
        .tank-pack-admin-switch label{
          display:flex;
          align-items:center;
          gap:9px;
          font-weight:800;
        }
        .tank-pack-admin-switch input{
          width:18px;
          height:18px;
        }
        .tank-pack-admin-config{
          margin-top:22px;
          display:grid;
          grid-template-columns:220px 1fr;
          gap:22px;
        }
        .tank-pack-admin-products{
          display:grid;
          gap:18px;
        }
        .tank-pack-admin-product-group{
          padding:18px;
          border:1px solid #ddd;
        }
        .tank-pack-admin-product-group h3{
          margin:0 0 13px;
        }
        .tank-pack-admin-product-list{
          display:grid;
          grid-template-columns:repeat(2,minmax(0,1fr));
          gap:8px;
        }
        .tank-pack-admin-product-list label{
          min-height:43px;
          padding:9px 11px;
          display:flex;
          align-items:center;
          gap:9px;
          border:1px solid #e1e1e1;
          background:#fafafa;
        }
        .tank-pack-admin-product-list input{
          width:17px;
          height:17px;
          flex:0 0 auto;
        }
        @media(max-width:800px){
          .tank-pack-admin-head,
          .tank-pack-admin-config{
            grid-template-columns:1fr;
          }
          .tank-pack-admin-product-list{
            grid-template-columns:1fr;
          }
        }

/* =========================================================
   FLEXIBLE ANY-3 TANK PACK — V3
   Exactly 3 items; at least 1 shirt.
   ========================================================= */
.tank-pack-step-title-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.tank-pack-step-title-row h2{
  margin:0;
}
.tank-pack-section-badge{
  padding:7px 9px;
  border:1px solid #d7d7d2;
  background:#f5f5f1;
  color:#555;
  font-size:.56rem;
  font-weight:850;
  letter-spacing:.04em;
}
.tank-pack-section-badge.is-required{
  border-color:#c71920;
  background:#fff0f0;
  color:#a51218;
}
.tank-pack-section-badge.is-optional{
  border-color:#d5d5d0;
  color:#777;
}
.tank-pack-product-check{
  font-size:.72rem;
  font-weight:900;
}
.tank-pack-product.is-selected
.tank-pack-product-check{
  opacity:1;
  transform:scale(1);
}
.tank-pack-quantity-control{
  margin-top:10px;
  min-height:43px;
  display:grid;
  grid-template-columns:44px 1fr 44px;
  border:1px solid #bbb;
  background:#fff;
}
.tank-pack-quantity-control button{
  border:0;
  border-radius:0;
  background:#111;
  color:#fff;
  font-size:1.2rem;
  font-weight:800;
  cursor:pointer;
}
.tank-pack-quantity-control button:hover:not(:disabled){
  background:#c71920;
}
.tank-pack-quantity-control button:disabled{
  background:#e7e7e3;
  color:#aaa;
  cursor:not-allowed;
}
.tank-pack-quantity-control>div{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#777;
  font-size:.58rem;
  font-weight:800;
}
.tank-pack-quantity-control strong{
  color:#111;
  font-size:.9rem;
}
.tank-pack-summary-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin:12px 0 24px;
}
.tank-pack-summary-heading h2{
  margin:0;
}
.tank-pack-progress{
  padding:7px 9px;
  border:1px solid #353535;
  color:#aaa;
  font:850 .68rem/1 Arial,sans-serif;
}
.tank-pack-progress.is-complete{
  border-color:#c71920;
  background:#c71920;
  color:#fff;
}
.tank-pack-validation-message{
  min-height:45px;
  margin:0 0 17px;
  padding:11px 13px;
  border-inline-start:3px solid #777;
  background:#151515;
  color:#aaa;
  font-size:.65rem;
  line-height:1.65;
}
.tank-pack-validation-message.is-valid{
  border-inline-start-color:#2ba75e;
  color:#bff0d0;
}
.tank-pack-validation-message.is-warning{
  border-inline-start-color:#c71920;
  color:#ffb3b6;
}
.tank-pack-summary-selection strong{
  max-width:235px;
}
@media(max-width:520px){
  .tank-pack-step-title-row{
    align-items:flex-start;
    flex-direction:column;
  }
  .tank-pack-section-badge{
    font-size:.51rem;
  }
  .tank-pack-quantity-control{
    grid-template-columns:38px 1fr 38px;
  }
}