/* Global button styles (applies to most buttons except add/delete icons) */

:root {
  --btn-bg: #2563eb;
  --btn-bg-hover: #1d4ed8;
  --btn-color: #ffffff;
}

.button {
  background-color: var(--btn-bg);
  /* clean modern blue */
  border: 1px solid var(--btn-bg);
  border-radius: 8px;

  padding: 10px 32px;
  font-size: 16px;
  font-weight: 500;
  color: var(--btn-color);

  cursor: pointer;
  transition: all 0.25s ease;

  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.25);
}

.button:hover {
  background-color: var(--btn-bg-hover);
  border-color: var(--btn-bg-hover);
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.35);
  transform: translateY(-1px);
}

.button:active {
  transform: translateY(0);
  box-shadow: 0 3px 10px rgba(37, 99, 235, 0.2);
}

/* Apply same visual treatment to all buttons except add/remove icon buttons */
button:not(.icon-btn):not(.add-row-btn):not(.add-resource-row):not(.add-cost-row):not(.delete-row):not(.delete-row-btn):not([class^="ql-"]) {
  background-color: var(--btn-bg);
  border: 1px solid var(--btn-bg);
  border-radius: 8px;

  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--btn-color);

  cursor: pointer;
  transition: all 0.22s ease;

  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.18);
}

button:not(.icon-btn):not(.add-row-btn):not(.add-resource-row):not(.add-cost-row):not(.delete-row):not(.delete-row-btn):not(.delete-row-btn):not(.add-row-btn):hover {
  background-color: var(--btn-bg-hover);
  border-color: var(--btn-bg-hover);
  box-shadow: 0 6px 18px rgba(37, 99, 235, 0.28);
  transform: translateY(-1px);
}

/* keep small icon buttons untouched - just ensure pointer cursor */
button.add-row-btn,
button.add-resource-row,
button.add-cost-row,
button.delete-row,
button.delete-row-btn {
  cursor: pointer;
}

/* Utility: allow using .button on links too */
.button[href],
a.button {
  display: inline-block;
  text-decoration: none;
}

/* Preserve legacy UI for small action icon buttons (add / delete) */
button.add-row-btn,
button.add-resource-row,
button.add-cost-row,
button.delete-row,
button.delete-row-btn,
button.delete-row-btn {
  background: transparent !important;
  border: none !important;
  padding: 6px !important;
  font-size: 18px !important;
  color: inherit !important;
  box-shadow: none !important;
  border-radius: 8px !important;
}

/* Prevent global button rules from overriding small icon buttons */
button.add-row-btn:hover,
button.add-resource-row:hover,
button.add-cost-row:hover,
button.delete-row:hover,
button.delete-row-btn:hover {
  background: transparent !important;
  transform: none !important;
  box-shadow: none !important;
}


/* Overrides global .button styling */
.icon-btn {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 4px !important;
  border-radius: 0 !important;
}

.icon-btn:hover {
  background: transparent !important;
}

.icon-btn:focus {
  outline: none !important;
}