/*
Theme Name: Astra Child
Description: Child theme of Astra
Template: astra
Version: 1.0.0
*/

/* ==========================================================================
   TABLE OF CONTENTS
   ========================================================================== */
/*
    1. LOCAL FONT FACES
    2. CSS VARIABLES
    3. BASE FONT APPLICATION
    4. ICON PROTECTION
    5. ASTRA OVERRIDES
    6. RESPONSIVE DESIGN
    7. FONT WEIGHTS (SPECIFIC ELEMENTS)
    8. CUSTOM STYLES
    9. SITE STYLING
    10. SDKKU SOCIAL LOGIN
*/

/* ==========================================================================
   1. LOCAL FONT FACES
   ========================================================================== */

/* Kanit - All weights */
@font-face {
    font-family: 'Kanit';
    src: local('Kanit Thin'),
         url('https://sd.kku.ac.th/vendor/font/Kanit/Kanit-Thin.ttf') format('truetype');
    font-weight: 100;
    font-display: swap;
}
@font-face {
    font-family: 'Kanit';
    src: local('Kanit Light'),
         url('https://sd.kku.ac.th/vendor/font/Kanit/Kanit-Light.ttf') format('truetype');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'Kanit';
    src: local('Kanit Regular'),
         url('https://sd.kku.ac.th/vendor/font/Kanit/Kanit-Regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Kanit';
    src: local('Kanit Medium'),
         url('https://sd.kku.ac.th/vendor/font/Kanit/Kanit-Medium.ttf') format('truetype');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'Kanit';
    src: local('Kanit Bold'),
         url('https://sd.kku.ac.th/vendor/font/Kanit/Kanit-Bold.ttf') format('truetype');
    font-weight: 700;
    font-display: swap;
}

/* Sarabun - All weights */
@font-face {
    font-family: 'Sarabun';
    src: local('Sarabun Thin'),
         url('https://sd.kku.ac.th/vendor/font/Sarabun/Sarabun-Thin.ttf') format('truetype');
    font-weight: 100;
    font-display: swap;
}
@font-face {
    font-family: 'Sarabun';
    src: local('Sarabun Light'),
         url('https://sd.kku.ac.th/vendor/font/Sarabun/Sarabun-Light.ttf') format('truetype');
    font-weight: 300;
    font-display: swap;
}
@font-face {
    font-family: 'Sarabun';
    src: local('Sarabun Regular'),
         url('https://sd.kku.ac.th/vendor/font/Sarabun/Sarabun-Regular.ttf') format('truetype');
    font-weight: 400;
    font-display: swap;
}
@font-face {
    font-family: 'Sarabun';
    src: local('Sarabun Medium'),
         url('https://sd.kku.ac.th/vendor/font/Sarabun/Sarabun-Medium.ttf') format('truetype');
    font-weight: 500;
    font-display: swap;
}
@font-face {
    font-family: 'Sarabun';
    src: local('Sarabun Bold'),
         url('https://sd.kku.ac.th/vendor/font/Sarabun/Sarabun-Bold.ttf') format('truetype');
    font-weight: 700;
    font-display: swap;
}

/* KKU Font */
@font-face {
    font-family: 'KKUText';
    src: url("../font/KKUText2563-Regular.ttf") format("truetype");
    font-display: swap;
}

/* ==========================================================================
   2. CSS VARIABLES
   ========================================================================== */

:root {
    --font-kanit: 'Kanit', sans-serif;
    --font-sarabun: 'Sarabun', sans-serif;
    --font-kku: 'KKUText', sans-serif;
    --font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    /* Prioritize Font Awesome 6, then 5, then generic FontAwesome */
    --font-awesome: "Font Awesome 6 Free", "Font Awesome 6 Pro", "Font Awesome 6 Brands", "Font Awesome 5 Free", "Font Awesome 5 Pro", "Font Awesome 5 Brands", "FontAwesome";
}

/* ==========================================================================
   3. BASE FONT APPLICATION
   ========================================================================== */

/* Apply Sarabun as base font, excluding elements known to contain icons */
body, input, textarea, select, /* General elements */
.single-post .entry-content *,
.page .entry-content *,
.comments-area *,
.entry-meta, .entry-meta *,
.posted-by, .posted-on,
.ast-terms-link, .ast-terms-link a,
#ast-breadcrumbs-yoast {
    font-family: var(--font-sarabun) !important; /* !important to ensure override */
}

/* Apply Kanit to specific sections */
/* Homepage */
.home body, .home *:not([class*="fa"]):not([class*="dashicons"]):not([class*="eicon"]):not([class*="bi"]):not(.elementor-editor-active *) {
    font-family: var(--font-kanit) !important;
}

