/* =============================================================================
   Dashboard Shipping Workflow Styles
   ============================================================================= */

/* =============================================================================
   IMPROVED CUSTOMS DECLARATION UI
   ============================================================================= */

.parcel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space) var(--space);
    background: var(--color-bg-secondary);
    border-bottom: 1px solid var(--color-border-lighter);
}

.parcel-title {
    margin: 0;
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
}

.parcel-item-count {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary) !important;
    background: var(--color-bg-tertiary);
    padding: var(--space) var(--space);
    border-radius: 20px;
}

.customs-items-container {
    padding: var(--space);
}

.customs-item {
    background: var(--color-bg-secondary);
    border: 2px solid var(--color-border-light);
    border-radius: 8px;
    margin-bottom: var(--space);
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.customs-item:last-child {
    margin-bottom: 0;
}

.original-item-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--space);
}

.customs-inputs-grid {
    display: grid;
    grid-template-columns: 1fr 120px 100px;
    gap: var(--space);
    padding: var(--space);
    background: var(--color-bg-secondary);
}

.customs-inputs-grid + .customs-inputs-grid {
    padding-top: 0;
    border-top: 1px solid var(--color-border-lighter);
}

.input-group {
    display: flex;
    flex-direction: column;
    gap: var(--space);
}

.input-label {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
    display: flex;
    align-items: center;
    gap: var(--space);
    margin-bottom: 2px;
}

.input-label .required {
    color: var(--color-error);
    font-weight: var(--font-weight-bold);
}

.hs-reference {
    color: var(--color-accent);
    text-decoration: none;
    font-size: var(--font-size-xs);
    opacity: 0.8;
    transition: opacity 0.2s ease;
}

.hs-reference:hover {
    opacity: 1;
}

.item-name-link {
    color: var(--color-accent);
    text-decoration: none;
}

.item-name-link:hover {
    color: var(--color-accent);
    text-decoration: underline;
}

@media (max-width: 768px) {
    .customs-inputs-grid {
        grid-template-columns: 1fr;
        gap: var(--space);
    }
    
    .parcel-header {
        padding: var(--space) var(--space);
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space);
    }
    
    .original-item-info {
        flex-direction: column;
        align-items: flex-start;
        gap: var(--space);
    }
    
    .customs-items-container {
        padding: var(--space);
    }
    
}

@media (max-width: 480px) {
    .parcel-customs-section {
        margin: var(--space) 0;
        border-radius: 8px;
    }
    
    .customs-item-card {
        border-radius: 6px;
        margin-bottom: var(--space);
    }
    
    .customs-inputs-grid {
        padding: var(--space);
    }
}

.customs-input,
.customs-form input[type="text"],
.customs-form input[type="number"] {
    width: 100%;
    padding: var(--space) var(--space);
    border: 1px solid var(--color-border-light);
    border-radius: 10px;
    background: var(--color-bg-main) !important;
    color: var(--color-text-primary) !important;
    font-size: var(--font-size-sm);
    font-family: var(--font-primary);
    transition: all 0.2s ease;
    box-sizing: border-box;
    max-width: 100%;
}

.customs-input:hover,
.customs-form input[type="text"]:hover,
.customs-form input[type="number"]:hover {
    border-color: var(--color-accent);
}

.customs-input:focus,
.customs-form input[type="text"]:focus,
.customs-form input[type="number"]:focus {
    outline: none;
    border-color: var(--color-accent);
    box-shadow: 0 0 0 2px var(--color-glow);
}

.suggestion-note {
    display: block;
    color: var(--color-accent);
    font-size: var(--font-size-xs);
    margin-top: var(--space);
    font-style: italic;
}

.value-note {
    display: block;
    color: var(--color-text-secondary) !important;
    font-size: var(--font-size-xs);
    margin-top: var(--space);
}

.parcel-purpose {
    margin-top: var(--space);
    padding: var(--space);
    background: var(--color-bg-secondary);
    border-radius: 6px;
}

