/* Safari fix to allow custom styling on input fields */
#adminForm input.invalid {
    -webkit-appearance: none;
    appearance: none;
    border: 2px solid #ff0000 !important;
    background-color: #fff0f0 !important;
}

/* Base status text layout */
#vat-status {
    display: none;
    margin-left: 10px;
    font-weight: bold;
    vertical-align: middle;
}

/* Color states managed via CSS classes */
#vat-status.status-valid {
    display: inline-block;
    color: #00aa00;
}

#vat-status.status-invalid,
#vat-status.status-retry,
#vat-status.status-error {
    display: inline-block;
    color: #ff0000;
}

/* Container for the order summary */
.summary-well {
    position: relative;
}

/* Margin reset for the summary title */
.summary-well .summary-title {
    margin-top: 0;
}

/* Table bottom margin adjustment */
.summary-well .summary-table {
    margin-bottom: 15px;
}

/* Align right utility if Bootstrap default is missing */
.summary-well .text-right {
    text-align: right;
}

/* Total price line styling matching your layout */
.summary-well .summary-total-header {
    border-top: 1px solid #ccc !important;
}

/* Hidden by default loading overlay */
.order-overlay {
    display: none; /* Controlled by JavaScript (flex / none) */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 10;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease-in-out;
}

/* Color adjustment for the spinner icon */
.order-spinner {
    color: #0088cc;
}

/* Class injected via JavaScript when calculation is running */
.summary-table.loading-fade {
    opacity: 0.4;
    pointer-events: none; /* Prevent any clicks while calculating */
}

/* Core alert box margins */
.correction-alert-box {
    margin-bottom: 15px;
}

.correction-title {
    margin: 0;
}

.correction-link-para {
    margin: 4px 0 0;
}

.correction-help-text {
    margin: 4px 0 0;
}

/* Collapsible inner form wrap */
.correction-form-wrapper {
    margin-top: 15px;
}

.correction-label {
    font-weight: bold;
}

/* Loading spinner alignment */
.correction-loading-indicator {
    display: none; /* Controlled by JS via 'inline-block' or 'none' */
    margin-left: 10px;
    vertical-align: middle;
}

/* Hidden by default alerts inside collapse */
.correction-status-box {
    display: none; /* Controlled by JS */
    margin-top: 15px;
    margin-bottom: 0;
}

/* Base styles for the toggle link */
.correction-toggle-link {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px; /* Creates a clean space between text and arrow */
}

/* Base styles for the arrow icon with smooth CSS transition rotation */
.correction-arrow {
    display: inline-block;
    font-size: 0.85em; /* Make the arrow slightly smaller and elegant */
    transition: transform 0.2s ease-in-out;
}

/* WHEN OPENED (Bootstrap removes the 'collapsed' class): Rotate the arrow 180 degrees to point UP */
.correction-toggle-link[aria-expanded="true"] .correction-arrow {
    transform: rotate(180deg);
}

/* Optional: Slight color change on hover to make it feel clickable */
.correction-toggle-link:hover .correction-arrow {
    opacity: 0.8;
}