/* Estilos personalizados y utilidades de experiencia de usuario para TratoFijo */

:root {
  --primary-navy: #0f172a;
  --primary-blue: #1e3a8a;
  --accent-orange: #ea580c;
  --accent-amber: #f59e0b;
  --mexico-green: #15803d;
  --mexico-red: #b91c1c;
}

/* Optimización táctil mobile-first */
button, a, select, input {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

/* Scroll suave */
html {
  scroll-behavior: smooth;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
}

/* Animaciones suaves */
@keyframes fadeInScale {
  from {
    opacity: 0;
    transform: scale(0.96);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.animate-pop {
  animation: fadeInScale 0.25s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Estilos de impresión para Código QR (para lonas, calcomanías y volantes de albañiles/plomeros) */
@media print {
  body * {
    visibility: hidden;
  }
  #shareModal, #shareModal * {
    visibility: visible;
  }
  #shareModal {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    background: white !important;
    padding: 20px;
  }
}

/* Sombras personalizadas de alta fidelidad */
.shadow-soft {
  box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.05), 0 8px 10px -6px rgba(15, 23, 42, 0.03);
}

.shadow-card-hover {
  box-shadow: 0 20px 30px -10px rgba(234, 88, 12, 0.12), 0 10px 15px -5px rgba(15, 23, 42, 0.04);
}

/* Scrollbar estética y delgada */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}
::-webkit-scrollbar-track {
  background: #f1f5f9;
}
::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 9999px;
}
::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* Chips de oficio con desplazamiento horizontal fluido en móvil */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}