/* ===== TranscribePro — Custom CSS Improvements ===== */

/* 1. SKIP LINK — accessibility */
.t-skiptocontent a,
a[href="#content"],
a.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 99999;
  padding: 8px 16px;
  background: #e94560;
  color: #fff !important;
  font-weight: 700;
  border-radius: 0 0 6px 6px;
  text-decoration: none;
}
.t-skiptocontent a:focus,
a[href="#content"]:focus {
  left: 0;
}

/* 2. MOBILE STICKY CTA */
.tp-sticky-cta {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 99999;
  padding: 10px 16px 14px;
  background: rgba(10,10,20,0.97);
  box-shadow: 0 -3px 24px rgba(0,0,0,0.4);
}
.tp-sticky-cta a {
  display: block;
  text-align: center;
  background: linear-gradient(90deg,#e94560,#c73652);
  color: #fff !important;
  padding: 14px 20px;
  border-radius: 10px;
  font-weight: 700;
  font-size: 15px;
  text-decoration: none !important;
  letter-spacing: 0.3px;
}
@media (max-width: 768px) {
  .tp-sticky-cta { display: block; }
  body { padding-bottom: 80px !important; }
}

/* 3. BREADCRUMB VISUAL (for schema pages) */
.tp-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  font-size: 13px;
  color: #888;
  flex-wrap: wrap;
}
.tp-breadcrumb a { color: #888; text-decoration: none; }
.tp-breadcrumb a:hover { color: #e94560; }
.tp-breadcrumb span { color: #ccc; }

/* 4. IMPROVE HEADING VISIBILITY */
.t-title h1, .t-title h2 {
  letter-spacing: -0.02em;
}

/* 5. IMAGE alt text indicator (dev helper) */
img[alt=""] {
  outline: 3px solid rgba(233,69,96,0.3);
}

/* 6. SMOOTH SCROLL */
html {
  scroll-behavior: smooth;
}

/* 7. FOCUS STYLES for accessibility */
a:focus-visible,
button:focus-visible {
  outline: 2px solid #e94560;
  outline-offset: 3px;
  border-radius: 3px;
}

/* 8. PRINT styles */
@media print {
  .tp-sticky-cta,
  header,
  footer { display: none !important; }
  body { color: #000 !important; background: #fff !important; }
}