.warranties-list{
  display:flex;
  flex-direction:row;
  gap:14px;
  margin-top:12px;
  flex-wrap:wrap;
  align-items:stretch;
  justify-content:center;
}

.warranty-row{
  position:relative;
  width:360px;
  display:flex;
  justify-content:center;
  gap:14px;
  padding:16px 18px;
  text-decoration:none;
  transition:transform .15s ease, background-color .15s ease, border-color .15s ease;
  cursor:pointer;
  align-items:flex-start;
  flex-direction:column;
}

.warranty-add-card{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:8px;
  cursor:pointer;
  text-align:center;
}

.warranty-add-plus{
  font-size:1.7rem;
  line-height:1;
  font-weight:700;
}

.warranty-loading-card{
  width:360px;
  padding:16px 18px;
}

.warranty-main{
  width:100%;
  min-width:0;
  text-align:left;
}

.warranty-card-top{
  width:100%;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.warranty-title{
  font-weight:600;
  font-size:1.05rem;
  line-height:1.25;
}

.warranty-meta{
  margin-top:4px;
  font-size:.9rem;
  line-height:1.35;
}

.warranty-stats{
  width:100%;
  flex:1;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:8px;
}

.warranty-numbers{
  font-size:.95rem;
  line-height:1.35;
}

.warranty-current{
  font-weight:600;
}

.warranty-sep{
  margin:0 6px;
}

.warranty-estimate{
  font-size:.9rem;
  line-height:1.35;
}

.warranty-detail-modal-body{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.warranty-detail-panel{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:16px;
}

.warranty-detail-top,
.warranty-detail-grid,
.warranty-detail-grid-bellow{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.warranty-detail-grid-bellow{
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.warranty-detail-box,
.warranty-note-box,
.warranty-detail-section{
  border:1px solid;
  border-radius:14px;
  padding:5px 12px;
}

.warranty-detail-label{
  font-size:.78rem;
  opacity:.75;
  margin-bottom:6px;
}

.warranty-detail-value{
  font-size:1rem;
  font-weight:700;
  line-height:1.25;
}

.warranty-detail-section-title{
  font-weight: 200;
  margin-bottom: 10px;
  font-size: 13px;
  text-align: center;
}

.warranty-detail-progress-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:8px;
  font-size:.9rem;
}

.warranty-detail-subline{
  margin-top:5px;
  font-size:.9rem;
  opacity:.75;
}

.warranty-modal-footer-actions,
.warranty-modal-footer-actions-transactions{
  display: grid;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
}

.warranty-modal-footer-actions{
  grid-template-columns: 0.5fr 1fr 1fr;
}

.warranty-modal-footer-actions-transactions{
  grid-template-columns: 0.5fr 1fr;
}

.warranty-form-layout{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.checkbox-reminder{
  align-self: center;
}

.warranty-form-step{
  margin-bottom:14px;
}

.warranty-form-one{
  display:grid;
  grid-template-columns: 1fr 0.5fr;
  gap:12px;
  align-items:end;
}

.warranty-form-two{
  display:grid;
  grid-template-columns:0.5fr 1fr;
  gap:10px;
  align-items:end;
}

.warranty-input{
  width:100%;
  font-weight: 600;
  padding:10px 12px;
  border:1px solid;
  border-radius:10px;
  outline:none;
}

.warranty-textarea{
  min-height:90px;
  resize:vertical;
}

.warranty-input-wrap{
  display:flex;
  align-items:center;
  gap:10px;
}

.warranty-input-wrap .warranty-input{
  flex:1;
}

.warranty-transactions-list{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom: 10px;
}

.warranty-transaction-row{
  width:100%;
  display:flex;
  align-items:center;
  opacity: 0.8;
  justify-content:space-between;
  gap:12px;
  border:1px solid;
  border-radius:12px;
  padding:5px 12px;
  cursor:pointer;
  text-align:left;
  transition:all 0.3s ease;
}

.warranty-transaction-row:hover{
  opacity: 1;
}

.warranty-transaction-main{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
}

.warranty-transaction-main strong,
.warranty-transaction-main small{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.warranty-transaction-main-header{
  margin: 0px;
}

.warranty-transaction-amount{
  font-weight:700;
  white-space:nowrap;
}

.warranty-selected-transaction{
  border:1px solid;
  border-radius:12px;
  padding:12px;
}

.warranty-selected-title{
  font-size:.78rem;
  opacity:.75;
  margin-bottom:4px;
}

.warranty-selected-main{
  font-weight:700;
  line-height:1.3;
}

.warranty-selected-meta{
  margin-top:4px;
  font-size:.9rem;
  line-height:1.35;
}

.warranty-loading{
  padding:10px 0;
  font-size:.95rem;
}

.warranty-form-message{
  margin-top:4px;
  text-align:center;
}

@media (max-width:780px){
  .warranty-row,
  .warranty-add-card,
  .warranty-loading-card{
    width:100%;
  }

  .warranty-modal-footer-actions{
    justify-content:stretch;
  }

  .warranty-modal-footer-actions .default-button,
  .warranty-modal-footer-actions .default-button-red{
    width:100%;
  }
}

@media (max-width:520px){
  .warranty-transaction-amount{
    align-self: self-end;
  }
}

.warranty-assign-transaction-btn{
  margin-top:10px;
  width:100%;
  justify-content:center;
}

.warranty-transaction-filter-box {
  display: grid;
  grid-template-columns: 3fr;
  gap: 10px;
  margin-bottom: 14px;
  grid-auto-flow: column;
  justify-items: center;
}

.warranty-transaction-filter-box select[hidden] {
  display: none !important;
}

    .warranty-attachment-row {
      display: flex;
      align-items: center;
	  justify-content: center;
      gap: 12px;
      margin-top: 5px;
      padding-top: 5px;
    }

    .warranty-attachment-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      flex-shrink: 0;
    }

    #warrantyAttachmentModal {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 10050;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }

    #warrantyAttachmentModal.show {
      display: flex;
    }

    .warranty-attachment-modal-content {
      position: relative;
      width: min(520px, 100%);
      max-height: calc(100vh - 40px);
      overflow-y: auto;
      padding: 24px;
      border-radius: 12px;
    }

    .warranty-attachment-modal-close {
      position: absolute;
      top: 10px;
      right: 14px;
      border: 0;
      background: transparent;
      font-size: 1.8rem;
      line-height: 1;
      cursor: pointer;
    }

    .warranty-attachment-file {
      display: block;
      width: 100%;
      margin: 16px 0 8px;
    }

    .warranty-attachment-file-info,
    .warranty-attachment-upload-status {
      min-height: 22px;
      margin-top: 8px;
      font-size: 0.95rem;
    }