added premium subscribe button

resources/css/boil.css

@@ -73,3 +73,92 @@
 .magic-box {
     scrollbar-width: none;
 }
+
+.premium-btn {
+    perspective: 1000px;
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    padding: 8px 20px;
+    background: linear-gradient(145deg, #f7b42f, #fdd832);
+    color: #fff;
+    font-size: 16px;
+    font-weight: bold;
+    text-transform: uppercase;
+    border: none;
+    border-radius: 5px;
+    cursor: pointer;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    overflow: hidden;
+    transition: transform 0.3s ease;
+}
+
+.premium-btn:hover {
+    transform: scale(1.05);
+}
+
+.premium-btn .crown,
+.premium-btn .crown-bg1,
+.premium-btn .crown-bg2 {
+    transform-style: preserve-3d;
+    position: absolute;
+    background: url('https://zemailnator.test/images/crown.webp') no-repeat center center;
+    background-size: contain;
+    animation: rotateCrownY 2s linear infinite;
+}
+
+/* Main Crown */
+.premium-btn .crown {
+    top: -20px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 40px;
+    height: 40px;
+    z-index: 3;
+}
+
+/* Background Crown 1 */
+.premium-btn .crown-bg1 {
+    top: -10px;
+    left: 5%;
+    width: 25px;
+    height: 25px;
+    animation-duration: 3s;
+    opacity: 0.5;
+    z-index: 1;
+}
+
+/* Background Crown 2 */
+.premium-btn .crown-bg2 {
+    bottom: -15px;
+    right: 15%;
+    width: 30px;
+    height: 30px;
+    animation-duration: 4s;
+    opacity: 0.4;
+    z-index: 1;
+}
+
+.premium-btn .btn-text {
+    z-index: 2;
+}
+
+@keyframes rotateCrownY {
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(360deg);
+    }
+}
+
+.bg-pricing-modal {
+    background-color: #F3F4F6; /* Light mode background */
+}
+
+html.dark .bg-pricing-modal {
+    background-color: #101828; /* Dark mode */
+}
+
+