/* ========================================
   SALES SMART IMPORT — PAGE
======================================== */

.sales-smart-import-page {
  display:
    grid;

  grid-template-columns:
    minmax(
      360px,
      0.72fr
    )
    minmax(
      560px,
      1.28fr
    );

  align-items:
    start;

  gap:
    18px;

  width:
    min(
      1540px,
      calc(
        100vw -
        260px
      )
    );

  max-width:
    1540px;

  margin-left:
    clamp(
      18px,
      3vw,
      54px
    );

  margin-right:
    auto;

  padding:
    22px 0 80px;
}

.sales-smart-import-page >
.sales-smart-import-header,
.sales-smart-import-page >
.sales-smart-import-guide-card:first-of-type,
.sales-smart-import-page >
.sales-smart-import-result {
  grid-column:
    1 / -1;
}

.sales-smart-import-page >
.sales-smart-import-guide-card:nth-of-type(2) {
  grid-column:
    1;
}

.sales-smart-import-page >
.sales-smart-import-input-card {
  grid-column:
    2;
}

/* ========================================
   SMART IMPORT HEADER
======================================== */

.sales-smart-import-header {
  position:
    relative;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    30px;

  min-height:
    128px;

  overflow:
    hidden;

  padding:
    30px 32px;

  border:
    1px solid
    rgba(
      125,
      211,
      252,
      0.28
    );

  border-radius:
    30px;

  background:
    radial-gradient(
      circle at top left,
      rgba(
        59,
        130,
        246,
        0.3
      ),
      transparent 37%
    ),
    radial-gradient(
      circle at 87% 42%,
      rgba(
        34,
        211,
        238,
        0.2
      ),
      transparent 30%
    ),
    radial-gradient(
      circle at 96% 100%,
      rgba(
        16,
        185,
        129,
        0.1
      ),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(
        42,
        70,
        105,
        0.96
      ),
      rgba(
        11,
        26,
        46,
        0.98
      )
    );

  box-shadow:
    0 32px 90px
    rgba(
      0,
      0,
      0,
      0.34
    ),
    inset 0 1px 0
    rgba(
      255,
      255,
      255,
      0.07
    );
}

.sales-smart-import-header::before {
  content:
    "";

  position:
    absolute;

  inset:
    0;

  background:
    linear-gradient(
      90deg,
      rgba(
        96,
        165,
        250,
        0.18
      ),
      transparent 34%,
      transparent 68%,
      rgba(
        34,
        211,
        238,
        0.12
      )
    );

  pointer-events:
    none;
}

.sales-smart-import-header::after {
  content:
    "";

  position:
    absolute;

  right:
    -86px;

  bottom:
    -126px;

  width:
    310px;

  height:
    310px;

  border-radius:
    999px;

  background:
    rgba(
      14,
      165,
      233,
      0.16
    );

  filter:
    blur(
      7px
    );

  pointer-events:
    none;
}

.sales-smart-import-header-copy,
.sales-smart-import-header-status {
  position:
    relative;

  z-index:
    1;
}

.sales-smart-import-header-copy {
  display:
    grid;

  gap:
    10px;

  min-width:
    0;
}

.sales-smart-import-header-copy h1 {
  margin:
    0;

  color:
    #ffffff;

  font-size:
    clamp(
      2.1rem,
      3vw,
      3rem
    );

  font-weight:
    950;

  line-height:
    1;

  letter-spacing:
    -0.06em;
}

.sales-smart-import-header-copy p {
  max-width:
    780px;

  margin:
    0;

  color:
    rgba(
      226,
      232,
      240,
      0.76
    );

  font-size:
    0.9rem;

  line-height:
    1.58;
}

