:root { } .popover { --gap: 10px; --popper-border-width: 1px; --popper-border-color: #ccc; position: absolute; top: 0; left: 0 /* rtl:ignore */; z-index: 1070; display: block; font-family: inherit; font-style: normal; font-weight: 400; line-height: 1.5; text-align: left; text-align: start; text-decoration: none; text-shadow: none; text-transform: none; letter-spacing: normal; word-break: normal; word-spacing: normal; white-space: normal; line-break: auto; font-size: var(--popper-font-size); word-wrap: break-word; background-color: transparent; background-clip: padding-box; border: 0; border-radius: 0; } .popover .popover-arrow { } .popover-header:empty { display: none; } .popover-content { border-radius: 3px; overflow: hidden; max-width: 200px; padding: 0; color: var(--popper-color); text-align: center; background-color: var(--popper-content-color); border: var(--popper-border-width) solid var(--popper-border-color); box-shadow: 0px 0px 5px -1px var(--popper-border-color); } .popover-header { padding: calc(var(--gap) / 2) calc(var(--gap)); margin-bottom: 0; font-size: 1em; background-color: #f0f0f0; border-bottom: var(--popper-border-width) solid var(--popper-border-color); border-radius: 0; } .popover-body { padding: calc(var(--gap) / 2) calc(var(--gap)); background-color: var(--popper-body-content-color); } .popover-footer:empty { display: none; } .popover-footer { padding: calc(var(--gap) / 2) calc(var(--gap)); background-color: var(--popper-footer-content-color); }