/* Loaded only when Elementor is active. Holds what Elementor's site settings (the "kit") cannot
   express. The theme never styles Elementor's own markup (.elementor-*): that look comes from the
   kit, which the lbs-core plugin fills from theme.json ("wp lbs kit seed").

   1. PROTECT THE THEME'S OWN CONTROLS
   Elementor's Theme Style rules are deliberately broad: ".elementor-kit-N button" and
   ".elementor-kit-N input:not(...):not(...)" match every button and field on the page, including the
   header's menu buttons and the LBS search box, and they outrank ordinary class selectors.
   The rules below restate what the kit overrides. ":is(#masthead, ...)" is used for its weight: a
   selector list inside :is() counts as its heaviest member (an id), which is enough to win. */

:is(#masthead, .lbs-header) .lbs-menu-btn {
	padding: 0 var(--lbs-space-4);
	border: 1px solid var(--lbs-text);
	border-radius: var(--lbs-radius-control);
	background-color: var(--lbs-text);
	color: var(--lbs-white);
	font-size: inherit;
	font-weight: 700;
}
:is(#masthead, .lbs-header) :is(.lbs-menu-btn:hover, .lbs-menu-btn--close) {
	background-color: var(--lbs-white);
	color: var(--lbs-text);
}
:is(#masthead, .lbs-header) .lbs-menu-btn--close:hover {
	background-color: var(--lbs-text);
	color: var(--lbs-white);
}

:is(#masthead, .lbs-header) .lbs-lang__toggle {
	padding: 0 var(--lbs-space-3);
	border: 1px solid var(--lbs-border-strong);
	border-radius: var(--lbs-radius-control);
	background-color: var(--lbs-white);
	color: var(--lbs-text);
	font-size: inherit;
}

:is(#masthead, .lbs-search) .lbs-search__input {
	border: 1px solid var(--lbs-border-strong);
	border-radius: var(--lbs-search-r, var(--lbs-radius-control));
	background-color: var(--lbs-white);
}
:is(#masthead, .lbs-search) .lbs-search__button {
	padding: var(--lbs-space-2) var(--lbs-space-5);
	border: 2px solid var(--lbs-red);
	border-radius: var(--lbs-search-r, var(--lbs-radius-control));
	background-color: var(--lbs-red);
	color: var(--lbs-white);
	font-size: var(--lbs-fs-sm);
	font-weight: 700;
	line-height: var(--lbs-lh-ui);
}
:is(#masthead, .lbs-search) .lbs-search__button:is(:hover, :focus) {
	border-color: var(--lbs-red-dark);
	background-color: var(--lbs-red-dark);
	color: var(--lbs-white);
}
/* The search box in a signature picture or on the picture strip (forms.css): its field has no frame of its own and
   its button is larger; at the weight of the rules above, which would otherwise put them back. */
:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(#masthead, .lbs-search) .lbs-search__input { border: 0; background-color: transparent; }
:is(.lbs-strip__search, div.wp-block-media-text.is-style-lbs-signature, .lbs-signature) :is(#masthead, .lbs-search) .lbs-search__button { padding-inline: var(--lbs-space-6); font-size: var(--lbs-fs-md); text-transform: uppercase; }

/* The chat button and its close button (lbs-core inc/chat.php, styled in components.css). */
:is(#lbs-chat, .lbs-chat) .lbs-chat__open {
	padding: var(--lbs-space-2) var(--lbs-space-4);
	border: 1px solid var(--lbs-border-strong);
	border-right: 0;
	border-radius: var(--lbs-radius-control) 0 0 var(--lbs-radius-control);
	background-color: var(--lbs-white);
	color: var(--lbs-red);
	font-size: var(--lbs-fs-sm);
	font-weight: 700;
}
:is(#lbs-chat, .lbs-chat) .lbs-chat__open:is(:hover, :focus-visible) { background-color: var(--lbs-red); color: var(--lbs-white); }
:is(#lbs-chat, .lbs-chat) .lbs-chat__close {
	padding: 0;
	border: 0;
	border-radius: var(--lbs-radius-control);
	background-color: transparent;
	color: var(--lbs-white);
	font-size: 1.75rem;
}
:is(#lbs-chat, .lbs-chat) .lbs-chat__close:hover { background-color: var(--lbs-red-dark); }
@media (max-width: 575.98px) {
	:is(#lbs-chat, .lbs-chat) .lbs-chat__open { padding-inline: var(--lbs-space-3); font-size: var(--lbs-fs-xs); }
}

/* The red band in the header (lbs-core announcements; components.css): the kit's link and paragraph rules
   ("body.elementor-kit-N a", "p") reach into the header. */
:is(#masthead, .lbs-header) .lbs-band :is(p, strong) { color: var(--lbs-white); }
:is(#masthead, .lbs-header) .lbs-band a,
:is(#masthead, .lbs-header) .lbs-band a:hover { color: var(--lbs-white); text-decoration-line: underline; }

/* 2. (Elementor's content lines up with the header through the kit alone since the container became
   fluid: wide width on desktop, 100% below it, side padding from the theme's own --lbs-gutter.) */

/* 3. FULL-WIDTH PAGES: the page body decides its own spacing. */
.elementor-template-full-width .lbs-main,
.elementor-template-canvas .lbs-main { padding-block: 0; }

/* 4. LINKS IN RUNNING TEXT LOOK THE SAME AS ON BLOCK PAGES
   Elementor sets its own link rules inside its pages. This keeps the text widget's links red and
   underlined, darker with a thicker line on hover and focus, as content.css does elsewhere. Sections 4
   and 6 are the places the theme reaches into Elementor's markup. A protected e-mail address
   ("tpostur", content.css) counts as a link in text, also alone in lbs-core's "LBS e-mail address" widget. */
.elementor .elementor-widget-text-editor a:where(:not([class]), [class="tpostur"]),
.elementor .lbs-email a.tpostur {
	color: var(--lbs-red);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}
.elementor .elementor-widget-text-editor a:where(:not([class]), [class="tpostur"]):hover,
.elementor .elementor-widget-text-editor a:where(:not([class]), [class="tpostur"]):focus-visible,
.elementor .lbs-email a.tpostur:is(:hover, :focus-visible) {
	color: var(--lbs-red-dark);
	text-decoration-thickness: 2px;
}

/* 5. PICTURES IN LBS IMAGE TILES (AND WIDE TILES) FILL THEIR TILE
   Elementor's ".elementor img { height: auto }" is loaded after the theme's stylesheets and weighs the
   same as ".lbs-tile__img img", so inside an Elementor page a tile's picture kept its own height and
   left the tile's dark background showing under it. The wide tile's picture likewise. */
.elementor :is(.lbs-tile__img, .lbs-tile-wide__img) img { height: 100%; }

/* 6. THE SECOND BUTTON
   The kit has one button look, the main (red) button. An Elementor Button widget becomes the second
   button (white, red frame, red text; Vefstaðall 7.5) when "lbs-button--secondary" is entered under
   Advanced > CSS Classes. The kit's own rules weigh two or three classes, hence the longer selectors. */
.elementor .elementor-widget.lbs-button--secondary .elementor-button {
	border-color: var(--lbs-red);
	background-color: var(--lbs-white);
	color: var(--lbs-red);
}
.elementor .elementor-widget.lbs-button--secondary .elementor-button:is(:hover, :focus-visible) {
	border-color: var(--lbs-red-dark);
	background-color: var(--lbs-white);
	color: var(--lbs-red-dark);
	text-decoration: underline;
}

/* 7. THE SIGNATURE PICTURE'S TEXT SIDE DOES NOT WRAP
   Below 768px Elementor lets every container wrap its widgets (--flex-wrap-mobile: wrap). In the
   signature picture's text side, a column inside a grid row, that made the grid size the row from an
   overestimate and hand the spare height to the last widget: a gap of several hundred pixels under the
   search box on phones (front page of dev2, 2026-10-07; the wptest demo had it too). A column has nothing
   to wrap, so the text side's own container never does. */
.lbs-signature > .lbs-signature__text > .e-con { --flex-wrap: nowrap; --flex-wrap-mobile: nowrap; --flex-wrap-tablet: nowrap; flex-wrap: nowrap; }