.sales-smart-import-header-status {
  display:
    flex;

  align-items:
    center;

  gap:
    13px;

  flex-shrink:
    0;

  min-width:
    190px;

  padding:
    15px 17px;

  border:
    1px solid
    rgba(
      125,
      211,
      252,
      0.32
    );

  border-radius:
    20px;

  background:
    linear-gradient(
      145deg,
      rgba(
        14,
        165,
        233,
        0.18
      ),
      rgba(
        15,
        23,
        42,
        0.28
      )
    );

  box-shadow:
    0 16px 38px
    rgba(
      3,
      105,
      161,
      0.16
    );
}

.sales-smart-import-header-icon {
  display:
    grid;

  place-items:
    center;

  width:
    44px;

  height:
    44px;

  flex-shrink:
    0;

  border:
    1px solid
    rgba(
      125,
      211,
      252,
      0.36
    );

  border-radius:
    15px;

  background:
    rgba(
      14,
      165,
      233,
      0.2
    );

  color:
    #bae6fd;

  font-size:
    0.76rem;

  font-weight:
    950;

  box-shadow:
    0 0 28px
    rgba(
      14,
      165,
      233,
      0.2
    );
}

.sales-smart-import-header-status div {
  display:
    grid;

  gap:
    3px;
}

.sales-smart-import-header-status small {
  color:
    rgba(
      186,
      230,
      253,
      0.72
    );

  font-size:
    0.68rem;

  font-weight:
    850;

  text-transform:
    uppercase;

  letter-spacing:
    0.065em;
}

.sales-smart-import-header-status strong {
  color:
    #e0f2fe;

  font-size:
    0.92rem;

  font-weight:
    900;
}

/* ========================================
   SMART IMPORT CARDS
======================================== */

.sales-smart-import-guide-card,
.sales-smart-import-input-card,
.sales-smart-import-result >
.workspace-card {
  position:
    relative;

  display:
    grid;

  gap:
    20px;

  width:
    100%;

  overflow:
    hidden;

  padding:
    24px;

  box-sizing:
    border-box;

  border:
    1px solid
    rgba(
      148,
      184,
      226,
      0.18
    );

  border-radius:
    26px;

  background:
    radial-gradient(
      circle at top left,
      rgba(
        59,
        130,
        246,
        0.12
      ),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(
        35,
        58,
        86,
        0.9
      ),
      rgba(
        10,
        25,
        44,
        0.94
      )
    );

  box-shadow:
    0 24px 64px
    rgba(
      0,
      0,
      0,
      0.26
    ),
    inset 0 1px 0
    rgba(
      255,
      255,
      255,
      0.045
    );
}

.sales-smart-import-guide-card::after,
.sales-smart-import-input-card::after,
.sales-smart-import-result >
.workspace-card::after {
  content:
    "";

  position:
    absolute;

  right:
    -58px;

  bottom:
    -78px;

  width:
    165px;

  height:
    165px;

  border-radius:
    999px;

  background:
    rgba(
      59,
      130,
      246,
      0.1
    );

  pointer-events:
    none;
}

.sales-smart-import-page >
.sales-smart-import-guide-card:first-of-type {
  display:
    grid;

  grid-template-columns:
    minmax(
      0,
      1fr
    )
    minmax(
      360px,
      0.58fr
    );

  align-items:
    center;

  padding:
    22px 24px;

  border-color:
    rgba(
      96,
      165,
      250,
      0.24
    );

  background:
    radial-gradient(
      circle at top left,
      rgba(
        96,
        165,
        250,
        0.18
      ),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      rgba(
        37,
        61,
        92,
        0.94
      ),
      rgba(
        10,
        25,
        44,
        0.94
      )
    );
}

.sales-smart-import-section-header {
  position:
    relative;

  z-index:
    1;

  display:
    grid;

  grid-template-columns:
    48px
    minmax(
      0,
      1fr
    );

  align-items:
    start;

  gap:
    15px;

  min-width:
    0;

  padding-bottom:
    18px;

  border-bottom:
    1px solid
    rgba(
      148,
      184,
      226,
      0.12
    );
}

