/** Shopify CDN: Minification failed

Line 49:18 Unexpected "{"
Line 49:19 Expected identifier but found "%"
Line 49:57 Unexpected "{"
Line 49:58 Expected identifier but found "%"

**/
          .custom-page-form {
              .row {
                  display: flex;
                  gap: 20px;
                  margin-bottom: 20px;
              }

              .col {
                  flex: 1;
              }

              label {
                  display: block;
                  font-size: 18px;
                  margin-bottom: 8px;
                  font-weight: 600;
                  font-family:'Philosopher', sans-serif;
                  color: #044b61;
              }

              input,
              select,
              textarea {
                  width: 100%;
                  padding: 14px;
                  border: 1px solid #ddd;
                  font-size: 14px;
              }

              textarea {
                  resize: vertical;
                  min-height: 120px;
              }

              input::placeholder,
              textarea::placeholder {
                  color: #999;
              }

            .upload-box {
                  {% comment %} border: 2px dashed #fff; {% endcomment %}
                  background: #044b61;
                  color: #fff;
                  padding: 20px;
                  display: flex;
                  align-items: center;
                  justify-content: space-between;
                  margin-bottom: 20px;
              }

              .upload-text {
                  font-size: 14px;
              }

              .upload-text small {
                  display: block;
                  font-size: 12px;
                  margin-top: 4px;
              }

              .upload-box input {
                  display: none;
              }

              .upload-btn {
                  background: #fff;
                  color:#044b61 ;
                  padding: 10px 18px;
                  border-radius: 3px;
                  cursor: pointer;
                  font-size: 13px;
              }

              .submit-btn {
                  display: block;
                  margin: 30px auto 0;
                  background: #044b61;
                  color: #fff;
                  padding: 14px 40px;
                  border: none;
                  border-radius: 3px;
                  font-size: 15px;
                  cursor: pointer;
                  font-family:'Philosopher', sans-serif;
              }

              .submit-btn:hover {
                  opacity: 0.9;
              }

              @media (max-width: 768px) {
                  .row {
                      flex-direction: column;
                  }

                  .upload-box {
                      flex-direction: column;
                      gap: 15px;
                      text-align: center;
                  }
                  label {
                      font-size: 14px;
                  }
              }

              .custom-select {
                  position: relative
              }

              .select-head {
                  display: flex;
                  justify-content: space-between;
                  align-items: center;
                  padding: 14px;
                  border: 1px solid #ddd;
                  border-radius: 4px;
                  background: #fafafa;
                  cursor: pointer
              }

              .select-body {
                  display: none;
                  position: absolute;
                  left: 0;
                  right: 0;
                  top: 100%;
                  background: #fff;
                  border: 1px solid #ddd;
                  border-radius: 6px;
                  margin-top: 6px;
                  z-index: 10;
                  padding: 15px
              }

              .custom-select.open .select-body {
                  display: block
              }

              .shape-grid {
                  display: grid;
                  grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
                  gap: 15px;
              }

              .shape-option {
              display:flex;
              flex-wrap: wrap;
              justify-content:center;
                text-align: center;
                width: 65px;
                cursor: pointer;
                       }

              .shape-option img {
                  width: 40px;
                  height: 40px;
                  display: block;
                  margin: 0 auto 6px
              }

              .shape-option span {
                  font-size: 13px
              }

              .shape-option:hover {
                  opacity: .7
              }

              i.fa-light.fa-angle-down.arrow {
                  margin-right: -12px;
              }

              .custom-select>div>span {
                  font-family:"Open Sans", sans-serif;
                  color: #000;
              }
                .metal-circle {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        font-size: 12px;
        font-weight: 600;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        border: 2px solid transparent;
        background: #eee;
        color: #333;
        margin-bottom:10px;
      }

      .shape-option span {
    font-size: 12px;
    line-height: 1.2;
    text-align: center;
    max-width: 90px;
  }

      /* Colors */
      .silver       { background: #eeeeee; }
      .white-gold   { background: #e6e6e6; }
      .yellow-gold  { background: #f2d27b; }
      .rose-gold    { background: #e7b197; }
      .platinum     { background: #d9d9d9; }


      .flex{
     display:flex;
    flex-wrap: wrap;
     justify-content:center;
    }
     .shape-svg {
          width: 60px;
          height: 60px;
          display: block;
          margin: 0 auto 6px;
          background:#fff;
        }
          }
    .success-dialog {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.success-box {
  background: #fff;
  padding: 30px;
  max-width: 420px;
  width: 90%;
  border-radius: 12px;
  text-align: center;
  box-shadow: 0 10px 40px rgba(0,0,0,0.2);
}

.success-box h3 {
  margin-bottom: 10px;
  font-size: 22px;
}

.success-box p {
  font-size: 15px;
  color: #555;
}

.success-box button {
  margin-top: 20px;
  padding: 10px 26px;
  border-radius: 6px;
  border: none;
  background: #044b61;
  color: #fff;
  cursor: pointer;
}