.parcel-purpose label {
    display: block;
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary) !important;
    margin-bottom: var(--space);
}

.parcel-purpose select {
    padding: var(--space);
    border: 1px solid var(--color-border);
    border-radius: 4px;
    background: var(--color-bg-main) !important;
    color: var(--color-text-primary) !important;
    font-size: var(--font-size-sm);
    margin-right: var(--space);
}

.parcel-purpose small {
    color: var(--color-text-secondary) !important;
    font-size: var(--font-size-xs);
    font-style: italic;
}

.preferences-actions {
    display: flex;
    gap: calc(0.75 * var(--space));
    margin-bottom: var(--space);
    padding: var(--space);
    background-color: var(--color-surface-secondary);
    border-radius: 8px;
    border: 1px solid var(--color-border);
}

.lunarcat-shipping-workflow .preferences-actions .btn {
    font-size: 0.875rem;
    padding: var(--space) var(--space);
    border-radius: 6px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    gap: calc(0.5 * var(--space));
}

.lunarcat-shipping-workflow .preferences-actions .btn-secondary {
    background-color: var(--color-surface);
    color: var(--color-text-secondary) !important;
    border-color: var(--color-border) !important;
}

.lunarcat-shipping-workflow .preferences-actions .btn-secondary:hover {
    background-color: var(--color-surface-tertiary);
    color: var(--color-text-primary) !important;
    border-color: var(--color-accent);
}

.preferences-actions .btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.hs-code-reference {
    font-size: var(--font-size-xs);
    color: var(--color-accent);
    text-decoration: none;
    font-weight: var(--font-weight-medium);
    margin-left: var(--space);
    white-space: nowrap;
}

.hs-code-reference:hover {
    text-decoration: underline;
    color: var(--color-accent);
}

.parcel-option {
    display: block;
    margin-bottom: var(--space);
    border: 1px solid var(--color-border-lighter);
    border-radius: 8px;
    background: var(--color-bg-main) !important;
    cursor: pointer;
    transition: all 0.2s ease;
}

.parcel-option:hover {
    border-color: var(--color-accent);
    box-shadow: var(--shadow-card);
}

.parcel-option input[type="checkbox"] {
    margin: var(--space) 0 0 var(--space);
}

.parcel-details {
    padding: var(--space);
    padding-top: 0;
}

.parcel-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--space);
}

.parcel-meta {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary) !important;
}


.shipping-step .step-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space) var(--space);
    margin: var(--space) var(--space) 0 var(--space);
    border-bottom: 1px solid var(--color-border-lighter);
    background: var(--gradient-header);
    border-radius: 8px 8px 0 0;
}

.shipping-step .step-header h4 {
    margin: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
}

.shipping-step h4 {
    margin: 0 0 var(--space) 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
}

.shipping-step.error .error-content {
    padding: var(--space);
    margin: var(--space);
    background: var(--gradient-content-card);
    border-radius: var(--border-radius-md);
}

.shipping-step.error .error-content p {
    color: var(--color-text-primary) !important;
    font-size: var(--font-size-md);
    margin-bottom: var(--space);
    line-height: 1.6;
}

.selected-parcels-review {
    margin-bottom: var(--space);
}

.parcel-list {
    list-style: none;
    padding: 0;
    margin: var(--space) 0;
    background: var(--gradient-content-card);
    border-radius: var(--border-radius-md);
    padding: var(--space);
    border: 1px solid var(--color-border-lighter);
}

.parcel-list li {
    padding: var(--space) 0;
    color: var(--color-text-primary) !important;
    font-weight: var(--font-weight-medium);
}

.shipping-method-group {
    display: flex;
    flex-direction: column;
    gap: var(--space);
    margin-bottom: var(--space);
}

.rate-option {
    display: flex;
    align-items: center;
    gap: var(--space);
    padding: var(--space);
    cursor: pointer;
}