.sales-smart-import-page >
.sales-smart-import-guide-card:first-of-type
.sales-smart-import-section-header {
  padding-bottom:
    0;

  border-bottom:
    0;
}

.sales-smart-import-section-header > div:last-child {
  display:
    grid;

  gap:
    7px;

  min-width:
    0;
}

.sales-smart-import-section-header h2 {
  margin:
    0;

  color:
    #ffffff;

  font-size:
    1.32rem;

  font-weight:
    950;

  letter-spacing:
    -0.04em;
}

.sales-smart-import-section-header p {
  max-width:
    820px;

  margin:
    0;

  color:
    rgba(
      203,
      213,
      225,
      0.68
    );

  font-size:
    0.82rem;

  line-height:
    1.52;
}

.sales-smart-import-section-icon {
  display:
    grid;

  place-items:
    center;

  width:
    48px;

  height:
    48px;

  border:
    1px solid
    rgba(
      96,
      165,
      250,
      0.31
    );

  border-radius:
    16px;

  background:
    linear-gradient(
      145deg,
      rgba(
        59,
        130,
        246,
        0.24
      ),
      rgba(
        37,
        99,
        235,
        0.1
      )
    );

  color:
    #bfdbfe;

  font-size:
    1rem;

  font-weight:
    950;

  box-shadow:
    0 14px 30px
    rgba(
      37,
      99,
      235,
      0.15
    );
}

.sales-smart-import-kicker {
  display:
    inline-flex;

  align-items:
    center;

  width:
    fit-content;

  padding:
    5px 9px;

  border:
    1px solid
    rgba(
      96,
      165,
      250,
      0.27
    );

  border-radius:
    999px;

  background:
    rgba(
      59,
      130,
      246,
      0.12
    );

  color:
    #93c5fd;

  font-size:
    0.64rem;

  font-weight:
    950;

  text-transform:
    uppercase;

  letter-spacing:
    0.07em;
}

/* ========================================
   SMART IMPORT MODE SELECTOR
======================================== */

.sales-smart-import-page >
.sales-smart-import-guide-card:first-of-type
.sales-smart-import-actions {
  position:
    relative;

  z-index:
    1;

  display:
    grid;

  grid-template-columns:
    repeat(
      2,
      minmax(
        0,
        1fr
      )
    );

  gap:
    10px;

  width:
    100%;

  padding:
    8px;

  border:
    1px solid
    rgba(
      96,
      165,
      250,
      0.16
    );

  border-radius:
    18px;

  background:
    rgba(
      5,
      19,
      34,
      0.46
    );
}

.sales-smart-import-page >
.sales-smart-import-guide-card:first-of-type
.sales-smart-import-actions .btn {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  min-width:
    0;

  min-height:
    50px;

  padding:
    12px 14px;

  border-radius:
    13px;

  font-size:
    0.78rem;

  font-weight:
    950;

  box-shadow:
    none;
}

#salesSmartImportExcelModeBtn.btn-primary {
  background:
    linear-gradient(
      135deg,
      rgba(
        59,
        130,
        246,
        0.98
      ),
      rgba(
        37,
        99,
        235,
        0.98
      )
    );

  border-color:
    rgba(
      147,
      197,
      253,
      0.4
    );

  box-shadow:
    0 14px 32px
    rgba(
      37,
      99,
      235,
      0.24
    );
}

#salesSmartImportAdvertModeBtn.btn-primary {
  background:
    linear-gradient(
      135deg,
      rgba(
        168,
        85,
        247,
        0.98
      ),
      rgba(
        14,
        165,
        233,
        0.94
      )
    );

  border-color:
    rgba(
      216,
      180,
      254,
      0.38
    );

  box-shadow:
    0 14px 34px
    rgba(
      126,
      34,
      206,
      0.22
    );
}

