
/* /buenpos_website_suite/static/src/scss/yappy_demo.scss */
 .o_buenpos_yappy_demo_page .bp_demo_surface{padding: clamp(1.25rem, 4vw, 4rem); background: #f4f1f8;}.o_buenpos_yappy_demo_page .bp_editorial_hero{padding-block: 2.5rem 1.5rem;}.o_buenpos_yappy_demo_page .bp_editorial_hero::before{top: 2.5rem; width: 2.7rem; height: .25rem;}.o_buenpos_yappy_demo_page .bp_editorial_hero > *{margin-left: clamp(0rem, 5vw, 4rem);}.o_buenpos_yappy_demo_page .bp_editorial_hero .bp_kicker{padding-top: .8rem; margin-bottom: .4rem;}.o_buenpos_yappy_demo_page .bp_editorial_hero h1{max-width: none; margin-bottom: .5rem; font-size: clamp(2rem, 3vw, 3rem);}.o_buenpos_yappy_demo_page .bp_editorial_hero .bp_lede{margin-top: .5rem; font-size: 1rem;}.o_buenpos_yappy_demo_page .bp_editorial_hero .bp_configuration_notice{margin-top: .65rem; font-size: .82rem;}.o_buenpos_yappy_demo{--yap-purple: #5c2d91; --yap-deep: #45226d; --yap-ink: #292333; --yap-muted: #6d6479; --yap-line: #e7e0ee; display: grid; grid-template-columns: minmax(19rem, 24rem) minmax(18rem, 31rem); justify-content: center; align-items: center; gap: clamp(2rem, 6vw, 6rem); color: var(--yap-ink); font-family: "Segoe UI", Arial, sans-serif;}.o_buenpos_yappy_demo button{cursor: pointer; font: inherit;}.o_buenpos_yappy_demo button:disabled{cursor: not-allowed; opacity: .46;}.o_buenpos_yappy_demo button:focus-visible{outline: 3px solid #b18adb; outline-offset: 3px;}.o_buenpos_yappy_demo h2{margin: .25rem 0 1rem; font: 700 clamp(1.65rem, 3vw, 2rem)/1.15 "Segoe UI", Arial, sans-serif; letter-spacing: -.03em;}.o_buenpos_yappy_demo p{line-height: 1.55;}.o_buenpos_yappy_demo .bp_yap_phone{width: 100%; max-width: 24rem; margin-inline: auto; overflow: hidden; border: 8px solid #2b2433; border-radius: 2.5rem; background: #f4f1f8; box-shadow: 0 24px 70px rgba(49, 28, 74, 0.19);}.o_buenpos_yappy_demo .bp_yap_statusbar{display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-between; padding: .55rem 1.25rem .15rem; font-size: .72rem; font-weight: 700;}.o_buenpos_yappy_demo .bp_yap_appbar{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: .65rem; padding: .65rem 1rem .9rem; background: #fff; border-bottom: 1px solid var(--yap-line);}.o_buenpos_yappy_demo .bp_yap_mark{display: block; width: 2.2rem; height: 2.2rem; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; flex: 0 0 auto; object-fit: contain; border-radius: .5rem; background: #fff;}.o_buenpos_yappy_demo .bp_yap_appbar div{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; min-width: 0;}.o_buenpos_yappy_demo .bp_yap_appbar strong{font-size: .93rem;}.o_buenpos_yappy_demo .bp_yap_appbar small{color: var(--yap-muted); font-size: .68rem;}.o_buenpos_yappy_demo .bp_yap_demo_badge{margin-left: auto; padding: .2rem .45rem; border-radius: .35rem; background: #eee6f6; color: var(--yap-purple); font-size: .6rem; font-weight: 800; letter-spacing: .07em;}.o_buenpos_yappy_demo .bp_yap_body{min-height: 35rem; padding: 1.2rem 1rem;}.o_buenpos_yappy_demo .bp_yap_eyebrow, .o_buenpos_yappy_demo .bp_yap_section_label{margin: 0 0 .4rem; color: var(--yap-purple); font-size: .68rem; font-weight: 800; letter-spacing: .1em;}.o_buenpos_yappy_demo .bp_yap_help{margin: -.35rem 0 1.2rem; color: var(--yap-muted); font-size: .83rem;}.o_buenpos_yappy_demo .bp_yap_channels{display: grid; grid-template-columns: 1fr 1fr; gap: .35rem; padding: .25rem; border-radius: .85rem; background: #eae3f0;}.o_buenpos_yappy_demo .bp_yap_channels button{min-height: 2.6rem; border: 0; border-radius: .65rem; background: transparent; color: var(--yap-muted); font-size: .78rem; font-weight: 700;}.o_buenpos_yappy_demo .bp_yap_channels button.is-active{background: #fff; color: var(--yap-purple); box-shadow: 0 2px 9px rgba(57, 33, 77, 0.1);}.o_buenpos_yappy_demo .bp_yap_amount{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; align-items: center; gap: .05rem; margin: 1.2rem 0 .7rem;}.o_buenpos_yappy_demo .bp_yap_amount span{color: var(--yap-muted); font-size: .78rem;}.o_buenpos_yappy_demo .bp_yap_amount strong{color: var(--yap-purple); font-size: 2.75rem; font-weight: 750; font-variant-numeric: tabular-nums; letter-spacing: -.06em;}.o_buenpos_yappy_demo .bp_yap_amount small{color: var(--yap-muted); font-size: .67rem;}.o_buenpos_yappy_demo .bp_yap_keypad{display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin: .7rem 0 1rem;}.o_buenpos_yappy_demo .bp_yap_keypad button{height: 2.75rem; border: 1px solid var(--yap-line); border-radius: .75rem; background: #fff; color: var(--yap-ink); font-size: 1.05rem; font-weight: 650;}.o_buenpos_yappy_demo .bp_yap_keypad button:hover{border-color: #b293d0; background: #f9f4fe;}.o_buenpos_yappy_demo .bp_yap_primary{display: -webkit-box; display: -webkit-flex; display: flex; justify-content: center; gap: .45rem; width: 100%; min-height: 3rem; align-items: center; border: 0; border-radius: .8rem; background: var(--yap-purple); color: #fff; font-size: .83rem; font-weight: 800;}.o_buenpos_yappy_demo .bp_yap_primary:hover:not(:disabled){background: var(--yap-deep);}.o_buenpos_yappy_demo .bp_yap_secondary{width: 100%; min-height: 2.7rem; border: 1px solid var(--yap-line); border-radius: .75rem; background: #fff; color: var(--yap-purple); font-size: .83rem; font-weight: 750;}.o_buenpos_yappy_demo .bp_yap_qr_frame{display: grid; justify-items: center; gap: .5rem; margin: 1.15rem auto; padding: .95rem; width: fit-content; border-radius: 1rem; background: #fff; box-shadow: 0 3px 16px rgba(51, 32, 70, 0.08);}.o_buenpos_yappy_demo .bp_yap_qr_frame small{color: var(--yap-muted); font-size: .62rem;}.o_buenpos_yappy_demo .bp_yap_qr_art{position: relative; width: 10.7rem; height: 10.7rem; background: repeating-linear-gradient(0deg, transparent 0 7px, #2a2233 7px 11px, transparent 11px 17px), repeating-linear-gradient(90deg, transparent 0 11px, #2a2233 11px 15px, transparent 15px 20px); background-blend-mode: multiply;}.o_buenpos_yappy_demo .bp_yap_qr_art i{position: absolute; display: block; width: 2.8rem; height: 2.8rem; border: .5rem solid #2a2233; background: #fff;}.o_buenpos_yappy_demo .bp_yap_qr_art i:nth-child(1){top: 0; left: 0;}.o_buenpos_yappy_demo .bp_yap_qr_art i:nth-child(2){top: 0; right: 0;}.o_buenpos_yappy_demo .bp_yap_qr_art i:nth-child(3){bottom: 0; left: 0;}.o_buenpos_yappy_demo .bp_yap_qr_art span{position: absolute; inset: 4.1rem; border-radius: .45rem; background: var(--yap-purple); border: .5rem solid #fff;}.o_buenpos_yappy_demo .bp_yap_physical_card{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; align-items: center; gap: .4rem; margin: 1.1rem 0; padding: 2rem .75rem; border: 1px solid var(--yap-line); border-radius: 1rem; background: #fff; text-align: center;}.o_buenpos_yappy_demo .bp_yap_physical_card i{color: var(--yap-purple); font-size: 3rem;}.o_buenpos_yappy_demo .bp_yap_physical_card span{color: var(--yap-muted); font-size: .75rem;}.o_buenpos_yappy_demo .bp_yap_pending_amount, .o_buenpos_yappy_demo .bp_yap_result_amount{display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center; margin: .7rem 0; padding: .85rem; border-radius: .75rem; background: #fff;}.o_buenpos_yappy_demo .bp_yap_pending_amount strong{color: var(--yap-purple);}.o_buenpos_yappy_demo .bp_yap_waiting{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: .4rem; color: var(--yap-muted); font-size: .69rem;}.o_buenpos_yappy_demo .bp_yap_waiting span{width: .45rem; height: .45rem; border-radius: 50%; background: #da9a31;}.o_buenpos_yappy_demo .bp_yap_result_icon{display: grid; place-items: center; width: 4rem; height: 4rem; margin: 2rem auto 1.5rem; border-radius: 50%; font-size: 1.5rem;}.o_buenpos_yappy_demo .bp_yap_result_icon.is-success{background: #e0f3e9; color: #17834b;}.o_buenpos_yappy_demo .bp_yap_result_icon.is-error{background: #f8e5e5; color: #ad4141;}.o_buenpos_yappy_demo .bp_yap_result_amount{-webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; gap: .3rem; margin: 2rem 0;}.o_buenpos_yappy_demo .bp_yap_result_amount strong{color: var(--yap-purple); font-size: 2rem;}.o_buenpos_yappy_demo .bp_yap_result_amount small{color: var(--yap-muted);}.o_buenpos_yappy_demo .bp_yap_setting{display: -webkit-box; display: -webkit-flex; display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .7rem .8rem; border-bottom: 1px solid var(--yap-line); background: #fff;}.o_buenpos_yappy_demo .bp_yap_setting:first-child{border-radius: .8rem .8rem 0 0;}.o_buenpos_yappy_demo .bp_yap_setting:last-child{border-radius: 0 0 .8rem .8rem; border-bottom: 0;}.o_buenpos_yappy_demo .bp_yap_setting div{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column;}.o_buenpos_yappy_demo .bp_yap_setting strong, .o_buenpos_yappy_demo .bp_yap_setting > span{font-size: .79rem;}.o_buenpos_yappy_demo .bp_yap_setting small{color: var(--yap-muted); font-size: .66rem;}.o_buenpos_yappy_demo .bp_yap_switch{width: 2.2rem; height: 1.25rem; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; flex: 0 0 auto; padding: .15rem; border: 0; border-radius: 2rem; background: #c8c0d0;}.o_buenpos_yappy_demo .bp_yap_switch span{display: block; width: .95rem; height: .95rem; border-radius: 50%; background: #fff; transition: transform .15s ease;}.o_buenpos_yappy_demo .bp_yap_switch.is-on{background: var(--yap-purple);}.o_buenpos_yappy_demo .bp_yap_switch.is-on span{transform: translateX(0.95rem);}.o_buenpos_yappy_demo .bp_yap_section_label{margin: 1.35rem 0 .5rem;}.o_buenpos_yappy_demo .bp_yap_sources{overflow: hidden; border-radius: .8rem;}.o_buenpos_yappy_demo .bp_yap_empty{display: grid; justify-items: center; gap: .3rem; padding: 1.3rem; color: var(--yap-muted); font-size: .76rem;}.o_buenpos_yappy_demo .bp_yap_empty i{font-size: 1.25rem;}.o_buenpos_yappy_demo .bp_yap_notice{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; gap: .6rem; padding: .7rem .5rem; border-bottom: 1px solid var(--yap-line); font-size: .74rem;}.o_buenpos_yappy_demo .bp_yap_notice_icon{display: grid; place-items: center; width: 1.8rem; height: 1.8rem; border-radius: 50%; background: #e0f3e9; color: #17834b;}.o_buenpos_yappy_demo .bp_yap_notice div{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; flex: 1;}.o_buenpos_yappy_demo .bp_yap_notice small{color: var(--yap-muted);}.o_buenpos_yappy_demo .bp_yap_nav{display: grid; grid-template-columns: 1fr 1fr; padding: .35rem; border-top: 1px solid var(--yap-line); background: #fff;}.o_buenpos_yappy_demo .bp_yap_nav button{display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; align-items: center; gap: .1rem; min-height: 3rem; padding: .3rem; border: 0; background: none; color: var(--yap-muted); font-size: .69rem; font-weight: 650;}.o_buenpos_yappy_demo .bp_yap_nav button i{font-size: 1.05rem;}.o_buenpos_yappy_demo .bp_yap_nav button.is-active{color: var(--yap-purple);}.o_buenpos_yappy_demo .bp_yap_guide{padding: 1rem 0;}.o_buenpos_yappy_demo .bp_yap_guide_kicker{color: var(--yap-purple); font-size: .7rem; font-weight: 800; letter-spacing: .1em;}.o_buenpos_yappy_demo .bp_yap_guide h2{margin-top: .75rem; font-size: clamp(2rem, 3.5vw, 2.8rem);}.o_buenpos_yappy_demo .bp_yap_guide > p{color: var(--yap-muted);}.o_buenpos_yappy_demo .bp_yap_test_controls{display: grid; gap: .6rem; margin-top: 1.5rem; padding: 1.1rem; border: 1px solid #ddd0ea; border-radius: 1rem; background: #fff;}.o_buenpos_yappy_demo .bp_yap_test_controls p{margin: 0; color: var(--yap-muted); font-size: .78rem;}.o_buenpos_yappy_demo .bp_yap_test_controls button{min-height: 2.6rem; padding: .45rem .7rem; border: 1px solid var(--yap-purple); border-radius: .6rem; background: #fff; color: var(--yap-purple); font-weight: 750; font-size: .79rem; text-align: left;}.o_buenpos_yappy_demo .bp_yap_test_controls button:hover:not(:disabled){background: #f4ecfb;}.o_buenpos_yappy_demo .bp_yap_source_choices{display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .35rem;}.o_buenpos_yappy_demo .bp_yap_source_choices button{min-height: 2.25rem; padding: .25rem; text-align: center;}.o_buenpos_yappy_demo .bp_yap_source_choices button.is-active{background: var(--yap-purple); color: #fff;}.o_buenpos_yappy_demo .bp_yap_guide_footer{display: -webkit-box; display: -webkit-flex; display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid #d9cbe5; color: var(--yap-muted); font-size: .75rem;}.o_buenpos_yappy_demo .bp_yap_audio_error{margin: 1rem 0 0; padding: .75rem .9rem; border: 1px solid #e8b8b3; border-radius: .7rem; background: #fff6f5; color: #8a332b; font-size: .78rem;}.o_buenpos_yappy_demo .bp_yap_guide_footer button{border: 0; background: none; color: var(--yap-purple); font-weight: 750;}@media (max-width: 760px){.o_buenpos_yappy_demo{grid-template-columns: 1fr;}.o_buenpos_yappy_demo .bp_yap_guide{max-width: 24rem; margin-inline: auto;}}@media (max-width: 690px){.o_buenpos_yappy_demo_page .bp_editorial_hero > *{margin-left: 0;}}