/* ============================================================
   PNotify Mobile — Adaptação Oficial para Telas Móveis WebWay
   Usabilidade, Touch Targets (WCAG), Prevenção de Zoom iOS Safari,
   Acomodação de Forms, Senha, CAPTCHA e Quizzes Interativos.
   Autor: Victor Lacerda Azevedo
   ============================================================ */

@media (max-width: 767px) {

    /* 1. POSICIONAMENTO E CONTAINER RESPONSIVO (NUNCA COLAR NAS BORDAS) */
    .ui-pnotify,
    .ui-pnotify-mobile-able.ui-pnotify,
    .ui-pnotify.ww-pn-rich,
    .ui-pnotify.ww-pn-compact,
    .ui-pnotify.stack-topright,
    .ui-pnotify.stack-topleft,
    .ui-pnotify.stack-bottomright,
    .ui-pnotify.stack-bottomleft {
        position: fixed !important;
        top: 56px !important; /* Respiro seguro logo abaixo da barra superior mobile */
        left: 10px !important;
        right: 10px !important;
        width: auto !important;
        max-width: calc(100vw - 20px) !important;
        min-width: 0 !important;
        margin: 0 auto 10px auto !important;
        box-sizing: border-box !important;
        z-index: 500000 !important;
    }

    /* Modais críticos e tela cheia ocupam quase toda a viewport com respiro */
    .ui-pnotify.pnotify-fullscreen-mode,
    .ui-pnotify.ui-pnotify-modal {
        top: 12px !important;
        left: 8px !important;
        right: 8px !important;
        max-width: calc(100vw - 16px) !important;
        max-height: calc(100vh - 24px) !important;
    }

    /* Container de aviso com cantos elegantes e rolagem fluida */
    .ui-pnotify > .ui-pnotify-container,
    .ui-pnotify-mobile-able .ui-pnotify-container {
        border-radius: 12px !important;
        padding: 14px 16px !important;
        box-shadow: 0 10px 28px rgba(15, 23, 42, 0.22), 0 2px 8px rgba(0, 0, 0, 0.08) !important;
        max-height: 84vh !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        box-sizing: border-box !important;
    }

    /* 2. TOUCH TARGETS DE FECHAMENTO E CONTROLES (MÍNIMO 40px - WCAG / APPLE HIG) */
    .ui-pnotify .ui-pnotify-closer,
    .ui-pnotify .ui-pnotify-sticker {
        min-width: 40px !important;
        min-height: 40px !important;
        width: 40px !important;
        height: 40px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 18px !important;
        line-height: 1 !important;
        margin-top: -6px !important;
        margin-right: -6px !important;
        padding: 0 !important;
        cursor: pointer !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent !important;
        opacity: 0.8 !important;
    }

    .ui-pnotify .ui-pnotify-closer > span,
    .ui-pnotify .ui-pnotify-sticker > span {
        display: inline-block !important;
        font-size: 18px !important;
        line-height: 1 !important;
    }

    .ui-pnotify .ui-pnotify-closer:active,
    .ui-pnotify .ui-pnotify-sticker:active {
        opacity: 1 !important;
        transform: scale(0.92);
    }

    /* Touch target específico do PNotify Compacto */
    .ui-pnotify.ww-pn-compact .ui-pnotify-closer {
        min-width: 36px !important;
        min-height: 36px !important;
        width: 36px !important;
        height: 36px !important;
        font-size: 14px !important;
        margin-top: -4px !important;
        margin-right: -4px !important;
    }

    /* 3. INPUTS E FORMULÁRIOS — PREVENÇÃO DE ZOOM INDESEJADO NO IOS SAFARI (>= 16px) */
    .ui-pnotify input[type="text"],
    .ui-pnotify input[type="password"],
    .ui-pnotify input[type="email"],
    .ui-pnotify textarea,
    .ui-pnotify select,
    .ui-pnotify .form-control {
        font-size: 16px !important; /* Obrigatório para iOS não aplicar zoom in indesejado */
        min-height: 42px !important;
        height: auto !important;
        padding: 8px 12px !important;
        border-radius: 8px !important;
        width: 100% !important;
        box-sizing: border-box !important;
        touch-action: manipulation !important;
    }

    /* 4. BARRA DE AÇÕES E BOTÕES DE CONFIRMAÇÃO */
    .ui-pnotify .ui-pnotify-action-bar {
        display: flex !important;
        flex-direction: row-reverse !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        margin-top: 14px !important;
        padding-top: 12px !important;
        border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
    }

    .ui-pnotify .btn-sm,
    .ui-pnotify .btn-xs,
    .ui-pnotify .ui-pnotify-action-bar button,
    .ui-pnotify .ui-pnotify-action-button,
    .ui-pnotify form.pf-form button,
    .ui-pnotify .ww-pn-rich-body button,
    .ui-pnotify .ww-pn-rich-body .btn,
    .ui-pnotify .ww-notify-print-btn,
    .ui-pnotify button.btn {
        min-height: 42px !important;
        height: auto !important;
        padding: 8px 16px !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        border-radius: 8px !important;
        touch-action: manipulation !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        box-sizing: border-box !important;
        flex: 1 1 auto !important; /* Distribui botões equilibradamente na largura disponível */
        text-align: center !important;
    }

    /* Botões empilhados em formulários verticais como exclusão crítica */
    .ui-pnotify form.pf-form .form-group button {
        display: block !important;
        width: 100% !important;
        margin-bottom: 8px !important;
        min-height: 44px !important;
        font-size: 15px !important;
    }

    /* 5. ADAPTAÇÕES DE PNOTIFY RICH NO MOBILE */
    .ui-pnotify.ww-pn-rich .ww-pn-rich-body {
        padding: 12px !important;
        margin-top: 4px !important;
    }

    .ui-pnotify.ww-pn-rich .ww-pn-badges {
        gap: 6px !important;
        margin-bottom: 8px !important;
    }

    .ui-pnotify.ww-pn-rich .ww-pn-badge {
        padding: 4px 10px !important;
        font-size: 12px !important;
    }

    .ui-pnotify.ww-pn-rich .ww-pn-chip {
        padding: 3px 8px !important;
        font-size: 11.5px !important;
        margin-bottom: 8px !important;
    }

    .ui-pnotify.ww-pn-rich .ww-pn-msg {
        font-size: 13.5px !important;
        line-height: 1.45 !important;
        margin-bottom: 8px !important;
    }

    /* Ações embutidas no extraHtml do PNotify Rich */
    .ui-pnotify.ww-pn-rich .ww-pn-rich-body .text-right,
    .ui-pnotify.ww-pn-rich .ww-pn-rich-body .btn-group {
        display: flex !important;
        gap: 8px !important;
        justify-content: flex-end !important;
        flex-wrap: wrap !important;
        margin-top: 10px !important;
    }

    /* 6. ADAPTAÇÕES HELPDESK — CAPTCHA E QUIZ */
    .ui-pnotify canvas,
    .ui-pnotify img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* Container de Quiz com largura total e opções fáceis de tocar */
    .ui-pnotify .notificacao-quiz-container {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 12px !important;
        border-radius: 8px !important;
        background: #f8fafc !important;
        border: 1px solid #e2e8f0 !important;
    }

    .ui-pnotify .quiz-pergunta-block {
        margin-bottom: 16px !important;
    }

    .ui-pnotify .quiz-pergunta-block > div:first-child {
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #1e293b !important;
        margin-bottom: 8px !important;
        line-height: 1.35 !important;
    }

    .ui-pnotify .notificacao-quiz-container label {
        display: flex !important;
        align-items: center !important;
        min-height: 44px !important;
        padding: 8px 12px !important;
        margin-bottom: 8px !important;
        border: 1px solid #cbd5e1 !important;
        border-radius: 8px !important;
        background-color: #ffffff !important;
        cursor: pointer !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: rgba(37, 99, 235, 0.1) !important;
        box-sizing: border-box !important;
        transition: background-color 0.15s ease, border-color 0.15s ease !important;
    }

    .ui-pnotify .notificacao-quiz-container label:hover,
    .ui-pnotify .notificacao-quiz-container label:active {
        background-color: #f1f5f9 !important;
        border-color: #94a3b8 !important;
    }

    .ui-pnotify .notificacao-quiz-container input[type="radio"] {
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        min-height: 22px !important;
        margin: 0 10px 0 0 !important;
        cursor: pointer !important;
        flex-shrink: 0 !important;
        accent-color: #2563eb !important;
    }

    .ui-pnotify .notificacao-quiz-container label span {
        font-size: 14px !important;
        line-height: 1.35 !important;
        color: #334155 !important;
        flex: 1 1 auto !important;
    }
}