#salesSmartImportExcelModeBtn.btn-secondary,
#salesSmartImportAdvertModeBtn.btn-secondary {
  color:
    rgba(
      226,
      232,
      240,
      0.74
    );

  background:
    transparent;

  border-color:
    transparent;
}

#salesSmartImportExcelModeBtn.btn-secondary:hover,
#salesSmartImportAdvertModeBtn.btn-secondary:hover {
  color:
    #ffffff;

  background:
    rgba(
      59,
      130,
      246,
      0.12
    );

  border-color:
    rgba(
      96,
      165,
      250,
      0.2
    );
}

/* ========================================
   SMART IMPORT COLUMNS
======================================== */

.sales-smart-import-columns {
  position:
    relative;

  z-index:
    1;

  display:
    grid;

  grid-template-columns:
    repeat(
      2,
      minmax(
        0,
        1fr
      )
    );

  gap:
    9px;
}

.sales-smart-import-column {
  display:
    flex;

  align-items:
    center;

  justify-content:
    center;

  min-width:
    0;

  min-height:
    40px;

  padding:
    9px 10px;

  border:
    1px solid
    rgba(
      96,
      165,
      250,
      0.18
    );

  border-radius:
    13px;

  background:
    rgba(
      5,
      19,
      34,
      0.28
    );

  color:
    rgba(
      219,
      234,
      254,
      0.86
    );

  font-size:
    0.7rem;

  font-weight:
    850;

  text-align:
    center;

  overflow-wrap:
    anywhere;
}

.sales-smart-import-column:hover {
  border-color:
    rgba(
      125,
      211,
      252,
      0.28
    );

  background:
    rgba(
      59,
      130,
      246,
      0.11
    );
}

/* ========================================
   SMART IMPORT TEXTAREA
======================================== */

.sales-smart-import-textarea-wrap {
  position:
    relative;

  z-index:
    1;

  display:
    grid;

  gap:
    9px;
}

.sales-smart-import-textarea-wrap label {
  color:
    rgba(
      226,
      232,
      240,
      0.9
    );

  font-size:
    0.75rem;

  font-weight:
    850;
}

#salesSmartImportTextarea {
  width:
    100%;

  min-height:
    410px;

  resize:
    vertical;

  padding:
    18px;

  box-sizing:
    border-box;

  border:
    1px solid
    rgba(
      148,
      184,
      226,
      0.22
    );

  border-radius:
    20px;

  outline:
    none;

  background:
    radial-gradient(
      circle at top left,
      rgba(
        59,
        130,
        246,
        0.08
      ),
      transparent 40%
    ),
    linear-gradient(
      145deg,
      rgba(
        5,
        18,
        34,
        0.58
      ),
      rgba(
        13,
        30,
        50,
        0.5
      )
    );

  color:
    #f8fafc;

  font-family:
    ui-monospace,
    SFMono-Regular,
    Menlo,
    Monaco,
    Consolas,
    monospace;

  font-size:
    0.82rem;

  line-height:
    1.7;

  box-shadow:
    inset 0 1px 0
    rgba(
      255,
      255,
      255,
      0.04
    );

  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background-color 0.16s ease;
}

#salesSmartImportTextarea::placeholder {
  color:
    rgba(
      148,
      163,
      184,
      0.52
    );
}

#salesSmartImportTextarea:focus {
  border-color:
    rgba(
      96,
      165,
      250,
      0.78
    );

  box-shadow:
    0 0 0 4px
    rgba(
      37,
      99,
      235,
      0.16
    ),
    inset 0 1px 0
    rgba(
      255,
      255,
      255,
      0.06
    );
}

/* ========================================
   SMART IMPORT ACTION BAR
======================================== */

.sales-smart-import-action-bar {
  position:
    relative;

  z-index:
    1;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    22px;

  padding:
    18px 19px;

  border:
    1px solid
    rgba(
      96,
      165,
      250,
      0.18
    );

  border-radius:
    20px;

  background:
    linear-gradient(
      135deg,
      rgba(
        37,
        99,
        235,
        0.13
      ),
      rgba(
        15,
        23,
        42,
        0.24
      )
    );
}