/* Navigation & Titles */
.main-navigation *, 
.ast-breadcrumbs *,
.ast-breadcrumbs-wrapper,
.ast-breadcrumbs-wrapper *,
header.entry-header .entry-title,
.entry-header .entry-title,
.entry-title,
h1, h2, h3, h4, h5, h6,
.site-title,
.widget-title,
.widgettitle,
.recent-posts-widget-with-thumbnails,
.sdkku-login-btn-highlight,
.sdkku-login-page-container,
.sdkku-login-page-container * { /* Including new SDKKU login elements */
    font-family: var(--font-kanit) !important;
}

/* SDKKU Social Login specific text - some are Sarabun by default */
.sdkku-login-policy-link,
.sdkku-login-policy-link * {
    font-family: var(--font-sarabun) !important;;
}


/* ==========================================================================
   4. ICON PROTECTION - Highest Importance
   ========================================================================== */

/* Admin Bar, Elementor Editor Protection */
/* Ensure system fonts for admin bar */
#wpadminbar,
#wpadminbar * {
    font-family: var(--font-system) !important;
}

/* Dashicons in admin bar */
#wpadminbar .dashicons,
#wpadminbar .ab-icon:before,
#wpadminbar .ab-item:before {
    font-family: dashicons !important;
}

/* Elementor Icons in admin bar */
#wpadminbar [id*="elementor"] .ab-item:before {
    font-family: eicons !important;
}

/* General Icon Protection for Font Awesome */
[class*="fa-"], .fa, .fas, .far, .fab, /* Base selectors */
i[class*="fa-"], span[class*="fa-"], /* Specific HTML elements */
/* Protect icons globally, but allow Elementor editor to override if needed */
:where([class*="fa-"], .fa, .fas, .far, .fab, i[class*="fa-"], span[class*="fa-"]):not(.elementor-editor-active *) {
    font-family: var(--font-awesome) !important;
    font-style: normal !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Font Awesome Weight Variations */
.fab:not(.elementor-editor-active *), .fa-brands:not(.elementor-editor-active *) { font-weight: 400 !important; }
.far:not(.elementor-editor-active *), .fa-regular:not(.elementor-editor-active *) { font-weight: 400 !important; }
.fal:not(.elementor-editor-active *), .fa-light:not(.elementor-editor-active *) { font-weight: 300 !important; }

/* Font Awesome Pseudo Elements (::before, ::after) */
[class*="fa-"]::before, .fa::before, .fas::before, .far::before, .fab::before,
[class*="fa-"]::after, .fa::after, .fas::after, .far::after, .fab::after {
    font-family: var(--font-awesome) !important;
    font-weight: inherit !important;
}

/* Elementor Editor Specific Icon Protection */
.elementor-editor-active [class*="fa-"],
.elementor-editor-active .fa, .elementor-editor-active .fas, .elementor-editor-active .far, .elementor-editor-active .fab,
body.elementor-editor-active [class*="fa-"],
body.elementor-editor-active .fa, body.elementor-editor-active .fas, body.elementor-editor-active .far, body.elementor-editor-active .fab {
    font-family: var(--font-awesome) !important;
    font-style: normal !important;
    font-weight: 900 !important;
}
.elementor-editor-active .eicon,
.elementor-editor-active [class*="eicon"],
body.elementor-editor-active .eicon,
body.elementor-editor-active [class*="eicon"] {
    font-family: eicons !important;
    font-style: normal !important;
}

/* Other Icon Systems Protection */
.dashicons:not(.elementor-editor-active *):not(#wpadminbar *) { font-family: dashicons !important; }
.eicon:not(.elementor-editor-active *), .elementor-icon i:not([class*="fa-"]):not(.elementor-editor-active *) { font-family: eicons !important; }
.material-icons:not(.elementor-editor-active *) { font-family: 'Material Icons' !important; }
[class*="bi-"]:not(.elementor-editor-active *), .bi:not(.elementor-editor-active *) { font-family: "Bootstrap Icons" !important; }


/* ==========================================================================
   5. ASTRA OVERRIDES
   ========================================================================== */

.entry-content h1, .entry-content h2,
.entry-content h3, .entry-content h4,
.entry-content h5, .entry-content h6 {
    font-family: var(--font-kanit) !important;
}

/* ==========================================================================
   6. RESPONSIVE DESIGN
   ========================================================================== */

@media (max-width: 768px) {
    .home :not([class*="fa"]):not([class*="icon"]):not([class*="dashicons"]):not([class*="eicon"]):not([class*="bi"]):not(.elementor-editor-active *) {
        font-family: var(--font-kanit) !important;
        font-size: 16px;
    }

    .single-post .entry-content :not([class*="fa"]):not([class*="icon"]):not([class*="dashicons"]):not([class*="eicon"]):not([class*="bi"]):not(.elementor-editor-active *),
    .page .entry-content :not([class*="fa"]):not([class*="icon"]):not([class*="dashicons"]):not([class*="eicon"]):not([class*="bi"]):not(.elementor-editor-active *) {
        font-family: var(--font-sarabun) !important;
        font-size: 16px;
        line-height: 1.7;
    }

    /* SDKKU Login adjustments */
    .sdkku-login-page-container {
        max-width: 400px;
        padding: 40px 30px;
        border-radius: 18px;
        margin: 0 20px;
    }

    .sdkku-login-logo-image {
        max-width: 100px;
    }

    .sdkku-login-title {
        font-size: 2rem;
    }

    .sdkku-login-google-btn {
        max-width: 280px;
        padding: 18px 26px;
        font-size: 1.05rem;
        gap: 15px;
    }

    .sdkku-login-btn-icon {
        width: 32px;
        height: 32px;
    }

    .sdkku-login-policy-links {
        gap: 15px;
    }

    .sdkku-login-policy-link {
        padding: 12px 20px;
        font-size: 0.9rem;
    }
}

@media (max-width: 480px) {
    .sdkku-login-page-container {
        max-width: 350px;
        padding: 35px 25px;
        border-radius: 16px;
        margin: 0 15px;
    }

    .sdkku-login-title {
        font-size: 1.8rem;
    }

    .sdkku-login-google-btn {
        max-width: 100%;
        padding: 16px 22px;
        border-radius: 12px;
        font-size: 1rem;
    }

    .sdkku-login-btn-text {
        align-items: center;
    }

    .sdkku-login-policy-link {
        max-width: 100%;
    }
}

@media (max-width: 360px) {
    .sdkku-login-page-container {
        max-width: 320px;
        padding: 30px 20px;
        margin: 0 10px;
    }

    .sdkku-login-title {
        font-size: 1.6rem;
    }
}


/* ==========================================================================
   7. FONT WEIGHTS (SPECIFIC ELEMENTS)
   ========================================================================== */

.home h1, .home h2, .home h3 { font-weight: 600; }
.main-navigation a { font-weight: 500; }
.ast-breadcrumbs { font-weight: 400; font-size: 14px; }
.single-post .entry-content h1,
.single-post .entry-content h2,
.single-post .entry-content h3 { font-weight: 600; }
.entry-content p { font-weight: 400; line-height: 1.8; }


/* ==========================================================================
   8. CUSTOM STYLES (Individual overrides for specific elements)
   ========================================================================== */

#ast-breadcrumbs-yoast {
    padding: 5px !important;
    font-size: 20px !important;
}

.widgettitle {
    padding: 10px !important;
    font-size: 36px !important;
}

.recent-posts-widget-with-thumbnails {
    padding: 10px !important;
    font-size: 18px !important;
}


/* ==========================================================================
   9. SITE STYLING
   ========================================================================== */

.main-header-menu > .menu-item > .menu-link,
#astra-footer-menu > .menu-item > .menu-link {
    color: #ef4d48;
}

