/* ============================================================
   IAPP Assistant Widget — floating chat badge + iframe panel
   Loaded global pe toate paginile (mai puțin /prompt) prin
   v2_html_scripts.php. Conține:
   - .iapp-assistant-badge → buton fix dreapta-jos (efect hover identic cu vechiul WhatsApp)
   - .iapp-assistant-panel → panou flotant cu iframe către /prompt/widget
   - resize handle, size presets (small/medium/large), full-screen pe mobile
   ============================================================ */

/* ===== Badge fix ===== */
.iapp-assistant-badge {
    bottom: 35px;
    right: 20px;
    opacity: 1;
    transition: opacity .5s ease 0s;
    box-sizing: border-box;
    direction: ltr;
    text-align: right;
    position: fixed !important;
    z-index: 16000160 !important;
}
.iapp-assistant-badge svg :not([fill=none]) {
    fill: unset;
}
.iapp-assistant-badge > div {
    display: flex;
    margin: 7px;
    position: relative;
    -webkit-box-pack: end;
    justify-content: flex-end;
    max-height: 50px;
    align-items: center;
}
.iapp-assistant-badge > * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
    box-sizing: border-box !important;
}
.iapp-assistant-badge > div > a {
    flex-shrink: 0;
    width: 56px;
    height: 56px;
    order: 2;
    padding: 8px;
    box-sizing: border-box;
    border-radius: 50%;
    cursor: pointer;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, .4) 2px 2px 6px;
    transition: all .5s ease 0s;
    position: relative;
    z-index: 200;
    display: block;
    border: 0;
    background-color: rgb(53, 114, 102) !important;
}
.iapp-assistant-badge > div > a:hover {
    opacity: 0.92;
    cursor: pointer;
    width: 65px;
    height: 65px;
    background-color: rgb(14, 59, 67) !important;
}
.iapp-assistant-badge > div > #iapp-info-hover {
    display: none;
    background: #000;
    color: #fff;
    position: relative;
    padding: 10px 14px;
    border-radius: 15px;
    font-weight: 600;
    font-size: 13px;
    margin-right: 10px;
    line-height: 1.3;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
}
.iapp-assistant-badge.is-panel-open > div > #iapp-info-hover {
    display: none !important;
}
.iapp-assistant-badge.is-panel-open > div > a {
    transform: scale(0.85);
    opacity: 0.7;
}

/* ===== Panel flotant ===== */
.iapp-assistant-panel {
    position: fixed !important;
    bottom: 100px;
    right: 20px;
    width: 400px;
    height: 600px;
    min-width: 320px;
    min-height: 400px;
    max-width: calc(100vw - 30px);
    max-height: calc(100vh - 30px);
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
    z-index: 16000159 !important;
    display: none;
    flex-direction: column;
    overflow: hidden;
    transition: opacity 0.22s ease, transform 0.22s ease;
    opacity: 0;
    transform: translateY(20px) scale(0.96);
    transform-origin: bottom right;
    border: 1px solid rgba(0, 0, 0, 0.08);
}
.iapp-assistant-panel.is-open {
    display: flex;
    opacity: 1;
    transform: translateY(0) scale(1);
}

/* Size presets (aplicate via JS pe atribut data-size) */
.iapp-assistant-panel[data-size="medium"] {
    width: 560px;
    height: 720px;
}
.iapp-assistant-panel[data-size="large"] {
    width: min(1100px, 90vw);
    height: min(820px, 90vh);
}
.iapp-assistant-panel svg :not([fill=none]) {
    fill: unset;
}

/* ===== Header panel ===== */
.iapp-assistant-header {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: linear-gradient(135deg, rgb(53, 114, 102) 0%, rgb(14, 59, 67) 100%);
    color: #fff;
    border-radius: 14px 14px 0 0;
    -webkit-user-select: none;
    user-select: none;
    cursor: default;
}
.iapp-assistant-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.2px;
}
.iapp-assistant-title svg {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}
.iapp-assistant-actions {
    display: flex;
    align-items: center;
    gap: 4px;
}
.iapp-assistant-actions button {
    background: rgba(255, 255, 255, 0.12);
    border: 0;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s ease, transform 0.1s ease;
    padding: 0;
}
.iapp-assistant-actions button:hover {
    background: rgba(255, 255, 255, 0.25);
}
.iapp-assistant-actions button:active {
    transform: scale(0.92);
}
.iapp-assistant-actions button svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ===== Iframe ===== */
.iapp-assistant-iframe {
    flex: 1 1 auto;
    width: 100%;
    border: 0;
    display: block;
    background: #f8f9fa;
    min-height: 0; /* fix flex overflow in Firefox */
}
.iapp-assistant-iframe-loader {
    position: absolute;
    inset: 50px 0 0 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    color: rgb(53, 114, 102);
    font-size: 13px;
    pointer-events: none;
    z-index: 1;
}
.iapp-assistant-iframe-loader.is-hidden {
    display: none;
}
.iapp-assistant-iframe-loader .iapp-spinner {
    width: 36px;
    height: 36px;
    border: 3px solid rgba(53, 114, 102, 0.25);
    border-top-color: rgb(53, 114, 102);
    border-radius: 50%;
    animation: iapp-spin 0.85s linear infinite;
}
@keyframes iapp-spin {
    to { transform: rotate(360deg); }
}

