html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}
/* --- Nidec Logo Flip Animation --- */
.nidec-logo-spin {
    /* ใช้ animation เฉพาะตอน hover เพื่อไม่ให้หมุนตลอดเวลา */
    /* หรือถ้าจะให้หมุนตลอด ก็ใช้ animation: flip-y 8s ease-in-out infinite; */

    transition: transform 0.6s ease-in-out; /* เพิ่ม transition เมื่อไม่ได้หมุน */
    transform-style: preserve-3d; /* สำคัญสำหรับ 3D effect */
    perspective: 1000px; /* เพิ่มมิติ 3D ให้ดูสมจริง */
}

    .nidec-logo-spin:hover {
        animation: flip-y 1.5s ease-in-out forwards; /* หมุนแค่ 1 รอบ แล้วหยุดที่ 180 องศา */
        /* หรือถ้าอยากให้หมุนไปกลับตลอดตอน hover: animation: flip-y-hover 1.5s ease-in-out infinite alternate; */
    }

@keyframes flip-y {
    0% {
        transform: rotateY(0deg);
    }
    /* เริ่มต้นหน้าตรง */
    50% {
        transform: rotateY(180deg);
    }
    /* พลิกไปด้านหลัง (อาจจะเห็นเป็นภาพว่างๆ หรือกลับด้าน) */
    100% {
        transform: rotateY(360deg);
    }
    /* พลิกกลับมาหน้าตรง */
}

/* ถ้าต้องการให้พลิกไป-กลับ ตอน Hover ตลอด */
@keyframes flip-y-hover {
    0% {
        transform: rotateY(0deg);
    }

    100% {
        transform: rotateY(360deg);
    }
}