.site-above-footer-wrap[data-section="section-above-footer-builder"] {
    background-image: url(http://sd.kku.ac.th/home/wp-content/uploads/2022/08/background1_footer.png);
}

.ul-footer-widget-custom li a {
    color: #FFF !important;
}

.ul-footer-widget-custom li a:hover {
    color: #d90700 !important;
}

/* Astra override css */
.ast-site-identity {
    padding: 0.2em 0;
}

a:where(:not(.wp-element-button)) {
    text-decoration: none;
}

/* Post box custom */
.eael-grid-post .eael-entry-footer,
.eael-grid-post .eael-entry-wrapper {
    min-height: 200px !important;
}

.elementor-1851 .elementor-element.elementor-element-2724976a .eael-entry-title,
.elementor-1851 .elementor-element.elementor-element-2724976a .eael-entry-title a {
    min-height: 75px;
}

/* Latest post sidebar customize */
.ast-separate-container.ast-two-container #secondary .widget {
    padding: 1em;
    line-height: normal;
}

li .rpwwt-post-date {
    text-align: right;
    padding-bottom: 0.25rem;
}

#secondary li {
    margin-bottom: 0.25em;
    margin-top: 1em;
    border-bottom: solid 1.5px #D6D6D6;
}

/* Button to page-top */
#btn-back-to-top {
    background-color: #EF4D48;
    color: whitesmoke;
    position: fixed;
    bottom: 55px;
    right: 55px;
    display: none;
}

/* Custom load more วิทยากรอบรม btn bg-color */
.elementor-4535 .elementor-element.elementor-element-309e0f1 .eael-load-more-button:hover {
    background-color: #EF4D48;
}


