/*
 * Snow Modern — qa-styles.css  v2.0 CLEAN
 * surak.baribar.kz
 */

/* =====================================================================
   1. CSS VARIABLES
   ===================================================================== */
:root {
    --sm-primary:       #5c42ab;
    --sm-primary-hover: #4a3596;
    --sm-primary-light: #f1edfb;
    --sm-green:         #2ecc71;
    --sm-green-light:   #e6f7ed;
    --sm-red:           #e24b4a;
    --sm-red-light:     #fce8e8;
    --sm-yellow:        #f5c842;
    --sm-yellow-light:  #fffbeb;
    --sm-bg:            #f5f5f7;
    --sm-card:          #ffffff;
    --sm-border:        #eef0f3;
    --sm-border-mid:    #d8d8de;
    --sm-border-hover:  #d4c8f5;
    --sm-text:          #1a1a1a;
    --sm-text-muted:    #666;
    --sm-text-hint:     #aaa;
    --sm-radius:        10px;
    --sm-radius-sm:     7px;
    --sm-radius-xs:     5px;
    --sm-shadow:        0 1px 3px rgba(0,0,0,0.05);
    --sm-shadow-hover:  0 4px 12px rgba(92,66,171,0.08);
    --sm-nav-h:         60px;
    --sm-font:          'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* =====================================================================
   2. BASE
   ===================================================================== */
body {
    font-family: var(--sm-font) !important;
    background:  var(--sm-bg) !important;
    color:       var(--sm-text) !important;
    -webkit-font-smoothing: antialiased;
    line-height: 1.6;
}
a { color: var(--sm-primary); text-decoration: none; }
a:hover { color: var(--sm-primary-hover); text-decoration: underline; }

/* Reset lists */
.qa-nav-main-list, .qa-nav-main-list-1,
.qa-nav-sub-list, .qa-nav-user-list,
.qa-nav-footer-list, .qa-page-links,
.qa-q-item-tag-list, .qa-q-view-tag-list,
.qa-vote-buttons, .qam-user-dropdown-nav {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 0 !important;
}

/* =====================================================================
   3. NAVBAR
   ===================================================================== */
#qam-topbar {
    background: var(--sm-card) !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    box-shadow: var(--sm-shadow) !important;
    z-index: 1000 !important;
    transition: transform 0.25s cubic-bezier(0.4,0,0.2,1) !important;
}
.qa-sticky-nav #qam-topbar { position: sticky !important; top: 0 !important; }
.qa-sticky-nav #qam-topbar.qam-topbar-hidden {
    transform: translateY(-100%) !important;
    box-shadow: none !important;
}
.qa-sticky-nav.qam-nav-hidden .qam-subnav { top: 0 !important; }

.qam-inner {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    height: var(--sm-nav-h) !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
}
.qam-logo { flex-shrink: 0 !important; }
.qam-logo .qa-logo-link, .qam-logo a {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--sm-primary) !important;
    text-decoration: none !important;
}
.qam-logo img { max-height: 40px; }

/* Nav list */
.qam-nav-main { flex: 1 !important; display: flex !important; align-items: center !important; min-width: 0 !important; }
.qam-nav-main .qa-nav-main-list {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 2px !important;
}
.qam-nav-main .qa-nav-main-item { display: block !important; list-style: none !important; }
.qam-nav-main .qa-nav-main-link {
    display: block !important;
    padding: 6px 11px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--sm-text-muted) !important;
    border-radius: var(--sm-radius-xs) !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    transition: background 0.15s, color 0.15s !important;
}
.qam-nav-main .qa-nav-main-link:hover,
.qam-nav-main .qa-nav-main-selected {
    background: var(--sm-primary-light) !important;
    color: var(--sm-primary) !important;
    text-decoration: none !important;
}

/* Hamburger */
.qam-hamburger {
    display: none !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 5px !important;
    width: 36px; height: 36px; padding: 6px 5px;
    background: transparent !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius-sm) !important;
    cursor: pointer;
}
.qam-hamburger span { display: block; width: 100%; height: 2px; background: #555; border-radius: 2px; }

/* Search */
.qam-search { flex-shrink: 0 !important; max-width: 260px !important; width: 100% !important; }
.qam-search form {
    display: flex !important;
    align-items: center !important;
    background: var(--sm-bg) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius-sm) !important;
    overflow: hidden !important;
    transition: border-color 0.15s, box-shadow 0.15s !important;
}
.qam-search form:focus-within {
    border-color: var(--sm-primary) !important;
    box-shadow: 0 0 0 3px rgba(92,66,171,0.1) !important;
    background: var(--sm-card) !important;
}
.qam-search-field {
    flex: 1 !important;
    border: none !important;
    background: transparent !important;
    padding: 7px 10px !important;
    font-size: 13px !important;
    font-family: inherit !important;
    color: var(--sm-text) !important;
    outline: none !important;
    min-width: 0 !important;
}
.qam-search-field::placeholder { color: var(--sm-text-hint) !important; }
.qam-search-btn {
    background: transparent !important;
    border: none !important;
    padding: 7px 10px !important;
    cursor: pointer !important;
    color: var(--sm-text-hint) !important;
    display: flex !important;
    align-items: center !important;
    transition: color 0.15s !important;
}
.qam-search-btn:hover { color: var(--sm-primary) !important; }

/* User area */
.qam-user { flex-shrink: 0 !important; display: flex !important; align-items: center !important; gap: 8px !important; }
.qam-login-btn, .qam-register-btn {
    font-size: 13px !important; font-weight: 500 !important;
    padding: 7px 16px !important; border-radius: var(--sm-radius-sm) !important;
    text-decoration: none !important; white-space: nowrap !important; transition: all 0.15s !important;
}
.qam-login-btn { color: var(--sm-primary) !important; border: 0.5px solid var(--sm-primary) !important; background: transparent !important; }
.qam-login-btn:hover { background: var(--sm-primary-light) !important; text-decoration: none !important; }
.qam-register-btn { background: var(--sm-primary) !important; color: #fff !important; border: none !important; }
.qam-register-btn:hover { background: var(--sm-primary-hover) !important; text-decoration: none !important; }

.qam-user-menu-wrap { position: relative !important; }
.qam-user-trigger {
    width: 36px; height: 36px; padding: 0 !important;
    background: transparent !important; border: 0.5px solid var(--sm-border) !important;
    border-radius: 50% !important; cursor: pointer !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    overflow: hidden !important; transition: border-color 0.15s !important;
}
.qam-user-trigger:hover { border-color: var(--sm-primary) !important; }
.qam-user-avatar img, .qa-avatar-image { width: 36px !important; height: 36px !important; border-radius: 50% !important; display: block !important; }
.qam-user-dropdown {
    position: absolute !important; top: calc(100% + 8px) !important; right: 0 !important;
    min-width: 200px !important; background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.1) !important; z-index: 2000 !important;
    opacity: 0 !important; visibility: hidden !important; transform: translateY(-8px) !important;
    transition: all 0.2s ease !important;
}
.qam-user-dropdown.qam-user-dropdown-open { opacity: 1 !important; visibility: visible !important; transform: translateY(0) !important; }
.qam-user-dropdown-head { padding: 12px 14px !important; border-bottom: 0.5px solid var(--sm-border) !important; }
.qam-user-name { display: block !important; font-size: 14px !important; font-weight: 600 !important; color: var(--sm-text) !important; text-decoration: none !important; margin-bottom: 2px !important; }
.qam-user-points { font-size: 11px !important; color: var(--sm-text-hint) !important; }
.qam-user-dropdown-nav { padding: 6px 0 !important; }
.qam-user-dropdown-nav li a {
    display: block !important; padding: 8px 14px !important; font-size: 13px !important;
    color: var(--sm-text-muted) !important; text-decoration: none !important; transition: background 0.1s !important;
}
.qam-user-dropdown-nav li a:hover { background: var(--sm-primary-light) !important; color: var(--sm-primary) !important; }

/* =====================================================================
   4. SUB-NAV
   ===================================================================== */
