/* Kala Noir controls. Shared primitives and component adapters, loaded after theme layout. */
:root {
  --control-bg: #fff;
  --control-tint: #f5f4f1;
  --control-text: #202020;
  --control-muted: #707070;
  --control-border: #bcbcbc;
  --control-hover: #777777;
  --control-active: #242424;
  --control-error: #a33131;
  --control-radius: 6px;
  --control-height: 48px;
  --control-font: 400 15px/1.45 var(--font-display);
}
body :is(#main, #site-footer, #region-modal, #search-flyout-overlay) :is(input:not([type]),input[type=text],input[type=email],input[type=tel],input[type=url],input[type=search],input[type=number],input[type=date],input[type=password],input[type=file],select,textarea) {
  box-sizing: border-box; width: 100%; min-width: 0; min-height: var(--control-height);
  padding: 13px 15px; border: 1px solid var(--control-border); border-radius: var(--control-radius);
  background-color: var(--control-bg); color: var(--control-text); font: var(--control-font); letter-spacing: normal;
  box-shadow: 0 2px 3px #24242404; transition: border-color .15s,box-shadow .15s,background-color .15s;
}
body :is(#main, #site-footer, #region-modal, #search-flyout-overlay) :is(input,textarea)::placeholder { color: var(--control-muted); opacity: 1; }
body :is(#main, #site-footer, #region-modal, #search-flyout-overlay) :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]),select,textarea):hover { border-color: var(--control-hover); }
body :is(#main, #site-footer, #region-modal, #search-flyout-overlay) :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]),select,textarea):focus {
  border-color: var(--control-active); outline: 0; background-color: #fff; box-shadow: 0 0 0 3px #24242420;
}
body :is(#main,#site-footer,#region-modal) :is(input,select,textarea):disabled { background-color: #ededed; color: #7c7c7c; border-color: #d6d6d6; opacity: .7; cursor: not-allowed; }
body :is(#main,#site-footer) :is(input,select,textarea):user-invalid { border-color: var(--control-error); }
body :is(#main,#site-footer,#region-modal) select {
  appearance: none; cursor: pointer; padding-right: 42px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23343434' stroke-width='1.5'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-size: 16px; background-position: right 14px center;
}
body :is(#main,#site-footer,#region-modal) select option { background: #fff; color: #202020; }
body #main textarea { min-height: 144px; resize: vertical; }
body #main input[type=file] { padding: 7px; font-size: 13px; }
body #main input[type=file]::file-selector-button { background: var(--control-tint); color: var(--control-text); border: 1px solid var(--control-border); border-radius: 3px; padding: 9px 12px; margin-right: 12px; font: 500 13px var(--font-display); cursor: pointer; }
/* Choice controls preserve native form semantics and keyboard operation. */
body :is(#main,#site-footer,#region-modal) :is(input[type=checkbox],input[type=radio]) {
  appearance: none; width: 18px; height: 18px; min-height: 18px; flex: 0 0 18px; padding: 0; margin: 0 8px 0 0;
  border: 1px solid var(--control-border); background: #fff; border-radius: 4px; vertical-align: middle; cursor: pointer;
}
body :is(#main,#site-footer,#region-modal) input[type=radio] { border-radius: 50%; }
body :is(#main,#site-footer,#region-modal) input[type=checkbox]:checked {
  background: var(--control-active) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18' fill='none' stroke='white' stroke-width='2'%3E%3Cpath d='m4 9 3 3 7-7'/%3E%3C/svg%3E") center/18px;
  border-color: var(--control-active);
}
body :is(#main,#site-footer,#region-modal) input[type=radio]:checked { border: 5px solid var(--control-active); }
body :is(#main,#site-footer,#region-modal) :is(input[type=checkbox],input[type=radio]):focus-visible { outline: 2px solid var(--control-active); outline-offset: 3px; }
body #main :is(.form-group > label,.catalog-tools > label,.enquiry-form > label) { font: 600 13px/1.5 var(--font-display); letter-spacing: .01em; text-transform: none; }
body #main .form-group > label { margin-bottom: 10px; }
body #main .input-hint { color: var(--control-muted); font: 400 12px/1.6 var(--font-display); margin-top: 8px; }
/* Department rows are button-based single choices; keep their marker consistent with radios. */
body #main .filter-pill { border: 1px solid transparent; border-radius: 5px; padding: 9px 10px; min-height: 40px; background: transparent; color: #454545; font: 400 13px/1.45 var(--font-display); box-shadow: none; }
body #main .filter-pill::before { width: 16px; height: 16px; flex-basis: 16px; border: 1px solid var(--control-border); border-radius: 50%; background: #fff; box-shadow: none; }
body #main .filter-pill:hover:not(:disabled) { background: var(--control-tint); }
body #main .filter-pill.active { background: #efefed; border-color: #d9d9d5; color: var(--control-active); font-weight: 600; box-shadow: none; }
body #main .filter-pill.active::before { background: #fff; border: 5px solid var(--control-active); }
body #main .filter-pill:focus-visible { outline: 2px solid var(--control-active); outline-offset: 2px; }
body #main .filter-pill:disabled { opacity: .45; cursor: not-allowed; background: transparent; }
/* Removable selections and size choices share the same chip primitive. */
body :is(#main,#site-footer) :is(.active-tags-strip button,.hover-size-pill,.size-pill) {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 8px 12px;
  border: 1px solid var(--control-border); border-radius: 4px; background: #fff; color: var(--control-text);
  font: 500 12px/1.4 var(--font-display); letter-spacing: 0; cursor: pointer; box-shadow: none;
}
body #main .active-tags-strip button { border-radius: 18px; background: var(--control-tint); }
body #main :is(.active-tags-strip button,.hover-size-pill,.size-pill):hover { border-color: var(--control-active); background: #ececea; }
body #main :is(.hover-size-pill.selected,.size-pill.selected) { background: var(--control-active); color: #fff; border-color: var(--control-active); }
body #main :is(.active-tags-strip button,.hover-size-pill,.size-pill):focus-visible { outline: 2px solid var(--control-active); outline-offset: 3px; }
body #main .catalog-sort-row select { width: auto; min-width: 160px; font-size: 13px; }
body #main .catalog-tools :is(input,select) { font-size: 14px; }
body #main .catalog-tools .catalog-stock { padding: 12px; background: var(--control-tint); border-radius: 5px; font-weight: 500; }
/* WooCommerce enhanced country selectors match native fields. */
body #main .select2-container .select2-selection--single { height: var(--control-height); border: 1px solid var(--control-border); border-radius: var(--control-radius); background: #fff; }
body #main .select2-container .select2-selection__rendered { padding-left: 15px; font: 400 15px/46px var(--font-display); color: var(--control-text); }
body #main .select2-container .select2-selection__arrow { height: 46px; right: 10px; }
body #main .select2-container--focus .select2-selection--single { border-color: var(--control-active); box-shadow: 0 0 0 3px #24242420; }
/* Search and newsletter wrappers retain their integrated button/icon layout. */
body #site-footer .newsletter-input-wrap { border: 1px solid var(--control-border); border-radius: var(--control-radius); background: #fff; padding: 4px 5px 4px 14px; gap: 8px; }
body #site-footer .newsletter-input-wrap:focus-within { border-color: var(--control-active); box-shadow: 0 0 0 3px #24242420; }
body #site-footer input.newsletter-input { border: 0; border-radius: 0; padding: 8px 0; background: transparent; box-shadow: none; outline: 0; }
body #site-footer input.newsletter-input:focus { box-shadow: none; }
body #site-footer .newsletter-submit-btn { border-radius: 3px; background: var(--control-active); color: #fff; min-width: 80px; }
body #site-footer .newsletter-submit-btn:hover { background: #3b3b3b; color: #fff; opacity: 1; }
body #region-modal .region-search-bar { border: 1px solid var(--control-border); border-radius: var(--control-radius); padding: 8px 14px; }
body #region-modal input.region-search-input { border: 0; padding: 6px 0; background: transparent; box-shadow: none; }
body #region-modal .region-search-bar:focus-within { box-shadow: 0 0 0 3px #24242420; }
@media(max-width:767px) {
 body :is(#main,#site-footer,#region-modal) :is(input:not([type=checkbox]):not([type=radio]):not([type=submit]),select,textarea),body #main .catalog-tools :is(input,select) { font-size: 16px; }
 body #main .catalog-sort-row select { min-width: 145px; font-size: 13px; }
}
@media(prefers-reduced-motion:reduce) { body :is(input,select,textarea) { transition: none; } }
