/**
 * Invoice Generator tool - tool-specific styling only.
 * Shared form controls: tools-utilities.css
 */

.tool-invoice-generator .form-section {
  margin-bottom: var(--space-8);
}

.tool-invoice-generator .form-block {
  margin-bottom: var(--space-4);
}

.tool-invoice-generator .invoice-items-list > * {
  margin-bottom: var(--space-4);
}

.tool-invoice-generator .invoice-preview-panel {
  background: var(--line1);
  min-height: 280px;
  color: var(--fg);
}

/* Light theme: clearer panel surface (line1 wash can read as low-contrast vs body) */
html[data-theme="light"] .tool-invoice-generator .invoice-preview-panel {
  background: var(--color-surface-deep);
}

/* Preview content: aligned columns, design tokens */
.tool-invoice-generator .invoice-preview-content {
  color: var(--fg);
}
.tool-invoice-generator .invoice-preview-content .invoice-preview-empty {
  color: var(--muted);
}
.tool-invoice-generator .invoice-preview-panel img[alt="Company Logo"] {
  max-height: 3rem;
  width: auto;
  object-fit: contain;
  margin-bottom: var(--space-4);
}

/* Remove-item button: compact, no global overrides */
.tool-invoice-generator .remove-item {
  min-width: 0;
}
.tool-invoice-generator .remove-item svg {
  display: block;
  width: 1rem;
  height: 1rem;
}

html[data-theme="dark"] .tool-invoice-generator input[type="date"] {
  color-scheme: dark !important;
}

html[data-theme="light"] .tool-invoice-generator input[type="date"] {
  color-scheme: light !important;
}

.tool-invoice-generator input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0 !important;
  display: none !important;
}

.tool-invoice-generator input[type="date"]::-webkit-inner-spin-button,
.tool-invoice-generator input[type="date"]::-webkit-clear-button {
  display: none !important;
}

.tool-invoice-generator input[type="date"]::-webkit-datetime-edit,
.tool-invoice-generator input[type="date"]::-webkit-datetime-edit-text,
.tool-invoice-generator input[type="date"]::-webkit-datetime-edit-month-field,
.tool-invoice-generator input[type="date"]::-webkit-datetime-edit-day-field,
.tool-invoice-generator input[type="date"]::-webkit-datetime-edit-year-field {
  color: var(--fg) !important;
}

.tool-invoice-generator input[type="date"]::-moz-calendar-picker-indicator {
  opacity: 0 !important;
}

.tool-invoice-generator textarea {
  resize: none;
  overflow-y: auto;
  overflow-x: hidden;
  direction: ltr;
}

.tool-invoice-generator textarea::-webkit-scrollbar {
  width: 8px;
}

.tool-invoice-generator textarea::-webkit-scrollbar-track {
  background: var(--bg-900);
  border-radius: 4px;
}

.tool-invoice-generator textarea::-webkit-scrollbar-thumb {
  background: var(--line2);
  border-radius: 4px;
}

.tool-invoice-generator textarea::-webkit-scrollbar-thumb:hover {
  background: var(--cta);
}

/* Stepper */
.tool-invoice-generator .invoice-stepper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2);
}

.tool-invoice-generator .invoice-stepper-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--line2);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background 0.2s, transform 0.2s;
}

.tool-invoice-generator .invoice-stepper-dot:hover {
  background: var(--muted);
}

.tool-invoice-generator .invoice-stepper-dot.is-active {
  background: var(--cta);
  transform: scale(1.2);
}

.tool-invoice-generator .invoice-stepper-sep {
  width: 12px;
  height: 2px;
  background: var(--line2);
  border-radius: 1px;
}

/* Mobile: no sticky on small screens, touch targets */
@media (max-width: 768px) {
  .tool-invoice-generator .sticky {
    position: relative;
    top: 0;
  }

  .tool-invoice-generator .invoice-stepper-dot {
    min-width: 44px;
    min-height: 44px;
    width: 44px;
    height: 44px;
  }

  .tool-invoice-generator .btn {
    min-height: 44px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .tool-invoice-generator #downloadPDF {
    min-height: 44px;
    padding: 12px 16px;
  }
}