.qam-subnav {
    background: var(--sm-card) !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    position: sticky !important;
    top: var(--sm-nav-h) !important;
    z-index: 900 !important;
    transition: top 0.25s cubic-bezier(0.4,0,0.2,1) !important;
}
.qam-subnav .qam-inner { height: auto !important; min-height: 42px !important; padding: 5px 20px !important; flex-wrap: wrap !important; gap: 4px !important; }
.qam-subnav .qa-nav-sub-list { display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 3px !important; align-items: center !important; }
.qam-subnav .qa-nav-sub-item { display: block !important; list-style: none !important; }
.qam-subnav .qa-nav-sub-link {
    display: block !important; padding: 5px 12px !important; font-size: 13px !important; font-weight: 500 !important;
    color: var(--sm-text-muted) !important; border-radius: var(--sm-radius-xs) !important;
    text-decoration: none !important; white-space: nowrap !important; transition: all 0.15s !important;
}
.qam-subnav .qa-nav-sub-link:hover { background: var(--sm-primary-light) !important; color: var(--sm-primary) !important; }
.qam-subnav .qa-nav-sub-selected { background: var(--sm-primary) !important; color: #fff !important; border-radius: var(--sm-radius-xs) !important; }
.qam-subnav .qa-nav-sub-selected:hover { background: var(--sm-primary-hover) !important; color: #fff !important; }

/* =====================================================================
   5. LAYOUT
   ===================================================================== */
.qa-main-wrapper {
    max-width: 1200px !important;
    margin: 0 auto !important;
    padding: 24px 20px 40px !important;
    display: flex !important;
    gap: 20px !important;
    align-items: flex-start !important;
}
.qa-main-wrapper > .qa-main {
    flex: 1 !important;
    min-width: 0 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}
.qa-main-wrapper > .qa-sidepanel { width: 260px !important; flex-shrink: 0 !important; }
.qa-sidebar, .qa-sidepanel > div {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 14px !important;
    margin-bottom: 10px !important;
    font-size: 13px !important;
    color: var(--sm-text-muted) !important;
    line-height: 1.6 !important;
}

/* =====================================================================
   6. QUESTION HEADING CARD (favorite + h1)
   ===================================================================== */
/* heading div ішінде flex — favorite оң жақта, h1 сол жақта */
.qa-main-heading {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 16px 20px !important;
    margin-bottom: 8px !important;
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: flex-start !important;
    gap: 10px !important;
}
.qa-main-heading h1 {
    flex: 1 !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    color: var(--sm-text) !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
}
.qa-main-heading h1 a { color: var(--sm-text) !important; text-decoration: none !important; }
.qa-main-heading h1 a:hover { color: var(--sm-primary) !important; }

/* Favorite батырмасы */
.qa-favoriting { flex-shrink: 0 !important; margin-top: 2px !important; }
.qa-favorite-button {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: transparent !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: 6px !important;
    width: 28px !important; height: 28px !important;
    font-size: 15px !important; line-height: 28px !important;
    text-align: center !important; cursor: pointer !important;
    color: var(--sm-text-hint) !important; padding: 0 !important;
    display: inline-block !important; transition: all 0.15s !important;
}
.qa-favorite-button:hover { border-color: #f59e0b !important; background: #fffbeb !important; color: #f59e0b !important; }
.qa-favorited .qa-favorite-button { border-color: #f59e0b !important; background: #fffbeb !important; color: #f59e0b !important; }

/* =====================================================================
   7. QUESTION VIEW CARD
   ===================================================================== */
.qa-part-q-view {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 20px !important;
    margin-bottom: 8px !important;
}
/* qa-q-view: voting (div.qa-q-view-stats) | content */
.qa-q-view {
    display: flex !important;
    gap: 0 !important;
    align-items: flex-start !important;
}
.qa-q-view-stats {
    flex-shrink: 0 !important;
    width: 56px !important;
    padding-right: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}
.qa-q-view-main { flex: 1 !important; min-width: 0 !important; }
.qa-q-view-content { font-size: 15px !important; line-height: 1.75 !important; color: var(--sm-text) !important; margin-bottom: 14px !important; }
.qa-q-view-content p { margin: 0 0 12px 0 !important; }
.qa-q-view-content img { max-width: 100% !important; border-radius: var(--sm-radius-sm) !important; }
.qa-q-view-avatar-meta, .qa-a-item-avatar-meta {
    display: flex !important; align-items: center !important; gap: 8px !important;
    margin-top: 14px !important; padding-top: 12px !important;
    border-top: 0.5px solid var(--sm-border) !important;
    font-size: 12px !important; color: #777 !important; flex-wrap: wrap !important;
}
.qa-q-view-buttons, .qa-a-item-buttons {
    display: flex !important; gap: 4px !important; flex-wrap: wrap !important; margin-top: 12px !important;
}

/* =====================================================================
   8. VOTING BUTTONS
   ===================================================================== */
.qa-voting { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 3px !important; }
.qa-vote-buttons { display: flex !important; flex-direction: column !important; align-items: center !important; gap: 3px !important; }
.qa-vote-count { text-align: center !important; margin: 3px 0 !important; }
.qa-netvote-count-data { display: block !important; font-size: 16px !important; font-weight: 600 !important; color: var(--sm-text) !important; line-height: 1.2 !important; }
.qa-netvote-count-pad { display: block !important; font-size: 10px !important; color: var(--sm-text-hint) !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; }

input.qa-vote-up-button, input.qa-vote-first-button,
input.qa-vote-down-button, input.qa-vote-second-button,
input.qa-vote-one-button, input.qa-voted-up-button, input.qa-voted-down-button,
input.qa-vote-up-disabled, input.qa-vote-down-disabled {
    -webkit-appearance: none !important;
    appearance: none !important;
    display: block !important;
    width: 32px !important; height: 32px !important;
    border: 0.5px solid var(--sm-border) !important;
    background: var(--sm-card) !important;
    border-radius: 8px !important;
    font-size: 14px !important; font-weight: 600 !important;
    color: var(--sm-text-muted) !important;
    cursor: pointer !important; padding: 0 !important;
    text-align: center !important; line-height: 32px !important;
    transition: all 0.15s !important;
}
input.qa-vote-up-button:hover, input.qa-vote-first-button:hover {
    background: var(--sm-primary-light) !important; border-color: var(--sm-primary) !important; color: var(--sm-primary) !important;
}
input.qa-vote-down-button:hover, input.qa-vote-second-button:hover {
    background: var(--sm-red-light) !important; border-color: var(--sm-red) !important; color: var(--sm-red) !important;
}
/* Voted state */
input.qa-voted-up-button { background: var(--sm-primary-light) !important; border-color: var(--sm-primary) !important; color: var(--sm-primary) !important; }
input.qa-voted-down-button { background: var(--sm-red-light) !important; border-color: var(--sm-red) !important; color: var(--sm-red) !important; }
/* Disabled — тізімде жасыру */
input.qa-vote-up-disabled, input.qa-vote-down-disabled { opacity: 0.3 !important; cursor: not-allowed !important; background: var(--sm-bg) !important; }
.qa-q-list-item input.qa-vote-up-disabled,
.qa-q-list-item input.qa-vote-down-disabled { display: none !important; }

/* =====================================================================
   9. QUESTION LIST
   ===================================================================== */
.qa-q-list { display: flex !important; flex-direction: column !important; gap: 8px !important; }
.qa-q-list-item {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 14px 16px !important;
    display: flex !important; gap: 14px !important; align-items: flex-start !important;
    list-style: none !important;
    transition: border-color 0.15s, box-shadow 0.15s !important;
}
.qa-q-list-item:hover { border-color: var(--sm-border-hover) !important; box-shadow: var(--sm-shadow-hover) !important; }
.qa-q-item-stats {
    display: flex !important; flex-direction: column !important; gap: 5px !important;
    flex-shrink: 0 !important; width: 72px !important; text-align: center !important;
}
.qa-vote-count-q, .qa-a-count {
    background: var(--sm-bg) !important; border-radius: var(--sm-radius-sm) !important;
    padding: 7px 6px !important; display: block !important;
}
.qa-a-count-data, .qa-netvote-count-data { display: block !important; font-size: 16px !important; font-weight: 600 !important; color: var(--sm-primary) !important; line-height: 1.2 !important; }
.qa-a-count-zero .qa-a-count-data { color: var(--sm-text-hint) !important; }
.qa-a-count-pad, .qa-netvote-count-pad { display: block !important; font-size: 10px !important; color: var(--sm-text-hint) !important; text-transform: uppercase !important; letter-spacing: 0.3px !important; }
.qa-q-item-main { flex: 1 !important; min-width: 0 !important; }
.qa-q-item-title { font-size: 15px !important; font-weight: 500 !important; margin-bottom: 7px !important; line-height: 1.4 !important; }
.qa-q-item-title a { color: var(--sm-text) !important; text-decoration: none !important; }
.qa-q-item-title a:hover { color: var(--sm-primary) !important; }
.qa-q-item-meta, .qa-q-item-avatar-meta { font-size: 12px !important; color: var(--sm-text-hint) !important; display: flex !important; align-items: center !important; flex-wrap: wrap !important; gap: 4px !important; margin-top: 6px !important; }

/* Tags */
.qa-q-item-tag-list, .qa-q-view-tag-list { display: flex !important; flex-wrap: wrap !important; gap: 5px !important; margin-top: 8px !important; }
.qa-q-item-tag-item, .qa-q-view-tag-item { display: inline-block !important; list-style: none !important; }
.qa-tag-link {
    display: inline-block !important; background: var(--sm-bg) !important;
    border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius-xs) !important;
    padding: 2px 9px !important; font-size: 11px !important; color: var(--sm-text-muted) !important;
    text-decoration: none !important; transition: all 0.15s !important;
}
.qa-tag-link:hover { background: var(--sm-primary-light) !important; border-color: var(--sm-border-hover) !important; color: var(--sm-primary) !important; text-decoration: none !important; }

/* Category */
.qa-category-link {
    display: inline-block !important; background: var(--sm-primary-light) !important;
    color: var(--sm-primary) !important; border-radius: 10px !important;
    padding: 2px 9px !important; font-size: 11px !important; font-weight: 500 !important;
    text-decoration: none !important; transition: background 0.15s !important;
}
.qa-category-link:hover { background: #e0d8f6 !important; text-decoration: none !important; }
.qa-user-link { color: var(--sm-primary) !important; font-weight: 500 !important; }
.qa-user-link:hover { text-decoration: underline !important; }

/* =====================================================================
   10. ANSWER LIST — жеке карточкалар
   ===================================================================== */
.qa-part-a-list h2, #a_list_title {
    font-size: 16px !important; font-weight: 600 !important; color: var(--sm-text) !important;
    margin: 8px 0 !important; padding: 0 !important;
    background: transparent !important; border: none !important;
}
.qa-a-list { display: flex !important; flex-direction: column !important; gap: 8px !important; }
.qa-a-list-item {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 16px 20px !important;
    display: flex !important;
    gap: 0 !important;
    align-items: flex-start !important;
}
/* Voting form — солда, нақты width */
.qa-a-list-item > form:first-child {
    flex-shrink: 0 !important;
    width: 56px !important;
    padding-right: 16px !important;
    min-width: 56px !important;
}
.qa-a-item-main { flex: 1 !important; min-width: 0 !important; }
.qa-a-item-content { font-size: 14px !important; line-height: 1.7 !important; color: var(--sm-text) !important; margin-bottom: 12px !important; }
.qa-a-list-item-selected { border-left: 3px solid var(--sm-green) !important; }

/* Best answer */
.qa-a-selection { margin-bottom: 8px !important; }
.qa-a-select-button {
    -webkit-appearance: none !important; appearance: none !important;
    background: transparent !important; border: 1px solid var(--sm-green) !important;
    color: var(--sm-green) !important; border-radius: 6px !important;
    padding: 4px 12px !important; font-size: 12px !important; font-weight: 500 !important;
    font-family: inherit !important; cursor: pointer !important; transition: all 0.15s !important;
}
.qa-a-select-button:hover { background: var(--sm-green) !important; color: #fff !important; }
.qa-a-unselect-button {
    -webkit-appearance: none !important; appearance: none !important;
    background: var(--sm-green-light) !important; border: 1px solid var(--sm-green) !important;
    color: #1a6b3a !important; border-radius: 6px !important;
    padding: 4px 12px !important; font-size: 12px !important; font-weight: 600 !important;
    font-family: inherit !important; cursor: pointer !important; transition: all 0.15s !important; display: inline-block !important;
}
.qa-a-selected-badge {
    display: inline-block !important; background: var(--sm-green-light) !important;
    color: #1a6b3a !important; border: 1px solid var(--sm-green) !important;
    border-radius: 6px !important; padding: 4px 12px !important;
    font-size: 12px !important; font-weight: 600 !important; margin-bottom: 8px !important;
}

/* =====================================================================
   11. FORM BUTTONS (edit, flag, etc.)
   ===================================================================== */
.qa-form-light-button {
    -webkit-appearance: none !important; appearance: none !important;
    background: transparent !important; border: 0.5px solid var(--sm-border) !important;
    color: var(--sm-text-hint) !important; font-size: 12px !important; font-weight: 500 !important;
    padding: 5px 11px !important; border-radius: var(--sm-radius-xs) !important;
    cursor: pointer !important; font-family: inherit !important; transition: all 0.15s !important;
}
.qa-form-light-button:hover { background: var(--sm-primary-light) !important; border-color: var(--sm-primary) !important; color: var(--sm-primary) !important; }
.qa-form-light-button-hide:hover, .qa-form-light-button-delete:hover, .qa-form-light-button-close:hover {
    background: var(--sm-red-light) !important; border-color: var(--sm-red) !important; color: var(--sm-red) !important;
}

/* =====================================================================
   12. ANSWER / COMMENT FORMS
   ===================================================================== */
.qa-part-form { margin-top: 8px !important; }
.qa-a-form, .qa-c-form {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 20px !important;
    margin-top: 8px !important;
}
.qa-a-form h2, .qa-c-form h2 {
    font-size: 15px !important; font-weight: 600 !important; color: var(--sm-text) !important;
    margin: 0 0 14px 0 !important; padding: 0 !important; background: none !important; border: none !important;
}
.qa-form-tall-table { width: 100% !important; border-collapse: collapse !important; }
.qa-form-tall-table td { padding: 4px 0 8px !important; vertical-align: top !important; }
.qa-form-tall-label { display: block !important; font-size: 13px !important; font-weight: 500 !important; color: #444 !important; margin-bottom: 5px !important; }
.qa-form-tall-note { font-size: 12px !important; color: var(--sm-text-hint) !important; margin-top: 4px !important; }
.qa-form-tall-error { font-size: 12px !important; color: var(--sm-red) !important; margin-top: 4px !important; }

/* Form inputs — тек Q2A класстары */
input.qa-form-tall-text {
    display: block !important; width: 100% !important; height: 44px !important;
    background: var(--sm-bg) !important; border: 0.5px solid var(--sm-border-mid) !important;
    border-radius: var(--sm-radius-sm) !important; padding: 0 14px !important;
    font-size: 14px !important; font-family: inherit !important; color: var(--sm-text) !important;
    box-sizing: border-box !important; transition: all 0.15s !important;
}
input.qa-form-tall-text:focus { background: #fff !important; border-color: var(--sm-primary) !important; box-shadow: 0 0 0 3px rgba(92,66,171,0.1) !important; outline: none !important; }
textarea.qa-form-tall-text {
    display: block !important; width: 100% !important; min-height: 80px !important;
    background: var(--sm-bg) !important; border: 0.5px solid var(--sm-border-mid) !important;
    border-radius: var(--sm-radius-sm) !important; padding: 10px 14px !important;
    font-size: 14px !important; font-family: inherit !important; color: var(--sm-text) !important;
    box-sizing: border-box !important; resize: vertical !important; transition: all 0.15s !important;
}
textarea.qa-form-tall-text:focus { background: #fff !important; border-color: var(--sm-primary) !important; box-shadow: 0 0 0 3px rgba(92,66,171,0.1) !important; outline: none !important; }
/* CKEditor textarea жасыру */
textarea[data-qa-cke5] { display: none !important; }

select.qa-form-tall-select {
    height: 40px !important; background: var(--sm-bg) !important;
    border: 0.5px solid var(--sm-border-mid) !important; border-radius: var(--sm-radius-sm) !important;
    padding: 0 12px !important; font-size: 14px !important; font-family: inherit !important;
    color: var(--sm-text) !important; cursor: pointer !important; transition: border-color 0.15s !important;
}
select.qa-form-tall-select:focus { border-color: var(--sm-primary) !important; outline: none !important; }

.qa-form-tall-buttons { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; padding-top: 6px !important; }
input.qa-form-tall-button {
    -webkit-appearance: none !important; appearance: none !important;
    background: var(--sm-primary) !important; color: #fff !important; border: none !important;
    border-radius: var(--sm-radius-sm) !important; padding: 10px 22px !important;
    font-size: 13px !important; font-weight: 500 !important; font-family: inherit !important;
    cursor: pointer !important; transition: background 0.15s !important;
}
input.qa-form-tall-button:hover { background: var(--sm-primary-hover) !important; }
input.qa-form-tall-button-cancel {
    background: transparent !important; color: var(--sm-text-muted) !important;
    border: 0.5px solid var(--sm-border-mid) !important;
}
input.qa-form-tall-button-cancel:hover { background: var(--sm-bg) !important; }

/* CKEditor */
.ck.ck-editor { border-radius: var(--sm-radius-sm) !important; overflow: hidden !important; border: 0.5px solid var(--sm-border-mid) !important; }
.ck.ck-editor__main > .ck-editor__editable { min-height: 160px !important; background: #fff !important; font-size: 14px !important; font-family: inherit !important; border: none !important; border-top: 0.5px solid var(--sm-border-mid) !important; }
.ck.ck-toolbar { background: var(--sm-bg) !important; border: none !important; border-bottom: 0.5px solid var(--sm-border-mid) !important; padding: 4px 8px !important; }

/* =====================================================================
   13. PAGINATION
   ===================================================================== */
.qa-page-links {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    padding: 12px 16px !important;
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    margin-top: 8px !important;
}
.qa-suggest-next {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 14px 20px !important;
    margin-top: 8px !important;
    text-align: center !important;
    font-size: 14px !important;
}
.qa-suggest-next a {
    color: var(--sm-primary) !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}
.qa-suggest-next a:hover { text-decoration: underline !important; }
.qa-page-links li { display: inline-flex !important; list-style: none !important; }
.qa-page-links-label { font-size: 13px !important; color: var(--sm-text-hint) !important; margin-right: 4px !important; }
.qa-page-link, .qa-page-prev, .qa-page-next {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    min-width: 34px !important; height: 34px !important; padding: 0 10px !important;
    background: var(--sm-card) !important; border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius-sm) !important; font-size: 13px !important; font-weight: 500 !important;
    color: var(--sm-text-muted) !important; text-decoration: none !important; transition: all 0.15s !important;
}
.qa-page-link:hover, .qa-page-prev:hover, .qa-page-next:hover { background: var(--sm-primary-light) !important; border-color: var(--sm-primary) !important; color: var(--sm-primary) !important; text-decoration: none !important; }
.qa-page-selected {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    min-width: 34px !important; height: 34px !important; padding: 0 10px !important;
    background: var(--sm-text) !important; color: #fff !important;
    border-radius: var(--sm-radius-sm) !important; font-size: 13px !important; font-weight: 600 !important;
}

/* =====================================================================
   14. NOTICES / ERRORS
   ===================================================================== */
.qa-notice { background: var(--sm-yellow-light) !important; border: 0.5px solid var(--sm-yellow) !important; border-left: 3px solid var(--sm-yellow) !important; border-radius: var(--sm-radius-sm) !important; padding: 12px 16px !important; font-size: 13px !important; margin-bottom: 14px !important; color: #7a5800 !important; }
.qa-error { background: var(--sm-red-light) !important; border: 0.5px solid var(--sm-red) !important; border-left: 3px solid var(--sm-red) !important; border-radius: var(--sm-radius-sm) !important; padding: 12px 16px !important; font-size: 13px !important; color: #7a1a1a !important; margin-bottom: 14px !important; }
.qa-error a { color: var(--sm-primary) !important; }

/* =====================================================================
   15. FOOTER
   ===================================================================== */
#qam-footer { background: #1e1e2e !important; margin-top: 40px !important; }
#qam-footer .qam-inner { height: auto !important; padding: 24px 20px !important; flex-direction: column !important; gap: 8px !important; text-align: center !important; align-items: center !important; }
.qa-nav-footer-list { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 16px !important; }
.qa-nav-footer-item a { font-size: 13px !important; color: #aaa !important; text-decoration: none !important; }
.qa-nav-footer-item a:hover { color: #fff !important; }
.qa-attribution { font-size: 12px !important; color: #666 !important; }
.qa-attribution a { color: #aaa !important; }

/* =====================================================================
   16. MOBILE
   ===================================================================== */
@media (max-width: 768px) {
    .qam-inner { padding: 0 14px !important; gap: 8px !important; height: 52px !important; }
    .qam-hamburger { display: flex !important; }
    .qam-nav-main .qa-nav-main-list {
        display: none !important; position: absolute !important; top: 52px !important;
        left: 0 !important; right: 0 !important; background: var(--sm-card) !important;
        border-bottom: 0.5px solid var(--sm-border) !important; padding: 8px 14px !important;
        flex-direction: column !important; z-index: 999 !important;
        box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important;
    }
    .qam-nav-main .qa-nav-main-list.qam-nav-main-open { display: flex !important; }
    /* Мобильде іздеу өрісі */
    .qam-search { max-width: none !important; flex: 1 !important; min-width: 0 !important; }
    /* Login/Register батырмалары мобильде де көрінсін */
    .qam-login-btn, .qam-register-btn { display: inline-block !important; padding: 6px 12px !important; font-size: 12px !important; }
    /* Layout — padding жоқ */
    .qa-body-wrapper { padding: 0 !important; }
    .qa-main-wrapper {
        flex-direction: column !important;
        padding: 10px 10px 24px !important;
        gap: 6px !important;
    }
    .qa-main { padding: 0 !important; background: transparent !important; }

    /* Сұрақ тізімі карточкалары */
    .qa-q-list { gap: 6px !important; }
    .qa-q-list-item {
        flex-direction: column !important;
        padding: 12px 14px !important;
        gap: 0 !important;
        border-radius: 10px !important;
    }
    /* Stats — тақырыптан кейін, горизонталь */
    .qa-q-item-main { order: 1 !important; width: 100% !important; }
    .qa-q-item-stats {
        order: 2 !important;
        width: 100% !important;
        flex-direction: row !important;
        gap: 14px !important;
        justify-content: flex-start !important;
        align-items: center !important;
        margin-top: 10px !important;
        padding-top: 10px !important;
        border-top: 0.5px solid var(--sm-border) !important;
        background: transparent !important;
        padding-left: 0 !important;
        min-width: 0 !important;
    }
    /* Voting — мобильде жасыру, тек жауап саны */
    .qa-q-list-item .qa-voting { display: none !important; }
    /* Жауап / дауыс саны */
    .qa-a-count, .qa-vote-count-q {
        background: transparent !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 3px !important;
        flex-direction: row !important;
    }
    .qa-a-count-data, .qa-netvote-count-data {
        font-size: 13px !important;
        font-weight: 600 !important;
        display: inline !important;
    }
    .qa-a-count-pad, .qa-netvote-count-pad {
        font-size: 12px !important;
        display: inline !important;
        text-transform: none !important;
        letter-spacing: 0 !important;
    }
    .qa-main-wrapper > .qa-sidepanel { width: 100% !important; }
    .qa-q-view { flex-direction: column !important; }
    .qa-q-view-stats { width: 100% !important; flex-direction: row !important; gap: 8px !important; padding-right: 0 !important; }
    .qa-a-list-item { flex-direction: column !important; }
    .qam-subnav { overflow-x: auto !important; }
    .qam-subnav .qa-nav-sub-list { flex-wrap: nowrap !important; }
    /* Login/Register беті */
    .qa-template-login .qam-register-btn,
    .qa-template-register .qam-login-btn { display: inline-block !important; }
}

/* Қаралым саны — Q2A базалық класс шығарады */
.qa-q-view-extra { font-size: 12px !important; color: var(--sm-text-hint) !important; margin-top: 8px !important; }
.qa-q-view-extra-pad { display: none !important; }

/* =====================================================================
   17. CATEGORIES PAGE
   ===================================================================== */
.qa-part-category-list { background: var(--sm-card) !important; border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius) !important; padding: 4px 0 !important; }
.qa-category-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.qa-category-list-item {
    display: flex !important; align-items: center !important; justify-content: space-between !important;
    padding: 12px 20px !important; border-bottom: 0.5px solid var(--sm-border) !important;
    transition: background 0.15s !important;
}
.qa-category-list-item:last-child { border-bottom: none !important; }
.qa-category-list-item:hover { background: var(--sm-bg) !important; }
.qa-category-list-link { font-size: 15px !important; font-weight: 500 !important; color: var(--sm-text) !important; text-decoration: none !important; }
.qa-category-list-link:hover { color: var(--sm-primary) !important; }
.qa-category-list-count { font-size: 12px !important; color: var(--sm-text-hint) !important; background: var(--sm-bg) !important; border-radius: 10px !important; padding: 2px 10px !important; }
.qa-category-list-count a { color: var(--sm-primary) !important; font-weight: 500 !important; }

/* =====================================================================
   18. TAGS PAGE
   ===================================================================== */
.qa-part-tag-list { background: var(--sm-card) !important; border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius) !important; padding: 20px !important; }
.qa-tag-list { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; }
.qa-tag-list-item { display: inline-block !important; list-style: none !important; }
.qa-tag-list-item .qa-tag-link {
    display: inline-flex !important; align-items: center !important; gap: 6px !important;
    background: var(--sm-bg) !important; border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius-sm) !important; padding: 6px 14px !important;
    font-size: 13px !important; color: var(--sm-text-muted) !important;
    text-decoration: none !important; transition: all 0.15s !important;
}
.qa-tag-list-item .qa-tag-link:hover { background: var(--sm-primary-light) !important; border-color: var(--sm-border-hover) !important; color: var(--sm-primary) !important; }
.qa-tag-list-count { font-size: 11px !important; background: var(--sm-border) !important; border-radius: 8px !important; padding: 1px 7px !important; color: var(--sm-text-hint) !important; font-weight: 600 !important; }

/* =====================================================================
   19. USERS PAGE
   ===================================================================== */
.qa-part-user-list { background: var(--sm-card) !important; border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius) !important; padding: 8px 0 !important; }
.qa-user-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.qa-user-list-item {
    display: flex !important; align-items: center !important; gap: 12px !important;
    padding: 10px 20px !important; border-bottom: 0.5px solid var(--sm-border) !important;
    transition: background 0.15s !important;
}
.qa-user-list-item:last-child { border-bottom: none !important; }
.qa-user-list-item:hover { background: var(--sm-bg) !important; }
.qa-user-list-avatar-link img { width: 36px !important; height: 36px !important; border-radius: 50% !important; }
.qa-user-list-handle { font-size: 14px !important; font-weight: 500 !important; }
.qa-user-list-score { font-size: 12px !important; color: var(--sm-text-hint) !important; margin-left: auto !important; background: var(--sm-bg) !important; border-radius: 10px !important; padding: 2px 10px !important; }
.qa-user-list-score a { color: var(--sm-primary) !important; }

/* =====================================================================
   20. USER PROFILE
   ===================================================================== */
.qa-part-user-profile { background: var(--sm-card) !important; border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius) !important; padding: 24px !important; margin-bottom: 8px !important; }
.qa-user-profile-avatar img { width: 72px !important; height: 72px !important; border-radius: 50% !important; margin-bottom: 12px !important; }
.qa-user-profile-fields { display: grid !important; grid-template-columns: auto 1fr !important; gap: 8px 20px !important; align-items: start !important; }
.qa-user-profile-label { font-size: 13px !important; color: var(--sm-text-hint) !important; white-space: nowrap !important; }
.qa-user-profile-value { font-size: 13px !important; color: var(--sm-text) !important; }

/* User sub-nav (Аккаунтым, Таңдаулы, т.б.) */
.qa-nav-user { background: var(--sm-card) !important; border-bottom: 0.5px solid var(--sm-border) !important; position: sticky !important; top: var(--sm-nav-h) !important; z-index: 900 !important; }
.qa-nav-user-list { display: flex !important; flex-wrap: wrap !important; gap: 3px !important; padding: 6px 20px !important; max-width: 1200px !important; margin: 0 auto !important; }
.qa-nav-user-item { list-style: none !important; }
.qa-nav-user-link {
    display: block !important; padding: 6px 12px !important; font-size: 13px !important; font-weight: 500 !important;
    color: var(--sm-text-muted) !important; border-radius: var(--sm-radius-xs) !important;
    text-decoration: none !important; transition: all 0.15s !important; white-space: nowrap !important;
}
.qa-nav-user-link:hover { background: var(--sm-primary-light) !important; color: var(--sm-primary) !important; }
.qa-nav-user-selected { background: var(--sm-primary) !important; color: #fff !important; border-radius: var(--sm-radius-xs) !important; }
.qa-nav-user-selected:hover { background: var(--sm-primary-hover) !important; color: #fff !important; }

/* =====================================================================
   21. ADMIN PAGE
   ===================================================================== */
/* Admin sub-nav жоғарыда тұр */
.qa-nav-sub .qa-nav-sub-list {
    display: flex !important; flex-wrap: wrap !important; gap: 2px !important;
    padding: 6px 0 !important; list-style: none !important;
}
/* Admin form inputs — тек label жанындағы input-тар */
.qa-form-wide-table { width: 100% !important; border-collapse: collapse !important; }
.qa-form-wide-table td { padding: 8px 0 !important; vertical-align: middle !important; }
.qa-form-wide-label { font-size: 13px !important; color: var(--sm-text-muted) !important; padding-right: 16px !important; white-space: nowrap !important; min-width: 200px !important; }
input.qa-form-wide-text {
    height: 38px !important; background: var(--sm-bg) !important;
    border: 0.5px solid var(--sm-border-mid) !important; border-radius: var(--sm-radius-sm) !important;
    padding: 0 12px !important; font-size: 13px !important; font-family: inherit !important;
    color: var(--sm-text) !important; transition: border-color 0.15s !important;
    box-sizing: border-box !important;
}
input.qa-form-wide-text:focus { border-color: var(--sm-primary) !important; outline: none !important; box-shadow: 0 0 0 3px rgba(92,66,171,0.1) !important; }
select.qa-form-wide-select {
    height: 38px !important; background: var(--sm-bg) !important;
    border: 0.5px solid var(--sm-border-mid) !important; border-radius: var(--sm-radius-sm) !important;
    padding: 0 12px !important; font-size: 13px !important; font-family: inherit !important;
    color: var(--sm-text) !important; cursor: pointer !important;
}
input.qa-form-wide-button {
    -webkit-appearance: none !important; appearance: none !important;
    background: var(--sm-primary) !important; color: #fff !important; border: none !important;
    border-radius: var(--sm-radius-sm) !important; padding: 8px 20px !important;
    font-size: 13px !important; font-weight: 500 !important; font-family: inherit !important;
    cursor: pointer !important; transition: background 0.15s !important; margin-top: 4px !important;
}
input.qa-form-wide-button:hover { background: var(--sm-primary-hover) !important; }
.qa-form-wide-note { font-size: 12px !important; color: var(--sm-text-hint) !important; margin-top: 4px !important; }
.qa-form-wide-error { font-size: 12px !important; color: var(--sm-red) !important; margin-top: 4px !important; }

/* Admin sections */
.qa-admin-section { background: var(--sm-card) !important; border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius) !important; padding: 20px !important; margin-bottom: 16px !important; }
.qa-admin-title { font-size: 16px !important; font-weight: 600 !important; color: var(--sm-text) !important; margin: 0 0 16px 0 !important; padding-bottom: 12px !important; border-bottom: 0.5px solid var(--sm-border) !important; }

/* Admin form table — ақ карточка */
.qa-form-wide-table {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 20px !important;
    margin-bottom: 16px !important;
    display: block !important;
}

/* =====================================================================
   ПАТЧ — форма кестелері, рейтинг, санат тізімі
   ===================================================================== */

/* qa-form-tall-table — Ask/Answer форма ақ карточка */
.qa-a-form .qa-form-tall-table,
.qa-c-form .qa-form-tall-table,
.qa-part-ask .qa-form-tall-table,
.qa-part-form .qa-form-tall-table {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin-bottom: 0 !important;
    display: table !important;
    width: 100% !important;
}

/* Рейтинг — қолданушылар тізімі */
.qa-part-ranking { background: var(--sm-card) !important; border: 0.5px solid var(--sm-border) !important; border-radius: var(--sm-radius) !important; padding: 8px 0 !important; }
.qa-ranking-users-points { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.qa-ranking-users-points li,
.qa-ranking-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 20px !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    transition: background 0.15s !important;
    list-style: none !important;
}
.qa-ranking-users-points li:last-child,
.qa-ranking-item:last-child { border-bottom: none !important; }
.qa-ranking-users-points li:hover,
.qa-ranking-item:hover { background: var(--sm-bg) !important; }
.qa-ranking-item-avatar img { width: 36px !important; height: 36px !important; border-radius: 50% !important; }
.qa-ranking-item-main { flex: 1 !important; font-size: 14px !important; font-weight: 500 !important; }
.qa-ranking-item-count {
    font-size: 12px !important; color: var(--sm-text-hint) !important;
    background: var(--sm-bg) !important; border-radius: 10px !important;
    padding: 2px 10px !important; font-weight: 500 !important;
}

/* Санат тізімі — Q2A dl/dt/dd форматы */
.qa-part-cat-list,
.qa-part-category-list {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    overflow: hidden !important;
    padding: 0 !important;
}
/* Әр санат жолы */
.qa-cat-list,
.qa-category-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }

.qa-cat-list-item,
.qa-category-list-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 20px !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    transition: background 0.15s !important;
    list-style: none !important;
}
.qa-cat-list-item:last-child,
.qa-category-list-item:last-child { border-bottom: none !important; }
.qa-cat-list-item:hover,
.qa-category-list-item:hover { background: var(--sm-bg) !important; }
.qa-cat-list-link,
.qa-category-list-link {
    font-size: 15px !important; font-weight: 500 !important;
    color: var(--sm-text) !important; text-decoration: none !important;
}
.qa-cat-list-link:hover,
.qa-category-list-link:hover { color: var(--sm-primary) !important; }
.qa-cat-list-count,
.qa-category-list-count {
    font-size: 12px !important; color: var(--sm-text-hint) !important;
    background: var(--sm-bg) !important; border-radius: 10px !important;
    padding: 2px 10px !important; border: 0.5px solid var(--sm-border) !important;
}
.qa-cat-list-count a,
.qa-category-list-count a { color: var(--sm-primary) !important; font-weight: 500 !important; }

/* qa-browse-cat-list жою — ескі CSS override */
.qa-browse-cat-list,
.qa-browse-cat-list-1 {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}
.qa-browse-cat-list li,
.qa-browse-cat-list-1 li {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 0 !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    list-style: none !important;
}
.qa-browse-cat-list a,
.qa-browse-cat-list-1 a {
    font-size: 15px !important; font-weight: 500 !important;
    color: var(--sm-text) !important; text-decoration: none !important;
    padding: 0 !important;
    display: inline !important;
}
.qa-browse-cat-list a:hover,
.qa-browse-cat-list-1 a:hover { color: var(--sm-primary) !important; }

/* =====================================================================
   Ask бетін карточкаға айналдыру
   ===================================================================== */
.qa-part-ask,
.qa-part-edit-q,
.qa-part-edit-a,
.qa-part-edit-c {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 24px !important;
    margin-bottom: 8px !important;
}

/* =====================================================================
   Санаттар — негізгі мазмұн карточка
   ===================================================================== */
/* Q2A санат беті qa-cat-list немесе жай ul/dl ішінде */
.qa-template-categories .qa-main > *:not(.qa-main-heading),
.qa-part-cat-list {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 8px 0 !important;
    overflow: hidden !important;
}

/* Санат жолдары — dl, ul немесе div болсын */
.qa-cat-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.qa-cat-list-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 12px 20px !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    list-style: none !important;
    transition: background 0.15s !important;
}
.qa-cat-list-item:last-child { border-bottom: none !important; }
.qa-cat-list-item:hover { background: var(--sm-bg) !important; }
.qa-cat-list-link {
    font-size: 15px !important; font-weight: 500 !important;
    color: var(--sm-text) !important; text-decoration: none !important;
}
.qa-cat-list-link:hover { color: var(--sm-primary) !important; text-decoration: none !important; }
.qa-cat-list-count {
    font-size: 12px !important; color: var(--sm-text-hint) !important;
    background: var(--sm-bg) !important; border: 0.5px solid var(--sm-border) !important;
    border-radius: 10px !important; padding: 2px 10px !important;
}
.qa-cat-list-count a { color: var(--sm-primary) !important; font-weight: 500 !important; text-decoration: none !important; }

/* =====================================================================
   НАҚТЫ КЛАССТАР — DevTools-тан тексерілді
   ===================================================================== */

/* Санаттар: ul.qa-browse-cat-list > li.qa-browse-cat-item */
.qa-part-nav-list {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    overflow: hidden !important;
    padding: 0 !important;
}
.qa-browse-cat-list { list-style: none !important; padding: 0 !important; margin: 0 !important; }
.qa-browse-cat-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 13px 20px !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    list-style: none !important;
    transition: background 0.15s !important;
}
.qa-browse-cat-item:last-child { border-bottom: none !important; }
.qa-browse-cat-item:hover { background: var(--sm-bg) !important; }
.qa-browse-cat-item a {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: var(--sm-text) !important;
    text-decoration: none !important;
    display: inline !important;
    padding: 0 !important;
}
.qa-browse-cat-item a:hover { color: var(--sm-primary) !important; }
/* Сұрақ санын оң жаққа */
.qa-browse-cat-item .qa-browse-cat-count,
.qa-browse-cat-item span:last-child {
    font-size: 12px !important;
    color: var(--sm-text-hint) !important;
    background: var(--sm-bg) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: 10px !important;
    padding: 2px 10px !important;
    white-space: nowrap !important;
}

/* Сұрақ қою: qa-part-form ақ карточка */
.qa-part-form {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 24px !important;
    margin-bottom: 8px !important;
}

/* =====================================================================
   Жауап саны — үздік жауап бар болса жасыл ерекшелеу
   ===================================================================== */
.qa-a-count-selected {
    background: var(--sm-green-light) !important;
    border-radius: var(--sm-radius-sm) !important;
}
.qa-a-count-selected .qa-a-count-data {
    color: #1a6b3a !important;
}
.qa-a-count-selected .qa-a-count-pad {
    color: #2ecc71 !important;
}

/* =====================================================================
   Қолданушылар беті — карточка grid
   ===================================================================== */
.qa-part-ranking .qa-ranking-users-points,
.qa-part-user-list .qa-user-list {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
}
.qa-part-ranking,
.qa-part-user-list {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
}

/* Әр қолданушы карточкасы */
.qa-ranking-item,
.qa-user-list-item {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 24px 16px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 8px !important;
    transition: border-color 0.15s, box-shadow 0.15s !important;
    list-style: none !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
}
.qa-ranking-item:hover,
.qa-user-list-item:hover {
    border-color: var(--sm-border-hover) !important;
    box-shadow: var(--sm-shadow-hover) !important;
    background: var(--sm-card) !important;
}

/* Аватар */
.qa-ranking-item-avatar img,
.qa-user-list-avatar-link img,
.qa-ranking-item img {
    width: 72px !important;
    height: 72px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

/* Есім */
.qa-ranking-item-main a,
.qa-user-list-handle a,
.qa-ranking-item .qa-user-link {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--sm-text) !important;
    text-decoration: none !important;
    display: block !important;
}
.qa-ranking-item-main a:hover,
.qa-user-list-handle a:hover { color: var(--sm-primary) !important; }

/* Балл */
.qa-ranking-item-count,
.qa-user-list-score {
    font-size: 13px !important;
    color: var(--sm-text-hint) !important;
    background: var(--sm-bg) !important;
    border-radius: 10px !important;
    padding: 3px 12px !important;
    margin-left: 0 !important;
    font-weight: 500 !important;
    border: none !important;
}

@media (max-width: 768px) {
    .qa-part-ranking .qa-ranking-users-points,
    .qa-part-user-list .qa-user-list {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 480px) {
    .qa-part-ranking .qa-ranking-users-points,
    .qa-part-user-list .qa-user-list {
        grid-template-columns: 1fr !important;
    }
}

/* =====================================================================
   САЙТ СТАТИСТИКАСЫ — footer жоғарысында
   ===================================================================== */
#qam-stats-bar {
    background: var(--sm-card) !important;
    border-top: 0.5px solid var(--sm-border) !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    margin-top: 0 !important;
    padding: 10px 0 !important;
}
#qam-stats-bar .qam-inner {
    height: auto !important;
    padding: 0 20px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0 !important;
    flex-wrap: wrap !important;
}
.qam-stat-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 6px 24px !important;
    border-right: 0.5px solid var(--sm-border) !important;
}
.qam-stat-item:last-child { border-right: none !important; }
.qam-stat-value {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--sm-primary) !important;
    background: var(--sm-primary-light) !important;
    border-radius: 6px !important;
    padding: 2px 10px !important;
    line-height: 1.4 !important;
}
.qam-stat-label {
    font-size: 13px !important;
    color: var(--sm-text-muted) !important;
    font-weight: 500 !important;
}
#qam-footer { margin-top: 0 !important; }

@media (max-width: 600px) {
    .qam-stat-item { padding: 6px 12px !important; }
    .qam-stat-value { font-size: 14px !important; }
    .qam-stat-label { font-size: 12px !important; }
}

/* Қаралым саны */
.qa-q-item-view-count,
.qa-q-view-views {
    font-size: 11px !important;
    color: var(--sm-text-hint) !important;
}
.qa-q-item-view-count::before { content: ' · 👁 '; }
.q-item-view-data { font-weight: 500 !important; color: var(--sm-text-muted) !important; }

/* =====================================================================
   "Сұрақ қою" navbar-да ерекше батырма
   ===================================================================== */
.qa-nav-main-ask .qa-nav-main-link {
    background: var(--sm-primary) !important;
    color: #fff !important;
    border-radius: var(--sm-radius-sm) !important;
    padding: 6px 14px !important;
    font-weight: 600 !important;
}
.qa-nav-main-ask .qa-nav-main-link:hover {
    background: var(--sm-primary-hover) !important;
    color: #fff !important;
}

/* =====================================================================
   "Үздік жауап" / "Жақсы жауап" мәтінін жасыру
   ===================================================================== */
/* "Жақсы жауап" мәтінін жасыру — тек qa-a-selected-text */
.qa-a-selected-text { display: none !important; }
/* qa-a-unselect-button — қалыпты стиль */
.qa-a-unselect-button::before { content: '' !important; }
/* qa-a-selected-badge — қалыпты стиль */
.qa-a-selected-badge::before { content: '' !important; }

/* h2 барлық жерде бірдей — 18px */
h2,
#a_list_title,
.qa-part-a-list h2,
.qa-a-form h2,
.qa-c-form h2,
.qa-widgets-main h2,
.qa-widget-main h2 {
    font-size: 18px !important;
    font-weight: 600 !important;
    color: var(--sm-text) !important;
    margin: 0 0 12px 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}

/* margin-top жою */
#qam-stats-bar { margin-top: 0 !important; }

/* =====================================================================
   ҚОЛДАНУШЫЛАР GRID — карточка стиль
   ===================================================================== */
.qam-users-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
}
.qam-user-card {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 24px 16px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    text-decoration: none !important;
    transition: border-color 0.15s, box-shadow 0.15s !important;
    gap: 8px !important;
}
.qam-user-card:hover {
    border-color: var(--sm-border-hover) !important;
    box-shadow: var(--sm-shadow-hover) !important;
    text-decoration: none !important;
}
.qam-user-card-avatar img {
    width: 72px !important;
    height: 72px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    display: block !important;
}
.qam-user-card-name {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--sm-text) !important;
    margin-top: 4px !important;
}
.qam-user-card-score {
    font-size: 13px !important;
    color: var(--sm-text-hint) !important;
    background: var(--sm-bg) !important;
    border-radius: 10px !important;
    padding: 2px 12px !important;
}
@media (max-width: 768px) {
    .qam-users-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
    .qam-users-grid { grid-template-columns: 1fr !important; }
}

