/* =====================================================
   SPUULNY — Árajánlat (upload → settings → summary) styles
   Shared by index.html and arajanlat.html
===================================================== */

/* ── Summary step styles ──────────────────────── */
.summary-file-card {
  background: rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: var(--r-lg);
  padding: 18px 20px;
}
.summary-file-card-name {
  font-size: 13px; font-weight: 700; color: var(--black);
  margin-bottom: 12px;
  display: flex; align-items: center; gap: 8px;
}
.summary-file-card-name svg { width: 15px; height: 15px; color: var(--teal); flex-shrink: 0; }
.summary-file-rows { display: flex; flex-direction: column; gap: 6px; }
.summary-file-row {
  display: flex; justify-content: space-between;
  font-size: 13px;
}
.summary-file-row span:first-child { color: var(--gray); }
.summary-file-row span:last-child  { font-weight: 500; color: var(--black); }
.summary-file-row.file-price-row span:last-child { color: var(--teal); font-weight: 700; }
.summary-file-row.summary-file-row--note {
  align-items: flex-start;
  gap: 12px;
}
.summary-file-row.summary-file-row--note span:last-child {
  text-align: right; max-width: 70%;
  word-break: break-word; white-space: pre-wrap;
}
.summary-total-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 14px 0; border-top: 2px solid rgba(0,0,0,0.09);
  font-size: 15px; font-weight: 700; color: var(--black);
  margin-bottom: 20px;
}
.summary-total-row span:last-child {
  font-family: 'Nunito', serif; font-size: 20px; color: var(--teal);
}
.summary-actions {
  display: flex; gap: 10px; margin-bottom: 4px;
}
.summary-actions .btn-cart,
.summary-actions .btn-order-now {
  flex: 1;
  display: flex; align-items: center; justify-content: center;
  gap: 8px; padding: 15px 20px;
  border-radius: var(--r-pill);
  font-family: 'Inter', sans-serif; font-weight: 600; font-size: 15px;
  cursor: pointer; transition: all .22s; text-decoration: none;
  white-space: nowrap; border: none;
}
.summary-actions .btn-cart {
  background: transparent;
  color: var(--black);
  border: 1.5px solid rgba(0,0,0,0.18);
}
.summary-actions .btn-cart:hover {
  border-color: var(--black); background: var(--black); color: var(--white);
}
.summary-actions .btn-order-now {
  background: var(--yellow); color: var(--black);
}
.summary-actions .btn-order-now:hover {
  background: var(--amber); box-shadow: 0 10px 28px rgba(255,176,64,.40);
}
.summary-actions .btn-cart svg,
.summary-actions .btn-order-now svg { width: 16px; height: 16px; }

/* Upload: file-safety line under the drop zone (index.html + arajanlat.html) */
.aj-note {
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:6px 8px; margin-top:12px; font-size:13px; color:var(--gray);
}
.aj-note span { display:flex; align-items:center; gap:5px; }
.aj-note svg { width:13px; height:13px; }

/* 30-minute guarantee badge (index.html + arajanlat.html; each page sets its own sizes).
   Lives inside .order-head (position:relative; z-index:1), vertically centred on it, right
   edge = content edge. z-index:-1 keeps it behind the heading text; the card stays on top. */
.aj-badge {
  position:absolute; z-index:-1; pointer-events:none; opacity:.6;
  top:50%; right:0; height:auto;
  transform:translateY(-50%) rotate(14deg);
}
.order-sect .order-card { position:relative; z-index:1; }