/* จัดกึ่งกลางที่ container ไม่แตะต้องด้วย animation */
.spinner-container {
    position: fixed; /* กึ่งกลางบนจอ */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 100px;
    z-index: 10000;
}

/* วงกลมหมุนอย่างเดียว และบังคับใช้คีย์เฟรมใหม่ */
.spinner {
    width: 100px;
    height: 100px;
    border: 8px solid #dfe3e5;
    border-top: 8px solid #1168a3;
    border-radius: 50%;
    animation: ptg-rotate 0.6s linear infinite !important; /* ← ชื่อใหม่ */
    transform-origin: 50% 50%;
    will-change: transform;
}

/* โลโก้กลางวง */
.spinner-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: auto;
}

/* คีย์เฟรมใหม่: ไม่มี translate */
@keyframes ptg-rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}