/*
 * WK Knowledgebase — Theme-Consistent Overrides
 * Plugin: wk-knowledgebase  (frontend "default" theme, wkknw-* markup)
 *
 * Loads AFTER the plugin's `wkknw_theme_style` handle (see functions.php),
 * so same-specificity rules win on load order and no `!important` is needed
 * except where a parent/Tailwind rule already uses it.
 *
 * Every selector is scoped to a wkknw-* hook, so this file has ZERO effect on
 * any page that does not render the knowledgebase.
 *
 * Fixes:
 *   1. "How may I help you?" heading — the theme's global `p{line-height:1.5rem}`
 *      leaks in and stretches the single-line prompt. Restore normal spacing.
 *   2. "Submit Your Queries" modal <textarea> — global/Tailwind + RMA textarea
 *      rules (tiny font, light colour, auto/350px width, hair-thin radius) leak
 *      in and distort it. Re-normalise inside the modal only.
 *   3. Mobile layout — the legacy `.wkknw_row{margin:0 -15px}` gutter overflows
 *      the CSS-grid cell it now lives in (content pushed off the left edge), and
 *      the 3fr/1fr grid never collapses on small screens. Neutralise the gutter
 *      and stack the grid to one column below 768px.
 */

/* ─── 1. Search prompt line-height leak ───────────────────────────── */
#wkknw-live-search p {
    line-height: normal;
}

/* ─── 2. Query modal textarea normalisation ───────────────────────── */
.wkknw-modal .wkknw-query-textarea textarea,
.wkknw-modal textarea.form-control {
    width: 100%;
    min-height: 120px;
    margin: 0;
    border: 1px solid #dbdbdc;
    border-radius: 3px;
    font-size: 15px;
    line-height: 1.5;
    color: #666;
    background-color: #fff;
}

/* ─── 2a. "Submit Your Queries" modal wrapper ─────────────────────── */
/* The plugin's `.wkknw_widget_right_sidebar .wkknw_container` grid (3fr/1fr)
   also matches the container that wraps this modal, so the 645px panel gets
   squeezed into a narrow grid cell and distorts. Take THIS container back to
   normal block flow (scoped to #wkknw-blind so the page grid is untouched). */
#wkknw-blind .wkknw_container {
    display: block;
}

/* Make the fixed 645px panel responsive: full width up to a 645px cap so it
   never runs off the edge on small screens. */
.wkknw-modal-wrapper {
    width: 100%;
    max-width: 645px;
}

/* ─── 2b. Article comment box (Leave a Reply) ─────────────────────── */
/* RMA's global `textarea{width:auto}` leak drops #comment back to its
   cols="45" size, so it overflows the column. Restore full width. */
.wkknw_reply #comment,
.wkknw_reply .comment-form-comment textarea {
    width: 100%;
    box-sizing: border-box;
}

/* ─── 3. Mobile / grid layout of the stats + request block ────────── */
/* Legacy negative-margin gutter overflows the grid cell -> kill it here. */
.wkknw_row {
    margin-left: 0;
    margin-right: 0;
}

@media screen and (max-width: 768px) {

    /* Collapse the 3fr / 1fr sidebar grid to a single column so the main
       content no longer gets squeezed and shifted off-screen. */
    .wkknw_widget_right_sidebar .wkknw_container {
        grid-template-columns: 1fr;
    }

    .wkknw_widget_right_sidebar .wkknw_container .wkknw_listing_page {
        grid-column-start: 1;
        grid-row: auto;
    }
}