/* =============================================================
   COMU UI — Custom Theme
   Built on top of DevExpress Bootstrap External (bs5)
   Primary: brand blue #0059ff
   Grayscale: Carbon Gray scale
   ============================================================= */

/* ---------------------------------------------------------------
   SECTION A — COMU design tokens
   --------------------------------------------------------------- */
:root {
    /* Brand palette */
    --comu-primary:        #0059ff;
    --comu-primary-dark:   #0043ce;
    --comu-primary-light:  #e0e0e0;
    --comu-primary-rgb:    0, 89, 255;
    --comu-surface:        #f4f4f4;
    --comu-text:           #161616;
    --comu-header:         #161616;
    --comu-border:         #c6c6c6;
    --comu-font-family:    "Google Sans", "Segoe UI", system-ui, -apple-system, sans-serif;

    /* Radzen compatibility aliases (design-system .comu-* / --rz-*) */
    --rz-primary:               var(--comu-primary);
    --rz-white:                 #ffffff;
    --rz-base-50:               #f4f4f4;
    --rz-base-100:              #e0e0e0;
    --rz-base-200:              #c6c6c6;
    --rz-base-300:              #a8a8a8;
    --rz-base-400:              #8d8d8d;
    --rz-base-500:              #6f6f6f;
    --rz-base-600:              #525252;
    --rz-base-700:              #393939;
    --rz-base-800:              #262626;
    --rz-base-900:              var(--comu-text);
    --rz-base-background-color: var(--comu-surface);
    --rz-text-primary:          var(--comu-text);
    --rz-text-secondary:        var(--rz-base-600);
    --rz-secondary-lighter:     var(--comu-primary-light);
}

/* ---------------------------------------------------------------
   SECTION B — Bootstrap 5 CSS variable overrides
   DevExpress bootstrap-external.bs5.min.css consumes --bs-*
   --------------------------------------------------------------- */
:root {
    --bs-primary:                  #0059ff;
    --bs-primary-rgb:              0, 89, 255;
    --bs-link-color:               #0059ff;
    --bs-link-color-rgb:           0, 89, 255;
    --bs-link-hover-color:         #0043ce;
    --bs-link-hover-color-rgb:     0, 67, 206;
    --bs-body-color:               #161616;
    --bs-body-color-rgb:           22, 22, 22;
    --bs-body-bg:                  #ffffff;
    --bs-border-color:             #c6c6c6;
    --bs-border-color-translucent: rgba(0, 89, 255, 0.175);
    --bs-font-sans-serif:          "Google Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
}

/* ---------------------------------------------------------------
   SECTION C — Bootstrap component overrides
   --------------------------------------------------------------- */

/* Primary button */
.btn-primary {
    --bs-btn-bg:                   #0059ff;
    --bs-btn-border-color:         #0059ff;
    --bs-btn-hover-bg:             #0043ce;
    --bs-btn-hover-border-color:   #0039b0;
    --bs-btn-active-bg:            #0039b0;
    --bs-btn-active-border-color:  #002d9c;
    --bs-btn-disabled-bg:          #0059ff;
    --bs-btn-disabled-border-color:#0059ff;
    --bs-btn-color:                #ffffff;
    --bs-btn-hover-color:          #ffffff;
    --bs-btn-active-color:         #ffffff;
}

/* Outline primary button */
.btn-outline-primary {
    --bs-btn-color:                #0059ff;
    --bs-btn-border-color:         #0059ff;
    --bs-btn-hover-bg:             #0059ff;
    --bs-btn-hover-border-color:   #0059ff;
    --bs-btn-hover-color:          #ffffff;
    --bs-btn-active-bg:            #0043ce;
    --bs-btn-active-border-color:  #0043ce;
    --bs-btn-active-color:         #ffffff;
}

/* Focus rings */
.btn:focus-visible,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 89, 255, 0.22);
    border-color: rgba(0, 89, 255, 0.55);
}