/* ===== Resize handle (colț stânga-sus) ===== */
.iapp-assistant-resize-handle {
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    cursor: nwse-resize;
    z-index: 5;
    background:
        linear-gradient(135deg,
            transparent 0%,
            transparent 30%,
            rgba(255, 255, 255, 0.6) 30%,
            rgba(255, 255, 255, 0.6) 38%,
            transparent 38%,
            transparent 46%,
            rgba(255, 255, 255, 0.6) 46%,
            rgba(255, 255, 255, 0.6) 54%,
            transparent 54%);
    border-radius: 14px 0 0 0;
    opacity: 0.55;
    transition: opacity 0.15s ease;
}
.iapp-assistant-resize-handle:hover {
    opacity: 1;
}
.iapp-assistant-panel.is-resizing {
    transition: none;
    -webkit-user-select: none;
    user-select: none;
}
.iapp-assistant-panel.is-resizing .iapp-assistant-iframe {
    pointer-events: none; /* prevent iframe absorbing mousemove */
}

/* Overlay pentru blocarea event-urilor în timpul drag-ului */
.iapp-assistant-resize-overlay {
    position: fixed;
    inset: 0;
    z-index: 16000165;
    cursor: nwse-resize;
    background: transparent;
}

/* ===== Mobile / responsive ===== */
@media (max-width: 640px) {
    .iapp-assistant-panel,
    .iapp-assistant-panel[data-size="small"],
    .iapp-assistant-panel[data-size="medium"],
    .iapp-assistant-panel[data-size="large"] {
        bottom: 0 !important;
        right: 0 !important;
        left: 0 !important;
        top: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        max-width: 100vw !important;
        max-height: 100vh !important;
        border-radius: 0 !important;
        transform: translateY(20px);
    }
    .iapp-assistant-panel.is-open {
        transform: translateY(0);
    }
    .iapp-assistant-panel .iapp-assistant-resize-handle {
        display: none;
    }
    .iapp-assistant-header {
        border-radius: 0;
        padding: 12px 14px;
    }
    .iapp-assistant-actions button {
        width: 36px;
        height: 36px;
    }
    /* Pe mobil ascundem badge-ul când panel-ul e deschis */
    .iapp-assistant-badge.is-panel-open {
        display: none !important;
    }
    /* Buton "schimbă mărime" inutil pe mobil */
    #iappAssistantSizeToggle {
        display: none !important;
    }
}

/* ===== Hide pe paginile imprimate ===== */
@media print {
    .iapp-assistant-badge,
    .iapp-assistant-panel,
    .iapp-assistant-resize-overlay {
        display: none !important;
    }
}


/* ============================================================
   TEASER BUBBLE (welcome card lângă badge)
   Apare pentru useri care n-au interacționat cu chat-ul.
   Max TEASER_MAX_SHOWS impresii, apoi nu mai apare.
   Logica de show/hide: widget-load.js → maybeShowTeaser/showTeaser/dismissTeaser
   ============================================================ */