/* =====================================================================
   МОБИЛЬ — Login/Register беті
   ===================================================================== */
@media (max-width: 768px) {
    /* Login бетінде Тіркелу батырмасы көрінсін */
    .qa-template-login .qam-register-btn,
    .qa-template-register .qam-login-btn {
        display: inline-block !important;
    }
    /* Navbar мобильде толық көрінсін */
    .qa-template-login .qam-inner,
    .qa-template-register .qam-inner {
        flex-wrap: wrap !important;
        height: auto !important;
        padding: 10px 14px !important;
        min-height: 52px !important;
    }
    /* Login/Register форма карточка */
    .qa-template-login .qa-main-wrapper,
    .qa-template-register .qa-main-wrapper {
        padding: 14px !important;
    }
}

/* =====================================================================
   ПРОФИЛЬ БЕТІ
   ===================================================================== */
.qa-part-user-profile {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 24px !important;
    margin-bottom: 8px !important;
}
/* Аватар */
.qa-user-avatar-name img,
.qa-user-avatar img {
    width: 80px !important;
    height: 80px !important;
    border-radius: 50% !important;
    margin-bottom: 12px !important;
}
/* dl/dt/dd стиль */
.qa-user-profile dl,
dl.qa-user-profile {
    display: grid !important;
    grid-template-columns: 180px 1fr !important;
    gap: 10px 16px !important;
    align-items: start !important;
    margin: 0 !important;
}
.qa-user-profile-label,
dt.qa-user-profile-label {
    font-size: 12px !important;
    color: var(--sm-text-hint) !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    padding-top: 2px !important;
}
.qa-user-profile-value,
dd.qa-user-profile-value {
    font-size: 14px !important;
    color: var(--sm-text) !important;
    margin: 0 !important;
    font-weight: 500 !important;
}
/* Балл — ерекшелеу */
.qa-user-profile-value .qa-user-points,
dd.qa-user-profile-value:has(.qa-user-points) {
    color: var(--sm-primary) !important;
    font-weight: 700 !important;
    font-size: 16px !important;
}

