/* NeNashi premium checkout — presentation only, checkout logic is untouched. */
.route-checkout-onepcheckout {
  --nn-orange: #f65f22;
  --nn-orange-hover: #dd4d12;
  --nn-ink: #171d27;
  --nn-muted: #677180;
  --nn-line: #e4e8ee;
  --nn-soft: #f7f8fa;
  --nn-white: #fff;
}

.route-checkout-onepcheckout body,
.route-checkout-onepcheckout .site-wrapper,
.route-checkout-onepcheckout #content {
  background: #fff !important;
}

.route-checkout-onepcheckout #content {
  max-width: 1240px;
  margin: 0 auto;
  padding-top: 22px;
  padding-bottom: 48px;
  color: var(--nn-ink);
}

.route-checkout-onepcheckout #content > h1,
.route-checkout-onepcheckout #content .page-title,
.route-checkout-onepcheckout #onepcheckout > h1 {
  margin: 0 0 24px;
  color: var(--nn-ink);
  font-size: clamp(25px, 3vw, 36px);
  font-weight: 800;
  line-height: 1.18;
  letter-spacing: -.025em;
}

.route-checkout-onepcheckout #onepcheckout {
  color: var(--nn-ink);
}

/* Old square panels become calm NeNashi cards. */
.route-checkout-onepcheckout #onepcheckout .panel,
.route-checkout-onepcheckout #onepcheckout .card,
.route-checkout-onepcheckout #onepcheckout fieldset,
.route-checkout-onepcheckout #onepcheckout .checkout-section,
.route-checkout-onepcheckout #onepcheckout .checkout-cart,
.route-checkout-onepcheckout #onepcheckout .checkout-payment,
.route-checkout-onepcheckout #onepcheckout .checkout-shipping,
.route-checkout-onepcheckout #onepcheckout .checkout-register {
  overflow: hidden;
  margin-bottom: 18px;
  border: 1px solid var(--nn-line) !important;
  border-radius: 16px !important;
  background: var(--nn-white) !important;
  box-shadow: 0 8px 28px rgba(17, 25, 39, .055) !important;
}

.route-checkout-onepcheckout #onepcheckout .panel-heading,
.route-checkout-onepcheckout #onepcheckout .card-header,
.route-checkout-onepcheckout #onepcheckout legend {
  min-height: 54px;
  margin: 0;
  padding: 16px 20px;
  border: 0 !important;
  border-bottom: 1px solid var(--nn-line) !important;
  border-radius: 0 !important;
  background: #fff !important;
  color: var(--nn-ink) !important;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.25;
}

.route-checkout-onepcheckout #onepcheckout .panel-body,
.route-checkout-onepcheckout #onepcheckout .card-body {
  padding: 20px !important;
  background: #fff !important;
}

/* Labels and fields. */
.route-checkout-onepcheckout #onepcheckout label,
.route-checkout-onepcheckout #onepcheckout .control-label {
  margin-bottom: 7px;
  color: #333b47;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
}

.route-checkout-onepcheckout #onepcheckout .form-group {
  margin-bottom: 16px;
}

.route-checkout-onepcheckout #onepcheckout .form-control,
.route-checkout-onepcheckout #onepcheckout input[type="text"],
.route-checkout-onepcheckout #onepcheckout input[type="tel"],
.route-checkout-onepcheckout #onepcheckout input[type="email"],
.route-checkout-onepcheckout #onepcheckout input[type="password"],
.route-checkout-onepcheckout #onepcheckout select,
.route-checkout-onepcheckout #onepcheckout textarea,
.route-checkout-onepcheckout #onepcheckout .select2-selection {
  min-height: 48px;
  border: 1px solid #dce1e7 !important;
  border-radius: 11px !important;
  background: #fff !important;
  color: var(--nn-ink) !important;
  box-shadow: none !important;
  font-size: 15px;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.route-checkout-onepcheckout #onepcheckout .form-control,
.route-checkout-onepcheckout #onepcheckout input[type="text"],
.route-checkout-onepcheckout #onepcheckout input[type="tel"],
.route-checkout-onepcheckout #onepcheckout input[type="email"],
.route-checkout-onepcheckout #onepcheckout input[type="password"],
.route-checkout-onepcheckout #onepcheckout select,
.route-checkout-onepcheckout #onepcheckout textarea {
  padding: 12px 14px;
}