.rate-option input[type="radio"] {
    margin-top: var(--space);
}

.rate-option.is-disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.rate-option.is-disabled .rate-label {
    pointer-events: none;
}

.rate-option.is-disabled input[type="radio"] {
    cursor: not-allowed;
}

.rate-unavailable-note {
    margin-top: 6px;
    font-size: 13px;
    color: var(--color-text-secondary);
}

.rate-unavailable-price {
    color: var(--color-text-primary);
    font-weight: var(--font-weight-semibold);
    opacity: 1;
}

.rate-option.is-disabled .rate-unavailable-price {
    opacity: 1;
}

.carrier-logo {
    width: 40px;
    height: auto;
    max-height: 30px;
    object-fit: contain;
    opacity: 0.8;
    background-color: transparent;
}

.carrier-info {
    display: flex;
    flex-direction: column;
    gap: var(--space);
    justify-content: center;
}

.carrier-title-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
}

.rate-carrier-name {
    font-size: var(--font-size-md);
    color: var(--color-text-primary) !important;
    font-weight: var(--font-weight-semibold);
    white-space: nowrap;
}

.rate-carrier-chip {
    white-space: nowrap;
}

.rate-pricing {
    text-align: right;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
}

.payment-buttons {
    display: flex;
    flex-direction: column;
    gap: var(--space);
    margin-bottom: var(--space);
}

.payment-button-container {
    display: flex;
    justify-content: center;
    min-height: 50px;
}

.wise-payment-container {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--space);
    background: var(--color-background);
    border: 2px dashed var(--color-border);
    border-radius: var(--border-radius-md);
    text-align: center;
    color: var(--color-text-muted);
}

.payment-note {
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
    text-align: center;
    margin: 0;
    font-style: italic;
}

.cost-summary {
    margin: var(--space) 0;
    padding: var(--space);
    background: var(--color-background-secondary);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-md);
    color: var(--color-text-primary) !important;
}

.cost-summary .cost-line {
    display: flex;
    justify-content: space-between;
    padding: var(--space) 0;
    color: var(--color-text-primary) !important;
}

.cost-summary .cost-total {
    margin-top: var(--space);
    padding-top: var(--space);
    border-top: 1px solid var(--color-border);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
}

.carrier-group {
    margin-bottom: var(--space);
    border: 1px solid var(--color-border);
    border-radius: var(--border-radius-md);
    overflow: hidden;
}

.carrier-group-header {
    display: flex;
    align-items: center;
    gap: var(--space);
    padding: var(--space);
    background: var(--color-background-secondary);
    border-bottom: 1px solid var(--color-border);
}

.carrier-logo-large {
    flex-shrink: 0;
}

.carrier-logo-large img {
    height: 55px;
    width: auto;
    object-fit: contain;
    opacity: 0.9;
}


.carrier-name {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
}

.cost-breakdown {
    display: flex;
    flex-direction: column;
    gap: var(--space);
}

.cost-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space) 0;
}

.cost-line.total {
    border-top: 1px solid var(--color-border-lighter);
    padding-top: var(--space);
    margin-top: var(--space);
    font-size: var(--font-size-lg);
}

.shipping-step.success {
    text-align: center;
}

.success-details {
    background: var(--gradient-content-card);
    border: 1px solid var(--color-accent);
    border-radius: var(--border-radius-md);
    padding: var(--space);
    margin-bottom: var(--space);
}

.success-info p {
    margin: 0 0 var(--space) 0;
    font-size: var(--font-size-md);
    color: var(--color-text-primary) !important;
}

.shipment-details {
    background: var(--color-background);
    border-radius: var(--border-radius-sm);
    padding: var(--space);
    margin-bottom: var(--space);
    text-align: left;
}

.detail-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space) 0;
    border-bottom: 1px solid var(--color-border-lighter);
}

.detail-row:last-child {
    border-bottom: none;
}

