/* =============== CARD =============== */

.enory-calc__card{
  background: #ffffff;
  border-radius: 22px;
  padding: 32px;
  box-shadow: 0 20px 45px rgba(0,0,0,.06);
  border: 1px solid rgba(0,0,0,.05);
  transition: box-shadow .2s ease, transform .15s ease;
}

.enory-calc__card:hover{
  box-shadow: 0 25px 55px rgba(0,0,0,.08);
  transform: translateY(-2px);
}

/* =============== HEADER =============== */

.enory-calc__title{
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -.3px;
  margin-bottom: 6px;
}

.enory-calc__desc{
  font-size: 14px;
  opacity: .7;
  margin-bottom: 22px;
}

/* =============== GRID =============== */

.enory-calc__grid{
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(250px,1fr));
  gap: 22px;
  margin-bottom: 22px;
}

.enory-calc__field{
  display:flex;
  flex-direction: column;
  gap: 8px;
}

.enory-calc__label{
  font-weight: 600;
  font-size: 14px;
  opacity: .85;
}

/* =============== INPUTS =============== */

.enory-calc__input{
  height: 48px;
  padding: 0 16px;
  border-radius: 14px;
  border: 1px solid rgba(0,0,0,.1);
  background: #fafafa;
  font-size: 15px;
  transition: all .15s ease;
}

.enory-calc__input:focus{
  outline:none;
  border-color: #111827;
  background:#fff;
  box-shadow: 0 0 0 3px rgba(17,24,39,.08);
}

.enory-calc__help{
  font-size: 12px;
  opacity: .6;
}

/* =============== BUTTONS =============== */

.enory-calc__actions{
  display:flex;
  align-items:center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 10px;
}

.enory-calc__btn{
  height: 46px;
  padding: 0 22px;
  border-radius: 14px;
  border:none;
  cursor:pointer;
  font-weight: 600;
  transition: all .15s ease;
  background:#111827;
  color:#fff;
}

.enory-calc__btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(0,0,0,.15);
}

.enory-calc__btn:active{
  transform: scale(.97);
}

.enory-calc__btn--ghost{
  background: #f3f4f6;
  color:#111827;
}

.enory-calc__btn--ghost:hover{
  background:#e5e7eb;
}

/* =============== STATUS =============== */

.enory-calc__status{
  font-size: 13px;
  min-height: 18px;
}

.enory-calc__status[data-type="loading"]{
  color:#6b7280;
}

.enory-calc__status[data-type="error"]{
  color:#dc2626;
}

/* =============== RESULT =============== */

.enory-calc__result{
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid rgba(0,0,0,.08);
  animation: fadeIn .25s ease;
}

@keyframes fadeIn{
  from{opacity:0; transform:translateY(4px);}
  to{opacity:1; transform:translateY(0);}
}

.enory-calc__resultLabel{
  font-size: 13px;
  opacity:.6;
  margin-bottom: 6px;
}

.enory-calc__resultValue{
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -.5px;
  margin-bottom: 18px;
  word-break: break-word;
}

/* =============== DETAIL TABLE STYLE =============== */

.enory-calc__details{
  border-radius: 16px;
  border: 1px solid rgba(0,0,0,.08);
  overflow:hidden;
}

.enory-calc__detailRow{
  display:flex;
  justify-content: space-between;
  align-items:center;
  padding: 14px 18px;
  font-size: 14px;
}

.enory-calc__detailRow:nth-child(odd){
  background:#fafafa;
}

.enory-calc__detailKey{
  opacity:.75;
}

.enory-calc__detailVal{
  font-weight:600;
  text-align:right;
}

/* =============== COPY BUTTON =============== */

.enory-calc__copy{
  margin-top:10px;
  height: 38px;
  padding: 0 16px;
  border-radius: 12px;
  background:#f3f4f6;
  border:none;
  cursor:pointer;
  font-size:13px;
  transition: all .15s ease;
}

.enory-calc__copy:hover{
  background:#e5e7eb;
}

.enory-calc__copy:active{
  transform: scale(.95);
}

/* =============== MOBILE OPTIMIZATION =============== */

@media (max-width: 640px){
  .enory-calc__card{
    padding:22px;
  }

  .enory-calc__resultValue{
    font-size:22px;
  }

  .enory-calc__detailRow{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
  }

  .enory-calc__detailVal{
    text-align:left;
  }
}