.route-checkout-onepcheckout #onepcheckout textarea.form-control,
.route-checkout-onepcheckout #onepcheckout textarea {
  min-height: 104px;
  resize: vertical;
}

.route-checkout-onepcheckout #onepcheckout .form-control:focus,
.route-checkout-onepcheckout #onepcheckout input:focus,
.route-checkout-onepcheckout #onepcheckout select:focus,
.route-checkout-onepcheckout #onepcheckout textarea:focus,
.route-checkout-onepcheckout #onepcheckout .select2-container--focus .select2-selection,
.route-checkout-onepcheckout #onepcheckout .select2-container--open .select2-selection {
  outline: none !important;
  border-color: var(--nn-orange) !important;
  box-shadow: 0 0 0 3px rgba(246, 95, 34, .12) !important;
}

.route-checkout-onepcheckout #onepcheckout .select2-selection__rendered {
  padding: 9px 36px 9px 14px !important;
  line-height: 28px !important;
}

.route-checkout-onepcheckout #onepcheckout .select2-selection__arrow {
  height: 46px !important;
  right: 8px !important;
}

.route-checkout-onepcheckout #onepcheckout ::placeholder {
  color: #9aa1ab;
  opacity: 1;
}

/* Payment and delivery choices. */
.route-checkout-onepcheckout #onepcheckout .radio,
.route-checkout-onepcheckout #onepcheckout .checkbox {
  margin: 0 0 10px;
}

.route-checkout-onepcheckout #onepcheckout .radio > label,
.route-checkout-onepcheckout #onepcheckout .checkbox > label {
  position: relative;
  display: flex;
  align-items: flex-start;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 13px 14px 13px 43px;
  border: 1px solid var(--nn-line);
  border-radius: 12px;
  background: #fff;
  color: var(--nn-ink);
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.route-checkout-onepcheckout #onepcheckout .radio > label:hover,
.route-checkout-onepcheckout #onepcheckout .checkbox > label:hover {
  border-color: rgba(246, 95, 34, .5);
  background: #fff8f4;
}

.route-checkout-onepcheckout #onepcheckout input[type="radio"],
.route-checkout-onepcheckout #onepcheckout input[type="checkbox"] {
  accent-color: var(--nn-orange);
}

.route-checkout-onepcheckout #onepcheckout .radio > label input,
.route-checkout-onepcheckout #onepcheckout .checkbox > label input {
  position: absolute;
  top: 14px;
  left: 15px;
  width: 18px;
  height: 18px;
  margin: 0;
}

/* Product and totals tables — retain table semantics, remove dated grid look. */
.route-checkout-onepcheckout #onepcheckout .table-responsive {
  overflow: visible;
  margin: 0;
  border: 0;
}

.route-checkout-onepcheckout #onepcheckout table,
.route-checkout-onepcheckout #onepcheckout .table {
  width: 100%;
  margin: 0;
  border: 0 !important;
  border-collapse: separate;
  border-spacing: 0;
  background: #fff;
}

.route-checkout-onepcheckout #onepcheckout table thead,
.route-checkout-onepcheckout #onepcheckout .table thead {
  background: var(--nn-soft);
}

.route-checkout-onepcheckout #onepcheckout table th,
.route-checkout-onepcheckout #onepcheckout table td,
.route-checkout-onepcheckout #onepcheckout .table th,
.route-checkout-onepcheckout #onepcheckout .table td {
  padding: 14px 12px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--nn-line) !important;
  background: transparent !important;
  color: var(--nn-ink);
  vertical-align: middle !important;
}

.route-checkout-onepcheckout #onepcheckout table th,
.route-checkout-onepcheckout #onepcheckout .table th {
  color: var(--nn-muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.route-checkout-onepcheckout #onepcheckout table tbody tr:last-child td,
.route-checkout-onepcheckout #onepcheckout .table tbody tr:last-child td {
  border-bottom: 0 !important;
}

.route-checkout-onepcheckout #onepcheckout table img,
.route-checkout-onepcheckout #onepcheckout .table img {
  border: 1px solid #edf0f3 !important;
  border-radius: 10px;
  background: #fff;
}

.route-checkout-onepcheckout #onepcheckout .input-group .form-control {
  border-radius: 10px 0 0 10px !important;
}

.route-checkout-onepcheckout #onepcheckout .input-group-btn .btn {
  min-height: 48px;
  border-radius: 0 10px 10px 0 !important;
}