.sales-smart-import-action-bar > div:first-child {
  display:
    grid;

  gap:
    5px;
}

.sales-smart-import-action-bar strong {
  color:
    #ffffff;

  font-size:
    0.92rem;

  font-weight:
    950;
}

.sales-smart-import-action-bar span {
  color:
    rgba(
      203,
      213,
      225,
      0.66
    );

  font-size:
    0.75rem;

  line-height:
    1.42;
}

.sales-smart-import-actions {
  display:
    flex;

  align-items:
    center;

  justify-content:
    flex-end;

  flex-wrap:
    wrap;

  gap:
    10px;
}

.sales-smart-import-actions .btn {
  width:
    auto;

  min-width:
    136px;

  min-height:
    44px;

  border-radius:
    14px;

  font-weight:
    900;
}

.sales-smart-import-actions
.btn-primary,
#salesSmartImportPreviewBtn {
  background:
    linear-gradient(
      135deg,
      #3b82f6,
      #2563eb
    );

  border-color:
    rgba(
      147,
      197,
      253,
      0.34
    );

  box-shadow:
    0 15px 34px
    rgba(
      37,
      99,
      235,
      0.25
    );
}

#salesSmartImportClearBtn {
  color:
    rgba(
      226,
      232,
      240,
      0.8
    );

  background:
    rgba(
      15,
      23,
      42,
      0.28
    );

  border:
    1px solid
    rgba(
      148,
      163,
      184,
      0.18
    );
}

/* ========================================
   SMART IMPORT RESULT
======================================== */

.sales-smart-import-result {
  display:
    grid;

  gap:
    18px;

  min-width:
    0;
}

.sales-smart-import-summary {
  display:
    grid;

  grid-template-columns:
    repeat(
      3,
      minmax(
        0,
        1fr
      )
    );

  gap:
    14px;
}

.sales-smart-import-summary
.workspace-card {
  position:
    relative;

  display:
    grid;

  gap:
    9px;

  min-height:
    132px;

  overflow:
    hidden;

  padding:
    20px;

  border:
    1px solid
    rgba(
      96,
      165,
      250,
      0.18
    );

  border-radius:
    22px;

  background:
    linear-gradient(
      145deg,
      rgba(
        39,
        63,
        92,
        0.9
      ),
      rgba(
        12,
        29,
        50,
        0.94
      )
    );

  box-shadow:
    0 20px 48px
    rgba(
      0,
      0,
      0,
      0.22
    );
}

.sales-smart-import-summary
.workspace-card::after {
  content:
    "";

  position:
    absolute;

  right:
    -45px;

  bottom:
    -65px;

  width:
    140px;

  height:
    140px;

  border-radius:
    999px;

  background:
    rgba(
      59,
      130,
      246,
      0.18
    );

  pointer-events:
    none;
}

.sales-smart-import-summary
.workspace-card:nth-child(2)::after {
  background:
    rgba(
      245,
      158,
      11,
      0.2
    );
}

.sales-smart-import-summary
.workspace-card:nth-child(3)::after {
  background:
    rgba(
      16,
      185,
      129,
      0.18
    );
}

.sales-smart-import-summary h3 {
  position:
    relative;

  z-index:
    1;

  margin:
    0;

  color:
    rgba(
      203,
      213,
      225,
      0.76
    );

  font-size:
    0.76rem;

  font-weight:
    900;

  text-transform:
    uppercase;

  letter-spacing:
    0.055em;
}

.sales-smart-import-summary p {
  position:
    relative;

  z-index:
    1;

  margin:
    auto 0 0;

  color:
    #ffffff;

  font-size:
    2.35rem;

  font-weight:
    950;

  line-height:
    1;

  letter-spacing:
    -0.05em;
}

