/* =========================================================
   Elementos comunes a todas las demos de Bit&Fix
   (franja superior "demo" + ventana de vista previa del mensaje)
   ========================================================= */
.bf-strip { position: relative; z-index: 200; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .4rem 1rem; padding: .55rem 1rem; background: #06162b; color: #e2e8f0; font: 500 .85rem/1.3 "Poppins", system-ui, sans-serif; text-align: center; border-bottom: 2px solid #22c55e; }
.bf-strip b { color: #4ade80; }
.bf-strip a { color: #06162b; background: #22c55e; padding: .3rem .8rem; border-radius: 999px; text-decoration: none; font-weight: 700; white-space: nowrap; }
.bf-strip a:hover { background: #4ade80; }

.bf-modal { position: fixed; inset: 0; z-index: 300; display: none; align-items: center; justify-content: center; padding: 16px; background: rgba(3, 10, 20, .72); backdrop-filter: blur(4px); }
.bf-modal.open { display: flex; }
.bf-modal__box { width: min(440px, 100%); background: #fff; color: #0f1c2e; border-radius: 20px; padding: 1.6rem; font-family: "Poppins", system-ui, sans-serif; box-shadow: 0 30px 80px rgba(0, 0, 0, .45); }
.bf-modal__box h3 { margin: 0 0 .3rem; font: normal 800 1.25rem/1.2 "Inter", system-ui, sans-serif; text-transform: none; letter-spacing: 0; color: #0f1c2e; }
.bf-modal__box p { margin: 0 0 1rem; color: #526173; font-size: .92rem; }
.bf-chat { background: #e7f6ec; border-radius: 16px; padding: 1rem; margin-bottom: 1.2rem; }
.bf-bubble { background: #d9fdd3; border-radius: 12px 12px 4px 12px; padding: .75rem .9rem; font-size: .92rem; white-space: pre-line; box-shadow: 0 1px 1px rgba(0, 0, 0, .08); margin-left: 12%; }
.bf-modal__actions { display: flex; flex-direction: column; gap: .6rem; }
.bf-btn { display: block; text-align: center; padding: .85rem 1rem; border-radius: 999px; font-weight: 700; text-decoration: none; border: 2px solid transparent; cursor: pointer; font-family: inherit; font-size: .95rem; }
.bf-btn--go { background: #22c55e; color: #06162b; }
.bf-btn--close { background: none; border-color: #dde5ee; color: #0f1c2e; }