/* Permits — жасыру */
.qa-user-profile-permit,
.qa-user-profile-permit-label,
.qa-user-profile-permit-value,
tr.qa-user-profile-permit,
.qa-part-user-profile tr:has(.qa-user-profile-permit),
dt.qa-user-profile-label ~ dd.qa-user-profile-value .qa-user-permit-list,
.qa-user-permit-list { display: none !important; }

/* Permits деген label-ды да жасыру — inline style override */
.qa-part-user-profile table tr td:first-child {
    font-size: 12px !important;
    color: var(--sm-text-hint) !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    white-space: nowrap !important;
    padding-right: 20px !important;
    vertical-align: top !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
.qa-part-user-profile table tr td:last-child {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--sm-text) !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}
.qa-part-user-profile table tr td:last-child b,
.qa-part-user-profile table tr td:last-child strong {
    color: var(--sm-primary) !important;
    font-size: 16px !important;
}
/* Permits жолын жасыру — td ішінде ul болса */
.qa-part-user-profile table tr:has(ul) { display: none !important; }

/* =====================================================================
   ПРОФИЛЬ БЕТІ — нақты HTML негізінде
   ===================================================================== */

/* permits жолын ID арқылы жасыру */
tr#permits { display: none !important; }

/* Профиль форма — карточка */
.qa-part-form-profile,
.qa-part-form-activity {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 0 !important;
    margin-bottom: 8px !important;
    overflow: hidden !important;
}

