/* Retronaga auctions on the website (2026-10-13). Same look as the app: light grey page, white cards, black and red,
   Poppins for headings and Montserrat for text, the dark bid bar. Phone first; the desktop layout widens from 900px. */
.rn-auc{--k:#0A0A0A;--bg:#EAEAEA;--card:#fff;--red:#D8372E;--green:#1B9E5A;--amber:#D98B00;--grey:#8A8A8A;--line:#E3E3E3;--soft:#F3F3F3;
  --disp:'Poppins',-apple-system,system-ui,sans-serif;--ui:'Montserrat',-apple-system,system-ui,sans-serif;--nav:var(--rnh-nav-h,84px);
  background:var(--bg);color:var(--k);font-family:var(--ui);min-height:70vh;-webkit-font-smoothing:antialiased;width:100%;}
.rn-auc *,.rna-modal *{box-sizing:border-box;}
/* the theme styles every link, button and field; :where() keeps these resets weaker than the classes below */
.rn-auc :where(a){color:inherit;text-decoration:none;}
.rn-auc :where(a):hover{color:inherit;}
.rn-auc :where(button),.rna-modal :where(button){margin:0;min-height:0;min-width:0;line-height:1.2;text-transform:none;letter-spacing:normal;box-shadow:none;font-family:var(--ui);cursor:pointer;vertical-align:middle;}
.rn-auc :where(input,select),.rna-modal :where(input,select){margin:0;box-shadow:none;max-width:none;}
.rn-auc :where(h1,h2,h3),.rna-modal :where(h1,h2,h3){text-transform:none;letter-spacing:normal;}
.rna-wrap{max-width:1180px;margin:0 auto;padding:22px 16px calc(var(--nav) + 40px);}
@media (min-width:769px){.rna-wrap{padding:34px 24px 64px;}}
body.rn-auc-page #main,body.rn-auc-page .page-wrapper{background:#EAEAEA;}
body.rn-auc-page .page-wrapper{padding-top:0;padding-bottom:0;}

