/* Extra layout and actions for the remittance edit page. */

.form-grid{
grid-template-areas:
"date date date date"
"company company company company"
"entity entity entity entity"
"payment payment senderAccount senderAccount"
"senderName senderName senderName senderName"
"beneficiaryName beneficiaryName beneficiaryName beneficiaryName"
"currency amount senderCommission companyCommission"
"senderTotal senderTotal companyTotal companyTotal"
"status status status status"
"notes notes notes notes";
}

.field:nth-child(14){
grid-area:status;
}

.field:nth-child(15){
grid-area:notes;
}

.edit-actions{
grid-template-columns:repeat(4, minmax(0, 1fr));
}

.delete{
background:#dc2626;
color:#fff;
}

.delete-card h2{
color:#991b1b;
}

.delete-warning{
margin:0;
padding:14px;
border-radius:12px;
background:#fee2e2;
color:#991b1b;
font-size:16px;
font-weight:800;
line-height:1.7;
text-align:right;
}

@media (max-width:1000px){
.form-grid{
grid-template-columns:repeat(2, minmax(0, 1fr));
grid-template-areas:
"date date"
"company company"
"entity entity"
"payment senderAccount"
"senderName senderName"
"beneficiaryName beneficiaryName"
"currency amount"
"senderCommission companyCommission"
"senderTotal companyTotal"
"status status"
"notes notes";
}

.edit-actions{
grid-template-columns:repeat(2, minmax(0, 1fr));
}
}

@media (max-width:700px){
.form-grid{
grid-template-columns:1fr;
grid-template-areas:
"date"
"company"
"entity"
"payment"
"senderAccount"
"senderName"
"beneficiaryName"
"currency"
"amount"
"senderCommission"
"companyCommission"
"senderTotal"
"companyTotal"
"status"
"notes";
}

.edit-actions{
grid-template-columns:1fr;
}
}