/* Аватар бөлімі */
#avatar td { padding: 24px !important; text-align: center !important; }
#avatar .qa-avatar-image {
    width: 120px !important;
    height: 120px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
}

/* table жолдары */
.qa-part-form-profile .qa-form-wide-table tr,
.qa-part-form-activity .qa-form-wide-table tr {
    border-bottom: 0.5px solid var(--sm-border) !important;
    display: table-row !important;
}
.qa-part-form-profile .qa-form-wide-table tr:last-child,
.qa-part-form-activity .qa-form-wide-table tr:last-child {
    border-bottom: none !important;
}

/* Label колонкасы */
.qa-form-wide-label {
    font-size: 13px !important;
    color: var(--sm-text-muted) !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    padding: 14px 20px !important;
    width: 160px !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
}

/* Data колонкасы */
.qa-form-wide-data {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: var(--sm-text) !important;
    padding: 14px 20px 14px 0 !important;
    vertical-align: middle !important;
}

/* Балл ерекшелеу */
.qa-uf-user-points {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: var(--sm-primary) !important;
}
.qa-uf-user-rank { color: var(--sm-primary) !important; font-weight: 600 !important; }
.qa-uf-user-q-posts,
.qa-uf-user-a-posts,
.qa-uf-user-c-posts {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--sm-text) !important;
}

