/*=============== Shared toolbar + table extensions for the Account Master pages ===============*/
/* OpeningStock, PriceList, POSMaster, Catalog and Barcode all render the Account Master chrome
   from SaleAccount.css (.top-btns-container, .master-table-container, .master-table-scroll,
   .master-content-table1). This file holds only what those pages need on top of it: the
   dropdown/label widgets their toolbars use, multi-row toolbar cards, and the table-column
   variants for column shapes the Account Master rules don't assume. */

.classification-lable,
.product-select,
.classification-select {
    flex: 1;
}

/* Base size, still used as-is by Catalog and POSMaster. The Account Master pages size these
   up to 34px/6px through the scoped rules further down. */
.classification-lable input,
.product-select select,
.classification-select select,
.party_type-select select{
    display: block;
    width: 100%;
    height: 30px;
    background: transparent;
    border: solid 1px #ccc;
    transition: all .2s ease;
    padding: 0 15px;
    border-radius: 5px;
    font-size: 12px;
}

.classification-lable label,
.classification-select label,
.party_type-select label{
    cursor: text;
    z-index: 2;
    top: 11px;
    left: 10px;
    font-size: 12px;
    font-weight: bold;
    background: #fff;
    padding: 0 3px;
    color: #999;
    transition: all .2s ease;
    top: -8px;
}

/*=============== Multi-row toolbars ===============*/
/* OpeningStock, PriceList and POSMaster differ from a stock Account Master page in one way:
   their toolbar carries two or three rows of filters instead of a single line. Rather than the
   separate stacked cards they used to have, they render one .top-btns-container holding
   several .top-btns-row lines. */

/* Several rows inside one toolbar card: the shared card becomes a column, each .top-btns-row
   is the normal horizontal toolbar line. */
.top-btns-container.toolbar-stacked {
    flex-direction: column;
    align-items: stretch;
}

.top-btns-container.toolbar-stacked .top-btns-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
}

/* .form-item is declared three times globally and PrintPopup.css wins on source order, so in
   a toolbar row it arrives as a 30px flex box with a 15px bottom margin — sized for a popup
   form, not for a 34px toolbar control. Reset it to a plain auto-height block. */
.top-btns-container.toolbar-stacked .form-item {
    display: block;
    height: auto;
    margin-top: 0;
    margin-bottom: 0;
}

/* Every control in the row goes to the Account Master size — 34px tall with a 6px radius, so
   it lines up with .top-btns-add-btn (34px) and .search-input (35px) instead of the 30px/5px
   base above. This has to be restated rather than inherited: .form-item input is 30px/4px
   (CreateAccount.css) and .form-item select is 30px with a blue #0078d4 border
   (PrintPopup.css), both more specific than the base rule. Backgrounds stay transparent —
   unlike .search-input these carry floating labels whose white background has to blend into
   the card. */
.top-btns-container.toolbar-stacked select,
.top-btns-container.toolbar-stacked .form-item input,
.top-btns-container.toolbar-stacked .form-item select {
    display: block;
    width: 100%;
    height: 34px;
    padding: 0 15px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: transparent;
    font-size: 12px;
}

/* Measured: a toolbar row is 34px (the control height), so a card is 11px + rows + 14px gaps
   + 11px, starting at the shared 3rem (48px) top. The single-row Account Master toolbar is
   57px and ends at 105px, 7px above its 7rem table — these offsets keep that same 7px gap.
     2 rows -> 104px card, ends 152px, table 159px = 9.95rem
     3 rows -> 152px card, ends 200px, table 207px = 12.95rem */
.master-table-container.table-below-2rows {
    top: 9.95rem;
}

.master-table-container.table-below-3rows {
    top: 12.95rem;
}

/* The shared master table pins columns 1-3 and the last column at fixed pixel widths, because
   Account Master tables are laid out checkbox / Index / Name / ... / Action. The pages here
   have different column shapes, so each picks a variant that frees the columns it doesn't
   have. Cell padding, borders, header style, hover and the sticky header always still come
   from .master-content-table1 itself.

     .plain-data-table    no checkbox, no actions   -> frees 1, 2, 3 and last
                                                       (OpeningStock, PriceList)
     .checkbox-data-table leads with a checkbox     -> keeps 1, frees 2 and 3
                                                       (POSMaster, Catalog, Barcode)
     .no-action-col       add-on: no Action column  -> also frees last
                                                       (POSMaster)                        */
