/*
 * Shared Frontend Shell primitives.
 * These classes are opt-in: domain modules keep their approved component markup
 * until their dedicated mobile-recovery releases consume these primitives.
 */
.cc-shell-card {
  background: var(--cc-shell-surface, #fff);
  border: 1px solid var(--cc-shell-border, rgba(78,110,50,.16));
  border-radius: var(--cc-shell-radius, 18px);
  box-shadow: var(--conecta-shadow-soft, 0 14px 36px rgba(40, 56, 38, .08));
  box-sizing: border-box;
}

.cc-shell-control,
.cc-shell-button {
  min-height: var(--cc-shell-touch-target, 44px);
  box-sizing: border-box;
}

.cc-shell-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 16px;
  border: 1px solid var(--cc-shell-border, rgba(78,110,50,.16));
  border-radius: 999px;
  background: var(--cc-shell-surface, #fff);
  color: var(--cc-shell-primary, #4E6E32);
  text-decoration: none;
}

.cc-shell-button--primary {
  background: var(--cc-shell-primary, #4E6E32);
  border-color: var(--cc-shell-primary, #4E6E32);
  color: #fff;
}

.cc-shell-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}