/* ========================================================================== 
   DYGI Pro v5.2 · focused interface patch
   Desktop Solutions menu, business demo typography/iPhone treatment and
   floating launchers.
   ========================================================================== */

/* Desktop Solutions menu -------------------------------------------------- */
@media (min-width: 1061px) {
    .site-front .desktop-nav {
        gap: 4px;
    }

    .site-front .nav-dropdown {
        position: relative;
        display: inline-flex;
        align-items: center;
        align-self: stretch;
    }

    .site-front .nav-dropdown-trigger,
    html[data-theme="dark"] .site-front .nav-dropdown-trigger {
        display: inline-flex !important;
        min-height: 38px;
        align-items: center;
        justify-content: center;
        flex-wrap: nowrap;
        gap: 7px;
        margin: 0;
        border: 0;
        border-radius: 11px;
        background: transparent;
        color: var(--text);
        padding: 8px 11px;
        font: 700 .88rem/1.2 "Manrope", sans-serif;
        white-space: nowrap;
        box-shadow: none;
        appearance: none;
    }

    .site-front .nav-dropdown-trigger > span:first-child {
        display: inline !important;
        flex: 0 0 auto;
        font-size: inherit !important;
        line-height: inherit;
        transform: none !important;
    }

    .site-front .nav-dropdown-trigger .nav-chevron {
        display: inline-grid !important;
        width: 15px;
        height: 15px;
        flex: 0 0 15px;
        place-items: center;
        font-size: inherit !important;
        line-height: 1;
        transform: none;
        --mask-size: 66%;
    }

    .site-front .nav-dropdown:hover .nav-dropdown-trigger > span:first-child,
    .site-front .nav-dropdown:focus-within .nav-dropdown-trigger > span:first-child,
    .site-front .nav-dropdown.is-open .nav-dropdown-trigger > span:first-child {
        transform: none !important;
    }

    .site-front .nav-dropdown:hover .nav-dropdown-trigger .nav-chevron,
    .site-front .nav-dropdown:focus-within .nav-dropdown-trigger .nav-chevron,
    .site-front .nav-dropdown.is-open .nav-dropdown-trigger .nav-chevron {
        transform: rotate(180deg) !important;
    }

    .site-front .nav-dropdown-trigger:hover,
    .site-front .nav-dropdown-trigger:focus-visible,
    .site-front .nav-dropdown.is-open .nav-dropdown-trigger,
    .site-front .nav-dropdown.is-active .nav-dropdown-trigger {
        background: var(--blue-soft) !important;
        color: var(--blue) !important;
    }

    .site-front .nav-dropdown-panel {
        top: calc(100% + 10px);
        left: 50%;
        display: grid;
        width: min(560px, calc(100vw - 40px));
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
        border: 1px solid color-mix(in srgb, var(--border) 92%, transparent);
        border-radius: 20px;
        background: color-mix(in srgb, var(--card) 97%, transparent);
        padding: 13px;
        box-shadow: 0 26px 72px rgba(15, 38, 84, .18), inset 0 1px 0 rgba(255, 255, 255, .78);
        transform: translate(-50%, -7px) scale(.985);
        transform-origin: 50% 0;
        backdrop-filter: blur(24px) saturate(1.15);
        -webkit-backdrop-filter: blur(24px) saturate(1.15);
    }

    .site-front .nav-dropdown-panel::before {
        top: -7px;
        width: 13px;
        height: 13px;
        border-color: var(--border);
        background: var(--card);
    }

    .site-front .nav-dropdown-panel::after {
        height: 13px;
    }

    .site-front .nav-dropdown.is-open .nav-dropdown-panel,
    .site-front .nav-dropdown:hover .nav-dropdown-panel,
    .site-front .nav-dropdown:focus-within .nav-dropdown-panel {
        transform: translate(-50%, 0) scale(1);
    }

    .site-front .nav-solution-link {
        min-height: 76px;
        grid-template-columns: 43px minmax(0, 1fr) auto;
        gap: 11px;
        align-items: center;
        border: 1px solid transparent;
        border-radius: 15px;
        padding: 10px 11px;
        transform: none;
    }

    .site-front .nav-solution-link:hover,
    .site-front .nav-solution-link:focus-visible,
    .site-front .nav-solution-link.is-active {
        border-color: rgba(0, 94, 255, .18);
        background: color-mix(in srgb, var(--blue-soft) 88%, var(--card));
        color: var(--blue);
        transform: translateY(-1px);
        outline: none;
    }

    .site-front .nav-solution-link > .brand-mask-icon,
    .site-front .nav-web-icon {
        width: 43px;
        height: 43px;
        border-radius: 13px;
    }

    .site-front .nav-solution-link strong {
        color: var(--ink);
        font-size: .82rem;
        line-height: 1.25;
    }

    .site-front .nav-solution-link small {
        display: -webkit-box;
        overflow: hidden;
        color: var(--muted);
        font-size: .64rem;
        line-height: 1.35;
        text-overflow: ellipsis;
        white-space: normal;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    html[data-theme="dark"] .site-front .nav-dropdown-panel {
        border-color: rgba(139, 168, 222, .22);
        background: rgba(8, 15, 29, .97);
        box-shadow: 0 28px 82px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .055);
    }

    html[data-theme="dark"] .site-front .nav-dropdown-panel::before {
        border-color: rgba(139, 168, 222, .22);
        background: #080f1d;
    }

    html[data-theme="dark"] .site-front .nav-solution-link:hover,
    html[data-theme="dark"] .site-front .nav-solution-link:focus-visible,
    html[data-theme="dark"] .site-front .nav-solution-link.is-active {
        border-color: rgba(86, 146, 255, .34);
        background: rgba(0, 94, 255, .13);
    }
}

