/* ==========================================================================
   SHIPPING MODULE CSS (Advanced Quick-Edit UI)
   ========================================================================== */
.ship-board { padding: 24px; max-width: 1400px; margin: 0 auto; font-family: 'Inter', sans-serif; color: var(--mist-100); }
.ship-header { margin-bottom: 24px; border-bottom: 1px solid rgba(255,255,255,0.05); padding-bottom: 16px; }
.ship-title { font-size: 1.6rem; text-transform: uppercase; letter-spacing: 1.5px; font-weight: 700; display: block;}
.ship-sub { color: var(--mist-300); font-size: 0.85rem; margin-top: 8px; }

.ship-list { display: flex; flex-direction: column; gap: 12px; }
.ship-grid-header, .ship-row { display: grid !important; gap: 16px; align-items: start; width: 100%; }

/* Strict 6-Column Grid for the 3 Shipping Tiers */
.ship-grid { grid-template-columns: 40px 2.5fr 1.5fr 1.5fr 1.5fr 60px !important; }

.ship-grid-header { padding: 0 24px 8px 24px; color: #64748b; font-weight: 600; font-size: 0.8rem; text-transform: uppercase; border-bottom: 1px solid rgba(255,255,255,0.05); }
.ship-row { background: var(--ink-900); border: 1px solid rgba(228, 220, 203, 0.08); border-radius: 10px; padding: 16px 24px; transition: 0.3s; position: relative; overflow: hidden; }
.ship-row:hover { border-color: var(--accent); box-shadow: 0 10px 30px rgba(83, 69, 52, 0.08); }

.ship-cell { display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.ship-primary-text { font-weight: 700; font-size: 1.1rem; color: var(--mist-100); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block;}
.ship-secondary-text { font-size: 0.85rem; color: #94a3b8; display: block;}

/* Tags */
.ship-tag { padding: 4px 10px; border-radius: 4px; font-size: 0.7rem; font-weight: 800; text-transform: uppercase; width: fit-content; cursor: pointer; transition: 0.2s;}
.ship-tag:hover { filter: brightness(1.2); }
.tag-green { background: rgba(52, 199, 89, 0.1); color: #34C759; border: 1px solid rgba(52, 199, 89, 0.2); }
.tag-grey { background: rgba(255, 255, 255, 0.05); color: var(--mist-300); border: 1px solid rgba(255, 255, 255, 0.1); }

/* Quick Edit Inputs */
.ship-quick-input { background: var(--ink-850); border: 1px solid rgba(228, 220, 203, 0.14); color: var(--accent); padding: 8px 12px; border-radius: 6px; width: 100%; font-size: 0.95rem; font-weight: 700; box-sizing: border-box; transition: 0.3s;}
.ship-quick-input:focus { border-color: var(--accent); outline: none; background: #faf6ef; box-shadow: 0 0 10px rgba(199, 166, 107, 0.24);}
.ship-compact-check { margin: 8px 0 0 0 !important; }
.ship-compact-check .md-label { color: #958c7f; font-size: 0.75rem; font-weight: 700; text-transform: uppercase;}
.ship-compact-check.md-checked .md-label { color: var(--mist-200); }
.ship-compact-check .md-icon { border-color: #837b6e; }
.ship-compact-check.md-checked .md-icon { background-color: var(--accent); border-color: var(--accent); }

/* Buttons */
.ship-btn-save { background: linear-gradient(135deg, var(--accent-strong) 0%, var(--accent) 100%) !important; color: #000 !important; font-weight: 800 !important; padding: 0 24px !important; border-radius: 6px !important; letter-spacing: 1px;}
.ship-btn-save[disabled] { background: rgba(228, 220, 203, 0.08) !important; color: #837b6e !important; }

/* Dialog Form (Create/Edit) */
.ship-dialog { background: var(--ink-900) !important; border: 1px solid rgba(228, 220, 203, 0.08); border-radius: 12px !important; box-shadow: 0 20px 60px rgba(83, 69, 52, 0.12); }
.ship-dialog-toolbar { background: var(--ink-850) !important; border-bottom: 1px solid rgba(228, 220, 203, 0.08); color: var(--mist-100) !important; }
.ship-input-dark label { color: var(--mist-300) !important; text-transform: uppercase; font-size: 0.8rem; letter-spacing: 1px; }
.ship-input-dark .md-input { color: var(--mist-100) !important; border-bottom-color: rgba(228, 220, 203, 0.14) !important; }
.ship-input-dark .md-input:focus { border-bottom-color: var(--accent) !important; }

@media screen and (max-width: 900px) {
    .ship-grid-header { display: none !important; }
    .ship-row { grid-template-columns: 1fr !important; padding: 20px; gap: 12px; }
}