/* One long authored sheet per finish. The background is never tiled or stretched vertically. */
#hair-gallery[data-material=preto]{--material-image:url('media/pillar-preto-long-v52-web-r11.webp')}
#hair-gallery[data-material=dourado]{--material-image:url('media/pillar-dourado-long-v52-web-r11.webp')}
#hair-gallery[data-material=granito]{--material-image:url('media/pillar-granito-long-v52-web-r11.webp')}
#hair-gallery[data-material] .vitrine-content{background-repeat:no-repeat,no-repeat;background-size:100% 100%,cover;background-position:center top}
#hair-gallery[data-material] .assistance-copy h3,#hair-gallery[data-material] .piece-guidance>h3{color:var(--material-ink)}
#hair-gallery[data-material] .catalogue-pagination{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:24px;margin-top:40px;padding:24px;background:var(--material-panel);border-top:1px solid var(--material-rule);color:var(--material-ink)}
#hair-gallery[data-material] .catalogue-pagination button{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 0;background:transparent;border:0;color:var(--material-ink);font:13px/1.5 Manrope,Arial,sans-serif;cursor:pointer}
#hair-gallery .catalogue-page-previous{justify-self:start}
#hair-gallery .catalogue-page-next{justify-self:end}
#hair-gallery .catalogue-page-previous svg{transform:rotate(180deg)}
#hair-gallery .catalogue-pagination svg{width:20px;height:20px;flex:none}
#hair-gallery[data-material] .catalogue-pagination button:disabled{opacity:.45;cursor:default}
#hair-gallery[data-material] .catalogue-pagination button:not(:disabled):hover{text-decoration:underline;text-underline-offset:5px}
.catalogue-page-reading{text-align:center;font-variant-numeric:tabular-nums}
.catalogue-page-label{margin:0;font:500 14px/1.5 Manrope,Arial,sans-serif}
.catalogue-page-range{margin:6px 0 0;font:12px/1.6 Manrope,Arial,sans-serif}
@media(max-width:620px){
 #hair-gallery[data-material] .catalogue-pagination{gap:8px;padding:16px 12px;margin-top:28px}
 #hair-gallery[data-material] .catalogue-pagination button{gap:5px;font-size:11px}
 #hair-gallery .catalogue-page-label{font-size:12px}
 #hair-gallery .catalogue-page-range{font-size:11px}
 #hair-gallery .catalogue-pagination svg{width:16px;height:16px}
}