/* ==========================================================================
   10. SDKKU SOCIAL LOGIN
   ========================================================================== */

.google-login-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 16px 24px;
    border: 2px solid #4285f4;
    border-radius: 12px;
    background: #ffffff;
    color: #3c4043;
    font-size: 1.05rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-bottom: 25px;
    font-family: inherit;
    text-decoration: none;
    box-sizing: border-box;
}

.google-login-btn:hover {
    border-color: #4285f4;
    background-color: #E7F0FE;
    box-shadow: 0 4px 15px rgba(66, 133, 244, 0.2);
    transform: translateY(-2px);
    text-decoration: none;
    color: #3c4043;
}

.google-login-btn:focus {
    outline: none;
    border-color: #4285f4;
    box-shadow: 0 0 0 4px rgba(66, 133, 244, 0.15);
    text-decoration: none;
}

.google-login-btn:active {
    transform: translateY(0);
    text-decoration: none;
}

.google-login-btn:visited {
    color: #3c4043;
    text-decoration: none;
}

/* Container หลัก */
.sdkku-login-page-container {
    max-width: 768px;
    width: 100%;
    margin: 0 auto;
    padding: 50px 40px;
    text-align: center;
    background: linear-gradient(145deg, #ffffff 0%, #fdfcfc 50%, #f9f7f8 100%);
    border: 1px solid #e8e1e5;
    border-radius: 24px;
    box-shadow:
        0 8px 32px rgba(156, 123, 138, 0.12),
        0 2px 8px rgba(156, 123, 138, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    position: relative;
    /* Font family already set in BASE FONT APPLICATION */
}

/* Logo Section */
.sdkku-login-logo-section {
    margin-bottom: 35px;
}

.sdkku-login-logo-image {
    max-width: 120px;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* Title Section */
.sdkku-login-title-section {
    margin-bottom: 45px;
}

.sdkku-login-title {
    font-size: 2.4rem;
    font-weight: 700;
    margin-bottom: 12px;
    line-height: 1.2;
}

.sdkku-login-title-primary {
    color: #1a365d;
}

.sdkku-login-title-secondary {
    color: #2563eb;
}

.sdkku-login-subtitle {
    color: #4a5568;
    font-size: 1.1rem;
    margin: 0;
    font-weight: 500;
}

/* Login Button */
.sdkku-login-button-container {
    margin: 45px 0;
}

.sdkku-login-google-btn {
    width: 100%;
    max-width: 460px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 20px 32px;
    border: 2px solid #2563eb;
    border-radius: 14px;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    color: #1e293b;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-decoration: none;
    box-sizing: border-box;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.15);
    margin: 0 auto;
}

.sdkku-login-google-btn:hover {
    border-color: #1d4ed8;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(37, 99, 235, 0.25);
    text-decoration: none;
    color: #1e293b;
}

.sdkku-login-google-btn:focus {
    outline: none;
    border-color: #1d4ed8;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
    text-decoration: none;
}

.sdkku-login-google-btn:active {
    transform: translateY(0);
    text-decoration: none;
}

.sdkku-login-google-btn:visited {
    color: #1e293b;
    text-decoration: none;
}

.sdkku-login-btn-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.sdkku-login-btn-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.3;
}

.sdkku-login-btn-main-text {
    font-size: 0.95rem;
    color: #64748b;
    font-weight: 500;
}

.sdkku-login-btn-highlight {
    font-size: 1.5rem;
    color: #1e293b;
    font-weight: 400;
}

.sdkku-login-footer-links {
    margin-top: 50px;
    padding-top: 35px;
    border-top: 1px solid #cbd5e1;
}

.sdkku-login-policy-links {
    display: flex;
    flex-direction: column;
    gap: 18px;
    align-items: center;
}

.sdkku-login-policy-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 24px;
    color: #475569;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
    border-radius: 10px;
    transition: all 0.2s ease;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    width: 100%;
    max-width: 380px;
    justify-content: flex-start;
}

.sdkku-login-policy-link:hover {
    color: #2563eb;
    background: #dbeafe;
    border-color: #93c5fd;
    text-decoration: none;
    transform: translateY(-1px);
}

.sdkku-login-policy-link:visited {
    color: #475569;
    text-decoration: none;
}

.sdkku-login-policy-link:visited:hover {
    color: #2563eb;
}

.sdkku-login-policy-icon {
    width: 18px;
    text-align: center;
    color: #2563eb;
    font-size: 1rem;
}

.sdkku-login-page-container:hover {
    box-shadow:
        0 10px 30px rgba(66, 133, 244, 0.15),
        0 4px 12px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}