/* CopirPro Checkout — checkout (Classic Checkout and Checkout Block). Only .copir-cfe-* selectors. */

.copir-cfe-section { margin: 0 0 1.5em; clear: both; }
.copir-cfe-section__title { margin: 0 0 .6em; }
.copir-cfe-section__desc { margin: 0 0 1em; opacity: .85; }
.copir-cfe-section__desc p:last-child { margin-bottom: 0; }
.copir-cfe-section__fields::after { content: ""; display: table; clear: both; }

.copir-cfe-field { position: relative; }
.copir-cfe-field[hidden] { display: none !important; }
.copir-cfe-label { display: block; }
.copir-cfe-input-wrapper { display: block; }
.copir-cfe-description { display: block; margin-top: .3em; font-size: .875em; opacity: .8; }
.copir-cfe-error { display: block; margin-top: .3em; color: #b81c23; font-size: .875em; }
.copir-cfe-error[hidden] { display: none; }
.copir-cfe-invalid .copir-cfe-input, .copir-cfe-invalid .copir-cfe-upload__drop { border-color: #b81c23 !important; }

.copir-cfe-heading { margin: .4em 0 .6em; }
.copir-cfe-paragraph { margin: 0 0 .8em; }
.copir-cfe-paragraph p:last-child { margin-bottom: 0; }

.copir-cfe-choices { display: flex; flex-direction: column; gap: .4em; }
.copir-cfe-choice { display: inline-flex !important; align-items: flex-start; gap: .5em; font-weight: normal; cursor: pointer; margin: 0; }
.copir-cfe-choice input { margin: .25em 0 0 !important; flex: none; }
.copir-cfe-multiselect { min-height: 6em; width: 100%; }

.copir-cfe-color { display: flex; align-items: center; gap: .5em; }
.copir-cfe-color__pick { width: 2.6em; height: 2.6em; padding: 0; border: 1px solid rgba(0,0,0,.2); border-radius: 6px; background: none; cursor: pointer; flex: none; }
.copir-cfe-color__hex { max-width: 9em; text-transform: uppercase; }

/* Upload */
.copir-cfe-upload { width: 100%; }
.copir-cfe-upload__drop { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35em; padding: 1.4em 1em; border: 2px dashed rgba(0,0,0,.22); border-radius: 10px; text-align: center; cursor: pointer; transition: border-color .15s, background .15s; }
.copir-cfe-upload__drop:hover, .copir-cfe-upload__drop:focus-visible, .copir-cfe-upload__drop.is-over { border-color: currentColor; background: rgba(0,0,0,.03); outline: none; }
.copir-cfe-upload__input { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0; pointer-events: none; }
.copir-cfe-upload__icon { width: 34px; height: 34px; background: currentColor; opacity: .55; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5M4 16v4h16v-4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4M7 9l5-5 5 5M4 16v4h16v-4'/%3E%3C/svg%3E") center / contain no-repeat; }
.copir-cfe-upload__cta strong { text-decoration: underline; }
.copir-cfe-upload__rules { font-size: .8em; opacity: .7; }
.copir-cfe-upload__list { list-style: none; margin: .7em 0 0 !important; padding: 0 !important; display: grid; gap: .5em; }
.copir-cfe-upload__item { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto auto; grid-template-areas: "thumb name size remove" "thumb bar bar bar" "thumb status status status"; align-items: center; gap: .15em .6em; padding: .45em .6em; border: 1px solid rgba(0,0,0,.12); border-radius: 8px; margin: 0 !important; }
.copir-cfe-upload__thumb { grid-area: thumb; width: 48px; height: 48px; border-radius: 6px; overflow: hidden; background: rgba(0,0,0,.06); display: grid; place-items: center; }
.copir-cfe-upload__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.copir-cfe-upload__ext { font-size: .7em; font-weight: 700; opacity: .7; }
.copir-cfe-upload__thumb--file::before { content: ""; width: 20px; height: 24px; border: 2px solid currentColor; border-radius: 3px; opacity: .45; }
.copir-cfe-upload__name { grid-area: name; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9em; }
.copir-cfe-upload__size { grid-area: size; font-size: .8em; opacity: .7; white-space: nowrap; }
.copir-cfe-upload__bar { grid-area: bar; height: 4px; border-radius: 99px; background: rgba(0,0,0,.08); overflow: hidden; }
.copir-cfe-upload__bar span { display: block; height: 100%; width: 0; background: currentColor; opacity: .6; transition: width .2s; }
.copir-cfe-upload__item.is-done .copir-cfe-upload__bar { display: none; }
.copir-cfe-upload__status { grid-area: status; font-size: .8em; }
.copir-cfe-upload__status:empty { display: none; }
.copir-cfe-upload__item.is-error { border-color: #b81c23; }
.copir-cfe-upload__item.is-error .copir-cfe-upload__status { color: #b81c23; }
.copir-cfe-upload__item.is-error .copir-cfe-upload__bar { display: none; }
.copir-cfe-upload__remove, .copir-cfe-upload__retry { grid-area: remove; border: 0; background: none; cursor: pointer; padding: 0 .25em; font-size: 1.3em; line-height: 1; color: inherit; opacity: .6; min-height: 0; }
.copir-cfe-upload__retry { grid-area: auto; font-size: .8em; text-decoration: underline; opacity: .9; }
.copir-cfe-upload__remove:hover { opacity: 1; color: #b81c23; }

/* Checkout Block */
.copir-cfe-block { margin: 0 0 16px; }
.copir-cfe-block .copir-cfe-section { margin-bottom: 20px; }
.copir-cfe-block .copir-cfe-fields { display: flex; flex-wrap: wrap; gap: 0 4%; }
.copir-cfe-block .copir-cfe-field { width: 100%; margin: 0 0 14px; }
.copir-cfe-block .copir-cfe-row-half-left, .copir-cfe-block .copir-cfe-row-half-right { width: 48%; }
.copir-cfe-block .copir-cfe-label { font-size: 14px; margin: 0 0 4px; }
.copir-cfe-block .copir-cfe-label .required { color: #b81c23; text-decoration: none; border: 0; }
.copir-cfe-block .copir-cfe-label .optional { opacity: .65; font-weight: normal; }
.copir-cfe-block input.copir-cfe-input:not([type=checkbox]):not([type=radio]), .copir-cfe-block select.copir-cfe-input, .copir-cfe-block textarea.copir-cfe-input { width: 100%; box-sizing: border-box; min-height: 50px; padding: 12px; border: 1px solid hsla(0,0%,7%,.8); border-radius: 4px; background: #fff; color: #2b2d2f; font: inherit; font-size: 16px; }
.copir-cfe-block textarea.copir-cfe-input { min-height: 90px; }
.copir-cfe-block select.copir-cfe-multiselect { min-height: 110px; }
.copir-cfe-block .copir-cfe-color__hex { max-width: 10em; }

@media (max-width: 600px) {
	.copir-cfe-block .copir-cfe-row-half-left, .copir-cfe-block .copir-cfe-row-half-right { width: 100%; }
	.copir-cfe-upload__item { grid-template-columns: 40px minmax(0, 1fr) auto; grid-template-areas: "thumb name remove" "thumb size size" "thumb bar bar" "thumb status status"; }
	.copir-cfe-upload__thumb { width: 40px; height: 40px; }
}
.copir-cfe-hidden-row { display: none !important; }

/* Row spacing like the theme's own WooCommerce rows (gap is copied by checkout.js). */
form.checkout .copir-cfe-field.form-row,
form.checkout .copir-cfe-section { margin-bottom: var(--copir-cfe-row-gap, 1.25em); }
form.checkout .copir-cfe-field.form-row:last-child { margin-bottom: var(--copir-cfe-row-gap, 1.25em); }
form.checkout .copir-cfe-section__fields::after { content: ""; display: table; clear: both; }
form.checkout .copir-cfe-field .copir-cfe-label { display: block; }
.wc-block-checkout .copir-cfe-block .copir-cfe-field { margin-bottom: 16px; }