/* Buttons. */
.route-checkout-onepcheckout #onepcheckout .btn,
.route-checkout-onepcheckout #onepcheckout button,
.route-checkout-onepcheckout #onepcheckout input[type="button"],
.route-checkout-onepcheckout #onepcheckout input[type="submit"] {
  min-height: 46px;
  padding: 11px 18px;
  border-radius: 11px !important;
  font-weight: 800;
  box-shadow: none !important;
}

.route-checkout-onepcheckout #onepcheckout .btn-primary,
.route-checkout-onepcheckout #onepcheckout #button-register,
.route-checkout-onepcheckout #onepcheckout .button-confirm {
  border-color: var(--nn-orange) !important;
  background: var(--nn-orange) !important;
  color: #fff !important;
}

.route-checkout-onepcheckout #onepcheckout .btn-primary:hover,
.route-checkout-onepcheckout #onepcheckout #button-register:hover,
.route-checkout-onepcheckout #onepcheckout .button-confirm:hover {
  border-color: var(--nn-orange-hover) !important;
  background: var(--nn-orange-hover) !important;
}

.route-checkout-onepcheckout #onepcheckout #button-register,
.route-checkout-onepcheckout #onepcheckout .button-confirm {
  width: 100%;
  min-height: 54px;
  font-size: 16px;
}

.route-checkout-onepcheckout #onepcheckout .btn-default {
  border: 1px solid var(--nn-line) !important;
  background: #fff !important;
  color: #3a4350 !important;
}

.route-checkout-onepcheckout #onepcheckout .alert {
  border: 0;
  border-radius: 12px;
  box-shadow: none;
}

.route-checkout-onepcheckout #onepcheckout .text-danger,
.route-checkout-onepcheckout #onepcheckout .nenashi-field-error {
  margin-top: 6px;
  color: #c7352b !important;
  font-size: 12px;
}

@media (max-width: 767px) {
  .route-checkout-onepcheckout #content {
    width: 100%;
    padding: 18px 12px 88px;
  }

  .route-checkout-onepcheckout #content > h1,
  .route-checkout-onepcheckout #content .page-title,
  .route-checkout-onepcheckout #onepcheckout > h1 {
    margin-bottom: 18px;
    font-size: 25px;
  }

  .route-checkout-onepcheckout #onepcheckout .panel,
  .route-checkout-onepcheckout #onepcheckout .card,
  .route-checkout-onepcheckout #onepcheckout fieldset,
  .route-checkout-onepcheckout #onepcheckout .checkout-section {
    margin-bottom: 14px;
    border-radius: 14px !important;
    box-shadow: 0 5px 18px rgba(17, 25, 39, .045) !important;
  }

  .route-checkout-onepcheckout #onepcheckout .panel-heading,
  .route-checkout-onepcheckout #onepcheckout .card-header,
  .route-checkout-onepcheckout #onepcheckout legend {
    min-height: 50px;
    padding: 14px 15px;
    font-size: 16px;
  }

  .route-checkout-onepcheckout #onepcheckout .panel-body,
  .route-checkout-onepcheckout #onepcheckout .card-body {
    padding: 15px !important;
  }

  .route-checkout-onepcheckout #onepcheckout .form-control,
  .route-checkout-onepcheckout #onepcheckout input[type="text"],
  .route-checkout-onepcheckout #onepcheckout input[type="tel"],
  .route-checkout-onepcheckout #onepcheckout input[type="email"],
  .route-checkout-onepcheckout #onepcheckout input[type="password"],
  .route-checkout-onepcheckout #onepcheckout select {
    min-height: 50px;
    font-size: 16px; /* prevents iOS zoom */
  }

  .route-checkout-onepcheckout #onepcheckout .table-responsive {
    width: 100%;
    overflow-x: auto;
    border-radius: 0;
    -webkit-overflow-scrolling: touch;
  }

  .route-checkout-onepcheckout #onepcheckout table th,
  .route-checkout-onepcheckout #onepcheckout table td,
  .route-checkout-onepcheckout #onepcheckout .table th,
  .route-checkout-onepcheckout #onepcheckout .table td {
    padding: 12px 8px !important;
    font-size: 13px;
  }

  .route-checkout-onepcheckout #onepcheckout .radio > label,
  .route-checkout-onepcheckout #onepcheckout .checkbox > label {
    min-height: 50px;
  }
}