/* Incredible Banner — frontend styles. Most values come from CSS custom properties printed inline by the plugin (see print_inline_css()). The px fallbacks here keep the bar sensible even if that inline block is missing. */ .incban-bar { position: fixed; left: 0; right: 0; z-index: var(--incban-z, 100000); box-sizing: border-box; display: flex; align-items: center; width: 100%; min-height: var(--incban-minh, auto); margin: 0; padding: var(--incban-pad-v, 12px) var(--incban-pad-h, 16px); background: var(--incban-bg, #546e7a); color: var(--incban-text, #fff); font-size: var(--incban-fs, 16px); font-weight: var(--incban-weight, 400); line-height: 1.4; text-align: var(--incban-align, center); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.18); } /* Placement — the bar itself sits below the WP admin bar for logged-in users (--incban-nav is set by banner.js; 0 for visitors). */ .incban-bar.incban-pos-top { top: var(--incban-nav, 0px); bottom: auto; } .incban-bar.incban-pos-bottom { bottom: 0; top: auto; box-shadow: 0 -1px 6px rgba(0, 0, 0, 0.18); } /* Inner wrapper centers the message and leaves room for the close button. */ .incban-inner { flex: 1 1 auto; min-width: 0; } .incban-content { margin: 0 auto; } /* Inherit the bar's typography for everything inside the message. */ .incban-content, .incban-content p, .incban-content span, .incban-content strong { color: var(--incban-text, #fff); font-size: inherit; line-height: inherit; margin: 0; } /* Links inside the message use the configurable link color. Scoped under the bar id so the theme's own link styles can't override them. */ #incban-bar .incban-content a { color: var(--incban-link, #ffd54f); text-decoration: var(--incban-underline, underline); font-weight: inherit; } #incban-bar .incban-content a:hover, #incban-bar .incban-content a:focus { color: var(--incban-link, #ffd54f); text-decoration: var(--incban-underline, underline); opacity: 0.85; } /* Close (X) button */ .incban-close { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; margin-left: 10px; padding: 0; background: transparent; border: none; border-radius: 50%; color: var(--incban-x, #fff); font-size: 26px; line-height: 1; cursor: pointer; transition: background 0.15s ease, opacity 0.15s ease; } .incban-close:hover, .incban-close:focus { background: rgba(0, 0, 0, 0.18); outline: none; } /* Dismissed state — hide the bar and collapse any page offset immediately. The flash-guard adds .incban-dismissed to before paint for returning visitors; banner.js adds it on click. */ html.incban-dismissed #incban-bar { display: none !important; } html.incban-dismissed { --incban-h: 0px; }