/* Custom styles for Jason Martin Consulting */

.bg-grid {
  background-image: 
    linear-gradient(rgba(0, 212, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 212, 255, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
}

.nav-link {
  font-size: 0.875rem;
  font-weight: 500;
  color: #d1d5db;
  transition: color 0.15s;
}
.nav-link:hover {
  color: #00d4ff;
}
.nav-link.active {
  color: #00d4ff;
}

.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  background-color: #00d4ff;
  color: #05080f;
  font-weight: 600;
  transition: background-color 0.15s;
  box-shadow: 0 10px 15px -3px rgba(0, 212, 255, 0.2);
}
.btn-primary:hover {
  background-color: #67e8f9;
}

.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  border: 1px solid #243044;
  background-color: rgba(17, 24, 39, 0.5);
  color: #e5e7eb;
  font-weight: 500;
  transition: all 0.15s;
}
.btn-secondary:hover {
  border-color: rgba(0, 212, 255, 0.5);
  background-color: #1a2332;
}

.service-card {
  display: block;
  padding: 1.5rem;
  border-radius: 0.75rem;
  border: 1px solid #1a2332;
  background-color: rgba(10, 15, 28, 0.6);
  transition: all 0.3s;
}
.service-card:hover {
  border-color: rgba(0, 212, 255, 0.4);
  background-color: rgba(17, 24, 39, 0.8);
}

.icon-box {
  width: 3rem;
  height: 3rem;
  border-radius: 0.5rem;
  background-color: rgba(0, 212, 255, 0.1);
  color: #00d4ff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.portal-card {
  border-radius: 0.75rem;
  border: 1px solid #1a2332;
  background-color: rgba(10, 15, 28, 0.8);
  padding: 1.5rem;
}

.status-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.625rem;
  border-radius: 9999px;
  font-size: 0.75rem;
  font-weight: 500;
}

.status-open { background-color: rgba(245, 158, 11, 0.2); color: #fbbf24; }
.status-progress { background-color: rgba(59, 130, 246, 0.2); color: #60a5fa; }
.status-resolved { background-color: rgba(16, 185, 129, 0.2); color: #34d399; }

/* Form styles - fixed for dark theme */
.form-input {
  width: 100%;
  padding: 0.625rem 1rem;
  border-radius: 0.5rem;
  background-color: #111827 !important;
  border: 1px solid #243044 !important;
  color: #f3f4f6 !important;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.form-input::placeholder {
  color: #6b7280;
}
.form-input:focus {
  outline: none;
  border-color: #00d4ff !important;
  box-shadow: 0 0 0 1px rgba(0, 212, 255, 0.5);
}

.form-label {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #d1d5db;
  margin-bottom: 0.375rem;
}

/* Select dropdowns */
select.form-input {
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  padding-right: 2.5rem;
}

/* Smooth scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #0a0f1c;
}
::-webkit-scrollbar-thumb {
  background: #243044;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #00d4ff55;
}