.invalid-input,
.invalid-input label {
    color: rgba(119, 29, 29, 1);
}

.invalid-input > input {
    color: rgba(119, 29, 29, 1);
    border-color: rgba(240, 82, 82, 1);
    background-color: rgba(253, 242, 242, 1);
}

.invalid-input > input:focus {
    border-color: rgba(240, 82, 82, 1);
}

#toast-container > div {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.datepicker-dropdown{
    z-index: 9999 !important;
}

.card-body .card-footer {
    border: none;
}

.brighten {
    -webkit-filter: brightness(50%);
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
}

.brighten:hover {
    -webkit-filter: brightness(100%);
}

/* Responsive tabs scrollbar for invoice show page */
.tabs::-webkit-scrollbar {
    height: 4px;
}
.tabs::-webkit-scrollbar-track {
    background: transparent;
}
.tabs::-webkit-scrollbar-thumb {
    background-color: rgba(156, 163, 175, 0.5);
    border-radius: 2px;
}

/* Prevent modals from overflowing the viewport on narrow screens */
.modal-content {
    max-width: calc(100vw - 2rem) !important;
}

/* Missing Tailwind utilities used by accounting/invoices/show */
.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.whitespace-nowrap {
    white-space: nowrap;
}
.text-ellipsis {
    text-overflow: ellipsis;
}
.overflow-hidden {
    overflow: hidden;
}
.overflow-x-auto {
    overflow-x: auto;
}
.overflow-y-auto {
    overflow-y: auto;
}

/* Force a visible horizontal scrollbar on narrow tables inside invoice cards */
.force-x-scroll {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}
.force-x-scroll::-webkit-scrollbar {
    height: 8px;
}
.force-x-scroll::-webkit-scrollbar-track {
    background: #f1f5f9;
}
.force-x-scroll::-webkit-scrollbar-thumb {
    background-color: #94a3b8;
    border-radius: 4px;
}
.force-x-scroll table {
    table-layout: fixed !important;
    width: 100% !important;
}

.min-w-\[4rem\] { min-width: 4rem; }
.min-w-\[5rem\] { min-width: 5rem; }
.min-w-\[5\.5rem\] { min-width: 5.5rem; }
.min-w-\[6rem\] { min-width: 6rem; }
.min-w-\[7rem\] { min-width: 7rem; }
.min-w-\[8rem\] { min-width: 8rem; }
.min-w-\[10rem\] { min-width: 10rem; }
.min-w-\[500px\] { min-width: 500px; }
.min-w-\[640px\] { min-width: 640px; }
.min-w-\[700px\] { min-width: 700px; }
.min-w-\[900px\] { min-width: 900px; }

.max-w-\[10rem\] { max-width: 10rem; }
.max-w-\[12rem\] { max-width: 12rem; }
.max-w-\[16rem\] { max-width: 16rem; }

.w-\[5\%\] { width: 5%; }
.w-\[10\%\] { width: 10%; }
.w-\[15\%\] { width: 15%; }
.w-\[18\%\] { width: 18%; }
.w-\[20\%\] { width: 20%; }
.w-\[21\%\] { width: 21%; }
.w-\[25\%\] { width: 25%; }
.w-\[30\%\] { width: 30%; }
.w-\[35\%\] { width: 35%; }
.w-\[50\%\] { width: 50%; }
.w-\[60\%\] { width: 60%; }

.w-\[calc\(100\%-2rem\)\] { width: calc(100% - 2rem); }

.max-w-lg { max-width: 32rem; }
.max-w-\[700px\] { max-width: 700px; }
.top-\[15\%\] { top: 15%; }

@media (min-width: 640px) {
    .sm\:flex-row { flex-direction: row; }
    .sm\:items-baseline { align-items: baseline; }
    .sm\:w-56 { width: 14rem; }
    .sm\:max-w-56 { max-width: 14rem; }
    .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 1024px) {
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lg\:gap-7\.5 { gap: 1.875rem; }
    .lg\:col-span-2 { grid-column: span 2 / span 2; }
}

