/*
 * OSK — Presglobal on-screen keyboard (PM-4673)
 * Branded dark/coral theme (matches PM-4659/PM-4666 combo palette):
 *   surface #17181B, keys #26272B, coral #F04E37 (+ light #F5795F),
 *   muted #ACB5C3, white #FAFAFA, coral glow, 6px radius.
 * Fixed, bottom-anchored floating dialog above Bootstrap/bootbox modals.
 */

.osk-keyboard {
    position: fixed;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 110%);
    width: 96%;
    max-width: 780px;
    z-index: 100000;
    box-sizing: border-box;
    padding: 10px 12px 14px;
    background: #17181B;
    border: 1px solid #2C2D31;
    border-bottom: none;
    border-radius: 12px 12px 0 0;
    box-shadow: 0 -8px 40px rgba(0, 0, 0, 0.55);
    direction: ltr;
    font-family: inherit;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: transform 0.18s ease-out;
    touch-action: manipulation;
}

.osk-keyboard.osk-visible {
    transform: translate(-50%, 0);
}

/* Disabled = shown but no input focused: dim + inert */
.osk-keyboard.osk-disabled {
    opacity: 0.55;
}
.osk-keyboard.osk-disabled .osk-grid,
.osk-keyboard.osk-disabled .osk-controlrow {
    pointer-events: none;
}

/* ---- top bar: language name + language toggle + hide ---- */
.osk-keyboard .osk-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}
.osk-keyboard .osk-lang-name {
    color: #ACB5C3;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding-left: 4px;
}
.osk-keyboard .osk-bar-actions {
    display: flex;
    gap: 8px;
}

/* ---- rows / keys ---- */
.osk-keyboard .osk-row {
    display: flex;
    justify-content: center;
    gap: 6px;
    margin-bottom: 6px;
}
.osk-keyboard .osk-row:last-child {
    margin-bottom: 0;
}

.osk-keyboard .osk-key {
    -webkit-appearance: none;
    appearance: none;
    flex: 1 1 0;
    min-width: 0;
    height: 52px;
    margin: 0;
    padding: 0 6px;
    background: #26272B;
    color: #FAFAFA;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 6px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    transition: background 0.08s ease, box-shadow 0.08s ease, border-color 0.08s ease;
}
.osk-keyboard .osk-key:hover {
    background: #303136;
}
.osk-keyboard .osk-key:active {
    background: #3A3B41;
    transform: translateY(1px);
}

/* invisible placeholder to keep diacritic rows aligned to the base row */
.osk-keyboard .osk-spacer {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    cursor: default;
    pointer-events: none;
    flex: 1 1 0;
}

/* function keys (backspace, shift, alt, @, .) — a touch narrower + muted */
.osk-keyboard .osk-fn {
    flex: 0 0 auto;
    min-width: 56px;
    color: #ACB5C3;
    font-size: 17px;
}
.osk-keyboard .osk-bksp,
.osk-keyboard .osk-shiftkey {
    min-width: 74px;
    font-size: 20px;
}

/* toggled-on function keys (shift held / alt on) */
.osk-keyboard .osk-key.osk-on {
    background: #3A3B41;
    color: #FAFAFA;
    border-color: rgba(240, 78, 55, 0.6);
}
/* caps lock latched */
.osk-keyboard .osk-key.osk-locked {
    background: #F04E37;
    color: #fff;
    border-color: rgba(0, 0, 0, 0.35);
    box-shadow: 0 0 12px rgba(240, 78, 55, 0.4);
}

/* language toggle in the top bar */
.osk-keyboard .osk-lang {
    min-width: 90px;
    background: #26272B;
    color: #F5795F;
    font-weight: 600;
    font-size: 15px;
}
.osk-keyboard .osk-lang:hover {
    color: #fff;
}
.osk-keyboard .osk-hide {
    min-width: 48px;
    font-size: 15px;
}

/* ---- bottom control row ---- */
.osk-keyboard .osk-controlrow {
    display: flex;
    gap: 6px;
    margin-top: 6px;
}
.osk-keyboard .osk-space {
    flex: 1 1 auto;
    height: 52px;
    background: #26272B;
    color: #7E848F;
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 6px;
    font-size: 14px;
    letter-spacing: 0.08em;
    text-transform: lowercase;
    cursor: pointer;
}
.osk-keyboard .osk-space:hover {
    background: #303136;
}

/* action key = coral + glow (matches combo "Select" button) */
.osk-keyboard .osk-action,
.osk-keyboard .osk-enter {
    flex: 0 0 auto;
    min-width: 92px;
    height: 52px;
    background: #F04E37;
    color: #fff;
    border: 2px solid rgba(0, 0, 0, 0.35);
    border-radius: 6px;
    font-size: 22px;
    font-weight: 600;
    box-shadow: 0 0 14px rgba(240, 78, 55, 0.45);
    cursor: pointer;
}
.osk-keyboard .osk-action:hover,
.osk-keyboard .osk-enter:hover {
    background: #F5795F;
}
.osk-keyboard .osk-action:active,
.osk-keyboard .osk-enter:active {
    transform: translateY(1px);
}

/* ---- numeric mode: fewer, larger keys, centered ---- */
.osk-keyboard.osk-num {
    max-width: 340px;
}
.osk-keyboard.osk-num .osk-key {
    height: 60px;
    font-size: 24px;
    flex: 1 1 0;
}
.osk-keyboard.osk-num .osk-controlrow .osk-space,
.osk-keyboard.osk-num .osk-controlrow .osk-sym,
.osk-keyboard.osk-num .osk-controlrow .osk-dot {
    display: none;
}

/* ---- RTL layout (Hebrew): mirror the input direction cue only ---- */
.osk-keyboard.osk-rtl .osk-lang-name {
    direction: rtl;
}

/* floating re-open launcher (shown after a soft-dismiss on touch surfaces) */
.osk-launcher {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 100000;
    width: 60px;
    height: 60px;
    padding: 0;
    border-radius: 50%;
    background: #F04E37;
    color: #fff;
    border: 2px solid rgba(0, 0, 0, 0.35);
    box-shadow: 0 0 16px rgba(240, 78, 55, 0.5), 0 4px 12px rgba(0, 0, 0, 0.4);
    font-size: 26px;
    line-height: 1;
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
    touch-action: manipulation;
    transition: background 0.1s ease, transform 0.1s ease;
}
.osk-launcher:hover {
    background: #F5795F;
}
.osk-launcher:active {
    transform: translateY(1px);
}

/* small screens */
@media (max-width: 560px) {
    .osk-keyboard .osk-key { height: 46px; font-size: 18px; }
    .osk-keyboard .osk-fn { min-width: 44px; }
    .osk-keyboard .osk-bksp,
    .osk-keyboard .osk-shiftkey { min-width: 58px; }
}