.detail-row span:first-child {
    color: var(--color-text-muted);
    font-weight: var(--font-weight-medium);
}

.detail-row span:last-child {
    color: var(--color-text-primary) !important;
    font-weight: var(--font-weight-medium);
}

.next-steps {
    text-align: left;
    margin-top: var(--space);
}

.next-steps h5 {
    margin: 0 0 var(--space) 0;
    color: var(--color-text-primary) !important;
    font-weight: var(--font-weight-semibold);
}

.next-steps ul {
    margin: 0;
    padding-left: var(--space);
}

.next-steps li {
    margin-bottom: var(--space);
    color: var(--color-text-secondary) !important;
    line-height: 1.5;
}

.centered-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space);
    text-align: center;
    padding: var(--space) 0;
}

.centered-content .icon {
    font-size: 64px;
}

.centered-content h3 {
    color: var(--color-text-primary) !important;
    font-size: var(--font-size-lg);
    margin: 0;
    font-weight: var(--font-weight-semibold);
}

.centered-content p {
    color: var(--color-text-primary) !important;
    font-size: var(--font-size-md);
    margin: 0;
}

.processing-animation {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space);
    text-align: center;
    padding: var(--space) 0;
}

.processing-animation p {
    color: var(--color-text-primary) !important;
}

.spinner {
    width: 40px;
    height: 40px;
    border: 4px solid var(--color-border-lighter);
    border-top: 4px solid var(--color-accent);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.step-actions {
    display: flex;
    gap: var(--space);
    margin-top: var(--space);
    padding-top: var(--space);
    border-top: 1px solid var(--color-border-lighter);
    justify-content: flex-end;
}

.lunarcat-shipping-workflow .btn {
    font-weight: var(--font-weight-semibold);
}

/* =============================================================================
   COMPREHENSIVE INPUT FIELD DARK MODE FIX
   ============================================================================= */

[data-theme="dark"] input,
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] input[type="url"],
[data-theme="dark"] input[type="tel"],
[data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="time"],
[data-theme="dark"] input[type="datetime-local"],
[data-theme="dark"] .lunarcat-shipping-workflow textarea,
[data-theme="dark"] .lunarcat-shipping-workflow select {
    background: var(--color-bg-medium) !important;
    color: var(--color-text-primary) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: 10px !important;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] input[type="text"]:focus,
[data-theme="dark"] input[type="email"]:focus,
[data-theme="dark"] input[type="password"]:focus,
[data-theme="dark"] input[type="number"]:focus,
[data-theme="dark"] input[type="search"]:focus,
[data-theme="dark"] input[type="url"]:focus,
[data-theme="dark"] input[type="tel"]:focus,
[data-theme="dark"] input[type="date"]:focus,
[data-theme="dark"] input[type="time"]:focus,
[data-theme="dark"] input[type="datetime-local"]:focus,
[data-theme="dark"] .lunarcat-shipping-workflow textarea:focus,
[data-theme="dark"] .lunarcat-shipping-workflow select:focus {
    background: var(--color-bg-tertiary) !important;
    border-color: var(--color-accent) !important;
    box-shadow: 0 0 0 2px var(--color-glow) !important;
}

[data-theme="dark"] .lunarcat-shipping-workflow input::placeholder,
[data-theme="dark"] .lunarcat-shipping-workflow textarea::placeholder {
    color: var(--color-text-secondary) !important;
    opacity: 0.7 !important;
}

[data-theme="dark"] input:-webkit-autofill,
[data-theme="dark"] input:-webkit-autofill:hover,
[data-theme="dark"] .lunarcat-shipping-workflow input:-webkit-autofill:focus,
[data-theme="dark"] .lunarcat-shipping-workflow input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px var(--color-bg-medium) inset !important;
    -webkit-text-fill-color: var(--color-text-primary) !important;
}

/* =============================================================================
   WORKFLOW INFO + CALLOUTS
   ============================================================================= */

