/* Floating share menu, pinned to the PHYSICAL bottom-left in every language.
   `left` is used deliberately instead of a logical property: this file is
   served as a static asset, so it is never RTL-flipped, and the control must
   not mirror to the right in Hebrew or Arabic. */
.hkvt-share-fab {
    position: fixed;
    /* The accessibility widget is the stack's reference: every button sits
       on its centre line (x ≈ 36, left edge 12) at the stack's 43px size;
       local/hakaveret_feedback/css/feedback.css restyles the theme's
       back-to-top button onto the same line. */
    left: calc(14px + env(safe-area-inset-left, 0px));
    /* Top of the bottom-left stack, 12px gaps. Below it, top-down: the
       "report issue" circle (150-193px), the accessibility widget
       (95-138px once the additionalhtmlhead vPosition is updated) and the
       back-to-top button (40-83px). */
    bottom: calc(205px + env(safe-area-inset-bottom, 0px));
    z-index: 1010;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    /* The fixed box must never intercept clicks on the page behind it. */
    pointer-events: none;
    font-family: "cocoonCustomSecondary", sans-serif;
}

.hkvt-share-options {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.hkvt-share-toggle,
.hkvt-share-fab--open .hkvt-share-btn {
    pointer-events: auto;
}

.hkvt-share-toggle,
.hkvt-share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 3px 8px rgba(11, 24, 54, 0.32);
}

.hkvt-share-toggle {
    /* Same size as the accessibility widget's visible circle. */
    width: 43px;
    height: 43px;
    font-size: 20px;
    background: #1d4ed7;
}

.hkvt-share-btn {
    width: 40px;
    height: 40px;
    font-size: 19px;
}

.hkvt-share-toggle:hover,
.hkvt-share-toggle:focus,
.hkvt-share-btn:hover,
.hkvt-share-btn:focus {
    opacity: 0.9;
    color: #fff;
    text-decoration: none;
}

.hkvt-share-toggle:focus-visible,
.hkvt-share-btn:focus-visible {
    outline: 3px solid #0b1836;
    outline-offset: 2px;
}

.hkvt-share-whatsapp {
    background: #10b981;
}

.hkvt-share-facebook {
    background: #1d4ed8;
}

.hkvt-share-linkedin {
    background: #2563eb;
}

.hkvt-share-mail {
    background: #6b7280;
}

/* Closed by default. `visibility` keeps the options out of the accessibility
   tree and non-interactive; the container is fixed, so nothing can shift. */
.hkvt-share-btn {
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px) scale(0.9);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}

.hkvt-share-fab--open .hkvt-share-btn {
    opacity: 1;
    visibility: visible;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .hkvt-share-btn {
        transition: none;
    }
}

/* One geometry at every width: the lowered stack (top edge 248px) fits any
   phone screen, so there are no per-width position overrides. Only viewports
   shorter than ~480px (landscape phones) can't fit the ~456px-tall open
   option column above the toggle — there the menu expands sideways instead.
   `direction: ltr` pins the flex main axis so the toggle stays on the
   physical left in both RTL and LTR. */
@media (max-height: 480px) {
    .hkvt-share-fab {
        direction: ltr;
        flex-direction: row-reverse;
    }

    .hkvt-share-options {
        flex-direction: row;
    }

    .hkvt-share-btn {
        transform: translateX(-8px) scale(0.9);
    }
}

/* Share count line injected below the "1 star" bar row of the rating panel. */
.student_feedback_container .hkvt-share-count-line {
    width: 327px;
    max-width: 100%;            /* safety on narrow screens; no effect at spec width */
    height: 50px;
    color: #517adb;
    font-family: "cocoonCustomSecondary", sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 50px;
    letter-spacing: 0;
    text-align: right;
    white-space: nowrap;
}