/* Activity h2 */
.qa-part-form-activity h2 {
    padding: 16px 20px !important;
    margin: 0 !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    background: var(--sm-bg) !important;
}

/* Батырмалар жолы */
.qa-form-wide-buttons {
    padding: 16px 20px !important;
    background: var(--sm-bg) !important;
}

/* =====================================================================
   VOTING + FAVORITE — көзге көрінетін стиль
   ===================================================================== */

/* Voting батырмалары — күлгін жиек, айқын */
input.qa-vote-up-button,
input.qa-vote-first-button {
    border-color: var(--sm-primary) !important;
    color: var(--sm-primary) !important;
    background: var(--sm-primary-light) !important;
    font-weight: 700 !important;
}
input.qa-vote-down-button,
input.qa-vote-second-button {
    border-color: var(--sm-border-mid) !important;
    color: var(--sm-text-muted) !important;
    background: var(--sm-bg) !important;
    font-weight: 700 !important;
}
input.qa-vote-up-button:hover,
input.qa-vote-first-button:hover {
    background: var(--sm-primary) !important;
    color: #fff !important;
}
input.qa-vote-down-button:hover,
input.qa-vote-second-button:hover {
    background: var(--sm-red-light) !important;
    border-color: var(--sm-red) !important;
    color: var(--sm-red) !important;
}

