/**
 * Conecta Colibri — primitives de overlay mobile.
 * Escopo: [data-cc-mobile-overlay]; objetivo: popovers, dialogs e readers compactos com backdrop e rolagem interna.
 */
@media (max-width: 767px) {
  .cc-mobile-overlay__backdrop {
    position: fixed;
    inset: 0;
    z-index: calc(var(--cc-mobile-overlay-z) - 1);
    border: 0;
    margin: 0;
    padding: 0;
    background: rgba(25, 34, 27, 0.34);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 160ms ease;
  }

  .cc-mobile-overlay__backdrop.is-open {
    opacity: 1;
    pointer-events: auto;
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--mounted {
    position: fixed;
    z-index: var(--cc-mobile-overlay-z);
    box-sizing: border-box;
    margin: 0;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--mounted[aria-hidden="false"] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--dialog {
    top: 50%;
    left: 50%;
    width: calc(100vw - (var(--cc-mobile-gutter) * 2));
    max-width: 420px;
    max-height: min(75dvh, 640px);
    padding-top: max(16px, env(safe-area-inset-top));
    padding-bottom: max(16px, env(safe-area-inset-bottom));
    transform: translate(-50%, -47%);
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--dialog[aria-hidden="false"] {
    transform: translate(-50%, -50%);
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--reader {
    top: 50%;
    left: 50%;
    width: calc(100vw - (var(--cc-mobile-gutter) * 2));
    max-width: 420px;
    max-height: min(78dvh, 680px);
    padding-top: max(16px, env(safe-area-inset-top));
    padding-bottom: max(16px, env(safe-area-inset-bottom));
    transform: translate(-50%, -47%);
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--reader[aria-hidden="false"] {
    transform: translate(-50%, -50%);
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--popover {
    top: var(--cc-mobile-popover-top, max(68px, env(safe-area-inset-top)));
    right: var(--cc-mobile-popover-right, var(--cc-mobile-gutter));
    width: min(360px, calc(100vw - (var(--cc-mobile-gutter) * 2)));
    max-height: min(62dvh, 520px);
    padding-bottom: env(safe-area-inset-bottom);
    transform: translateY(-8px);
  }

  [data-cc-mobile-overlay].cc-mobile-overlay--popover[aria-hidden="false"] {
    transform: translateY(0);
  }
}