.iapp-assistant-teaser {
    position: fixed;
    bottom: 100px;
    right: 20px;
    width: 290px;
    max-width: calc(100vw - 40px);
    background: #fff;
    border-radius: 14px;
    padding: 14px 36px 14px 16px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.20), 0 2px 6px rgba(0, 0, 0, 0.06);
    z-index: 16000158 !important;
    font-size: 13.5px;
    line-height: 1.5;
    color: #1f2937;
    cursor: pointer;
    opacity: 0;
    transform: translateY(14px) scale(0.94);
    transform-origin: bottom right;
    transition: opacity 0.28s ease, transform 0.28s cubic-bezier(0.34, 1.5, 0.64, 1);
    border: 1px solid rgba(0, 0, 0, 0.06);
    -webkit-user-select: none;
    user-select: none;
}
.iapp-assistant-teaser.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
    animation: iapp-teaser-attention 1.6s ease-out 0.4s 2;
}
@keyframes iapp-teaser-attention {
    0%, 100% { transform: translateY(0) scale(1); }
    50%      { transform: translateY(-3px) scale(1.015); }
}
.iapp-assistant-teaser:hover {
    box-shadow: 0 14px 32px rgba(14, 59, 67, 0.22), 0 2px 6px rgba(0, 0, 0, 0.08);
}
/* Mic „tail” care leagă vizual bubble-ul de badge */
.iapp-assistant-teaser::after {
    content: '';
    position: absolute;
    right: 24px;
    bottom: -7px;
    width: 14px;
    height: 14px;
    background: #fff;
    border-right: 1px solid rgba(0, 0, 0, 0.06);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    transform: rotate(45deg);
}
.iapp-assistant-teaser strong {
    display: block;
    color: rgb(14, 59, 67);
    margin-bottom: 4px;
    font-size: 14.5px;
    font-weight: 700;
}
.iapp-assistant-teaser .iapp-teaser-cta {
    display: block;
    margin-top: 8px;
    color: rgb(53, 114, 102);
    font-weight: 600;
    font-size: 13px;
}
.iapp-assistant-teaser .iapp-teaser-close {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 22px;
    height: 22px;
    border: 0;
    background: rgba(0, 0, 0, 0.06);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
    padding: 0;
    transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
}
.iapp-assistant-teaser .iapp-teaser-close:hover {
    background: rgba(14, 59, 67, 0.12);
    color: rgb(14, 59, 67);
}
.iapp-assistant-teaser .iapp-teaser-close:active {
    transform: scale(0.92);
}
.iapp-assistant-teaser .iapp-teaser-close svg {
    width: 12px;
    height: 12px;
}

/* Ascunde teaser-ul pe mobile + când panel-ul e deschis sau la print */
.iapp-assistant-badge.is-panel-open ~ .iapp-assistant-teaser {
    display: none !important;
}
@media (max-width: 640px) {
    .iapp-assistant-teaser {
        bottom: 90px;
        right: 10px;
        width: calc(100vw - 30px);
    }
}
@media print {
    .iapp-assistant-teaser { display: none !important; }
}


/* ============================================================
   PUBLIC IFRAME PAGE (prompt-widget-public.php)
   Conținutul randat în iframe pentru userii NElogați:
   welcome (prezentare funcții + CTA) / login / register.
   Paletă InsideApp identică cu badge-ul/panel-ul de mai sus.
   Toate clasele au prefix .pw- ca să nu intre în conflict cu
   restul aplicației gazdă.
   ============================================================ */
.pw-page {
    --ia-green:      rgb(53, 114, 102);
    --ia-green-dark: rgb(14, 59, 67);
    --ia-green-soft: rgba(53, 114, 102, 0.08);
    --ia-text:       #1f3d37;
    --ia-muted:      #6b7280;
    --ia-border:     #e5e7eb;
    --ia-bg:         #f8f9fa;
    --ia-white:      #ffffff;

    box-sizing: border-box;
    min-height: 100vh;
    margin: 0;
    font-family: 'Segoe UI', Roboto, system-ui, -apple-system, sans-serif;
    background: var(--ia-bg);
    color: var(--ia-text);
    -webkit-font-smoothing: antialiased;
}
.pw-page *,
.pw-page *::before,
.pw-page *::after { box-sizing: border-box; }

.pw-wrap {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 22px 18px 28px;
}

/* ===== Antet (icon + titlu + subtitlu) ===== */
.pw-head { text-align: center; margin-bottom: 20px; }
.pw-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 14px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(53,114,102,0.12) 0%, rgba(14,59,67,0.12) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ia-green);
}
.pw-icon svg { width: 30px; height: 30px; }
.pw-head h1 {
    font-size: 19px;
    font-weight: 700;
    color: var(--ia-green-dark);
    margin: 0 0 6px;
}
.pw-head p {
    font-size: 14px;
    color: var(--ia-green);
    line-height: 1.5;
    margin: 0;
}

/* ===== Grid funcții ===== */
.pw-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-bottom: 18px;
}
.pw-feature {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 14px;
    background: var(--ia-white);
    border: 1.5px solid var(--ia-border);
    border-radius: 10px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ia-green);
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.pw-feature svg { width: 19px; height: 19px; flex-shrink: 0; }
.pw-feature:hover {
    border-color: var(--ia-green);
    box-shadow: 0 4px 10px rgba(53,114,102,0.12);
    transform: translateY(-1px);
}

/* ===== Hint ===== */
.pw-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    text-align: center;
    padding: 14px 18px;
    background: var(--ia-green-soft);
    border-radius: 10px;
    color: var(--ia-green);
    font-size: 13.5px;
    font-weight: 600;
    line-height: 1.4;
    margin-bottom: 22px;
}
.pw-hint svg { width: 20px; height: 20px; flex-shrink: 0; }

