/* Google Fonts থেকে Noto Serif (Regular, Bold, Italic) ইমপোর্ট */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');

body {
          font-family: 'Noto Serif', serif;
          font-style: italic;
          /* পুরো ইন্টারফেস ইতালিক হবে */
          background-color: #f0f2f5;
          margin: 0;
          padding: 20px;
          text-align: center;
          color: #34495e;
}

.container {
          max-width: 400px;
          background: white;
          padding: 25px;
          border-radius: 15px;
          box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
          margin: auto;
          animation: bounce 0.6s ease-out;
          /* পেজ লোড হওয়ার সময় হালকা বাউন্স হবে */
}

h2 {
          color: #2c3e50;
          font-weight: 700;
          margin-bottom: 5px;
}

hr {
          border: 0;
          border-top: 1px solid #eee;
          margin: 20px 0;
}

/* ইনপুট ফিল্ড স্টাইল */
input,
select {
          width: 90%;
          padding: 12px;
          margin: 10px 0;
          border: 1px solid #ddd;
          border-radius: 8px;
          font-family: 'Noto Serif', serif;
          outline: none;
          transition: 0.3s;
}

input:focus,
select:focus {
          border-color: #3498db;
          box-shadow: 0 0 5px rgba(52, 152, 219, 0.3);
}

/* ছবির লেবেল এবং বাটন স্টাইল */
.upload-label {
          display: block;
          margin: 20px auto 15px;
          /* উপরে ২০px এবং নিচে ১৫px গ্যাপ */
          width: 90%;
          cursor: pointer;
          background: #3498db;
          color: white;
          padding: 12px;
          border-radius: 8px;
          font-weight: bold;
          transition: 0.3s;
}

.upload-label:hover {
          background: #2980b9;
}

/* সাবমিট বাটন */
button[type="submit"] {
          display: block;
          width: 96%;
          margin: 10px auto;
          padding: 14px;
          background-color: #27ae60;
          color: white;
          border: none;
          border-radius: 8px;
          font-size: 16px;
          font-weight: bold;
          font-family: 'Noto Serif', serif;
          cursor: pointer;
          transition: 0.3s;
}

button[type="submit"]:hover {
          background-color: #219150;
          transform: translateY(-2px);
}

/* সাকসেস কার্ড */
.success-card {
          background: #d4edda;
          color: #155724;
          padding: 15px;
          border-radius: 8px;
          margin-bottom: 20px;
          text-align: left;
          border-left: 5px solid #28a745;
}

/* লোডিং স্পিনার (যদি জাভাস্ক্রিপ্ট ব্যবহার করেন) */
.loader {
          display: none;
          border: 3px solid #f3f3f3;
          border-top: 3px solid #fff;
          border-radius: 50%;
          width: 18px;
          height: 18px;
          animation: spin 0.8s linear infinite;
          margin: 0 auto;
}

@keyframes spin {
          0% {
                    transform: rotate(0deg);
          }

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

@keyframes bounce {
          0% {
                    transform: scale(0.95);
                    opacity: 0;
          }

          100% {
                    transform: scale(1);
                    opacity: 1;
          }
}

.nav-link {
          display: inline-block;
          margin-top: 15px;
          color: #3498db;
          text-decoration: none;
          font-weight: bold;
          font-size: 14px;
}

.nav-link:hover {
          text-decoration: underline;
}



/* ভেরিফাই কার্ডের জন্য বিশেষ স্টাইল */
.result-card {
          width: 100%;
          max-width: 100%;
          overflow: hidden;
          /* ভেতরের কিছু বাইরে যেতে দেবে না */
          padding: 10px;
          box-sizing: border-box;
}

/* ভেরিফাই পেজের ছবির জন্য */
.result-img {
          width: 100% !important;
          /* বক্সের চওড়ার সমান */
          max-width: 100% !important;
          height: 200px !important;
          /* উচ্চতা ফিক্সড করে দেওয়া হলো */
          object-fit: cover !important;
          /* ছবি চ্যাপ্টা হবে না, বক্সের ভেতরে ফিট হবে */
          display: block;
          border-radius: 10px;
          margin: 15px 0;
          border: 2px solid #27ae60;
}