/* Voted state — белсенді */
input.qa-voted-up-button, input.qa-vote-one-button.qa-voted-up-button {
    background: var(--sm-primary) !important;
    border-color: var(--sm-primary) !important;
    color: #fff !important;
}
input.qa-voted-down-button, input.qa-vote-one-button.qa-voted-down-button {
    background: var(--sm-red) !important;
    border-color: var(--sm-red) !important;
    color: #fff !important;
}

/* Favorite батырмасы — сары жиек */
.qa-favorite-wrap .qa-favorite-button {
    border-color: #f59e0b !important;
    color: #f59e0b !important;
    background: #fffbeb !important;
    font-weight: 700 !important;
}
.qa-favorite-wrap .qa-favorite-button:hover {
    background: #f59e0b !important;
    color: #fff !important;
}

/* Мобиль — жауап беттерінде voting горизонталь */
@media (max-width: 768px) {
    .qa-a-list-item {
        flex-direction: column !important;
    }
    .qa-a-list-item .qa-voting {
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
        margin-bottom: 10px !important;
        width: 100% !important;
        padding-bottom: 10px !important;
        border-bottom: 0.5px solid var(--sm-border) !important;
    }
    .qa-a-list-item .qa-vote-buttons {
        display: flex !important;
        flex-direction: row !important;
        gap: 6px !important;
    }
    .qa-a-list-item .qa-vote-count {
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
    }
    .qa-a-item-main { width: 100% !important; }
    /* Сұрақ беттегі voting да горизонталь */
    .qa-q-view-stats .qa-voting {
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
    }
    .qa-q-view-stats .qa-vote-buttons {
        flex-direction: row !important;
        gap: 6px !important;
    }
}

/* =====================================================================
   МОБИЛЬ — voting мазмұн астына
   ===================================================================== */
@media (max-width: 768px) {
    /* Сұрақ беті */
    .qa-q-view {
        flex-direction: column !important;
    }
    .qa-q-view-stats {
        order: 2 !important;
        width: 100% !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 10px 0 0 0 !important;
        border-top: 0.5px solid var(--sm-border) !important;
        margin-top: 10px !important;
    }
    .qa-q-view-main {
        order: 1 !important;
        width: 100% !important;
    }
    .qa-q-view-stats .qa-vote-buttons {
        flex-direction: row !important;
        gap: 6px !important;
    }

    /* Жауап карточкалары */
    .qa-a-list-item {
        flex-direction: column !important;
    }
    .qa-a-item-selected,
    .qa-a-item-main {
        order: 1 !important;
        width: 100% !important;
    }
    .qa-a-list-item > form:first-child {
        order: 2 !important;
        width: 100% !important;
    }
    .qa-a-list-item .qa-voting {
        order: 2 !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 10px !important;
        width: 100% !important;
        padding-top: 10px !important;
        margin-top: 10px !important;
        border-top: 0.5px solid var(--sm-border) !important;
        border-right: none !important;
        padding-right: 0 !important;
        margin-right: 0 !important;
    }
    .qa-a-list-item .qa-a-item-main {
        order: 1 !important;
    }
    .qa-a-list-item .qa-vote-buttons {
        flex-direction: row !important;
        gap: 6px !important;
    }
}

/* Сұрақ беті — voting астына */
@media (max-width: 768px) {
    .qa-part-q-view .qa-q-view {
        display: flex !important;
        flex-direction: column !important;
    }
    /* voting form — астына */
    .qa-part-q-view .qa-q-view > form {
        order: 2 !important;
        width: 100% !important;
    }
    .qa-part-q-view .qa-q-view > form .qa-voting {
        flex-direction: row !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 10px 0 0 0 !important;
        border-top: 0.5px solid var(--sm-border) !important;
        border-right: none !important;
        margin-right: 0 !important;
        width: 100% !important;
    }
    .qa-part-q-view .qa-q-view > form .qa-vote-buttons {
        flex-direction: row !important;
        gap: 6px !important;
    }
    /* мазмұн — жоғарыда */
    .qa-part-q-view .qa-q-view-main {
        order: 1 !important;
        width: 100% !important;
    }
}

/* =====================================================================
   БАТЫРМАЛАР — Жауап беру/Пікір қосу ерекше, қалғаны ••• dropdown
   ===================================================================== */
.qa-q-view-buttons,
.qa-a-item-buttons {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-wrap: wrap !important;
}

/* Жауап беру — пікір секілді жиектелген */
input.qa-form-light-button-answer {
    background: transparent !important;
    color: var(--sm-primary) !important;
    border: 1px solid var(--sm-primary) !important;
    font-weight: 500 !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
}
input.qa-form-light-button-answer:hover {
    background: var(--sm-primary-light) !important;
}

/* Пікір қосу — жиектелген */
input.qa-form-light-button-comment {
    background: transparent !important;
    color: var(--sm-primary) !important;
    border: 1px solid var(--sm-primary) !important;
    font-weight: 500 !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
}
input.qa-form-light-button-comment:hover {
    background: var(--sm-primary-light) !important;
}

/* ••• батырма */
.qam-btn-more-wrap {
    position: relative !important;
    display: inline-block !important;
}
.qam-btn-more-trigger {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: var(--sm-bg) !important;
    border: 0.5px solid var(--sm-border-mid) !important;
    border-radius: var(--sm-radius-sm) !important;
    color: var(--sm-text-muted) !important;
    cursor: pointer !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    padding: 6px 10px !important;
    line-height: 1 !important;
    transition: all 0.15s !important;
}
.qam-btn-more-trigger:hover {
    background: var(--sm-border) !important;
    color: var(--sm-text) !important;
}
/* Dropdown мәзір */
.qam-btn-more-menu {
    display: none !important;
    position: absolute !important;
    bottom: calc(100% + 6px) !important;
    left: 0 !important;
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius-sm) !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.10) !important;
    z-index: 100 !important;
    min-width: 130px !important;
    padding: 4px 0 !important;
    flex-direction: column !important;
}
.qam-btn-more-menu.qam-btn-more-open {
    display: flex !important;
}
/* Dropdown ішіндегі батырмалар */
.qam-btn-more-menu input[type="submit"] {
    -webkit-appearance: none !important;
    appearance: none !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    color: var(--sm-text) !important;
    cursor: pointer !important;
    font-size: 13px !important;
    font-family: inherit !important;
    font-weight: 400 !important;
    padding: 9px 16px !important;
    text-align: left !important;
    width: 100% !important;
    transition: background 0.1s !important;
}
.qam-btn-more-menu input[type="submit"]:hover {
    background: var(--sm-bg) !important;
}
.qam-btn-more-menu input.qa-form-light-button-flag { color: var(--sm-red) !important; }

/* Сұрақ мазмұны — 17px */
.qa-q-view-content { font-size: 17px !important; line-height: 1.7 !important; }
/* Жауап мазмұны — 17px */
.qa-a-item-content { font-size: 17px !important; line-height: 1.7 !important; }
/* Пікір мазмұны — 16px */
.qa-c-item-content { font-size: 16px !important; line-height: 1.65 !important; }

/* Voting батырмалары арасы */
.qa-vote-buttons { gap: 6px !important; }

/* h2 жоғарыдан margin */
h2, #a_list_title,
.qa-part-a-list h2, .qa-a-form h2,
.qa-c-form h2, .qa-widgets-main h2,
.qa-widget-main h2 {
    margin-top: 16px !important;
}

/* =====================================================================
   ӨҢДЕУ БЕТІ — qa-form-tall-table
   ===================================================================== */
.qa-part-form-q-edit,
.qa-part-form-q-ask,
.qa-part-form-a-edit,
.qa-part-form-a-add {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 24px !important;
}
.qa-form-tall-table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}
.qa-form-tall-table tr { border: none !important; }
.qa-form-tall-table td { padding: 0 !important; border: none !important; }

/* Label */
td.qa-form-tall-label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--sm-text-muted) !important;
    padding-bottom: 6px !important;
    padding-top: 16px !important;
    display: block !important;
}
.qa-form-tall-table tr:first-child td.qa-form-tall-label { padding-top: 0 !important; }

/* Input */
td.qa-form-tall-data { display: block !important; padding-bottom: 4px !important; }

/* Санат select */
.qa-form-tall-table select { margin-right: 8px !important; }

