/* ════════════════════════════════════════
   BidRoy – Refund Policy Page
   Extends terms.css with refund-specific
   colour overrides & new components
   ════════════════════════════════════════ */

/* ── Accent: emerald-green to signal trust/money ── */
:root {
  --rp-green:   #059669;
  --rp-green2:  #047857;
  --rp-red:     #dc2626;
  --rp-amber:   #d97706;
  --rp-blue:    #2563eb;
  --rp-neutral: #475569;
}

/* ── Hero override — blue (matches pricing-model) ── */
.refund-hero {
  background: linear-gradient(135deg, #0d1b35 0%, #152442 60%, #1a3464 100%) !important;
}
.refund-hero .hero-shape-1 { background: linear-gradient(135deg, #3a7bd5, #4285f4) !important; }
.refund-hero .hero-shape-2 { background: linear-gradient(135deg, #4f8ef7, #93c5fd) !important; }
.refund-hero .hero-shape-3 { background: rgba(66,133,244,.6) !important; }
.refund-hero .hero-badge    { background: rgba(66,133,244,.18) !important; color: #a8c4f8 !important; border-color: rgba(79,142,247,.4) !important; }

.refund-gradient {
  background: linear-gradient(135deg, #4285f4, #4f8ef7) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* ── Sidebar nav active colour ── */
.refund-page .terms-nav a:hover {
  color: var(--rp-green) !important;
  border-left-color: var(--rp-green) !important;
}

/* ── Highlight box in green ── */
.refund-highlight-icon {
  background: linear-gradient(135deg, var(--rp-green), #10b981) !important;
}

/* ── Inline links ── */
.refund-link {
  color: var(--rp-green);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px dashed var(--rp-green);
  transition: color .2s, border-color .2s;
}
.refund-link:hover { color: var(--rp-green2); border-color: var(--rp-green2); }

/* ══════════════════════════════════════
   STATUS CARDS  (May Refund / Not Refund)
   ══════════════════════════════════════ */
.refund-status-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-top: 28px;
}
.refund-status-card {
  border-radius: 16px;
  padding: 28px 24px;
  border: 1.5px solid;
}
.refund-status--yes {
  background: linear-gradient(135deg, rgba(5,150,105,.07), rgba(16,185,129,.04));
  border-color: rgba(5,150,105,.25);
}
.refund-status--no {
  background: linear-gradient(135deg, rgba(220,38,38,.07), rgba(239,68,68,.04));
  border-color: rgba(220,38,38,.22);
}
.refund-status-icon {
  width: 44px; height: 44px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 14px;
}
.refund-status--yes .refund-status-icon { background: linear-gradient(135deg,#059669,#10b981); color: #fff; }
.refund-status--no  .refund-status-icon { background: linear-gradient(135deg,#dc2626,#f87171); color: #fff; }
.refund-status-card h4 { font-size: 16px; font-weight: 700; margin-bottom: 12px; }
.refund-status--yes h4 { color: #065f46; }
.refund-status--no  h4 { color: #7f1d1d; }
.refund-status-card ul { list-style: none; padding: 0; margin: 0; }
.refund-status-card ul li {
  font-size: 14px; line-height: 1.6;
  padding: 6px 0 6px 22px;
  border-bottom: 1px dashed;
  position: relative;
}
.refund-status--yes ul li { color: #064e3b; border-color: rgba(5,150,105,.18); }
.refund-status--no  ul li { color: #7f1d1d; border-color: rgba(220,38,38,.18); }
.refund-status-card ul li:last-child { border-bottom: none; }
.refund-status-card ul li::before {
  content: '';
  position: absolute; left: 0; top: 14px;
  width: 10px; height: 10px; border-radius: 50%;
}
.refund-status--yes ul li::before { background: #059669; }
.refund-status--no  ul li::before { background: #dc2626; }

/* ══════════════════════════════════════
   RULE LIST  (numbered danger / neutral)
   ══════════════════════════════════════ */
.refund-rule-list { display: flex; flex-direction: column; gap: 16px; margin-top: 24px; }
.refund-rule-item {
  display: flex; gap: 20px; align-items: flex-start;
  border-radius: 14px; padding: 24px 22px;
  border: 1.5px solid;
}
.refund-rule--danger {
  background: linear-gradient(135deg, rgba(220,38,38,.06), rgba(239,68,68,.03));
  border-color: rgba(220,38,38,.18);
}
.refund-rule--neutral {
  background: linear-gradient(135deg, rgba(37,99,235,.06), rgba(59,130,246,.03));
  border-color: rgba(37,99,235,.18);
}
.refund-rule-num {
  font-size: 22px; font-weight: 800;
  min-width: 48px; height: 48px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.refund-rule--danger  .refund-rule-num { background: linear-gradient(135deg,#dc2626,#f87171); color: #fff; }
.refund-rule--neutral .refund-rule-num { background: linear-gradient(135deg,#2563eb,#60a5fa); color: #fff; }
.refund-rule-body h4 { font-size: 15px; font-weight: 700; margin-bottom: 6px; }
.refund-rule--danger  .refund-rule-body h4 { color: #7f1d1d; }
.refund-rule--neutral .refund-rule-body h4 { color: #1e3a8a; }
.refund-rule-body p { font-size: 14px; line-height: 1.7; margin: 0; color: var(--rp-neutral); }

/* ══════════════════════════════════════
   PAYMENT METHOD CARDS
   ══════════════════════════════════════ */
.refund-methods-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 24px;
}
.refund-method-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 22px 18px;
  text-align: center;
  transition: all .3s ease;
}
.refund-method-card:hover {
  border-color: var(--rp-green);
  box-shadow: 0 6px 20px rgba(5,150,105,.12);
  transform: translateY(-4px);
}
.refund-method-icon {
  width: 48px; height: 48px;
  background: linear-gradient(135deg, rgba(5,150,105,.12), rgba(16,185,129,.08));
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 14px;
  color: var(--rp-green);
}
.refund-method-card h4 { font-size: 14px; font-weight: 700; color: #0f172a; margin-bottom: 6px; }
.refund-method-card p  { font-size: 12px; color: #64748b; line-height: 1.5; margin: 0; }

/* ── Responsive ── */
@media (max-width: 1024px) {
  .refund-status-grid    { grid-template-columns: 1fr; }
  .refund-methods-grid   { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .refund-methods-grid   { grid-template-columns: 1fr 1fr; }
  .refund-rule-item      { flex-direction: column; gap: 12px; }
  .refund-rule-num       { width: 40px; height: 40px; font-size: 18px; }
}
@media (max-width: 480px) {
  .refund-methods-grid   { grid-template-columns: 1fr; }
}