/* ==========================================================================
   PCRU E-PORTFOLIO: ROYAL ELEGANCE & MODERN ASTRA SUITE
   Phetchabun Rajabhat University (e-portfolio.pcru.ac.th)
   Authoritative Master Stylesheet — Version 1.1.0
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Prompt:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Sarabun:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

:root {
    --pcru-purple: #51189B;
    --pcru-purple-dark: #3B0764;
    --pcru-purple-deep: #1E063B;
    --pcru-purple-light: #7C3AED;
    --pcru-purple-soft: #F5F3FF;
    --pcru-purple-bg: #FAF5FF;
    --pcru-gold: #F59E0B;
    --pcru-gold-dark: #D97706;
    --pcru-gold-light: #FDE68A;
    --pcru-gold-soft: #FEF3C7;
    --pcru-ink: #0F172A;
    --pcru-slate: #334155;
    --pcru-muted: #64748B;
    --pcru-card-bg: #FFFFFF;
    --pcru-border: #E9D5FF;
    --pcru-shadow-sm: 0 4px 14px rgba(81, 24, 155, 0.05);
    --pcru-shadow: 0 12px 32px rgba(81, 24, 155, 0.08);
    --pcru-shadow-lg: 0 20px 48px rgba(81, 24, 155, 0.14);
    --pcru-radius: 18px;
    --pcru-radius-sm: 10px;
    --pcru-radius-pill: 999px;
}

/* ==========================================================================
   1. GLOBAL RESET & BASE TYPOGRAPHY
   ========================================================================== */
