above it - wider than the sidebar. Rather than continuing
to fight that with nowrap + ellipsis, let the title wrap onto as
many lines as it needs: normal wrapping has no unwrapped minimum
width to begin with, so the box can never be pushed wider than its
parent by this element again. */
min-width: 0 !important;
white-space: normal;
overflow-wrap: break-word;
word-break: break-word;
font-size: clamp( 11px, 3.2vw, 14px );
box-sizing: border-box;
}
/* The theme highlights the SELECTED shipping method with its own border/
padding treatment around the row (visible as the blue box in the
screenshot), which eats into the space available to the label - a title
that fit on one line while unselected can then wrap onto two lines
purely because it got selected, nothing to do with the text itself.
Trim the font-size slightly only for the checked row's label (adjacent-
sibling selector - the radio input is always immediately before the
label in this markup) so it has enough breathing room to keep fitting
on one line despite that extra padding. */
li:has( > .cargus-pudo-picker ) > input:checked + label,
li:has( > .cwc-sameday-locker-picker ) > input:checked + label {
font-size: clamp( 10px, 2.7vw, 13px );
}
/* The "choose location" button itself must be allowed to wrap/shrink too -
otherwise its own unwrapped text keeps the picker (and everything above
it) pinned to a minimum width wider than the sidebar, same root cause
as above. */
.cargus-pudo-picker .button,
.cwc-sameday-locker-picker .button {
max-width: 100%;
/* Multe teme (inclusiv aceasta) seteaza un min-width generic pe toate
butoanele (ex. o variabila --btn-min-width de 14rem, cca 140px), ca
sa nu arate ingust pe un buton normal de pe pagina. In CSS, cand
min-width si max-width intra in conflict, min-width castiga
intotdeauna - deci un simplu max-width:100% de mai sus NU e de
ajuns, butonul "Alege Easybox"/"Alege punct Ship&Go" ramane "blocat"
la acel minim, indiferent de spatiul disponibil, si tocmai acel
minim poate fi motivul pentru care tot tabelul ajunge mai lat decat
containerul lui. Il anulam explicit aici. */
min-width: 0;
white-space: normal;
word-break: break-word;
box-sizing: border-box;
}
/* NOTE: an earlier attempt at a "belt-and-braces" rule here forced
width: 100% + word-break: break-word onto every | / | in this table
(product rows, subtotal, total-with-tax, etc), not just the shipping
row - which ended up distorting the column widths on rows unrelated to
the picker (eg. introducing odd/uneven spacing under the "Total"
row's "(include X lei TVA)" text) and wasn't needed once the actual
root cause (the nowrap label above) was fixed. Removed - only the
containers that actually hold the picker are constrained below. */
/* Istoricul acestui bug a fost lung (vezi git log / changelog pentru
detalii pas cu pas), dar cauza finala, confirmata direct pe site-ul
clientului, a fost un element Bricks generat automat de builder
(ex. un div cu id de forma #brxe-xxxxxx, ID care difera de la
instalare la instalare si nu poate fi vizat direct din CSS-ul unui
plugin) undeva in ierarhia de parinti ai tabelului, setat de Bricks pe
`display: grid`. Asta facea ca latimea disponibila pentru tabel sa fie
calculata gresit, complet in afara controlului nostru (niciun element
cu clasa/id cunoscut de noi - #order_review, .checkout__order-detail-
details etc. - nu era de vina).
Solutia care functioneaza indiferent de ce face orice ancestor Bricks:
fortam tabelul insusi sa se comporte STRICT ca un tabel HTML clasic
(table-layout: fixed + display:table/table-row-group/table-row/
table-cell explicit pe toate nivelurile), cu latimile ambelor coloane
specificate EXPLICIT ca procente (70% / 30%, mai jos), nu doar una
dintre ele.
Important: table-layout:fixed foloseste DOAR primul rand (thead) ca
sa stabileasca latimile coloanelor. Daca specifici latimea unei
singure coloane si o lasi pe cealalta "auto", browserul trebuie sa
calculeze automat cat ramane - iar acel calcul e cel corupt de
`colspan="100%"` din | (atribut HTML nevalid, generat de
WooCommerce, citit de browser ca `colspan="100"` in loc de "toate
coloanele" - vezi si mai jos). Specificand AMBELE coloane explicit,
nu mai ramane nimic de calculat automat, deci bug-ul e ocolit complet
- asta a fost piesa lipsa din incercarile anterioare (care fixau doar
coloana de Sub-total, lasand-o pe cea de Produs pe "auto"). */
.woocommerce-checkout-review-order-table {
display: table !important;
table-layout: fixed !important;
width: 100% !important;
max-width: 100%;
min-width: 0 !important;
box-sizing: border-box;
}
.woocommerce-checkout-review-order-table thead,
.woocommerce-checkout-review-order-table tbody,
.woocommerce-checkout-review-order-table tfoot {
display: table-row-group !important;
}
.woocommerce-checkout-review-order-table tr {
display: table-row !important;
}
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
display: table-cell !important;
}
/* Plasa de siguranta, in cazul (putin probabil, dar posibil pe alte
instalari) in care vreun alt element Bricks generat automat ar mai
face ceva similar mai sus in ierarhie. */
#order_review,
.checkout__order-detail-details {
max-width: 100%;
box-sizing: border-box;
overflow-x: hidden;
}
/* Gasit in Global CSS-ul site-ului (nu al plugin-ului): doua reguli care
afecteaza direct acest tabel si care pot contribui la o latime mai mare
decat cea disponibila:
1) `.woocommerce-checkout .shop_table td, th { padding: 10px !important; }`
- fara box-sizing:border-box PE CELULE (nu doar pe ), acest
padding se ADAUGA la latimea de continut necesara, nu se scade din
ea - 2 coloane x 2 laturi x 10px = 40px in plus, greu de comprimat
indiferent cat de mult se micsoreaza textul prin word-break.
2) `.shop_table .product-total { float: right; }` - a face o celula de
tabel sa fie float e neobisnuit si poate produce un comportament de
layout inconsistent intre browsere, in loc de alinierea normala la
dreapta (care se poate obtine identic vizual, fara efecte secundare,
cu text-align:right).
Le neutralizam explicit, DOAR pentru tabelul nostru (nu global), ca sa
nu afectam alte tabele de pe site unde poate ca au fost puse intentionat.
IMPORTANT despre specificitate: regula de float din Global CSS
(`.shop_table .product-total`) are AEEASI specificitate CSS ca o
varianta simpla a regulii noastre de mai jos (2 clase in ambele
cazuri) - la specificitate egala, castiga regula incarcata ultima in
pagina, ceea ce depinde fragil de ordinea de incarcare a fisierelor
(tema vs. plugin), nu e ceva pe care sa ne bazam. Adaugam `#order_review`
in fata selectorului nostru, ca sa avem specificitate garantat mai mare
(compound cu ID), indiferent de ordinea de incarcare. */
.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td,
#order_review .woocommerce-checkout-review-order-table th,
#order_review .woocommerce-checkout-review-order-table td {
box-sizing: border-box !important;
}
#order_review .woocommerce-checkout-review-order-table .product-total {
float: none !important;
text-align: right;
}
/* Latimile explicite ale celor doua coloane - vezi comentariul mare de
mai sus despre de ce AMBELE trebuie specificate (nu doar una). Puse pe
th (thead), fiindca table-layout:fixed foloseste doar primul rand
pentru a stabili latimile coloanelor - td-urile de mai jos mostenesc
automat aceeasi latime de coloana, dar le punem explicit si pe ele
pentru claritate/robustete daca vreodata structura thead se schimba.
`word-break: normal` (nu break-word) + `overflow-wrap: break-word`:
textul trece pe rand nou intre CUVINTE intregi cand nu incape, nu
litera cu litera (aspectul "P-r-o-d-u-s" pe verticala, intalnit intr-o
incercare anterioara, venea exact de la break-word aplicat intr-un
context prea ingust). */
.woocommerce-checkout-review-order-table th.product-name,
.woocommerce-checkout-review-order-table td.product-name {
width: 70% !important;
word-break: normal !important;
overflow-wrap: break-word !important;
white-space: normal !important;
}
.woocommerce-checkout-review-order-table th.product-total,
.woocommerce-checkout-review-order-table td.product-total {
width: 30% !important;
word-break: normal !important;
overflow-wrap: break-word !important;
white-space: normal !important;
}
#order_review,
ul#shipping_method,
ul#shipping_method li {
max-width: 100%;
box-sizing: border-box;
}
.cwc-tracking-button-wrap {
margin: 12px 0;
}
.cwc-tracking-awb-number {
margin-left: 10px;
color: #666;
font-size: 0.9em;
}
/*
* Match the store's own button look-and-feel (same CSS custom properties
* most themes/page-builders already define globally, e.g. Bricks) instead
* of relying purely on the shared "woocommerce-button button" classes,
* which some builders don't reliably style on dynamically-added action
* links. Falls back to sane defaults if those variables aren't defined.
*/
.woocommerce-button.cwc_track,
a.cwc_track {
background-color: var( --accent, #333 ) !important;
color: var( --white, #fff ) !important;
border-radius: var( --radius-s, 4px );
padding: 3px 10px;
min-height: 30px;
line-height: 1;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: var( --text-xs, 13px );
font-weight: var( --link-weight, inherit );
text-decoration: none !important;
border: none;
cursor: pointer;
margin-right: 10px;
}
.woocommerce-button.cwc_track:hover,
a.cwc_track:hover {
background-color: var( --accent-hover, var( --accent, #333 ) ) !important;
color: var( --white, #fff ) !important;
}
/*
* "Livrare Sambata" - optional checkbox shown as its own row right under
* the Cargus shipping-method list at checkout (woocommerce_review_order_after_shipping,
* same hook the "colet la schimb" checkbox above already uses). Uses the
* same theme/page-builder custom properties as everything else in this
* file, with plain fallbacks, so it blends into whatever look the store's
* own checkout already has instead of looking like a bolted-on plugin box.
*/
.cwc-saturday-option {
display: block;
margin: 8px 0 2px;
padding: 10px 12px;
background: var( --wc-content-bg, #fff );
border: var( --border-size, 1px ) var( --border-style, solid ) var( --wc-form-border-color, #ddd );
border-radius: var( --wc-form-border-radius, var( --radius-s, 4px ) );
box-sizing: border-box;
}
.cwc-saturday-option .form-row {
margin: 0;
padding: 0;
}
.cwc-saturday-option .woocommerce-input-wrapper {
display: block;
}
.cwc-saturday-option label.checkbox {
display: flex;
align-items: center;
flex-wrap: nowrap;
gap: 6px;
color: var( --wc-secondary-text, var( --text-dark, #333 ) );
cursor: pointer;
width: 100%;
}
.cwc-saturday-option input.cwc-saturday-option-checkbox {
flex: 0 0 auto;
}
.cwc-saturday-option .cwc-saturday-label-text {
white-space: nowrap;
/* min-width: 0 lets a flex child shrink below its content's natural
width - without it, flex items refuse to shrink past their content
size and the row overflows instead of the font scaling down. */
min-width: 0;
flex: 1 1 auto;
overflow: hidden;
text-overflow: ellipsis;
/* Scales down smoothly with the viewport so the title+price always
fits on one line without ever needing horizontal scrolling (which
is what was showing up as a scrollbar with arrow buttons before). */
font-size: clamp( 11px, 3.4vw, var( --text-s, var( --text-m, 14px ) ) );
}
.cwc-saturday-option .woocommerce-Price-amount {
color: inherit;
white-space: nowrap;
}
/*
* woocommerce_form_field() automatically appends "(optional)" after any
* field that isn't marked required - redundant here (it's a single
* checkbox, already obviously optional) and was pushing the row onto a
* second/third line. Hidden rather than removed in PHP, since the "(optional)"
* span is generated by WooCommerce core's own field markup, not by this
* plugin.
*/
.cwc-saturday-option .optional {
display: none;
}
.cwc-saturday-disclaimer {
margin: 6px 0 0;
font-size: var( --text-xs, 12px );
line-height: 1.4;
color: var( --wc-subtext, var( --base-semi-dark, #767676 ) );
}
/*
* [curieri_thank_you] shortcode styling used to live here, but the CSS
* wasn't reliably reaching the thank-you page on this store (page
* caching / CSS-optimisation plugins, or the enqueue's is_checkout()
* context check not matching how Bricks renders that page - the box
* showed up unstyled). It is now printed inline by the shortcode itself.
* The shortcode's entire rendering (and the .cwc-ty-* rules it prints)
* has since moved to the "RO Facturare" plugin (includes/class-rf-thank-you.php,
* print_style()) - this plugin (Curieri) no longer registers that
* shortcode at all.
*/