/* HADIFATH WEB V2 CHANGES 21-24 LOCKED V1.0.1 */

/* Change 22 */
.home-closing-copy {
  font-size: clamp(20px, 1.25vw, 25px) !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}

/* Change 23 */
.sample-account-blur {
  filter: blur(8px) !important;
  user-select: none !important;
  pointer-events: none !important;
}

.sample-premium-locked {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

.sample-premium-locked::before {
  content: "";
  position: absolute;
  z-index: 2147483000;
  left: 0;
  right: 0;
  top: 66px;
  bottom: 0;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  background: rgba(4, 10, 20, 0.30);
  border-radius: inherit;
  pointer-events: auto;
}

.sample-premium-locked::after {
  content: "Locked";
  position: absolute;
  z-index: 2147483001;
  left: 50%;
  top: 58%;
  transform: translate(-50%, -50%);
  padding: 9px 14px;
  border: 1px solid rgba(125, 157, 198, 0.24);
  border-radius: 11px;
  background: rgba(7, 14, 27, 0.80);
  color: #eaf2ff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.05em;
  pointer-events: none;
}

/* Change 24 */
.sample-atr-card {
  grid-column: 1 / -1 !important;
  width: 100%;
  box-sizing: border-box;
  margin: 18px 0;
  padding: 22px;
  border: 1px solid rgba(113, 151, 198, 0.22);
  border-radius: 22px;
  background:
    radial-gradient(circle at 82% 0%, rgba(28, 111, 255, 0.10), transparent 34%),
    linear-gradient(180deg, rgba(16, 24, 37, 0.97), rgba(8, 14, 24, 0.98));
  box-shadow: 0 18px 50px rgba(0,0,0,0.20);
  color: #eef5ff;
}

.sample-atr-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 14px;
}

.sample-atr-eyebrow {
  color: #8ca7ca;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.sample-atr-title {
  margin: 5px 0 0;
  color: #fff;
  font-size: clamp(22px, 2vw, 30px);
  line-height: 1.1;
}

.sample-atr-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}

.sample-atr-pill {
  padding: 7px 10px;
  border: 1px solid rgba(114,154,205,.22);
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  color: #b9c9df;
  font-size: 12px;
  font-weight: 700;
}

.sample-atr-pill.is-active {
  border-color: rgba(46,134,255,.46);
  background: rgba(46,134,255,.20);
  color: #dcebff;
}

.sample-atr-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 18px;
  margin: 0 0 10px;
  color: #9eb1cc;
  font-size: 12px;
}

.sample-atr-key {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.sample-atr-swatch {
  width: 18px;
  height: 3px;
  border-radius: 99px;
  background: currentColor;
}

.sample-atr-chart-wrap {
  position: relative;
  min-height: 430px;
  overflow: hidden;
  border: 1px solid rgba(102,139,184,.13);
  border-radius: 16px;
  background: rgba(2,8,17,.52);
}

.sample-atr-chart {
  display: block;
  width: 100%;
  min-height: 430px;
}

.sample-atr-status {
  position: absolute;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 30px;
  text-align: center;
  color: #b7c6da;
  font-size: 14px;
  background: rgba(4,10,20,.82);
}

.sample-atr-status.is-visible { display: flex; }

.sample-atr-foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 18px;
  margin-top: 10px;
  color: #7f95b3;
  font-size: 11px;
}

@media (max-width: 760px) {
  .sample-atr-card { padding: 14px; border-radius: 16px; }
  .sample-atr-head { display: block; }
  .sample-atr-meta { justify-content: flex-start; margin-top: 12px; }
  .sample-atr-chart-wrap, .sample-atr-chart { min-height: 350px; }
}