@charset "UTF-8";/*!
 .search-wrapper { position: relative; }
    .live-search-results {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #fff;
        z-index: 1050;
        border-radius: 15px;
        margin-top: 10px;
        max-height: 400px;
        overflow-y: auto;
        display: none; /* ซ่อนไว้ก่อน */
    }
    .search-item:hover { background-color: #f8f9fa; cursor: pointer; }
    
    /* --- ตกแต่งส่วนรูปภาพและการ์ดให้เหลี่ยมโค้งมนเต็มพื้นที่ --- */
    .img-container {
        position: relative;
        border-radius: 16px;    /* ปรับระดับความโค้งมนของมุมภาพที่นี่ */
        overflow: hidden;       /* บังคับตัดขอบรูปภาพให้โค้งตามกล่อง */
        aspect-ratio: 4 / 3;    /* ควบคุมอัตราส่วนภาพให้เท่ากันสวยงามทุกลูก */
        background-color: #f0f0f0;
    }

    .place-img {
        width: 100%;
        height: 100%;
        object-fit: cover;      /* บังคับให้รูปภาพขยายเต็มพื้นที่โดยไม่เสียสัดส่วน */
        display: block;
        transition: transform 0.3s ease;
    }

    /* แถบชื่อจังหวัดบนรูปภาพ */
    .province-overlay {
        position: absolute;
        bottom: 10px; /* ระยะห่างจากด้านล่าง */
        left: 10px;   /* ระยะห่างจากด้านซ้าย */
        background-color: rgba(173, 216, 230, 0.85); /* สีฟ้าอ่อนโปร่งแสง */
        color: #000 ;
        padding: 4px 12px;
        border-radius: 8px;
        font-size: 0.85rem;
        font-weight: 600;
        z-index: 5;
        backdrop-filter: blur(2px);
        border: 1px solid rgba(255, 255, 255, 0.3);
        transition: 0.3s;
        pointer-events: none; /* เพื่อให้ยังสามารถคลิกผ่านแถบนี้ไปที่ลิงก์หลักได้ */
    }

    /* ซูมรูปภาพเล็กน้อยเมื่อ Hover บนตัวลิงก์หลัก */
    .place-link:hover .place-img {
        transform: scale(1.06);
    }

    .place-link:hover .province-overlay {
        background-color: rgba(173, 216, 230, 1);
    }

    /* สไตล์สำหรับปุ่มแผนที่ด้านขวามือลอยเหนือรูปภาพ */
    .map-btn {
        position: absolute;
        top: 10px;    /* ระยะห่างจากด้านบน */
        right: 10px;  /* ระยะห่างจากด้านขวา */
        background-color: #fff;
        color: #0d6efd; 
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 10; /* ให้อยู่เหนือรูปภาพ */
        transition: all 0.3s ease;
        border: 1px solid rgba(0, 0, 0, 0.1);
        text-decoration: none;
    }

    /* เอฟเฟกต์เมื่อเอาเมาส์ไปชี้ที่ปุ่มแผนที่ */
    .map-btn:hover {
        background-color: #0d6efd;
        color: #fff;
        transform: scale(1.1);
    }

    .location-text {
        font-size: 0.85rem;
        color: #6c757d;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
  	
/* ปุ่มกลับขึ้นด้านบน (To Top Button) */
#btn-to-top {
    position: fixed;
    bottom: 25px;
    right: 20px; /* ย้ายมาขวา */
    z-index: 9999;
    width: 45px;
    height: 45px;
    background-color: #000;
    color: #ffffff;
    border: none;
    border-radius: 50%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.3);
    display: none; 
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: opacity 0.2s, transform 0.2s;
    opacity: 0;
}