/* Ranalo Swatches & Gallery */

/* ---------- swatches ---------- */
.rcs-wrap select{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden;clip:rect(0 0 0 0)}
.rcs-wrap{position:relative}
.rcs-swatches{display:flex;flex-wrap:wrap;gap:10px;padding:4px 0}
.rcs-sw{-webkit-appearance:none;appearance:none;margin:0;padding:0;background:#fff;color:#1d1d1b;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;text-transform:none;letter-spacing:0;font-weight:500;line-height:1;min-height:0;box-shadow:none;transition:border-color .15s,box-shadow .15s,opacity .15s;position:relative}
.rcs-sw:focus{outline:none}
.rcs-sw:focus-visible{outline:2px solid #d4690f;outline-offset:3px}

/* buttons: storage, RAM */
.rcs-type-button .rcs-sw{min-width:64px;height:44px;padding:0 14px;border:1px solid #cfcac0;border-radius:6px;font-size:15px}
.rcs-type-button .rcs-sw.is-selected{border:2px solid #0b4a1f;color:#0b4a1f;font-weight:700;background:#f2f8f3}

/* colours */
.rcs-type-color .rcs-sw{width:42px;height:42px;border-radius:50%;border:1px solid #d4d0c8;display:flex;align-items:center;justify-content:center}
.rcs-type-color .rcs-dot{display:block;width:34px;height:34px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.rcs-type-color .rcs-sw.is-selected{border:2px solid #111;box-shadow:0 0 0 1px #fff inset}

/* images */
.rcs-type-image .rcs-sw{width:52px;height:52px;border-radius:8px;border:1px solid #d4d0c8;overflow:hidden;display:flex;align-items:center;justify-content:center;font-size:12px}
.rcs-type-image .rcs-img{width:100%;height:100%;object-fit:cover;display:block}
.rcs-type-image .rcs-sw.is-selected{border:2px solid #111}

/* not available with the other choices: faded, still tappable (it switches the other choices) */
.rcs-sw.is-disabled{opacity:.4}
.rcs-sw.is-disabled:after{content:"";position:absolute;left:50%;top:6%;bottom:6%;width:1px;background:#8a857b;transform:rotate(45deg)}
.rcs-type-button .rcs-sw.is-disabled:after{top:2px;bottom:2px;transform:rotate(60deg)}

.rcs-chosen{display:block;font-weight:400;font-size:13px;line-height:1.3;color:#5d655f;margin-top:2px}
form.rcs-ready table.variations{table-layout:auto;width:100%}
form.rcs-ready .variations td,form.rcs-ready .variations th{vertical-align:middle}
form.rcs-ready .variations th.label,form.rcs-ready .variations td.label{width:96px;max-width:96px;padding-right:10px}
form.rcs-ready .variations .label label{white-space:normal;word-break:break-word;display:block}
form.rcs-ready .variations td.value{width:auto}

/* ---------- shop card dots ---------- */
.rcs-loop{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0 2px}
.rcs-ld{-webkit-appearance:none;appearance:none;margin:0;padding:0;width:28px;height:28px;min-height:0;border-radius:50%;border:1px solid #d4d0c8;background:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:none}
.rcs-ld span{display:block;width:22px;height:22px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.rcs-ld.is-selected{border:2px solid #111}
.rcs-more{font-size:13px;color:#5d655f;text-decoration:none}

/* ---------- gallery ---------- */
.rcg{position:relative;margin-bottom:20px}
.rcg-main{position:relative}
.rcg-track{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;outline:none}
.rcg-track::-webkit-scrollbar{display:none}
.rcg-slide{flex:0 0 100%;margin:0;scroll-snap-align:center;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;background:#fff}
.rcg-slide img{display:block;width:100%;height:100%;object-fit:contain;cursor:zoom-in}
.rcg-nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;min-height:0;margin:0;padding:0;border-radius:50%;border:1px solid #e6e3dc;background:rgba(255,255,255,.92);color:#1d1d1b;font-size:26px;line-height:36px;text-align:center;cursor:pointer;opacity:0;transition:opacity .2s;z-index:2;box-shadow:none}
.rcg-prev{left:8px}.rcg-next{right:8px}
.rcg-main:hover .rcg-nav{opacity:1}
.rcg-single .rcg-nav{display:none}
@media (hover:none){.rcg-main .rcg-nav{display:none}}
.rcg-zoom{position:absolute;right:10px;bottom:10px;width:36px;height:36px;min-height:0;margin:0;padding:0;border-radius:50%;border:1px solid #e6e3dc;background:rgba(255,255,255,.92);color:#1d1d1b;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;box-shadow:none}
.rcg-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:10px}
.rcg-thumbs:empty{display:none}
.rcg-thumb{-webkit-appearance:none;appearance:none;margin:0;padding:0;min-height:0;aspect-ratio:1/1;border:2px solid transparent;border-radius:6px;background:#fff;cursor:pointer;opacity:.55;transition:opacity .15s,border-color .15s;overflow:hidden;touch-action:manipulation;box-shadow:none}
.rcg-thumb img{display:block;width:100%;height:100%;object-fit:contain}
.rcg-thumb.is-active,.rcg-thumb:hover{opacity:1}
.rcg-thumb.is-active{border-color:#ddd}
@media (max-width:549px){.rcg-thumbs{gap:8px}}

/* lightbox */
html.rcg-lb-open,html.rcg-lb-open body{overflow:hidden}
.rcg-lb{position:fixed;inset:0;z-index:2147483000;background:rgba(10,12,10,.94);display:flex;align-items:center}
.rcg-lb-track{display:flex;width:100%;height:100%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.rcg-lb-track::-webkit-scrollbar{display:none}
.rcg-lb-slide{flex:0 0 100%;margin:0;scroll-snap-align:center;display:flex;align-items:center;justify-content:center;padding:56px 12px}
.rcg-lb-slide img{max-width:100%;max-height:100%;object-fit:contain;background:#fff;border-radius:6px}
.rcg-lb-close{position:absolute;top:12px;right:12px;width:44px;height:44px;min-height:0;margin:0;padding:0;border-radius:50%;border:0;background:rgba(255,255,255,.15);color:#fff;font-size:30px;line-height:44px;cursor:pointer}
.rcg-lb .rcg-nav{opacity:1;background:rgba(255,255,255,.15);color:#fff;border:0}