/* Shared design variables keep editor and public rendering on one contract. */

.oi-tabs{--oi-accent:var(--ob-custom-accent,var(--od-accent,#28747d));--oi-ink:var(--ob-custom-text,var(--od-ink,#182235))}

.oi-tab-list{display:flex;flex-wrap:wrap;gap:var(--ob-gap,var(--od-gap,8px));border-bottom:1px solid var(--ob-custom-border,var(--od-line,#dce2e8))}

.oi-tab-list button{font:inherit;padding:12px 20px;border:0;border-bottom:3px solid transparent;background:transparent;color:var(--oi-ink);cursor:pointer;text-align:start}

.oi-tab-list button[aria-selected=true]{border-color:var(--oi-accent);color:var(--oi-accent);font-weight:700}

.oi-tabs-pills>.oi-tab-list>button{border-radius:999px}.oi-tabs-pills>.oi-tab-list>button[aria-selected=true]{background:var(--oi-accent);color:#fff}

.oi-tabs-boxed>.oi-tab-list>button{border:1px solid var(--ob-custom-border,var(--od-line,#dce2e8));border-radius:8px 8px 0 0}

.oi-tabs-center>.oi-tab-list{justify-content:center}.oi-tabs-right>.oi-tab-list{justify-content:flex-end}.oi-tabs-left>.oi-tab-list{justify-content:flex-start}

.oi-tab-panels>section{padding-block:24px}.oi-tab-panels>section[hidden]{display:none}

.oi-tabs[data-orientation=vertical]{display:grid;grid-template-columns:minmax(140px,25%) minmax(0,1fr);gap:24px}

.oi-tabs[data-orientation=vertical]>.oi-tab-list{flex-direction:column;justify-content:flex-start;border-bottom:0}

.oi-tabs :focus-visible,.oi-whatsapp:focus-visible,.oi-video :focus-visible{outline:3px solid var(--ob-custom-accent,var(--od-accent,#28747d));outline-offset:4px}

.oi-whatsapp{display:inline-flex;align-items:center;gap:12px;padding:14px 20px;background:var(--ob-custom-accent,#176e39);color:var(--ob-custom-text,#fff);border-radius:999px;text-decoration:none;box-shadow:0 8px 24px #0003;max-width:calc(100vw - 32px);font:inherit}

.oi-whatsapp svg{flex-shrink:0}.oi-whatsapp.is-floating{position:fixed;bottom:calc(var(--oi-offset,24px) + env(safe-area-inset-bottom));z-index:90}

.oi-whatsapp-right.is-floating{right:var(--oi-offset,24px)}.oi-whatsapp-left.is-floating{left:var(--oi-offset,24px)}

.editor-styles-wrapper .oi-whatsapp.is-floating{position:static}

.oi-videos{display:grid;grid-template-columns:repeat(var(--oi-columns,3),minmax(0,1fr));gap:var(--oi-gap,24px)}

.oi-video{display:flex;flex-direction:column;align-items:stretch;text-align:var(--oi-align,left);min-width:0;border:1px solid var(--ob-custom-border,var(--od-line,#dce2e8));border-radius:var(--od-radius,16px);padding:var(--oi-padding,16px);background:var(--ob-custom-bg,var(--od-surface,#fff));color:var(--ob-custom-text,var(--od-ink,#182235))}

.oi-video-player{aspect-ratio:var(--oi-aspect,16/9);overflow:hidden;border-radius:10px;background:#182235}

.oi-video-player button{position:relative;width:100%;height:100%;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;cursor:pointer;padding:16px;color:white;font:inherit}

.oi-video-player img{position:absolute;inset:0;width:100%;height:100%;object-fit:var(--oi-fit,cover);opacity:.55}.oi-video-player button span{position:relative}.oi-play{width:var(--oi-icon,32px);height:var(--oi-icon,32px);position:relative;flex:none}.oi-video h3{margin:16px 0 8px}.oi-video p{margin:0 0 16px}.oi-video>.ob-btn{margin-top:auto}.oi-video-player{flex-shrink:0}

.oi-video-player iframe{width:100%;height:100%;border:0}.oi-video-fallback{display:block;margin-top:12px;font-size:.875em}

.oi-tab-editor{padding:20px;border:1px dashed #729fa4}.oi-editor-hint{font-size:13px;color:#536071}

/* Interactive buttons participate in the same validated typography contract. */

.ob-role-button-font .oi-whatsapp,.ob-role-button-font .oi-tab-list>button{font-family:var(--ob-button-font)}

.ob-role-button-size .oi-whatsapp,.ob-role-button-size .oi-tab-list>button{font-size:var(--ob-button-size)}

.ob-role-button-weight .oi-whatsapp,.ob-role-button-weight .oi-tab-list>button{font-weight:var(--ob-button-weight)}

.ob-role-button-line .oi-whatsapp,.ob-role-button-line .oi-tab-list>button{line-height:var(--ob-button-line)}

.ob-role-button-letter .oi-whatsapp,.ob-role-button-letter .oi-tab-list>button{letter-spacing:var(--ob-button-letter)}

.ob-role-button-color .oi-whatsapp,.ob-role-button-color .oi-tab-list>button{color:var(--ob-button-color)}

.ob-role-button-transform .oi-whatsapp,.ob-role-button-transform .oi-tab-list>button{text-transform:var(--ob-button-transform)}

@media(max-width:782px){.oi-videos{grid-template-columns:repeat(2,minmax(0,1fr))}.oi-tabs[data-orientation=vertical]{grid-template-columns:minmax(100px,30%) minmax(0,1fr);gap:12px}}

@media(max-width:560px){.oi-videos{grid-template-columns:1fr}.oi-videos.oi-mobile-carousel{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:16px}.oi-mobile-carousel>.oi-video{flex:0 0 84%;scroll-snap-align:start}.oi-tab-list button{padding:10px}.oi-whatsapp{font-size:14px}}

@media(prefers-reduced-motion:reduce){.oi-mobile-carousel{scroll-behavior:auto}}