/* Copyright (c) 2026, Titansoft Limited and contributors License: see license.txt Scoped re-skin for ERPNext's stock supplier portal pages (/rfq, /purchase-orders, /purchase-invoices, /supplier-quotations and their detail views). The `iw-supplier-portal` class is added to by public/js/portal_back_link.js when the request path matches one of those prefixes - every rule in this file is gated on that class so we never leak into customer-facing pages (/orders, /shop, /quotations, etc.) or the desk. */ /* ── Page header (title + actions) ───────────────────────────── */ .iw-supplier-portal .page_content, .iw-supplier-portal .page-content { color: #0f172a; } .iw-supplier-portal .page-header, .iw-supplier-portal .web-page-header, .iw-supplier-portal h1, .iw-supplier-portal .page_content > h3.m-0 { font-size: 1.4rem; font-weight: 700; letter-spacing: -0.01em; color: #0f172a; margin: 0 0 .5rem; } /* ── Sub-line (date / valid-till on order.html) ──────────────── */ .iw-supplier-portal .transaction-subheading { color: #64748b; font-size: .85rem; margin-bottom: 1rem; } .iw-supplier-portal .transaction-subheading p { margin: 0; } /* ── Status indicators ───────────────────────────────────────── */ .iw-supplier-portal .indicator-pill, .iw-supplier-portal .indicator { display: inline-flex; align-items: center; padding: .3rem .75rem; border-radius: 999px; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; border: 1px solid transparent; } .iw-supplier-portal .indicator-pill.blue, .iw-supplier-portal .indicator.blue { background: #dbeafe; color: #1d4ed8; } .iw-supplier-portal .indicator-pill.green, .iw-supplier-portal .indicator.green { background: #dcfce7; color: #16a34a; } .iw-supplier-portal .indicator-pill.orange, .iw-supplier-portal .indicator.orange { background: #ffedd5; color: #c2410c; } .iw-supplier-portal .indicator-pill.red, .iw-supplier-portal .indicator.red { background: #fee2e2; color: #dc2626; } .iw-supplier-portal .indicator-pill.darkgrey, .iw-supplier-portal .indicator-pill.grey, .iw-supplier-portal .indicator-pill.gray, .iw-supplier-portal .indicator.gray, .iw-supplier-portal .indicator.grey { background: #f1f5f9; color: #64748b; border-color: #e5e7eb; } .iw-supplier-portal .indicator-container { margin-bottom: 1rem; } /* ── Items table wrapper (order.html + rfq.html) ─────────────── */ .iw-supplier-portal .order-container, .iw-supplier-portal #order-container { background: #ffffff; border: 1px solid #e5e7eb; border-radius: 12px; padding: 0; overflow: hidden; box-shadow: 0 1px 2px rgba(15,23,42,.03); margin-top: 1rem; } /* Header row of the items grid */ .iw-supplier-portal .order-item-header, .iw-supplier-portal .cart-item-header { margin: 0 !important; padding: .65rem .9rem !important; background: #f8fafc; border-bottom: 1px solid #e5e7eb; color: #64748b !important; font-size: .68rem !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: .05em; } .iw-supplier-portal .order-item-header > [class*="col-"], .iw-supplier-portal .cart-item-header > [class*="col-"] { padding-left: 0; padding-right: 0; } /* Item rows */ .iw-supplier-portal .order-items, .iw-supplier-portal .rfq-items > .row, .iw-supplier-portal #rfq-items > .row:not(.cart-item-header) { margin: 0 !important; padding: .7rem .9rem !important; font-size: .85rem; border-bottom: 1px solid #f1f5f9; } .iw-supplier-portal .order-items:last-child, .iw-supplier-portal .rfq-items > .row:last-child { border-bottom: none; } .iw-supplier-portal .order-items:hover, .iw-supplier-portal .rfq-items > .row:hover { background: #fafbfc; } .iw-supplier-portal .order-item-name, .iw-supplier-portal .order-rate { font-weight: 600; color: #0f172a; } .iw-supplier-portal .order-items > [class*="col-"], .iw-supplier-portal .rfq-items > .row > [class*="col-"] { padding-left: 0; padding-right: 0; } /* Grand total + taxes-and-totals row */ .iw-supplier-portal .grand-total-row, .iw-supplier-portal .order-taxes, .iw-supplier-portal .order-totals { margin: 0 !important; padding: .8rem .9rem !important; background: #f8fafc; border-top: 1px solid #e5e7eb; font-weight: 700; color: #0f172a; font-variant-numeric: tabular-nums; } /* ── RFQ supplier banner ─────────────────────────────────────── */ .iw-supplier-portal .rfq-supplier { font-size: .95rem; font-weight: 700; color: #0f172a; } /* ── Section labels / muted text ─────────────────────────────── */ .iw-supplier-portal .text-muted, .iw-supplier-portal .text-secondary { color: #64748b !important; } /* ── Action buttons ─────────────────────────────────────────── */ .iw-supplier-portal .btn-primary, .iw-supplier-portal .btn.btn-primary { background: #ea580c; border-color: #ea580c; color: #ffffff; font-weight: 600; border-radius: 10px; padding: .55rem 1.1rem; } .iw-supplier-portal .btn-primary:hover, .iw-supplier-portal .btn.btn-primary:hover, .iw-supplier-portal .btn-primary:focus { background: #c2410c; border-color: #c2410c; } .iw-supplier-portal .btn-secondary, .iw-supplier-portal .btn.btn-secondary { background: #ffffff; border: 1px solid #e5e7eb; color: #0f172a; font-weight: 600; border-radius: 10px; } /* ── Page container width ───────────────────────────────────── */ .iw-supplier-portal .page_content, .iw-supplier-portal .page-content, .iw-supplier-portal .container { max-width: 1100px; } /* ── Form inputs (notes textarea on rfq.html) ───────────────── */ .iw-supplier-portal .form-control, .iw-supplier-portal .terms-feedback { border: 1px solid #e5e7eb; border-radius: 10px; background: #ffffff; color: #0f172a; font-size: .9rem; padding: .6rem .85rem; } .iw-supplier-portal .form-control:focus, .iw-supplier-portal .terms-feedback:focus { border-color: #ea580c; box-shadow: 0 0 0 4px #ffedd5; outline: none; } /* ── Quotation-link rows on rfq.html ────────────────────────── */ .iw-supplier-portal .web-list-item.quotations { background: #ffffff; border: 1px solid #e5e7eb; border-radius: 10px; padding: .65rem .9rem; margin-bottom: .5rem; box-shadow: 0 1px 2px rgba(15,23,42,.03); } /* ── Portal table responsiveness ───────────────────────────── Across portal pages, document IDs, dates, currencies and status pills should stay on a single line. On narrow screens the table scrolls horizontally instead of wrapping mid-ID. Adopt by adding the `iw-portal-table-wrap` class to a div around any , and `iw-portal-table` to the

itself. Works regardless of whether `iw-supplier-portal` is set, so custom www/* pages also benefit. */ .iw-portal-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; } .iw-portal-table { width: 100%; } .iw-portal-table th, .iw-portal-table td { white-space: nowrap; } /* Opt-out for individual cells that need wrapping (e.g. long descriptions). */ .iw-portal-table td.iw-wrap, .iw-portal-table th.iw-wrap { white-space: normal; } /* Stock ERPNext supplier-portal lists (purchase-orders, purchase-invoices, supplier-quotations, rfq listing) already wrap each row in `a.transaction-item-link` overlaying the whole row, so the whole card IS the action - there's no separate button for the supplier to miss. Bootstrap's col-sm-* classes already stack the columns vertically below 576px. We only keep IDs / status / totals from breaking mid- string, and let everything else (items-preview, addresses) wrap. */ .iw-supplier-portal .list-item-name, .iw-supplier-portal .list-item-status, .iw-supplier-portal .item-total, .iw-supplier-portal .indicator-pill { white-space: nowrap; }