@import "tailwindcss";

/* Accessibility Styles */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  @apply sr-only;
}

.skip-link:focus {
  @apply not-sr-only absolute top-0 left-0 bg-blue-600 text-white p-2 z-50 rounded-b;
  text-decoration: none;
}

/* Focus styles for better keyboard navigation */
:focus {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

:focus:not(:focus-visible) {
  outline: none;
}

/* Ensure sufficient color contrast for links */
a:hover, a:focus {
  text-decoration: underline;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  * {
    border-color: ButtonText;
  }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Avatar Styles */
.avatar-image {
  @apply rounded-full object-cover;
}

.avatar-placeholder {
  @apply rounded-full bg-gray-500 text-white text-center font-semibold flex items-center justify-center;
  font-size: 50%;
}

.tenant-logo {
  @apply object-contain;
}

.tenant-logo-placeholder {
  @apply text-white text-center font-bold flex items-center justify-center rounded;
  color: white;
  font-size: 50%;
}

/* Badge Styles */
.badge {
  @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;
}

.badge-primary {
  @apply bg-blue-100 text-blue-800;
}

.badge-secondary {
  @apply bg-gray-100 text-gray-800;
}

.badge-success {
  @apply bg-green-100 text-green-800;
}

.badge-warning {
  @apply bg-yellow-100 text-yellow-800;
}

.badge-danger {
  @apply bg-red-100 text-red-800;
}

.badge-info {
  @apply bg-sky-100 text-sky-800;
}

.badge-light {
  @apply bg-gray-50 text-gray-600;
}

/* Tenant Directory Styles */
.tenant-directory {
  @apply mb-8;
}

.tenant-directory .tenant-card {
  @apply bg-white border border-gray-200 rounded-lg p-6 hover:shadow-lg transition-shadow duration-200;
}

.tenant-directory .tenant-card:hover {
  @apply border-gray-300;
}

.tenant-directory .visit-link {
  @apply inline-flex items-center px-3 py-1.5 border border-blue-300 text-xs font-medium rounded text-blue-700 hover:bg-blue-50 transition-colors duration-200;
}

/* Powered By Footer Styles */
.powered-by-footer {
  @apply bg-white border-t border-gray-200 mt-auto;
  position: sticky;
  bottom: 0;
  width: 100%;
  z-index: 10;
}

.powered-by-container {
  @apply max-w-7xl mx-auto px-4 sm:px-6 lg:px-8;
}

.powered-by-text {
  @apply text-center text-xs text-gray-500 py-3 m-0;
}

.powered-by-link {
  @apply text-blue-600 hover:text-blue-800 font-medium no-underline;
  transition: color 0.2s ease-in-out;
}

.powered-by-link:hover {
  text-decoration: underline;
}

/* Ensure body has proper flex layout for sticky footer */
body {
  @apply min-h-screen flex flex-col;
}

/* Main content should grow to push footer down */
main, .main-content {
  @apply flex-grow;
}

/* Line clamp utilities */
.line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}