.master-content-table1.plain-data-table,
.master-content-table1.checkbox-data-table {
    width: 100%;
    min-width: 100%;
    table-layout: auto;
}

/* Header cells: clear the sideways pinning and the 50/100/150px widths, but keep
   position:sticky — for a th that also carries top:0 from .master-content-table1 thead th,
   and with left/right back to auto it now sticks only vertically, which is the sticky header
   every Account Master table has. Restating the base 300px keeps all columns equal so
   table-layout:auto shares the container evenly instead of starving these four. */
.master-content-table1.plain-data-table th:nth-child(1),
.master-content-table1.plain-data-table th:nth-child(2),
.master-content-table1.plain-data-table th:nth-child(3),
.master-content-table1.plain-data-table th:last-child {
    left: auto;
    right: auto;
    width: 300px;
    text-align: left;
}

/* Body cells have no vertical stickiness to preserve, so they just go static. */
.master-content-table1.plain-data-table td:nth-child(1),
.master-content-table1.plain-data-table td:nth-child(2),
.master-content-table1.plain-data-table td:nth-child(3),
.master-content-table1.plain-data-table td:last-child {
    position: static;
    width: 300px;
    text-align: left;
}

/* Checkbox variant: column 1 keeps the shared 50px centred sticky treatment (it really is a
   checkbox here), but columns 2 and 3 are ordinary data columns — Product Name and the first
   classification — not the Index/Name pair the 100px/sticky rules assume. */
.master-content-table1.checkbox-data-table th:nth-child(2),
.master-content-table1.checkbox-data-table th:nth-child(3) {
    left: auto;
    width: 300px;
    text-align: left;
}

.master-content-table1.checkbox-data-table td:nth-child(2),
.master-content-table1.checkbox-data-table td:nth-child(3) {
    position: static;
    width: 300px;
    text-align: left;
}

/* Add-on for a checkbox table whose last column is data rather than row actions. */
.master-content-table1.no-action-col th:last-child {
    right: auto;
    width: 300px;
    text-align: left;
}

.master-content-table1.no-action-col td:last-child {
    position: static;
    width: 300px;
    text-align: left;
}

/* Trailing numeric columns get right-aligned the way the Account Master tables right-align
   their balance columns: Opening Qty + Opening Amount on OpeningStock, Rate + Taxpaid Rate +
   Discount on PriceList, Qty + Rate + Taxpaid Rate + MRP + Discount on POSMaster. */
.master-content-table1.numeric-tail-2 th:nth-last-child(-n+2),
.master-content-table1.numeric-tail-2 td:nth-last-child(-n+2),
.master-content-table1.numeric-tail-3 th:nth-last-child(-n+3),
.master-content-table1.numeric-tail-3 td:nth-last-child(-n+3),
.master-content-table1.numeric-tail-5 th:nth-last-child(-n+5),
.master-content-table1.numeric-tail-5 td:nth-last-child(-n+5) {
    text-align: right;
}

/* Barcode edits its classifications inline, so it has .form-item dropdowns inside table cells.
   Same problem as in the toolbar: PrintPopup.css's .form-item / .form-item select win on
   source order and bring a 30px flex box, a 15px bottom margin and a blue #0078d4 border into
   the row. Neutralise them so a cell holding a dropdown is the same height as a plain one. */
.master-content-table1 .form-item {
    display: block;
    height: auto;
    margin-top: 0;
    margin-bottom: 0;
}

.master-content-table1 .form-item select {
    display: block;
    width: 100%;
    height: 30px;
    padding: 0 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    background: transparent;
    font-size: 12px;
}

/* PriceList's and POSMaster's Save buttons are Account Master primary buttons, so the icon
   follows the button's white text instead of staying #3399ff at 25px. */
.top-btns-add-btn .save-icon {
    fill: currentColor;
    height: 18px;
    width: 18px;
    margin-right: 8px;
}