/* Colissimo Claims and Contact - Orange theme */

/* Contact section */
.contact-section {
  background-color: white;
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  padding: var(--spacing-md);
  margin-bottom: var(--spacing-md);
  border-top: 3px solid var(--colissimo-orange);
}

.contact-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
  margin-top: var(--spacing-md);
}

.contact-card {
  flex: 1 1 250px;
  background-color: var(--secondary-color);
  border-radius: var(--border-radius);
  padding: var(--spacing-md);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  text-align: center;
}

.contact-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.contact-icon {
  font-size: 2rem;
  color: var(--colissimo-orange);
  margin-bottom: var(--spacing-sm);
}

.contact-title {
  font-weight: 600;
  margin-bottom: var(--spacing-xs);
}

/* Claims section */
.claims-section {
  background-color: white;
  border-radius: var(--border-radius);
  box-shadow: var(--box-shadow);
  padding: var(--spacing-md);
  border-top: 3px solid var(--colissimo-orange);
}

.claims-form {
  margin-top: var(--spacing-md);
}

.form-group {
  margin-bottom: var(--spacing-md);
}

.form-group label {
  display: block;
  margin-bottom: var(--spacing-xs);
  font-weight: 500;
}

.form-control {
  width: 100%;
  padding: 0.75rem;
  border: 1px solid var(--colissimo-border);
  border-radius: var(--border-radius);
  font-family: var(--font-family);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.form-control:focus {
  border-color: var(--colissimo-orange);
  box-shadow: 0 0 0 2px rgba(255, 153, 85, 0.1);
  outline: none;
}

.submit-button {
  background-color: var(--colissimo-orange);
  color: white;
  border: none;
  padding: 0.75rem 1.5rem;
  border-radius: var(--border-radius);
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.submit-button:hover {
  background-color: var(--colissimo-orange-light);
}

.submit-button:active {
  background-color: var(--colissimo-orange-dark);
}

/* Claims history */
.claims-history {
  margin-top: var(--spacing-lg);
}

.history-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: var(--spacing-sm);
}

.history-table th,
.history-table td {
  padding: 0.75rem;
  text-align: left;
  border-bottom: 1px solid var(--colissimo-border);
}

.history-table th {
  background-color: var(--secondary-color);
  font-weight: 600;
}

.history-table tr:hover {
  background-color: rgba(255, 102, 0, 0.05);
}

.status-pill {
  display: inline-block;
  padding: 0.25rem 0.5rem;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 600;
}

.status-pill.resolved {
  background-color: rgba(46, 125, 50, 0.1);
  color: #2e7d32;
}

.status-pill.pending {
  background-color: rgba(255, 153, 85, 0.1);
  color: var(--colissimo-orange);
}

.status-pill.escalated {
  background-color: rgba(211, 47, 47, 0.1);
  color: #d32f2f;
}