/**
 * Triagly SDK - Minimal Theme
 * 
 * Usage:
 *   <link rel="stylesheet" href="https://unpkg.com/@triagly/sdk/themes/minimal.css">
 * 
 * Or import in JavaScript:
 *   import '@triagly/sdk/themes/minimal.css';
 */

:root {
  /* Button */
  --triagly-button-bg: transparent;
  --triagly-button-bg-hover: #f9fafb;
  --triagly-button-text: #111827;
  
  /* Modal */
  --triagly-modal-bg: #ffffff;
  --triagly-modal-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
  
  /* Overlay */
  --triagly-overlay-bg: rgba(0, 0, 0, 0.3);
  
  /* Header */
  --triagly-header-bg: #fafafa;
  --triagly-header-border: #e5e7eb;
  --triagly-header-text: #111827;
  
  /* Form */
  --triagly-form-bg: #ffffff;
  --triagly-label-text: #6b7280;
  --triagly-input-bg: #fafafa;
  --triagly-input-border: #e5e7eb;
  --triagly-input-border-focus: #d1d5db;
  --triagly-input-text: #111827;
  
  /* Buttons */
  --triagly-btn-primary-bg: #111827;
  --triagly-btn-primary-bg-hover: #374151;
  --triagly-btn-secondary-bg: transparent;
  --triagly-btn-secondary-bg-hover: #f9fafb;
  --triagly-btn-secondary-text: #6b7280;
  
  /* Borders */
  --triagly-btn-radius: 6px;
  --triagly-modal-radius: 8px;
  --triagly-button-radius: 6px;
}

/* Button with border (can't use inset shadow in variable) */
.triagly-button {
  border: 2px solid #e5e7eb !important;
  box-shadow: none !important;
}

.triagly-button:hover {
  border-color: #6366f1 !important;
  box-shadow: none !important;
}

/* Secondary button with border */
.triagly-btn-secondary {
  border: 1px solid #e5e7eb !important;
}