/* =========================================================
   BASE WRAPPER
   ========================================================= */
.node-client-form.node-form {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  background: #ffffff;
}

/* =========================================================
   LABELS & DESCRIPTIONS
   ========================================================= */
.node-client-form.node-form label {
  display: block;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 6px;
  color: #111827;
}

.node-client-form.node-form .description {
  font-size: 13px;
  color: #6b7280;
  margin-top: 4px;
}

/* =========================================================
   INPUTS
   ========================================================= */
.node-client-form.node-form input[type="text"],
.node-client-form.node-form input[type="email"],
.node-client-form.node-form input[type="tel"],
.node-client-form.node-form input[type="number"],
.node-client-form.node-form input[type="date"],
.node-client-form.node-form select,
.node-client-form.node-form textarea {
  width: 100%;
  padding: 10px 12px;
  font-size: 14px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: #fff;
  box-sizing: border-box;
}

.node-client-form.node-form textarea {
  min-height: 100px;
}

.node-client-form.node-form input[type="date"] {
  height: 42px;
}

/* =========================================================
   FORM ITEM SPACING
   ========================================================= */
.node-client-form.node-form .form-item {
  margin-bottom: 16px;
}

/* =========================================================
   🔥 DESKTOP TWO-COLUMN GRID (FIXED)
   ========================================================= */
@media (min-width: 768px) {
  .node-client-form.node-form > .form-wrapper {
    /* display: grid; */
    /* grid-template-columns: repeat(2, 1fr); */
    /* gap: 20px; */
  }

  /* Two-column fields */
  .node-client-form.node-form .field--name-title,
  .node-client-form.node-form .field--name-field-email,
  .node-client-form.node-form .field--name-field-phone,
  .node-client-form.node-form .field--name-field-dob,
  .node-client-form.node-form .field--name-field-father-name,
  .node-client-form.node-form .field--name-field-company-name,
  .node-client-form.node-form .field--name-field-website,
  .node-client-form.node-form .field--name-field-tin,
  .node-client-form.node-form .field--name-field-gstin,
  .node-client-form.node-form .field--name-field-pan,
  .node-client-form.node-form .field--name-field-hourly-rate {
    grid-column: span 1;
  }

  /* Full-width sections */
  .node-client-form.node-form .field--name-field-point-of-contact,
  .node-client-form.node-form .field--name-field-office-address,
  .node-client-form.node-form .field--name-field-home-address,
  .node-client-form.node-form .field--name-body {
    grid-column: span 2;
  }
}

/* =========================================================
   POINT OF CONTACT – TWO COLUMNS (DESKTOP)
   ========================================================= */
@media (min-width: 768px) {
  .node-client-form.node-form
  .field--name-field-point-of-contact .form-wrapper {
    /* display: grid; */
    /* grid-template-columns: repeat(2, 1fr); */
    /* gap: 16px; */
  }
}

/* =========================================================
   INLINE ENTITY FORM CLEANUP
   ========================================================= */
.node-client-form.node-form .field-multiple-drag {
  display: none;
}

/* =========================================================
   FORM ACTIONS
   ========================================================= */
.node-client-form.node-form .form-actions {
  grid-column: span 2;
  display: flex;
  gap: 12px;
  margin-top: 24px;
}

.node-client-form.node-form input[type="submit"] {
  background: #1e40af;
  color: #fff;
  padding: 12px 20px;
  border-radius: 6px;
  border: none;
  font-weight: 600;
}

.node-client-form.node-form .vertical-tabs, .node-client-form.node-form .tabledrag-toggle-weight-wrapper {
    display: none;
}

.node-client-form.node-form input[name='field_website[0][uri]'] {
    width: 100%;
}

.node-client-form.node-form  .form-actions input[type="submit"] {
 width: 100%;
}


/* =========================================================
   MOBILE – SINGLE COLUMN
   ========================================================= */
@media (max-width: 767px) {
  .node-client-form.node-form > .form-wrapper {
    display: block;
  }
}