/* ===== Warning (feature in pregatire) ===== */
.pw-warning {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 13px 15px;
    background: #fff8e6;
    border: 1.5px solid #f4d27a;
    border-radius: 10px;
    color: #8a5a00;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 18px;
}
.pw-warning svg {
    width: 19px;
    height: 19px;
    flex-shrink: 0;
    margin-top: 1px;
    color: #d99100;
}
.pw-warning a {
    color: #8a5a00;
    font-weight: 700;
    text-decoration: underline;
}
.pw-warning a:hover { color: #6b4500; }

/* ===== Alerte =====  */
.pw-page .alert {
    position: relative;
    border: 1.5px solid transparent;
    border-radius: 10px;
    padding: 13px 15px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 18px;
}
.pw-page .alert b,
.pw-page .alert strong { font-weight: 700; }
.pw-page .alert a {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
}
.pw-page .alert.bg-danger {
    background: #fdecec;
    border-color: #f3bcbc;
    color: #9b1c1c;
}
.pw-page .alert.bg-warning {
    background: #fff8e6;
    border-color: #f4d27a;
    color: #8a5a00;
}
.pw-page .alert.bg-success {
    background: #e9f7ef;
    border-color: #a7e0bf;
    color: #1b6b3a;
}
.pw-page .alert.bg-info {
    background: #e8f3fb;
    border-color: #aacfe9;
    color: #15577e;
}
.pw-page .alert.bg-primary {
    background: var(--ia-green-soft);
    border-color: rgba(53,114,102,0.3);
    color: var(--ia-green-dark);
}
.pw-page .alert.bg-secondary\/70 {
    background: #f1f3f5;
    border-color: #dfe3e7;
    color: #51616b;
}

/* ===== Zona CTA / formulare ===== */
.pw-cta { margin-top: auto; }

.pw-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 18px;
    border-radius: 10px;
    font-size: 14.5px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
    border: 1.5px solid transparent;
    transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .1s ease;
}
.pw-btn svg { width: 18px; height: 18px; }
.pw-btn--primary {
    background: linear-gradient(135deg, var(--ia-green) 0%, var(--ia-green-dark) 100%);
    color: var(--ia-white);
    box-shadow: 0 4px 12px rgba(14,59,67,0.18);
}
.pw-btn--primary:hover { box-shadow: 0 6px 16px rgba(14,59,67,0.26); transform: translateY(-1px); }
.pw-btn--primary:active { transform: translateY(0); }
.pw-btn:disabled,
.pw-btn[disabled] {
    cursor: not-allowed;
    opacity: 0.55;
    box-shadow: none;
    pointer-events: none;
    filter: grayscale(0.25);
}
.pw-btn--ghost {
    background: var(--ia-white);
    color: var(--ia-green);
    border-color: rgba(53,114,102,0.3);
}
.pw-btn--ghost:hover { background: var(--ia-green-soft); border-color: var(--ia-green); }

.pw-altline {
    text-align: center;
    font-size: 13px;
    color: var(--ia-muted);
    margin-top: 14px;
}
.pw-altline a {
    color: var(--ia-green);
    font-weight: 600;
    text-decoration: none;
}
.pw-altline a:hover { text-decoration: underline; }

/* ===== Formulare ===== */
.pw-form { margin-top: 4px; }
.pw-field { margin-bottom: 14px; }
.pw-field--row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}
.pw-label {
    display: block;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ia-text);
    margin-bottom: 6px;
}
.pw-input {
    width: 100%;
    padding: 11px 13px;
    font-size: 14px;
    color: var(--ia-text);
    background: var(--ia-white);
    border: 1.5px solid var(--ia-border);
    border-radius: 9px;
    outline: none;
    transition: border-color .18s ease, box-shadow .18s ease;
    font-family: inherit;
}
.pw-input::placeholder { color: #9ca3af; }
.pw-input:focus {
    border-color: var(--ia-green);
    box-shadow: 0 0 0 3px rgba(53,114,102,0.12);
}
.pw-input--code {
    text-align: center;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.55em;
    padding-left: calc(13px + 0.55em);
}
.pw-form .pw-btn { margin-top: 6px; }

.pw-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ia-muted);
    text-decoration: none;
    margin-bottom: 16px;
}
.pw-back svg { width: 16px; height: 16px; }
.pw-back:hover { color: var(--ia-green); }

.pw-note {
    font-size: 12px;
    color: var(--ia-muted);
    line-height: 1.5;
    margin-top: 12px;
    text-align: center;
}

@media (max-width: 360px) {
    .pw-features { grid-template-columns: 1fr; }
    .pw-field--row { grid-template-columns: 1fr; }
}