.customs-warning {
    background: var(--color-warning-bg);
    border-left: 4px solid var(--color-warning);
    padding: var(--space);
    margin: 0 calc(var(--space) + var(--space)) var(--space);
    border-radius: 4px;
    font-size: var(--font-size-sm);
    line-height: 1.6;
    color: var(--color-text-primary) !important;
}

.customs-info {
    background: #e3f2fd;
    border-left: 4px solid #2196f3;
    padding: var(--space);
    margin: 0 calc(var(--space) + var(--space)) var(--space);
    border-radius: 4px;
    font-size: var(--font-size-sm);
    line-height: 1.6;
    color: #1a1a1a;
}

[data-theme="dark"] .customs-info {
    background: #1e3a5f;
    border-left: 4px solid #64b5f6;
    color: #e3f2fd;
}

.customs-option {
    padding: 0 calc(var(--space) + var(--space));
    margin: var(--space) 0;
    display: flex;
    justify-content: flex-end;
}

.customs-option label {
    display: flex;
    align-items: flex-start;
    gap: var(--space);
    cursor: pointer;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    font-family: var(--font-primary);
    line-height: 1.6;
    background: var(--color-bg-secondary);
    padding: var(--space);
    border-radius: var(--border-radius-md);
    border: 2px solid var(--color-border-light);
    transition: all 0.2s ease;
}

.customs-option label:hover {
    border-color: var(--color-accent);
    background: var(--color-bg-tertiary);
}

.customs-option label span {
    color: var(--color-text-primary);
}

[data-theme="dark"] .customs-option label span {
    color: var(--color-text-primary);
}

.customs-option input[type="checkbox"] {
    margin-top: 3px;
    flex-shrink: 0;
}

.ready-customs-option.is-disabled {
    opacity: 0.5;
}

.ready-customs-option.is-disabled input {
    cursor: not-allowed;
}

.warning-box {
    background: var(--color-warning-bg);
    border: 1px solid var(--color-warning);
    border-radius: var(--border-radius-md);
    padding: var(--space);
    margin: var(--space);
    text-align: center;
}

.warning-box p {
    color: var(--color-text-primary) !important;
    margin: 0 0 var(--space) 0;
}

.warning-box p:last-child {
    margin-bottom: 0;
    color: var(--color-text-secondary) !important;
    font-size: var(--font-size-sm);
}

.warning-box .btn {
    margin: 0 var(--space);
}

.parcels-selection {
    padding: var(--space) calc(var(--space) + var(--space));
    display: flex;
    flex-direction: column;
    gap: var(--space);
}

.parcel-option {
    display: flex;
    align-items: center;
    gap: var(--space);
    padding: var(--space);
    border: 2px solid var(--color-border-light);
    border-radius: 8px;
    background: var(--color-bg-secondary);
    cursor: pointer;
    transition: all 0.2s ease;
}

.parcel-option:hover {
    border-color: var(--color-accent);
    background: var(--color-bg-tertiary);
}

.parcel-option input[type="checkbox"] {
    cursor: pointer;
    flex-shrink: 0;
}

.parcel-option strong {
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
    min-width: 100px;
}

.parcel-option .parcel-info {
    margin-left: auto;
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary) !important;
    text-align: right;
}

.customs-form {
    padding: var(--space) calc(var(--space) + var(--space));
}

.customs-items-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.customs-items-table thead {
    width: 100%;
}

.customs-items-table thead th {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-accent) !important;
    padding: var(--space);
    text-align: center;
    border-bottom: 2px solid var(--color-border-light);
    vertical-align: middle;
    box-sizing: border-box;
}

.customs-items-table thead th:nth-child(1) {
    width: 20% !important;
}

.customs-items-table thead th:nth-child(2) {
    width: 30% !important;
}

.customs-items-table thead th:nth-child(3) {
    width: 12% !important;
}