/* Badge / bg utilities */
.bg-primary  { background-color: #0059ff !important; }
.text-primary { color: #0059ff !important; }
.border-primary { border-color: #0059ff !important; }

/* ---------------------------------------------------------------
   SECTION D — DevExpress component overrides
   --------------------------------------------------------------- */

/* NOTE:
   Avoid broad .dxbl-btn-primary overrides because they also affect
   popup menu items rendered by DevExpress (e.g. DxDropDownButton).
   Brand colors are already provided via :root --bs-* and --rz-* tokens. */

/* DevExpress buttons: squared corners across the app */
.dxbl-btn {
    border-radius: 0 !important;
}

/* DevExpress text editor token override (remove built-in control border) */
.dxbl-text-edit,
.dxbl-spin-edit,
.dxbl-date-edit,
.dxbl-combobox,
.dxbl-dropdown-edit,
.dxbl-tagbox {
    --dxbl-text-edit-border-color: transparent;
    --dxbl-text-edit-border-style: solid;
    --dxbl-text-edit-border-width: 0;
    /* Focus ring: override bs-primary rgba / flat #0059ff from DevExpress defaults */
    --dxbl-text-edit-focus-border-color: #0059ff;
    --dxbl-text-edit-focus-shadow-color: #0059ff;
}

.dxbl-btn.dxbl-btn-outline-secondary.dxbl-edit-btn-dropdown {
    background-color: #f4f4f4 !important;
}

.dxbl-btn.dxbl-btn-outline-secondary.dxbl-spin-btn-dec.dxbl-btn-last {
    background-color: #f4f4f4 !important;
}

.dxbl-btn.dxbl-btn-outline-secondary.dxbl-spin-btn-inc.dxbl-btn-first {
    background-color: #f4f4f4 !important;
}

/* DevExpress editor icons are swapped via js/material-editor-icons.js */
.dxbl-btn.dxbl-edit-btn-dropdown .dxbl-image,
.dxbl-btn.dxbl-spin-btn-inc .dxbl-image,
.dxbl-btn.dxbl-spin-btn-dec .dxbl-image,
.dxbl-btn.dxbl-clear-btn .dxbl-image,
.dxbl-grid .dxbl-grid-search-box-container .dxbl-btn-icon .dxbl-image {
    width: 18px !important;
    height: 18px !important;
}

.dxbl-btn.dxbl-edit-btn-dropdown svg,
.dxbl-btn.dxbl-spin-btn-inc svg,
.dxbl-btn.dxbl-spin-btn-dec svg,
.dxbl-btn.dxbl-clear-btn svg,
.dxbl-grid .dxbl-grid-search-box-container .dxbl-btn-icon svg {
    width: 18px !important;
    height: 18px !important;
}

.dxbl-tag {
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
}

/* TagBox: force true vertical centering for tags and input text */
.dxbl-tagbox .dxbl-tag,
.dxbl-tag-box .dxbl-tag {
    display: flex !important;
    align-items: center !important;
    height: 28px !important;
    min-height: 28px !important;
    max-height: 28px !important;
}

.dxbl-tagbox .dxbl-tag-content,
.dxbl-tagbox .dxbl-tag-text,
.dxbl-tag-box .dxbl-tag-content,
.dxbl-tag-box .dxbl-tag-text {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    line-height: 1 !important;
}

.dxbl-tagbox .dxbl-tag .dxbl-btn,
.dxbl-tag-box .dxbl-tag .dxbl-btn {
    display: flex !important;
    align-items: center !important;
}

.dxbl-tagbox .form-control,
.dxbl-tagbox input,
.dxbl-tagbox .dxbl-placeholder,
.dxbl-tag-box .form-control,
.dxbl-tag-box input,
.dxbl-tag-box .dxbl-placeholder {
    line-height: 1 !important;
}

/* TagBox field container: center tags against dropdown field height */
.dxbl-tagbox,
.dxbl-tag-box,
.dxbl-tagbox .form-control,
.dxbl-tag-box .form-control {
    display: flex !important;
    align-items: center !important;
}

.dxbl-tagbox .form-control,
.dxbl-tag-box .form-control {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.dxbl-modal-title.dxbl-text {
    font-size: 20px !important;
    font-weight: 400 !important;
}

.dxbl-modal-header.dxbl-popup-header,
.dxbl-popup.comu-modal .dxbl-popup-header,
.dxbl-modal > .dxbl-modal-root > .dxbl-popup .dxbl-popup-header {
    min-height: 60px !important;
    padding: 16px !important;
}

.dxbl-modal > .dxbl-modal-root > .dxbl-popup > .dxbl-modal-content > .dxbl-modal-body {
    padding: 16px !important;
}

.dxbl-modal .dxbl-btn:not(.dxbl-edit-btn-dropdown):not(.dxbl-spin-btn-dec):not(.dxbl-spin-btn-inc):not(.dxbl-clear-btn),
.dxbl-popup.comu-modal .dxbl-btn:not(.dxbl-edit-btn-dropdown):not(.dxbl-spin-btn-dec):not(.dxbl-spin-btn-inc):not(.dxbl-clear-btn),
.dxbl-modal > .dxbl-modal-root > .dxbl-popup .dxbl-btn:not(.dxbl-edit-btn-dropdown):not(.dxbl-spin-btn-dec):not(.dxbl-spin-btn-inc):not(.dxbl-clear-btn) {
    min-height: 40px !important;
    height: 40px !important;
}

/* Form controls: Carbon light gray surface, bottom border only, squared corners */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select,
.form-control,
.form-select,
.input-group-text {
    border-radius: 0 !important;
    background-color: var(--rz-base-50, #f4f4f4) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--rz-base-300, #a8a8a8) !important;
}

/* DxMemo: il bordo bottom è sul wrapper, non sul textarea interno */
.dxbl-memo textarea,
.dxbl-memo .form-control {
    border-bottom: 0 !important;
}

/* DevExpress composite editors: single surface with no internal separator */
.dxbl-text-edit,
.dxbl-spin-edit,
.dxbl-date-edit,
.dxbl-combobox,
.dxbl-dropdown-edit,
.dxbl-tagbox,
.dxbl-memo {
    border-radius: 0 !important;
    background-color: var(--rz-base-50, #f4f4f4) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--rz-base-300, #a8a8a8) !important;
}

.dxbl-text-edit .form-control,
.dxbl-spin-edit .form-control,
.dxbl-date-edit .form-control,
.dxbl-combobox .form-control,
.dxbl-dropdown-edit .form-control,
.dxbl-tagbox .form-control {
    border-radius: 0 !important;
    background-color: var(--rz-base-50, #f4f4f4) !important;
    border: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

/* Fixed field height for input/select/dropdown editors */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
select,
.form-control,
.form-select,
.dxbl-text-edit,
.dxbl-spin-edit,
.dxbl-date-edit,
.dxbl-combobox,
.dxbl-dropdown-edit,
.dxbl-tagbox,
.dxbl-text-edit .form-control,
.dxbl-spin-edit .form-control,
.dxbl-date-edit .form-control,
.dxbl-combobox .form-control,
.dxbl-dropdown-edit .form-control,
.dxbl-tagbox .form-control {
    min-height: 40px;
    height: 40px;
}

/* Buttons with icons: shared flex + vertical centering */
.dxbl-btn:has(.dxbl-image),
.dxbl-btn:has(.ms-Icon) {
    display: inline-flex;
    align-items: center;
}

/* Caption + icon: keep icon to the right of the label (LTR) */
.dxbl-btn:has(.dxbl-btn-text:not(:empty)) .dxbl-image {
    order: 2;
    margin-left: 0.375rem;
    margin-right: 0;
}

.dxbl-btn:has(.dxbl-btn-text:not(:empty)) .ms-Icon,
.dxbl-btn:has(.dxbl-btn-text:not(:empty)) [class*="ms-Icon--"] {
    order: 2;
    margin-left: 0.375rem;
    margin-right: 0;
}

/* Icon-only: icon stays on the right side of the button (no justify-content:center — that shifts the glyph leftward in LTR) */
.dxbl-btn.dxbl-btn-icon-only:has(.dxbl-image),
.dxbl-btn:has(.dxbl-image):not(:has(.dxbl-btn-text:not(:empty))),
.dxbl-btn.dxbl-btn-icon-only:has(.ms-Icon),
.dxbl-btn:has(.ms-Icon):not(:has(.dxbl-btn-text:not(:empty))) {
    justify-content: flex-end;
    gap: 8px;
}

.dxbl-btn.dxbl-btn-icon-only .dxbl-image,
.dxbl-btn:has(.dxbl-image):not(:has(.dxbl-btn-text:not(:empty))) .dxbl-image {
    order: 2;
    margin-left: 0;
    margin-right: 0;
}

.dxbl-btn.dxbl-btn-icon-only .ms-Icon,
.dxbl-btn.dxbl-btn-icon-only [class*="ms-Icon--"],
.dxbl-btn:has(.ms-Icon):not(:has(.dxbl-btn-text:not(:empty))) .ms-Icon,
.dxbl-btn:has([class*="ms-Icon--"]):not(:has(.dxbl-btn-text:not(:empty))) [class*="ms-Icon--"] {
    order: 2;
    margin-left: 0;
    margin-right: 0;
}

/* Improve DevExpress button icon legibility */
.dxbl-btn .ms-Icon,
.dxbl-btn [class*="ms-Icon--"],
.dxbl-btn .dxbl-image {
    font-size: 18px;
}

/* DevExpress chart: legend item labels (e.g. admin dashboard workload chart) */
.comu-dashboard-chart .dxbl-chart-legend-text {
    font-size: 14px;
}

/* Chart outer wrapper (padding, no border) */
.comu-chart-container {
    padding: 1rem;
    border: none;
    background-color: #fff;
}

/* DevExpress grid header (scroll viewer layout) */
.dxbl-grid > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > .dxbl-grid-table > thead {
    background-color: #e0e0e0;
}

.dxbl-grid > .dxbl-scroll-viewer > .dxbl-scroll-viewer-content > .dxbl-grid-table > thead > tr > th {
    background-color: #e0e0e0;
    padding-left: 1rem;
}

/* DevExpress grid: drop hi-DPI --dxbl-border-width-with-scaling on inplace edit cells
   (same selectors as bootstrap-external.bs5.css; theme loads after DevExpress). */
@media (-webkit-min-device-pixel-ratio: 1.25) and (-webkit-max-device-pixel-ratio: 1.4895833333333333),
    (-o-min-device-pixel-ratio: 5/4) and (-o-max-device-pixel-ratio: 143/96),
    (min-resolution: 120dpi) and (max-resolution: 143dpi) {
    .dxbl-grid .dxbl-grid-table > thead > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
    .dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
    .dxbl-grid .dxbl-grid-table > tfoot > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell) {
        --dxbl-border-width-with-scaling: 0px;
    }
}

@media (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 1.7395833333333333),
    (-o-min-device-pixel-ratio: 3/2) and (-o-max-device-pixel-ratio: 167/96),
    (min-resolution: 144dpi) and (max-resolution: 167dpi) {
    .dxbl-grid .dxbl-grid-table > thead > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
    .dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
    .dxbl-grid .dxbl-grid-table > tfoot > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell) {
        --dxbl-border-width-with-scaling: 0px;
    }
}

@media (-webkit-min-device-pixel-ratio: 1.75), (-o-min-device-pixel-ratio: 7/4), (min-resolution: 168dpi) {
    .dxbl-grid .dxbl-grid-table > thead > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
    .dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
    .dxbl-grid .dxbl-grid-table > tfoot > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell) {
        --dxbl-border-width-with-scaling: 0px;
    }
}

/* DevExpress grid: no edit-row band (override var(--dxbl-grid-edit-row-bg) on inplace cells, incl. fixed columns) */
.dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
.dxbl-grid .dxbl-grid-table > tfoot > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell),
.dxbl-grid .dxbl-grid-table > thead > tr.dxbl-grid-edit-row.dxbl-grid-editor-inplace-container > td:not(.dxbl-grid-empty-cell):not(.dxbl-grid-indent-cell) {
    background-color: #fff;
}

/* DevExpress grid selection highlight */
.dxbl-grid .dxbl-grid-table > tbody > tr.dxbl-grid-row-selected > td {
    background-color: var(--comu-primary-light);
}

/* Alternate row tinting applied via CustomizeElement */
.dxbl-grid .dxbl-grid-table > tbody > tr.grid-alt-row > td {
    background-color: var(--bs-gray-100, #f8f9fa);
}

/* Auto-refresh highlight for new/updated rows */
.dxbl-grid .dxbl-grid-table > tbody > tr.grid-row-highlight > td {
    background-color: var(--bs-warning-bg-subtle, #fff3cd);
    transition: background-color 0.4s ease-out;
}

/* DevExpress focus ring */
.dxbl-focus-ring {
    box-shadow: 0 0 0 2px rgba(0, 89, 255, 0.28);
}

/* ---------------------------------------------------------------
   SECTION E — Typography
   --------------------------------------------------------------- */
html, body {
    font-family: var(--comu-font-family);
}

/* ---------------------------------------------------------------
   SECTION F - Customer floorplan editor
   --------------------------------------------------------------- */
.comu-floorplan-editor-row {
    --comu-floorplan-editor-height: clamp(360px, calc(100vh - 340px), 600px);
}

.comu-floorplan-editor-row > .col-12 {
    display: flex;
}

.comu-floorplan-editor-row > .col-12 > .vstack {
    width: 100%;
}

.comu-floorplan-list-panel {
    height: var(--comu-floorplan-editor-height);
    max-height: var(--comu-floorplan-editor-height);
    overflow: auto;
    background: #f4f4f4;
}

.comu-floorplan-list-panel.rounded {
    border-radius: 0 !important;
}

.comu-floorplan-card {
    width: 100%;
    border: 0;
    border-bottom: 1px solid #e0e0e0 !important;
    background: #ffffff;
    text-align: left;
    padding: 0.85rem 1rem 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.comu-floorplan-card:hover {
    background: #f8f9fa;
}

.comu-floorplan-card.is-selected {
    background: #c6c6c6;
}

.comu-floorplan-card-title {
    font-size: 1rem;
    font-weight: 500;
    color: #161616;
    line-height: 1.3;
}

.comu-floorplan-card-site-name {
    font-size: 0.82rem;
    color: #6f6f6f;
    line-height: 1.2;
}

.comu-floorplan-card-count {
    margin-top: 0.2rem;
    font-size: 0.98rem;
    color: #0f62fe;
    line-height: 1.3;
}

.comu-floorplan-editor-shell {
    position: relative;
    background-color: #ffffff;
    height: var(--comu-floorplan-editor-height);
    max-height: var(--comu-floorplan-editor-height);
    overflow: hidden;
}

.comu-floorplan-canvas-scroll {
    position: relative;
    height: 100%;
    overflow: auto;
    padding: 0.5rem;
    padding-right: 21rem;
    overscroll-behavior: contain;
    scrollbar-width: none;
}

.comu-floorplan-canvas-scroll::-webkit-scrollbar {
    display: none;
}

.comu-floorplan-canvas-pan-enabled {
    cursor: grab;
}

.comu-floorplan-canvas-pan-enabled.is-dragging-pan {
    cursor: grabbing;
}

.comu-floorplan-zoom-surface {
    width: 100%;
    transform-origin: top left;
    will-change: transform;
}

.comu-floorplan-assets-overlay {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    bottom: 0.5rem;
    width: 16rem;
    overflow: auto;
    padding-right: 0.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.comu-floorplan-assets-panel {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    padding: 0.75rem;
}

.comu-floorplan-assets-title {
    font-size: 0.875rem;
    font-weight: 600;
    color: #161616;
    margin-bottom: 0.5rem;
}

.comu-floorplan-assets-group-title {
    font-size: 0.75rem;
    font-weight: 600;
    color: #525252;
    margin-top: 0.5rem;
    margin-bottom: 0.25rem;
}

.comu-floorplan-assets-row {
    --comu-asset-color: #e0e0e0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 1.7rem;
    padding: 0.15rem 0.35rem;
    border-left: 4px solid var(--comu-asset-color);
    background: #efefef;
    color: #161616;
    margin-bottom: 0.3rem;
}

.comu-floorplan-assets-row .ms-Icon,
.comu-floorplan-assets-row [class*="ms-Icon--"] {
    font-size: 18px;
    color: inherit !important;
}

.comu-floorplan-assets-row .dxbl-btn {
    justify-content: flex-start;
}

.comu-floorplan-asset-unlink-button.dxbl-btn {
    --bs-btn-bg: transparent;
    --bs-btn-hover-bg: transparent;
    --bs-btn-active-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-border-color: transparent;
    padding: 0;
    color: #0f62fe;
    text-decoration: none;
    margin-left: auto;
}

@media (max-width: 991.98px) {
    .comu-floorplan-editor-row {
        --comu-floorplan-editor-height: auto;
    }

    .comu-floorplan-editor-shell {
        min-height: auto;
        height: auto;
        max-height: none;
    }

    .comu-floorplan-canvas-scroll {
        height: auto;
        max-height: 58vh;
        padding-right: 0.5rem;
        scrollbar-width: auto;
    }

    .comu-floorplan-canvas-scroll::-webkit-scrollbar {
        display: initial;
    }

    .comu-floorplan-assets-overlay {
        position: static;
        width: 100%;
        max-height: 40vh;
        padding: 0 0.5rem 0.5rem;
    }
}

body:has(#tech-audit-report-page) .tar-sign-pad-wrap {
    border: none !important; 
    border-radius: 0 !important;
    overflow: hidden;
    box-sizing: border-box;
}

body:has(#tech-audit-report-page) .tar-sign-pad-wrap .signature,
body:has(#tech-audit-report-page) .tar-sign-pad-wrap canvas.signature {
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    height: 200px;
}

/* SignaturePad clear button lives inside isolated component — scope like pad wrapper */
body:has(#tech-audit-report-page) .tar-sign-clear-btn,
body:has(#tech-audit-report-page) button.tar-sign-clear-btn {
    display: inline-flex !important;
    align-items: center !important;
    align-self: flex-start !important;
    margin: 0 !important;
    padding: 8px 8px !important;
    font-size: 14px !important;
    border: none !important;
    background: transparent !important;
    color: var(--bs-link-color) !important;
    cursor: pointer !important;
    border-radius: 0 !important;
    flex-shrink: 0 !important;
}

body:has(#tech-audit-report-page) .tar-sign-clear-btn:hover,
body:has(#tech-audit-report-page) button.tar-sign-clear-btn:hover {
    background: #f4f4f4 !important;
}