/* ========================================
   SMART IMPORT PREVIEW
======================================== */

.sales-smart-import-preview-header {
  position:
    relative;

  z-index:
    1;

  display:
    flex;

  align-items:
    center;

  justify-content:
    space-between;

  gap:
    20px;

  padding-bottom:
    18px;

  border-bottom:
    1px solid
    rgba(
      148,
      184,
      226,
      0.12
    );
}

.sales-smart-import-preview-header > div {
  display:
    grid;

  gap:
    6px;
}

.sales-smart-import-preview-header h3 {
  margin:
    0;

  color:
    #ffffff;

  font-size:
    1.24rem;

  font-weight:
    950;
}

.sales-smart-import-preview-header p {
  margin:
    0;

  color:
    rgba(
      203,
      213,
      225,
      0.66
    );

  font-size:
    0.8rem;
}

.sales-smart-import-preview-header .btn {
  width:
    auto;

  min-width:
    190px;

  flex-shrink:
    0;

  border-radius:
    14px;

  font-weight:
    900;
}

/* ========================================
   SMART IMPORT TABLE
======================================== */

.sales-smart-import-table-wrap {
  position:
    relative;

  z-index:
    1;

  width:
    100%;

  overflow-x:
    auto;

  border:
    1px solid
    rgba(
      148,
      184,
      226,
      0.14
    );

  border-radius:
    18px;

  background:
    rgba(
      5,
      18,
      33,
      0.32
    );
}

.sales-smart-import-table {
  width:
    100%;

  min-width:
    1120px;

  border-collapse:
    collapse;

  color:
    rgba(
      241,
      245,
      249,
      0.88
    );

  font-size:
    0.76rem;
}

.sales-smart-import-table th {
  padding:
    14px 12px;

  border-bottom:
    1px solid
    rgba(
      148,
      184,
      226,
      0.17
    );

  background:
    rgba(
      15,
      35,
      59,
      0.8
    );

  color:
    rgba(
      191,
      219,
      254,
      0.82
    );

  font-size:
    0.66rem;

  font-weight:
    900;

  text-align:
    left;

  text-transform:
    uppercase;

  letter-spacing:
    0.055em;

  white-space:
    nowrap;
}

.sales-smart-import-table td {
  padding:
    14px 12px;

  border-bottom:
    1px solid
    rgba(
      148,
      184,
      226,
      0.1
    );

  vertical-align:
    top;

  line-height:
    1.45;

  overflow-wrap:
    anywhere;
}

.sales-smart-import-table tbody tr:last-child td {
  border-bottom:
    0;
}

.sales-smart-import-table tbody tr {
  transition:
    background-color 0.15s ease;
}

.sales-smart-import-table tbody tr:hover {
  background:
    rgba(
      59,
      130,
      246,
      0.08
    );
}

.sales-smart-import-table input[type="checkbox"] {
  width:
    17px;

  height:
    17px;

  margin:
    0;

  accent-color:
    #3b82f6;

  cursor:
    pointer;
}

.sales-smart-import-duplicate-row {
  background:
    rgba(
      245,
      158,
      11,
      0.07
    );
}

.sales-smart-import-duplicate-row:hover {
  background:
    rgba(
      245,
      158,
      11,
      0.11
    ) !important;
}

/* ========================================
   SMART IMPORT STATUS
======================================== */

.sales-smart-import-ok {
  display:
    inline-flex;

  align-items:
    center;

  width:
    fit-content;

  padding:
    6px 9px;

  border:
    1px solid
    rgba(
      52,
      211,
      153,
      0.25
    );

  border-radius:
    999px;

  background:
    rgba(
      16,
      185,
      129,
      0.12
    );

  color:
    #a7f3d0;

  font-size:
    0.67rem;

  font-weight:
    900;
}

