/* ============================================================
   GIGAPOS — Global CSS Utilities
   Shared across all pages via <link> in layout files
   ============================================================ */

/* ---- CSS Reset Additions ---- */
img { max-width: 100%; height: auto; }
button, input, select, textarea { font-family: inherit; }
a { color: inherit; }

/* ---- Gradient Utilities ---- */
.grad-text {
  background: linear-gradient(135deg, #6c3de8, #c044a8, #f0724a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.grad-bg { background: linear-gradient(135deg, #6c3de8, #c044a8, #f0724a); }
.grad-border {
  border: 2px solid transparent;
  background-clip: padding-box;
  position: relative;
}

/* ---- Animations ---- */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0);    }
}
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.5; }
}
@keyframes spin {
  to { transform: rotate(360deg); }
}
.animate-fade-up { animation: fadeUp 0.5s ease forwards; }
.loading-spinner {
  width: 20px; height: 20px;
  border: 2px solid rgba(108,61,232,0.2);
  border-top-color: #6c3de8;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  display: inline-block;
}

/* ---- Form Validation ---- */
.form-input.error  { border-color: #ef4444; background: rgba(239,68,68,0.03); }
.form-input.valid  { border-color: #22c55e; }
.field-error { font-size: 12px; color: #dc2626; margin-top: 4px; display: block; }
.field-hint  { font-size: 12px; color: #8b7aaa; margin-top: 4px; display: block; }

/* ---- Scrollbar ---- */
::-webkit-scrollbar       { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(108,61,232,0.25); border-radius: 100px; }
::-webkit-scrollbar-thumb:hover { background: rgba(108,61,232,0.45); }

/* ---- Selection ---- */
::selection { background: rgba(108,61,232,0.18); color: #1a0533; }

/* ---- Print ---- */
@media print {
  .sidebar, .topbar, .navbar, .btn-cta, .btn-submit { display: none !important; }
  body { background: #fff; color: #000; }
  .card { border: 1px solid #ccc; box-shadow: none; }
}

/* ---- RTL Helpers ---- */
[dir="rtl"] .ms-auto { margin-right: auto; margin-left: 0; }
[dir="rtl"] .me-auto { margin-left: auto;  margin-right: 0; }
[dir="rtl"] table th, [dir="rtl"] table td { text-align: right; }