/* RW-UI-090: quiet controls for project photographs and drawings.
   RW-UI-110: the visible squares are 32px; independent touch targets remain 44px. */
.rw-family-projects #gallery [uk-slider] > .uk-slider-container > .uk-position-bottom-right {
    right: 8px !important;
    bottom: 8px !important;
    padding: 0 !important;
}

.rw-family-projects #gallery [uk-slider] > .uk-slider-container:has(.uk-line-height-2) > .uk-position-bottom-right {
    right: 58px !important;
}

.rw-family-projects #gallery .slider-item {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 2px !important;
    width: auto;
    margin: 0 !important;
    align-items: center;
}

.rw-family-projects #gallery .slider-item > div {
    display: block !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.rw-family-projects #gallery .slider-item > div:has(> .uk-width-xsmall) {
    display: none !important;
}

.rw-family-projects #gallery .slider-item [uk-slider-item] {
    position: relative;
    display: inline-flex;
    box-sizing: border-box;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    align-items: center;
    justify-content: center;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--rw-ink, #0e1521) !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.rw-family-projects #gallery .slider-item [uk-slider-item] svg {
    display: none;
}

.rw-family-projects #gallery .slider-item [uk-slider-item]::before {
    content: "";
    position: absolute;
    inset: 6px;
    border: 1px solid rgba(14, 21, 33, .22);
    border-radius: 0;
    background: var(--rw-ivory, #f6f2ea);
    transition: background-color 160ms ease-out, border-color 160ms ease-out;
}

.rw-family-projects #gallery .slider-item [uk-slider-item]::after {
    content: "";
    position: relative;
    width: 7px;
    height: 7px;
    border: solid currentColor;
    border-width: 1.5px 1.5px 0 0;
    transform: translateX(-1px) rotate(45deg);
}

.rw-family-projects #gallery .slider-item [uk-slider-item="previous"]::after {
    transform: translateX(1px) rotate(-135deg);
}

.rw-family-projects #gallery .slider-item [uk-slider-item]:hover::before {
    border-color: var(--rw-gold-deep, #806332);
    background: #e9dfcc;
}

.rw-family-projects #gallery .slider-item [uk-slider-item]:focus-visible {
    outline: 2px solid var(--rw-gold-deep, #806332) !important;
    outline-offset: 1px;
}

.rw-family-projects #gallery .uk-line-height-2 {
    right: 12px !important;
    bottom: 14px !important;
    box-sizing: border-box;
    width: 42px;
    min-width: 42px;
    height: 32px;
    min-height: 32px;
    border: 1px solid rgba(14, 21, 33, .22);
    border-radius: 0;
    background: var(--rw-ivory, #f6f2ea);
    color: var(--rw-ink, #0e1521) !important;
    font-size: 12px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.rw-family-projects #gallery .uk-line-height-2 > span {
    color: inherit !important;
}

/* Solid backing keeps controls readable over white plans and dark facades.
   Do not let UIkit's idle fade hide essential navigation on touch screens. */
.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-slidenav,
.rw-catalog-design.rw-family-projects .uk-lightbox .uk-position-top-right,
.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-counter {
    opacity: 1 !important;
    visibility: visible !important;
}

.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-slidenav {
    margin: 0 max(12px, env(safe-area-inset-left), env(safe-area-inset-right));
}

.rw-catalog-design.rw-family-projects .uk-lightbox [uk-lightbox-item],
.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-close {
    display: inline-flex;
    box-sizing: border-box;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(246, 242, 234, .5);
    border-radius: 50%;
    background: #0e1521;
    color: #f6f2ea !important;
    text-decoration: none !important;
    transition: background-color 160ms ease-out, border-color 160ms ease-out;
}

.rw-catalog-design.rw-family-projects .uk-lightbox [uk-lightbox-item] svg {
    width: 11px;
    height: 19px;
}

.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-close svg {
    width: 16px;
    height: 16px;
}

.rw-catalog-design.rw-family-projects .uk-lightbox [uk-lightbox-item] svg *,
.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-close svg * {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
}

.rw-catalog-design.rw-family-projects .uk-lightbox [uk-lightbox-item]:hover,
.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-close:hover {
    background: #1a2734;
    border-color: var(--rw-gold, #c7a86a);
}

.rw-catalog-design.rw-family-projects .uk-lightbox [uk-lightbox-item]:focus-visible,
.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-close:focus-visible {
    outline: 2px solid var(--rw-gold, #c7a86a);
    outline-offset: 3px;
}

.rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-counter {
    padding: 7px 12px;
    border-radius: 16px;
    background: #0e1521;
    color: #f6f2ea !important;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce) {
    .rw-family-projects #gallery .slider-item [uk-slider-item],
    .rw-family-projects #gallery .slider-item [uk-slider-item]::before,
    .rw-catalog-design.rw-family-projects .uk-lightbox [uk-lightbox-item],
    .rw-catalog-design.rw-family-projects .uk-lightbox .uk-lightbox-close {
        transition: none !important;
    }
}