.customs-items-table thead th:nth-child(4) {
    width: 15% !important;
}

.customs-items-table thead th:nth-child(5) {
    width: 23% !important;
}

.customs-items-table tbody tr {
    border-bottom: 1px solid var(--color-border-light);
}

.customs-items-table tbody td {
    padding: var(--space);
    vertical-align: middle;
}

.customs-items-table tbody td input {
    width: 100%;
    box-sizing: border-box;
}

.customs-items-table tbody td.item-reference {
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary) !important;
    line-height: 1.4;
    word-wrap: break-word;
}

.customs-items-table tbody td.item-reference .item-price-ref {
    font-size: var(--font-size-sm);
    color: var(--color-text-tertiary) !important;
    font-weight: normal;
    display: block;
    margin-top: 2px;
}

.delete-customs-item {
    background: none;
    border: none;
    color: #dc3232;
    font-size: 16px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    font-weight: normal;
}

.delete-customs-item:hover {
    color: #a00;
}

.customs-message-section {
    margin-top: var(--space);
}

.customs-message-section label {
    display: block;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    color: var(--color-text-primary) !important;
    margin-bottom: var(--space);
}

.customs-textarea {
    width: 100%;
    padding: var(--space);
    border: 1px solid var(--color-border-light);
    border-radius: 10px;
    background: var(--color-bg-main) !important;
    color: var(--color-text-primary) !important;
    font-size: var(--font-size-sm);
    font-family: var(--font-primary);
    line-height: 1.5;
    resize: vertical;
    transition: all 0.2s ease;
}

.customs-textarea:hover {
    border-color: var(--color-accent);
}

.customs-textarea:focus {
    outline: none;
    border-color: var(--color-accent);
    box-shadow: 0 0 0 2px var(--color-glow);
}


.rates-selection {
    padding: var(--space) calc(var(--space) + var(--space));
}

.shipping-rates {
    display: flex;
    flex-direction: column;
    gap: var(--space);
}

.parcels-summary {
    margin-bottom: var(--space);
}

.parcels-summary h5 {
    margin: 0;
    font-size: var(--font-size-md);
    font-weight: var(--font-weight-semibold);
    color: var(--color-text-primary) !important;
}

.step-actions {
    margin-top: var(--space);
    padding: 0 calc(var(--space) + var(--space)) var(--space);
}

@media (max-width: 768px) {
    .customs-items-table thead {
        display: none;
    }

    .customs-items-table tbody tr {
        display: block;
        margin-bottom: var(--space);
        border: 1px solid var(--color-border-light);
        border-radius: 8px;
        padding: var(--space);
    }

    .customs-items-table tbody td {
        display: block;
        text-align: left !important;
        padding: var(--space) 0;
    }

    .customs-items-table tbody td::before {
        content: attr(data-label);
        font-weight: var(--font-weight-semibold);
        display: block;
        margin-bottom: var(--space);
        color: var(--color-text-secondary);
    }

    .parcel-option {
        flex-direction: column;
        align-items: flex-start;
    }

    .parcel-option .parcel-info {
        margin-left: 0;
        text-align: left;
    }
}
#fedex-account-section {
    background: var(--bg-tertiary);
    border-left: 4px solid var(--color-accent);
    padding: var(--space);
    margin: var(--space) 0;
    border-radius: 4px;
}

#fedex-account-section label {
    color: var(--color-text-primary) !important;
    font-weight: 600;
    display: block;
    margin-bottom: var(--space);
}

#fedex-account-section .form-control {
    display: block !important;
    color: var(--color-text-primary) !important;
    background: var(--bg-primary) !important;
    border: 2px solid var(--border-color) !important;
    border-radius: 4px;
    padding: calc(0.75 * var(--space)) var(--space);
    width: 100%;
    max-width: 400px;
    box-sizing: border-box;
}

#fedex-account-section .form-text {
    color: var(--color-text-secondary) !important;
}