/* headings and small parts */
.rna-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px;}
.rna-h1{font-family:var(--disp);font-weight:800;font-size:24px;line-height:1.15;letter-spacing:-.01em;margin:0;text-transform:none;color:var(--k);}
@media (min-width:769px){.rna-h1{font-size:32px;}}
.rna-acts{display:flex;gap:8px;flex-wrap:wrap;}
.rna-pill{white-space:nowrap;display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--k);background:transparent;color:var(--k);border-radius:999px;padding:8px 14px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;line-height:1;}
.rna-pill:hover{background:var(--k);color:#fff;}
.rna-tagrow{display:flex;align-items:center;justify-content:space-between;margin:26px 0 12px;}
.rna-tag{display:inline-flex;align-items:center;gap:7px;background:var(--red);color:#fff;font-family:var(--disp);font-weight:700;font-size:11px;letter-spacing:.12em;padding:6px 11px;text-transform:uppercase;}
.rna-tag.muted{background:#2E2E2E;}
.rna-dot{width:7px;height:7px;border-radius:50%;background:#fff;display:inline-block;animation:rna-blink 1.6s ease-in-out infinite;}
@keyframes rna-blink{50%{opacity:.35}}
.rna-back{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#444;margin-bottom:14px;}
.rna-back:hover{color:var(--k);}
.rna-muted{color:var(--grey);}
.rna-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;border:0;border-radius:12px;background:var(--k);color:#fff;font-family:var(--ui);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;padding:15px 18px;line-height:1.1;}
.rna-btn:hover{background:#222;}
.rna-btn[disabled]{opacity:.55;cursor:default;}
.rna-btn.white{background:#fff;color:var(--k);}
.rna-btn.white:hover{background:#f1f1f1;}
.rna-btn.ghost{background:transparent;color:var(--k);border:1.5px solid var(--k);}
.rna-btn.green{background:var(--green);}
.rna-btn.sm{width:auto;padding:10px 14px;font-size:11px;border-radius:9px;}

/* cards on the auctions page */
.rna-cards{display:grid;grid-template-columns:1fr;gap:14px;}
@media (min-width:769px){.rna-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;}}
.rna-live{display:block;background:var(--k);color:#fff;border-radius:18px;overflow:hidden;transition:transform .15s ease;}
.rna-live:hover,.rna-up:hover,.rna-lc:hover{transform:translateY(-2px);}
.rna-collage{display:flex;height:170px;background:#161616;gap:2px;}
.rna-collage img{flex:1;min-width:0;height:100%;object-fit:cover;display:block;background:#fff;}
@media (min-width:769px){.rna-collage{height:260px;}}
.rna-cbody{padding:16px;}
.rna-ctitle{font-family:var(--disp);font-weight:700;font-size:17px;line-height:1.25;}
.rna-cmeta{font-size:12px;color:#B5B5B5;margin-top:6px;font-weight:500;}
.rna-cfoot{display:flex;align-items:center;justify-content:space-between;margin-top:14px;font-size:12px;font-weight:600;}
.rna-cfoot .rna-green{display:inline-flex;align-items:center;gap:7px;}
.rna-cfoot .rna-green:before{content:"";width:8px;height:8px;border-radius:50%;background:#3CC24D;}
.rna-chev{font-size:22px;line-height:1;}
.rna-up{display:block;background:var(--card);border-radius:18px;overflow:hidden;transition:transform .15s ease;}
.rna-up .rna-hero{width:100%;height:190px;object-fit:cover;display:block;background:#161616;}
@media (min-width:769px){.rna-up .rna-hero{height:260px;}}
.rna-up .rna-cmeta{color:var(--grey);}
.rna-up .rna-btn{margin-top:14px;}

/* empty */
.rna-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:40px 20px 30px;}
.rna-empty img{width:200px;height:200px;object-fit:contain;margin-bottom:6px;}
.rna-empty h2{font-family:var(--disp);font-weight:800;font-size:20px;letter-spacing:.02em;text-transform:uppercase;margin:0 0 8px;color:var(--k);}
.rna-empty p{color:var(--grey);font-size:14px;line-height:1.55;max-width:360px;margin:0 auto 18px;}
.rna-empty .rna-btn{max-width:260px;}

/* one auction: the strip and the lot grid */
.rna-strip{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--k);color:#fff;border-radius:12px;padding:12px 14px;font-size:12px;font-weight:600;margin:12px 0 14px;}
.rna-strip span:last-child{color:#B5B5B5;text-align:right;}
.rna-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;}
@media (min-width:600px){.rna-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;}}
@media (min-width:1000px){.rna-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;}}
.rna-lc{display:block;background:var(--card);border-radius:12px;overflow:hidden;position:relative;transition:transform .15s ease;}
.rna-lc.wide{grid-column:1/-1;}
.rna-lc .rna-limg{width:100%;aspect-ratio:1/1;background:#fff;position:relative;}
.rna-lc .rna-limg img{width:100%;height:100%;object-fit:cover;display:block;}
.rna-lc.wide .rna-limg{aspect-ratio:auto;height:240px;}
.rna-lc.wide .rna-limg img{object-fit:contain;}
@media (min-width:769px){.rna-lc.wide .rna-limg{height:340px;}}
.rna-badge{position:absolute;left:7px;top:7px;background:var(--k);color:#fff;border-radius:999px;font-size:9px;font-weight:700;padding:3px 7px;letter-spacing:.04em;}
.rna-badge.red{background:var(--red);}
.rna-lbody{padding:7px 8px 9px;}
@media (min-width:769px){.rna-lbody{padding:10px 12px 12px;}}
.rna-ltitle{font-size:11px;font-weight:600;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.6em;}
@media (min-width:769px){.rna-ltitle{font-size:13px;}}
.rna-lrow{display:flex;align-items:baseline;justify-content:space-between;gap:4px;margin-top:5px;}
.rna-lprice{font-weight:800;font-size:13px;}
@media (min-width:769px){.rna-lprice{font-size:15px;}}
.rna-lsub{font-size:9.5px;color:var(--grey);font-weight:600;white-space:nowrap;}
.rna-lsub.hot{color:var(--red);}

/* one lot */
.rna-lot{display:grid;grid-template-columns:1fr;gap:0;}
@media (min-width:900px){.rna-lot{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:28px;align-items:start;}}
.rna-gal{position:relative;margin:0 -16px;}
@media (min-width:769px){.rna-gal{margin:0;}}
.rna-slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;background:#fff;}
.rna-slides::-webkit-scrollbar{display:none;}
.rna-slide{flex:0 0 100%;scroll-snap-align:center;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;background:#fff;cursor:zoom-in;}
.rna-slide img{width:100%;height:100%;object-fit:contain;display:block;}
@media (min-width:900px){.rna-slides{border-radius:18px;}}
.rna-gdots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:6px;}
.rna-gdots i{width:6px;height:6px;border-radius:50%;background:rgba(0,0,0,.25);}
.rna-gdots i.on{background:var(--k);}
.rna-thumbs{display:none;gap:10px;margin-top:12px;flex-wrap:wrap;}
@media (min-width:900px){.rna-thumbs{display:flex;}.rna-gdots{display:none;}}
.rna-thumbs button{width:72px;height:72px;border-radius:10px;border:2px solid transparent;background:#fff;padding:0;overflow:hidden;}
.rna-thumbs button.on{border-color:var(--k);}
.rna-thumbs img{width:100%;height:100%;object-fit:cover;display:block;}
.rna-hbadge{position:absolute;left:14px;top:14px;background:var(--k);color:#fff;border-radius:999px;font-size:11px;font-weight:700;padding:5px 10px;letter-spacing:.04em;}
.rna-hbadge.red{background:var(--red);}
.rna-star{position:absolute;right:14px;top:14px;display:inline-flex;align-items:center;gap:5px;background:#fff;border:0;border-radius:999px;padding:6px 11px;font-size:12px;font-weight:700;box-shadow:0 1px 6px rgba(0,0,0,.12);}
.rna-star.on{background:var(--k);color:#fff;}
.rna-info{min-width:0;}
.rna-blk{background:var(--card);padding:18px 16px;margin:0 -16px 8px;}
@media (min-width:769px){.rna-blk{margin:0 0 14px;border-radius:18px;padding:20px 22px;}}
.rna-ltitle-big{font-family:var(--disp);font-weight:700;font-size:21px;line-height:1.25;margin:0 0 6px;color:var(--k);}
@media (min-width:769px){.rna-ltitle-big{font-size:26px;}}
.rna-lmeta{font-size:13px;color:var(--grey);font-weight:500;margin:0;}
.rna-pricebig{display:flex;align-items:flex-end;justify-content:space-between;margin-top:14px;}
.rna-plabel{font-size:10.5px;font-weight:700;letter-spacing:.08em;color:var(--grey);text-transform:uppercase;}
.rna-pval{font-family:var(--disp);font-weight:800;font-size:30px;line-height:1.05;margin-top:2px;}
.rna-pval.flash{animation:rna-flash .9s ease;}
@keyframes rna-flash{0%{color:var(--green);transform:scale(1.06)}100%{color:inherit;transform:none}}
.rna-ship{font-size:12.5px;color:#555;margin-top:6px;font-weight:500;}
.rna-timer{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--soft);border-radius:12px;padding:12px 14px;margin-top:14px;}
.rna-timer.urgent{background:#FDECEA;}
.rna-tlabel{font-size:10.5px;font-weight:700;letter-spacing:.06em;color:var(--grey);text-transform:uppercase;}
.rna-tval{font-family:var(--disp);font-weight:800;font-size:26px;line-height:1.1;margin-top:2px;}
.rna-timer.urgent .rna-tval,.rna-timer.urgent .rna-tlabel{color:var(--red);}
.rna-tnote{font-size:11.5px;color:var(--grey);text-align:right;max-width:50%;font-weight:500;}
.rna-banner{display:flex;align-items:center;gap:10px;border-radius:12px;padding:12px 14px;margin-top:12px;font-size:13px;font-weight:600;line-height:1.4;}
.rna-banner.green{background:#E3F6EC;color:var(--green);}
.rna-banner.grey{background:var(--soft);color:#555;}
.rna-banner.amber{background:#FFF4DC;color:#8a5a00;}
.rna-wonacts{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.rna-sec{font-family:var(--disp);font-weight:700;font-size:15px;margin:0 0 10px;display:flex;justify-content:space-between;align-items:baseline;color:var(--k);}
.rna-sec small{font-family:var(--ui);font-weight:600;font-size:11px;color:var(--grey);}
.rna-hist{list-style:none;margin:0;padding:0;}
.rna-hist li{display:flex;align-items:center;justify-content:space-between;padding:9px 0;border-top:1px solid var(--line);font-size:13px;}
.rna-hist li:first-child{border-top:0;}
.rna-hist .me{color:var(--green);font-weight:700;}
.rna-hist small{color:var(--grey);font-size:11px;margin-left:8px;}
.rna-link{background:none;border:0;padding:8px 0 0;font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--k);text-transform:uppercase;}
.rna-desc{font-size:13.5px;line-height:1.65;color:#333;white-space:pre-line;}
.rna-attrs{margin-top:12px;border-top:1px solid var(--line);}
.rna-attr{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--line);font-size:13px;}
.rna-attr span:first-child{color:var(--grey);font-weight:600;}
.rna-attr span:last-child{font-weight:600;text-align:right;}
.rna-other{margin:6px 0 0;}

/* the bid bar: fixed at the bottom on a phone (above the shell's tabs), a card in the right column on a computer */
.rna-dock{background:var(--k);color:#fff;padding:12px 14px 14px;z-index:997;}
@media (max-width:899px){
  .rna-dock{position:fixed;left:0;right:0;bottom:var(--nav);box-shadow:0 -6px 18px rgba(0,0,0,.18);}
  body:not(.rn-home-page) .rna-dock{bottom:0;padding-bottom:calc(14px + env(safe-area-inset-bottom));}
}
@media (min-width:769px) and (max-width:899px){
  .rna-dock{bottom:0;padding-bottom:calc(14px + env(safe-area-inset-bottom));}
  .rn-auc-lot .rna-wrap{padding-bottom:calc(var(--nav) + 180px);}
}
@media (min-width:900px){.rna-dock{border-radius:18px;padding:18px;position:sticky;top:110px;margin-bottom:14px;}}
.rna-dhead{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px;}
.rna-dtitle{font-family:var(--disp);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;}
.rna-dtitle.green{color:#3CC24D;}.rna-dtitle.red{color:#FF6B5B;}
.rna-dlink{background:none;border:0;color:#B5B5B5;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:0;}
.rna-dline{font-size:11.5px;color:#B5B5B5;line-height:1.45;margin:-2px 0 10px;}
.rna-drow{display:flex;gap:10px;align-items:stretch;}
.rna-step{display:flex;align-items:center;background:#1C1C1C;border-radius:12px;padding:4px;flex:0 0 auto;}
.rna-step button{width:40px;height:44px;border:0;border-radius:9px;background:#2E2E2E;color:#fff;font-size:20px;font-weight:600;line-height:1;}
.rna-step button[disabled]{opacity:.35;}
.rna-step input{width:76px;height:44px;border:0;background:transparent;color:#fff;font-family:var(--disp);font-weight:800;font-size:20px;text-align:center;-moz-appearance:textfield;outline:none;}
.rna-step input::-webkit-outer-spin-button,.rna-step input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.rna-drow .rna-btn{flex:1;min-width:0;white-space:nowrap;font-size:12px;letter-spacing:.04em;padding:12px 10px;}
.rna-quick{display:none;gap:6px;margin-top:9px;overflow-x:auto;scrollbar-width:none;}
.rna-dock.typing .rna-quick,.rna-dock.wide .rna-quick{display:flex;}
.rna-quick button{flex:0 0 auto;border:1px solid #3A3A3A;background:transparent;color:#fff;border-radius:999px;padding:7px 11px;font-size:11.5px;font-weight:700;}
.rna-quick button:hover{background:#222;}
.rna-dnote{font-size:12px;margin-top:9px;line-height:1.4;}
.rna-dnote.bad{color:#FF6B5B;}.rna-dnote.good{color:#3CC24D;}
.rna-signs{position:fixed;left:0;right:0;pointer-events:none;z-index:996;height:0;}
@media (max-width:899px){.rna-signs{bottom:calc(var(--nav) + 150px);}}
@media (min-width:900px){.rna-signs{bottom:40px;}}
.rna-sign{position:absolute;bottom:0;transform:translateX(-50%);background:#fff;color:var(--k);border-radius:999px;padding:7px 12px;font-size:12px;font-weight:800;box-shadow:0 4px 16px rgba(0,0,0,.18);animation:rna-float 3.2s ease-out forwards;white-space:nowrap;}
.rna-sign.me{background:var(--green);color:#fff;}
@keyframes rna-float{0%{opacity:0;transform:translate(-50%,10px)}12%{opacity:1}70%{opacity:1}100%{opacity:0;transform:translate(-50%,-90px)}}

/* my auctions */
.rna-segs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:14px -16px 14px;padding:0 16px;}
@media (min-width:769px){.rna-segs{margin:18px 0;padding:0;flex-wrap:wrap;}}
.rna-segs::-webkit-scrollbar{display:none;}
.rna-seg{flex:0 0 auto;line-height:1.2;border:0;background:#fff;color:var(--k);border-radius:999px;padding:9px 15px;font-size:12px;font-weight:700;}
.rna-seg.on{background:var(--k);color:#fff;}
.rna-rows{display:grid;grid-template-columns:1fr;gap:10px;}
@media (min-width:769px){.rna-rows{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}}
.rna-row{display:flex;gap:12px;background:#fff;border-radius:14px;padding:12px;align-items:center;}
.rna-row img{width:68px;height:68px;border-radius:10px;object-fit:cover;background:#f2f2f2;flex:0 0 auto;}
.rna-row .t{font-weight:700;font-size:13.5px;line-height:1.3;}
.rna-row .s{font-size:12px;color:#555;margin-top:4px;font-weight:500;}
.rna-row .s.green{color:var(--green);}.rna-row .s.red{color:var(--red);}
.rna-row .a{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap;}
.rna-none{color:var(--grey);font-size:14px;text-align:center;padding:30px 10px;}

/* sheets: up from the bottom on a phone, a centred dialog on a computer */
.rna-modal{position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.5);display:flex;align-items:flex-end;justify-content:center;animation:rna-fade .18s ease;font-family:'Montserrat',-apple-system,system-ui,sans-serif;color:#0A0A0A;}
@keyframes rna-fade{from{opacity:0}}
.rna-sheet{background:#fff;width:100%;max-height:92vh;overflow:auto;border-radius:22px 22px 0 0;padding:22px 20px calc(24px + env(safe-area-inset-bottom));animation:rna-up .22s ease;}
@keyframes rna-up{from{transform:translateY(30px);opacity:.6}}
@media (min-width:769px){.rna-modal{align-items:center;}.rna-sheet{max-width:470px;border-radius:20px;padding:26px 26px 24px;}}
.rna-sheet h3{font-family:'Poppins',-apple-system,system-ui,sans-serif;font-weight:800;font-size:20px;margin:0 0 8px;color:#0A0A0A;}
.rna-sheet p{font-size:13.5px;line-height:1.55;color:#555;margin:0 0 10px;}
.rna-sheet .rna-btn{margin-top:10px;}
.rna-sheet .rna-err{color:#D8372E;font-size:13px;margin-top:10px;min-height:1em;}
.rna-terms{margin:8px 0 6px;padding:0;list-style:none;}
.rna-terms li{position:relative;padding-left:20px;margin:0 0 10px;font-size:13.5px;line-height:1.5;color:#333;}
.rna-terms li:before{content:"";position:absolute;left:4px;top:7px;width:7px;height:7px;border-radius:50%;background:#0A0A0A;}
.rna-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;}
.rna-form input,.rna-form select{grid-column:span 2;height:46px;border:1.5px solid #E3E3E3;border-radius:11px;padding:0 13px;font-family:inherit;font-size:14px;background:#fff;color:#0A0A0A;}
.rna-form input.half{grid-column:span 1;}
.rna-form input:focus,.rna-form select:focus{outline:none;border-color:#0A0A0A;}
#rna-stripe{margin:14px 0 4px;min-height:120px;}
.rna-zoom{position:fixed;inset:0;z-index:100001;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;cursor:zoom-out;}
.rna-zoom img{max-width:94vw;max-height:90vh;object-fit:contain;}
.rna-toast{position:fixed;left:50%;bottom:calc(var(--rnh-nav-h,84px) + 20px);transform:translateX(-50%);background:#0A0A0A;color:#fff;border-radius:999px;padding:10px 16px;font-size:13px;font-weight:600;z-index:100002;animation:rna-fade .2s ease;}
@media (min-width:769px){.rna-toast{bottom:30px;}}

/* shimmer placeholders while things load (no spinners: Ahmed, 2026-10-09) */
.rna-sk{background:#E0E0E0;background-image:linear-gradient(90deg,#E0E0E0 0,#EFEFEF 40%,#E0E0E0 80%);background-size:600px 100%;animation:rna-shim 1.2s linear infinite;border-radius:10px;}
@keyframes rna-shim{from{background-position:-600px 0}to{background-position:600px 0}}
.rna-fade{animation:rna-in .28s ease both;}
@keyframes rna-in{from{opacity:0;transform:translateY(8px)}}
.rna-boot{min-height:60vh;}

[lang="ar"].rn-auc,.rn-auc [lang="ar"]{font-family:'Tajawal','Montserrat',-apple-system,system-ui,sans-serif;}