/* Business selector: larger industry names, compact conversations -------- */
@media (min-width: 900px) {
    .chatbot-page-v4 .business-selector button {
        min-height: 80px;
        grid-template-columns: 31px minmax(0, 1fr);
        gap: 8px;
        padding: 9px 8px;
    }

    .chatbot-page-v4 .business-option-icon {
        width: 30px;
        height: 30px;
    }

    .chatbot-page-v4 .business-selector button strong {
        overflow: visible;
        color: var(--ink);
        font-size: .78rem !important;
        line-height: 1.2;
        text-overflow: clip;
        white-space: normal;
    }

    .chatbot-page-v4 .business-selector button small {
        display: -webkit-box;
        overflow: hidden;
        font-size: .52rem !important;
        line-height: 1.28;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    /* Restore a compact, readable conversation instead of oversized bubbles. */
    .chatbot-page-v4 .business-phone-head strong {
        font-size: .79rem !important;
    }

    .chatbot-page-v4 .business-phone-head small {
        font-size: .55rem !important;
    }

    .chatbot-page-v4 .business-message {
        max-width: 86%;
    }

    .chatbot-page-v4 .business-message p {
        padding: 9px 11px !important;
        font-size: .67rem !important;
        line-height: 1.46 !important;
    }

    .chatbot-page-v4 .business-phone-composer p {
        font-size: .56rem !important;
    }

    .chatbot-page-v4 .business-action-card small {
        font-size: .58rem !important;
    }

    .chatbot-page-v4 .business-action-card strong {
        font-size: .8rem !important;
        line-height: 1.4 !important;
    }

    .chatbot-page-v4 .business-flow-list span {
        font-size: .68rem !important;
    }

    .chatbot-page-v4 .business-demo-note {
        font-size: .67rem !important;
    }

    /* More iPhone-like frame while preserving the current compact size. */
    .chatbot-page-v4 .business-phone {
        border: 7px solid #151a22;
        border-radius: 43px;
        box-shadow:
            0 0 0 2px #707987,
            0 28px 64px rgba(0, 0, 0, .34),
            inset 0 0 0 1px rgba(255, 255, 255, .18);
    }

    .chatbot-page-v4 .business-phone::after {
        border-radius: 35px;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .42);
    }

    .chatbot-page-v4 .business-phone-notch {
        top: 9px;
        width: 82px;
        height: 22px;
        border-radius: 999px;
        background: #05070b;
        box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .08), 0 1px 2px rgba(0, 0, 0, .45);
    }

    .chatbot-page-v4 .business-phone-notch::after {
        position: absolute;
        top: 8px;
        right: 10px;
        width: 5px;
        height: 5px;
        border-radius: 50%;
        background: #17294a;
        box-shadow: inset 0 0 0 1px rgba(85, 139, 224, .55);
        content: "";
    }
}

/* Floating launchers ------------------------------------------------------ */
.dygi-whatsapp-launcher {
    position: fixed;
    z-index: 1190;
    bottom: max(20px, env(safe-area-inset-bottom));
    left: max(20px, env(safe-area-inset-left));
}

.dygi-whatsapp-launcher .floating-whatsapp {
    width: 54px;
    height: 54px;
    border: 1px solid rgba(255, 255, 255, .72);
    box-shadow: 0 14px 34px rgba(37, 211, 102, .34), 0 0 0 6px rgba(37, 211, 102, .08);
}

.dygi-whatsapp-launcher .floating-whatsapp:focus-visible {
    outline: 3px solid rgba(0, 94, 255, .36);
    outline-offset: 4px;
}

@media (max-width: 760px) {
    .dygi-whatsapp-launcher {
        bottom: max(15px, env(safe-area-inset-bottom));
        left: max(14px, env(safe-area-inset-left));
    }

    .dygi-whatsapp-launcher .floating-whatsapp {
        width: 50px;
        height: 50px;
    }
}