.sales-smart-import-warning {
  display:
    grid;

  gap:
    6px;

  min-width:
    190px;

  padding:
    10px;

  border:
    1px solid
    rgba(
      251,
      191,
      36,
      0.22
    );

  border-radius:
    12px;

  background:
    rgba(
      245,
      158,
      11,
      0.09
    );
}

.sales-smart-import-warning strong {
  color:
    #fde68a;

  font-size:
    0.72rem;
}

.sales-smart-import-warning ul {
  margin:
    0;

  padding-left:
    17px;

  color:
    rgba(
      254,
      243,
      199,
      0.76
    );

  font-size:
    0.68rem;

  line-height:
    1.45;
}

.sales-smart-import-warning li + li {
  margin-top:
    4px;
}

/* ========================================
   SMART IMPORT RESPONSIVE
======================================== */

@media (
  max-width:
  1380px
) {

  .sales-smart-import-page {
    width:
      min(
        100%,
        calc(
          100vw -
          300px
        )
      );

    margin-left:
      12px;

    grid-template-columns:
      minmax(
        330px,
        0.78fr
      )
      minmax(
        520px,
        1.22fr
      );
  }

}

@media (
  max-width:
  1180px
) {

  .sales-smart-import-page {
    grid-template-columns:
      1fr;

    width:
      min(
        100%,
        calc(
          100vw -
          40px
        )
      );

    margin-left:
      auto;

    margin-right:
      auto;
  }

  .sales-smart-import-page >
  .sales-smart-import-guide-card:nth-of-type(2),
  .sales-smart-import-page >
  .sales-smart-import-input-card {
    grid-column:
      1;
  }

  .sales-smart-import-page >
  .sales-smart-import-guide-card:first-of-type {
    grid-template-columns:
      1fr;
  }

}

@media (
  max-width:
  900px
) {

  .sales-smart-import-header {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .sales-smart-import-header-status {
    width:
      100%;

    box-sizing:
      border-box;
  }

  .sales-smart-import-summary {
    grid-template-columns:
      1fr;
  }

  .sales-smart-import-action-bar,
  .sales-smart-import-preview-header {
    align-items:
      flex-start;

    flex-direction:
      column;
  }

  .sales-smart-import-actions {
    width:
      100%;

    justify-content:
      flex-start;
  }

}

@media (
  max-width:
  620px
) {

  .sales-smart-import-page {
    gap:
      15px;

    width:
      100%;

    padding:
      12px 0 50px;
  }

  .sales-smart-import-header,
  .sales-smart-import-guide-card,
  .sales-smart-import-input-card,
  .sales-smart-import-result >
  .workspace-card {
    padding:
      17px;

    border-radius:
      21px;
  }

  .sales-smart-import-header-copy h1 {
    font-size:
      1.85rem;
  }

  .sales-smart-import-section-header {
    grid-template-columns:
      1fr;
  }

  .sales-smart-import-columns {
    grid-template-columns:
      1fr;
  }

  #salesSmartImportTextarea {
    min-height:
      260px;
  }

  .sales-smart-import-page >
  .sales-smart-import-guide-card:first-of-type
  .sales-smart-import-actions,
  .sales-smart-import-actions {
    grid-template-columns:
      1fr;

    align-items:
      stretch;

    flex-direction:
      column;
  }

  .sales-smart-import-actions .btn,
  .sales-smart-import-preview-header .btn {
    width:
      100%;

    min-width:
      0;
  }

}
/* ========================================
   SMART IMPORT — ADVERT EDIT MODE
======================================== */

.sales-smart-import-page:has(
  #salesSmartImportAdvertModeBtn.btn-primary
)
> .sales-smart-import-guide-card:nth-of-type(2) {
  display:
    none;
}

.sales-smart-import-page:has(
  #salesSmartImportAdvertModeBtn.btn-primary
)
> .sales-smart-import-input-card {
  grid-column:
    1 / -1;
}