/* Missing space-y utilities used by accounting/invoices/show */
.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-3 > * + * { margin-top: 0.75rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-5 > * + * { margin-top: 1.25rem; }

.mt-3 { margin-top: 0.75rem; }

.p-6 { padding: 1.5rem; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.pb-6 { padding-bottom: 1.5rem; }

/* ---- Dashboard order calendar (dashboard/partials/_order_calendar.blade.php) ---- */
.oc-card {
    border: 1px solid #f1f1f4;
    background-color: rgba(255, 255, 255, 0.85);
}
.oc-card .oc-card-header {
    border: 0;
    padding-bottom: 0;
}
.oc-card .oc-icon {
    width: 2rem;
    height: 2rem;
    border-radius: 0.5rem;
    background: linear-gradient(135deg, #1b84ff, #3b82f6);
    color: #ffffff;
}
.oc-card .oc-title {
    font-size: 1rem;
    font-weight: 600;
    color: #181c32;
}
.oc-card .oc-nav {
    color: #4b5675;
}
.oc-card .oc-nav:hover {
    background-color: #f1f1f4;
}
.oc-card .oc-month {
    font-weight: 600;
    color: #4b5675;
}
.oc-card .oc-legend {
    color: #78829d;
    margin-inline-start: auto;
}
.oc-card .oc-dot {
    display: inline-block;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 9999px;
}
.oc-card .oc-dot-del {
    background-color: #3b82f6;
}
.oc-card .oc-dot-cre {
    background-color: #10b981;
}
.oc-card .oc-dot-gap {
    margin-inline-start: 0.5rem;
}
.oc-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 4px;
}
.oc-weekday {
    font-size: 11px;
    font-weight: 500;
    color: #78829d;
    text-align: center;
    padding: 4px 0;
}
.oc-day {
    min-height: 48px;
    border-radius: 8px;
    padding: 4px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border: 1px solid transparent;
}
.oc-day-off {
    background-color: transparent;
}
.oc-day-has {
    background-color: #f5f8fa;
}
.oc-day-has:hover {
    background-color: #eef6ff;
}
.oc-day-today {
    background-color: #f1f6fd;
    border-color: rgba(27, 132, 255, 0.4);
}
.oc-day-num {
    font-size: 11px;
    font-weight: 500;
    color: #4b5675;
}
.oc-day-num-today {
    font-size: 11px;
    font-weight: 700;
    color: #1b84ff;
}
.oc-badge {
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    line-height: 1.2;
}
.oc-badge-del {
    background-color: rgba(59, 130, 246, 0.15);
    color: #2563eb;
}
.oc-badge-cre {
    background-color: rgba(16, 185, 129, 0.15);
    color: #059669;
}

/* Dark variant (modern_analytics design) */
.oc-card[data-dark="1"] {
    background-color: rgba(15, 23, 42, 0.8);
    border-color: rgba(51, 65, 85, 0.6);
}
.oc-card[data-dark="1"] .oc-icon {
    background: linear-gradient(135deg, #1b84ff, #38bdf8);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}
.oc-card[data-dark="1"] .oc-title {
    color: #ffffff;
}
.oc-card[data-dark="1"] .oc-nav {
    background-color: #1e293b;
    border: 1px solid #334155;
    color: #cbd5e1;
}
.oc-card[data-dark="1"] .oc-nav:hover {
    background-color: #334155;
}
.oc-card[data-dark="1"] .oc-month {
    color: #e2e8f0;
}
.oc-card[data-dark="1"] .oc-legend {
    color: #94a3b8;
}
.oc-card[data-dark="1"] .oc-weekday {
    color: #94a3b8;
}
.oc-card[data-dark="1"] .oc-day-has {
    background-color: rgba(30, 41, 59, 0.5);
    border-color: rgba(51, 65, 85, 0.4);
}
.oc-card[data-dark="1"] .oc-day-has:hover {
    background-color: rgba(30, 41, 59, 0.8);
}
.oc-card[data-dark="1"] .oc-day-today {
    background-color: rgba(30, 41, 59, 0.8);
    border-color: rgba(59, 130, 246, 0.5);
}
.oc-card[data-dark="1"] .oc-day-num {
    color: #cbd5e1;
}
.oc-card[data-dark="1"] .oc-day-num-today {
    color: #93c5fd;
}
.oc-card[data-dark="1"] .oc-badge-del {
    background-color: rgba(59, 130, 246, 0.2);
    color: #93c5fd;
}
.oc-card[data-dark="1"] .oc-badge-cre {
    background-color: rgba(16, 185, 129, 0.2);
    color: #6ee7b7;
}

/* Shipment timeline (client portal orders timeline modal).
   Uses logical properties so a single block serves LTR and RTL. */
.tl-order-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 0 12px;
    font-size: 0.875rem;
}
.tl-order-head-label {
    color: #6b7280;
}
.tl-order-head-value {
    color: #111827;
    font-weight: 600;
}
.tl {
    position: relative;
    padding-inline-start: 28px;
}
.tl::before {
    content: '';
    position: absolute;
    inset-inline-start: 10px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    background-color: #e5e7eb;
}
.tl-item {
    position: relative;
    padding-bottom: 20px;
}
.tl-item:last-child {
    padding-bottom: 0;
}
.tl-dot {
    position: absolute;
    inset-inline-start: -26px;
    top: 4px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: var(--tw-primary, #4CAF50);
    box-shadow: 0 0 0 4px #fff;
}
.tl-time {
    font-size: 0.875rem;
    color: #6b7280;
    margin-bottom: 6px;
}
.tl-body {
    background-color: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 8px;
    padding: 12px 14px;
}
.tl-action {
    font-size: 0.875rem;
    font-weight: 600;
    color: #111827;
    margin-bottom: 6px;
}
.tl-status-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    color: #374151;
}
.tl-status-none {
    font-style: italic;
    color: #9ca3af;
}
.tl-status-arrow {
    color: #9ca3af;
}
.tl-details {
    margin: 8px 0 0;
    padding-inline-start: 18px;
    list-style: disc;
    font-size: 0.8125rem;
    color: #4b5563;
}
.tl-details-label {
    font-weight: 600;
}
.tl-details-old {
    color: #dc2626;
}
.tl-details-new {
    color: #16a34a;
}
.tl-actor {
    margin-top: 8px;
    font-size: 0.75rem;
    color: #6b7280;
}
.tl-actor-badge {
    font-weight: 700;
    color: var(--tw-primary, #4CAF50);
}
.tl-empty {
    padding: 32px 0;
    text-align: center;
    color: #6b7280;
}