/* ==============================================================================
   LinkPass eSIM - Reusable UI Components (Direction B: Apple HIG Minimalist)
   ============================================================================== */

/* Plan Card - Clean Apple HIG Elevation */
.plan-card {
  background: #FFFFFF;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 1.5rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.02), 0 8px 24px -4px rgba(15, 23, 42, 0.04);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.plan-card:hover {
  border-color: rgba(0, 113, 227, 0.4);
  box-shadow: 0 12px 32px -4px rgba(0, 113, 227, 0.12), 0 2px 6px -1px rgba(15, 23, 42, 0.04);
  transform: translateY(-3px);
}

/* Feature Bento Card */
.feature-card {
  background: #FFFFFF;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 1.5rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.02), 0 4px 16px -2px rgba(15, 23, 42, 0.03);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.feature-card:hover {
  border-color: rgba(15, 23, 42, 0.18);
  box-shadow: 0 8px 28px -4px rgba(15, 23, 42, 0.08);
  transform: translateY(-2px);
}

/* Tutorial Card */
.tutorial-card {
  background: #FFFFFF;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 1.5rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.02), 0 6px 20px -2px rgba(15, 23, 42, 0.03);
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

.tutorial-card:hover {
  border-color: rgba(37, 99, 235, 0.3);
  transform: translateY(-2px);
}

/* Apple Obsidian Card (Admin / Dark Tech Component) */
.obsidian-card {
  background: rgba(15, 23, 42, 0.75);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.obsidian-card-interactive {
  background: rgba(15, 23, 42, 0.75);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.obsidian-card-interactive:hover {
  border-color: rgba(56, 189, 248, 0.3);
  transform: translateY(-1px);
}

/* Hairline Borders */
.hairline-b { border-bottom: 1px solid rgba(15, 23, 42, 0.07); }
.hairline-r { border-right: 1px solid rgba(15, 23, 42, 0.07); }
.hairline-border { border: 1px solid rgba(15, 23, 42, 0.07); }

/* Data Pills */
.data-pill {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: -0.02em;
}

/* Floating Toast Notification */
.floating-toast-container {
  position: fixed;
  top: 1.25rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  pointer-events: none;
}