html, body, .site {
    scroll-behavior: smooth;
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

/* Hide Floating Share Button on Front Page */
.home .fscb-share-container,
.home .fb-share-button {
    display: none !important;
}

body, button, input, select, textarea,
h1, h2, h3, h4, h5, h6,
.elementor-heading-title, .elementor-icon-box-title,
.anwp-pg-post-teaser__title, .anwp-font-heading,
.colibri-menu, .h-menu, .upk-title,
.post-title, .entry-title {
    font-family: 'Prompt', 'Sarabun', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    background-color: #FAF8FD !important;
    color: var(--pcru-ink) !important;
    padding-bottom: 0 !important;
}

@media (max-width: 768px) {
    body {
        padding-bottom: 74px !important;
    }
}

p, span, li, td, th, .entry-content p, article p {
    font-family: 'Sarabun', 'Prompt', sans-serif;
    color: var(--pcru-slate);
    line-height: 1.75;
}

/* Smooth selection colors */
::selection {
    background: var(--pcru-purple);
    color: #ffffff;
}

/* ==========================================================================
   2. STICKY GLASSMORPHISM HEADER
   ========================================================================== */
.page-header,
.h-navigation_outer {
    position: sticky !important;
    top: 0 !important;
    z-index: 99999 !important;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(16px) !important;
    -webkit-backdrop-filter: blur(16px) !important;
    border-bottom: 1.5px solid rgba(233, 213, 255, 0.8) !important;
    box-shadow: 0 4px 24px rgba(81, 24, 155, 0.07) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.h-navigation_outer {
    background: transparent !important;
    box-shadow: none !important;
}

/* Top Mini Action Bar */
.style-19 {
    background: linear-gradient(135deg, #1E063B 0%, #3B0764 60%, #51189B 100%) !important;
    padding: 6px 0 !important;
    border-bottom: 1px solid rgba(245, 158, 11, 0.3) !important;
}

@media (max-width: 768px) {
    .style-19 {
        display: none !important;
    }
}

.style-19 span,
.style-19 a,
.style-19 svg {
    color: rgba(255, 255, 255, 0.92) !important;
    fill: rgba(255, 255, 255, 0.92) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
}

.style-19 a:hover,
.style-19 a:hover svg {
    color: var(--pcru-gold) !important;
    fill: var(--pcru-gold) !important;
}

/* Main Navigation Bar Row */
.h-section.h-navigation {
    min-height: 74px !important;
    background: transparent !important;
}

/* Header Logo Sizing */
.h-navigation img {
    max-height: 52px !important;
    width: auto !important;
    height: auto !important;
    transition: transform 0.25s ease !important;
    border-radius: 8px !important;
}

.h-navigation img:hover {
    transform: scale(1.03) !important;
}

@media (max-width: 768px) {
    .h-navigation img {
        max-height: 38px !important;
        max-width: 220px !important;
    }
    .style-3 {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 12px !important;
        box-sizing: border-box !important;
    }
    .style-3 .h-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }
    .style-4-outer {
        flex: 1 1 auto !important;
        max-width: calc(100% - 60px) !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }
    .style-4-outer img,
    .style-4 img,
    .logo-image {
        max-width: 210px !important;
        max-height: 38px !important;
        width: auto !important;
        height: auto !important;
        object-fit: contain !important;
    }
    .style-6-outer,
    .style-13-outer,
    .style-16-outer {
        display: none !important;
    }
    .style-8-outer {
        flex: 0 0 46px !important;
        max-width: 46px !important;
        margin-left: auto !important;
    }
    .h-hamburger-button {
        width: 42px !important;
        height: 42px !important;
        padding: 0 !important;
    }
    .h-hamburger-icon {
        width: 38px !important;
        height: 38px !important;
    }
}

/* Nav Menu Items */
.colibri-menu-container .menu-item a {
    font-family: 'Prompt', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: var(--pcru-purple-dark) !important;
    padding: 8px 18px !important;
    border-radius: var(--pcru-radius-pill) !important;
    transition: all 0.22s ease !important;
}

.colibri-menu-container .menu-item a:hover,
.colibri-menu-container .current-menu-item > a {
    color: #ffffff !important;
    background: linear-gradient(135deg, var(--pcru-purple) 0%, var(--pcru-purple-light) 100%) !important;
    box-shadow: 0 4px 14px rgba(81, 24, 155, 0.28) !important;
}

/* Neutralize Colibri WP Cyan Active Item Blocks */
#colibri .colibri-menu.solid-active-item > li::before,
#colibri .colibri-menu.solid-active-item > li::after,
#colibri .colibri-menu.bordered-active-item > li::before,
#colibri .colibri-menu.bordered-active-item > li::after,
.colibri-menu.solid-active-item > li::before,
.colibri-menu.solid-active-item > li::after,
.colibri-menu.bordered-active-item > li::before,
.colibri-menu.bordered-active-item > li::after,
.colibri-menu.effect-pull-up > li::before,
.colibri-menu.effect-pull-up > li::after {
    display: none !important;
    content: none !important;
    background: transparent !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Mobile Hamburger Button & Offscreen Header */
.h-hamburger-button,
.h-mobile-menu {
    display: none !important;
}

@media (max-width: 768px) {
    .h-hamburger-button,
    .h-mobile-menu {
        display: inline-flex !important;
    }
    .h-main-menu {
        display: none !important;
    }
}

.h-hamburger-button {
    color: var(--pcru-purple) !important;
    padding: 6px !important;
    align-items: center !important;
    justify-content: center !important;
}

.h-hamburger-icon {
    background-color: var(--pcru-purple-soft) !important;
    border: 1.5px solid rgba(81, 24, 155, 0.25) !important;
    border-radius: 10px !important;
    width: 40px !important;
    height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    fill: var(--pcru-purple) !important;
    transition: all 0.2s ease !important;
}

.h-hamburger-icon:hover {
    background-color: var(--pcru-purple) !important;
    fill: #ffffff !important;
}

.h-hamburger-icon:hover svg path {
    fill: #ffffff !important;
}

.h-hamburger-button svg path {
    fill: var(--pcru-purple) !important;
}

.offscreen-header {
    background: #ffffff !important;
    border-left: 3px solid var(--pcru-gold) !important;
    box-shadow: -8px 0 24px rgba(81, 24, 155, 0.15) !important;
}

.offscreen-header .colibri-menu li a {
    color: var(--pcru-purple-dark) !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    padding: 12px 18px !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}

.offscreen-header .colibri-menu li a:hover,
.offscreen-header .colibri-menu li.current-menu-item a {
    background: var(--pcru-purple-soft) !important;
    color: var(--pcru-purple) !important;
}

/* ==========================================================================
   3. ROYAL ELEGANCE HERO BANNER (.elementor-element-fb0fd25)
   ========================================================================== */
.elementor-element.elementor-element-fb0fd25 {
    background:
        radial-gradient(circle at 85% 18%, rgba(245, 158, 11, 0.22) 0%, transparent 40%),
        radial-gradient(circle at 10% 85%, rgba(139, 92, 246, 0.26) 0%, transparent 42%),
        linear-gradient(135deg, #1E063B 0%, #4C1D95 50%, #6D28D9 100%) !important;
    padding: clamp(38px, 5.5vw, 64px) 24px !important;
    border-radius: 24px !important;
    margin: 18px auto 20px auto !important;
    max-width: 1360px !important;
    box-shadow: 0 20px 50px rgba(30, 6, 59, 0.14), 0 4px 14px rgba(15, 23, 42, 0.05) !important;
    position: relative !important;
    overflow: hidden !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    text-align: center !important;
}

/* Top Decorative Gold & Purple Ribbon */
.elementor-element.elementor-element-fb0fd25::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 5px !important;
    background: linear-gradient(90deg, #51189B 0%, #D97706 25%, #FDE68A 50%, #F59E0B 75%, #7C3AED 100%) !important;
    box-shadow: 0 2px 10px rgba(245, 158, 11, 0.45) !important;
}

.elementor-element-fb0fd25 .elementor-heading-title,
.elementor-element-fb0fd25 p,
.elementor-element-fb0fd25 span {
    color: rgba(255, 255, 255, 0.95) !important;
}

/* Hero Title */
.elementor-element.elementor-element-5d99ef7 h2.elementor-heading-title {
    color: #ffffff !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: clamp(2.2rem, 4.2vw, 3.4rem) !important;
    font-weight: 800 !important;
    letter-spacing: -0.5px !important;
    text-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
    margin: 0 !important;
    line-height: 1.25 !important;
}

/* Hero Subtitle */
.elementor-element.elementor-element-0c70969 {
    margin-top: 8px !important;
    max-width: 820px !important;
}

.elementor-element.elementor-element-0c70969 p,
.elementor-element.elementor-element-0c70969 span {
    color: rgba(255, 255, 255, 0.94) !important;
    font-family: 'Sarabun', 'Prompt', sans-serif !important;
    font-size: clamp(1.05rem, 1.5vw, 1.25rem) !important;
    font-weight: 400 !important;
    line-height: 1.65 !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

/* ==========================================================================
   4. MODERN CAPSULE SEARCH BOX (.elementor-element-135a057)
   ========================================================================== */
.elementor-element.elementor-element-135a057 {
    background: transparent !important;
    padding: 0 16px 20px 16px !important;
    margin: -6px auto 20px auto !important;
    max-width: 840px !important;
}

.elementor-element.elementor-element-135a057 .e-con-inner {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 8px !important;
}

.elementor-element.elementor-element-4c5fbde,
.elementor-element.elementor-element-3f22b21 {
    display: none !important;
}

.elementor-element-b577e0a {
    width: 100% !important;
    max-width: 680px !important;
}

.is-search-form {
    display: flex !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 2px solid rgba(124, 58, 237, 0.25) !important;
    border-radius: var(--pcru-radius-pill) !important;
    padding: 6px 8px 6px 22px !important;
    box-shadow: 0 12px 32px rgba(81, 24, 155, 0.09), 0 2px 8px rgba(15, 23, 42, 0.04) !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.is-search-form:focus-within {
    border-color: var(--pcru-purple) !important;
    box-shadow: 0 16px 40px rgba(81, 24, 155, 0.16), 0 0 0 4px rgba(124, 58, 237, 0.14) !important;
    transform: translateY(-2px) !important;
}

.is-search-form label {
    flex: 1 1 auto !important;
    margin: 0 !important;
}

.is-search-input {
    border: none !important;
    outline: none !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 16px !important;
    color: var(--pcru-ink) !important;
    background: transparent !important;
    box-shadow: none !important;
    width: 100% !important;
    padding: 6px 0 !important;
}

.is-search-input::placeholder {
    color: var(--pcru-muted) !important;
    opacity: 0.85 !important;
}

.is-search-submit {
    background: linear-gradient(135deg, var(--pcru-gold) 0%, var(--pcru-gold-dark) 100%) !important;
    border: none !important;
    border-radius: var(--pcru-radius-pill) !important;
    width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(217, 119, 6, 0.35) !important;
    transition: all 0.25s ease !important;
    cursor: pointer !important;
    margin-left: 8px !important;
}

.is-search-submit:hover {
    transform: scale(1.08) !important;
    box-shadow: 0 6px 20px rgba(217, 119, 6, 0.5) !important;
}

.is-search-icon svg {
    fill: #ffffff !important;
    width: 18px !important;
    height: 18px !important;
}

/* ==========================================================================
   5. FACULTY / INSTITUTE DIRECTORY CARDS (12 UNITS - VIBRANT CHROMATIC THEMES)
   ========================================================================== */
.elementor-element.elementor-element-0b48cb3 {
    max-width: 1360px !important;
    margin: 15px auto 40px auto !important;
    padding: 0 16px !important;
}

.elementor-element.elementor-element-40c3554 {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 18px !important;
    padding: 0 !important;
    width: 100% !important;
}

@media (max-width: 1024px) {
    .elementor-element.elementor-element-40c3554 {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 15px !important;
    }
}

@media (max-width: 640px) {
    .elementor-element.elementor-element-40c3554 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }
}

/* Base Directory Card Item */
.elementor-element-40c3554 .elementor-widget-icon-box {
    border-radius: var(--pcru-radius) !important;
    padding: 26px 14px 22px !important;
    text-align: center !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    box-sizing: border-box !important;
    position: relative !important;
    overflow: hidden !important;
    cursor: pointer !important;
}

.elementor-element-40c3554 .elementor-widget-icon-box::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    transition: height 0.25s ease !important;
    z-index: 2 !important;
}

.elementor-element-40c3554 .elementor-widget-icon-box:hover {
    transform: translateY(-6px) !important;
}

.elementor-element-40c3554 .elementor-widget-icon-box:hover::before {
    height: 5.5px !important;
}

/* Base Stacked Icon Circle */
.elementor-element-40c3554 .elementor-view-stacked .elementor-icon,
.elementor-element-40c3554 .elementor-icon {
    border-radius: 50% !important;
    width: 68px !important;
    height: 68px !important;
    font-size: 32px !important;
    line-height: 1 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 14px auto !important;
    transition: all 0.28s cubic-bezier(0.16, 1, 0.3, 1) !important;
    position: relative !important;
}

.elementor-element-40c3554 .elementor-widget-icon-box:hover .elementor-view-stacked .elementor-icon,
.elementor-element-40c3554 .elementor-widget-icon-box:hover .elementor-icon {
    transform: scale(1.09) rotate(3deg) !important;
}

.elementor-element-40c3554 .elementor-icon svg {
    fill: #ffffff !important;
    width: 32px !important;
    height: 32px !important;
    display: block !important;
    transition: all 0.25s ease !important;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.15)) !important;
}

.elementor-element-40c3554 .elementor-icon-box-title {
    font-family: 'Prompt', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    margin: 0 !important;
    line-height: 1.35 !important;
}

.elementor-element-40c3554 .elementor-icon-box-title a {
    color: var(--pcru-ink) !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

/* --------------------------------------------------------------------------
   INDIVIDUAL VIBRANT CHROMATIC THEMES (12 UNITS)
   -------------------------------------------------------------------------- */

/* 1. คณะครุศาสตร์ (Education) - Royal Sky Blue */
.elementor-element-40c3554 .elementor-element-3a1c612 {
    background: linear-gradient(180deg, #FFFFFF 0%, #EFF6FF 100%) !important;
    border: 1.5px solid #BFDBFE !important;
    box-shadow: 0 4px 16px rgba(29, 78, 216, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-3a1c612::before {
    background: linear-gradient(90deg, #1D4ED8, #60A5FA) !important;
}
.elementor-element-40c3554 .elementor-element-3a1c612 .elementor-icon {
    background: linear-gradient(135deg, #1D4ED8 0%, #3B82F6 100%) !important;
    border: 2px solid #93C5FD !important;
    box-shadow: 0 6px 18px rgba(29, 78, 216, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-3a1c612:hover {
    border-color: #2563EB !important;
    box-shadow: 0 14px 30px rgba(37, 99, 235, 0.18), 0 0 0 1px #2563EB !important;
}
.elementor-element-40c3554 .elementor-element-3a1c612:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-3a1c612:hover .elementor-icon-box-title a {
    color: #1D4ED8 !important;
}

/* 2. คณะวิทยาการจัดการ (Management) - Azure Ocean Cyan */
.elementor-element-40c3554 .elementor-element-7e65dea {
    background: linear-gradient(180deg, #FFFFFF 0%, #F0F9FF 100%) !important;
    border: 1.5px solid #BAE6FD !important;
    box-shadow: 0 4px 16px rgba(2, 132, 199, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-7e65dea::before {
    background: linear-gradient(90deg, #0284C7, #38BDF8) !important;
}
.elementor-element-40c3554 .elementor-element-7e65dea .elementor-icon {
    background: linear-gradient(135deg, #0284C7 0%, #0EA5E9 100%) !important;
    border: 2px solid #7DD3FC !important;
    box-shadow: 0 6px 18px rgba(2, 132, 199, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-7e65dea:hover {
    border-color: #0284C7 !important;
    box-shadow: 0 14px 30px rgba(2, 132, 199, 0.18), 0 0 0 1px #0284C7 !important;
}
.elementor-element-40c3554 .elementor-element-7e65dea:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(2, 132, 199, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-7e65dea:hover .elementor-icon-box-title a {
    color: #0369A1 !important;
}

/* 3. สำนักศิลปะและวัฒนธรรม (Art & Culture) - Ruby Crimson */
.elementor-element-40c3554 .elementor-element-f8bcc8b {
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF1F2 100%) !important;
    border: 1.5px solid #FECDD3 !important;
    box-shadow: 0 4px 16px rgba(190, 18, 60, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-f8bcc8b::before {
    background: linear-gradient(90deg, #BE123C, #FB7185) !important;
}
.elementor-element-40c3554 .elementor-element-f8bcc8b .elementor-icon {
    background: linear-gradient(135deg, #9F1239 0%, #E11D48 100%) !important;
    border: 2px solid #FDA4AF !important;
    box-shadow: 0 6px 18px rgba(190, 18, 60, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-f8bcc8b:hover {
    border-color: #E11D48 !important;
    box-shadow: 0 14px 30px rgba(225, 29, 72, 0.18), 0 0 0 1px #E11D48 !important;
}
.elementor-element-40c3554 .elementor-element-f8bcc8b:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(225, 29, 72, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-f8bcc8b:hover .elementor-icon-box-title a {
    color: #9F1239 !important;
}

/* 4. คณะเทคโนโลยีการเกษตรฯ (Agricultural Tech) - Emerald Forest Green */
.elementor-element-40c3554 .elementor-element-0db0885 {
    background: linear-gradient(180deg, #FFFFFF 0%, #ECFDF5 100%) !important;
    border: 1.5px solid #A7F3D0 !important;
    box-shadow: 0 4px 16px rgba(4, 120, 87, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-0db0885::before {
    background: linear-gradient(90deg, #047857, #34D399) !important;
}
.elementor-element-40c3554 .elementor-element-0db0885 .elementor-icon {
    background: linear-gradient(135deg, #047857 0%, #10B981 100%) !important;
    border: 2px solid #6EE7B7 !important;
    box-shadow: 0 6px 18px rgba(4, 120, 87, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-0db0885:hover {
    border-color: #10B981 !important;
    box-shadow: 0 14px 30px rgba(16, 185, 129, 0.18), 0 0 0 1px #10B981 !important;
}
.elementor-element-40c3554 .elementor-element-0db0885:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(16, 185, 129, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-0db0885:hover .elementor-icon-box-title a {
    color: #065F46 !important;
}

/* 5. คณะวิทยาศาสตร์ฯ (Science) - Golden Amber / Warm Yellow */
.elementor-element-40c3554 .elementor-element-78a1d70 {
    background: linear-gradient(180deg, #FFFFFF 0%, #FFFBEB 100%) !important;
    border: 1.5px solid #FDE68A !important;
    box-shadow: 0 4px 16px rgba(180, 83, 9, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-78a1d70::before {
    background: linear-gradient(90deg, #B45309, #FBBF24) !important;
}
.elementor-element-40c3554 .elementor-element-78a1d70 .elementor-icon {
    background: linear-gradient(135deg, #B45309 0%, #F59E0B 100%) !important;
    border: 2px solid #FCD34D !important;
    box-shadow: 0 6px 18px rgba(180, 83, 9, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-78a1d70:hover {
    border-color: #F59E0B !important;
    box-shadow: 0 14px 30px rgba(245, 158, 11, 0.2), 0 0 0 1px #F59E0B !important;
}
.elementor-element-40c3554 .elementor-element-78a1d70:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(245, 158, 11, 0.5) !important;
}
.elementor-element-40c3554 .elementor-element-78a1d70:hover .elementor-icon-box-title a {
    color: #B45309 !important;
}

/* 6. สำนักวิทยบริการฯ (ARIT) - Royal Indigo / Purple-Blue */
.elementor-element-40c3554 .elementor-element-9076aec {
    background: linear-gradient(180deg, #FFFFFF 0%, #EEF2FF 100%) !important;
    border: 1.5px solid #C7D2FE !important;
    box-shadow: 0 4px 16px rgba(67, 56, 202, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-9076aec::before {
    background: linear-gradient(90deg, #4338CA, #818CF8) !important;
}
.elementor-element-40c3554 .elementor-element-9076aec .elementor-icon {
    background: linear-gradient(135deg, #4338CA 0%, #6366F1 100%) !important;
    border: 2px solid #A5B4FC !important;
    box-shadow: 0 6px 18px rgba(67, 56, 202, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-9076aec:hover {
    border-color: #6366F1 !important;
    box-shadow: 0 14px 30px rgba(99, 102, 241, 0.2), 0 0 0 1px #6366F1 !important;
}
.elementor-element-40c3554 .elementor-element-9076aec:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(99, 102, 241, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-9076aec:hover .elementor-icon-box-title a {
    color: #3730A3 !important;
}

/* 7. คณะพยาบาลศาสตร์ (Nursing) - Lotus Rose Pink */
.elementor-element-40c3554 .elementor-element-cc7443a {
    background: linear-gradient(180deg, #FFFFFF 0%, #FDF2F8 100%) !important;
    border: 1.5px solid #FBCFE8 !important;
    box-shadow: 0 4px 16px rgba(190, 24, 93, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-cc7443a::before {
    background: linear-gradient(90deg, #BE185D, #F472B6) !important;
}
.elementor-element-40c3554 .elementor-element-cc7443a .elementor-icon {
    background: linear-gradient(135deg, #BE185D 0%, #EC4899 100%) !important;
    border: 2px solid #F9A8D4 !important;
    box-shadow: 0 6px 18px rgba(190, 24, 93, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-cc7443a:hover {
    border-color: #EC4899 !important;
    box-shadow: 0 14px 30px rgba(236, 72, 153, 0.2), 0 0 0 1px #EC4899 !important;
}
.elementor-element-40c3554 .elementor-element-cc7443a:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(236, 72, 153, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-cc7443a:hover .elementor-icon-box-title a {
    color: #9D174D !important;
}

/* 8. สำนักงานอธิการบดี (President's Office) - PCRU Royal Purple & Gold */
.elementor-element-40c3554 .elementor-element-d6f0edc {
    background: linear-gradient(180deg, #FFFFFF 0%, #FAF5FF 100%) !important;
    border: 1.5px solid #E9D5FF !important;
    box-shadow: 0 4px 16px rgba(81, 24, 155, 0.1) !important;
}
.elementor-element-40c3554 .elementor-element-d6f0edc::before {
    background: linear-gradient(90deg, #51189B, #F59E0B) !important;
}
.elementor-element-40c3554 .elementor-element-d6f0edc .elementor-icon {
    background: linear-gradient(135deg, #3B0764 0%, #7C3AED 100%) !important;
    border: 2px solid #F59E0B !important;
    box-shadow: 0 6px 18px rgba(81, 24, 155, 0.35) !important;
}
.elementor-element-40c3554 .elementor-element-d6f0edc:hover {
    border-color: #F59E0B !important;
    box-shadow: 0 14px 30px rgba(81, 24, 155, 0.22), 0 0 0 1px #F59E0B !important;
}
.elementor-element-40c3554 .elementor-element-d6f0edc:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(245, 158, 11, 0.5) !important;
}
.elementor-element-40c3554 .elementor-element-d6f0edc:hover .elementor-icon-box-title a {
    color: #51189B !important;
}

/* 9. สถาบันวิจัยและพัฒนา (Research) - Deep Teal / Cyan */
.elementor-element-40c3554 .elementor-element-e0d640a {
    background: linear-gradient(180deg, #FFFFFF 0%, #F0FDFA 100%) !important;
    border: 1.5px solid #99F6E4 !important;
    box-shadow: 0 4px 16px rgba(15, 118, 110, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-e0d640a::before {
    background: linear-gradient(90deg, #0F766E, #2DD4BF) !important;
}
.elementor-element-40c3554 .elementor-element-e0d640a .elementor-icon {
    background: linear-gradient(135deg, #0F766E 0%, #14B8A6 100%) !important;
    border: 2px solid #5EEAD4 !important;
    box-shadow: 0 6px 18px rgba(15, 118, 110, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-e0d640a:hover {
    border-color: #14B8A6 !important;
    box-shadow: 0 14px 30px rgba(20, 184, 166, 0.2), 0 0 0 1px #14B8A6 !important;
}
.elementor-element-40c3554 .elementor-element-e0d640a:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(20, 184, 166, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-e0d640a:hover .elementor-icon-box-title a {
    color: #115E59 !important;
}

/* 10. คณะมนุษยศาสตร์ฯ (Humanities) - Coral Tangerine Orange */
.elementor-element-40c3554 .elementor-element-84f5c11 {
    background: linear-gradient(180deg, #FFFFFF 0%, #FFF7ED 100%) !important;
    border: 1.5px solid #FED7AA !important;
    box-shadow: 0 4px 16px rgba(194, 65, 12, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-84f5c11::before {
    background: linear-gradient(90deg, #C2410C, #FB923C) !important;
}
.elementor-element-40c3554 .elementor-element-84f5c11 .elementor-icon {
    background: linear-gradient(135deg, #C2410C 0%, #F97316 100%) !important;
    border: 2px solid #FDBA74 !important;
    box-shadow: 0 6px 18px rgba(194, 65, 12, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-84f5c11:hover {
    border-color: #F97316 !important;
    box-shadow: 0 14px 30px rgba(249, 115, 22, 0.2), 0 0 0 1px #F97316 !important;
}
.elementor-element-40c3554 .elementor-element-84f5c11:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(249, 115, 22, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-84f5c11:hover .elementor-icon-box-title a {
    color: #9A3412 !important;
}

/* 11. สำนักส่งเสริมวิชาการฯ (Academic Promotion) - Sky Turquoise Blue */
.elementor-element-40c3554 .elementor-element-58fb62f {
    background: linear-gradient(180deg, #FFFFFF 0%, #F0F9FF 100%) !important;
    border: 1.5px solid #BAE6FD !important;
    box-shadow: 0 4px 16px rgba(3, 105, 161, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-58fb62f::before {
    background: linear-gradient(90deg, #0369A1, #38BDF8) !important;
}
.elementor-element-40c3554 .elementor-element-58fb62f .elementor-icon {
    background: linear-gradient(135deg, #0369A1 0%, #0284C7 100%) !important;
    border: 2px solid #7DD3FC !important;
    box-shadow: 0 6px 18px rgba(3, 105, 161, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-58fb62f:hover {
    border-color: #0284C7 !important;
    box-shadow: 0 14px 30px rgba(2, 132, 199, 0.2), 0 0 0 1px #0284C7 !important;
}
.elementor-element-40c3554 .elementor-element-58fb62f:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(2, 132, 199, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-58fb62f:hover .elementor-icon-box-title a {
    color: #075985 !important;
}

/* 12. หน่วยงานอิสระ (Independent Units) - Vivid Plum Amethyst */
.elementor-element-40c3554 .elementor-element-397c377 {
    background: linear-gradient(180deg, #FFFFFF 0%, #FAF5FF 100%) !important;
    border: 1.5px solid #E9D5FF !important;
    box-shadow: 0 4px 16px rgba(107, 33, 168, 0.08) !important;
}
.elementor-element-40c3554 .elementor-element-397c377::before {
    background: linear-gradient(90deg, #6B21A8, #C084FC) !important;
}
.elementor-element-40c3554 .elementor-element-397c377 .elementor-icon {
    background: linear-gradient(135deg, #6B21A8 0%, #9333EA 100%) !important;
    border: 2px solid #D8B4FE !important;
    box-shadow: 0 6px 18px rgba(107, 33, 168, 0.32) !important;
}
.elementor-element-40c3554 .elementor-element-397c377:hover {
    border-color: #9333EA !important;
    box-shadow: 0 14px 30px rgba(147, 51, 234, 0.2), 0 0 0 1px #9333EA !important;
}
.elementor-element-40c3554 .elementor-element-397c377:hover .elementor-icon {
    box-shadow: 0 10px 24px rgba(147, 51, 234, 0.45) !important;
}
.elementor-element-40c3554 .elementor-element-397c377:hover .elementor-icon-box-title a {
    color: #581C87 !important;
}


/* ==========================================================================
   6. CAMUX SLIDER & POST GRIDS (ANWP & ELEMENTOR)
   ========================================================================== */
.elementor-element.elementor-element-cc05c79 {
    max-width: 1360px !important;
    margin: 0 auto 35px auto !important;
    padding: 0 16px !important;
}

/* Slider Enhancements */
.upk-camux-slider-wrap {
    border-radius: 20px !important;
    overflow: hidden !important;
    box-shadow: 0 16px 40px rgba(81, 24, 155, 0.12) !important;
    border: 1.5px solid rgba(124, 58, 237, 0.18) !important;
}

.upk-camux-slider .upk-content {
    background: linear-gradient(180deg, transparent 0%, rgba(30, 6, 59, 0.88) 100%) !important;
    padding: 24px 28px !important;
    border-radius: 0 0 18px 18px !important;
}

.upk-camux-slider .upk-title a {
    font-family: 'Prompt', sans-serif !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    font-size: clamp(1.2rem, 2.2vw, 1.7rem) !important;
    line-height: 1.45 !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
}

/* Section Headings with Royal Left Accent Ribbon */
.elementor-element h2.elementor-heading-title,
.elementor-element h3.elementor-heading-title {
    font-family: 'Prompt', sans-serif !important;
    font-weight: 700 !important;
    font-size: clamp(1.25rem, 2vw, 1.65rem) !important;
    color: var(--pcru-purple-dark) !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    position: relative !important;
    padding-left: 16px !important;
    margin-bottom: 18px !important;
    line-height: 1.35 !important;
}

.elementor-element h2.elementor-heading-title::before,
.elementor-element h3.elementor-heading-title::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 15% !important;
    bottom: 15% !important;
    width: 5px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, var(--pcru-gold) 0%, var(--pcru-purple) 100%) !important;
}

/* AnWP Post Teasers & Faculty Post Grids (Modern Suite Redesign) */
.anwp-pg-widget-header {
    margin: 45px 0 22px 0 !important;
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    padding-left: 16px !important;
}

.anwp-pg-widget-header::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 5px !important;
    height: 28px !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, #51189B 0%, #F59E0B 100%) !important;
}

.anwp-pg-widget-header__title {
    font-family: 'Prompt', sans-serif !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #1E1B4B !important;
    margin: 0 !important;
    padding: 0 !important;
    letter-spacing: -0.2px !important;
    background: transparent !important;
}

.anwp-pg-widget-header-style--b .anwp-pg-widget-header__title {
    background: transparent !important;
}

.anwp-pg-widget-header__secondary-line {
    flex-grow: 1 !important;
    height: 2px !important;
    background: linear-gradient(90deg, rgba(81, 24, 155, 0.25) 0%, rgba(226, 232, 240, 0.4) 100%) !important;
    border: none !important;
    margin-left: 18px !important;
}

/* Post Grid Container Layout */
.anwp-pg-wrap .anwp-row.anwp-pg-posts-wrapper,
.anwp-pg-wrap .anwp-row.anwp-pg-light-grid {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 22px !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
}

@media (max-width: 1024px) {
    .anwp-pg-wrap .anwp-row.anwp-pg-posts-wrapper,
    .anwp-pg-wrap .anwp-row.anwp-pg-light-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }
    .anwp-pg-widget-header {
        margin: 35px 0 18px 0 !important;
    }
    .anwp-pg-widget-header__title {
        font-size: 20px !important;
    }
}

@media (max-width: 640px) {
    .anwp-pg-wrap .anwp-row.anwp-pg-posts-wrapper,
    .anwp-pg-wrap .anwp-row.anwp-pg-light-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }
}

/* Card Teaser Item */
.anwp-pg-wrap .anwp-pg-post-teaser,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e,
.anwp-pg-post-teaser {
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    box-shadow: 0 4px 20px -2px rgba(81, 24, 155, 0.06), 0 2px 6px -1px rgba(0, 0, 0, 0.03) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    position: relative !important;
    height: 100% !important;
    box-sizing: border-box !important;
}

.anwp-pg-wrap .anwp-pg-post-teaser:hover,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e:hover,
.anwp-pg-post-teaser:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 20px 36px -6px rgba(81, 24, 155, 0.16), 0 6px 14px -2px rgba(81, 24, 155, 0.08) !important;
    border-color: rgba(124, 58, 237, 0.4) !important;
}

/* Card Thumbnail Wrapper */
.anwp-pg-wrap .anwp-pg-post-teaser__thumbnail,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e .anwp-pg-post-teaser__thumbnail,
.anwp-pg-post-teaser__thumbnail {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 180px !important;
    min-height: 180px !important;
    max-height: 180px !important;
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(135deg, #F8FAFC 0%, #EEF2FF 100%) !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
    border-radius: 16px 16px 0 0 !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Card Image (Overrides AnWP layout-e 80x80 inline bug) */
.anwp-pg-wrap .anwp-pg-post-teaser__thumbnail-img,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e .anwp-pg-post-teaser__thumbnail-img,
.anwp-pg-wrap .anwp-pg-post-teaser__thumbnail img,
.anwp-pg-post-teaser__thumbnail img {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    transition: transform 0.4s ease !important;
}

.anwp-pg-wrap .anwp-pg-post-teaser:hover .anwp-pg-post-teaser__thumbnail-img,
.anwp-pg-wrap .anwp-pg-post-teaser:hover .anwp-pg-post-teaser__thumbnail img {
    transform: scale(1.06) !important;
}

/* Placeholder image handling */
.anwp-pg-wrap .anwp-pg-post-teaser__thumbnail img[src*="empty_image"] {
    object-fit: contain !important;
    padding: 32px !important;
    opacity: 0.35 !important;
    background: linear-gradient(135deg, #F8FAFC 0%, #EEF2FF 100%) !important;
}

/* Card Content Area */
.anwp-pg-wrap .anwp-pg-post-teaser__content,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e .anwp-pg-post-teaser__content,
.anwp-pg-post-teaser__content {
    padding: 16px 18px 18px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    justify-content: space-between !important;
    background: #ffffff !important;
    border-radius: 0 0 16px 16px !important;
    box-sizing: border-box !important;
}

/* Category Badge */
.anwp-pg-wrap .anwp-pg-post-teaser__top-meta {
    margin-bottom: 8px !important;
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
}

.anwp-pg-wrap .anwp-pg-post-teaser__category-wrapper,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e .anwp-pg-post-teaser__category-wrapper,
.anwp-pg-category__wrapper {
    display: inline-flex !important;
    align-items: center !important;
    padding: 4px 12px !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    border-radius: 999px !important;
    background: #FAF5FF !important;
    color: #51189B !important;
    border: 1px solid #E9D5FF !important;
    box-shadow: none !important;
    margin: 0 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

/* Title (Fixing Thai font clipping and line height) */
.anwp-pg-wrap .anwp-pg-post-teaser__title,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e .anwp-pg-post-teaser__title,
.anwp-pg-post-teaser__title {
    font-family: 'Prompt', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.55 !important;
    color: #1E293B !important;
    margin: 4px 0 12px 0 !important;
    padding: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-height: 3.1em !important;
    max-height: 3.1em !important;
    transition: color 0.2s ease !important;
}

.anwp-pg-wrap .anwp-pg-post-teaser:hover .anwp-pg-post-teaser__title,
.anwp-pg-post-teaser:hover .anwp-pg-post-teaser__title {
    color: #51189B !important;
}

/* Bottom Meta */
.anwp-pg-wrap .anwp-pg-post-teaser__bottom-meta,
.anwp-pg-wrap .anwp-pg-post-teaser--layout-e .anwp-pg-post-teaser__bottom-meta,
.anwp-pg-post-teaser__bottom-meta {
    font-size: 12.5px !important;
    color: #64748B !important;
    border-top: 1px solid #F1F5F9 !important;
    padding: 12px 0 2px 0 !important;
    margin-top: auto !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    overflow: visible !important;
    max-height: none !important;
    line-height: 1.4 !important;
}

.anwp-pg-wrap .anwp-pg-post-teaser__bottom-meta .anwp-pg-updated {
    display: none !important;
}

.anwp-pg-wrap .anwp-pg-post-teaser__bottom-meta-item,
.anwp-pg-post-teaser__bottom-meta-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.anwp-pg-wrap .anwp-pg-post-teaser__bottom-meta svg,
.anwp-pg-post-teaser__bottom-meta svg {
    fill: #7C3AED !important;
    width: 14px !important;
    height: 14px !important;
    flex-shrink: 0 !important;
}

/* Pagination Styling & Precise Centering */
.anwp-pg-pagination-navigation,
nav[aria-label="anwp-pg-pagination-navigation"] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    text-align: center !important;
    margin: 25px auto 40px auto !important;
    padding: 0 !important;
}

.anwp-pg-pagination-navigation .anwp-pg-pagination,
.anwp-pg-pagination {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    margin: 0 auto !important;
    padding: 6px 14px !important;
    background: #ffffff !important;
    border-radius: 999px !important;
    box-shadow: 0 4px 16px rgba(81, 24, 155, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    list-style: none !important;
    float: none !important;
}

.anwp-page-item {
    margin: 0 !important;
    list-style: none !important;
}

.anwp-page-link {
    width: 36px !important;
    height: 36px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #475569 !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.anwp-page-link:hover:not(.anwp-page-link--disabled):not(.anwp-page-link--active) {
    background: #F1F5F9 !important;
    color: #51189B !important;
    transform: scale(1.08) !important;
}

.anwp-page-link--active {
    background: linear-gradient(135deg, #51189B 0%, #7C3AED 100%) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(81, 24, 155, 0.35) !important;
}

.anwp-page-link--disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

/* ==========================================================================
   7. SINGLE POST / ARTICLE BEAUTIFICATION & COLIBRI INTEGRATION
   ========================================================================== */
article.post,
.single-post article,
.page-template-default article,
.single-post .colibri-single-post-loop > .post,
.single-post .colibri-single-post-loop .masonry-item {
    background: #ffffff !important;
    border: 1px solid rgba(233, 213, 255, 0.85) !important;
    border-radius: 20px !important;
    box-shadow: 0 12px 36px rgba(81, 24, 155, 0.08) !important;
    padding: clamp(20px, 4vw, 42px) !important;
    margin: 25px auto 45px auto !important;
    max-width: 1100px !important;
}

.single-post .colibri-post-content {
    color: var(--pcru-slate) !important;
    font-size: 16px !important;
    line-height: 1.85 !important;
}

article h1, article h2, article h3,
.single-post h1, .single-post h2, .single-post h3,
.single-post .elementor-heading-title {
    font-family: 'Prompt', sans-serif !important;
    color: var(--pcru-purple-dark) !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
}

article img,
.single-post img,
.colibri-post-content img {
    border-radius: 12px !important;
    max-width: 100% !important;
    height: auto !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08) !important;
}

/* Category Badges on Single Post */
.colibri-post-category {
    background: linear-gradient(135deg, #FEF3C7 0%, #FDE68A 100%) !important;
    color: #92400E !important;
    border: 1px solid #FCD34D !important;
    padding: 6px 14px !important;
    border-radius: 999px !important;
    font-family: 'Prompt', sans-serif !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    box-shadow: 0 2px 6px rgba(217, 119, 6, 0.12) !important;
    margin-right: 8px !important;
    margin-bottom: 8px !important;
    text-decoration: none !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.colibri-post-category:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(217, 119, 6, 0.22) !important;
    color: #78350F !important;
}

/* Tags on Single Post */
.colibri-post-tag {
    display: inline-flex !important;
    align-items: center !important;
    background: rgba(81, 24, 155, 0.06) !important;
    color: var(--pcru-purple) !important;
    border: 1px solid rgba(81, 24, 155, 0.18) !important;
    padding: 4px 12px !important;
    border-radius: 999px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    margin: 4px 6px 4px 0 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.colibri-post-tag:hover {
    background: var(--pcru-purple) !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(81, 24, 155, 0.25) !important;
    border-color: var(--pcru-purple) !important;
}

/* Post Navigation Buttons */
.post-nav-button a,
.navigation.post-navigation a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #ffffff !important;
    border: 1.5px solid rgba(233, 213, 255, 0.9) !important;
    border-radius: 12px !important;
    padding: 10px 18px !important;
    color: var(--pcru-purple) !important;
    font-family: 'Prompt', sans-serif !important;
    font-weight: 600 !important;
    font-size: 13.5px !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(81, 24, 155, 0.05) !important;
    transition: all 0.22s ease !important;
}

.post-nav-button a:hover,
.navigation.post-navigation a:hover {
    background: linear-gradient(135deg, var(--pcru-purple) 0%, var(--pcru-purple-dark) 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(81, 24, 155, 0.25) !important;
}

/* ==========================================================================
   8. FOOTER CLEANUP: SUPPRESS COLIBRI DEFAULTS & OLD WIDGETS
   ========================================================================== */
.page-footer,
.colibri-footer,
footer.footer,
.site-footer,
#footer,
.h-section#footer,
.offscreen-footer,
.h-ui-empty-state-container,
#mvcwid,
#wpsvctable,
.fscb-share-container {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ==========================================================================
   9. PCRU OFFICIAL FOOTER BUILDER (ASTRA SUITE COMPATIBLE)
   ========================================================================== */
.pcru-footer-builder,
.pw-footer-builder {
    position: relative !important;
    background: linear-gradient(180deg, #16042B 0%, #1E063B 50%, #120224 100%) !important;
    color: #e2d9f3 !important;
    border-top: 4px solid var(--pcru-gold) !important;
    box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.2) !important;
    padding: 56px 0 28px !important;
    margin-top: 50px !important;
    box-sizing: border-box !important;
}

.pcru-footer-builder::before,
.pw-footer-builder::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 1px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(253, 230, 138, 0.6) 50%, transparent 100%) !important;
    z-index: 2 !important;
}

.pcru-footer-builder__inner,
.pw-footer-builder__inner {
    max-width: 1360px !important;
    width: min(100% - 40px, 1360px) !important;
    margin: 0 auto !important;
    position: relative !important;
    z-index: 3 !important;
}

.pcru-footer-builder__grid,
.pw-footer-builder__grid {
    display: grid !important;
    gap: 30px !important;
}

.pcru-footer-builder__grid.cols-4,
.pw-footer-builder__grid.cols-4 {
    grid-template-columns: 1.3fr 1fr 1.2fr 1.1fr !important;
}

@media (max-width: 1024px) {
    .pcru-footer-builder__grid.cols-4,
    .pw-footer-builder__grid.cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 24px !important;
    }
}

@media (max-width: 640px) {
    .pcru-footer-builder__grid.cols-4,
    .pw-footer-builder__grid.cols-4 {
        grid-template-columns: 1fr !important;
        gap: 20px !important;
    }
}

.pcru-footer-builder__card,
.pw-footer-builder__card {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 16px !important;
    padding: 24px 22px !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease !important;
}

.pcru-footer-builder__card:hover,
.pw-footer-builder__card:hover {
    border-color: rgba(245, 158, 11, 0.35) !important;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25) !important;
    transform: translateY(-2px) !important;
}

.pcru-footer-builder__card h4,
.pw-footer-builder__card h4 {
    font-family: 'Prompt', sans-serif !important;
    font-size: 16.5px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 0 16px 0 !important;
    padding-bottom: 10px !important;
    border-bottom: 1.5px solid rgba(245, 158, 11, 0.4) !important;
    position: relative !important;
}

.pcru-footer-builder__card p,
.pw-footer-builder__card p {
    font-size: 13.5px !important;
    line-height: 1.7 !important;
    color: rgba(255, 255, 255, 0.82) !important;
    margin-bottom: 8px !important;
}

.pcru-footer-builder__list,
.pw-footer-builder__list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.pcru-footer-builder__list li,
.pw-footer-builder__list li {
    margin-bottom: 8px !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}

.pcru-footer-builder__list a,
.pw-footer-builder__list a {
    color: rgba(255, 255, 255, 0.82) !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.pcru-footer-builder__list a:hover,
.pw-footer-builder__list a:hover {
    color: var(--pcru-gold) !important;
    padding-left: 4px !important;
}

.pcru-footer-builder__button,
.pw-footer-builder__button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 18px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--pcru-purple) 0%, var(--pcru-gold) 100%) !important;
    color: #ffffff !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    box-shadow: 0 6px 16px rgba(81, 24, 155, 0.25) !important;
    transition: all 0.2s ease !important;
}

.pcru-footer-builder__button:hover,
.pw-footer-builder__button:hover {
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(245, 158, 11, 0.35) !important;
}

.pcru-footer-builder__bottom,
.pw-footer-builder__bottom {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-top: 24px !important;
    margin-top: 28px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.12) !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    font-size: 13px !important;
    color: rgba(255, 255, 255, 0.65) !important;
}

/* ==========================================================================
   10. MOBILE FIRST: OFF-CANVAS FULL-SCREEN DRAWER & BOTTOM BAR
   ========================================================================== */
.pcru-legal-mobile-drawer,
.pcru-mobile-bottom-nav {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

@media (max-width: 991px) {
    /* Floating button position lift on mobile */
    .sec-float-hub {
        bottom: calc(75px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .pcru-legal-mobile-drawer {
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        z-index: 99999999 !important;
        pointer-events: none !important;
        visibility: hidden !important;
        transition: visibility 0.3s ease !important;
    }

    .pcru-legal-mobile-drawer.pcru-drawer-active,
    .pcru-legal-mobile-drawer.pcru-drawer-open {
        pointer-events: auto !important;
        visibility: visible !important;
    }

    .pcru-drawer-backdrop {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: rgba(15, 23, 42, 0.65) !important;
        backdrop-filter: blur(8px) !important;
        -webkit-backdrop-filter: blur(8px) !important;
        opacity: 0 !important;
        transition: opacity 0.3s ease !important;
    }

    .pcru-legal-mobile-drawer.pcru-drawer-active .pcru-drawer-backdrop,
    .pcru-legal-mobile-drawer.pcru-drawer-open .pcru-drawer-backdrop {
        opacity: 1 !important;
    }

    .pcru-drawer-panel {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        min-width: 100vw !important;
        max-width: 100vw !important;
        height: 100vh !important;
        min-height: 100vh !important;
        background: #ffffff !important;
        display: flex !important;
        flex-direction: column !important;
        transform: translateX(100%) !important;
        transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
        overflow: hidden !important;
        z-index: 100000000 !important;
    }

    .pcru-legal-mobile-drawer.pcru-drawer-active .pcru-drawer-panel,
    .pcru-legal-mobile-drawer.pcru-drawer-open .pcru-drawer-panel {
        transform: translateX(0) !important;
    }

    .pcru-drawer-header {
        padding: 16px 20px !important;
        padding-top: calc(16px + env(safe-area-inset-top, 0px)) !important;
        background: linear-gradient(135deg, #3b0764 0%, #51189b 100%) !important;
        color: #ffffff !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        border-bottom: 2.5px solid #f59e0b !important;
    }

    .pcru-drawer-brand {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
    }

    .pcru-drawer-badge {
        width: 40px !important;
        height: 40px !important;
        border-radius: 12px !important;
        background: rgba(255, 255, 255, 0.15) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 18px !important;
        color: #fbbf24 !important;
    }

    .pcru-drawer-titles {
        display: flex !important;
        flex-direction: column !important;
        line-height: 1.25 !important;
    }

    .pcru-drawer-titles strong {
        font-family: 'Prompt', sans-serif !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        color: #ffffff !important;
    }

    .pcru-drawer-titles small {
        font-family: 'Prompt', 'Sarabun', sans-serif !important;
        font-size: 11.5px !important;
        color: #e9d5ff !important;
    }

    button#pcru-drawer-close-btn {
        width: auto !important;
        min-width: 60px !important;
        height: 38px !important;
        padding: 0 14px 0 10px !important;
        margin: 0 !important;
        gap: 6px !important;
        flex-shrink: 0 !important;
        box-sizing: border-box !important;
        border-radius: 999px !important;
        background: rgba(255, 255, 255, 0.18) !important;
        border: 1.5px solid rgba(255, 255, 255, 0.45) !important;
        color: #ffffff !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        line-height: 1 !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
    }

    button#pcru-drawer-close-btn:hover,
    button#pcru-drawer-close-btn:active {
        background: #ef4444 !important;
        border-color: #ef4444 !important;
    }

    .pcru-drawer-close-label {
        font-family: 'Prompt', sans-serif !important;
        font-size: 13.5px !important;
        font-weight: 600 !important;
        color: #ffffff !important;
    }

    .pcru-drawer-body {
        flex: 1 !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 16px 14px 60px 14px !important;
    }

    .pcru-drawer-menu-list {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 0 20px 0 !important;
    }

    .pcru-drawer-menu-list li {
        margin-bottom: 6px !important;
    }

    .pcru-drawer-menu-list li a {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        padding: 12px 16px !important;
        border-radius: 12px !important;
        background: #f8fafc !important;
        border: 1px solid #f1f5f9 !important;
        color: #1e293b !important;
        text-decoration: none !important;
        font-family: 'Prompt', sans-serif !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        transition: all 0.2s ease !important;
    }

    .pcru-drawer-menu-list li a i {
        font-size: 16px !important;
        color: var(--pcru-purple) !important;
        width: 20px !important;
        text-align: center !important;
    }

    .pcru-drawer-menu-list li a:hover,
    .pcru-drawer-menu-list li a:active {
        background: #f3e8ff !important;
        border-color: #d8b4fe !important;
        color: var(--pcru-purple-dark) !important;
        transform: translateX(4px) !important;
    }

    .pcru-drawer-menu-list li.menu-divider {
        padding: 12px 6px 6px !important;
        border-top: 1px dashed #e2e8f0 !important;
        margin-top: 10px !important;
    }

    .pcru-drawer-menu-list li.menu-divider .divider-label {
        font-family: 'Prompt', sans-serif !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        color: #94a3b8 !important;
    }

    .pcru-drawer-contact-card {
        padding: 18px !important;
        border-radius: 14px !important;
        background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%) !important;
        border: 1.5px solid #e9d5ff !important;
        margin-top: 16px !important;
    }

    .pcru-drawer-contact-card .card-head {
        font-family: 'Prompt', sans-serif !important;
        font-weight: 700 !important;
        font-size: 13.5px !important;
        color: var(--pcru-purple-dark) !important;
        margin-bottom: 8px !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .pcru-drawer-contact-card p {
        font-size: 12.5px !important;
        color: #475569 !important;
        margin: 4px 0 !important;
        line-height: 1.5 !important;
    }

    .pcru-drawer-contact-card a {
        color: var(--pcru-purple) !important;
        text-decoration: underline !important;
        font-weight: 600 !important;
    }

    /* Mobile Bottom Navigation Bar */
    .pcru-mobile-bottom-nav {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        visibility: visible !important;
        pointer-events: auto !important;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        height: calc(60px + env(safe-area-inset-bottom, 0px)) !important;
        padding-bottom: env(safe-area-inset-bottom, 0px) !important;
        background: rgba(255, 255, 255, 0.96) !important;
        backdrop-filter: blur(16px) !important;
        -webkit-backdrop-filter: blur(16px) !important;
        border-top: 1.5px solid rgba(233, 213, 255, 0.85) !important;
        box-shadow: 0 -4px 20px rgba(81, 24, 155, 0.08) !important;
        z-index: 99998 !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding-left: 2px !important;
        padding-right: 2px !important;
        box-sizing: border-box !important;
    }

    .pcru-mobile-bottom-nav a {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        flex: 1 1 0 !important;
        min-width: 0 !important;
        max-width: 20% !important;
        color: #64748b !important;
        text-decoration: none !important;
        font-family: 'Prompt', sans-serif !important;
        font-size: 10.5px !important;
        font-weight: 500 !important;
        padding: 4px 1px !important;
        border-radius: 8px !important;
        transition: all 0.2s ease !important;
        box-sizing: border-box !important;
    }

    .pcru-mobile-bottom-nav a {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 2px !important;
        flex: 1 1 0 !important;
        min-width: 0 !important;
        color: #64748b !important;
        text-decoration: none !important;
        font-family: 'Prompt', sans-serif !important;
        font-size: 10.5px !important;
        font-weight: 500 !important;
        padding: 4px 2px !important;
        border-radius: 8px !important;
        transition: all 0.2s ease !important;
    }

    .pcru-mobile-bottom-nav a i {
        font-size: 18px !important;
        color: var(--pcru-purple) !important;
        transition: transform 0.2s ease !important;
    }

    .pcru-mobile-bottom-nav a.active,
    .pcru-mobile-bottom-nav a:hover {
        color: var(--pcru-purple) !important;
        font-weight: 600 !important;
    }

    .pcru-mobile-bottom-nav a.active i {
        color: var(--pcru-gold) !important;
        transform: scale(1.1) !important;
    }
}

/* ==========================================================================
   11. PCRU SOCIAL SHARE ENHANCEMENT
   ========================================================================== */
.pcru-social-share-container {
    margin: 32px 0 20px !important;
    padding: 20px 24px !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    border: 1.5px solid #e9d5ff !important;
    box-shadow: 0 4px 18px rgba(81, 24, 155, 0.06) !important;
}

.pcru-social-share-heading {
    font-family: 'Prompt', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--pcru-purple-dark) !important;
    margin-bottom: 12px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

/* ==========================================================================
   8. PCRU e-PORTFOLIO REDESIGNED PORTAL FEED (COMPACT CHROMATIC SUITE)
   ========================================================================== */

/* Eliminate loose default section padding */
.page-content.colibri-page-content,
.h-section-global-spacing {
    padding-top: 10px !important;
    padding-bottom: 20px !important;
}

.pcru-portal-wrapper {
    max-width: 1180px !important;
    margin: 10px auto 40px auto !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
}

/* Category Filter Box (Compact) */
.pcru-filter-card {
    background: #FAF8FD !important;
    border: 1px solid rgba(233, 213, 255, 0.75) !important;
    border-radius: 20px !important;
    padding: 16px 20px !important;
    margin-bottom: 14px !important;
    box-shadow: 0 4px 18px -2px rgba(81, 24, 155, 0.04) !important;
}

.pcru-filter-header {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 16.5px !important;
    font-weight: 700 !important;
    color: #51189B !important;
    margin-bottom: 12px !important;
}

.pcru-filter-header i {
    font-size: 15px !important;
    color: #7C3AED !important;
}

.pcru-filter-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 7px 9px !important;
    align-items: center !important;
}

.pcru-pill-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 6px 13px !important;
    border-radius: 999px !important;
    border: 1.5px solid #E2E8F0 !important;
    background: #ffffff !important;
    color: #334155 !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    text-decoration: none !important;
    line-height: 1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

.pcru-pill-btn i {
    color: #7C3AED !important;
    font-size: 12px !important;
    transition: color 0.2s ease !important;
}

.pcru-pill-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 22px !important;
    height: 20px !important;
    padding: 0 6px !important;
    border-radius: 999px !important;
    background: #F1F5F9 !important;
    color: #475569 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    margin-left: 2px !important;
    transition: all 0.2s ease !important;
}

.pcru-pill-btn:hover:not(.active) {
    border-color: #C084FC !important;
    background: #FAF5FF !important;
    color: #51189B !important;
    transform: translateY(-2px) !important;
}

.pcru-pill-btn.active {
    background: linear-gradient(135deg, #51189B 0%, #7C3AED 100%) !important;
    color: #ffffff !important;
    border-color: #51189B !important;
    box-shadow: 0 5px 14px rgba(81, 24, 155, 0.25) !important;
}

.pcru-pill-btn.active i {
    color: #ffffff !important;
}

.pcru-pill-btn.active .pcru-pill-badge {
    background: rgba(255, 255, 255, 0.25) !important;
    color: #ffffff !important;
}

/* CTA Stats Pill */
.pcru-pill-btn-cta {
    background: linear-gradient(90deg, #51189B 0%, #9333EA 50%, #B45309 100%) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 14px rgba(81, 24, 155, 0.25) !important;
    margin-left: auto !important;
}

.pcru-pill-btn-cta i {
    color: #FDE68A !important;
}

.pcru-pill-badge-cta {
    background: #ffffff !important;
    color: #51189B !important;
    padding: 3px 8px !important;
    border-radius: 999px !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
}

.pcru-pill-badge-cta i {
    color: #51189B !important;
    font-size: 9px !important;
}

.pcru-pill-btn-cta:hover {
    box-shadow: 0 6px 18px rgba(81, 24, 155, 0.35) !important;
    transform: translateY(-2px) !important;
    color: #ffffff !important;
}

/* Search Bar (Compact) */
.pcru-search-container {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 12px !important;
}

.pcru-search-box {
    flex-grow: 1 !important;
    position: relative !important;
}

.pcru-search-input {
    width: 100% !important;
    height: 46px !important;
    padding: 0 20px !important;
    border-radius: 999px !important;
    border: 1.5px solid #E2E8F0 !important;
    background: #ffffff !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 14px !important;
    color: #1E293B !important;
    outline: none !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.2s ease !important;
    box-sizing: border-box !important;
}

.pcru-search-input:focus {
    border-color: #7C3AED !important;
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.12) !important;
}

.pcru-btn-search {
    height: 46px !important;
    padding: 0 26px !important;
    border-radius: 999px !important;
    border: none !important;
    background: #51189B !important;
    color: #ffffff !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
}

.pcru-btn-search:hover {
    background: #6B21A8 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(81, 24, 155, 0.25) !important;
}

.pcru-btn-clear {
    height: 46px !important;
    padding: 0 22px !important;
    border-radius: 999px !important;
    border: 1.5px solid #E2E8F0 !important;
    background: #ffffff !important;
    color: #64748B !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
}

.pcru-btn-clear:hover {
    background: #F8FAFC !important;
    color: #334155 !important;
    border-color: #CBD5E1 !important;
}

/* Count Bar (Compact) */
.pcru-count-bar {
    background: #ffffff !important;
    border: 1px solid rgba(226, 232, 240, 0.85) !important;
    border-radius: 12px !important;
    padding: 9px 18px !important;
    margin-bottom: 14px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 13.5px !important;
    color: #64748B !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.02) !important;
}

.pcru-count-bar strong {
    color: #51189B !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

/* Article Feed Container (Modern Multi-Column Grid) */
.pcru-feed-container {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    margin-bottom: 28px !important;
    transition: opacity 0.25s ease !important;
}

.pcru-feed-container.pcru-loading {
    opacity: 0.45 !important;
    pointer-events: none !important;
}

@media (max-width: 1024px) {
    .pcru-feed-container {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
    }
}

@media (max-width: 640px) {
    .pcru-feed-container {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
}

/* Article Cards (Grid Mode - Equal Height & Polish) */
article.pcru-article-card,
.pcru-feed-container article.pcru-article-card,
.pcru-article-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
    background: #ffffff !important;
    border-radius: 18px !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    box-shadow: 0 4px 18px -2px rgba(81, 24, 155, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.02) !important;
    overflow: hidden !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
}

article.pcru-article-card:hover,
.pcru-article-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 16px 32px -6px rgba(81, 24, 155, 0.14) !important;
    border-color: rgba(124, 58, 237, 0.35) !important;
}

/* Card Thumbnail Wrap (Top 16:9 Ratio with Rounded Top Corners) */
.pcru-feed-container .pcru-card-thumb-wrap,
.pcru-card-thumb-wrap {
    flex: none !important;
    width: 100% !important;
    height: 190px !important;
    border-radius: 18px 18px 0 0 !important;
    overflow: hidden !important;
    background: #F1F5F9 !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
}

.pcru-card-thumb-wrap a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.pcru-feed-container .pcru-card-img,
.pcru-card-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transition: transform 0.4s ease !important;
}

.pcru-article-card:hover .pcru-card-img {
    transform: scale(1.05) !important;
}

.pcru-thumb-empty {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #F8FAFC 0%, #EEF2FF 100%) !important;
    color: #94A3B8 !important;
    font-size: 38px !important;
}

/* Card Content Body (Flex Grow to align footers) */
.pcru-card-body {
    padding: 16px 18px 18px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    justify-content: space-between !important;
    gap: 10px !important;
}

.pcru-card-badges {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    flex-wrap: wrap !important;
    margin-bottom: 2px !important;
}

.pcru-badge-cat {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 3px 11px !important;
    border-radius: 999px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    background: #FAF5FF !important;
    color: #51189B !important;
    border: 1px solid #E9D5FF !important;
}

.pcru-badge-cat i {
    font-size: 10px !important;
    color: #7C3AED !important;
}

.pcru-badge-date {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 3px 11px !important;
    border-radius: 999px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    background: #FFFBEB !important;
    color: #B45309 !important;
    border: 1px solid #FDE68A !important;
}

.pcru-badge-date i {
    font-size: 10px !important;
    color: #D97706 !important;
}

.pcru-card-title {
    font-family: 'Prompt', sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    margin: 2px 0 6px 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    min-height: 3em !important;
    color: #1E293B !important;
}

.pcru-card-title a {
    color: #1E293B !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.pcru-card-title a:hover {
    color: #51189B !important;
}

.pcru-card-footer {
    margin-top: auto !important;
    padding-top: 10px !important;
    border-top: 1px solid #F1F5F9 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

.pcru-btn-read {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 6px 16px !important;
    border-radius: 999px !important;
    background: #51189B !important;
    color: #ffffff !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.pcru-btn-read:hover {
    background: #6B21A8 !important;
    transform: translateX(3px) !important;
    color: #ffffff !important;
}

.pcru-no-results {
    grid-column: 1 / -1 !important;
    text-align: center !important;
    padding: 50px 20px !important;
    background: #ffffff !important;
    border-radius: 16px !important;
    border: 1px solid #E2E8F0 !important;
    color: #94A3B8 !important;
    font-family: 'Prompt', sans-serif !important;
}

.pcru-no-results i {
    font-size: 42px !important;
    margin-bottom: 12px !important;
    color: #CBD5E1 !important;
}

.pcru-no-results p {
    font-size: 16px !important;
    color: #64748B !important;
    margin: 0 !important;
}

/* Centered Pagination (Compact) */
.pcru-pagination-nav {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 25px 0 40px 0 !important;
    width: 100% !important;
}

.pcru-pag-list {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    background: #ffffff !important;
    padding: 5px 12px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    box-shadow: 0 3px 12px rgba(81, 24, 155, 0.06) !important;
    list-style: none !important;
    margin: 0 !important;
}

.pcru-pag-list li {
    margin: 0 !important;
    list-style: none !important;
}

.pcru-pag-btn {
    width: 35px !important;
    height: 35px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #475569 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.pcru-pag-btn:hover:not(.active):not(.disabled) {
    background: #F1F5F9 !important;
    color: #51189B !important;
    transform: scale(1.08) !important;
}

.pcru-pag-btn.active {
    background: linear-gradient(135deg, #51189B 0%, #7C3AED 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(81, 24, 155, 0.35) !important;
}

.pcru-pag-btn.disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

.pcru-pag-dots {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px !important;
    color: #94A3B8 !important;
    font-weight: 700 !important;
}

/* Mobile Responsive (Compact) */
@media (max-width: 768px) {
    .pcru-portal-wrapper {
        margin: 10px auto 30px auto !important;
        padding: 0 12px !important;
    }
    .pcru-filter-card {
        padding: 14px 14px !important;
        border-radius: 16px !important;
    }
    .pcru-filter-header {
        font-size: 15.5px !important;
        margin-bottom: 10px !important;
    }
    .pcru-pill-btn {
        font-size: 12px !important;
        padding: 6px 11px !important;
    }
    .pcru-pill-btn-cta {
        margin-left: 0 !important;
        width: 100% !important;
        justify-content: center !important;
    }
    .pcru-search-container {
        flex-direction: column !important;
        gap: 8px !important;
    }
    .pcru-search-box, .pcru-btn-search, .pcru-btn-clear {
        width: 100% !important;
        justify-content: center !important;
        height: 44px !important;
    }
    /* Handled by modern responsive grid */
}

/* ==========================================================================
   9. FACULTY CHROMATIC BADGES & PILLS COLOR SYSTEM
   ========================================================================== */

/* 1. คณะครุศาสตร์ (Education) - Sky Sapphire Blue */
.pcru-pill-btn[data-cat-id="3"] { border-color: #BFDBFE !important; }
.pcru-pill-btn[data-cat-id="3"] i { color: #2563EB !important; }
.pcru-pill-btn[data-cat-id="3"] .pcru-pill-badge { background: #EFF6FF !important; color: #1D4ED8 !important; }
.pcru-pill-btn[data-cat-id="3"]:hover:not(.active) { background: #EFF6FF !important; border-color: #3B82F6 !important; }
.pcru-pill-btn[data-cat-id="3"].active { background: linear-gradient(135deg, #1D4ED8 0%, #3B82F6 100%) !important; border-color: #1D4ED8 !important; }
.pcru-badge-cat.pcru-cat-3 { background: #EFF6FF !important; color: #1D4ED8 !important; border-color: #BFDBFE !important; }
.pcru-badge-cat.pcru-cat-3 i { color: #2563EB !important; }

/* 2. คณะวิทยาการจัดการ (Management) - Azure Ocean Cyan */
.pcru-pill-btn[data-cat-id="14"] { border-color: #BAE6FD !important; }
.pcru-pill-btn[data-cat-id="14"] i { color: #0284C7 !important; }
.pcru-pill-btn[data-cat-id="14"] .pcru-pill-badge { background: #F0F9FF !important; color: #0369A1 !important; }
.pcru-pill-btn[data-cat-id="14"]:hover:not(.active) { background: #F0F9FF !important; border-color: #0284C7 !important; }
.pcru-pill-btn[data-cat-id="14"].active { background: linear-gradient(135deg, #0284C7 0%, #0EA5E9 100%) !important; border-color: #0284C7 !important; }
.pcru-badge-cat.pcru-cat-14 { background: #F0F9FF !important; color: #0369A1 !important; border-color: #BAE6FD !important; }
.pcru-badge-cat.pcru-cat-14 i { color: #0284C7 !important; }

/* 3. สำนักศิลปะและวัฒนธรรม (Culture) - Ruby Crimson */
.pcru-pill-btn[data-cat-id="36"] { border-color: #FECDD3 !important; }
.pcru-pill-btn[data-cat-id="36"] i { color: #E11D48 !important; }
.pcru-pill-btn[data-cat-id="36"] .pcru-pill-badge { background: #FFF1F2 !important; color: #BE123C !important; }
.pcru-pill-btn[data-cat-id="36"]:hover:not(.active) { background: #FFF1F2 !important; border-color: #E11D48 !important; }
.pcru-pill-btn[data-cat-id="36"].active { background: linear-gradient(135deg, #BE123C 0%, #FB7185 100%) !important; border-color: #BE123C !important; }
.pcru-badge-cat.pcru-cat-36 { background: #FFF1F2 !important; color: #BE123C !important; border-color: #FECDD3 !important; }
.pcru-badge-cat.pcru-cat-36 i { color: #E11D48 !important; }

/* 4. คณะเทคโนโลยีการเกษตรฯ (Agri Tech) - Emerald Forest Green */
.pcru-pill-btn[data-cat-id="4"] { border-color: #A7F3D0 !important; }
.pcru-pill-btn[data-cat-id="4"] i { color: #059669 !important; }
.pcru-pill-btn[data-cat-id="4"] .pcru-pill-badge { background: #ECFDF5 !important; color: #047857 !important; }
.pcru-pill-btn[data-cat-id="4"]:hover:not(.active) { background: #ECFDF5 !important; border-color: #059669 !important; }
.pcru-pill-btn[data-cat-id="4"].active { background: linear-gradient(135deg, #047857 0%, #10B981 100%) !important; border-color: #047857 !important; }
.pcru-badge-cat.pcru-cat-4 { background: #ECFDF5 !important; color: #047857 !important; border-color: #A7F3D0 !important; }
.pcru-badge-cat.pcru-cat-4 i { color: #059669 !important; }

/* 5. คณะวิทยาศาสตร์และเทคโนโลยี (Science) - Golden Amber */
.pcru-pill-btn[data-cat-id="9"] { border-color: #FDE68A !important; }
.pcru-pill-btn[data-cat-id="9"] i { color: #D97706 !important; }
.pcru-pill-btn[data-cat-id="9"] .pcru-pill-badge { background: #FFFBEB !important; color: #B45309 !important; }
.pcru-pill-btn[data-cat-id="9"]:hover:not(.active) { background: #FFFBEB !important; border-color: #D97706 !important; }
.pcru-pill-btn[data-cat-id="9"].active { background: linear-gradient(135deg, #B45309 0%, #F59E0B 100%) !important; border-color: #B45309 !important; }
.pcru-badge-cat.pcru-cat-9 { background: #FFFBEB !important; color: #B45309 !important; border-color: #FDE68A !important; }
.pcru-badge-cat.pcru-cat-9 i { color: #D97706 !important; }

/* 6. สำนักวิทยบริการฯ (ARIT) - Royal Indigo */
.pcru-pill-btn[data-cat-id="5"] { border-color: #C7D2FE !important; }
.pcru-pill-btn[data-cat-id="5"] i { color: #4F46E5 !important; }
.pcru-pill-btn[data-cat-id="5"] .pcru-pill-badge { background: #EEF2FF !important; color: #3730A3 !important; }
.pcru-pill-btn[data-cat-id="5"]:hover:not(.active) { background: #EEF2FF !important; border-color: #4F46E5 !important; }
.pcru-pill-btn[data-cat-id="5"].active { background: linear-gradient(135deg, #4338CA 0%, #6366F1 100%) !important; border-color: #4338CA !important; }
.pcru-badge-cat.pcru-cat-5 { background: #EEF2FF !important; color: #3730A3 !important; border-color: #C7D2FE !important; }
.pcru-badge-cat.pcru-cat-5 i { color: #4F46E5 !important; }

/* 7. คณะพยาบาลศาสตร์ (Nursing) - Lotus Rose Pink */
.pcru-pill-btn[data-cat-id="32"] { border-color: #FBCFE8 !important; }
.pcru-pill-btn[data-cat-id="32"] i { color: #DB2777 !important; }
.pcru-pill-btn[data-cat-id="32"] .pcru-pill-badge { background: #FDF2F8 !important; color: #9D174D !important; }
.pcru-pill-btn[data-cat-id="32"]:hover:not(.active) { background: #FDF2F8 !important; border-color: #DB2777 !important; }
.pcru-pill-btn[data-cat-id="32"].active { background: linear-gradient(135deg, #BE185D 0%, #EC4899 100%) !important; border-color: #BE185D !important; }
.pcru-badge-cat.pcru-cat-32 { background: #FDF2F8 !important; color: #9D174D !important; border-color: #FBCFE8 !important; }
.pcru-badge-cat.pcru-cat-32 i { color: #DB2777 !important; }

/* 8. สำนักงานอธิการบดี (Office of the President) - PCRU Royal Purple */
.pcru-pill-btn[data-cat-id="34"] { border-color: #E9D5FF !important; }
.pcru-pill-btn[data-cat-id="34"] i { color: #7C3AED !important; }
.pcru-pill-btn[data-cat-id="34"] .pcru-pill-badge { background: #FAF5FF !important; color: #51189B !important; }
.pcru-pill-btn[data-cat-id="34"]:hover:not(.active) { background: #FAF5FF !important; border-color: #7C3AED !important; }
.pcru-pill-btn[data-cat-id="34"].active { background: linear-gradient(135deg, #51189B 0%, #7C3AED 100%) !important; border-color: #51189B !important; }
.pcru-badge-cat.pcru-cat-34 { background: #FAF5FF !important; color: #51189B !important; border-color: #E9D5FF !important; }
.pcru-badge-cat.pcru-cat-34 i { color: #7C3AED !important; }

/* 9. สถาบันวิจัยและพัฒนา (Research) - Deep Teal */
.pcru-pill-btn[data-cat-id="37"] { border-color: #99F6E4 !important; }
.pcru-pill-btn[data-cat-id="37"] i { color: #0D9488 !important; }
.pcru-pill-btn[data-cat-id="37"] .pcru-pill-badge { background: #F0FDFA !important; color: #0F766E !important; }
.pcru-pill-btn[data-cat-id="37"]:hover:not(.active) { background: #F0FDFA !important; border-color: #0D9488 !important; }
.pcru-pill-btn[data-cat-id="37"].active { background: linear-gradient(135deg, #0F766E 0%, #14B8A6 100%) !important; border-color: #0F766E !important; }
.pcru-badge-cat.pcru-cat-37 { background: #F0FDFA !important; color: #0F766E !important; border-color: #99F6E4 !important; }
.pcru-badge-cat.pcru-cat-37 i { color: #0D9488 !important; }

/* 10. คณะมนุษยศาสตร์และสังคมศาสตร์ (Humanities) - Coral Tangerine Orange */
.pcru-pill-btn[data-cat-id="33"] { border-color: #FED7AA !important; }
.pcru-pill-btn[data-cat-id="33"] i { color: #EA580C !important; }
.pcru-pill-btn[data-cat-id="33"] .pcru-pill-badge { background: #FFF7ED !important; color: #C2410C !important; }
.pcru-pill-btn[data-cat-id="33"]:hover:not(.active) { background: #FFF7ED !important; border-color: #EA580C !important; }
.pcru-pill-btn[data-cat-id="33"].active { background: linear-gradient(135deg, #C2410C 0%, #F97316 100%) !important; border-color: #C2410C !important; }
.pcru-badge-cat.pcru-cat-33 { background: #FFF7ED !important; color: #C2410C !important; border-color: #FED7AA !important; }
.pcru-badge-cat.pcru-cat-33 i { color: #EA580C !important; }

/* 11. สำนักส่งเสริมวิชาการฯ (Academic) - Sky Turquoise Blue */
.pcru-pill-btn[data-cat-id="35"] { border-color: #BAE6FD !important; }
.pcru-pill-btn[data-cat-id="35"] i { color: #0284C7 !important; }
.pcru-pill-btn[data-cat-id="35"] .pcru-pill-badge { background: #F0F9FF !important; color: #0369A1 !important; }
.pcru-pill-btn[data-cat-id="35"]:hover:not(.active) { background: #F0F9FF !important; border-color: #0284C7 !important; }
.pcru-pill-btn[data-cat-id="35"].active { background: linear-gradient(135deg, #0369A1 0%, #38BDF8 100%) !important; border-color: #0369A1 !important; }
.pcru-badge-cat.pcru-cat-35 { background: #F0F9FF !important; color: #0369A1 !important; border-color: #BAE6FD !important; }
.pcru-badge-cat.pcru-cat-35 i { color: #0284C7 !important; }

/* 12. หน่วยงานอิสระ (Independent) - Vivid Plum Amethyst */
.pcru-pill-btn[data-cat-id="38"] { border-color: #E9D5FF !important; }
.pcru-pill-btn[data-cat-id="38"] i { color: #9333EA !important; }
.pcru-pill-btn[data-cat-id="38"] .pcru-pill-badge { background: #FAF5FF !important; color: #6B21A8 !important; }
.pcru-pill-btn[data-cat-id="38"]:hover:not(.active) { background: #FAF5FF !important; border-color: #9333EA !important; }
.pcru-pill-btn[data-cat-id="38"].active { background: linear-gradient(135deg, #6B21A8 0%, #9333EA 100%) !important; border-color: #6B21A8 !important; }
.pcru-badge-cat.pcru-cat-38 { background: #FAF5FF !important; color: #6B21A8 !important; border-color: #E9D5FF !important; }
.pcru-badge-cat.pcru-cat-38 i { color: #9333EA !important; }

/* 13. บทความทั่วไป (General / Uncategorized) - Neutral Slate */
.pcru-pill-btn[data-cat-id="1"] { border-color: #CBD5E1 !important; }
.pcru-pill-btn[data-cat-id="1"] i { color: #64748B !important; }
.pcru-pill-btn[data-cat-id="1"] .pcru-pill-badge { background: #F8FAFC !important; color: #475569 !important; }
.pcru-pill-btn[data-cat-id="1"]:hover:not(.active) { background: #F8FAFC !important; border-color: #64748B !important; }
.pcru-pill-btn[data-cat-id="1"].active { background: linear-gradient(135deg, #475569 0%, #64748B 100%) !important; border-color: #475569 !important; }
.pcru-badge-cat.pcru-cat-1 { background: #F8FAFC !important; color: #475569 !important; border-color: #CBD5E1 !important; }
.pcru-badge-cat.pcru-cat-1 i { color: #64748B !important; }

/* 14. คู่มือ WordPress (WP Manual) - WordPress Blue */
.pcru-pill-btn[data-cat-id="40"] { border-color: #BAE6FD !important; }
.pcru-pill-btn[data-cat-id="40"] i { color: #0073AA !important; }
.pcru-pill-btn[data-cat-id="40"] .pcru-pill-badge { background: #F0F9FF !important; color: #0073AA !important; }
.pcru-pill-btn[data-cat-id="40"]:hover:not(.active) { background: #F0F9FF !important; border-color: #0073AA !important; }
.pcru-pill-btn[data-cat-id="40"].active { background: linear-gradient(135deg, #0073AA 0%, #00A0D2 100%) !important; border-color: #0073AA !important; }
.pcru-badge-cat.pcru-cat-40 { background: #F0F9FF !important; color: #0073AA !important; border-color: #BAE6FD !important; }
.pcru-badge-cat.pcru-cat-40 i { color: #0073AA !important; }

/* ==========================================================================
   10. PCRU VISITOR STATS WIDGET HIGH-CONTRAST PALETTE (DARK FOOTER FIX)
   ========================================================================== */
.pcru-visitor-stats-box,
.sec-visitor-stats-box {
    margin: 0 !important;
    padding: 0 !important;
    font-family: 'Prompt', sans-serif !important;
}

.pcru-visitor-stats-box .stat-hd,
.sec-visitor-stats-box .stat-hd,
.pcru-visitor-stats-box .stat-hd span,
.sec-visitor-stats-box .stat-hd span {
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    font-family: 'Prompt', sans-serif !important;
}

.pcru-visitor-stats-box .stat-hd i,
.sec-visitor-stats-box .stat-hd i {
    color: #F59E0B !important;
}

.pcru-visitor-stats-box .stat-list,
.sec-visitor-stats-box .stat-list {
    margin: 0 !important;
    padding: 0 !important;
}

.pcru-visitor-stats-box .stat-list li,
.sec-visitor-stats-box .stat-list li {
    color: #F1F5F9 !important;
}

.pcru-visitor-stats-box .stat-list li .stat-txt,
.sec-visitor-stats-box .stat-list li .stat-txt,
.pcru-visitor-stats-box .stat-list li .stat-txt span,
.sec-visitor-stats-box .stat-list li .stat-txt span {
    color: #F1F5F9 !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
}

.pcru-visitor-stats-box .stat-list li.total-row,
.sec-visitor-stats-box .stat-list li.total-row {
    color: #ffffff !important;
    margin-top: 4px !important;
    padding-top: 6px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
}

.pcru-visitor-stats-box .stat-list li.total-row .stat-txt,
.sec-visitor-stats-box .stat-list li.total-row .stat-txt,
.pcru-visitor-stats-box .stat-list li.total-row .stat-txt span,
.sec-visitor-stats-box .stat-list li.total-row .stat-txt span {
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* ==========================================================================
   11. PCRU SINGLE POST HERO & ARTICLE CARD COMPACT OVERHAUL
   ========================================================================== */

/* 1. Eliminate square outer background behind post card */
.single-post .style-65,
.single-post .style-local-14-m1,
.single-post .h-col .style-65,
.single-post div[class*="style-local-14-m1"] {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 2. PCRU Hero Header Bar Ultra-Compact */
.single-post #title,
.single-post #colibri #title,
.single-post .style-476,
#title.h-section {
    background: linear-gradient(135deg, #1E063B 0%, #3B0764 55%, #51189B 100%) !important;
    background-color: #1E063B !important;
    padding: 10px 0 !important;
    min-height: auto !important;
    border-bottom: 2px solid #F59E0B !important;
    position: relative !important;
    box-shadow: 0 4px 16px rgba(30, 6, 59, 0.2) !important;
}

.single-post #title .h-section-grid-container {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.single-post #title .gutters-row-lg-2,
.single-post #title .h-column,
.single-post #title .h-column__inner {
    padding: 0 !important;
}

.single-post #title .h-row {
    margin: 0 !important;
}

.single-post #title h4,
.single-post #colibri #title h4,
.single-post .style-486 h4,
#title .page-title h4,
#title .h-page-title__outer h4 {
    color: #ffffff !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.35) !important;
    margin: 0 !important;
}

/* 3. Content Sections Global Spacing & Pixel-Perfect Sidebar Alignment */
.single-post #blog-post,
.single-post .colibri-main-content-single,
.single-post .content,
.single-post .d-flex.h-section.h-section-global-spacing {
    padding-top: 15px !important;
    padding-bottom: 25px !important;
}

/* 4. Main Post Card Styling & Top Breathing Room (Outer Card Only) */
.single-post .colibri-single-post-loop .masonry-item,
.single-post .colibri-single-post-loop > .h-row > .post {
    background: #ffffff !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 24px -4px rgba(81, 24, 155, 0.06), 0 2px 6px -1px rgba(0, 0, 0, 0.02) !important;
    padding: 28px 32px 36px 32px !important; /* Generous breathing room */
    margin-top: 0 !important;
    margin-bottom: 25px !important;
    max-width: 100% !important;
}

/* Eliminate all nested inner column boxes & double borders */
.single-post .colibri-single-post-loop .h-column:not(.masonry-item) {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    max-width: 100% !important;
}

.single-post .colibri-sidebar .widget:first-child,
.single-post .colibri-sidebar .widget_block:first-child {
    margin-top: 0 !important;
}

@media (max-width: 768px) {
    .single-post .colibri-single-post-loop .masonry-item,
    .single-post .colibri-single-post-loop > .h-row > .post {
        padding: 20px 18px 26px 18px !important;
        border-radius: 14px !important;
        margin-top: 0 !important;
        margin-bottom: 20px !important;
    }
}

/* Eliminate Colibri inner column excess padding */
.single-post .colibri-single-post-loop .h-column__inner,
.single-post .colibri-single-post-loop div[class*="h-column__inner"] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 5. Meta Bar & Button Compact */
.single-post .h-blog-meta {
    display: inline-flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    background: #FAF5FF !important;
    border: 1px solid #E9D5FF !important;
    border-radius: 8px !important;
    padding: 5px 16px !important;
    margin-top: 0 !important;
    margin-bottom: 14px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    color: #64748B !important;
}

.single-post .h-blog-meta .metadata-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.single-post .h-blog-meta a {
    color: #51189B !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

.single-post .h-blog-meta a:hover {
    color: #7C3AED !important;
}

/* Elementor Author Portfolio Button */
.single-post .elementor-element-92f8,
.single-post .elementor-element-92f8 .e-con-inner {
    min-height: unset !important;
    padding: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
}

.single-post .elementor-button,
.single-post .elementor-button *,
.elementor-element-8734957 .elementor-button,
.elementor-element-8734957 .elementor-button * {
    color: #ffffff !important;
}

.single-post .elementor-button,
.elementor-element-8734957 .elementor-button {
    background: linear-gradient(135deg, #51189B 0%, #7C3AED 100%) !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 4px 16px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    box-shadow: 0 2px 8px rgba(81, 24, 155, 0.2) !important;
    transition: all 0.25s ease !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}

.single-post .elementor-button:hover,
.elementor-element-8734957 .elementor-button:hover {
    background: linear-gradient(135deg, #6B21A8 0%, #9333EA 100%) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(81, 24, 155, 0.3) !important;
    color: #ffffff !important;
}

/* Elementor Heading & Typography */
.single-post .elementor-element-6c5a,
.single-post .elementor-element-6c5a .e-con-inner {
    min-height: unset !important;
    padding: 0 !important;
    margin: 0 !important;
}

.single-post .elementor-element-6295 {
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
}

.colibri-post-content h1,
.colibri-post-content .wp-block-heading {
    font-family: 'Prompt', sans-serif !important;
    color: #1E063B !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin: 2px 0 10px 0 !important;
}

.colibri-post-content p,
.colibri-post-content li {
    font-family: 'Sarabun', sans-serif !important;
    font-size: 16px !important;
    line-height: 1.8 !important;
    color: #334155 !important;
}

.single-post .colibri-post-content img {
    border-radius: 12px !important;
    margin-top: 4px !important;
    margin-bottom: 14px !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06) !important;
}

/* ==========================================================================
   12. PCRU DEDICATED SIDEBAR BOXES (COMPACT & POLISHED)
   ========================================================================== */

/* Outer Widget Containers */
.colibri-sidebar .widget,
.colibri-sidebar .widget_block {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    box-shadow: 0 4px 16px -2px rgba(81, 24, 155, 0.04), 0 2px 4px -1px rgba(0, 0, 0, 0.02) !important;
    padding: 15px 16px !important;
    margin-bottom: 15px !important;
}

/* Sidebar Box Headers */
.pcru-sidebar-box {
    margin: 0 !important;
    padding: 0 !important;
}

.pcru-sb-box-title {
    font-family: 'Prompt', sans-serif !important;
    font-size: 14.5px !important;
    font-weight: 700 !important;
    color: #1E063B !important;
    padding-bottom: 7px !important;
    margin: 0 0 10px 0 !important;
    border-bottom: 2px solid #FAF5FF !important;
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    position: relative !important;
}

.pcru-sb-box-title::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 32px;
    height: 2px;
    background: #F59E0B;
    border-radius: 2px;
}

.pcru-sb-box-title i {
    color: #51189B !important;
    font-size: 14px !important;
}

/* 1. Faculties List Compact */
.pcru-sb-cat-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
}

.pcru-sb-cat-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 5px 9px !important;
    border-radius: 8px !important;
    background: #FAF5FF !important;
    border: 1px solid #E9D5FF !important;
    text-decoration: none !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.pcru-sb-cat-name {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #1E293B !important;
}

.pcru-sb-cat-name i {
    font-size: 12px !important;
    color: #7C3AED !important;
    width: 14px !important;
    text-align: center !important;
}

.pcru-sb-cat-badge {
    background: #ffffff !important;
    color: #51189B !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 10.5px !important;
    font-weight: 700 !important;
    padding: 1px 6px !important;
    border-radius: 999px !important;
    border: 1px solid #E2E8F0 !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

.pcru-sb-cat-item:hover {
    transform: translateX(3px) !important;
    border-color: #C084FC !important;
    box-shadow: 0 3px 10px rgba(81, 24, 155, 0.08) !important;
}

/* 2. Recent Posts List Ultra-Compact */
.pcru-sb-post-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
}

.pcru-sb-post-card {
    all: unset !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid #F1F5F9 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    transition: transform 0.2s ease !important;
    box-sizing: border-box !important;
}

.pcru-sb-post-card:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

.pcru-sb-post-card:first-child {
    padding-top: 0 !important;
}

.pcru-sb-post-card:hover {
    transform: translateX(3px) !important;
}

.pcru-sb-post-thumb {
    flex: 0 0 58px !important;
    width: 58px !important;
    height: 48px !important;
    border-radius: 7px !important;
    overflow: hidden !important;
    background: #F1F5F9 !important;
    display: block !important;
}

.pcru-sb-post-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform 0.3s ease !important;
}

.pcru-sb-post-card:hover .pcru-sb-post-img {
    transform: scale(1.08) !important;
}

.pcru-sb-thumb-empty {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #F8FAFC 0%, #EEF2FF 100%) !important;
    color: #94A3B8 !important;
    font-size: 15px !important;
}

.pcru-sb-post-content {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
}

.pcru-sb-post-badges {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    flex-wrap: nowrap !important;
}

.pcru-sb-post-badges .pcru-badge-cat,
.pcru-sb-post-badges .pcru-badge-date {
    font-size: 9.5px !important;
    padding: 1px 5px !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    border-radius: 4px !important;
}

.pcru-sb-post-title {
    font-family: 'Prompt', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.pcru-sb-post-title a {
    color: #1E293B !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

.pcru-sb-post-card:hover .pcru-sb-post-title a {
    color: #51189B !important;
}

/* ==========================================================================
   13. PCRU CATEGORY FILTER PILLS & BADGES MAXIMUM CONTRAST & LEGIBILITY
   ========================================================================== */

/* 1. Base Pill Buttons High Legibility */
.pcru-filter-pills .pcru-pill-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 7px 14px !important;
    border-radius: 999px !important;
    border: 1.5px solid #CBD5E1 !important;
    background: #ffffff !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    text-decoration: none !important;
    line-height: 1 !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.pcru-filter-pills .pcru-pill-btn .pcru-pill-label {
    font-family: 'Prompt', sans-serif !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #0F172A !important; /* Rich Dark Charcoal / High Contrast */
    letter-spacing: 0.2px !important;
}

.pcru-filter-pills .pcru-pill-btn i {
    font-size: 13px !important;
    flex-shrink: 0 !important;
}

/* 2. Crisp Readable Badges (Number Counter) */
.pcru-filter-pills .pcru-pill-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 24px !important;
    height: 22px !important;
    padding: 0 7px !important;
    border-radius: 999px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    margin-left: 2px !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

/* 3. ACTIVE STATE - 100% White Crisp Text on All Buttons */
.pcru-filter-pills .pcru-pill-btn.active,
.pcru-filter-pills .pcru-pill-btn[data-cat-id].active {
    box-shadow: 0 4px 14px rgba(81, 24, 155, 0.3) !important;
}

.pcru-filter-pills .pcru-pill-btn.active .pcru-pill-label,
.pcru-filter-pills .pcru-pill-btn[data-cat-id].active .pcru-pill-label,
.pcru-filter-pills .pcru-pill-btn.active i,
.pcru-filter-pills .pcru-pill-btn[data-cat-id].active i {
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) !important;
    font-weight: 700 !important;
}

.pcru-filter-pills .pcru-pill-btn.active .pcru-pill-badge,
.pcru-filter-pills .pcru-pill-btn[data-cat-id].active .pcru-pill-badge {
    background: rgba(255, 255, 255, 0.28) !important;
    color: #ffffff !important;
    border: 1.5px solid rgba(255, 255, 255, 0.7) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
    font-weight: 800 !important;
}

/* "ทั้งหมด" Active Gradient */
.pcru-filter-pills .pcru-pill-btn[data-cat-id="0"].active,
.pcru-filter-pills .pcru-pill-btn[data-cat-id="all"].active {
    background: linear-gradient(135deg, #4C1D95 0%, #6D28D9 100%) !important;
    border-color: #4C1D95 !important;
}

/* 4. CTA Stats Pill High-Contrast Fix */
.pcru-filter-pills .pcru-pill-btn-cta {
    background: linear-gradient(90deg, #4C1D95 0%, #7C3AED 50%, #B45309 100%) !important;
    border: none !important;
    box-shadow: 0 4px 14px rgba(81, 24, 155, 0.25) !important;
    margin-left: auto !important;
}

.pcru-filter-pills .pcru-pill-btn-cta .pcru-pill-label {
    color: #ffffff !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}

.pcru-filter-pills .pcru-pill-btn-cta i {
    color: #FDE68A !important;
}

.pcru-filter-pills .pcru-pill-badge-cta {
    background: #ffffff !important;
    color: #51189B !important;
    padding: 3px 9px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12) !important;
}

/* Enhanced Chromatic Badges Contrast (Inactive) */
.pcru-filter-pills .pcru-pill-btn[data-cat-id="3"] { border-color: #93C5FD !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="3"] i { color: #1D4ED8 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="3"] .pcru-pill-badge { background: #DBEAFE !important; color: #1E40AF !important; border-color: #93C5FD !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="14"] { border-color: #7DD3FC !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="14"] i { color: #0284C7 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="14"] .pcru-pill-badge { background: #E0F2FE !important; color: #0369A1 !important; border-color: #7DD3FC !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="36"] { border-color: #FDA4AF !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="36"] i { color: #E11D48 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="36"] .pcru-pill-badge { background: #FFE4E6 !important; color: #9F1239 !important; border-color: #FDA4AF !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="4"] { border-color: #6EE7B7 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="4"] i { color: #047857 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="4"] .pcru-pill-badge { background: #D1FAE5 !important; color: #065F46 !important; border-color: #6EE7B7 !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="9"] { border-color: #FCD34D !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="9"] i { color: #B45309 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="9"] .pcru-pill-badge { background: #FEF3C7 !important; color: #92400E !important; border-color: #FCD34D !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="5"] { border-color: #A5B4FC !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="5"] i { color: #4338CA !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="5"] .pcru-pill-badge { background: #E0E7FF !important; color: #312E81 !important; border-color: #A5B4FC !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="32"] { border-color: #F9A8D4 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="32"] i { color: #BE185D !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="32"] .pcru-pill-badge { background: #FCE7F3 !important; color: #831843 !important; border-color: #F9A8D4 !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="34"] { border-color: #D8B4FE !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="34"] i { color: #6D28D9 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="34"] .pcru-pill-badge { background: #EDE9FE !important; color: #4C1D95 !important; border-color: #D8B4FE !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="37"] { border-color: #5EEAD4 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="37"] i { color: #0F766E !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="37"] .pcru-pill-badge { background: #CCFBF1 !important; color: #115E59 !important; border-color: #5EEAD4 !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="33"] { border-color: #FDBA74 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="33"] i { color: #C2410C !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="33"] .pcru-pill-badge { background: #FFEDD5 !important; color: #9A3412 !important; border-color: #FDBA74 !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="35"] { border-color: #7DD3FC !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="35"] i { color: #0284C7 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="35"] .pcru-pill-badge { background: #E0F2FE !important; color: #0369A1 !important; border-color: #7DD3FC !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="38"] { border-color: #E879F9 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="38"] i { color: #86198F !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="38"] .pcru-pill-badge { background: #FAE8FF !important; color: #701A75 !important; border-color: #E879F9 !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="1"] { border-color: #CBD5E1 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="1"] i { color: #475569 !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="1"] .pcru-pill-badge { background: #F1F5F9 !important; color: #334155 !important; border-color: #CBD5E1 !important; }

.pcru-filter-pills .pcru-pill-btn[data-cat-id="40"] { border-color: #7DD3FC !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="40"] i { color: #0073AA !important; }
.pcru-filter-pills .pcru-pill-btn[data-cat-id="40"] .pcru-pill-badge { background: #E0F2FE !important; color: #005177 !important; border-color: #7DD3FC !important; }

/* ==========================================================================
   14. PCRU SINGLE POST BOTTOM ELEMENTS & CARDS CLEANUP
   ========================================================================== */

/* 1. Star Ratings Spacing & Separator */
.single-post .kk-star-ratings {
    margin-top: 28px !important;
    margin-bottom: 16px !important;
    padding-top: 18px !important;
    border-top: 1px dashed #E2E8F0 !important;
}

/* 2. Social Share Spacing */
.single-post .pcru-social-share-wrap {
    margin-top: 14px !important;
    margin-bottom: 20px !important;
}

/* 3. Completely Hide Categories Card as requested */
.single-post .style-78,
.single-post .style-local-14-m9 {
    display: none !important;
}

/* Tags Section Clean Spacing */
.single-post .style-83 {
    margin-top: 14px !important;
    margin-bottom: 16px !important;
}

.single-post .style-83 .h-row {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    width: 100% !important;
}

/* Section Label: "Tags:" */
.single-post .style-85 p {
    font-family: 'Prompt', sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #475569 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    white-space: nowrap !important;
}

/* Tag Badges */
.single-post .h-blog-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
}

.single-post .colibri-post-tag {
    display: inline-flex !important;
    align-items: center !important;
    background: #ffffff !important;
    border: 1px solid #CBD5E1 !important;
    color: #334155 !important;
    padding: 3px 10px !important;
    border-radius: 6px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
}

.single-post .colibri-post-tag:hover {
    background: #7C3AED !important;
    border-color: #7C3AED !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 2px 6px rgba(124, 58, 237, 0.2) !important;
}

/* 4. Post Navigation Container & Buttons - Left & Right Alignment */
.single-post .style-88 {
    margin-top: 24px !important;
    padding-top: 20px !important;
    border-top: 1px solid #E2E8F0 !important;
    width: 100% !important;
    display: block !important;
}

.single-post .style-88 .h-row {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    gap: 16px !important;
}

/* Left: Previous Post Column (Aligned Left) */
.single-post .style-88 .style-89-outer {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    display: flex !important;
    justify-content: flex-start !important;
    margin: 0 !important;
}

.single-post .style-88 .style-89-outer .h-column__inner,
.single-post .style-88 .style-89-outer .h-column__content,
.single-post .style-88 .style-89-outer .post-nav-button,
.single-post .style-88 .style-89-outer .h-global-transition-all,
.single-post .style-88 .style-89-outer .navigation.post-navigation,
.single-post .style-88 .style-89-outer .nav-links,
.single-post .style-88 .style-89-outer .nav-previous {
    display: flex !important;
    justify-content: flex-start !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Right: Next Post Column (Aligned Right) */
.single-post .style-88 .style-91-outer {
    flex: 1 1 50% !important;
    max-width: 50% !important;
    display: flex !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
    margin-right: 0 !important;
}

.single-post .style-88 .style-91-outer .h-column__inner,
.single-post .style-88 .style-91-outer .h-column__content,
.single-post .style-88 .style-91-outer .post-nav-button,
.single-post .style-88 .style-91-outer .h-global-transition-all,
.single-post .style-88 .style-91-outer .navigation.post-navigation,
.single-post .style-88 .style-91-outer .nav-links,
.single-post .style-88 .style-91-outer .nav-next {
    display: flex !important;
    justify-content: flex-end !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Hide long post title to keep buttons concise and fitting perfectly */
.single-post .post-nav-button .post-title,
.single-post .navigation.post-navigation .post-title,
.single-post .post-nav-button a .post-title,
.single-post .navigation.post-navigation a .post-title {
    display: none !important;
}

/* Compact, elegant pill buttons */
.single-post .post-nav-button a,
.single-post .navigation.post-navigation a {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #FAF5FF !important;
    border: 1.5px solid #C084FC !important;
    border-radius: 999px !important;
    padding: 8px 20px !important;
    color: #51189B !important;
    font-family: 'Prompt', sans-serif !important;
    font-weight: 700 !important;
    font-size: 13.5px !important;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(81, 24, 155, 0.08) !important;
    transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
    cursor: pointer !important;
    white-space: nowrap !important;
}

/* Navigation Inner Text High Contrast */
.single-post .post-nav-button a .meta-nav,
.single-post .navigation.post-navigation a .meta-nav {
    color: #51189B !important;
    font-family: 'Prompt', sans-serif !important;
    font-weight: 700 !important;
    font-size: 13.5px !important;
    display: inline-block !important;
    transition: color 0.2s ease !important;
}

.single-post .nav-previous a .meta-nav::before {
    content: '← ';
    font-weight: 800;
}

.single-post .nav-next a .meta-nav::after {
    content: ' →';
    font-weight: 800;
}

/* Navigation Hover State */
.single-post .post-nav-button a:hover,
.single-post .navigation.post-navigation a:hover {
    background: linear-gradient(135deg, #51189B 0%, #7C3AED 100%) !important;
    border-color: #51189B !important;
    color: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 18px rgba(81, 24, 155, 0.3) !important;
}

.single-post .post-nav-button a:hover .meta-nav,
.single-post .navigation.post-navigation a:hover .meta-nav,
.single-post .post-nav-button a:hover *,
.single-post .navigation.post-navigation a:hover * {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35) !important;
}

/* Mobile responsive */
@media (max-width: 576px) {
    .single-post .style-88 .h-row {
        flex-direction: column !important;
        gap: 10px !important;
    }
    .single-post .style-88 .style-89-outer,
    .single-post .style-88 .style-91-outer {
        max-width: 100% !important;
        width: 100% !important;
        justify-content: center !important;
        margin: 0 !important;
    }
    .single-post .post-nav-button a,
    .single-post .navigation.post-navigation a {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* 5. Post Views Badges (Top Metadata Bar & Bottom Ratings Section) */
.single-post .h-blog-meta .pcru-meta-views {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 13px !important;
    color: #1E063B !important;
    font-weight: 600 !important;
}

.single-post .h-blog-meta .pcru-meta-views i {
    color: #7C3AED !important;
    font-size: 12.5px !important;
    margin-right: 2px !important;
}

.single-post .kk-star-ratings {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
}

.single-post .pcru-bottom-views {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #FAF5FF !important;
    border: 1px solid #E9D5FF !important;
    border-radius: 999px !important;
    padding: 4px 14px !important;
    font-family: 'Prompt', sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #51189B !important;
    box-shadow: 0 1px 3px rgba(81, 24, 155, 0.05) !important;
    margin-left: 10px !important;
}

.single-post .pcru-bottom-views i {
    color: #7C3AED !important;
    font-size: 13px !important;
}