/* Батырмалар жолы */
td.qa-form-tall-buttons {
    display: flex !important;
    gap: 8px !important;
    padding-top: 20px !important;
    flex-wrap: wrap !important;
}

/* =====================================================================
   NOTE / HINT — анық, оқылатын түс
   ===================================================================== */
/* CSS айнымалысын жаңарту */
:root { --sm-text-hint: #888 !important; }

/* Барлық note/hint элементтер */
.qa-form-tall-note,
.qa-form-wide-note,
.qa-form-light-note {
    font-size: 12px !important;
    color: #666 !important;
    margin-top: 5px !important;
    line-height: 1.5 !important;
}

/* Error */
.qa-form-tall-error,
.qa-form-wide-error,
.qa-form-light-error {
    font-size: 12px !important;
    color: var(--sm-red) !important;
    font-weight: 500 !important;
    margin-top: 5px !important;
}

/* Статус хабарламалар */
.qa-status,
.qa-part-custom .qa-notice,
.qa-notice {
    font-size: 13px !important;
    color: #555 !important;
}

/* Meta мәтіндер — уақыт, қаралым */
.qa-q-item-meta,
.qa-q-item-avatar-meta,
.qa-q-view-meta,
.qa-a-item-meta {
    color: #777 !important;
}

/* Балл, орын */
.qa-q-item-who-points,
.qa-a-item-who-points {
    color: #777 !important;
}

/* =====================================================================
   ЖЕКЕ СҰРАҚ БЕТІ — qa-part-message-list
   ===================================================================== */
.qa-part-message-list {
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border) !important;
    border-radius: var(--sm-radius) !important;
    padding: 20px !important;
    margin-bottom: 8px !important;
}
.qa-part-message-list h2 {
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    font-size: 18px !important;
}
/* Хабарлама тізімі */
.qa-message-list { margin-top: 16px !important; }
.qa-message-item {
    padding: 12px 0 !important;
    border-bottom: 0.5px solid var(--sm-border) !important;
}
.qa-message-item:last-child { border-bottom: none !important; }
.qa-message-content { font-size: 14px !important; color: var(--sm-text) !important; }
.qa-message-meta { font-size: 12px !important; color: #777 !important; margin-top: 6px !important; }

/* =====================================================================
   МОБИЛЬ — қолданушылар grid + профиль беті
   ===================================================================== */
@media (max-width: 768px) {
    /* Қолданушылар — 2 баған */
    .qam-users-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    .qam-user-card {
        padding: 16px 10px !important;
    }
    .qam-user-card-avatar img {
        width: 56px !important;
        height: 56px !important;
    }
    .qam-user-card-name { font-size: 13px !important; }

    /* Профиль беті — жоғарыдан padding */
    .qa-part-form-profile,
    .qa-part-form-activity {
        padding: 16px !important;
    }
    /* Profile table — мобильде стак */
    .qa-form-wide-label {
        width: 100% !important;
        display: block !important;
        padding: 12px 0 2px 0 !important;
        white-space: normal !important;
    }
    .qa-form-wide-data {
        display: block !important;
        padding: 0 0 8px 0 !important;
    }
    /* Аватар мобильде кішірейту */
    #avatar .qa-avatar-image {
        width: 88px !important;
        height: 88px !important;
    }
}

/* Профиль мобиль — label/value арасын жинақтау */
@media (max-width: 768px) {
    .qa-form-wide-table tr { display: flex !important; flex-direction: column !important; }
    .qa-form-wide-label {
        font-size: 12px !important;
        padding: 10px 0 2px 0 !important;
        border-bottom: none !important;
    }
    .qa-form-wide-data {
        padding: 0 0 4px 0 !important;
        font-size: 14px !important;
    }
    /* Аватар жолы ортада */
    #avatar { text-align: center !important; }
    #avatar td { padding: 16px 0 !important; }
}

/* Мобиль — h1 кішірейту */
@media (max-width: 768px) {
    .qa-main-heading h1 { font-size: 18px !important; }
}

/* =====================================================================
   ІЗДЕУ — басты бетте qa-main-wrapper үстінде толық ені
   ===================================================================== */
.qam-main-search {
    margin-bottom: 16px !important;
    padding: 0 !important;
    max-width: 100% !important;
}
.qam-main-search .qam-search {
    width: 100% !important;
    max-width: 100% !important;
}
.qam-main-search .qam-search form {
    display: flex !important;
    width: 100% !important;
}
.qam-main-search .qam-search-field {
    flex: 1 !important;
    height: 46px !important;
    font-size: 15px !important;
    border-radius: var(--sm-radius-sm) 0 0 var(--sm-radius-sm) !important;
    background: var(--sm-card) !important;
    border: 0.5px solid var(--sm-border-mid) !important;
    border-right: none !important;
    padding: 0 16px !important;
}
.qam-main-search .qam-search-field:focus {
    border-color: var(--sm-primary) !important;
    outline: none !important;
    box-shadow: none !important;
}
.qam-main-search .qam-search-btn {
    height: 46px !important;
    padding: 0 20px !important;
    border-radius: 0 var(--sm-radius-sm) var(--sm-radius-sm) 0 !important;
    background: var(--sm-primary) !important;
    border: none !important;
}
.qam-main-search .qam-search-btn:hover {
    background: var(--sm-primary-hover) !important;
}
.qam-main-search .qam-search-btn svg {
    stroke: #fff !important;
}

/* Navbar-дағы іздеуді қайта көрсету */
.qam-topbar .qam-search { display: flex !important; }

/* Қаралым — тек иконка + сан, мәтін жоқ */
.q-item-view-pad,
.qa-view-count-pad { display: none !important; }

/* Meta мәтін + тег сілтемелері — 13px, анық түс */
.qa-q-item-meta,
.qa-q-item-avatar-meta,
.qa-q-view-meta,
.qa-a-item-meta {
    font-size: 13px !important;
    color: #666 !important;
}
.qa-q-item-meta .qa-tag-link,
.qa-q-item-avatar-meta .qa-tag-link,
.qa-q-view-meta .qa-tag-link,
.qa-a-item-meta .qa-tag-link,
.qa-q-item-tag-list .qa-tag-link,
.qa-q-view-tag-list .qa-tag-link {
    font-size: 12px !important;
    color: #555 !important;
}

/* Лого + гамбургер бірге */
.qam-logo-nav {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
}

/* Гамбургер — десктопта жасыру */
.qam-hamburger { display: none !important; }

@media (max-width: 768px) {
    .qam-hamburger {
        display: flex !important;
        flex-direction: column !important;
        gap: 4px !important;
        background: none !important;
        border: none !important;
        cursor: pointer !important;
        padding: 4px !important;
    }
    .qam-hamburger span {
        display: block !important;
        width: 20px !important;
        height: 2px !important;
        background: var(--sm-text) !important;
        border-radius: 2px !important;
    }

    /* Кіру беті мобильде */
    .qa-template-login .qa-main-wrapper,
    .qa-template-register .qa-main-wrapper {
        padding: 14px 12px !important;
    }
    .qa-template-login .qa-part-form-q-ask,
    .qa-template-login .qa-main,
    .qa-template-register .qa-main {
        width: 100% !important;
    }
    /* Кіру формасы карточка */
    .qa-template-login .qa-form-tall-table,
    .qa-template-register .qa-form-tall-table {
        width: 100% !important;
    }
    .qa-template-login .qa-sidepanel,
    .qa-template-register .qa-sidepanel {
        display: none !important;
    }
}

.qam-main-search .qam-search-field { height: 44px !important; }
.qam-main-search .qam-search-btn { height: 44px !important; }

@media (max-width: 768px) {
    .qa-main-heading h1 { font-size: 17px !important; }
}

input.qa-form-tall-text { height: 42px !important; }
.qam-search-field { height: 42px !important; }
.qam-search-btn { height: 42px !important; }
.qam-main-search .qam-search-field { height: 42px !important; }
.qam-main-search .qam-search-btn { height: 42px !important; }

/* Nav links — 14px */
.qam-nav-main .qa-nav-main-link { font-size: 14px !important; }

/* Мобильде Кіру/Тіркелу — 13px */
@media (max-width: 768px) {
    .qam-login-btn, .qam-register-btn { font-size: 13px !important; }
}

/* Sidepanel sticky — десктопта */
@media (min-width: 769px) {
    .qa-sidepanel {
        position: sticky !important;
        top: calc(var(--sm-nav-h) + 24px) !important;
        align-self: flex-start !important;
    }
    .qa-sticky-nav.qam-nav-hidden .qa-sidepanel {
        top: 24px !important;
    }
}

/* =====================================================================
   ҚАРАЛЫМ САНЫ — qa-q-view-stats астында
   ===================================================================== */
.qa-q-view-count {
    margin-top: 8px !important;
    font-size: 12px !important;
    color: #777 !important;
    text-align: center !important;
}
.qa-q-view-count .qa-view-count-data {
    font-weight: 600 !important;
    color: var(--sm-text) !important;
}
.qa-q-view-count .qa-view-count-pad { color: #888 !important; }

/* Мобильде — дауыс берудің оң жағына */
@media (max-width: 768px) {
    .qa-q-view-count {
        display: inline-flex !important;
        align-items: center !important;
        gap: 4px !important;
        margin-top: 0 !important;
        margin-left: 8px !important;
        text-align: left !important;
    }
    .qa-part-q-view .qa-q-view-stats {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }
}

@media (max-width: 768px) {
    .qa-main-wrapper { padding-left: 5px !important; padding-right: 5px !important; }
    .qa-part-q-view { padding-left: 16px !important; padding-right: 16px !important; }
    .qa-main-heading { padding-left: 16px !important; padding-right: 16px !important; }
    .qa-a-list-item { padding-left: 16px !important; padding-right: 16px !important; }
}
