.smta-disclaimer { padding: 20px 0; } .smta-disclaimer-text { font-size: 12px; line-height: 1.7; color: #cfd9e3; margin: 0; text-align: justify; } .smta-copyright { background: #061c32; padding: 14px 0; border-top: 1px solid rgba(255, 255, 255, 0.08); } .smta-copy-inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .smta-copy-inner p { margin: 0; color: #fff; font-size: 14px; } .smta-copy-inner strong { color: #f6b100; } .smta-copy-links a { color: #f6b100; font-size: 14px; text-decoration: none; margin: 0 5px; } .smta-copy-links span { color: #fff; } /* CONTAINER */ .smta-action-bar { position: fixed; left: 50%; bottom: 10px; transform: translateX(-50%); display: flex; gap: 15px; padding: 12px 18px; border-radius: 60px; backdrop-filter: blur(12px); background: rgba(255,255,255,0.15); box-shadow: 0 10px 40px rgba(0,0,0,0.25); z-index: 99; animation: slideUp 0.8s ease; } /* BUTTON */ .action-btn { display: flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 40px; font-weight: 600; font-size: 14px; text-decoration: none; color: #fff; transition: 0.3s ease; } /* COLORS */ .call { background: linear-gradient(135deg, #007bff, #0056b3); } .whatsapp { background: linear-gradient(135deg, #25D366, #1da851); } .demo { background: linear-gradient(135deg, #f4b400, #d89b00); color: #000; } /* HOVER */ .action-btn:hover { transform: translateY(-3px) scale(1.05); } /* ICON */ .action-btn i { font-size: 16px; } /* ENTRY ANIMATION */ @keyframes slideUp { from { opacity: 0; transform: translate(-50%, 50px); } to { opacity: 1; transform: translate(-50%, 0); } } /* MOBILE VERSION */ @media (max-width: 768px) { .smta-action-bar { bottom: 0; width: 100%; left: 0; transform: none; border-radius: 0; justify-content: space-around; padding: 10px; background: #fff; } .action-btn { flex-direction: column; font-size: 12px; color: #000; background: none; } .call i { color: #007bff; } .whatsapp i { color: #25D366; } .demo i { color: #f4b400; } } /* HIDE ANIMATION */ .smta-action-bar { transition: all 0.4s ease; } .smta-action-bar.hide-bar { opacity: 0; transform: translate(-50%, 80px); pointer-events: none; } /* MOBILE FIX */ @media (max-width: 768px) { .smta-action-bar.hide-bar { transform: translateY(100%); } } /* BACKDROP */ .bottom-modal { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,0.5); display: none; z-index: 99999; } .bottom-sheet { position: absolute; bottom: -100%; left: 50%; transform: translateX(-50%); width: 500px; /* fixed clean width */ max-width: 80%; height: 65%; background: #fff; border-radius: 20px 20px 0 0; padding: 20px; transition: all 0.4s ease; overflow-y: auto; } /* ACTIVE STATE */ .bottom-modal.active .bottom-sheet { bottom: 0; } /* DRAG LINE */ .drag-line { width: 50px; height: 5px; background: #ccc; border-radius: 10px; margin: 0 auto 10px; } /* CLOSE */ .close-btn { position: absolute; right: 15px; top: 10px; font-size: 22px; cursor: pointer; } /* FORM */ .bottom-sheet input, .bottom-sheet select { width: 100%; padding: 12px; margin-bottom: 12px; border: 1px solid #ddd; border-radius: 8px; } .bottom-sheet button { width: 100%; padding: 14px; background: #f4b400; border: none; border-radius: 8px; font-weight: 600; cursor: pointer; }