.sales-smart-import-page:has(
  #salesSmartImportAdvertModeBtn.btn-primary
)
#salesSmartImportTextarea {
  min-height:
    360px;
}

/* ========================================
   SMART IMPORT — EDITABLE RESULT CARD
======================================== */

.sales-smart-import-edit-card {
  border-color:
    rgba(
      168,
      85,
      247,
      0.24
    );

  background:
    radial-gradient(
      circle at top left,
      rgba(
        168,
        85,
        247,
        0.16
      ),
      transparent 34%
    ),
    radial-gradient(
      circle at 90% 15%,
      rgba(
        14,
        165,
        233,
        0.14
      ),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      rgba(
        42,
        54,
        88,
        0.94
      ),
      rgba(
        10,
        25,
        44,
        0.96
      )
    ) !important;
}

.sales-smart-import-edit-card::after {
  background:
    rgba(
      168,
      85,
      247,
      0.14
    ) !important;
}

.sales-smart-import-edit-grid {
  position:
    relative;

  z-index:
    1;

  display:
    grid;

  grid-template-columns:
    repeat(
      2,
      minmax(
        0,
        1fr
      )
    );

  gap:
    14px;
}

.sales-smart-import-edit-field {
  display:
    grid;

  gap:
    7px;

  min-width:
    0;
}

.sales-smart-import-edit-field-full {
  grid-column:
    1 / -1;
}

.sales-smart-import-edit-field span {
  color:
    rgba(
      226,
      232,
      240,
      0.9
    );

  font-size:
    0.72rem;

  font-weight:
    900;

  text-transform:
    uppercase;

  letter-spacing:
    0.045em;
}

.sales-smart-import-edit-field input,
.sales-smart-import-edit-field textarea {
  width:
    100%;

  min-height:
    46px;

  padding:
    12px 14px;

  box-sizing:
    border-box;

  border:
    1px solid
    rgba(
      148,
      184,
      226,
      0.22
    );

  border-radius:
    15px;

  outline:
    none;

  background:
    rgba(
      5,
      18,
      34,
      0.38
    );

  color:
    #f8fafc;

  font-family:
    inherit;

  font-size:
    0.82rem;

  box-shadow:
    inset 0 1px 0
    rgba(
      255,
      255,
      255,
      0.04
    );

  transition:
    border-color 0.16s ease,
    box-shadow 0.16s ease,
    background-color 0.16s ease;
}

.sales-smart-import-edit-field textarea {
  min-height:
    170px;

  resize:
    vertical;

  line-height:
    1.55;
}

.sales-smart-import-edit-field input::placeholder,
.sales-smart-import-edit-field textarea::placeholder {
  color:
    rgba(
      148,
      163,
      184,
      0.5
    );
}

.sales-smart-import-edit-field input:focus,
.sales-smart-import-edit-field textarea:focus {
  border-color:
    rgba(
      168,
      85,
      247,
      0.74
    );

  background:
    rgba(
      5,
      18,
      34,
      0.52
    );

  box-shadow:
    0 0 0 4px
    rgba(
      168,
      85,
      247,
      0.14
    ),
    inset 0 1px 0
    rgba(
      255,
      255,
      255,
      0.06
    );
}

.sales-smart-import-edit-warning {
  position:
    relative;

  z-index:
    1;
}

.sales-smart-import-finished-card {
  padding:
    24px;

  border-color:
    rgba(
      52,
      211,
      153,
      0.24
    ) !important;

  background:
    linear-gradient(
      145deg,
      rgba(
        20,
        83,
        45,
        0.42
      ),
      rgba(
        10,
        25,
        44,
        0.94
      )
    ) !important;
}

@media (
  max-width:
  760px
) {

  .sales-smart-import-edit-grid {
    grid-template-columns:
      1fr;
  }

  .sales-smart-import-edit-field-full {
    grid-column:
      auto;
  }

}