
/* /haba_house_sign_configurator/static/src/scss/house_sign_configurator.scss */
 @font-face{font-family: "Big Shoulders Stencil Text"; src: url("/haba_house_sign_configurator/static/src/fonts/big_shoulders_stencil_text/BigShouldersStencilText-Regular.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap;}@font-face{font-family: "Saira Stencil One"; src: url("/haba_house_sign_configurator/static/src/fonts/saira_stencil_one/SairaStencilOne-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap;}@font-face{font-family: "Black Ops One"; src: url("/haba_house_sign_configurator/static/src/fonts/black_ops_one/BlackOpsOne-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap;}@font-face{font-family: "Stardos Stencil"; src: url("/haba_house_sign_configurator/static/src/fonts/stardos_stencil/StardosStencil-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap;}@font-face{font-family: "Stardos Stencil"; src: url("/haba_house_sign_configurator/static/src/fonts/stardos_stencil/StardosStencil-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap;}@font-face{font-family: "Sirin Stencil"; src: url("/haba_house_sign_configurator/static/src/fonts/sirin_stencil/SirinStencil-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap;}@font-face{font-family: "Allerta Stencil"; src: url("/haba_house_sign_configurator/static/src/fonts/allerta_stencil/AllertaStencil-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap;}.o_haba_house_sign_page{background: #f5f7f8; min-height: 100vh;}.o_haba_hs{display: grid; grid-template-columns: minmax(280px, 340px) minmax(0, 1fr) minmax(240px, 280px); gap: 16px; max-width: 1480px; margin: 0 auto; padding: 16px; color: #111827;}.o_haba_hs_panel, .o_haba_hs_canvas, .o_haba_hs_wall, .o_haba_hs_checkout{background: #fff; border: 1px solid #dde3ea; border-radius: 8px;}.o_haba_hs_intro{padding: 16px 14px 12px; border-bottom: 1px solid #e5e7eb;}.o_haba_hs_intro h1{margin: 0 0 4px; font-size: 22px; line-height: 1.2;}.o_haba_hs_intro p{margin: 0; color: #64748b; font-size: 13px; line-height: 1.45;}.o_haba_hs_panel{max-height: calc(100vh - 32px); overflow: auto;}.o_haba_hs_panel section{padding: 14px; border-bottom: 1px solid #e5e7eb;}.o_haba_hs h2{display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 15px; font-weight: 700;}.o_haba_hs h2 span{display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 999px; background: #e8f0ff; color: #1d4ed8; font-size: 12px; font-weight: 800;}.o_haba_hs label{display: grid; gap: 6px; margin-bottom: 12px; font-size: 13px; font-weight: 650; color: #475569;}.o_haba_hs_field_label{display: block; margin-bottom: 6px; color: #475569; font-size: 13px; font-weight: 650;}.o_haba_hs input, .o_haba_hs textarea, .o_haba_hs select{width: 100%; min-height: 44px; border: 1px solid #cbd5e1; border-radius: 6px; padding: 8px 10px; color: #111827; background: #fff; font-size: 15px;}.o_haba_hs textarea{min-height: 84px; resize: vertical; line-height: 1.45;}.o_haba_hs_grid2{display: grid; grid-template-columns: 1fr 1fr; gap: 8px;}.o_haba_hs_font_grid{display: grid; grid-template-columns: 1fr; gap: 8px; margin-bottom: 12px;}.o_haba_hs_font{display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; min-height: 58px; text-align: left;}.o_haba_hs_font.is-active{border-color: #2563eb; background: #eff6ff; color: #1d4ed8; box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.2);}.o_haba_hs_font_preview{min-width: 0; overflow: hidden; color: #111827; font-size: 25px; line-height: 1.05; text-overflow: ellipsis; white-space: nowrap;}.o_haba_hs_font_meta{display: grid; justify-items: end; gap: 2px; color: #64748b; font-size: 11px; line-height: 1.2;}.o_haba_hs_font_meta strong{color: #475569; font-size: 12px;}.o_haba_hs_svg_text{width: 100%; height: 100%; overflow: visible; user-select: none; white-space: pre;}.o_haba_hs_button_row, .o_haba_hs_tabs{display: flex; gap: 8px; flex-wrap: wrap;}.o_haba_hs button{min-height: 42px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; padding: 8px 12px; font-weight: 650; cursor: pointer; transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;}.o_haba_hs button:hover:not(:disabled){border-color: #94a3b8; background: #f8fafc;}.o_haba_hs button:active:not(:disabled){transform: translateY(1px);}.o_haba_hs button:disabled{cursor: not-allowed; opacity: .48;}.o_haba_hs button.is-active, .o_haba_hs_layer.is-active{border-color: #2563eb; background: #eff6ff; color: #1d4ed8;}.o_haba_hs_layers{display: grid; gap: 6px; margin-bottom: 10px;}.o_haba_hs_layer{display: grid; gap: 2px; text-align: left; min-height: 52px;}.o_haba_hs_layer small{min-height: 16px; overflow: hidden; color: #64748b; text-overflow: ellipsis; white-space: nowrap;}.o_haba_hs_materials{display: grid; gap: 8px; margin-bottom: 12px;}.o_haba_hs_material{display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 10px; width: 100%; min-height: 68px; text-align: left;}.o_haba_hs_material.is-active{border-color: #2563eb; background: #f0f7ff; box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.2);}.o_haba_hs_material_copy{display: grid; gap: 2px; min-width: 0;}.o_haba_hs_material_copy strong{color: #0f172a; font-size: 14px; line-height: 1.2;}.o_haba_hs_material_copy small{color: #64748b; font-size: 12px; font-weight: 500; line-height: 1.3;}.o_haba_hs_material_icon{display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid #cbd5e1; border-radius: 8px; background: #f8fafc;}.o_haba_hs_material_icon span{display: block; width: 24px; height: 24px; border-radius: 6px; border: 1px solid rgba(15, 23, 42, 0.18); box-shadow: inset 0 1px 3px rgba(255, 255, 255, 0.55), 0 3px 8px rgba(15, 23, 42, 0.12);}.o_haba_hs_material_icon.is-carbon_steel span{background: linear-gradient(135deg, #18212f, #64748b);}.o_haba_hs_material_icon.is-stainless_steel span{background: linear-gradient(135deg, #f8fafc, #94a3b8 48%, #e2e8f0);}.o_haba_hs_material_icon.is-aluminium span{background: linear-gradient(135deg, #ffffff, #cbd5e1 54%, #f1f5f9);}.o_haba_hs_finish_group{margin-bottom: 12px;}.o_haba_hs_finishes{display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 8px;}.o_haba_hs_finish{display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 9px; min-height: 58px; width: 100%; padding: 8px; text-align: left;}.o_haba_hs_finish.is-active{border-color: #2563eb; background: #f0f7ff; box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.2);}.o_haba_hs_finish_swatch{width: 34px; height: 34px; border: 1px solid rgba(15, 23, 42, 0.2); border-radius: 8px; box-shadow: inset 0 1px 4px rgba(255, 255, 255, 0.55), 0 4px 10px rgba(15, 23, 42, 0.12);}.o_haba_hs_finish_copy{display: grid; gap: 1px; min-width: 0;}.o_haba_hs_finish_copy strong{overflow: hidden; color: #0f172a; font-size: 13px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap;}.o_haba_hs_finish_copy small{color: #64748b; font-size: 11px; font-weight: 600; line-height: 1.2;}.o_haba_hs_hint{margin: 0 0 10px; color: #64748b; font-size: 12px; line-height: 1.4;}.o_haba_hs_stepper{display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 6px;}.o_haba_hs_stepper button{min-height: 44px; padding: 0; font-size: 18px;}.o_haba_hs_mounting.is-open{background: #f8fafc;}.o_haba_hs_focus_pulse{border-radius: 8px; animation: o_haba_hs_focus_pulse 1.1s ease-out;}@keyframes o_haba_hs_focus_pulse{0%{box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.32);}70%{box-shadow: 0 0 0 8px rgba(37, 99, 235, 0);}100%{box-shadow: 0 0 0 0 rgba(37, 99, 235, 0);}}.o_haba_hs_stage{min-width: 0;}.o_haba_hs_toolbar{display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 10px;}.o_haba_hs_toolbar_actions{justify-content: flex-end;}.o_haba_hs_canvas{padding: 16px;}.o_haba_hs_canvas svg{display: block; width: 100%; height: 68vh; max-height: 720px; touch-action: none;}.o_haba_hs_canvas text{cursor: move; user-select: none;}.o_haba_hs_hole_target{cursor: pointer; pointer-events: all;}.o_haba_hs_hole_target > circle:first-child{fill: transparent; stroke: none;}.o_haba_hs_hole_clearance{fill: none; stroke: #ef4444; stroke-dasharray: 2 2; stroke-width: .5;}.o_haba_hs_hole_cut{fill: rgba(15, 23, 42, 0.18); stroke: #f8fafc; stroke-width: 1.2;}.o_haba_hs_hole_target:hover .o_haba_hs_hole_clearance, .o_haba_hs_hole_target.is-active .o_haba_hs_hole_clearance{stroke: #2563eb; stroke-width: 1;}.o_haba_hs_hole_target:hover .o_haba_hs_hole_cut, .o_haba_hs_hole_target.is-active .o_haba_hs_hole_cut{fill: #fff; stroke: #2563eb;}.o_haba_hs_hole_label{fill: #2563eb; stroke: none; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 10px; font-weight: 700; pointer-events: none;}.o_haba_hs_overlay_tools{filter: drop-shadow(0 4px 10px rgba(15, 23, 42, 0.22));}.o_haba_hs_svg_icon_btn{cursor: pointer; pointer-events: all;}.o_haba_hs_svg_icon_btn rect, .o_haba_hs_hidden_marker rect{fill: #fff; stroke: #cbd5e1; stroke-width: 1;}.o_haba_hs_svg_icon_btn path, .o_haba_hs_hidden_marker path{fill: none; stroke: #334155; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;}.o_haba_hs_svg_icon_btn circle{fill: #334155; stroke: none;}.o_haba_hs_svg_icon_btn:hover rect{fill: #eff6ff; stroke: #2563eb;}.o_haba_hs_svg_icon_btn.is-danger:hover rect{fill: #fef2f2; stroke: #dc2626;}.o_haba_hs_svg_icon_btn.is-danger:hover path{stroke: #b91c1c;}.o_haba_hs_hidden_marker{pointer-events: none; opacity: .72;}.o_haba_hs_wall{min-height: 620px; display: grid; place-items: center; padding: 24px; position: relative; overflow: hidden;}.o_haba_hs_wall.plaster_white{background: #f4f0e8;}.o_haba_hs_wall.plaster_grey{background: #cfd4d9;}.o_haba_hs_wall.brick{background: repeating-linear-gradient(0deg, #9b4d3f 0 30px, #73382f 30px 34px), repeating-linear-gradient(90deg, transparent 0 70px, rgba(255, 255, 255, 0.2) 70px 74px);}.o_haba_hs_wall.stone{background: linear-gradient(135deg, #a7a39a, #d1cec5);}.o_haba_hs_wall.wood{background: repeating-linear-gradient(90deg, #9a6a43 0 42px, #7c5233 42px 46px);}.o_haba_hs_wall_plaque{position: relative; max-width: 82%; min-width: 220px; box-shadow: 0 18px 42px rgba(15, 23, 42, 0.28);}.o_haba_hs_wall_plaque span{position: absolute; color: #f8fafc; white-space: pre; transform-origin: center; text-align: center;}.o_haba_hs_wall p, .o_haba_hs_wall select{position: absolute; left: 18px;}.o_haba_hs_wall p{bottom: 18px; max-width: 520px; margin: 0; color: #334155; font-size: 13px;}.o_haba_hs_wall select{top: 18px; width: auto;}.o_haba_hs_messages{margin-top: 10px;}.o_haba_hs_messages .alert{margin-bottom: 8px; border-radius: 6px;}.o_haba_hs_checkout{align-self: start; position: sticky; top: 16px; display: grid; gap: 12px; padding: 14px;}.o_haba_hs_checkout h2{margin-bottom: 2px;}.o_haba_hs_checkout div{display: grid; gap: 2px;}.o_haba_hs_checkout span{color: #64748b; font-size: 12px;}.o_haba_hs_checkout strong{font-size: 22px; line-height: 1.15;}.o_haba_hs_checkout .btn-primary{min-height: 48px; border-color: #1d4ed8; background: #1d4ed8; color: #fff; font-size: 15px;}.o_haba_hs_checkout .btn-primary:hover:not(:disabled){border-color: #1e40af; background: #1e40af;}.o_haba_house_sign_line_summary{margin-top: 8px;}.o_haba_house_sign_cart_main_image{width: 80px; height: 80px; object-fit: contain; background: #f8fafc; padding: 6px;}.o_haba_house_sign_line_preview{background: #f8fafc; border: 1px solid #e5e7eb; border-radius: 6px; padding: 6px;}.o_haba_house_sign_line_preview img{width: 100%; height: auto; display: block;}.o_haba_payment_intro{display: grid; gap: 3px; margin: 0 0 12px; padding: 14px 16px; border: 1px solid #dbe3ec; border-radius: 8px; background: #f8fafc; color: #0f172a;}.o_haba_payment_intro strong{font-size: 16px; line-height: 1.25;}.o_haba_payment_intro span{color: #64748b; font-size: 13px; line-height: 1.45;}.o_haba_payment_checkout #o_payment_form_options{gap: 12px !important;}.o_haba_payment_checkout #o_payment_methods > p{margin-bottom: 10px !important; color: #0f172a; font-size: 18px; font-weight: 700;}.o_haba_payment_checkout .list-group{display: grid; gap: 10px;}.o_haba_payment_checkout [name="o_payment_option"]{border: 1px solid #d7dde6 !important; border-radius: 8px !important; padding: 14px 16px !important; background: #fff; transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease;}.o_haba_payment_checkout [name="o_payment_option"]:hover{border-color: #94a3b8 !important; background: #fbfdff;}.o_haba_payment_checkout [name="o_payment_option"]:has(input[name="o_payment_radio"]:checked){border-color: #2563eb !important; background: #f0f7ff; box-shadow: inset 0 0 0 1px rgba(37, 99, 235, 0.18);}.o_haba_payment_checkout input[name="o_payment_radio"]{position: relative !important; flex: 0 0 auto; width: 20px; height: 20px; margin-top: 2px !important;}.o_haba_payment_checkout .form-check{gap: 12px; padding-left: 0;}.o_haba_payment_checkout .o_payment_option_label{color: #0f172a; font-size: 17px; font-weight: 700; line-height: 1.3;}.o_haba_payment_checkout [name="o_payment_option"] .small, .o_haba_payment_checkout [name="o_payment_option"] .text-600{margin-top: 8px; margin-left: 32px !important; color: #64748b !important; font-size: 14px; line-height: 1.5;}.o_haba_payment_checkout [name="o_payment_option"] .gap-1.flex-wrap.d-flex{margin-left: auto;}.o_haba_payment_checkout [name="o_payment_option"] .gap-1.flex-wrap.d-flex > span{width: 48px !important; max-width: 48px !important; height: 34px !important; border: 1px solid #e2e8f0; background: #f8fafc; box-shadow: none !important;}.o_haba_payment_checkout [name="o_payment_option"] .gap-1.flex-wrap.d-flex img{width: 100% !important; height: 100% !important; object-fit: contain; padding: 4px;}.o_haba_payment_checkout button[name="o_payment_submit_button"]{min-height: 48px; border-radius: 8px; font-weight: 700;}@media (max-width: 980px){.o_haba_hs{grid-template-columns: 1fr; padding: 10px;}.o_haba_hs_panel{max-height: none; order: 2;}.o_haba_hs_stage{order: 1;}.o_haba_hs_checkout{order: 3; position: sticky; bottom: 0; top: auto; z-index: 5;}.o_haba_hs_canvas svg{height: 56vh;}.o_haba_payment_checkout [name="o_payment_option"]{padding: 14px !important;}.o_haba_payment_checkout [name="o_payment_option"] .small, .o_haba_payment_checkout [name="o_payment_option"] .text-600{margin-left: 0 !important;}}