/* Handmade collection: what WordPress outputs differently from the design markup (forge.css has the rest). */

/* Collection listing */
.dir-b .pieces-shop{transition:opacity .15s}
.dir-b .pieces-shop.is-loading .pieces-main{opacity:.45;pointer-events:none}
.dir-b .pieces-main{min-width:0}
.dir-b .cats .th img.cover{width:100%;height:100%;object-fit:cover}
.dir-b .cats .mto-th{background:var(--ember);border-color:var(--ember);color:var(--ink)}
.dir-b .cats .mto .ct{white-space:nowrap}
.dir-b .cats a:hover .th{border-color:var(--ink)}
.dir-b .fgroup .pill:hover{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.dir-b .fgroup a.tog{color:inherit}
.dir-b .fgroup a.tog:hover .sw:not(.on){background:#BDB8B0}
.dir-b .psort{position:relative;cursor:pointer}
.dir-b .psort select{appearance:none;-webkit-appearance:none;border:0;background:transparent;font:inherit;color:inherit;padding:0;cursor:pointer;min-height:44px}
.dir-b .psort select:focus-visible{outline:none}
.dir-b .psort:focus-within{outline:3px solid var(--steel);outline-offset:2px}
.dir-b .psort>span{display:flex;align-items:center}
.dir-b .tbar .psort{min-width:220px}
.dir-b .fbtn button.sel{justify-content:flex-start;gap:10px;cursor:pointer}
.dir-b .fbtn .sel small{margin-inline-start:auto;min-width:22px;height:22px;display:grid;place-items:center;background:var(--ember);color:var(--ink);font-size:12px}
.dir-b .fbtn .psort{justify-content:space-between}
.dir-b .fbtn .psort select{width:100%}
.dir-b .cc{display:block;color:inherit}
.dir-b .cc .ph img{transition:transform .4s ease}
.dir-b .cc:hover .ph img,.dir-b .more3 a:hover .ph img,.dir-b .hm a:hover .ph img{transform:scale(1.03)}
.dir-b .cc:hover h3,.dir-b .more3 a:hover h3,.dir-b .hm a:hover h3{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
.dir-b .more3 .ph img,.dir-b .hm .ph img{transition:transform .4s ease}
.dir-b .cgrid .promo .btn{color:var(--ink)}
.dir-b .pempty{grid-column:1/-1;font-size:17px;color:var(--mute)}
.dir-b .pempty a{text-decoration:underline;color:var(--ink)}
.dir-b .loadmore .btn.is-loading{opacity:.6}
/* Phone filter drawer */
.dir-b .pdrawer{position:fixed;inset:0;z-index:80;overflow:hidden}
.dir-b .pdrawer[hidden]{display:none}
.dir-b .pdrawer .drawer-b{overflow-y:auto;flex:1 1 auto;min-height:0}
.dir-b .pdrawer .drawer-h .x{width:44px;height:44px;background:var(--white);color:var(--ink);display:grid;place-items:center}
.dir-b .pdrawer .fside,.dir-b .pdrawer .fgroup{display:block}
body.pdrawer-open{overflow:hidden}
@media (min-width:1024px){.dir-b .pdrawer{display:none!important}}
@media (max-width:1023px){
  .dir-b .cats-m{overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .dir-b .cats-m::-webkit-scrollbar{display:none}
  .dir-b .cats-m .chip{flex:none}
  .dir-b .fbtn .sel{min-width:0}
  .dir-b .pieces-main .fbtn{margin:28px 0 4px}
  /* Two columns: an odd last card sits centred on its own row */
  .dir-b .cgrid>.cc:nth-last-child(1 of .cc):nth-child(odd of .cc){grid-column:1/-1;justify-self:center;width:calc(50% - 6px)}
}

/* Piece page */
.dir-b .mosaic a{display:block;width:100%;height:100%}
.dir-b .mosaic div{background:var(--line)}
.dir-b .mosaic .count{border:0;cursor:pointer;z-index:1}
.dir-b .mosaic .count:hover{background:var(--iron-2)}
.dir-b .mosaic img{transition:transform .4s ease}
.dir-b .mosaic a:hover img{transform:scale(1.02)}
.dir-b .spec .pr dd .num{font:inherit}
.dir-b .spec div:last-child:nth-child(odd){grid-column:1/-1}
.dir-b .yours.solo{border-top:1px solid var(--ink);margin-top:28px}
.dir-b .og button{min-height:40px;display:inline-flex;align-items:center;padding:0 14px;border:1px solid var(--line);font-size:15px;background:transparent;cursor:pointer}
.dir-b .og button:hover{border-color:var(--ink)}
.dir-b .og button.on{border:2px solid var(--ink);font-weight:600;padding:0 13px}
.dir-b .pinfo .ctas .btn{width:100%}
.dir-b .assure .i{color:var(--mute);margin-top:2px}
/* Story with accordions (.acc from the design, built by sanai3i_accordion) */
.dir-b .story .ph img{height:100%}
.dir-b .story.noimg{grid-template-columns:1fr}
.dir-b .story-text>*+*{margin-top:1em}
.dir-b .story .acc>div{display:block;padding:0;border-bottom:1px solid var(--line-d);font:inherit;letter-spacing:0;text-transform:none}
.dir-b .story .acc .q{display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;padding:16px 0;text-align:start;color:var(--white);font-family:'Archivo Narrow',sans-serif;font-weight:600;font-size:17px;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.dir-b .story .acc .q:hover i{border-color:var(--white)}
.dir-b .story .acc i{flex:none}
.dir-b .story .acc .a{padding:0 0 20px;color:var(--mute-d);font-size:16px;line-height:1.7;max-width:60ch}
.dir-b .story .acc .a[hidden]{display:none}
.dir-b .story .acc .a>*+*{margin-top:.8em}
.dir-b .more3>a{display:block;color:inherit;min-width:0}
.dir-b .more3 .ph{background:var(--line)}
/* Full-screen photo viewer */
.dir-b .plbox{position:fixed;inset:0;z-index:200;min-height:0;overflow:auto}
.dir-b .plbox[hidden]{display:none}
body.lbox-open{overflow:hidden}
.dir-b .plbox .lbox-m .img{height:min(640px,calc(100vh - 320px));min-height:240px}
.dir-b .plbox .lbox-h .x{cursor:pointer;border:0}
.dir-b .plbox .nav-b{cursor:pointer;color:var(--white)}
.dir-b .plbox .nav-b.e{color:var(--ink)}
.dir-b .plbox .nav-b:hover{border-color:var(--white)}
.dir-b .plbox .lbox-cap{min-height:1.6em}
.dir-b .plbox .lbox-t button{width:96px;height:72px;overflow:hidden;opacity:.5;flex:none;cursor:pointer;padding:0;border:0}
.dir-b .plbox .lbox-t button.on{opacity:1;box-shadow:0 0 0 2px var(--ember)}
.dir-b .plbox .lbox-t button:hover{opacity:.85}
.dir-b.rtl .plbox .nav-b svg{transform:scaleX(-1)}
@media (max-width:1023px){
  .dir-b .plbox{display:flex}
  .dir-b .plbox[hidden]{display:none}
  .dir-b .plbox .lbox-m .img{height:min(520px,calc(100vh - 260px))}
  .dir-b .plbox .lbox-t{overflow-x:auto;scrollbar-width:none}
  .dir-b .plbox .lbox-t button{width:72px;height:56px}
  .dir-b .story .acc .q{font-size:15px}
}

/* Home "Made to measure" (block sanai3i/pieces-grid) */
.dir-b .hm>a{display:block;color:inherit;min-width:0}
.dir-b .hm>a:not(:first-child) .cap{flex-direction:column;gap:4px}
.dir-b .hm .ph{background:var(--line)}

/* Arabic */
.dir-b.rtl .cc h3,.dir-b.rtl .more3 h3,.dir-b.rtl .og button,.dir-b.rtl .yours p{line-height:1.6}
.dir-b.rtl .pinfo h1,.dir-b.rtl .yours h3,.dir-b.rtl .promo h3,.dir-b.rtl .how h3,.dir-b.rtl .tbar .cnt,.dir-b.rtl .lbox-h b,.dir-b.rtl .drawer-h b{font-family:'Noto Kufi Arabic',sans-serif;font-weight:700;font-stretch:100%;letter-spacing:0;text-transform:none}
.dir-b.rtl .pinfo h1{font-size:44px;line-height:1.35}
.dir-b.rtl .promo h3{line-height:1.4}
.dir-b.rtl .pinfo .tags span,.dir-b.rtl .spec dt,.dir-b.rtl .og small,.dir-b.rtl .story .acc .q,.dir-b.rtl .tag,.dir-b.rtl .crumbs,.dir-b.rtl .fgroup h4,.dir-b.rtl .loadmore p,.dir-b.rtl .mosaic .count,.dir-b.rtl .sel small{font-family:'IBM Plex Sans Arabic',sans-serif;font-weight:600;letter-spacing:0;text-transform:none}
.dir-b.rtl .spec .pr dd small{font-family:'IBM Plex Sans Arabic',sans-serif}
.dir-b.rtl .spec .pr dd{font-family:'IBM Plex Sans Arabic',sans-serif;font-stretch:100%}
@media (max-width:1023px){
  .dir-b.rtl .pinfo h1{font-size:30px}
}
/* theme.json sets every heading upper-case; the design's card names are sentence case. */
.dir-b .cc h3,.dir-b .more3 h3,.dir-b .hm h3{text-transform:none;letter-spacing:0}
.dir-b .more3 .cap{flex-direction:column;gap:4px}
.dir-b .spec .pr dd small{text-transform:uppercase}
@media (max-width:1023px){
  .dir-b .more3{overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;padding-bottom:4px}
  .dir-b .more3::-webkit-scrollbar{display:none}
  .dir-b .more3>a{scroll-snap-align:start}
}