/* R035 / REQ-109: printed books — admin screens S5 (form), S6 (printed orders), S7 (shipping label). Colors from brand-tokens.css. */
.print-form fieldset{border:1px solid var(--brand-line,#DDE2E2);border-radius:12px;padding:16px 18px;margin:0 0 18px;min-width:0}
.print-form legend{font-weight:700;padding:0 6px;color:var(--brand-midnight,#101820)}
.print-type-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.print-type-option{display:flex;flex-direction:column;gap:4px;border:1px solid var(--brand-line,#DDE2E2);border-radius:10px;padding:12px 14px;color:var(--brand-graphite,#30343B);text-decoration:none}
.print-type-option span{font-size:13px;color:var(--brand-muted,#5C656B)}
.print-type-option.is-selected{border:2px solid var(--brand-accessibleTeal,#006D70);background:var(--brand-tealTint,#E6F3F2)}
.print-fields{background:var(--brand-offWhite,#F7F7F5)}
.print-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:12px}
.print-counts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:0 0 18px}
.print-counts .metric-card,.print-counts .metric-card:first-child{text-decoration:none;background:#fff;color:var(--brand-graphite,#30343B)}
.print-counts .metric-card strong{color:var(--brand-midnight,#101820)}
.print-counts .metric-card.is-active{outline:2px solid var(--brand-accessibleTeal,#006D70)}
.print-low{border-inline-start:4px solid var(--brand-sand,#D8C3A5)}
.print-table tr.is-selected td{background:var(--brand-tealTint,#E6F3F2)}
.print-badge{margin-inline-start:8px;background:var(--brand-midnight,#101820);color:var(--brand-offWhite,#F7F7F5)}
.print-status-paid{background:var(--brand-tealTint,#E6F3F2);color:var(--brand-accessibleTeal,#006D70)}
.print-status-delivered{background:var(--brand-midnight,#101820);color:var(--brand-offWhite,#F7F7F5)}
.print-status-cancelled{background:var(--brand-offWhite,#F7F7F5);color:var(--brand-muted,#5C656B)}
.print-steps{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0 0 12px}
.print-steps li{border:1px solid var(--brand-line,#DDE2E2);border-radius:999px;padding:4px 12px;font-size:14px;color:var(--brand-muted,#5C656B)}
.print-steps li.is-done{background:var(--brand-tealTint,#E6F3F2);color:var(--brand-accessibleTeal,#006D70)}
.print-steps li.is-current{background:var(--brand-accessibleTeal,#006D70);border-color:var(--brand-accessibleTeal,#006D70);color:#fff;font-weight:700}
.print-cancelled{color:var(--brand-muted,#5C656B);font-weight:700}
.print-address{display:grid;gap:6px;margin:0 0 14px}
.print-address div{display:grid;grid-template-columns:110px 1fr;gap:8px}
.print-address dt{color:var(--brand-muted,#5C656B)}
.print-address dd{margin:0}
.print-stock{display:flex;flex-wrap:wrap;align-items:end;gap:12px;padding:10px 0;border-bottom:1px solid var(--brand-line,#DDE2E2)}
.print-stock>span{flex:1 1 220px}
.print-stock label{max-width:120px}
.print-stock .btn{width:auto}
.print-edit-note{margin:12px 0}
.print-label-layout{display:grid;grid-template-columns:minmax(0,auto) minmax(260px,320px);gap:24px;align-items:start}
.print-sheet{display:grid;gap:16px;justify-items:center}
.print-label{background:#fff;color:#101820;border:1px dashed var(--brand-muted,#5C656B);border-radius:6px;padding:4mm;display:flex;flex-direction:column;gap:3mm;font-size:11pt;line-height:1.45;box-sizing:border-box;overflow:hidden}
.print-label-100x150{width:100mm;height:150mm}
.print-label-a6{width:105mm;height:148mm}
.print-label header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #101820;padding-bottom:2mm}
.print-label-ref{display:flex;flex-direction:column;align-items:flex-end;font-size:9pt}
.print-label h3{margin:0;font-size:9pt;color:#5C656B;font-weight:600}
.print-label p{margin:0}
.print-label-to{border:1.5px solid #101820;border-radius:4px;padding:2mm 3mm;flex:1 1 auto}
.print-label-name{font-size:14pt;font-weight:700}
.print-ltr{direction:ltr;text-align:right}
.print-label header,.print-label footer{background:#fff;color:#101820;margin:0;position:static;box-shadow:none;border-radius:0;min-height:0}
.print-label footer{padding:0;display:flex;flex-direction:column;align-items:center;gap:1mm;font-size:9pt}
.print-barcode{width:100%;height:14mm;fill:#101820}
@media (max-width:760px){.print-counts{grid-template-columns:repeat(2,minmax(0,1fr))}.print-label-layout{grid-template-columns:1fr}.print-type-options{grid-template-columns:1fr}.print-sheet{overflow-x:auto;justify-items:start}}
/* Print document opened by «اطبع الملصق»: one label per page at the chosen size. */
@font-face{font-family:"SAYLX Label";src:url('/assets/fonts/ibm-plex-arabic-regular.woff2') format('woff2');font-weight:400}
@font-face{font-family:"SAYLX Label";src:url('/assets/fonts/ibm-plex-arabic-semibold.woff2') format('woff2');font-weight:600 800}
.print-label-doc{margin:0;background:#fff;font-family:"SAYLX Label",Tahoma,Arial,sans-serif}
@page label100{size:100mm 150mm;margin:0}
@page labela6{size:A6;margin:0}
.print-doc-100x150 .print-label{page:label100}
.print-doc-a6 .print-label{page:labela6}
@media print{
 .print-label-doc .print-label{border:0;border-radius:0;break-after:page}
 .print-label-doc .print-label:last-child{break-after:auto}
}
/* PR-B: storefront — S1 printed book page, S2 cart (copies, delivery address), S3 confirmation. Colors from brand-tokens.css only. */
.print-pill,.print-tag{display:inline-block;background:var(--brand-sand,#D8C3A5);color:var(--brand-midnight,#101820);border-radius:6px;padding:2px 10px;font-size:14px;font-weight:600;line-height:1.6;vertical-align:middle}
.print-tag{font-size:12px;padding:0 8px}
.print-tag.is-digital{background:var(--brand-tealTint,#E6F3F2);color:var(--brand-accessibleTeal,#006D70)}
.print-detail .detail-copy h1{margin-top:10px}
/* R050b (Hussain 16/10): the value sits right next to its label - one shared label column as wide as the longest label. */
.print-facts{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:10px;row-gap:8px;margin:16px 0 0}
.print-facts div{display:contents}
.print-facts dt{color:var(--brand-muted,#5C656B)}
.print-facts dd{margin:0;color:var(--brand-graphite,#30343B)}
.print-price{margin:0}
.print-price .price{font-size:40px;font-weight:700;color:var(--brand-midnight,#101820)}
.print-purchase .form-note{margin:4px 0 0}
.print-delivery{display:flex;flex-direction:column;gap:2px;border:2px solid var(--brand-accessibleTeal,#006D70);background:var(--brand-tealTint,#E6F3F2);border-radius:12px;padding:12px 16px;margin:16px 0 12px}
.print-delivery strong{color:var(--brand-midnight,#101820)}
.print-delivery span{color:var(--brand-graphite,#30343B);font-size:15px}
.print-stock-line{display:flex;align-items:center;gap:8px;margin:0 0 14px;font-weight:600;color:var(--brand-graphite,#30343B)}
.print-dot{width:9px;height:9px;border-radius:50%;background:var(--brand-accessibleTeal,#006D70);flex:none}
.print-stock-line.is-out{color:var(--brand-midnight,#101820)}
.print-stock-line.is-out .print-dot{background:var(--brand-muted,#5C656B)}
.print-purchase .purchase-actions .btn[disabled]{background:var(--brand-line,#DDE2E2);color:var(--brand-graphite,#30343B);border-color:var(--brand-line,#DDE2E2);cursor:not-allowed}
.print-replace{margin:12px 0 0}
.print-replace a,.print-confirm .form-note a{color:var(--brand-accessibleTeal,#006D70);text-decoration:underline;text-underline-offset:3px}
.print-note{background:var(--brand-tealTint,#E6F3F2);border-inline-start:4px solid var(--brand-accessibleTeal,#006D70);border-radius:8px;padding:12px 16px;margin:18px 0;color:var(--brand-graphite,#30343B)}
.print-about{font-size:18px;margin:18px 0 6px}
.cart-main{display:grid;gap:16px;align-content:start;min-width:0}
.print-qty{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--brand-line,#DDE2E2);border-radius:8px;margin-top:8px}
.print-qty-btn{min-width:40px;min-height:40px;border:0;background:none;font-size:18px;color:var(--brand-midnight,#101820);cursor:pointer}
.print-qty-btn[disabled]{color:var(--brand-line,#DDE2E2);cursor:not-allowed}
.print-qty output{min-width:24px;text-align:center;font-weight:700}
.print-ship h2{margin:0 0 4px}
.print-ship-fields{border:0;padding:0;margin:8px 0 0;min-width:0}
.print-ship-fields legend{font-weight:700;padding:0;margin-bottom:8px;color:var(--brand-midnight,#101820)}
.print-ship-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.print-ship-grid label,.print-ship-fields>label{display:flex;flex-direction:column;gap:6px;min-width:0}
.print-ship-fields>label{margin-top:12px}
.print-ship input:invalid:not(:placeholder-shown){border-color:var(--brand-graphite,#30343B)}
.print-mixed-note{background:var(--brand-tealTint,#E6F3F2);border-inline-start:4px solid var(--brand-accessibleTeal,#006D70);border-radius:8px;padding:10px 14px;margin:10px 0;font-size:14px;color:var(--brand-graphite,#30343B)}
.print-check{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:50%;background:var(--brand-tealTint,#E6F3F2);color:var(--brand-accessibleTeal,#006D70);font-size:26px;font-weight:700}
.print-confirm h2{font-size:18px;margin:20px 0 10px}
.print-progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;padding:0;margin:0 0 16px;gap:6px;text-align:center}
.print-progress li{position:relative;padding-top:30px;font-size:14px;color:var(--brand-muted,#5C656B)}
.print-progress li::before{content:"";position:absolute;top:0;inset-inline-start:50%;transform:translateX(50%);width:20px;height:20px;border-radius:50%;border:2px solid var(--brand-muted,#5C656B);background:#fff}
.print-progress li.is-done::before,.print-progress li.is-current::before{background:var(--brand-accessibleTeal,#006D70);border-color:var(--brand-accessibleTeal,#006D70)}
.print-progress li.is-current{font-weight:700;color:var(--brand-midnight,#101820)}
.print-address-box{background:var(--brand-offWhite,#F7F7F5);border:1px solid var(--brand-line,#DDE2E2);border-radius:12px;padding:4px 16px 12px;margin:0 0 16px}
.print-lines{display:grid;margin:0 0 12px}
.print-line{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--brand-line,#DDE2E2)}
.print-line-state{color:var(--brand-muted,#5C656B);font-size:14px}
.print-line-state a{color:var(--brand-accessibleTeal,#006D70)}
.print-line-total{font-weight:700;font-size:18px;border-bottom:0}
@media (max-width:760px){.print-ship-grid{grid-template-columns:minmax(0,1fr)}.print-price .price{font-size:32px}.print-line{grid-template-columns:minmax(0,1fr) auto}.print-line-state{grid-column:1/-1;grid-row:2}.print-line-state:empty{display:none}.print-progress li{font-size:12px}}
.print-pill{align-self:flex-start}
.print-detail .detail-copy>.print-pill{order:1}
.print-detail .detail-copy>.book-author{order:2}
.print-detail .detail-copy>.print-facts{order:3}
.print-detail .detail-copy>.print-note{order:5}
.print-detail .detail-copy>.print-about{order:6}
.print-detail .detail-copy>.health-notice{order:8}
.print-jeebly{border-top:1px solid var(--brand-line,#DDE2E2);margin-top:16px;padding-top:12px}
.print-jeebly .print-actions{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.print-jeebly-pickup{margin-top:12px}
.print-jeebly-pickup summary{cursor:pointer;color:var(--brand-graphite,#30343B)}
.print-jeebly-pickup form{margin-top:10px}
.print-detail .detail-copy>.print-description{display:block;-webkit-line-clamp:unset;overflow:visible;line-height:1.9}
.print-description p{margin:0 0 12px}.print-description ul{margin:0 0 12px;padding-inline-start:22px}.print-description li{margin-bottom:6px}
/* R050 addition 3 (Hussain 16/10): short display titles; a long title still never breaks the layout -
   two lines in the home slider, one line on cards and in the cart; «كتب أخرى قد تهمك» keeps its two lines (the full title is in title=""). */
.book-ad-copy h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.product-info h3.card-title a,.latest-info h3.card-title a,.cart-book-info .cart-title{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* R050 addition 2: «مدينة أخرى» free field under the city list */
.print-city-other[hidden]{display:none}
/* REQ-160: stationery and gifts. Box photos are square: shown whole and never enlarged past their frame. */
.goods-page .cover-stage .catalog-cover-frame{aspect-ratio:3/2;height:auto;max-height:none;width:min(100%,520px);max-width:520px}
.goods-page .cover-stage .catalog-real-cover{width:100%;height:100%;max-height:none;object-fit:contain}
/* Goods cards (REQ-160, Hussain 4/11): the box-and-cards photo is landscape, so the card frame is 3:2 and compact; the home section shows four small cards */
.goods-card .cover-stage:has(.catalog-cover-frame){padding:36px 12px 12px}
.goods-card .catalog-cover-frame{aspect-ratio:3/2;width:100%;max-width:none;height:auto}
.goods-card .catalog-real-cover{width:100%;height:100%;max-height:none;object-fit:contain;box-shadow:none}
.shop-home .catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.shop-home .goods-card .card-description{display:none}
@media(max-width:1100px){.shop-home .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.goods-gallery{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.goods-thumb{width:64px;height:64px;padding:2px;border:1px solid var(--brand-line,#DDE2E2);border-radius:8px;background:#fff;cursor:pointer}
.goods-thumb.is-current{border:2px solid var(--brand-accessibleTeal,#006D70)}
.goods-thumb img{width:100%;height:100%;object-fit:contain;display:block}
.shop-home{margin:32px 0}
.shop-lines{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px}
.shop-lines a{padding:6px 14px;border:1px solid var(--brand-line,#DDE2E2);border-radius:999px;color:inherit;text-decoration:none}
.shop-lines a.active{border-color:var(--brand-accessibleTeal,#006D70);background:var(--brand-tealTint,#E6F3F2)}
.goods-image-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.goods-image-slot img{width:100%;height:auto;display:block;border-radius:8px}
@media (max-width:760px){.goods-image-row{grid-template-columns:1fr}}
/* REQ-160 (Hussain 4/11): on phones the goods cards sit two to a row, so their text and buttons shrink together */
@media(max-width:650px){
.goods-card .tag{font-size:10px;padding:3px 8px}
.goods-card .product-info .category{font-size:10px}
.goods-card .product-info h3.card-title{font-size:15px;line-height:1.5}
.goods-card .card-description{font-size:12px;line-height:1.7;-webkit-line-clamp:2}
.goods-card .product-bottom{gap:6px;flex-wrap:wrap}
.goods-card .price{font-size:18px}.goods-card .price small{font-size:10px}
.goods-card .book-link{font-size:12px}.goods-card .book-link svg{width:13px;height:13px}
.goods-card .catalog-cart-add{font-size:12px;gap:4px}.goods-card .catalog-cart-add svg{width:15px;height:15px}
}

/* REQ-160: second picture on mouse-over (mouse devices only; touch keeps the cover) */
.goods-card .catalog-cover-frame{position:relative}
.goods-card .goods-hover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;pointer-events:none}
@media (hover:hover){
 .goods-card .catalog-real-cover,.goods-card .goods-hover-img{transition:opacity .2s ease}
 .goods-card .cover-stage:hover .goods-hover-img,.goods-card .cover-stage:focus-visible .goods-hover-img{opacity:1}
 .goods-card .cover-stage:hover .catalog-real-cover,.goods-card .cover-stage:focus-visible .catalog-real-cover{opacity:0}
}
