/* ================================
   ATARAXIS RX — CORE IDENTITY
   White / Navy / Gold
================================ */

/* ================================
   BASE
================================ */

body {
  font-family: 'Manrope', sans-serif;
  background: #F7FAFA;
  color: #0F172A;
}

/* Typography hierarchy */
h1 {
  font-size: 2.5rem;
  font-weight: 300;
  letter-spacing: -0.02em;
}

h2 {
  font-size: 1.75rem;
  font-weight: 300;
}

p {
  color: rgba(15,23,42,0.7);
}

/* ================================
   GOLD ACCENT
================================ */

.ataraxis-accent {
  color: #C7A35A;
  font-weight: 600;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  font-size: 0.7rem;
}

/* ================================
   BUTTON
================================ */

.btn-ataraxis {
  background: #C7A35A;
  color: #0F172A;
  padding: 0.75rem 1.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  border-radius: 6px;
  transition: all 0.2s ease;
}

.btn-ataraxis:hover {
  background: #B89345;
  transform: translateY(-1px);
}

/* ================================
   FORM INPUTS
================================ */

.ataraxis-label {
  font-size: 0.7rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(15,23,42,0.4);
  margin-bottom: 0.5rem;
  display: block;
}

.ataraxis-input {
  width: 100%;
  border: none;
  border-bottom: 1px solid rgba(15,23,42,0.2);
  background: transparent;
  padding: 0.75rem 0;
  outline: none;
  transition: border-color 0.2s ease;
}

.ataraxis-input:focus {
  border-color: #C7A35A;
}

.ataraxis-textarea {
  width: 100%;
  border: 1px solid rgba(15,23,42,0.2);
  padding: 1rem;
  background: white;
  outline: none;
  min-height: 120px;
  transition: border-color 0.2s ease;
}

.ataraxis-textarea:focus {
  border-color: #C7A35A;
}

/* ================================
   TABLE
================================ */

.ataraxis-table {
  width: 100%;
  border-collapse: collapse;
}

.ataraxis-table th {
  text-align: left;
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  padding: 1rem;
  color: rgba(15,23,42,0.4);
  border-bottom: 1px solid rgba(15,23,42,0.08);
}

.ataraxis-table td {
  padding: 1rem;
  border-bottom: 1px solid rgba(15,23,42,0.05);
}

.ataraxis-table tr:hover {
  background: rgba(199,163,90,0.04);
}

/* ================================
   BREADCRUMB
================================ */

.ataraxis-breadcrumb {
  font-size: 0.7rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: rgba(15,23,42,0.4);
  margin-bottom: 2rem;
}

/* ================================
   RESPONSIVE
================================ */

.table-wrapper {
  overflow-x: auto;
}
